Batch manager + better component sizing

.gitmodules

@@ -7,3 +7,6 @@
 [submodule "public/extensions/extensions-manager"]
 	path = public/extensions/extensions-manager
 	url = https://github.com/sn-extensions/extensions-manager.git
+[submodule "public/extensions/batch-manager"]
+	path = public/extensions/batch-manager
+	url = https://github.com/sn-extensions/batch-manager.git

app/assets/javascripts/app/services/componentManager.js

@@ -827,28 +827,34 @@ class ComponentManager {
   }
 
   handleSetSizeEvent(component, data) {
+
     var setSize = function(element, size) {
       var widthString = typeof size.width === 'string' ? size.width : `${data.width}px`;
       var heightString = typeof size.height === 'string' ? size.height : `${data.height}px`;
-      element.setAttribute("style", `width:${widthString}; height:${heightString}; `);
+      element.setAttribute("style", `width:${widthString}; height:${heightString};`);
     }
 
-    if(data.type === "content") {
+    if(component.area == "rooms" || component.area == "modal") {
-      var iframe = this.iframeForComponent(component);
+      var selector = component.area == "rooms" ? "inner" : "outer";
-      var width = data.width;
+      var content = document.getElementById(`component-content-${selector}-${component.uuid}`);
-      var height = data.height;
+      if(content) {
-      iframe.width  = width;
+        setSize(content, data);
-      iframe.height = height;
+      }
-
-      setSize(iframe, data);
     } else {
-      var container = document.getElementById("component-" + component.uuid);
+      if(data.type === "content" ) {
-      if(container) {
+        var iframe = this.iframeForComponent(component);
-        // in the case of Modals, sometimes they may be "active" because they were so in another session,
+        var width = data.width;
-        // but no longer actually visible. So check to make sure the container exists
+        var height = data.height;
-        setSize(container, data);
+        iframe.width  = width;
+        iframe.height = height;
+
+        var content = document.getElementById(`component-iframe-${component.uuid}`);
+        if(content) {
+          setSize(content, data);
+        }
       }
     }
+
   }
 
 

app/assets/javascripts/app/services/nativeExtManager.js

@@ -7,10 +7,12 @@ class NativeExtManager {
     this.syncManager = syncManager;
     this.singletonManager = singletonManager;
 
-    this.extensionsIdentifier = "org.standardnotes.extensions-manager";
+    this.extensionsManagerIdentifier = "org.standardnotes.extensions-manager";
+    this.batchManagerIdentifier = "org.standardnotes.batch-manager";
     this.systemExtensions = [];
 
     this.resolveExtensionsManager();
+    this.resolveBatchManager();
   }
 
   isSystemExtension(extension) {
@@ -19,7 +21,7 @@ class NativeExtManager {
 
   resolveExtensionsManager() {
 
-    this.singletonManager.registerSingleton({content_type: "SN|Component", package_info: {identifier: this.extensionsIdentifier}}, (resolvedSingleton) => {
+    this.singletonManager.registerSingleton({content_type: "SN|Component", package_info: {identifier: this.extensionsManagerIdentifier}}, (resolvedSingleton) => {
       // Resolved Singleton
       this.systemExtensions.push(resolvedSingleton.uuid);
 
@@ -51,7 +53,7 @@ class NativeExtManager {
 
       let packageInfo = {
         name: "Extensions",
-        identifier: this.extensionsIdentifier
+        identifier: this.extensionsManagerIdentifier
       }
 
       var item = {
@@ -87,6 +89,75 @@ class NativeExtManager {
     });
   }
 
+  resolveBatchManager() {
+
+    this.singletonManager.registerSingleton({content_type: "SN|Component", package_info: {identifier: this.batchManagerIdentifier}}, (resolvedSingleton) => {
+      // Resolved Singleton
+      this.systemExtensions.push(resolvedSingleton.uuid);
+
+      var needsSync = false;
+      if(isDesktopApplication()) {
+        if(!resolvedSingleton.local_url) {
+          resolvedSingleton.local_url = window._batch_manager_location;
+          needsSync = true;
+        }
+      } else {
+        if(!resolvedSingleton.hosted_url) {
+          resolvedSingleton.hosted_url = window._batch_manager_location;
+          needsSync = true;
+        }
+      }
+
+      if(needsSync) {
+        resolvedSingleton.setDirty(true);
+        this.syncManager.sync("resolveExtensionsManager");
+      }
+    }, (valueCallback) => {
+      // Safe to create. Create and return object.
+      let url = window._batch_manager_location;
+      console.log("Installing Batch Manager from URL", url);
+      if(!url) {
+        console.error("window._batch_manager_location must be set.");
+        return;
+      }
+
+      let packageInfo = {
+        name: "Batch Manager",
+        identifier: this.batchManagerIdentifier
+      }
+
+      var item = {
+        content_type: "SN|Component",
+        content: {
+          name: packageInfo.name,
+          area: "modal",
+          package_info: packageInfo,
+          permissions: [
+            {
+              name: "stream-items",
+              content_types: ["Note", "Tag", "SN|Component", "SN|Theme", "SF|Extension", "Extension", "SF|MFA", "SN|Editor"]
+            }
+          ]
+        }
+      }
+
+      if(isDesktopApplication()) {
+        item.content.local_url = window._batch_manager_location;
+      } else {
+        item.content.hosted_url = window._batch_manager_location;
+      }
+
+      var component = this.modelManager.createItem(item);
+      this.modelManager.addItem(component);
+
+      component.setDirty(true);
+      this.syncManager.sync("resolveBatchManager createNew");
+
+      this.systemExtensions.push(component.uuid);
+
+      valueCallback(component);
+    });
+  }
 }
 
 angular.module('app').service('nativeExtManager', NativeExtManager);

app/assets/templates/directives/component-modal.html.haml

@@ -1,8 +1,8 @@
 .background{"ng-click" => "dismiss()"}
 
-.content
+.content{"ng-attr-id" => "component-content-outer-{{component.uuid}}"}
   .sn-component
-    .panel{"ng-attr-id" => "component-{{component.uuid}}"}
+    .panel{"ng-attr-id" => "component-content-inner-{{component.uuid}}"}
       .header
         %h1.title
           {{component.name}}

app/assets/templates/directives/component-view.html.haml

@@ -63,7 +63,7 @@
 
 
 %iframe{"ng-if" => "component && componentValid",
-  "ng-attr-id" => "component-{{component.uuid}}",
+  "ng-attr-id" => "component-iframe-{{component.uuid}}",
   "ng-src" => "{{getUrl() | trusted}}", "frameBorder" => "0",
   "sandbox" => "allow-scripts allow-top-navigation-by-user-activation allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-modals allow-forms",
   "data-component-id" => "{{component.uuid}}"}

app/views/application/app.html.erb

@@ -31,6 +31,7 @@
     <script>
       window._default_sf_server = "<%= ENV['SF_DEFAULT_SERVER'] %>";
       window._extensions_manager_location = "<%= ENV['EXTENSIONS_MANAGER_LOCATION'] %>";
+      window._batch_manager_location = "<%= ENV['BATCH_MANAGER_LOCATION'] %>";
     </script>
 
     <% if Rails.env.development? %>