From b2aa4e51c51a906a2f9e5b818a192b7c1ffff293 Mon Sep 17 00:00:00 2001 From: Leonard Oest O'Leary Date: Sun, 13 Feb 2022 22:07:56 -0500 Subject: [PATCH 1/3] Fix splitter going crazy --- include/codeboot.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/include/codeboot.js b/include/codeboot.js index 4b164284..bd9fdd0c 100644 --- a/include/codeboot.js +++ b/include/codeboot.js @@ -3387,7 +3387,12 @@ CodeBootVM.prototype.initCommon = function (opts) { CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { function px(style, property) { - return parseInt(style.getPropertyValue(property).slice(0, -2)); + value = style.getPropertyValue(property) + if(value){ + return parseInt(value.slice(0, -2)); + } + //console.log("valuuuuueee") + return 0; } if (!containerElem) return; @@ -3431,12 +3436,14 @@ CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { function mouseMove(event) { if (event.buttons && startPos !== null) { var elasticSize = px(elasticStyle, sizeProp); + var maxSize = px(containerStyle, sizeProp); var pos = vert ? event.pageY : event.pageX; var dist = pos - startPos; if (rigidPaneLast) dist = -dist; var delta = Math.min(dist - (currentSize - startSize), elasticSize - elasticSizeMin); var size = Math.max(rigidSizeMin, delta + currentSize); + size = Math.min(maxSize - elasticSizeMin, size) //console.log(elasticSize, pos, dist, delta, size); rigidElem.style.flexBasis = size + 'px'; if (setSize) setSize(size); From 4ed059963a2dd80d979d49a52e3b73f974f2f9f0 Mon Sep 17 00:00:00 2001 From: Leonard Oest O'Leary Date: Sun, 13 Feb 2022 23:01:31 -0500 Subject: [PATCH 2/3] Adding function `setSizeSafe` --- include/codeboot.js | 23 +++++++++++++++++++---- include/fs.js | 18 +++++++++++++++--- 2 files changed, 34 insertions(+), 7 deletions(-) diff --git a/include/codeboot.js b/include/codeboot.js index bd9fdd0c..b730d9b0 100644 --- a/include/codeboot.js +++ b/include/codeboot.js @@ -3424,6 +3424,17 @@ CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { rigidElem.style.flexBasis = rigidStyle.getPropertyValue('height'); + + function setSizeSafe(size){ + var rigidSizeMin = px(rigidStyle, sizeMinProp); + var maxSize = px(containerStyle, sizeProp); + var elasticSizeMin = px(elasticStyle, sizeMinProp); + var size = Math.max(rigidSizeMin, size); + var size = Math.min(maxSize - elasticSizeMin); + + setSize(size) + } + function mouseDown(event) { startPos = vert ? event.pageY : event.pageX; startSize = px(rigidStyle, sizeProp); @@ -3435,18 +3446,22 @@ CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { function mouseMove(event) { if (event.buttons && startPos !== null) { - var elasticSize = px(elasticStyle, sizeProp); var maxSize = px(containerStyle, sizeProp); + var rigidSizeMin = px(rigidStyle, sizeMinProp); + var elasticSizeMin = px(elasticStyle, sizeMinProp); + var elasticSize = px(elasticStyle, sizeProp); + + var pos = vert ? event.pageY : event.pageX; var dist = pos - startPos; if (rigidPaneLast) dist = -dist; var delta = Math.min(dist - (currentSize - startSize), elasticSize - elasticSizeMin); - var size = Math.max(rigidSizeMin, delta + currentSize); - size = Math.min(maxSize - elasticSizeMin, size) + var size = delta + currentSize + //size = Math.min(maxSize - elasticSizeMin, size) //console.log(elasticSize, pos, dist, delta, size); rigidElem.style.flexBasis = size + 'px'; - if (setSize) setSize(size); + if (setSize) setSizeSafe(size); currentSize = size; } else { mouseEnd(); diff --git a/include/fs.js b/include/fs.js index 35441d31..c1335ee7 100644 --- a/include/fs.js +++ b/include/fs.js @@ -1028,15 +1028,26 @@ CodeBootFileEditorManager.prototype.show = function () { var fem = this; -// fem.fs.vm.withElem('.cb-editors', function (elem) { -// elem.style.display = 'flex'; -// }); + fem.fs.vm.withElem('.cb-editors', function (elem) { + elem.style.minHeight = ""; + elem.style.marginBottom = ""; + }); + fem.fs.vm.withElem('.cb-file-tabs', function (elem) { + elem.style.display = ""; + }); }; CodeBootFileEditorManager.prototype.hide = function () { var fem = this; + fem.fs.vm.withElem('.cb-editors', function (elem) { + elem.style.minHeight = "0px"; + elem.style.marginBottom = "0px"; + }); + fem.fs.vm.withElem('.cb-file-tabs', function (elem) { + elem.style.display = "none"; + }); // fem.fs.vm.withElem('.cb-editors', function (elem) { // elem.style.display = 'none'; // }); @@ -1167,6 +1178,7 @@ CodeBootFileEditor.prototype.removePresentation = function () { editorsElem.removeChild(fe.fileContainer); }); }); + }; CodeBootFileEditor.prototype.isEnabled = function () { From 1fa850d2fbc6dab367b0d17b07828f8cd6070dfe Mon Sep 17 00:00:00 2001 From: Leonard Oest O'Leary Date: Mon, 14 Feb 2022 00:03:26 -0500 Subject: [PATCH 3/3] fix tabs out of bounds --- include/codeboot.js | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/include/codeboot.js b/include/codeboot.js index b730d9b0..159c614d 100644 --- a/include/codeboot.js +++ b/include/codeboot.js @@ -659,6 +659,7 @@ function CodeBootVM(opts) { vm.minWidth = get_option_attr('minWidth', 'data-cb-min-width', 575); vm.minHeight = get_option_attr('minHeight', 'data-cb-min-height', 400); vm.resizable = get_option_attr('resizable', 'data-cb-resizable', false); + vm.resizeListeners = [] // list of function to call opon resize vm.editable = get_option_attr('editable', 'data-cb-editable', true); get_option_attr('showHeader', 'data-cb-show-header', false); @@ -3424,17 +3425,27 @@ CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { rigidElem.style.flexBasis = rigidStyle.getPropertyValue('height'); - function setSizeSafe(size){ var rigidSizeMin = px(rigidStyle, sizeMinProp); var maxSize = px(containerStyle, sizeProp); var elasticSizeMin = px(elasticStyle, sizeMinProp); + var margins = 8 * 3 // magic values + var size = Math.max(rigidSizeMin, size); - var size = Math.min(maxSize - elasticSizeMin); + var size = Math.min(maxSize - rigidSizeMin - margins, size); + + if (setSize) setSize(size); + rigidElem.style.flexBasis = size + 'px'; + } + - setSize(size) + function resizeParent(){ + if(currentSize !== null){ + setSizeSafe(currentSize); + } } + function mouseDown(event) { startPos = vert ? event.pageY : event.pageX; startSize = px(rigidStyle, sizeProp); @@ -3458,9 +3469,7 @@ CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { var delta = Math.min(dist - (currentSize - startSize), elasticSize - elasticSizeMin); var size = delta + currentSize - //size = Math.min(maxSize - elasticSizeMin, size) - //console.log(elasticSize, pos, dist, delta, size); - rigidElem.style.flexBasis = size + 'px'; + if (setSize) setSizeSafe(size); currentSize = size; } else { @@ -3476,6 +3485,9 @@ CodeBootVM.prototype.setupSplitter = function (containerElem, setSize) { } splitterElem.addEventListener('mousedown', mouseDown); + + var vm = this; + vm.resizeListeners.push(resizeParent) }; // UI events @@ -4112,6 +4124,7 @@ CodeBootVM.prototype.setFloating = function (floating) { } change_width_height(elem, width, height); + vm.resizeListeners.forEach(e => e()) var left = 0 var top = 0 @@ -4241,6 +4254,7 @@ CodeBootVM.prototype.setupMoveRezizeHandlers = function () { dx = newW - curW; dy = newH - curH; change_width_height(elem, newW, newH); + vm.resizeListeners.forEach(e => e()) } else { var newX = Math.min(maxX-curW/2, Math.max(-curW/2, curX+diffXLeft+dx)) - diffXLeft; var newY = Math.min(maxY-curH/2, Math.max(0, curY+diffYTop+dy)) - diffYTop;