diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/sidebar.js b/packages/node_modules/@node-red/editor-client/src/js/ui/sidebar.js index 4fb041cbf..bda764533 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/sidebar.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/sidebar.js @@ -82,104 +82,106 @@ RED.sidebar = (function() { var sidebarSeparator = {}; sidebarSeparator.dragging = false; - $("#red-ui-sidebar-separator").draggable({ - axis: "x", - start:function(event,ui) { - sidebarSeparator.closing = false; - sidebarSeparator.opening = false; - var winWidth = $(window).width(); - sidebarSeparator.start = ui.position.left; - sidebarSeparator.chartWidth = $("#red-ui-workspace").width(); - sidebarSeparator.chartRight = winWidth-$("#red-ui-workspace").width()-$("#red-ui-workspace").offset().left-2; - sidebarSeparator.dragging = true; + function setupSidebarSeparator() { + $("#red-ui-sidebar-separator").draggable({ + axis: "x", + start:function(event,ui) { + sidebarSeparator.closing = false; + sidebarSeparator.opening = false; + var winWidth = $(window).width(); + sidebarSeparator.start = ui.position.left; + sidebarSeparator.chartWidth = $("#red-ui-workspace").width(); + sidebarSeparator.chartRight = winWidth-$("#red-ui-workspace").width()-$("#red-ui-workspace").offset().left-2; + sidebarSeparator.dragging = true; - if (!RED.menu.isSelected("menu-item-sidebar")) { - sidebarSeparator.opening = true; - var newChartRight = 7; - $("#red-ui-sidebar").addClass("closing"); + if (!RED.menu.isSelected("menu-item-sidebar")) { + sidebarSeparator.opening = true; + var newChartRight = 7; + $("#red-ui-sidebar").addClass("closing"); + $("#red-ui-workspace").css("right",newChartRight); + $("#red-ui-editor-stack").css("right",newChartRight+1); + $("#red-ui-sidebar").width(0); + RED.menu.setSelected("menu-item-sidebar",true); + RED.events.emit("sidebar:resize"); + } + sidebarSeparator.width = $("#red-ui-sidebar").width(); + }, + drag: function(event,ui) { + var d = ui.position.left-sidebarSeparator.start; + var newSidebarWidth = sidebarSeparator.width-d; + if (sidebarSeparator.opening) { + newSidebarWidth -= 3; + } + + if (newSidebarWidth > 150) { + if (sidebarSeparator.chartWidth+d < 200) { + ui.position.left = 200+sidebarSeparator.start-sidebarSeparator.chartWidth; + d = ui.position.left-sidebarSeparator.start; + newSidebarWidth = sidebarSeparator.width-d; + } + } + + if (newSidebarWidth < 150) { + if (!sidebarSeparator.closing) { + $("#red-ui-sidebar").addClass("closing"); + sidebarSeparator.closing = true; + } + if (!sidebarSeparator.opening) { + newSidebarWidth = 150; + ui.position.left = sidebarSeparator.width-(150 - sidebarSeparator.start); + d = ui.position.left-sidebarSeparator.start; + } + } else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) { + sidebarSeparator.closing = false; + $("#red-ui-sidebar").removeClass("closing"); + } + + var newChartRight = sidebarSeparator.chartRight-d; $("#red-ui-workspace").css("right",newChartRight); $("#red-ui-editor-stack").css("right",newChartRight+1); - $("#red-ui-sidebar").width(0); - RED.menu.setSelected("menu-item-sidebar",true); + $("#red-ui-sidebar").width(newSidebarWidth); + + sidebar_tabs.resize(); + RED.events.emit("sidebar:resize"); + }, + stop:function(event,ui) { + sidebarSeparator.dragging = false; + if (sidebarSeparator.closing) { + $("#red-ui-sidebar").removeClass("closing"); + RED.menu.setSelected("menu-item-sidebar",false); + if ($("#red-ui-sidebar").width() < 180) { + $("#red-ui-sidebar").width(180); + $("#red-ui-workspace").css("right",187); + $("#red-ui-editor-stack").css("right",188); + } + } + $("#red-ui-sidebar-separator").css("left","auto"); + $("#red-ui-sidebar-separator").css("right",($("#red-ui-sidebar").width()+2)+"px"); RED.events.emit("sidebar:resize"); } - sidebarSeparator.width = $("#red-ui-sidebar").width(); - }, - drag: function(event,ui) { - var d = ui.position.left-sidebarSeparator.start; - var newSidebarWidth = sidebarSeparator.width-d; - if (sidebarSeparator.opening) { - newSidebarWidth -= 3; - } + }); - if (newSidebarWidth > 150) { - if (sidebarSeparator.chartWidth+d < 200) { - ui.position.left = 200+sidebarSeparator.start-sidebarSeparator.chartWidth; - d = ui.position.left-sidebarSeparator.start; - newSidebarWidth = sidebarSeparator.width-d; - } - } - - if (newSidebarWidth < 150) { - if (!sidebarSeparator.closing) { - $("#red-ui-sidebar").addClass("closing"); - sidebarSeparator.closing = true; - } - if (!sidebarSeparator.opening) { - newSidebarWidth = 150; - ui.position.left = sidebarSeparator.width-(150 - sidebarSeparator.start); - d = ui.position.left-sidebarSeparator.start; - } - } else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) { - sidebarSeparator.closing = false; - $("#red-ui-sidebar").removeClass("closing"); - } - - var newChartRight = sidebarSeparator.chartRight-d; - $("#red-ui-workspace").css("right",newChartRight); - $("#red-ui-editor-stack").css("right",newChartRight+1); - $("#red-ui-sidebar").width(newSidebarWidth); - - sidebar_tabs.resize(); - RED.events.emit("sidebar:resize"); - }, - stop:function(event,ui) { - sidebarSeparator.dragging = false; - if (sidebarSeparator.closing) { - $("#red-ui-sidebar").removeClass("closing"); - RED.menu.setSelected("menu-item-sidebar",false); - if ($("#red-ui-sidebar").width() < 180) { - $("#red-ui-sidebar").width(180); - $("#red-ui-workspace").css("right",187); - $("#red-ui-editor-stack").css("right",188); - } - } - $("#red-ui-sidebar-separator").css("left","auto"); - $("#red-ui-sidebar-separator").css("right",($("#red-ui-sidebar").width()+2)+"px"); - RED.events.emit("sidebar:resize"); - } - }); - - var sidebarControls = $('