From a6df57973117435a4c98ee4c441ca44a3d6aac6b Mon Sep 17 00:00:00 2001 From: Max Guglielmi Date: Mon, 6 Apr 2015 19:53:01 +1000 Subject: [PATCH] Started to move ids prefixes in respective modules --- dist/filtergrid.css | 2 +- src-es6/modules/checkList.js | 4 ++-- src-es6/modules/gridLayout.js | 26 ++++++++++++++++++++------ src-es6/modules/help.js | 9 +++++++-- src-es6/modules/popupFilter.js | 14 +++++++++++--- src-es6/tablefilter.js | 24 ------------------------ src/index.html | 4 ++-- src/modules/checkList.js | 4 ++-- src/modules/gridLayout.js | 25 +++++++++++++++++++------ src/modules/help.js | 9 +++++++-- src/modules/popupFilter.js | 14 +++++++++++--- src/tablefilter.js | 24 ------------------------ 12 files changed, 82 insertions(+), 77 deletions(-) diff --git a/dist/filtergrid.css b/dist/filtergrid.css index 844dd937..d818b801 100644 --- a/dist/filtergrid.css +++ b/dist/filtergrid.css @@ -1,6 +1,6 @@ /*------------------------------------------------------------------------ - TableFilter stylesheet by Max Guglielmi - - (build date: Mon Apr 06 2015 19:21:24) + - (build date: Mon Apr 06 2015 19:51:07) - Edit below for your projects' needs ------------------------------------------------------------------------*/ diff --git a/src-es6/modules/checkList.js b/src-es6/modules/checkList.js index 2fa2b043..5fdf389e 100644 --- a/src-es6/modules/checkList.js +++ b/src-es6/modules/checkList.js @@ -43,9 +43,9 @@ export class CheckList{ this.tf = tf; } - // TODO: add _OnSlcChange event here + // TODO: move event here onChange(evt){ - this.tf.Evt._OnSlcChange(evt); + this.tf.Evt.onSlcChange(evt); } optionClick(evt){ diff --git a/src-es6/modules/gridLayout.js b/src-es6/modules/gridLayout.js index 647688f6..cd5f4c26 100644 --- a/src-es6/modules/gridLayout.js +++ b/src-es6/modules/gridLayout.js @@ -43,6 +43,19 @@ export class GridLayout{ this.gridColElms = []; + //div containing grid elements if grid_layout true + this.prfxMainTblCont = 'gridCont_'; + //div containing table if grid_layout true + this.prfxTblCont = 'tblCont_'; + //div containing headers table if grid_layout true + this.prfxHeadTblCont = 'tblHeadCont_'; + //headers' table if grid_layout true + this.prfxHeadTbl = 'tblHead_'; + //id of td containing the filter if grid_layout true + this.prfxGridFltTd = '_td_'; + //id of th containing column header if grid_layout true + this.prfxGridTh = 'tblHeadTh_'; + this.tf = tf; } @@ -90,7 +103,8 @@ export class GridLayout{ } //Main container: it will contain all the elements - this.tblMainCont = Dom.create('div',['id', tf.prfxMainTblCont + tf.id]); + this.tblMainCont = Dom.create('div', + ['id', this.prfxMainTblCont + tf.id]); this.tblMainCont.className = this.gridMainContCssClass; if(this.gridWidth){ this.tblMainCont.style.width = this.gridWidth; @@ -98,7 +112,7 @@ export class GridLayout{ tbl.parentNode.insertBefore(this.tblMainCont, tbl); //Table container: div wrapping content table - this.tblCont = Dom.create('div',['id', tf.prfxTblCont + tf.id]); + this.tblCont = Dom.create('div',['id', this.prfxTblCont + tf.id]); this.tblCont.className = this.gridContCssClass; if(this.gridWidth){ this.tblCont.style.width = this.gridWidth; @@ -121,14 +135,14 @@ export class GridLayout{ //Headers table container: div wrapping headers table this.headTblCont = Dom.create( - 'div',['id', tf.prfxHeadTblCont + tf.id]); + 'div',['id', this.prfxHeadTblCont + tf.id]); this.headTblCont.className = this.gridHeadContCssClass; if(this.gridWidth){ this.headTblCont.style.width = this.gridWidth; } //Headers table - this.headTbl = Dom.create('table', ['id', tf.prfxHeadTbl + tf.id]); + this.headTbl = Dom.create('table', ['id', this.prfxHeadTbl + tf.id]); var tH = Dom.create('tHead'); //IE<7 needs it //1st row should be headers row, ids are added if not set @@ -139,7 +153,7 @@ export class GridLayout{ var c = hRow.cells[n]; var thId = c.getAttribute('id'); if(!thId || thId===''){ - thId = tf.prfxGridTh+n+'_'+tf.id; + thId = this.prfxGridTh+n+'_'+tf.id; c.setAttribute('id', thId); } sortTriggers.push(thId); @@ -150,7 +164,7 @@ export class GridLayout{ if(this.gridEnableFilters && tf.fltGrid){ tf.externalFltTgtIds = []; for(var j=0; j' + 'Close'; + //id prefix for help elements + this.prfxHelpSpan = 'helpSpan_'; + //id prefix for help elements + this.prfxHelpDiv = 'helpDiv_'; + this.tf = tf; } @@ -61,8 +66,8 @@ export class Help{ var tf = this.tf; - var helpspan = Dom.create('span',['id', tf.prfxHelpSpan+tf.id]); - var helpdiv = Dom.create('div',['id', tf.prfxHelpDiv+tf.id]); + var helpspan = Dom.create('span',['id', this.prfxHelpSpan+tf.id]); + var helpdiv = Dom.create('div',['id', this.prfxHelpDiv+tf.id]); //help button is added to defined element if(!this.helpInstrTgtId){ diff --git a/src-es6/modules/popupFilter.js b/src-es6/modules/popupFilter.js index 915eaeea..64c4c02c 100644 --- a/src-es6/modules/popupFilter.js +++ b/src-es6/modules/popupFilter.js @@ -49,6 +49,11 @@ export class PopupFilter{ this.popUpFltElms = this.popUpFltElmCache || []; this.popUpFltAdjustToContainer = true; + //id prefix for pop-up filter span + this.prfxPopUpSpan = 'popUpSpan_'; + //id prefix for pop-up div containing filter + this.prfxPopUpDiv = 'popUpDiv_'; + this.tf = tf; } @@ -85,7 +90,7 @@ export class PopupFilter{ } var popUpSpan = Dom.create( 'span', - ['id', tf.prfxPopUpSpan+tf.id+'_'+i], + ['id', this.prfxPopUpSpan+tf.id+'_'+i], ['ci', i] ); popUpSpan.innerHTML = this.popUpImgFltHtml; @@ -114,7 +119,7 @@ export class PopupFilter{ build(colIndex, div){ var tf = this.tf; var popUpDiv = !div ? - Dom.create('div', ['id', tf.prfxPopUpDiv+tf.id+'_'+colIndex]) : + Dom.create('div', ['id', this.prfxPopUpDiv+tf.id+'_'+colIndex]) : div; popUpDiv.className = this.popUpDivCssClass; tf.externalFltTgtIds.push(popUpDiv.id); @@ -140,7 +145,10 @@ export class PopupFilter{ } popUpFltElm.style.display = 'block'; if(tf['col'+colIndex] === tf.fltTypeInp){ - tf.GetFilterElement(colIndex).focus(); + var flt = tf.GetFilterElement(colIndex); + if(flt){ + flt.focus(); + } } if(this.onAfterPopUpOpen){ this.onAfterPopUpOpen.call( diff --git a/src-es6/tablefilter.js b/src-es6/tablefilter.js index 9adfd8c3..f2a2b3cf 100644 --- a/src-es6/tablefilter.js +++ b/src-es6/tablefilter.js @@ -572,26 +572,6 @@ export default class TableFilter{ this.prfxCookiePageNb = 'tf_pgnb_'; //page length cookie this.prfxCookiePageLen = 'tf_pglen_'; - //div containing grid elements if grid_layout true - this.prfxMainTblCont = 'gridCont_'; - //div containing table if grid_layout true - this.prfxTblCont = 'tblCont_'; - //div containing headers table if grid_layout true - this.prfxHeadTblCont = 'tblHeadCont_'; - //headers' table if grid_layout true - this.prfxHeadTbl = 'tblHead_'; - //id of td containing the filter if grid_layout true - this.prfxGridFltTd = '_td_'; - //id of th containing column header if grid_layout true - this.prfxGridTh = 'tblHeadTh_'; - //id prefix for help elements - this.prfxHelpSpan = 'helpSpan_'; - //id prefix for help elements - this.prfxHelpDiv = 'helpDiv_'; - //id prefix for pop-up filter span - this.prfxPopUpSpan = 'popUpSpan_'; - //id prefix for pop-up div containing filter - this.prfxPopUpDiv = 'popUpDiv_'; /*** cookies ***/ this.hasStoredValues = false; @@ -1975,23 +1955,19 @@ export default class TableFilter{ if((rowIndex === validIndexes[validIdxLen-1]) && paging.currentPageNb!==paging.nbPages){ - console.log('last'); paging.setPage('last'); } else if((rowIndex == validIndexes[0]) && paging.currentPageNb!==1){ - console.log('first'); paging.setPage('first'); } else if(rowIndex > validIndexes[pagingEndRow-1] && rowIndex < validIndexes[validIdxLen-1]){ - console.log('next'); paging.setPage('next'); } else if( rowIndex < validIndexes[paging.startPagingRow] && rowIndex > validIndexes[0]){ - console.log('previous'); paging.setPage('previous'); } } diff --git a/src/index.html b/src/index.html index 45205c11..f0ac4845 100644 --- a/src/index.html +++ b/src/index.html @@ -100,7 +100,7 @@ rows_counter: true, enable_default_theme: true, // slc_filling_method: 'innerhtml', - sort: true, + sort: false, sort_config: { sort_types: ['string','string','number','number','number'] }, @@ -126,7 +126,7 @@ default_selection: 'both', loadStylesheet: true }, - grid_layout: false, + grid_layout: true, // grid_width: '500px', // grid_height: '200px', on_before_show_msg: function(tf){ diff --git a/src/modules/checkList.js b/src/modules/checkList.js index d401c358..14dcd9d1 100644 --- a/src/modules/checkList.js +++ b/src/modules/checkList.js @@ -52,10 +52,10 @@ define(["exports", "../dom", "../array", "../string", "../sort", "../event"], fu _createClass(CheckList, { onChange: { - // TODO: add _OnSlcChange event here + // TODO: move event here value: function onChange(evt) { - this.tf.Evt._OnSlcChange(evt); + this.tf.Evt.onSlcChange(evt); } }, optionClick: { diff --git a/src/modules/gridLayout.js b/src/modules/gridLayout.js index 63d2b7bb..bab8eba4 100644 --- a/src/modules/gridLayout.js +++ b/src/modules/gridLayout.js @@ -52,6 +52,19 @@ define(["exports", "../dom", "../types", "../helpers", "../event"], function (ex this.gridColElms = []; + //div containing grid elements if grid_layout true + this.prfxMainTblCont = "gridCont_"; + //div containing table if grid_layout true + this.prfxTblCont = "tblCont_"; + //div containing headers table if grid_layout true + this.prfxHeadTblCont = "tblHeadCont_"; + //headers' table if grid_layout true + this.prfxHeadTbl = "tblHead_"; + //id of td containing the filter if grid_layout true + this.prfxGridFltTd = "_td_"; + //id of th containing column header if grid_layout true + this.prfxGridTh = "tblHeadTh_"; + this.tf = tf; } @@ -102,7 +115,7 @@ define(["exports", "../dom", "../types", "../helpers", "../event"], function (ex } //Main container: it will contain all the elements - this.tblMainCont = Dom.create("div", ["id", tf.prfxMainTblCont + tf.id]); + this.tblMainCont = Dom.create("div", ["id", this.prfxMainTblCont + tf.id]); this.tblMainCont.className = this.gridMainContCssClass; if (this.gridWidth) { this.tblMainCont.style.width = this.gridWidth; @@ -110,7 +123,7 @@ define(["exports", "../dom", "../types", "../helpers", "../event"], function (ex tbl.parentNode.insertBefore(this.tblMainCont, tbl); //Table container: div wrapping content table - this.tblCont = Dom.create("div", ["id", tf.prfxTblCont + tf.id]); + this.tblCont = Dom.create("div", ["id", this.prfxTblCont + tf.id]); this.tblCont.className = this.gridContCssClass; if (this.gridWidth) { this.tblCont.style.width = this.gridWidth; @@ -131,14 +144,14 @@ define(["exports", "../dom", "../types", "../helpers", "../event"], function (ex this.tblMainCont.appendChild(d); //Headers table container: div wrapping headers table - this.headTblCont = Dom.create("div", ["id", tf.prfxHeadTblCont + tf.id]); + this.headTblCont = Dom.create("div", ["id", this.prfxHeadTblCont + tf.id]); this.headTblCont.className = this.gridHeadContCssClass; if (this.gridWidth) { this.headTblCont.style.width = this.gridWidth; } //Headers table - this.headTbl = Dom.create("table", ["id", tf.prfxHeadTbl + tf.id]); + this.headTbl = Dom.create("table", ["id", this.prfxHeadTbl + tf.id]); var tH = Dom.create("tHead"); //IE<7 needs it //1st row should be headers row, ids are added if not set @@ -149,7 +162,7 @@ define(["exports", "../dom", "../types", "../helpers", "../event"], function (ex var c = hRow.cells[n]; var thId = c.getAttribute("id"); if (!thId || thId === "") { - thId = tf.prfxGridTh + n + "_" + tf.id; + thId = this.prfxGridTh + n + "_" + tf.id; c.setAttribute("id", thId); } sortTriggers.push(thId); @@ -160,7 +173,7 @@ define(["exports", "../dom", "../types", "../helpers", "../event"], function (ex if (this.gridEnableFilters && tf.fltGrid) { tf.externalFltTgtIds = []; for (var j = 0; j < tf.nbCells; j++) { - var fltTdId = tf.prfxFlt + j + tf.prfxGridFltTd + tf.id; + var fltTdId = tf.prfxFlt + j + this.prfxGridFltTd + tf.id; var cl = Dom.create(tf.fltCellTag, ["id", fltTdId]); filtersRow.appendChild(cl); tf.externalFltTgtIds[j] = fltTdId; diff --git a/src/modules/help.js b/src/modules/help.js index 58a7ae01..90828f73 100644 --- a/src/modules/help.js +++ b/src/modules/help.js @@ -46,6 +46,11 @@ define(["exports", "../dom", "../event"], function (exports, _dom, _event) { this.helpInstrContEl = null; this.helpInstrDefaultHtml = "

