You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by bf...@apache.org on 2013/01/30 01:06:05 UTC

[50/50] [abbrv] git commit: UI plugin: Show custom icon

Updated Branches:
  refs/heads/ui-plugins 0f6eb2f53 -> 690dd66d3
  refs/heads/ui-quick-view-v2 efd7d9992 -> f90e705bb


UI plugin: Show custom icon

Show custom icon '<pluginName>/icon.png' on side nav bar (if plugin
added new section), and on plugin listing.


Project: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/commit/690dd66d
Tree: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/tree/690dd66d
Diff: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/diff/690dd66d

Branch: refs/heads/ui-plugins
Commit: 690dd66d3ed9e605e5f010578139f2971f61a178
Parents: 0f6eb2f
Author: Brian Federle <br...@citrix.com>
Authored: Tue Jan 29 16:05:40 2013 -0800
Committer: Brian Federle <br...@citrix.com>
Committed: Tue Jan 29 16:05:48 2013 -0800

----------------------------------------------------------------------
 ui/css/cloudstack3.css          |   34 ++++++++++++++++++++++++++++++----
 ui/plugins/testPlugin/icon.png  |  Bin 0 -> 7943 bytes
 ui/scripts/plugins.js           |    4 +++-
 ui/scripts/ui-custom/plugins.js |    8 ++++++--
 ui/scripts/ui/core.js           |    7 +++++++
 5 files changed, 46 insertions(+), 7 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/690dd66d/ui/css/cloudstack3.css
----------------------------------------------------------------------
diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css
index 0b954a6..a0ce15f 100644
--- a/ui/css/cloudstack3.css
+++ b/ui/css/cloudstack3.css
@@ -2336,6 +2336,28 @@ div.detail-group.actions td {
   top: 18px;
 }
 
+#navigation ul li.custom-icon span.icon {
+  display: block;
+  width: 50px;
+  height: 50px;
+  position: relative;
+  float: left;
+  margin-right: -47px;
+  background: none;
+}
+
+#navigation ul li.custom-icon span.icon img {
+  width: 50px;
+  height: 50px;
+  float: left;
+  /*+placement:shift -6px -17px;*/
+  position: relative;
+  left: -6px;
+  top: -17px;
+  position: absolute;
+  margin-right: -14px;
+}
+
 #navigation ul li.last.active,
 #navigation ul li.last:hover {
   height: 52px;
@@ -10988,12 +11010,16 @@ div.ui-dialog div.autoscaler div.field-group div.form-container form div.form-it
 }
 
 .plugins-listing ul li .icon {
-  background: #BDBDBD;
   display: block;
-  width: 40px;
-  height: 40px;
+  width: 50px;
+  height: 50px;
   float: left;
-  margin: 13px 13px 13px 11px;
+  margin: 8px 13px 13px 11px;
+}
+
+.plugins-listing ul li .icon img {
+  width: 100%;
+  height: 100%;
 }
 
 /*Action icons*/

http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/690dd66d/ui/plugins/testPlugin/icon.png
----------------------------------------------------------------------
diff --git a/ui/plugins/testPlugin/icon.png b/ui/plugins/testPlugin/icon.png
new file mode 100644
index 0000000..a313d35
Binary files /dev/null and b/ui/plugins/testPlugin/icon.png differ

http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/690dd66d/ui/scripts/plugins.js
----------------------------------------------------------------------
diff --git a/ui/scripts/plugins.js b/ui/scripts/plugins.js
index c1d0269..f40d0fa 100644
--- a/ui/scripts/plugins.js
+++ b/ui/scripts/plugins.js
@@ -13,7 +13,9 @@
 
   var pluginAPI = {
     addSection: function(section) {
-      cloudStack.sections[section.id] = section;
+      cloudStack.sections[section.id] = $.extend(section, {
+        customIcon: 'plugins/' + section.id + '/icon.png'
+      });
     },
     extend: function(obj) {
       $.extend(true, cloudStack, obj);

http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/690dd66d/ui/scripts/ui-custom/plugins.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/plugins.js b/ui/scripts/ui-custom/plugins.js
index ba61f74..4e6fbb2 100644
--- a/ui/scripts/ui-custom/plugins.js
+++ b/ui/scripts/ui-custom/plugins.js
@@ -4,10 +4,13 @@
       var id = args.id;
       var title = args.title;
       var desc = args.desc;
+      var iconURL = args.iconURL;
       var $pluginItem = $('<li>').addClass('plugin-item').addClass(id);
       var $title = $('<span>').addClass('title').html(title);
       var $desc = $('<span>').addClass('desc').html(desc);
-      var $icon = $('<span>').addClass('icon');
+      var $icon = $('<span>').addClass('icon').append(
+        $('<img>').attr({ src: iconURL })
+      );
 
       $pluginItem.append(
         $icon, $title, $desc
@@ -25,7 +28,8 @@
         var $plugin = elems.pluginItem({
           id: plugin.id,
           title: plugin.title,
-          desc: plugin.desc
+          desc: plugin.desc,
+          iconURL: 'plugins/' + plugin.id + '/icon.png'
         });
         var $browser = $('#browser .container');
 

http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/690dd66d/ui/scripts/ui/core.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/core.js b/ui/scripts/ui/core.js
index 30cd75b..b2be379 100644
--- a/ui/scripts/ui/core.js
+++ b/ui/scripts/ui/core.js
@@ -45,6 +45,7 @@
         }
       }
 
+      
       var $li = $('<li>')
             .addClass('navigation-item')
             .addClass(sectionID)
@@ -52,6 +53,12 @@
             .append($('<span>').html(_l(args.title)))
             .data('cloudStack-section-id', sectionID);
 
+      if (args.customIcon) {
+        $li.addClass('custom-icon').find('span.icon').html('').append(
+          $('<img>').attr({ src: args.customIcon })
+        );
+      }
+
       $li.appendTo($navList);
 
       return true;