From fe2df8e2abd6ac1c49c393053169536388cf3c1d Mon Sep 17 00:00:00 2001 From: Guillaume Bonnaire Date: Fri, 10 Feb 2023 15:44:14 +0100 Subject: [PATCH] Update statusbar Update status bar with : - New option : autoButtonDisable - New event : statusbar_onload - New event : statusbar_buttons_disable - New event : statusbar_buttons_enable Related post : #18 --- plugins/JSSV8/dist/statusbar.min.css | 2 +- plugins/JSSV8/dist/statusbar.min.js | 6 ++- plugins/JSSV8/src/statusbar/README.md | 31 ++++++++++++ plugins/JSSV8/src/statusbar/index.js | 62 ++++++++++++++++++------ plugins/JSSV8/src/statusbar/package.json | 2 +- plugins/JSSV8/src/statusbar/style.css | 9 +++- 6 files changed, 91 insertions(+), 21 deletions(-) diff --git a/plugins/JSSV8/dist/statusbar.min.css b/plugins/JSSV8/dist/statusbar.min.css index 20e3593..b6fb4d4 100644 --- a/plugins/JSSV8/dist/statusbar.min.css +++ b/plugins/JSSV8/dist/statusbar.min.css @@ -1 +1 @@ -.jss_content{padding-bottom:0!important}.jss_statusbar{position:sticky;bottom:0;left:0;background-color:#f3f3f3;border:1px solid #ccc;width:calc(100% - 3px);height:26px;display:flex;align-items:center;margin-left:1px;margin-right:1px;z-index:2}.jss_statusbar *{font-size:12px;color:#666;margin:1px;vertical-align:middle;overflow:hidden;white-space:nowrap}.jss_statusbar .jss_statusbar_addaction button{background-color:#f3f3f3;border:1px solid #ccc;text-align:center;text-decoration:none;display:inline-block;margin-right:2px;padding:1px 3px;height:20px;cursor:pointer}.jss_statusbar .jss_statusbar_addaction button:hover{background-color:#f6f6f6}.jss_statusbar .jss_statusbar_addaction input{width:50px;height:20px;display:inline-block;border:1px solid #ccc;padding:1px 3px}.jss_statusbar .jss_statusbar_addaction span{font-size:13px}.jss_statusbar .jss_statusbar_information{flex-grow:100;font-size:13px;padding-right:5px;display:flex;align-items:center;justify-content:right}.jss_statusbar .jss_statusbar_information .divisor:before{content:" | "}.jss_statusbar .jss_statusbar_information .divisor{color:#ccc;margin-left:2px;margin-right:2px} \ No newline at end of file +.jss_content{padding-bottom:0!important}.jss_statusbar{position:sticky;bottom:0;left:0;background-color:#f3f3f3;border:1px solid #ccc;width:calc(100% - 3px);height:26px;display:flex;align-items:center;margin-left:1px;margin-right:1px;z-index:2}.jss_statusbar *{font-size:12px;color:#666;margin:1px;vertical-align:middle;overflow:hidden;white-space:nowrap}.jss_statusbar .jss_statusbar_addaction.disabled{display:none}.jss_statusbar .jss_statusbar_addaction button{background-color:#f3f3f3;border:1px solid #ccc;text-align:center;text-decoration:none;display:inline-block;margin-right:2px;padding:1px 3px;height:20px;cursor:pointer}.jss_statusbar .jss_statusbar_addaction button:hover{background-color:#f6f6f6}.jss_statusbar .jss_statusbar_addaction input{width:50px;height:20px;display:inline-block;border:1px solid #ccc;padding:1px 3px}.jss_statusbar .jss_statusbar_addaction span{font-size:13px}.jss_statusbar .jss_statusbar_information{flex-grow:100;font-size:13px;padding-right:5px;display:flex;align-items:center;justify-content:right}.jss_statusbar .jss_statusbar_information .divisor:before{content:" | "}.jss_statusbar .jss_statusbar_information .divisor{color:#ccc;margin-left:2px;margin-right:2px} \ No newline at end of file diff --git a/plugins/JSSV8/dist/statusbar.min.js b/plugins/JSSV8/dist/statusbar.min.js index e74aa28..7ac2a15 100644 --- a/plugins/JSSV8/dist/statusbar.min.js +++ b/plugins/JSSV8/dist/statusbar.min.js @@ -1,7 +1,7 @@ /** * Plugin statusbar for JSpreadsheet Pro * - * @version 2.3.6 + * @version 2.4.0 * @author Guillaume Bonnaire * @website https://repo.gbonnaire.fr * @summary Add status bar on bottom of JSpreadsheet @@ -13,6 +13,7 @@ * @property {Boolean|String} [options.showAddRowButton=true] - Add button on right of bar for add row (value : true / false / "after" / "before") * @property {Boolean|String} [options.showAddColButton=true] - Add button on right of bar for add col (value : true / false / "after" / "before") * @property {Boolean} [options.closeInsertionOnly=false] - option to defined behavior insertion method + * @property {Boolean} [options.autoButtonDisable=true] - option to defined behavior action bar * @property {String} [options.label="Add"] - Label for button action * @property {int} [options.defaultQuantity=10] - Quantity for button action * @property {Object} [options.formulas] - Formulas showed on statusbar. object.key = title of formula, object.value = formula. In formula you can use this shortcut {range} (Ref to range selected), {cells} (Ref to array of cells selected), {x1} (Ref to start col of selection), {y1} (Ref to start row of selection), {x2} (Ref to end col to selection), {y2} (Ref to end row to selection) @@ -30,6 +31,7 @@ * * @description Status bar is a plugin for add a status bar on bottom of the sheet like Excel. On this status bar you can add new row with button, and show information on selection (Range selected, Formulas, etc.) * Release notes + * Version 2.4.0: Add disabled buttons features + event * Version 2.3.6: Fix #18 * Version 2.3.5: Fix #17 * Version 2.3.4: Fix #16 @@ -49,4 +51,4 @@ * Version 1.2.1: Fix bug with fullscreen + bug formula with 1 cell * Version 1.2.0: Add formula execute by cells selected (i.e. with results) */ -if(!jSuites&&"function"==typeof require)var jSuites=require("jsuites");!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.jss_statusbar=t()}(this,function(){return function(e,t,o){let n=this;if(!n)throw Error("JSpreadsheet must loaded before");let l=n.formula;if(!l)throw Error("Statusbar plugin require formula extension on JSpreadsheet");let s={},i=null,r=null;s.options=Object.assign({},t);let _={showAddRowButton:!0,showAddColButton:!0,closeInsertionOnly:!1,formulas:{Range:"{range}",SUM:"=SUM({range})",MAX:"=MAX({range})",MIN:"=MIN({range})"},label:jSuites.translate("Add"),defaultQuantity:10};for(var a in null==s.options&&(s.options={}),_)s.options.hasOwnProperty(a)&&null!=s.options[a]||(s.options[a]=_[a]);function u(e,t){for(let o in t)e=e.replace(RegExp("{[ ]?"+o+"[ ]?}","gi"),t[o]);return e}function d(){return r.querySelector(".jss_statusbar_information")}function $(){return n.current?n.current:null!=e.getWorksheetActive()?e.worksheets[e.getWorksheetActive()]:e.worksheets[0]}function p(e){return("object"!=typeof e||Array.isArray(e)||(e=Object.values(e)),"object"==typeof e&&Array.isArray(e))?0==e.length?0:1==e.length?parseInt(e[0]):parseInt(Math.max(...e)):parseInt(e)}function c(e){return("object"!=typeof e||Array.isArray(e)||(e=Object.values(e)),"object"==typeof e&&Array.isArray(e))?0==e.length?0:1==e.length?parseInt(e[0]):parseInt(Math.min(...e)):parseInt(e)}return s.onevent=function(e,t){if("onload"==e)s.createStatusbar(t);else if("onselection"==e){let o=arguments[2],n=arguments[3],l=arguments[4],r=arguments[5];i=[o,n,l,r],s.generateInformation()}else if("onafterchanges"==e)s.generateInformation();else if("onblur"==e){let _=d();_&&(_.innerHTML="")}},s.createStatusbar=function(e){let t=e.element,o=t.querySelector(":scope > .jtabs-content");(r=document.createElement("div")).classList.add("jss_statusbar");let n=document.createElement("div");n.classList.add("jss_statusbar_addaction"),s.options.showAddRowButton||s.options.showAddColButton||(n.style.display="none");let l=document.createElement("input");l.setAttribute("type","number"),l.setAttribute("min","1"),l.setAttribute("step","1"),l.addEventListener("keydown",function(e){e.stopPropagation()}),l.value=s.options.defaultQuantity;let i=document.createElement("button");i.innerHTML=' ',i.onclick=function(e){if(!0===s.options.showAddRowButton||"after"==s.options.showAddRowButton){let t=$();t.options.allowInsertRow&&(1==t.getSelectedRows(!0).length&&t.getSelectedColumns().length==t.options.data[0].length||s.options.closeInsertionOnly?t.selectedCell&&t.insertRow(parseInt(l.value),p(t.getSelectedRows(!0))):(t.goto(t.options.data.length,c(t.getSelectedColumns())),t.insertRow(parseInt(l.value))))}};let _=document.createElement("button");_.innerHTML=' ',_.onclick=function(e){if(!0===s.options.showAddRowButton||"before"==s.options.showAddRowButton){let t=$();t.options.allowInsertRow&&(1==t.getSelectedRows(!0).length&&t.getSelectedColumns().length==t.options.data[0].length||s.options.closeInsertionOnly?t.selectedCell&&t.insertRow(parseInt(l.value),c(t.getSelectedRows(!0)),!0):(t.goto(0,c(t.getSelectedColumns())),t.insertRow(parseInt(l.value),0,!0)))}};let a=document.createElement("button");a.innerHTML='',a.onclick=function(e){if(!0===s.options.showAddColButton||"after"==s.options.showAddColButton){let t=$();t.options.allowInsertColumn&&(1==t.getSelectedColumns().length&&t.getSelectedRows(!0).length==t.options.data.length||s.options.closeInsertionOnly?t.selectedCell&&t.insertColumn(parseInt(l.value),p(t.getSelectedColumns())):(t.goto(c(t.getSelectedRows(!0)),t.options.data[0].length),t.insertColumn(parseInt(l.value))))}};let u=document.createElement("button");u.innerHTML='',u.onclick=function(e){if(!0===s.options.showAddColButton||"before"==s.options.showAddColButton){let t=$();t.options.allowInsertColumn&&(1==t.getSelectedColumns().length&&t.getSelectedRows(!0).length==t.options.data.length||s.options.closeInsertionOnly?t.selectedCell&&t.insertColumn(parseInt(l.value),c(t.getSelectedColumns()),!0):(t.goto(c(t.getSelectedRows(!0)),0),t.insertColumn(parseInt(l.value),0,!0)))}};let d=document.createElement("span");d.innerHTML=s.options.label,n.appendChild(d),n.appendChild(l),!1!==s.options.showAddRowButton&&((!0===s.options.showAddRowButton||"before"==s.options.showAddRowButton)&&n.appendChild(_),(!0===s.options.showAddRowButton||"after"==s.options.showAddRowButton)&&n.appendChild(i)),!1!==s.options.showAddColButton&&((!0===s.options.showAddColButton||"before"==s.options.showAddColButton)&&n.appendChild(u),(!0===s.options.showAddColButton||"after"==s.options.showAddColButton)&&n.appendChild(a)),r.appendChild(n);let h=document.createElement("div");h.classList.add("jss_statusbar_information"),r.appendChild(h),o.after(r)},s.generateInformation=function(){let e="",t=$(),o=""==t.getData(!0).join("").replace(/,/gm,"");if(null==i&&(i=t.selectedCell),i){let l=n.helpers.getColumnNameFromCoords(i[0],i[1]),r;r=i[0]!=i[2]||i[1]!=i[3]?n.helpers.getColumnNameFromCoords(i[2],i[3]):"";let _={};for(let a in _.range=l+(""!=r?":"+r:""),_.cells=function(e){let o=[],l=e.split(":");if(!l[1])return"["+l[0]+"]";let s=n.helpers.getCoordsFromColumnName(l[0]),i=n.helpers.getCoordsFromColumnName(l[1]),r,_,a,u;s[0]<=i[0]?(r=s[0],_=i[0]):(r=i[0],_=s[0]),s[1]<=i[1]?(a=s[1],u=i[1]):(a=i[1],u=s[1]);for(let d=a;d<=u;d++)for(let $=r;$<=_;$++)(null==t.results||-1!=t.results.indexOf(d))&&o.push(n.helpers.getColumnNameFromCoords($,d));return"["+o.join(",")+"]"}(_.range),_.x1=parseInt(i[0]),_.y1=parseInt(i[1]),_.x2=parseInt(i[2]),_.y2=parseInt(i[3]),s.options.formulas){let p=s.options.formulas[a];if("="===p.substr(0,1)){if(!o){""!=e&&(e+="");let c=t.executeFormula(u(p,_));null!==c&&(e+=a+" : "+c)}}else""!=e&&(e+=""),e+=a+" : "+u(p,_)}i=null}let h=d();null!=h&&(h.innerHTML=e)},s}}); \ No newline at end of file +if(!jSuites&&"function"==typeof require)var jSuites=require("jsuites");!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.jss_statusbar=e()}(this,function(){return function(t,e,o){let n=this;if(!n)throw Error("JSpreadsheet must loaded before");let s=n.formula;if(!s)throw Error("Statusbar plugin require formula extension on JSpreadsheet");let l={},i={},a=null;l.options=Object.assign({},e);let r={showAddRowButton:!0,showAddColButton:!0,closeInsertionOnly:!1,autoButtonDisable:!0,formulas:{Range:"{range}",SUM:"=SUM({range})",MAX:"=MAX({range})",MIN:"=MIN({range})"},label:jSuites.translate("Add"),defaultQuantity:10};for(var _ in null==l.options&&(l.options={}),r)l.options.hasOwnProperty(_)&&null!=l.options[_]||(l.options[_]=r[_]);function d(t,e){for(let o in e)t=t.replace(RegExp("{[ ]?"+o+"[ ]?}","gi"),e[o]);return t}function u(){return n.current?n.current:null!=t.getWorksheetActive()?t.worksheets[t.getWorksheetActive()]:t.worksheets[0]}function $(t){return("object"!=typeof t||Array.isArray(t)||(t=Object.values(t)),"object"==typeof t&&Array.isArray(t))?0==t.length?0:1==t.length?parseInt(t[0]):parseInt(Math.max(...t)):parseInt(t)}function c(t){return("object"!=typeof t||Array.isArray(t)||(t=Object.values(t)),"object"==typeof t&&Array.isArray(t))?0==t.length?0:1==t.length?parseInt(t[0]):parseInt(Math.min(...t)):parseInt(t)}return l.onevent=function(t,o){var n,s;if("onload"==t)l.createStatusbar(o),o.dispatch("statusbar_onload",o,i);else if("onselection"==t){let r=arguments[2],_=arguments[3],d=arguments[4],u=arguments[5];a=[r,_,d,u],l.generateInformation()}else"onafterchanges"==t?l.generateInformation():"onblur"==t&&i.informationBar&&(i.informationBar.innerHTML="");null==o.selectedCell?(n=o,i.actionBar&&e.autoButtonDisable&&!i.actionBar.classList.contains("disabled")&&e.closeInsertionOnly&&(i.actionBar.classList.add("disabled"),"function"==typeof n.dispatch&&n.dispatch("statusbar_buttons_disable",n,i))):(s=o,i.actionBar&&e.autoButtonDisable&&i.actionBar.classList.contains("disabled")&&(i.actionBar.classList.remove("disabled"),"function"==typeof s.dispatch&&s.dispatch("statusbar_buttons_enable",s,i)))},l.createStatusbar=function(t){let e=t.element,o=e.querySelector(":scope > .jtabs-content"),n=document.createElement("div");i.statusBar=n,n.classList.add("jss_statusbar");let s=document.createElement("div");i.actionBar=s,s.classList.add("jss_statusbar_addaction"),l.options.showAddRowButton||l.options.showAddColButton||(s.style.display="none");let a=document.createElement("input");i.quantity=a,a.setAttribute("type","number"),a.setAttribute("min","1"),a.setAttribute("step","1"),a.addEventListener("keydown",function(t){t.stopPropagation()}),a.value=l.options.defaultQuantity;let r=document.createElement("button");r.innerHTML=' ',r.onclick=function(t){if(!0===l.options.showAddRowButton||"after"==l.options.showAddRowButton){let e=u();e.options.allowInsertRow&&(1==e.getSelectedRows(!0).length&&e.getSelectedColumns().length==e.options.data[0].length||l.options.closeInsertionOnly?e.selectedCell&&e.insertRow(parseInt(a.value),$(e.getSelectedRows(!0))):(e.goto(e.options.data.length,c(e.getSelectedColumns())),e.insertRow(parseInt(a.value))))}};let _=document.createElement("button");_.innerHTML=' ',_.onclick=function(t){if(!0===l.options.showAddRowButton||"before"==l.options.showAddRowButton){let e=u();e.options.allowInsertRow&&(1==e.getSelectedRows(!0).length&&e.getSelectedColumns().length==e.options.data[0].length||l.options.closeInsertionOnly?e.selectedCell&&e.insertRow(parseInt(a.value),c(e.getSelectedRows(!0)),!0):(e.goto(0,c(e.getSelectedColumns())),e.insertRow(parseInt(a.value),0,!0)))}};let d=document.createElement("button");d.innerHTML='',d.onclick=function(t){if(!0===l.options.showAddColButton||"after"==l.options.showAddColButton){let e=u();e.options.allowInsertColumn&&(1==e.getSelectedColumns().length&&e.getSelectedRows(!0).length==e.options.data.length||l.options.closeInsertionOnly?e.selectedCell&&e.insertColumn(parseInt(a.value),$(e.getSelectedColumns())):(e.goto(c(e.getSelectedRows(!0)),e.options.data[0].length),e.insertColumn(parseInt(a.value))))}};let p=document.createElement("button");p.innerHTML='',p.onclick=function(t){if(!0===l.options.showAddColButton||"before"==l.options.showAddColButton){let e=u();e.options.allowInsertColumn&&(1==e.getSelectedColumns().length&&e.getSelectedRows(!0).length==e.options.data.length||l.options.closeInsertionOnly?e.selectedCell&&e.insertColumn(parseInt(a.value),c(e.getSelectedColumns()),!0):(e.goto(c(e.getSelectedRows(!0)),0),e.insertColumn(parseInt(a.value),0,!0)))}};let h=document.createElement("span");i.labelAdd=h,h.innerHTML=l.options.label,s.appendChild(h),s.appendChild(a),!1!==l.options.showAddRowButton&&((!0===l.options.showAddRowButton||"before"==l.options.showAddRowButton)&&(s.appendChild(_),i.buttonAddRowsBefore=_),(!0===l.options.showAddRowButton||"after"==l.options.showAddRowButton)&&(s.appendChild(r),i.buttonAddRows=r)),!1!==l.options.showAddColButton&&((!0===l.options.showAddColButton||"before"==l.options.showAddColButton)&&(s.appendChild(p),i.buttonAddColsBefore=p),(!0===l.options.showAddColButton||"after"==l.options.showAddColButton)&&(s.appendChild(d),i.buttonAddCols=d)),n.appendChild(s);let f=document.createElement("div");f.classList.add("jss_statusbar_information"),i.informationBar=f,n.appendChild(f),o.after(n)},l.generateInformation=function(){let t="",e=u(),o=""==e.getData(!0).join("").replace(/,/gm,"");if(null==a&&(a=e.selectedCell),a){let s=n.helpers.getColumnNameFromCoords(a[0],a[1]),r;r=a[0]!=a[2]||a[1]!=a[3]?n.helpers.getColumnNameFromCoords(a[2],a[3]):"";let _={};for(let $ in _.range=s+(""!=r?":"+r:""),_.cells=function(t){let o=[],s=t.split(":");if(!s[1])return"["+s[0]+"]";let l=n.helpers.getCoordsFromColumnName(s[0]),i=n.helpers.getCoordsFromColumnName(s[1]),a,r,_,d;l[0]<=i[0]?(a=l[0],r=i[0]):(a=i[0],r=l[0]),l[1]<=i[1]?(_=l[1],d=i[1]):(_=i[1],d=l[1]);for(let u=_;u<=d;u++)for(let $=a;$<=r;$++)(null==e.results||-1!=e.results.indexOf(u))&&o.push(n.helpers.getColumnNameFromCoords($,u));return"["+o.join(",")+"]"}(_.range),_.x1=parseInt(a[0]),_.y1=parseInt(a[1]),_.x2=parseInt(a[2]),_.y2=parseInt(a[3]),l.options.formulas){let c=l.options.formulas[$];if("="===c.substr(0,1)){if(!o){""!=t&&(t+="");let p=e.executeFormula(d(c,_));null!==p&&(t+=$+" : "+p)}}else""!=t&&(t+=""),t+=$+" : "+d(c,_)}a=null}i.informationBar&&(i.informationBar.innerHTML=t)},l}}); \ No newline at end of file diff --git a/plugins/JSSV8/src/statusbar/README.md b/plugins/JSSV8/src/statusbar/README.md index c1bd173..95a8af1 100644 --- a/plugins/JSSV8/src/statusbar/README.md +++ b/plugins/JSSV8/src/statusbar/README.md @@ -71,6 +71,12 @@ jSpreadsheet, a lightweight Vanilla JavaScript plugin, can help you create excep Boolean false + + autoButtonDisable + option to defined behavior action bar. Automatic button disable when no action it's possible + Boolean + false + formulas Object of formulas, you can use quick reference on formulas
@@ -95,6 +101,31 @@ jSpreadsheet, a lightweight Vanilla JavaScript plugin, can help you create excep You can modify CSS file for change separator of formulas +### Events +This plugin dispatch this events + + + + + + + + + + + + + + + + + + + + + +
Event nameArgs
statusbar_onloadWorkBook, Elements(Array of elements)
statusbar_buttons_disableWorksheet, Elements(Array of elements)
statusbar_buttons_enableWorksheet, Elements(Array of elements)
+ ### For translation you can use jSuites dictionary for translate this plugin diff --git a/plugins/JSSV8/src/statusbar/index.js b/plugins/JSSV8/src/statusbar/index.js index 7625db7..c09f4a8 100644 --- a/plugins/JSSV8/src/statusbar/index.js +++ b/plugins/JSSV8/src/statusbar/index.js @@ -1,7 +1,7 @@ /** * Plugin statusbar for JSpreadsheet Pro * - * @version 2.3.6 + * @version 2.4.0 * @author Guillaume Bonnaire * @website https://repo.gbonnaire.fr * @summary Add status bar on bottom of JSpreadsheet @@ -13,6 +13,7 @@ * @property {Boolean|String} [options.showAddRowButton=true] - Add button on right of bar for add row (value : true / false / "after" / "before") * @property {Boolean|String} [options.showAddColButton=true] - Add button on right of bar for add col (value : true / false / "after" / "before") * @property {Boolean} [options.closeInsertionOnly=false] - option to defined behavior insertion method + * @property {Boolean} [options.autoButtonDisable=true] - option to defined behavior action bar * @property {String} [options.label="Add"] - Label for button action * @property {int} [options.defaultQuantity=10] - Quantity for button action * @property {Object} [options.formulas] - Formulas showed on statusbar. object.key = title of formula, object.value = formula. In formula you can use this shortcut {range} (Ref to range selected), {cells} (Ref to array of cells selected), {x1} (Ref to start col of selection), {y1} (Ref to start row of selection), {x2} (Ref to end col to selection), {y2} (Ref to end row to selection) @@ -30,6 +31,7 @@ * * @description Status bar is a plugin for add a status bar on bottom of the sheet like Excel. On this status bar you can add new row with button, and show information on selection (Range selected, Formulas, etc.) * Release notes + * Version 2.4.0: Add disabled buttons features + event * Version 2.3.6: Fix #18 * Version 2.3.5: Fix #17 * Version 2.3.4: Fix #16 @@ -72,8 +74,8 @@ // Plugin object const plugin = {}; + const elements = {}; let RangeSelection = null; - let statusBarElement = null; // Set options plugin.options = Object.assign({},options); @@ -84,6 +86,7 @@ showAddRowButton: true, showAddColButton: true, closeInsertionOnly: false, + autoButtonDisable: true, formulas: { "Range":"{range}", "SUM":"=SUM({range})", @@ -111,6 +114,7 @@ plugin.onevent = function(event, worksheet) { if(event == "onload") { plugin.createStatusbar(worksheet); // Here worksheet = workbook + worksheet.dispatch("statusbar_onload", worksheet, elements); } else if(event == "onselection") { const x1 = arguments[2]; const y1 = arguments[3]; @@ -122,11 +126,16 @@ } else if(event == "onafterchanges") { plugin.generateInformation(); } else if(event == "onblur") { - const statusBarInformationElement = getStatusBarInformationElement(); - if(statusBarInformationElement) { - statusBarInformationElement.innerHTML = ""; + if(elements.informationBar) { + elements.informationBar.innerHTML = ""; } } + + if(worksheet.selectedCell == null) { + disableActionBar(worksheet); + } else { + enableActionBar(worksheet); + } }; /** @@ -139,17 +148,20 @@ const el = workbook.element; const content = el.querySelector(":scope > .jtabs-content"); - statusBarElement = document.createElement("div"); + const statusBarElement = document.createElement("div"); + elements.statusBar = statusBarElement; statusBarElement.classList.add("jss_statusbar"); // Add Row Element const divAddAction= document.createElement("div"); + elements.actionBar = divAddAction; divAddAction.classList.add("jss_statusbar_addaction"); if(!plugin.options.showAddRowButton && !plugin.options.showAddColButton) { divAddAction.style.display = "none"; } const inputAddQuantity = document.createElement("input"); + elements.quantity = inputAddQuantity; inputAddQuantity.setAttribute("type","number"); inputAddQuantity.setAttribute("min","1"); inputAddQuantity.setAttribute("step","1"); @@ -235,6 +247,7 @@ }; const spanAddLabel = document.createElement("span"); + elements.labelAdd = spanAddLabel; spanAddLabel.innerHTML = plugin.options.label; // Append all elements @@ -244,17 +257,21 @@ if(plugin.options.showAddRowButton !== false) { if(plugin.options.showAddRowButton === true || plugin.options.showAddRowButton == "before") { divAddAction.appendChild(buttonAddRowsBefore); + elements.buttonAddRowsBefore = buttonAddRowsBefore; } if(plugin.options.showAddRowButton === true || plugin.options.showAddRowButton == "after") { divAddAction.appendChild(buttonAddRows); + elements.buttonAddRows = buttonAddRows; } } if(plugin.options.showAddColButton !== false) { if(plugin.options.showAddColButton === true || plugin.options.showAddColButton == "before") { divAddAction.appendChild(buttonAddColsBefore); + elements.buttonAddColsBefore = buttonAddColsBefore; } if(plugin.options.showAddColButton === true || plugin.options.showAddColButton == "after") { divAddAction.appendChild(buttonAddCols); + elements.buttonAddCols = buttonAddCols; } } @@ -264,6 +281,7 @@ // Information Element const statusBarInformationElement = document.createElement("div"); statusBarInformationElement.classList.add("jss_statusbar_information"); + elements.informationBar = statusBarInformationElement; // Append Information Element statusBarElement.appendChild(statusBarInformationElement); @@ -371,9 +389,8 @@ } // Set information - const statusBarInformationElement = getStatusBarInformationElement(); - if(statusBarInformationElement != null) { - statusBarInformationElement.innerHTML = info; + if(elements.informationBar) { + elements.informationBar.innerHTML = info; } }; @@ -391,14 +408,29 @@ return formula; } - + /** - * Return Element of status bar information area - * @private - * @returns {HTMLElement} + * Disable action bar + */ + function disableActionBar(worksheet) { + if(elements.actionBar && options.autoButtonDisable && !elements.actionBar.classList.contains("disabled") && options.closeInsertionOnly) { + elements.actionBar.classList.add("disabled"); + if(typeof worksheet.dispatch == "function") { + worksheet.dispatch("statusbar_buttons_disable", worksheet, elements); + } + } + } + + /** + * Enable action bar */ - function getStatusBarInformationElement() { - return statusBarElement.querySelector(".jss_statusbar_information"); + function enableActionBar(worksheet) { + if(elements.actionBar && options.autoButtonDisable && elements.actionBar.classList.contains("disabled")) { + elements.actionBar.classList.remove("disabled"); + if(typeof worksheet.dispatch == "function") { + worksheet.dispatch("statusbar_buttons_enable", worksheet, elements); + } + } } /** diff --git a/plugins/JSSV8/src/statusbar/package.json b/plugins/JSSV8/src/statusbar/package.json index b4a0bba..e0a9063 100644 --- a/plugins/JSSV8/src/statusbar/package.json +++ b/plugins/JSSV8/src/statusbar/package.json @@ -28,5 +28,5 @@ "jspreadsheet": ">9.0.0" }, "main": "index.js", - "version": "2.3.6" + "version": "2.4.0" } diff --git a/plugins/JSSV8/src/statusbar/style.css b/plugins/JSSV8/src/statusbar/style.css index 285dcf0..9eb086d 100644 --- a/plugins/JSSV8/src/statusbar/style.css +++ b/plugins/JSSV8/src/statusbar/style.css @@ -1,7 +1,7 @@ /** * Plugin CSS status bar for Jspreadsheet Pro * - * @version 2.3.6 + * @version 2.4.0 * @author Guillaume Bonnaire * @website https://repo.gbonnaire.fr * @@ -37,6 +37,10 @@ white-space: nowrap; } +.jss_statusbar .jss_statusbar_addaction.disabled { + display: none; +} + .jss_statusbar .jss_statusbar_addaction button { background-color: #F3F3F3; border: 1px solid #CCCCCC; @@ -84,4 +88,5 @@ margin-left: 2px; margin-right: 2px; -} \ No newline at end of file +} +