1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2024-06-16 04:35:27 +02:00
TableFilter/src/modules/clearButton.js

94 lines
2.6 KiB
JavaScript
Raw Normal View History

import {Feature} from '../feature';
2016-05-24 10:42:11 +02:00
import {createElm, createText, id, removeElm} from '../dom';
2015-05-30 14:23:33 +02:00
import Event from '../event';
2015-02-19 06:28:50 +01:00
2016-05-24 10:42:11 +02:00
export class ClearButton extends Feature {
2015-02-19 06:28:50 +01:00
/**
* Clear button component
* @param {Object} tf TableFilter instance
*/
2016-05-24 10:42:11 +02:00
constructor(tf) {
super(tf, 'btnReset');
2015-02-19 06:28:50 +01:00
// Configuration object
2016-05-24 10:42:11 +02:00
let f = this.config;
2015-02-19 06:28:50 +01:00
//id of container element
this.btnResetTgtId = f.btn_reset_target_id || null;
//reset button element
this.btnResetEl = null;
//defines reset text
this.btnResetText = f.btn_reset_text || 'Reset';
//defines reset button tooltip
this.btnResetTooltip = f.btn_reset_tooltip || 'Clear filters';
//defines reset button innerHtml
this.btnResetHtml = f.btn_reset_html ||
(!tf.enableIcons ? null :
2016-05-24 10:42:11 +02:00
'<input type="button" value="" class="' + tf.btnResetCssClass +
'" ' + 'title="' + this.btnResetTooltip + '" />');
//span containing reset button
this.prfxResetSpan = 'resetspan_';
2015-02-19 06:28:50 +01:00
}
2016-05-24 10:42:11 +02:00
onClick() {
if (!this.isEnabled()) {
return;
}
this.tf.clearFilters();
2015-02-19 06:28:50 +01:00
}
/**
* Build DOM elements
*/
2016-05-24 10:42:11 +02:00
init() {
let tf = this.tf;
2015-02-19 06:28:50 +01:00
2016-05-24 10:42:11 +02:00
if (this.initialized) {
2015-02-19 06:28:50 +01:00
return;
}
2016-05-24 10:42:11 +02:00
let resetspan = createElm('span', ['id', this.prfxResetSpan + tf.id]);
2015-02-19 06:28:50 +01:00
// reset button is added to defined element
2016-05-24 10:42:11 +02:00
if (!this.btnResetTgtId) {
tf.setToolbar();
2015-02-19 06:28:50 +01:00
}
2016-05-24 10:42:11 +02:00
let targetEl = !this.btnResetTgtId ? tf.rDiv : id(this.btnResetTgtId);
2015-02-19 06:28:50 +01:00
targetEl.appendChild(resetspan);
2016-05-24 10:42:11 +02:00
if (!this.btnResetHtml) {
let fltreset = createElm('a', ['href', 'javascript:void(0);']);
2015-02-19 06:28:50 +01:00
fltreset.className = tf.btnResetCssClass;
2016-05-24 10:42:11 +02:00
fltreset.appendChild(createText(this.btnResetText));
2015-02-19 06:28:50 +01:00
resetspan.appendChild(fltreset);
2016-05-24 10:42:11 +02:00
Event.add(fltreset, 'click', () => { this.onClick(); });
2015-02-19 06:28:50 +01:00
} else {
resetspan.innerHTML = this.btnResetHtml;
2016-05-24 10:42:11 +02:00
let resetEl = resetspan.firstChild;
Event.add(resetEl, 'click', () => { this.onClick(); });
2015-02-19 06:28:50 +01:00
}
this.btnResetEl = resetspan.firstChild;
this.initialized = true;
2015-02-19 06:28:50 +01:00
}
/**
* Remove clear button UI
*/
2016-05-24 10:42:11 +02:00
destroy() {
let tf = this.tf;
2015-02-19 06:28:50 +01:00
2016-05-24 10:42:11 +02:00
if (!this.initialized) {
2015-02-19 06:28:50 +01:00
return;
}
2016-05-24 10:42:11 +02:00
let resetspan = id(this.prfxResetSpan + tf.id);
if (resetspan) {
removeElm(resetspan);
2015-02-19 06:28:50 +01:00
}
this.btnResetEl = null;
this.initialized = false;
2015-02-19 06:28:50 +01:00
}
}