fix: plugin panel layout fixes

Author: abose

src/extensions/default/Phoenix-Markdown/main.js

@@ -279,8 +279,9 @@ define(function (require, exports, module) {
             if (!panel) {
                 $panel = $(panelHTML);
                 $iframe = $panel.find("#panel-markdown-preview-frame");
+                let minSize = window.innerWidth/3;
 
-                panel = WorkspaceManager.createPluginPanel("markdown-preview-panel", $panel, 300, $icon);
+                panel = WorkspaceManager.createPluginPanel("markdown-preview-panel", $panel, minSize, $icon);
 
                 WorkspaceManager.recomputeLayout(false);
                 $settingsToggle = $("#markdown-settings-toggle")

src/utils/Resizer.js

@@ -323,8 +323,14 @@ define(function (require, exports, module) {
 
         $element.data("show", function () {
             var elementOffset   = $element.offset(),
-                elementSize     = elementSizeFunction.apply($element) || elementPrefs.size || minSize,
+                elementSize     = elementSizeFunction.apply($element) || elementPrefs.size,
                 contentSize     = contentSizeFunction.apply($resizableElement) || elementPrefs.contentSize;
+            if(elementSize<minSize){
+                elementSize = minSize;
+            }
+            if(contentSize<elementSize){
+                contentSize = elementSize;
+            }
 
             // Resize the element before showing it again. If the panel was collapsed by dragging
             // the resizer, the size of the element should be 0, so we restore size in preferences

src/view/PluginPanelView.js

@@ -68,6 +68,7 @@ define(function (require, exports, module) {
      */
     Panel.prototype.show = function () {
         this.$toolbarIcon.addClass("selected-button");
+        this.$panel.show();
         exports.trigger(EVENT_PLUGIN_PANEL_SHOWN, this.panelID, this.minWidth);
     };
 
@@ -78,6 +79,7 @@ define(function (require, exports, module) {
         this.$mainToolbar.css('width', MAIN_TOOLBAR_WIDTH);
         this.$windowContent.css('right', MAIN_TOOLBAR_WIDTH);
         this.$toolbarIcon.removeClass("selected-button");
+        this.$panel.hide();
         exports.trigger(EVENT_PLUGIN_PANEL_HIDDEN, this.panelID);
     };
 

src/view/WorkspaceManager.js

@@ -309,6 +309,7 @@ define(function (require, exports, module) {
     PluginPanelView.on(PluginPanelView.EVENT_PLUGIN_PANEL_SHOWN, (event, panelID, minWidth)=>{
         Resizer.makeResizable($mainToolbar, Resizer.DIRECTION_HORIZONTAL, Resizer.POSITION_LEFT, minWidth,
             false, undefined, true, undefined, $windowContent);
+        Resizer.show($mainToolbar[0]);
         recomputeLayout(true);
         exports.trigger(EVENT_WORKSPACE_PANEL_SHOWN, panelID);
     });