From 347ac311a072b89e99b890fe535d4ba2fdaab3a8 Mon Sep 17 00:00:00 2001
From: Brian Federle <brian.federle@citrix.com>
Date: Thu, 20 Dec 2012 11:55:44 -0800
Subject: [PATCH] UI Plugin: Use new format

Define plugins as namespaced objects instead of as function calls. This
is easier to implement and manage by the framework.

New format changes for defining plugins:

Now create 2 JS files in plugin folder:
  -config.js
  -[pluginName].js

plugins.js (listing) format:

  cloudStack.plugins = [
    'testPlugin'
  ];

config.js format:

  cloudStack.plugins.testPlugin.config = {
    title: 'Test Plugin',
    desc: 'Sample plugin'
  };

[pluginName].js format:

  cloudStack.plugins.testPlugin = function(plugin) {
    //
    // Plugin code goes here
    //
  };
---
 ui/index.jsp                          |  7 ++--
 ui/plugins/plugins.js                 |  7 ++--
 ui/plugins/testPlugin/config.js       |  6 +++
 ui/plugins/testPlugin/testPlugin.js   |  7 ++++
 ui/plugins/testPlugin1/testPlugin1.js | 12 ------
 ui/plugins/testPlugin2/testPlugin2.js | 12 ------
 ui/scripts/plugins.js                 | 55 +++++++++++----------------
 ui/scripts/ui-custom/plugins.js       |  6 +--
 8 files changed, 46 insertions(+), 66 deletions(-)
 create mode 100644 ui/plugins/testPlugin/config.js
 create mode 100644 ui/plugins/testPlugin/testPlugin.js
 delete mode 100644 ui/plugins/testPlugin1/testPlugin1.js
 delete mode 100644 ui/plugins/testPlugin2/testPlugin2.js

diff --git a/ui/index.jsp b/ui/index.jsp
index 7f78da63427..98c61618b4f 100644
--- a/ui/index.jsp
+++ b/ui/index.jsp
@@ -1674,11 +1674,12 @@ under the License.
     <script type="text/javascript" src="scripts/system.js?t=<%=now%>"></script>
     <script type="text/javascript" src="scripts/domains.js?t=<%=now%>"></script>
     <script type="text/javascript" src="scripts/docs.js?t=<%=now%>"></script>
-    <script type="text/javascript" src="scripts/ui-custom/plugins.js?t=<%=now%>"></script>
-    <script type="text/javascript" src="scripts/plugins.js?t=<%=now%>"></script>
 
-    <!-- Plugin listing -->
+    <script type="text/javascript" src="scripts/ui-custom/plugins.js?t=<%=now%>"></script>
+    
+    <!-- Plugins -->
     <script type="text/javascript" src="plugins/plugins.js?t=<%=now%>"></script>
+    <script type="text/javascript" src="scripts/plugins.js?t=<%=now%>"></script>
   </body>
 </html>
 <jsp:include page="dictionary.jsp" />
diff --git a/ui/plugins/plugins.js b/ui/plugins/plugins.js
index e86af594aa6..50b5e149896 100644
--- a/ui/plugins/plugins.js
+++ b/ui/plugins/plugins.js
@@ -1,6 +1,5 @@
 (function($, cloudStack) {
-  cloudStack.plugins.load([
-    'testPlugin1',
-    'testPlugin2'
-  ]);
+  cloudStack.plugins = [
+    'testPlugin'
+  ];
 }(jQuery, cloudStack));
