Add UI 'module' API Add a variant to a plugin, called a 'module.' It is designed for features that are build-in to the standard UI (i.e., not installed dynamically), but can still utilize the modular nature of UI plugins. It works exactly the same way as a plugin, except:
-Modules are added to modules/ folder -Modules are registered in modules/modules.js -No config.js (no need for metadata, since they are built-in features) - /ui/modules/ folder will not be touched by the build system, so any modules are committed directly to the ui/ folder. In other words, modules are not installed automatically. Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/6babaf96 Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/6babaf96 Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/6babaf96 Branch: refs/heads/marvin_refactor Commit: 6babaf96163f18453eeb7de69857ec62f01d88b3 Parents: 9573f51 Author: Brian Federle <[email protected]> Authored: Thu Apr 18 12:34:59 2013 -0700 Committer: Brian Federle <[email protected]> Committed: Thu Apr 18 12:52:55 2013 -0700 ---------------------------------------------------------------------- ui/index.jsp | 3 +- ui/modules/modules.js | 20 +++++++++++ ui/scripts/plugins.js | 78 +++++++++++++++++++++++++++++++------------- 3 files changed, 77 insertions(+), 24 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/6babaf96/ui/index.jsp ---------------------------------------------------------------------- diff --git a/ui/index.jsp b/ui/index.jsp index 550661e..5e5a7f2 100644 --- a/ui/index.jsp +++ b/ui/index.jsp @@ -1680,9 +1680,10 @@ under the License. <script type="text/javascript" src="scripts/docs.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/vm_snapshots.js?t=<%=now%>"></script> - <!-- Plugins --> + <!-- Plugin/module API --> <script type="text/javascript" src="scripts/ui-custom/pluginListing.js?t=<%=now%>"></script> <script type="text/javascript" src="plugins/plugins.js?t=<%=now%>"></script> + <script type="text/javascript" src="modules/modules.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/plugins.js?t=<%=now%>"></script> </body> </html> http://git-wip-us.apache.org/repos/asf/cloudstack/blob/6babaf96/ui/modules/modules.js ---------------------------------------------------------------------- diff --git a/ui/modules/modules.js b/ui/modules/modules.js new file mode 100644 index 0000000..490749f --- /dev/null +++ b/ui/modules/modules.js @@ -0,0 +1,20 @@ +// Licensed to the Apache Software Foundation (ASF) under one +// or more contributor license agreements. See the NOTICE file +// distributed with this work for additional information +// regarding copyright ownership. The ASF licenses this file +// to you under the Apache License, Version 2.0 (the +// "License"); you may not use this file except in compliance +// with the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, +// software distributed under the License is distributed on an +// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +// KIND, either express or implied. See the License for the +// specific language governing permissions and limitations +// under the License. +(function($, cloudStack) { + cloudStack.modules = [ + ]; +}(jQuery, cloudStack)); http://git-wip-us.apache.org/repos/asf/cloudstack/blob/6babaf96/ui/scripts/plugins.js ---------------------------------------------------------------------- diff --git a/ui/scripts/plugins.js b/ui/scripts/plugins.js index d3e0705..9d1991c 100644 --- a/ui/scripts/plugins.js +++ b/ui/scripts/plugins.js @@ -15,6 +15,8 @@ // specific language governing permissions and limitations // under the License. (function($, cloudStack, require) { + if (!cloudStack.pluginAPI) cloudStack.pluginAPI = {}; + var loadCSS = function(path) { var $link = $('<link>'); @@ -27,27 +29,29 @@ $('head').append($link); }; - var pluginAPI = { - pollAsyncJob: pollAsyncJobResult, - apiCall: function(command, args) { - $.ajax({ - url: createURL(command), - data: args.data, - success: args.success, - error: function(json) { - args.error(parseXMLHttpResponse(json)); - } - }) - }, - addSection: function(section) { - cloudStack.sections[section.id] = $.extend(section, { - customIcon: 'plugins/' + section.id + '/icon.png' - }); - }, - extend: function(obj) { - $.extend(true, cloudStack, obj); + $.extend(cloudStack.pluginAPI, { + ui: { + pollAsyncJob: pollAsyncJobResult, + apiCall: function(command, args) { + $.ajax({ + url: createURL(command), + data: args.data, + success: args.success, + error: function(json) { + args.error(parseXMLHttpResponse(json)); + } + }) + }, + addSection: function(section) { + cloudStack.sections[section.id] = $.extend(section, { + customIcon: 'plugins/' + section.id + '/icon.png' + }); + }, + extend: function(obj) { + $.extend(true, cloudStack, obj); + } } - }; + }); cloudStack.sections.plugins = { title: 'label.plugins', @@ -66,9 +70,37 @@ loadCSS(pluginCSS); // Execute plugin - cloudStack.plugins[pluginID]({ - ui: pluginAPI - }); + cloudStack.plugins[pluginID]( + $.extend(true, {}, cloudStack.pluginAPI, { + pluginAPI: { + extend: function(api) { + cloudStack.pluginAPI[pluginID] = api; + } + } + }) + ); + }); + }); + + // Load modules + $(cloudStack.modules).map(function(index, moduleID) { + var basePath = 'modules/' + moduleID + '/'; + var moduleJS = basePath + moduleID + '.js'; + var moduleCSS = basePath + moduleID + '.css'; + + require([moduleJS], function() { + loadCSS(moduleCSS); + + // Execute module + cloudStack.modules[moduleID]( + $.extend(true, {}, cloudStack.pluginAPI, { + pluginAPI: { + extend: function(api) { + cloudStack.pluginAPI[moduleID] = api; + } + } + }) + ); }); }); }(jQuery, cloudStack, require));
