Merge lp:~rharding/juju-gui/inspector-details-css into lp:juju-gui/experimental

[Richard Harding]

TBD

Unmerged revisions

863. By Richard Harding on 2013-07-18

Update the close to stay on top of content in the left-breakout

862. By Richard Harding on 2013-07-18

Working on getting destory into the picture

=== modified file 'app/subapps/browser/views/charm.js'
--- app/subapps/browser/views/charm.js	2013-07-19 20:22:52 +0000
+++ app/subapps/browser/views/charm.js	2013-07-22 18:05:38 +0000
@@ -79,6 +79,7 @@
      *
      */
     _addCharmEnvironment: function(ev) {
+      debugger;
       ev.halt();
       var charm,
           browserCharm = this.get('charm'),
@@ -266,6 +267,7 @@
 
      */
     _handleBack: function(ev) {
+      debugger;
       ev.halt();
       this.fire('viewNavigate', {
         change: {
@@ -282,6 +284,7 @@
 
      */
     _handleCharmSelection: function(ev) {
+      debugger;
       ev.halt();
       var charm = ev.currentTarget;
       var charmID = charm.getData('charmid');
@@ -530,6 +533,7 @@
        @param {Y.EventFacade} e The click event.
      */
     _openShareLink: function(e) {
+      debugger;
       e.halt();
       var shareLink = e.currentTarget.get('href');
       window.open(shareLink, 'share_window');
@@ -544,6 +548,7 @@
      *
      */
     _toggleLog: function(ev) {
+      debugger;
       ev.halt();
       var container = this.get('container'),
           target = ev.currentTarget,

=== modified file 'app/views/viewlet-manager.js'
--- app/views/viewlet-manager.js	2013-07-22 14:04:31 +0000
+++ app/views/viewlet-manager.js	2013-07-22 18:05:38 +0000
@@ -139,6 +139,14 @@
     conflict: function(node) {},
 
     /**
+      A destroy callback for removing a viewlet.
+
+      @method destroy
+
+    */
+    destroy: function() {},
+
+    /**
       Called by the databinding engine when fields drop out of sync with
       the supplied model.
 
@@ -286,8 +294,13 @@
     },
 
     /**
+<<<<<<< TREE
       Renders the viewlets into the viewlet manager. Viewlets with a logical
       slot name defined are not rendered by default and require that showViewlet
+=======
+      Renders the viewlets into the view container. Viewlets with a logical
+      slot name defined are not rendered by default and require that showViewlet
+>>>>>>> MERGE-SOURCE
       be called for them to render. Slots are typically filled through event
       callback interactions (for example in a click handler).
 
@@ -421,6 +434,8 @@
     hideSlot: function(e) {
       var existing = this._slots[e.currentTarget.getData('slot')];
       if (existing) {
+        // Run a destroy on the viewlet.
+        existing.destroy();
         // unbind the databinding
         existing.remove();
         // remove the element from the DOM
@@ -543,6 +558,12 @@
       @method destructor
     */
     destructor: function() {
+      Y.Object.each(this.viewlets, function(viewlet, name) {
+        if (!viewlet.slot) {
+          viewlet.destroy();
+        }
+      });
+
       this._events.forEach(function(event) {
         event.detach();
       });

=== modified file 'app/views/viewlets/charm-details.js'
--- app/views/viewlets/charm-details.js	2013-07-22 15:06:11 +0000
+++ app/views/viewlets/charm-details.js	2013-07-22 18:05:38 +0000
@@ -29,6 +29,10 @@
     name: 'charmDetails',
     slot: 'left-hand-panel',
     templateWrapper: templates['left-breakout-panel'],
+    destroy: function() {
+      Y.one('.left-breakout').removeClass('with-charm');
+      this.charmView.destroy();
+    },
     /**
       Render the viewlet.
 
@@ -40,23 +44,30 @@
     render: function(charm, viewletManagerAttrs) {
       var store = viewletManagerAttrs.store;
       store.charm(charm.get('storeId'), {
+<<<<<<< TREE
         'success': function(data, storeCharm) {
           var charmView = new browserViews.BrowserCharmView({
+=======
+        'success': function(data) {
+          var storeCharm = new models.BrowserCharm(data.charm);
+          Y.one('.left-breakout').addClass('with-charm');
+          this.charmView = new browserViews.BrowserCharmView({
+>>>>>>> MERGE-SOURCE
             charm: storeCharm,
             forInspector: true,
             renderTo: this.container.one('.content'),
             store: store
           });
-          charmView.render();
+          this.charmView.render();
         },
         'failure': function(data) {
-          var charmView = new browserViews.BrowserCharmView({
+          this.charmView = new browserViews.BrowserCharmView({
             charm: charm,
             forInspector: true,
             renderTo: this.container.one('.content'),
             store: store
           });
-          charmView.render();
+          this.charmView.render();
         }
       }, this, viewletManagerAttrs.db.browserCharms);
       return this.templateWrapper({ initial: 'Loading...'});

=== modified file 'lib/views/browser/charm-full.less'
--- lib/views/browser/charm-full.less	2013-07-18 20:08:23 +0000
+++ lib/views/browser/charm-full.less	2013-07-22 18:05:38 +0000
@@ -1,4 +1,5 @@
-#subapp-browser .charm {
+#subapp-browser .charm,
+.charm {
     display: table;
     width: 100%;
 
@@ -107,7 +108,7 @@
             bottom: 30px;
             right: 30px;
 
-            .add {
+            a.add {
                 // Using a variable here because LESS strips commas in mixin args.
                 @box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.3);
                 .create-box-shadow(@box-shadow);
@@ -299,7 +300,7 @@
         padding: 17px 70px 16px 16px;
 
         a {
-            padding-right: 5px; 
+            padding-right: 5px;
         }
     }
 }
@@ -335,7 +336,8 @@
             padding: 0 20px 20px 20px;
             border-bottom: 1px solid @bws-border;
 
-            .add {
+            a.add {
+                color: #fff;
                 display: inline-block;
             }
         }
@@ -351,7 +353,7 @@
             }
             span {
                 color: @bws-text;
-                text-decoration: underline;    
+                text-decoration: underline;
             }
         }
     }
@@ -390,3 +392,7 @@
         padding-top: 30px;
     }
 }
+
+.yui3-juju-inspector .left-breakout.with-charm {
+    width: 750px;
+}

=== modified file 'lib/views/juju-inspector.less'
--- lib/views/juju-inspector.less	2013-07-22 13:36:45 +0000
+++ lib/views/juju-inspector.less	2013-07-22 18:05:38 +0000
@@ -109,6 +109,7 @@
         line-height: 18px;
         cursor: pointer;
         color: @inspector-background-color;
+        z-index: 10;
     }
 
     .header-slot {