Fixed JavaScript error on resize when not editing

Co-Authored-By: Jérôme Hodé <[email protected]>
datenstrom · Aug 28, 2024 · e6513df · e6513df
1 parent 834dc3c
commit e6513df
Show file tree

Hide file tree

Showing 4 changed files with 66 additions and 65 deletions.
diff --git a/system/extensions/update-available.ini b/system/extensions/update-available.ini
@@ -213,14 +213,14 @@ Status: available
 system/workers/dutch.php: dutch.php, create, update
 
 Extension: Edit
-Version: 0.9.9
+Version: 0.9.10
 Description: Edit your website in a web browser.
 Developer: Anna Svensson
 Tag: feature
 DownloadUrl: https://github.com/annaesvensson/yellow-edit/archive/refs/heads/main.zip
 DocumentationUrl: https://github.com/annaesvensson/yellow-edit
 DocumentationLanguage: en, de, sv
-Published: 2024-05-09 16:45:47
+Published: 2024-08-28 11:21:21
 Status: available
 system/workers/edit.php: edit.php, create, update
 system/workers/edit.css: edit.css, create, update

diff --git a/system/extensions/yellow-extension.ini b/system/extensions/yellow-extension.ini
@@ -20,14 +20,14 @@ system/layouts/navigation.html: navigation.html, create, update, careful
 system/layouts/pagination.html: pagination.html, create, update, careful
 
 Extension: Edit
-Version: 0.9.9
+Version: 0.9.10
 Description: Edit your website in a web browser.
 Developer: Anna Svensson
 Tag: feature
 DownloadUrl: https://github.com/annaesvensson/yellow-edit/archive/refs/heads/main.zip
 DocumentationUrl: https://github.com/annaesvensson/yellow-edit
 DocumentationLanguage: en, de, sv
-Published: 2024-05-09 16:45:47
+Published: 2024-08-28 11:21:21
 Status: available
 system/workers/edit.php: edit.php, create, update
 system/workers/edit.css: edit.css, create, update

