PVW-2: Creating form modals mechanism

Packages/ohif-core/client/ui/bounded/bounded.js

@@ -158,4 +158,4 @@ class Bounded {
 
 }
 
-OHIF.Bounded = Bounded;
+OHIF.ui.Bounded = Bounded;

Packages/ohif-core/client/ui/dialog/form.js

@@ -0,0 +1,38 @@
+import { Template } from 'meteor/templating';
+import { Blaze } from 'meteor/blaze';
+import { _ } from 'meteor/underscore';
+import { OHIF } from 'meteor/ohif:core';
+
+OHIF.ui.showFormDialog = (templateName, dialogData) => {
+    // Check if the given template exists
+    const template = Template[templateName];
+    if (!template) {
+        throw {
+            name: 'TEMPLATE_NOT_FOUND',
+            message: `Template ${templateName} not found.`
+        };
+    }
+
+    // Create a new promise to control the modal and store its resolve and reject callbacks
+    let promiseResolve;
+    let promiseReject;
+    const promise = new Promise((resolve, reject) => {
+        promiseResolve = resolve;
+        promiseReject = reject;
+    });
+
+    // Render the dialog with the given template passing the promise object and callbacks
+    const templateData = _.extend({}, dialogData, {
+        promise,
+        promiseResolve,
+        promiseReject
+    });
+    const view = Blaze.renderWithData(template, templateData, document.body);
+
+    // Destroy the created dialog view when the promise is either resolved or rejected
+    const dismissModal = () => Blaze.remove(view);
+    promise.then(dismissModal).catch(dismissModal);
+
+    // Return the promise to allow callbacks stacking from outside
+    return promise;
+};

Packages/ohif-core/client/ui/draggable/draggable.js

@@ -1,6 +1,8 @@
+import { OHIF } from 'meteor/ohif:core';
+
 // Allow attaching to jQuery selectors
-$.fn.draggable = function(options) {
-    makeDraggable(this, options);
+$.fn.draggable = function() {
+    OHIF.ui.makeDraggable(this);
     return this;
 };
 
@@ -11,7 +13,7 @@ $.fn.draggable = function(options) {
  *
  * @param element
  */
-makeDraggable = function(element, options) {
+OHIF.ui.makeDraggable = function(element) {
     var container = $(window);
     var diffX,
         diffY,

Packages/ohif-core/client/ui/index.js

@@ -1,3 +1,4 @@
 import './bounded/bounded.js';
+import './dialog/form.js';
 import './draggable/draggable.js';
 import './resizable/resizable.js';

Packages/ohif-core/client/ui/resizable/resizable.js

@@ -1,3 +1,5 @@
+import { OHIF } from 'meteor/ohif:core';
+
 // Allow attaching to jQuery selectors
 $.fn.resizable = function(options) {
     _.each(this, element => {
@@ -174,3 +176,5 @@ class Resizable {
     }
 
 }
+
+OHIF.ui.Resizable = Resizable;