deblan-mirror/TableFilter
1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2024-05-09 18:06:53 +02:00
Code Issues Releases Wiki Activity

Moved prefixes in respective modules, added test-sort-grid-layout

Browse source
This commit is contained in:
Max Guglielmi 2015-04-12 17:52:19 +10:00
parent 0acc5f5d29
commit 325f9c260e
20 changed files with 463 additions and 217 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
dist/filtergrid.css vendored
View file

@ -1,6 +1,6 @@
/*------------------------------------------------------------------------
- TableFilter stylesheet by Max Guglielmi
- (build date: Sat Apr 11 2015 19:12:40)
- (build date: Sun Apr 12 2015 17:31:04)
- Edit below for your projects' needs
------------------------------------------------------------------------*/

4
src-es6/modules/checkList.js
View file

@ -35,6 +35,8 @@ export class CheckList{
'flt_checklist_item_disabled';
this.enableCheckListResetFilter =
f.enable_checklist_reset_filter===false ? false : true;
//checklist filter container div
this.prfxCheckListDiv = 'chkdiv_';
this.isCustom = null;
this.opts = null;
@ -80,7 +82,7 @@ export class CheckList{
this.opts = [];
this.optsTxt = [];
var divFltId = tf.prfxCheckListDiv+colIndex+'_'+tf.id;
var divFltId = this.prfxCheckListDiv+colIndex+'_'+tf.id;
if((!Dom.id(divFltId) && !isExternal) ||
(!Dom.id(extFltId) && isExternal)){
return;

4
src-es6/modules/clearButton.js
View file

@ -24,6 +24,8 @@ export class ClearButton{
(!tf.enableIcons ? null :
'<input type="button" value="" class="'+tf.btnResetCssClass+'" ' +
'title="'+this.btnResetTooltip+'" />');
//span containing reset button
this.prfxResetSpan = 'resetspan_';
this.tf = tf;
}
@ -42,7 +44,7 @@ export class ClearButton{
return;
}
var resetspan = Dom.create('span', ['id', tf.prfxResetSpan+tf.id]);
var resetspan = Dom.create('span', ['id', this.prfxResetSpan+tf.id]);
// reset button is added to defined element
if(!this.btnResetTgtId){

6
src-es6/modules/loader.js
View file

@ -32,10 +32,12 @@ export class Loader{
//callback function after loader is closed
this.onHideLoader = Types.isFn(f.on_hide_loader) ?
f.on_hide_loader : null;
//loader div
this.prfxLoader = 'load_';
this.tf = tf;
var containerDiv = Dom.create('div', ['id', tf.prfxLoader+tf.id]);
var containerDiv = Dom.create('div', ['id', this.prfxLoader+tf.id]);
containerDiv.className = this.loaderCssClass;
var targetEl = !this.loaderTgtId ?
@ -45,7 +47,7 @@ export class Loader{
} else {
targetEl.appendChild(containerDiv);
}
this.loaderDiv = Dom.id(tf.prfxLoader+tf.id);
this.loaderDiv = Dom.id(this.prfxLoader+tf.id);
if(!this.loaderHtml){
this.loaderDiv.appendChild(Dom.text(this.loaderText));
} else {

103
src-es6/modules/paging.js
View file

@ -88,6 +88,36 @@ export class Paging{
//calls function before page is changed
this.onAfterChangePage = Types.isFn(f.on_after_change_page) ?
f.on_after_change_page : null;
//pages select
this.prfxSlcPages = 'slcPages_';
//results per page select
this.prfxSlcResults = 'slcResults_';
//label preciding results per page select
this.prfxSlcResultsTxt = 'slcResultsTxt_';
//span containing next page button
this.prfxBtnNextSpan = 'btnNextSpan_';
//span containing previous page button
this.prfxBtnPrevSpan = 'btnPrevSpan_';
//span containing last page button
this.prfxBtnLastSpan = 'btnLastSpan_';
//span containing first page button
this.prfxBtnFirstSpan = 'btnFirstSpan_';
//next button
this.prfxBtnNext = 'btnNext_';
//previous button
this.prfxBtnPrev = 'btnPrev_';
//last button
this.prfxBtnLast = 'btnLast_';
//first button
this.prfxBtnFirst = 'btnFirst_';
//span for tot nb pages
this.prfxPgSpan = 'pgspan_';
//span preceding pages select (contains 'Page')
this.prfxPgBeforeSpan = 'pgbeforespan_';
//span following pages select (contains ' of ')
this.prfxPgAfterSpan = 'pgafterspan_';
var start_row = this.refRow;
var nrows = this.nbRows;
//calculates page nb
@ -168,9 +198,6 @@ export class Paging{
- onchange event for paging select
=====================================================*/
evt.slcPagesChange = (event) => {
// if(evt._Paging._OnSlcPagesChangeEvt){
// evt._Paging._OnSlcPagesChangeEvt();
// }
this.changePage();
event.target.blur();
};
@ -178,7 +205,7 @@ export class Paging{
// Paging drop-down list selector
if(this.pageSelectorType === tf.fltTypeSlc){
slcPages = Dom.create(
tf.fltTypeSlc, ['id', tf.prfxSlcPages+tf.id]);
tf.fltTypeSlc, ['id', this.prfxSlcPages+tf.id]);
slcPages.className = this.pgSlcCssClass;
Event.add(slcPages, 'change', evt.slcPagesChange);
}
@ -187,7 +214,7 @@ export class Paging{
if(this.pageSelectorType === tf.fltTypeInp){
slcPages = Dom.create(
tf.fltTypeInp,
['id', tf.prfxSlcPages+tf.id],
['id', this.prfxSlcPages+tf.id],
['value', this.currentPageNb]
);
slcPages.className = this.pgInpCssClass;
@ -196,20 +223,20 @@ export class Paging{
// btns containers
var btnNextSpan = Dom.create(
'span',['id', tf.prfxBtnNextSpan+tf.id]);
'span',['id', this.prfxBtnNextSpan+tf.id]);
var btnPrevSpan = Dom.create(
'span',['id', tf.prfxBtnPrevSpan+tf.id]);
'span',['id', this.prfxBtnPrevSpan+tf.id]);
var btnLastSpan = Dom.create(
'span',['id', tf.prfxBtnLastSpan+tf.id]);
'span',['id', this.prfxBtnLastSpan+tf.id]);
var btnFirstSpan = Dom.create(
'span',['id', tf.prfxBtnFirstSpan+tf.id]);
'span',['id', this.prfxBtnFirstSpan+tf.id]);
if(this.hasPagingBtns){
// Next button
if(!this.btnNextPageHtml){
var btn_next = Dom.create(
tf.fltTypeInp,
['id', tf.prfxBtnNext+tf.id],
['id', this.prfxBtnNext+tf.id],
['type', 'button'],
['value', this.btnNextPageText],
['title', 'Next']
@ -225,10 +252,10 @@ export class Paging{
if(!this.btnPrevPageHtml){
var btn_prev = Dom.create(
tf.fltTypeInp,
['id',tf.prfxBtnPrev+tf.id],
['type','button'],
['value',this.btnPrevPageText],
['title','Previous']
['id', this.prfxBtnPrev+tf.id],
['type', 'button'],
['value', this.btnPrevPageText],
['title', 'Previous']
);
btn_prev.className = this.btnPageCssClass;
Event.add(btn_prev, 'click', evt.prev);
@ -241,10 +268,10 @@ export class Paging{
if(!this.btnLastPageHtml){
var btn_last = Dom.create(
tf.fltTypeInp,
['id',tf.prfxBtnLast+tf.id],
['type','button'],
['value',this.btnLastPageText],
['title','Last']
['id', this.prfxBtnLast+tf.id],
['type', 'button'],
['value', this.btnLastPageText],
['title', 'Last']
);
btn_last.className = this.btnPageCssClass;
Event.add(btn_last, 'click', evt.last);
@ -257,10 +284,10 @@ export class Paging{
if(!this.btnFirstPageHtml){
var btn_first = Dom.create(
tf.fltTypeInp,
['id',tf.prfxBtnFirst+tf.id],
['type','button'],
['value',this.btnFirstPageText],
['title','First']
['id', this.prfxBtnFirst+tf.id],
['type', 'button'],
['value', this.btnFirstPageText],
['title', 'First']
);
btn_first.className = this.btnPageCssClass;
Event.add(btn_first, 'click', evt.first);
@ -280,23 +307,23 @@ export class Paging{
targetEl.appendChild(btnPrevSpan);
var pgBeforeSpan = Dom.create(
'span',['id', tf.prfxPgBeforeSpan+tf.id] );
'span',['id', this.prfxPgBeforeSpan+tf.id] );
pgBeforeSpan.appendChild( Dom.text(this.pageText) );
pgBeforeSpan.className = this.nbPgSpanCssClass;
targetEl.appendChild(pgBeforeSpan);
targetEl.appendChild(slcPages);
var pgAfterSpan = Dom.create(
'span',['id', tf.prfxPgAfterSpan+tf.id]);
'span',['id', this.prfxPgAfterSpan+tf.id]);
pgAfterSpan.appendChild( Dom.text(this.ofText) );
pgAfterSpan.className = this.nbPgSpanCssClass;
targetEl.appendChild(pgAfterSpan);
var pgspan = Dom.create( 'span',['id', tf.prfxPgSpan+tf.id] );
var pgspan = Dom.create( 'span',['id', this.prfxPgSpan+tf.id] );
pgspan.className = this.nbPgSpanCssClass;
pgspan.appendChild( Dom.text(' '+this.nbPages+' ') );
targetEl.appendChild(pgspan);
targetEl.appendChild(btnNextSpan);
targetEl.appendChild(btnLastSpan);
this.pagingSlc = Dom.id(tf.prfxSlcPages+tf.id);
this.pagingSlc = Dom.id(this.prfxSlcPages+tf.id);
// if this.rememberGridValues==true this.setPagingInfo() is called
// in ResetGridValues() method
@ -338,7 +365,7 @@ export class Paging{
var tf = this.tf;
var rows = tf.tbl.rows;
var mdiv = !this.pagingTgtId ? tf.mDiv : Dom.id(this.pagingTgtId);
var pgspan = Dom.id(tf.prfxPgSpan+tf.id);
var pgspan = Dom.id(this.prfxPgSpan+tf.id);
//stores valid rows indexes
if(validRows && validRows.length>0){
tf.validRowsIndex = validRows;
@ -491,12 +518,12 @@ export class Paging{
};
var slcR = Dom.create(
tf.fltTypeSlc, ['id', tf.prfxSlcResults+tf.id]);
tf.fltTypeSlc, ['id', this.prfxSlcResults+tf.id]);
slcR.className = tf.resultsSlcCssClass;
var slcRText = this.resultsPerPage[0],
slcROpts = this.resultsPerPage[1];
var slcRSpan = Dom.create(
'span',['id', tf.prfxSlcResultsTxt+tf.id]);
'span',['id', this.prfxSlcResultsTxt+tf.id]);
slcRSpan.className = this.resultsSpanCssClass;
// results per page select is added to external element
@ -509,7 +536,7 @@ export class Paging{
targetEl.appendChild(slcRSpan);
targetEl.appendChild(slcR);
this.resultsPerPageSlc = Dom.id(tf.prfxSlcResults+tf.id);
this.resultsPerPageSlc = Dom.id(this.prfxSlcResults+tf.id);
for(var r=0; r<slcROpts.length; r++){
var currOpt = new Option(slcROpts[r], slcROpts[r], false, false);
@ -527,7 +554,7 @@ export class Paging{
return;
}
var slcR = this.resultsPerPageSlc,
slcRSpan = Dom.id(tf.prfxSlcResultsTxt+tf.id);
slcRSpan = Dom.id(this.prfxSlcResultsTxt+tf.id);
if(slcR){
slcR.parentNode.removeChild(slcR);
}
@ -686,16 +713,16 @@ export class Paging{
// btns containers
var btnNextSpan, btnPrevSpan, btnLastSpan, btnFirstSpan;
var pgBeforeSpan, pgAfterSpan, pgspan;
btnNextSpan = Dom.id(tf.prfxBtnNextSpan+tf.id);
btnPrevSpan = Dom.id(tf.prfxBtnPrevSpan+tf.id);
btnLastSpan = Dom.id(tf.prfxBtnLastSpan+tf.id);
btnFirstSpan = Dom.id(tf.prfxBtnFirstSpan+tf.id);
btnNextSpan = Dom.id(this.prfxBtnNextSpan+tf.id);
btnPrevSpan = Dom.id(this.prfxBtnPrevSpan+tf.id);
btnLastSpan = Dom.id(this.prfxBtnLastSpan+tf.id);
btnFirstSpan = Dom.id(this.prfxBtnFirstSpan+tf.id);
//span containing 'Page' text
pgBeforeSpan = Dom.id(tf.prfxPgBeforeSpan+tf.id);
pgBeforeSpan = Dom.id(this.prfxPgBeforeSpan+tf.id);
//span containing 'of' text
pgAfterSpan = Dom.id(tf.prfxPgAfterSpan+tf.id);
pgAfterSpan = Dom.id(this.prfxPgAfterSpan+tf.id);
//span containing nb of pages
pgspan = Dom.id(tf.prfxPgSpan+tf.id);
pgspan = Dom.id(this.prfxPgSpan+tf.id);
var evt = this.evt;

12
src-es6/modules/rowsCounter.js
View file

@ -24,6 +24,12 @@ export class RowsCounter{
this.overText = f.over_text || ' / ';
//defines css class rows counter
this.totRowsCssClass = f.tot_rows_css_class || 'tot';
//rows counter div
this.prfxCounter = 'counter_';
//nb displayed rows label
this.prfxTotRows = 'totrows_span_';
//label preceding nb rows label
this.prfxTotRowsTxt = 'totRowsTextSpan_';
//callback raised before counter is refreshed
this.onBeforeRefreshCounter = Types.isFn(f.on_before_refresh_counter) ?
f.on_before_refresh_counter : null;
@ -42,11 +48,11 @@ export class RowsCounter{
}
//rows counter container
var countDiv = Dom.create('div', ['id', tf.prfxCounter+tf.id]);
var countDiv = Dom.create('div', ['id', this.prfxCounter+tf.id]);
countDiv.className = this.totRowsCssClass;
//rows counter label
var countSpan = Dom.create('span', ['id', tf.prfxTotRows+tf.id]);
var countText = Dom.create('span', ['id', tf.prfxTotRowsTxt+tf.id]);
var countSpan = Dom.create('span', ['id', this.prfxTotRows+tf.id]);
var countText = Dom.create('span', ['id', this.prfxTotRowsTxt+tf.id]);
countText.appendChild(Dom.text(this.rowsCounterText));
// counter is added to defined element

14
src-es6/modules/statusBar.js
View file

@ -37,6 +37,13 @@ export class StatusBar{
this.onAfterShowMsg = Types.isFn(f.on_after_show_msg) ?
f.on_after_show_msg : null;
// status bar div
this.prfxStatus = 'status_';
// status bar label
this.prfxStatusSpan = 'statusSpan_';
// text preceding status bar label
this.prfxStatusTxt = 'statusText_';
this.tf = tf;
}
@ -47,13 +54,14 @@ export class StatusBar{
}
//status bar container
var statusDiv = Dom.create('div', ['id', tf.prfxStatus+tf.id]);
var statusDiv = Dom.create('div', ['id', this.prfxStatus+tf.id]);
statusDiv.className = this.statusBarCssClass;
//status bar label
var statusSpan = Dom.create('span', ['id', tf.prfxStatusSpan+tf.id]);
var statusSpan = Dom.create('span', ['id', this.prfxStatusSpan+tf.id]);
//preceding text
var statusSpanText = Dom.create('span', ['id', tf.prfxStatusTxt+tf.id]);
var statusSpanText = Dom.create('span',
['id', this.prfxStatusTxt+tf.id]);
statusSpanText.appendChild(Dom.text(this.statusBarText));
// target element container

73
src-es6/tablefilter.js
View file

@ -103,6 +103,7 @@ export default class TableFilter{
//default script base path
this.basePath = f.base_path!==undefined ? f.base_path : '';
this.extensionsPath = f.extensions_path || this.basePath+'extensions/';
/*** filter types ***/
this.fltTypeInp = 'input';
@ -390,12 +391,12 @@ export default class TableFilter{
this.sortConfig.name = this.sortConfig['name']!==undefined ?
f.sort_config.name : 'sortabletable';
this.sortConfig.src = this.sortConfig['src']!==undefined ?
f.sort_config.src : this.basePath+'extensions/sortabletable/' +
f.sort_config.src : this.extensionsPath+'sortabletable/' +
'sortabletable.js';
this.sortConfig.adapterSrc =
this.sortConfig['adapter_src']!==undefined ?
f.sort_config.adapter_src :
this.basePath+'extensions/sortabletable/adapterSortabletable.js';
this.extensionsPath+'sortabletable/adapterSortabletable.js';
this.sortConfig.initialize =
this.sortConfig['initialize']!==undefined ?
f.sort_config.initialize :
@ -424,14 +425,14 @@ export default class TableFilter{
f.ezEditTable_config.name : 'ezedittable';
this.ezEditTableConfig.src = this.ezEditTableConfig['src']!==undefined ?
f.ezEditTable_config.src :
this.basePath+'extensions/ezEditTable/ezEditTable.js';
this.extensionsPath+'ezEditTable/ezEditTable.js';
//ezEditTable stylesheet not imported by default as filtergrid.css
//applies
this.ezEditTableConfig.loadStylesheet =
this.ezEditTableConfig['loadStylesheet']===true ? true : false;
this.ezEditTableConfig.stylesheet =
this.ezEditTableConfig['stylesheet'] ||
this.basePath+'extensions/ezEditTable/ezEditTable.css';
this.extensionsPath+'ezEditTable/ezEditTable.css';
this.ezEditTableConfig.stylesheetName =
this.ezEditTableConfig['stylesheetName']!==undefined ?
f.ezEditTable_config.stylesheetName : 'ezEditTableCss';
@ -518,54 +519,6 @@ export default class TableFilter{
this.prfxRDiv = 'rdiv_';
//middle div
this.prfxMDiv = 'mdiv_';
//table container if fixed headers enabled
this.prfxContentDiv = 'cont_';
//checklist filter container div
this.prfxCheckListDiv = 'chkdiv_';
//pages select
this.prfxSlcPages = 'slcPages_';
//results per page select
this.prfxSlcResults = 'slcResults_';
//label preciding results per page select
this.prfxSlcResultsTxt = 'slcResultsTxt_';
//span containing next page button
this.prfxBtnNextSpan = 'btnNextSpan_';
//span containing previous page button
this.prfxBtnPrevSpan = 'btnPrevSpan_';
//span containing last page button
this.prfxBtnLastSpan = 'btnLastSpan_';
//span containing first page button
this.prfxBtnFirstSpan = 'btnFirstSpan_';
//next button
this.prfxBtnNext = 'btnNext_';
//previous button
this.prfxBtnPrev = 'btnPrev_';
//last button
this.prfxBtnLast = 'btnLast_';
//first button
this.prfxBtnFirst = 'btnFirst_';
//span for tot nb pages
this.prfxPgSpan = 'pgspan_';
//span preceding pages select (contains 'Page')
this.prfxPgBeforeSpan = 'pgbeforespan_';
//span following pages select (contains ' of ')
this.prfxPgAfterSpan = 'pgafterspan_';
//rows counter div
this.prfxCounter = 'counter_';
//nb displayed rows label
this.prfxTotRows = 'totrows_span_';
//label preceding nb rows label
this.prfxTotRowsTxt = 'totRowsTextSpan_';
//span containing reset button
this.prfxResetSpan = 'resetspan_';
//loader div
this.prfxLoader = 'load_';
//status bar div
this.prfxStatus = 'status_';
//status bar label
this.prfxStatusSpan = 'statusSpan_';
//text preceding status bar label
this.prfxStatusTxt = 'statusText_';
//filter values cookie
this.prfxCookieFltsValues = 'tf_flts_';
//page nb cookie
@ -1016,18 +969,19 @@ export default class TableFilter{
}
// checklist
else if(col===this.fltTypeCheckList){
var checkList;
if(!this.Cpt.checkList){
// var CheckList =
// require('modules/checkList').CheckList;
// import {CheckList} from 'modules/checkList';
this.Cpt.checkList = new CheckList(this);
checkList = this.Cpt.checkList;
}
var divCont = dom.create('div',
['id',this.prfxCheckListDiv+i+'_'+this.id],
['ct',i],['filled','0']);
divCont.className =
this.Cpt.checkList.checkListDivCssClass;
['id', checkList.prfxCheckListDiv+i+'_'+this.id],
['ct', i], ['filled', '0']);
divCont.className = checkList.checkListDivCssClass;
//filter is appended in desired element
if(externalFltTgtId){
@ -1037,18 +991,17 @@ export default class TableFilter{
fltcell.appendChild(divCont);
}
this.Cpt.checkList.checkListDiv[i] = divCont;
checkList.checkListDiv[i] = divCont;
this.fltIds.push(this.prfxFlt+i+'_'+this.id);
if(!this.fillSlcOnDemand){
this.Cpt.checkList._build(i);
checkList._build(i);
}
if(this.fillSlcOnDemand){
evt.add(
divCont, 'click', this.Evt.onCheckListClick);
divCont.appendChild(
dom.text(
this.Cpt.checkList.activateCheckListTxt));
dom.text(checkList.activateCheckListTxt));
}
evt.add(divCont, 'click', this.Evt.onCheckListFocus);

4
src/modules/checkList.js
View file

@ -41,6 +41,8 @@ define(["exports", "../dom", "../array", "../string", "../sort", "../event"], fu
//defines css class for checklist filters
this.checkListItemDisabledCssClass = f.checklist_item_disabled_css_class || "flt_checklist_item_disabled";
this.enableCheckListResetFilter = f.enable_checklist_reset_filter === false ? false : true;
//checklist filter container div
this.prfxCheckListDiv = "chkdiv_";
this.isCustom = null;
this.opts = null;
@ -99,7 +101,7 @@ define(["exports", "../dom", "../array", "../string", "../sort", "../event"], fu
this.opts = [];
this.optsTxt = [];
var divFltId = tf.prfxCheckListDiv + colIndex + "_" + tf.id;
var divFltId = this.prfxCheckListDiv + colIndex + "_" + tf.id;
if (!Dom.id(divFltId) && !isExternal || !Dom.id(extFltId) && isExternal) {
return;
}

4
src/modules/clearButton.js
View file

@ -34,6 +34,8 @@ define(["exports", "../dom", "../event"], function (exports, _dom, _event) {
this.btnResetTooltip = f.btn_reset_tooltip || "Clear filters";
//defines reset button innerHtml
this.btnResetHtml = f.btn_reset_html || (!tf.enableIcons ? null : "<input type=\"button\" value=\"\" class=\"" + tf.btnResetCssClass + "\" " + "title=\"" + this.btnResetTooltip + "\" />");
//span containing reset button
this.prfxResetSpan = "resetspan_";
this.tf = tf;
}
@ -59,7 +61,7 @@ define(["exports", "../dom", "../event"], function (exports, _dom, _event) {
return;
}
var resetspan = Dom.create("span", ["id", tf.prfxResetSpan + tf.id]);
var resetspan = Dom.create("span", ["id", this.prfxResetSpan + tf.id]);
// reset button is added to defined element
if (!this.btnResetTgtId) {

6
src/modules/loader.js
View file

@ -40,10 +40,12 @@ define(["exports", "../dom", "../types"], function (exports, _dom, _types) {
this.onShowLoader = Types.isFn(f.on_show_loader) ? f.on_show_loader : null;
//callback function after loader is closed
this.onHideLoader = Types.isFn(f.on_hide_loader) ? f.on_hide_loader : null;
//loader div
this.prfxLoader = "load_";
this.tf = tf;
var containerDiv = Dom.create("div", ["id", tf.prfxLoader + tf.id]);
var containerDiv = Dom.create("div", ["id", this.prfxLoader + tf.id]);
containerDiv.className = this.loaderCssClass;
var targetEl = !this.loaderTgtId ? tf.tbl.parentNode : Dom.id(this.loaderTgtId);
@ -52,7 +54,7 @@ define(["exports", "../dom", "../types"], function (exports, _dom, _types) {
} else {
targetEl.appendChild(containerDiv);
}
this.loaderDiv = Dom.id(tf.prfxLoader + tf.id);
this.loaderDiv = Dom.id(this.prfxLoader + tf.id);
if (!this.loaderHtml) {
this.loaderDiv.appendChild(Dom.text(this.loaderText));
} else {

85
src/modules/paging.js
View file

@ -87,6 +87,36 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
this.onBeforeChangePage = Types.isFn(f.on_before_change_page) ? f.on_before_change_page : null;
//calls function before page is changed
this.onAfterChangePage = Types.isFn(f.on_after_change_page) ? f.on_after_change_page : null;
//pages select
this.prfxSlcPages = "slcPages_";
//results per page select
this.prfxSlcResults = "slcResults_";
//label preciding results per page select
this.prfxSlcResultsTxt = "slcResultsTxt_";
//span containing next page button
this.prfxBtnNextSpan = "btnNextSpan_";
//span containing previous page button
this.prfxBtnPrevSpan = "btnPrevSpan_";
//span containing last page button
this.prfxBtnLastSpan = "btnLastSpan_";
//span containing first page button
this.prfxBtnFirstSpan = "btnFirstSpan_";
//next button
this.prfxBtnNext = "btnNext_";
//previous button
this.prfxBtnPrev = "btnPrev_";
//last button
this.prfxBtnLast = "btnLast_";
//first button
this.prfxBtnFirst = "btnFirst_";
//span for tot nb pages
this.prfxPgSpan = "pgspan_";
//span preceding pages select (contains 'Page')
this.prfxPgBeforeSpan = "pgbeforespan_";
//span following pages select (contains ' of ')
this.prfxPgAfterSpan = "pgafterspan_";
var start_row = this.refRow;
var nrows = this.nbRows;
//calculates page nb
@ -167,37 +197,34 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
- onchange event for paging select
=====================================================*/
evt.slcPagesChange = function (event) {
// if(evt._Paging._OnSlcPagesChangeEvt){
// evt._Paging._OnSlcPagesChangeEvt();
// }
_this.changePage();
event.target.blur();
};
// Paging drop-down list selector
if (this.pageSelectorType === tf.fltTypeSlc) {
slcPages = Dom.create(tf.fltTypeSlc, ["id", tf.prfxSlcPages + tf.id]);
slcPages = Dom.create(tf.fltTypeSlc, ["id", this.prfxSlcPages + tf.id]);
slcPages.className = this.pgSlcCssClass;
Event.add(slcPages, "change", evt.slcPagesChange);
}
// Paging input selector
if (this.pageSelectorType === tf.fltTypeInp) {
slcPages = Dom.create(tf.fltTypeInp, ["id", tf.prfxSlcPages + tf.id], ["value", this.currentPageNb]);
slcPages = Dom.create(tf.fltTypeInp, ["id", this.prfxSlcPages + tf.id], ["value", this.currentPageNb]);
slcPages.className = this.pgInpCssClass;
Event.add(slcPages, "keypress", evt._detectKey);
}
// btns containers
var btnNextSpan = Dom.create("span", ["id", tf.prfxBtnNextSpan + tf.id]);
var btnPrevSpan = Dom.create("span", ["id", tf.prfxBtnPrevSpan + tf.id]);
var btnLastSpan = Dom.create("span", ["id", tf.prfxBtnLastSpan + tf.id]);
var btnFirstSpan = Dom.create("span", ["id", tf.prfxBtnFirstSpan + tf.id]);
var btnNextSpan = Dom.create("span", ["id", this.prfxBtnNextSpan + tf.id]);
var btnPrevSpan = Dom.create("span", ["id", this.prfxBtnPrevSpan + tf.id]);
var btnLastSpan = Dom.create("span", ["id", this.prfxBtnLastSpan + tf.id]);
var btnFirstSpan = Dom.create("span", ["id", this.prfxBtnFirstSpan + tf.id]);
if (this.hasPagingBtns) {
// Next button
if (!this.btnNextPageHtml) {
var btn_next = Dom.create(tf.fltTypeInp, ["id", tf.prfxBtnNext + tf.id], ["type", "button"], ["value", this.btnNextPageText], ["title", "Next"]);
var btn_next = Dom.create(tf.fltTypeInp, ["id", this.prfxBtnNext + tf.id], ["type", "button"], ["value", this.btnNextPageText], ["title", "Next"]);
btn_next.className = this.btnPageCssClass;
Event.add(btn_next, "click", evt.next);
btnNextSpan.appendChild(btn_next);
@ -207,7 +234,7 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
}
// Previous button
if (!this.btnPrevPageHtml) {
var btn_prev = Dom.create(tf.fltTypeInp, ["id", tf.prfxBtnPrev + tf.id], ["type", "button"], ["value", this.btnPrevPageText], ["title", "Previous"]);
var btn_prev = Dom.create(tf.fltTypeInp, ["id", this.prfxBtnPrev + tf.id], ["type", "button"], ["value", this.btnPrevPageText], ["title", "Previous"]);
btn_prev.className = this.btnPageCssClass;
Event.add(btn_prev, "click", evt.prev);
btnPrevSpan.appendChild(btn_prev);
@ -217,7 +244,7 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
}
// Last button
if (!this.btnLastPageHtml) {
var btn_last = Dom.create(tf.fltTypeInp, ["id", tf.prfxBtnLast + tf.id], ["type", "button"], ["value", this.btnLastPageText], ["title", "Last"]);
var btn_last = Dom.create(tf.fltTypeInp, ["id", this.prfxBtnLast + tf.id], ["type", "button"], ["value", this.btnLastPageText], ["title", "Last"]);
btn_last.className = this.btnPageCssClass;
Event.add(btn_last, "click", evt.last);
btnLastSpan.appendChild(btn_last);
@ -227,7 +254,7 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
}
// First button
if (!this.btnFirstPageHtml) {
var btn_first = Dom.create(tf.fltTypeInp, ["id", tf.prfxBtnFirst + tf.id], ["type", "button"], ["value", this.btnFirstPageText], ["title", "First"]);
var btn_first = Dom.create(tf.fltTypeInp, ["id", this.prfxBtnFirst + tf.id], ["type", "button"], ["value", this.btnFirstPageText], ["title", "First"]);
btn_first.className = this.btnPageCssClass;
Event.add(btn_first, "click", evt.first);
btnFirstSpan.appendChild(btn_first);
@ -245,22 +272,22 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
targetEl.appendChild(btnFirstSpan);
targetEl.appendChild(btnPrevSpan);
var pgBeforeSpan = Dom.create("span", ["id", tf.prfxPgBeforeSpan + tf.id]);
var pgBeforeSpan = Dom.create("span", ["id", this.prfxPgBeforeSpan + tf.id]);
pgBeforeSpan.appendChild(Dom.text(this.pageText));
pgBeforeSpan.className = this.nbPgSpanCssClass;
targetEl.appendChild(pgBeforeSpan);
targetEl.appendChild(slcPages);
var pgAfterSpan = Dom.create("span", ["id", tf.prfxPgAfterSpan + tf.id]);
var pgAfterSpan = Dom.create("span", ["id", this.prfxPgAfterSpan + tf.id]);
pgAfterSpan.appendChild(Dom.text(this.ofText));
pgAfterSpan.className = this.nbPgSpanCssClass;
targetEl.appendChild(pgAfterSpan);
var pgspan = Dom.create("span", ["id", tf.prfxPgSpan + tf.id]);
var pgspan = Dom.create("span", ["id", this.prfxPgSpan + tf.id]);
pgspan.className = this.nbPgSpanCssClass;
pgspan.appendChild(Dom.text(" " + this.nbPages + " "));
targetEl.appendChild(pgspan);
targetEl.appendChild(btnNextSpan);
targetEl.appendChild(btnLastSpan);
this.pagingSlc = Dom.id(tf.prfxSlcPages + tf.id);
this.pagingSlc = Dom.id(this.prfxSlcPages + tf.id);
// if this.rememberGridValues==true this.setPagingInfo() is called
// in ResetGridValues() method
@ -310,7 +337,7 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
var tf = this.tf;
var rows = tf.tbl.rows;
var mdiv = !this.pagingTgtId ? tf.mDiv : Dom.id(this.pagingTgtId);
var pgspan = Dom.id(tf.prfxPgSpan + tf.id);
var pgspan = Dom.id(this.prfxPgSpan + tf.id);
//stores valid rows indexes
if (validRows && validRows.length > 0) {
tf.validRowsIndex = validRows;
@ -464,11 +491,11 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
ev.target.blur();
};
var slcR = Dom.create(tf.fltTypeSlc, ["id", tf.prfxSlcResults + tf.id]);
var slcR = Dom.create(tf.fltTypeSlc, ["id", this.prfxSlcResults + tf.id]);
slcR.className = tf.resultsSlcCssClass;
var slcRText = this.resultsPerPage[0],
slcROpts = this.resultsPerPage[1];
var slcRSpan = Dom.create("span", ["id", tf.prfxSlcResultsTxt + tf.id]);
var slcRSpan = Dom.create("span", ["id", this.prfxSlcResultsTxt + tf.id]);
slcRSpan.className = this.resultsSpanCssClass;
// results per page select is added to external element
@ -480,7 +507,7 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
targetEl.appendChild(slcRSpan);
targetEl.appendChild(slcR);
this.resultsPerPageSlc = Dom.id(tf.prfxSlcResults + tf.id);
this.resultsPerPageSlc = Dom.id(this.prfxSlcResults + tf.id);
for (var r = 0; r < slcROpts.length; r++) {
var currOpt = new Option(slcROpts[r], slcROpts[r], false, false);
@ -501,7 +528,7 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
return;
}
var slcR = this.resultsPerPageSlc,
slcRSpan = Dom.id(tf.prfxSlcResultsTxt + tf.id);
slcRSpan = Dom.id(this.prfxSlcResultsTxt + tf.id);
if (slcR) {
slcR.parentNode.removeChild(slcR);
}
@ -681,16 +708,16 @@ define(["exports", "../dom", "../types", "../string", "../helpers", "../event"],
// btns containers
var btnNextSpan, btnPrevSpan, btnLastSpan, btnFirstSpan;
var pgBeforeSpan, pgAfterSpan, pgspan;
btnNextSpan = Dom.id(tf.prfxBtnNextSpan + tf.id);
btnPrevSpan = Dom.id(tf.prfxBtnPrevSpan + tf.id);
btnLastSpan = Dom.id(tf.prfxBtnLastSpan + tf.id);
btnFirstSpan = Dom.id(tf.prfxBtnFirstSpan + tf.id);
btnNextSpan = Dom.id(this.prfxBtnNextSpan + tf.id);
btnPrevSpan = Dom.id(this.prfxBtnPrevSpan + tf.id);
btnLastSpan = Dom.id(this.prfxBtnLastSpan + tf.id);
btnFirstSpan = Dom.id(this.prfxBtnFirstSpan + tf.id);
//span containing 'Page' text
pgBeforeSpan = Dom.id(tf.prfxPgBeforeSpan + tf.id);
pgBeforeSpan = Dom.id(this.prfxPgBeforeSpan + tf.id);
//span containing 'of' text
pgAfterSpan = Dom.id(tf.prfxPgAfterSpan + tf.id);
pgAfterSpan = Dom.id(this.prfxPgAfterSpan + tf.id);
//span containing nb of pages
pgspan = Dom.id(tf.prfxPgSpan + tf.id);
pgspan = Dom.id(this.prfxPgSpan + tf.id);
var evt = this.evt;

12
src/modules/rowsCounter.js
View file

@ -37,6 +37,12 @@ define(["exports", "../dom", "../types", "../helpers"], function (exports, _dom,
this.overText = f.over_text || " / ";
//defines css class rows counter
this.totRowsCssClass = f.tot_rows_css_class || "tot";
//rows counter div
this.prfxCounter = "counter_";
//nb displayed rows label
this.prfxTotRows = "totrows_span_";
//label preceding nb rows label
this.prfxTotRowsTxt = "totRowsTextSpan_";
//callback raised before counter is refreshed
this.onBeforeRefreshCounter = Types.isFn(f.on_before_refresh_counter) ? f.on_before_refresh_counter : null;
//callback raised after counter is refreshed
@ -55,11 +61,11 @@ define(["exports", "../dom", "../types", "../helpers"], function (exports, _dom,
}
//rows counter container
var countDiv = Dom.create("div", ["id", tf.prfxCounter + tf.id]);
var countDiv = Dom.create("div", ["id", this.prfxCounter + tf.id]);
countDiv.className = this.totRowsCssClass;
//rows counter label
var countSpan = Dom.create("span", ["id", tf.prfxTotRows + tf.id]);
var countText = Dom.create("span", ["id", tf.prfxTotRowsTxt + tf.id]);
var countSpan = Dom.create("span", ["id", this.prfxTotRows + tf.id]);
var countText = Dom.create("span", ["id", this.prfxTotRowsTxt + tf.id]);
countText.appendChild(Dom.text(this.rowsCounterText));
// counter is added to defined element

13
src/modules/statusBar.js
View file

@ -48,6 +48,13 @@ define(["exports", "../dom", "../event", "../types", "../helpers"], function (ex
//calls function after message is displayed
this.onAfterShowMsg = Types.isFn(f.on_after_show_msg) ? f.on_after_show_msg : null;
// status bar div
this.prfxStatus = "status_";
// status bar label
this.prfxStatusSpan = "statusSpan_";
// text preceding status bar label
this.prfxStatusTxt = "statusText_";
this.tf = tf;
}
@ -60,13 +67,13 @@ define(["exports", "../dom", "../event", "../types", "../helpers"], function (ex
}
//status bar container
var statusDiv = Dom.create("div", ["id", tf.prfxStatus + tf.id]);
var statusDiv = Dom.create("div", ["id", this.prfxStatus + tf.id]);
statusDiv.className = this.statusBarCssClass;
//status bar label
var statusSpan = Dom.create("span", ["id", tf.prfxStatusSpan + tf.id]);
var statusSpan = Dom.create("span", ["id", this.prfxStatusSpan + tf.id]);
//preceding text
var statusSpanText = Dom.create("span", ["id", tf.prfxStatusTxt + tf.id]);
var statusSpanText = Dom.create("span", ["id", this.prfxStatusTxt + tf.id]);
statusSpanText.appendChild(Dom.text(this.statusBarText));
// target element container

69
src/tablefilter.js
View file

@ -111,6 +111,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
//default script base path
this.basePath = f.base_path !== undefined ? f.base_path : "";
this.extensionsPath = f.extensions_path || this.basePath + "extensions/";
/*** filter types ***/
this.fltTypeInp = "input";
@ -379,8 +380,8 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
this.isSortEnabled = false;
this.sortConfig = f.sort_config || {};
this.sortConfig.name = this.sortConfig.name !== undefined ? f.sort_config.name : "sortabletable";
this.sortConfig.src = this.sortConfig.src !== undefined ? f.sort_config.src : this.basePath + "extensions/sortabletable/" + "sortabletable.js";
this.sortConfig.adapterSrc = this.sortConfig.adapter_src !== undefined ? f.sort_config.adapter_src : this.basePath + "extensions/sortabletable/adapterSortabletable.js";
this.sortConfig.src = this.sortConfig.src !== undefined ? f.sort_config.src : this.extensionsPath + "sortabletable/" + "sortabletable.js";
this.sortConfig.adapterSrc = this.sortConfig.adapter_src !== undefined ? f.sort_config.adapter_src : this.extensionsPath + "sortabletable/adapterSortabletable.js";
this.sortConfig.initialize = this.sortConfig.initialize !== undefined ? f.sort_config.initialize : function (o) {};
this.sortConfig.sortTypes = types.isArray(this.sortConfig.sort_types) ? f.sort_config.sort_types : [];
this.sortConfig.sortCol = this.sortConfig.sort_col !== undefined ? f.sort_config.sort_col : null;
@ -394,11 +395,11 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
this.editable = f.editable === true ? true : false;
this.ezEditTableConfig = f.ezEditTable_config || {};
this.ezEditTableConfig.name = this.ezEditTableConfig.name !== undefined ? f.ezEditTable_config.name : "ezedittable";
this.ezEditTableConfig.src = this.ezEditTableConfig.src !== undefined ? f.ezEditTable_config.src : this.basePath + "extensions/ezEditTable/ezEditTable.js";
this.ezEditTableConfig.src = this.ezEditTableConfig.src !== undefined ? f.ezEditTable_config.src : this.extensionsPath + "ezEditTable/ezEditTable.js";
//ezEditTable stylesheet not imported by default as filtergrid.css
//applies
this.ezEditTableConfig.loadStylesheet = this.ezEditTableConfig.loadStylesheet === true ? true : false;
this.ezEditTableConfig.stylesheet = this.ezEditTableConfig.stylesheet || this.basePath + "extensions/ezEditTable/ezEditTable.css";
this.ezEditTableConfig.stylesheet = this.ezEditTableConfig.stylesheet || this.extensionsPath + "ezEditTable/ezEditTable.css";
this.ezEditTableConfig.stylesheetName = this.ezEditTableConfig.stylesheetName !== undefined ? f.ezEditTable_config.stylesheetName : "ezEditTableCss";
this.ezEditTableConfig.err = "Failed to instantiate EditTable " + "object.\n\"ezEditTable\" module may not be available.";
@ -474,54 +475,6 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
this.prfxRDiv = "rdiv_";
//middle div
this.prfxMDiv = "mdiv_";
//table container if fixed headers enabled
this.prfxContentDiv = "cont_";
//checklist filter container div
this.prfxCheckListDiv = "chkdiv_";
//pages select
this.prfxSlcPages = "slcPages_";
//results per page select
this.prfxSlcResults = "slcResults_";
//label preciding results per page select
this.prfxSlcResultsTxt = "slcResultsTxt_";
//span containing next page button
this.prfxBtnNextSpan = "btnNextSpan_";
//span containing previous page button
this.prfxBtnPrevSpan = "btnPrevSpan_";
//span containing last page button
this.prfxBtnLastSpan = "btnLastSpan_";
//span containing first page button
this.prfxBtnFirstSpan = "btnFirstSpan_";
//next button
this.prfxBtnNext = "btnNext_";
//previous button
this.prfxBtnPrev = "btnPrev_";
//last button
this.prfxBtnLast = "btnLast_";
//first button
this.prfxBtnFirst = "btnFirst_";
//span for tot nb pages
this.prfxPgSpan = "pgspan_";
//span preceding pages select (contains 'Page')
this.prfxPgBeforeSpan = "pgbeforespan_";
//span following pages select (contains ' of ')
this.prfxPgAfterSpan = "pgafterspan_";
//rows counter div
this.prfxCounter = "counter_";
//nb displayed rows label
this.prfxTotRows = "totrows_span_";
//label preceding nb rows label
this.prfxTotRowsTxt = "totRowsTextSpan_";
//span containing reset button
this.prfxResetSpan = "resetspan_";
//loader div
this.prfxLoader = "load_";
//status bar div
this.prfxStatus = "status_";
//status bar label
this.prfxStatusSpan = "statusSpan_";
//text preceding status bar label
this.prfxStatusTxt = "statusText_";
//filter values cookie
this.prfxCookieFltsValues = "tf_flts_";
//page nb cookie
@ -969,15 +922,17 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
}
// checklist
else if (col === this.fltTypeCheckList) {
var checkList;
if (!this.Cpt.checkList) {
// var CheckList =
// require('modules/checkList').CheckList;
// import {CheckList} from 'modules/checkList';
this.Cpt.checkList = new CheckList(this);
checkList = this.Cpt.checkList;
}
var divCont = dom.create("div", ["id", this.prfxCheckListDiv + i + "_" + this.id], ["ct", i], ["filled", "0"]);
divCont.className = this.Cpt.checkList.checkListDivCssClass;
var divCont = dom.create("div", ["id", checkList.prfxCheckListDiv + i + "_" + this.id], ["ct", i], ["filled", "0"]);
divCont.className = checkList.checkListDivCssClass;
//filter is appended in desired element
if (externalFltTgtId) {
@ -987,15 +942,15 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
fltcell.appendChild(divCont);
}
this.Cpt.checkList.checkListDiv[i] = divCont;
checkList.checkListDiv[i] = divCont;
this.fltIds.push(this.prfxFlt + i + "_" + this.id);
if (!this.fillSlcOnDemand) {
this.Cpt.checkList._build(i);
checkList._build(i);
}
if (this.fillSlcOnDemand) {
evt.add(divCont, "click", this.Evt.onCheckListClick);
divCont.appendChild(dom.text(this.Cpt.checkList.activateCheckListTxt));
divCont.appendChild(dom.text(checkList.activateCheckListTxt));
}
evt.add(divCont, "click", this.Evt.onCheckListFocus);

2
test/test-clear-button.js
View file

@ -23,7 +23,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
test('ClearButton UI elements', function() {
var container = clearButton.btnResetEl;
deepEqual(container.nodeName, 'INPUT', 'Clear button container');
deepEqual(container.parentNode.id, tf.prfxResetSpan+tf.id, 'Container id');
deepEqual(container.parentNode.id, clearButton.prfxResetSpan+tf.id, 'Container id');
});
module('Destroy and re-init');

7
test/test-loader.js
View file

@ -12,9 +12,10 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
module('Sanity checks');
test('Loader component', function() {
deepEqual(tf.Cpt.loader instanceof Loader, true, 'Loader constructor');
notEqual(tf.Cpt.loader, null, 'Loader instanciated');
notEqual(dom.id(tf.prfxLoader+tf.id), null, 'Loader DOM container');
var loader = tf.Cpt.loader;
deepEqual(loader instanceof Loader, true, 'Loader constructor');
notEqual(loader, null, 'Loader instanciated');
notEqual(dom.id(loader.prfxLoader+tf.id), null, 'Loader DOM container');
});
});

16
test/test-paging.js
View file

@ -25,20 +25,20 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
test('Paging UI elements', function() {
notEqual(paging.pagingSlc, null, 'Paging drop-down element');
notEqual(paging.resultsPerPageSlc, null, 'Number of results per page drop-down element');
notEqual(dom.id(tf.prfxBtnNextSpan+tf.id), null, 'Next button container element');
notEqual(dom.id(tf.prfxBtnPrevSpan+tf.id), null, 'Previous button container element');
notEqual(dom.id(tf.prfxBtnLastSpan+tf.id), null, 'Last button container element');
notEqual(dom.id(tf.prfxBtnFirstSpan+tf.id), null, 'First button container element');
notEqual(dom.id(paging.prfxBtnNextSpan+tf.id), null, 'Next button container element');
notEqual(dom.id(paging.prfxBtnPrevSpan+tf.id), null, 'Previous button container element');
notEqual(dom.id(paging.prfxBtnLastSpan+tf.id), null, 'Last button container element');
notEqual(dom.id(paging.prfxBtnFirstSpan+tf.id), null, 'First button container element');
});
test('Destroy Paging component', function() {
paging.destroy();
deepEqual(paging.pagingSlc, null, 'Paging drop-down element');
deepEqual(paging.resultsPerPageSlc, null, 'Paging drop-down element');
deepEqual(dom.id(tf.prfxBtnNextSpan+tf.id), null, 'Next button container element');
deepEqual(dom.id(tf.prfxBtnPrevSpan+tf.id), null, 'Previous button container element');
deepEqual(dom.id(tf.prfxBtnLastSpan+tf.id), null, 'Last button container element');
deepEqual(dom.id(tf.prfxBtnFirstSpan+tf.id), null, 'First button container element');
deepEqual(dom.id(paging.prfxBtnNextSpan+tf.id), null, 'Next button container element');
deepEqual(dom.id(paging.prfxBtnPrevSpan+tf.id), null, 'Previous button container element');
deepEqual(dom.id(paging.prfxBtnLastSpan+tf.id), null, 'Last button container element');
deepEqual(dom.id(paging.prfxBtnFirstSpan+tf.id), null, 'First button container element');
deepEqual(paging.nbPages, 0, 'Number of pages');
});

147
test/test-sort-grid-layout.html Normal file
View file

@ -0,0 +1,147 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TableFilter column sort with grid layout mode</title>
<link rel="stylesheet" href="libs/qunit/qunit.css">
<link rel="stylesheet" href="../src/filtergrid.css">
<script src="libs/qunit/qunit.js"></script>
<script>
// Defer Qunit so RequireJS can work its magic and resolve all modules.
QUnit.config.autostart = false;
QUnit.config.autoload = false;
</script>
</head>
<body>
<table id="demo" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>From</th>
<th>Destination</th>
<th>Road Distance (km)</th>
<th>By Air (hrs)</th>
<th>By Rail (hrs)</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Sydney</strong></td>
<td>Adelaide</td>
<td>1412</td>
<td>1.4</td>
<td>25.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Brisbane</td>
<td>982</td>
<td>1.5</td>
<td>16</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Canberra</td>
<td>286</td>
<td>.6</td>
<td>4.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Melbourne</td>
<td>872</td>
<td>1.1</td>
<td>10.5</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Perth</td>
<td>2781</td>
<td>3.1</td>
<td>38</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Alice Springs</td>
<td>1533</td>
<td>2</td>
<td>20.25</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Brisbane</td>
<td>2045</td>
<td>2.15</td>
<td>40</td>
</tr>
</tbody>
</table>
<table id="demo2" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>From</th>
<th>Destination</th>
<th>Road Distance (km)</th>
<th>By Air (hrs)</th>
<th>By Rail (hrs)</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Sydney</strong></td>
<td>Adelaide</td>
<td>1412</td>
<td>1.4</td>
<td>25.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Brisbane</td>
<td>982</td>
<td>1.5</td>
<td>16</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Canberra</td>
<td>286</td>
<td>.6</td>
<td>4.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Melbourne</td>
<td>872</td>
<td>1.1</td>
<td>10.5</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Perth</td>
<td>2781</td>
<td>3.1</td>
<td>38</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Alice Springs</td>
<td>1533</td>
<td>2</td>
<td>20.25</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Brisbane</td>
<td>2045</td>
<td>2.15</td>
<td>40</td>
</tr>
</tbody>
</table>
<script data-main="test-sort-grid-layout" src="../libs/requirejs/require.js"></script>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</body>
</html>

97
test/test-sort-grid-layout.js Normal file
View file

@ -0,0 +1,97 @@
requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
var types = require('types').Types,
dom = require('dom').Dom;
var tf = new TableFilter('demo', {
base_path: '../src/',
sort: true,
sort_config: {
sort_types: ['string','string','number','number','number']
},
grid_layout: true,
on_sort_loaded: startSimple
});
tf.init();
var tf1 = new TableFilter('demo2', {
base_path: '../src/',
paging: true,
sort: true,
sort_config: {
sort_types: ['string','string','number','number','number']
},
grid_layout: true,
on_sort_loaded: startPaging
});
tf1.init();
QUnit.start();
function startSimple(tf){
var sort = tf.Extensions.sort;
module('Sanity checks');
test('Sort extension', function() {
notEqual(sort, null, 'Sort instanciated');
deepEqual(sort.stt instanceof SortableTable, true, 'Sort type');
deepEqual(sort.sorted, false, 'Table not sorted');
});
test('Sort behaviour', function() {
var th = tf.getHeaderElement(0);
sort.sortByColumnIndex(0);
deepEqual(sort.sorted, true, 'Table column sorted');
deepEqual(sort.isPaged, false, 'Table is not paged');
});
module('Destroy and re-init');
test('Remove sort', function() {
sort.destroy();
var th = tf.getHeaderElement(0),
indicator = dom.tag(th, 'img');
deepEqual(tf.sort, false, 'Sort is removed');
deepEqual(indicator.length, 0, 'Sort indicator is removed');
});
}
function startPaging(tf){
var sort = tf.Extensions.sort;
module('Sanity checks');
test('Sort extension', function() {
notEqual(sort, null, 'Sort instanciated');
deepEqual(sort.stt instanceof SortableTable, true, 'Sort type');
deepEqual(sort.sorted, false, 'Table not sorted');
});
module('UI elements');
test('Sort UI elements', function() {
var th = tf.getHeaderElement(0),
indicator = dom.tag(th, 'img');
deepEqual(indicator.length, 1, 'Sort indicator in header element');
});
test('Sort behaviour', function() {
var th = tf.getHeaderElement(0);
sort.sortByColumnIndex(0);
deepEqual(sort.sorted, true, 'Table column sorted');
deepEqual(tf.paging, true, 'Table is paged');
});
module('Destroy and re-init');
test('Remove sort', function() {
sort.destroy();
var th = tf.getHeaderElement(0),
indicator = dom.tag(th, 'img');
deepEqual(tf.sort, false, 'Sort is removed');
deepEqual(indicator.length, 0, 'Sort indicator is removed');
});
}
});