diff --git a/system/workers/edit.js b/system/workers/edit.js
@@ -444,66 +444,67 @@ yellow.edit = {
 
     // Resize pane
     resizePane: function(paneId, paneAction, paneStatus) {
-        if(!document.getElementById(paneId)) return;
-        var elementBar = document.getElementById("yellow-bar-content");
-        var paneLeft = yellow.toolbox.getOuterLeft(elementBar);
-        var paneTop = yellow.toolbox.getOuterTop(elementBar) + yellow.toolbox.getOuterHeight(elementBar) + 10;
-        var paneWidth = yellow.toolbox.getOuterWidth(elementBar);
-        var paneHeight = yellow.toolbox.getWindowHeight() - paneTop - Math.min(yellow.toolbox.getOuterHeight(elementBar) + 10, (yellow.toolbox.getWindowWidth()-yellow.toolbox.getOuterWidth(elementBar))/2);
-        switch (paneId) {
-            case "yellow-pane-account":
-            case "yellow-pane-configure":
-                yellow.toolbox.setOuterLeft(document.getElementById(paneId), paneLeft);
-                yellow.toolbox.setOuterTop(document.getElementById(paneId), paneTop);
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId), paneWidth);
-                var elementWidth = yellow.toolbox.getWidth(document.getElementById(paneId));
-                var actionsWidth = yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-settings-actions"));
-                var fieldsWidth = yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-settings-fields"));
-                var separatorWidth = Math.max(10, ((elementWidth-fieldsWidth)/2)-actionsWidth);
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-settings-separator"), separatorWidth);
-                break;
-            case "yellow-pane-create":
-            case "yellow-pane-edit":
-            case "yellow-pane-delete":
-                yellow.toolbox.setOuterLeft(document.getElementById(paneId), paneLeft);
-                yellow.toolbox.setOuterTop(document.getElementById(paneId), paneTop);
-                yellow.toolbox.setOuterHeight(document.getElementById(paneId), paneHeight);
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId), paneWidth);
-                var elementWidth = yellow.toolbox.getWidth(document.getElementById(paneId));
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-text"), elementWidth);
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-preview"), elementWidth);
-                var buttonsWidth = 0;
-                var buttonsWidthMax = yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-toolbar")) -
-                    yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-toolbar-main")) - 1;
-                var element = document.getElementById(paneId+"-toolbar-buttons").firstChild;
-                for (; element; element=element.nextSibling) {
-                    element.removeAttribute("style");
-                    buttonsWidth += yellow.toolbox.getOuterWidth(element);
-                    if (buttonsWidth>buttonsWidthMax) yellow.toolbox.setVisible(element, false);
-                }
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-toolbar-title"), buttonsWidthMax);
-                var height1 = yellow.toolbox.getHeight(document.getElementById(paneId));
-                var height2 = yellow.toolbox.getOuterHeight(document.getElementById(paneId+"-toolbar"));
-                yellow.toolbox.setOuterHeight(document.getElementById(paneId+"-text"), height1 - height2);
-                yellow.toolbox.setOuterHeight(document.getElementById(paneId+"-preview"), height1 - height2);
-                var elementLink = document.getElementById(paneId+"-bar");
-                var position = yellow.toolbox.getOuterLeft(elementLink) + yellow.toolbox.getOuterWidth(elementLink)/2;
-                position -= yellow.toolbox.getOuterLeft(document.getElementById(paneId)) + 1;
-                yellow.toolbox.setOuterLeft(document.getElementById(paneId+"-arrow"), position);
-                break;
-            case "yellow-pane-menu":
-                yellow.toolbox.setOuterLeft(document.getElementById("yellow-pane-menu"), paneLeft + paneWidth - yellow.toolbox.getOuterWidth(document.getElementById("yellow-pane-menu")));
-                yellow.toolbox.setOuterTop(document.getElementById("yellow-pane-menu"), paneTop);
-                var elementLink = document.getElementById("yellow-pane-menu-bar");
-                var position = yellow.toolbox.getOuterLeft(elementLink) + yellow.toolbox.getOuterWidth(elementLink)/2;
-                position -= yellow.toolbox.getOuterLeft(document.getElementById("yellow-pane-menu"));
-                yellow.toolbox.setOuterLeft(document.getElementById("yellow-pane-menu-arrow"), position);
-                break;
-            default:
-                yellow.toolbox.setOuterLeft(document.getElementById(paneId), paneLeft);
-                yellow.toolbox.setOuterTop(document.getElementById(paneId), paneTop);
-                yellow.toolbox.setOuterWidth(document.getElementById(paneId), paneWidth);
-                break;
+        if (document.getElementById(paneId)) {
+            var elementBar = document.getElementById("yellow-bar-content");
+            var paneLeft = yellow.toolbox.getOuterLeft(elementBar);
+            var paneTop = yellow.toolbox.getOuterTop(elementBar) + yellow.toolbox.getOuterHeight(elementBar) + 10;
+            var paneWidth = yellow.toolbox.getOuterWidth(elementBar);
+            var paneHeight = yellow.toolbox.getWindowHeight() - paneTop - Math.min(yellow.toolbox.getOuterHeight(elementBar) + 10, (yellow.toolbox.getWindowWidth()-yellow.toolbox.getOuterWidth(elementBar))/2);
+            switch (paneId) {
+                case "yellow-pane-account":
+                case "yellow-pane-configure":
+                    yellow.toolbox.setOuterLeft(document.getElementById(paneId), paneLeft);
+                    yellow.toolbox.setOuterTop(document.getElementById(paneId), paneTop);
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId), paneWidth);
+                    var elementWidth = yellow.toolbox.getWidth(document.getElementById(paneId));
+                    var actionsWidth = yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-settings-actions"));
+                    var fieldsWidth = yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-settings-fields"));
+                    var separatorWidth = Math.max(10, ((elementWidth-fieldsWidth)/2)-actionsWidth);
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-settings-separator"), separatorWidth);
+                    break;
+                case "yellow-pane-create":
+                case "yellow-pane-edit":
+                case "yellow-pane-delete":
+                    yellow.toolbox.setOuterLeft(document.getElementById(paneId), paneLeft);
+                    yellow.toolbox.setOuterTop(document.getElementById(paneId), paneTop);
+                    yellow.toolbox.setOuterHeight(document.getElementById(paneId), paneHeight);
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId), paneWidth);
+                    var elementWidth = yellow.toolbox.getWidth(document.getElementById(paneId));
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-text"), elementWidth);
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-preview"), elementWidth);
+                    var buttonsWidth = 0;
+                    var buttonsWidthMax = yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-toolbar")) -
+                        yellow.toolbox.getOuterWidth(document.getElementById(paneId+"-toolbar-main")) - 1;
+                    var element = document.getElementById(paneId+"-toolbar-buttons").firstChild;
+                    for (; element; element=element.nextSibling) {
+                        element.removeAttribute("style");
+                        buttonsWidth += yellow.toolbox.getOuterWidth(element);
+                        if (buttonsWidth>buttonsWidthMax) yellow.toolbox.setVisible(element, false);
+                    }
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId+"-toolbar-title"), buttonsWidthMax);
+                    var height1 = yellow.toolbox.getHeight(document.getElementById(paneId));
+                    var height2 = yellow.toolbox.getOuterHeight(document.getElementById(paneId+"-toolbar"));
+                    yellow.toolbox.setOuterHeight(document.getElementById(paneId+"-text"), height1 - height2);
+                    yellow.toolbox.setOuterHeight(document.getElementById(paneId+"-preview"), height1 - height2);
+                    var elementLink = document.getElementById(paneId+"-bar");
+                    var position = yellow.toolbox.getOuterLeft(elementLink) + yellow.toolbox.getOuterWidth(elementLink)/2;
+                    position -= yellow.toolbox.getOuterLeft(document.getElementById(paneId)) + 1;
+                    yellow.toolbox.setOuterLeft(document.getElementById(paneId+"-arrow"), position);
+                    break;
+                case "yellow-pane-menu":
+                    yellow.toolbox.setOuterLeft(document.getElementById("yellow-pane-menu"), paneLeft + paneWidth - yellow.toolbox.getOuterWidth(document.getElementById("yellow-pane-menu")));
+                    yellow.toolbox.setOuterTop(document.getElementById("yellow-pane-menu"), paneTop);
+                    var elementLink = document.getElementById("yellow-pane-menu-bar");
+                    var position = yellow.toolbox.getOuterLeft(elementLink) + yellow.toolbox.getOuterWidth(elementLink)/2;
+                    position -= yellow.toolbox.getOuterLeft(document.getElementById("yellow-pane-menu"));
+                    yellow.toolbox.setOuterLeft(document.getElementById("yellow-pane-menu-arrow"), position);
+                    break;
+                default:
+                    yellow.toolbox.setOuterLeft(document.getElementById(paneId), paneLeft);
+                    yellow.toolbox.setOuterTop(document.getElementById(paneId), paneTop);
+                    yellow.toolbox.setOuterWidth(document.getElementById(paneId), paneWidth);
+                    break;
+            }
         }
     },
 

diff --git a/system/workers/edit.php b/system/workers/edit.php
@@ -2,7 +2,7 @@
 // Edit extension, https://github.com/annaesvensson/yellow-edit
 
 class YellowEdit {
-    const VERSION = "0.9.9";
+    const VERSION = "0.9.10";
     public $yellow;         // access to API
     public $response;       // web response
     public $merge;          // text merge