phosphide - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

lib/appshell/plugin.js

@@ -16,2 +16,3 @@ /*-----------------------------------------------------------------------------
 var phosphor_boxpanel_1 = require('phosphor-boxpanel');
+var phosphor_dockpanel_1 = require('phosphor-dockpanel');
 var phosphor_splitpanel_1 = require('phosphor-splitpanel');
@@ -53,4 +54,4 @@ var phosphor_stackedpanel_1 = require('phosphor-stackedpanel');
         var topPanel = new phosphor_widget_1.Panel();
-        var dockPanel = new phosphor_widget_1.Widget();
         var hboxPanel = new phosphor_boxpanel_1.BoxPanel();
+        var dockPanel = new phosphor_dockpanel_1.DockPanel();
         var hsplitPanel = new phosphor_splitpanel_1.SplitPanel();
@@ -62,2 +63,3 @@ var leftHandler = new SideBarHandler();
         this._hboxPanel = hboxPanel;
+        this._dockPanel = dockPanel;
         this._hsplitPanel = hsplitPanel;
@@ -72,3 +74,3 @@ this._leftHandler = leftHandler;
         rightHandler.stackedPanel.id = 'p-right-stack';
-        //this._dockPanel.id = 'p-main-dock-panel';
+        dockPanel.id = 'p-main-dock-panel';
         hsplitPanel.orientation = phosphor_splitpanel_1.SplitPanel.Horizontal;
@@ -137,2 +139,3 @@ hsplitPanel.spacing = 1; // TODO make this configurable?
         // TODO
+        this._dockPanel.insertTabAfter(widget);
     };
@@ -139,0 +142,0 @@ /**

lib/appshell/sidebar.d.ts

@@ -77,3 +77,3 @@ import { Message } from 'phosphor-messaging';
      *
-     * @param title - The title object to insert into to the panel.
+     * @param title - The title object to insert into to the side bar.
      *
@@ -124,3 +124,4 @@ * #### Notes
     private _onTitleChanged();
+    private _dirty;
     private _titles;
 }

lib/appshell/sidebar.js

@@ -29,13 +29,13 @@ /*-----------------------------------------------------------------------------
 /**
- * The class name added to SideBarButton instances.
+ * The class name added to side bar button nodes.
  */
-var BUTTON_CLASS = 'p-SideBarButton';
+var BUTTON_CLASS = 'p-SideBar-button';
 /**
- * The class name added to a button text node.
+ * The class name added to a side bar button text node.
  */
-var TEXT_CLASS = 'p-SideBarButton-text';
+var TEXT_CLASS = 'p-SideBar-button-text';
 /**
- * The class name added to a button icon node.
+ * The class name added to a side bar button icon node.
  */