diff --git a/ui/plugins/testPlugin/config.js b/ui/plugins/testPlugin/config.js
new file mode 100644
index 00000000000..7b653dbafa2
--- /dev/null
+++ b/ui/plugins/testPlugin/config.js
@@ -0,0 +1,6 @@
+(function (cloudStack) {
+  cloudStack.plugins.testPlugin.config = {
+    title: 'Test Plugin',
+    desc: 'Sample plugin'
+  };
+}(cloudStack));
\ No newline at end of file
diff --git a/ui/plugins/testPlugin/testPlugin.js b/ui/plugins/testPlugin/testPlugin.js
new file mode 100644
index 00000000000..453992442c2
--- /dev/null
+++ b/ui/plugins/testPlugin/testPlugin.js
@@ -0,0 +1,7 @@
+(function (cloudStack) {
+  cloudStack.plugins.testPlugin = function(plugin) {
+    //
+    // Plugin code goes here
+    //
+  };
+}(cloudStack));
\ No newline at end of file
diff --git a/ui/plugins/testPlugin1/testPlugin1.js b/ui/plugins/testPlugin1/testPlugin1.js
deleted file mode 100644
index 3c312233d1c..00000000000
--- a/ui/plugins/testPlugin1/testPlugin1.js
+++ /dev/null
@@ -1,12 +0,0 @@
-(function (cloudStack) {
-  var testPlugin1 = function(plugin) {
-    // Plugin code goes here
-  };
-
-  cloudStack.plugin({
-    id: 'testPlugin1',
-    title: 'Test Plugin 1',
-    desc: 'Sample plugin 1',
-    load: testPlugin1
-  });
-}(cloudStack));
\ No newline at end of file
diff --git a/ui/plugins/testPlugin2/testPlugin2.js b/ui/plugins/testPlugin2/testPlugin2.js
deleted file mode 100644
index 18f5a4792b6..00000000000
--- a/ui/plugins/testPlugin2/testPlugin2.js
+++ /dev/null
@@ -1,12 +0,0 @@
-(function (cloudStack) {
-  var testPlugin2 = function(plugin) {
-    // Plugin code goes here
-  };
-
-  cloudStack.plugin({
-    id: 'testPlugin2',
-    title: 'Test Plugin 2',
-    desc: 'Sample plugin 2',
-    load: testPlugin2
-  });
-}(cloudStack));
\ No newline at end of file
diff --git a/ui/scripts/plugins.js b/ui/scripts/plugins.js
index 201a97d4d18..250d507d9e1 100644
--- a/ui/scripts/plugins.js
+++ b/ui/scripts/plugins.js
@@ -1,35 +1,26 @@
-(function($, cloudStack) {
-  cloudStack.plugin = function(args) {
-    var id = args.id;
-    var title = args.title;
-    var desc = args.desc;
-
-    cloudStack.plugins.registry[id] = {
-      title: title,
-      desc: desc
-    };
-  };
-
-  cloudStack.plugins = {
-    loaded: [], // Lists loaded plugins by ID
-    registry: {}, // Stores metadata for plugins
-
-    // Loads/executes script
-    load: function(plugins) {
-      $(plugins).map(function(index, pluginID) {
-        var path = '/client/plugins/' + pluginID + '/' + pluginID + '.js';
-
-        require([path], function() {
-          cloudStack.plugins.loaded.push(pluginID);
-        });
-
-        return path;
-      });
-    }
-  };
-
+(function($, cloudStack, require) {
   cloudStack.sections.plugins = {
     title: 'Plugins',
     show: cloudStack.uiCustom.plugins
-  }
-}(jQuery, cloudStack));
+  };
+
+  // Load plugins
+  $(cloudStack.plugins).map(function(index, pluginID) {
+    var basePath = 'plugins/' + pluginID + '/';
+    var pluginJS = basePath + pluginID + '.js';
+    var configJS = basePath + 'config.js';
+
+    require([pluginJS], function() {
+      require([configJS]);
+
+      // Execute plugin
+      cloudStack.plugins[pluginID]({
+        ui: {
+          extend: function(obj) {
+            $.extend(true, cloudStack, obj);
+          }
+        }
+      });
+    });
+  });
+}(jQuery, cloudStack, require));
diff --git a/ui/scripts/ui-custom/plugins.js b/ui/scripts/ui-custom/plugins.js
index e81202df1d1..03bf55cf892 100644
--- a/ui/scripts/ui-custom/plugins.js
+++ b/ui/scripts/ui-custom/plugins.js
@@ -37,14 +37,14 @@
   };
 
   cloudStack.uiCustom.plugins = function() {
-    var plugins = cloudStack.plugins.loaded;
+    var plugins = cloudStack.plugins;
 
     return elems.pluginListing({
       plugins: $(plugins).map(function(index, pluginID) {
-        var plugin = cloudStack.plugins.registry[pluginID];
+        var plugin = cloudStack.plugins[pluginID].config;
 
         return {
-          id: plugin.id,
+          id: pluginID,
           title: plugin.title,
           desc: plugin.desc
         };