HTML Table " + "Filter Generator v. " + tf.version + "

" + "" + "http://tablefilter.free.fr
" + "©2009-" + tf.year + " Max Guglielmi." + "
" + "Close
"; + //id prefix for help elements + this.prfxHelpSpan = "helpSpan_"; + //id prefix for help elements + this.prfxHelpDiv = "helpDiv_"; + this.tf = tf; } @@ -60,8 +65,8 @@ define(["exports", "../dom", "../event"], function (exports, _dom, _event) { var tf = this.tf; - var helpspan = Dom.create("span", ["id", tf.prfxHelpSpan + tf.id]); - var helpdiv = Dom.create("div", ["id", tf.prfxHelpDiv + tf.id]); + var helpspan = Dom.create("span", ["id", this.prfxHelpSpan + tf.id]); + var helpdiv = Dom.create("div", ["id", this.prfxHelpDiv + tf.id]); //help button is added to defined element if (!this.helpInstrTgtId) { diff --git a/src/modules/popupFilter.js b/src/modules/popupFilter.js index affec5ca..898c9d0d 100644 --- a/src/modules/popupFilter.js +++ b/src/modules/popupFilter.js @@ -54,6 +54,11 @@ define(["exports", "../types", "../dom", "../event", "../helpers"], function (ex this.popUpFltElms = this.popUpFltElmCache || []; this.popUpFltAdjustToContainer = true; + //id prefix for pop-up filter span + this.prfxPopUpSpan = "popUpSpan_"; + //id prefix for pop-up div containing filter + this.prfxPopUpDiv = "popUpDiv_"; + this.tf = tf; } @@ -95,7 +100,7 @@ define(["exports", "../types", "../dom", "../event", "../helpers"], function (ex if (tf["col" + i] === tf.fltTypeNone) { continue; } - var popUpSpan = Dom.create("span", ["id", tf.prfxPopUpSpan + tf.id + "_" + i], ["ci", i]); + var popUpSpan = Dom.create("span", ["id", this.prfxPopUpSpan + tf.id + "_" + i], ["ci", i]); popUpSpan.innerHTML = this.popUpImgFltHtml; var header = tf.getHeaderElement(i); header.appendChild(popUpSpan); @@ -129,7 +134,7 @@ define(["exports", "../types", "../dom", "../event", "../helpers"], function (ex value: function build(colIndex, div) { var tf = this.tf; - var popUpDiv = !div ? Dom.create("div", ["id", tf.prfxPopUpDiv + tf.id + "_" + colIndex]) : div; + var popUpDiv = !div ? Dom.create("div", ["id", this.prfxPopUpDiv + tf.id + "_" + colIndex]) : div; popUpDiv.className = this.popUpDivCssClass; tf.externalFltTgtIds.push(popUpDiv.id); var header = tf.getHeaderElement(colIndex); @@ -157,7 +162,10 @@ define(["exports", "../types", "../dom", "../event", "../helpers"], function (ex } popUpFltElm.style.display = "block"; if (tf["col" + colIndex] === tf.fltTypeInp) { - tf.GetFilterElement(colIndex).focus(); + var flt = tf.GetFilterElement(colIndex); + if (flt) { + flt.focus(); + } } if (this.onAfterPopUpOpen) { this.onAfterPopUpOpen.call(null, this, this.popUpFltElms[colIndex], colIndex); diff --git a/src/tablefilter.js b/src/tablefilter.js index 3cdb9de9..670da15c 100644 --- a/src/tablefilter.js +++ b/src/tablefilter.js @@ -528,26 +528,6 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array this.prfxCookiePageNb = "tf_pgnb_"; //page length cookie this.prfxCookiePageLen = "tf_pglen_"; - //div containing grid elements if grid_layout true - this.prfxMainTblCont = "gridCont_"; - //div containing table if grid_layout true - this.prfxTblCont = "tblCont_"; - //div containing headers table if grid_layout true - this.prfxHeadTblCont = "tblHeadCont_"; - //headers' table if grid_layout true - this.prfxHeadTbl = "tblHead_"; - //id of td containing the filter if grid_layout true - this.prfxGridFltTd = "_td_"; - //id of th containing column header if grid_layout true - this.prfxGridTh = "tblHeadTh_"; - //id prefix for help elements - this.prfxHelpSpan = "helpSpan_"; - //id prefix for help elements - this.prfxHelpDiv = "helpDiv_"; - //id prefix for pop-up filter span - this.prfxPopUpSpan = "popUpSpan_"; - //id prefix for pop-up div containing filter - this.prfxPopUpDiv = "popUpDiv_"; /*** cookies ***/ this.hasStoredValues = false; @@ -1914,16 +1894,12 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array var rowIndex = row.rowIndex; if (rowIndex === validIndexes[validIdxLen - 1] && paging.currentPageNb !== paging.nbPages) { - console.log("last"); paging.setPage("last"); } else if (rowIndex == validIndexes[0] && paging.currentPageNb !== 1) { - console.log("first"); paging.setPage("first"); } else if (rowIndex > validIndexes[pagingEndRow - 1] && rowIndex < validIndexes[validIdxLen - 1]) { - console.log("next"); paging.setPage("next"); } else if (rowIndex < validIndexes[paging.startPagingRow] && rowIndex > validIndexes[0]) { - console.log("previous"); paging.setPage("previous"); } }