-var ICON_CLASS = 'p-SideBarButton-icon';
+var ICON_CLASS = 'p-SideBar-button-icon';
 /**
@@ -55,2 +55,3 @@ * The class name added to the current side bar button.
         _super.call(this);
+        this._dirty = false;
         this._titles = [];
@@ -161,3 +162,3 @@ this.addClass(SIDE_BAR_CLASS);
      *
-     * @param title - The title object to insert into to the panel.
+     * @param title - The title object to insert into to the side bar.
      *
@@ -182,2 +183,3 @@ * #### Notes
         }
+        this._dirty = true;
         this.update();
@@ -194,5 +196,2 @@ };
     SideBar.prototype.removeTitle = function (title) {
-        if (this.currentTitle === title) {
-            this.currentTitle = null;
-        }
         var i = arrays.remove(this._titles, title);
@@ -203,2 +202,5 @@ if (i === -1) {
         title.changed.disconnect(this._onTitleChanged, this);
+        if (this.currentTitle === title)
+            this.currentTitle = null;
+        this._dirty = true;
         this.update();
@@ -237,22 +239,9 @@ };
     SideBar.prototype.onUpdateRequest = function (msg) {
-        // Fetch common variables.
-        var titles = this._titles;
-        var content = this.contentNode;
-        var children = content.children;
-        // Remove any excess button nodes.
-        while (children.length > titles.length) {
-            content.removeChild(content.lastChild);
+        if (this._dirty) {
+            this._dirty = false;
+            SideBarPrivate.updateButtons(this);
         }
-        // Add any missing button nodes.
-        while (children.length < titles.length) {
-            content.appendChild(SideBarPrivate.createButtonNode());
+        else {
+            SideBarPrivate.updateCurrent(this);
         }
-        // Update the button nodes to match the titles.
-        var current = this.currentTitle;
-        for (var i = 0, n = titles.length; i < n; ++i) {
-            var node = children[i];
-            SideBarPrivate.updateButtonNode(node, titles[i]);
-            if (titles[i] === current)
-                node.classList.add(CURRENT_CLASS);
-        }
     };
@@ -288,2 +277,3 @@ /**
     SideBar.prototype._onTitleChanged = function () {
+        this._dirty = true;
         this.update();
@@ -314,2 +304,70 @@ };
     /**
+     * Update the side bar buttons to match the current titles.
+     *
+     * This is a full update which also updates the currrent state.
+     */
+    function updateButtons(owner) {
+        var count = owner.titleCount();
+        var content = owner.contentNode;
+        var children = content.children;
+        while (children.length > count) {
+            content.removeChild(content.lastChild);
+        }
+        while (children.length < count) {
+            content.appendChild(createButtonNode());
+        }
+        for (var i = 0; i < count; ++i) {
+            var node = children[i];
+            updateButtonNode(node, owner.titleAt(i));
+        }
+        updateCurrent(owner);
+    }
+    SideBarPrivate.updateButtons = updateButtons;
+    /**
+     * Update the current state of the buttons to match the side bar.
+     *
+     * This is a partial update which only updates the current button
+     * class. It assumes the button count is the same as the title count.
+     */
+    function updateCurrent(owner) {
+        var count = owner.titleCount();
+        var content = owner.contentNode;
+        var children = content.children;
+        var current = owner.currentTitle;
+        for (var i = 0; i < count; ++i) {
+            var node = children[i];
+            if (owner.titleAt(i) === current) {
+                node.classList.add(CURRENT_CLASS);
+            }
+            else {
+                node.classList.remove(CURRENT_CLASS);
+            }
+        }
+    }
+    SideBarPrivate.updateCurrent = updateCurrent;
+    /**
+     * Get the index of the button node at a client position, or `-1`.
+     */
+    function hitTestButtons(owner, x, y) {
+        var nodes = owner.contentNode.children;
+        for (var i = 0, n = nodes.length; i < n; ++i) {
+            if (phosphor_domutil_1.hitTest(nodes[i], x, y))
+                return i;
+        }
+        return -1;
+    }
+    SideBarPrivate.hitTestButtons = hitTestButtons;
+    /**
+     * The coerce handler for the `currentTitle` property.
+     */
+    function coerceCurrentTitle(owner, value) {
+        return (value && owner.titleIndex(value) !== -1) ? value : null;
+    }
+    /**
+     * The change handler for the `currentTitle` property.
+     */
+    function onCurrentTitleChanged(owner) {
+        owner.update();
+    }
+    /**
      * Create an uninitialized DOM node for a side bar button.
@@ -326,3 +384,2 @@ */
     }
-    SideBarPrivate.createButtonNode = createButtonNode;
     /**
@@ -348,35 +405,2 @@ * Update a button node to reflect the state of a title.
     }
-    SideBarPrivate.updateButtonNode = updateButtonNode;
-    /**
-     * Get the index of the button node at a client position, or `-1`.
-     */
-    function hitTestButtons(owner, x, y) {
-        var nodes = owner.contentNode.children;
-        for (var i = 0, n = nodes.length; i < n; ++i) {
-            if (phosphor_domutil_1.hitTest(nodes[i], x, y))
-                return i;
-        }
-        return -1;
-    }
-    SideBarPrivate.hitTestButtons = hitTestButtons;
-    /**
-     * The coerce handler for the `currentTitle` property.
-     */
-    function coerceCurrentTitle(owner, value) {
-        return owner.titleIndex(value) !== -1 ? value : null;
-    }
-    /**
-     * The change handler for the `currentTitle` property.
-     */
-    function onCurrentTitleChanged(owner, old, val) {
-        var children = owner.contentNode.children;
-        var oldIndex = owner.titleIndex(old);
-        var newIndex = owner.titleIndex(val);
-        var oldNode = children[oldIndex];
-        var newNode = children[newIndex];
-        if (oldNode)
-            oldNode.classList.remove(CURRENT_CLASS);
-        if (newNode)
-            newNode.classList.add(CURRENT_CLASS);
-    }
 })(SideBarPrivate || (SideBarPrivate = {}));

package.json

 {
   "name": "phosphide",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Slightly opinionated scaffolding for building plugin-based IDE-style applications.",
@@ -11,2 +11,3 @@ "main": "lib/index.js",
     "phosphor-di": "^0.9.0",
+    "phosphor-dockpanel": "^0.9.4",
     "phosphor-domutil": "^1.2.0",
@@ -13,0 +14,0 @@ "phosphor-messaging": "^1.0.6",

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

40840

increased by2.43%

Lines of code

1033

increased by3.82%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dependency count

11

increased by10%

Dependency changes

• + Addedphosphor-dockpanel@^0.9.4

• + Addedphosphor-dockpanel@0.9.7(transitive)

• + Addedphosphor-dragdrop@0.9.1(transitive)

• + Addedphosphor-tabs@1.0.0-rc.2(transitive)