From 2eb61027da4e69ab3ab790634f30ffd5f2dbc72d Mon Sep 17 00:00:00 2001 From: Kevin Ross Date: Tue, 1 Dec 2015 12:47:00 -0600 Subject: [PATCH] converted togglebutton to es6 --- Gruntfile.js | 6 ++-- js/src/old/material.js | 19 +++++------ js/src/togglebutton.js | 72 ++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 85 insertions(+), 12 deletions(-) create mode 100644 js/src/togglebutton.js diff --git a/Gruntfile.js b/Gruntfile.js index 32781723..bba33a80 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -104,7 +104,7 @@ module.exports = function (grunt) { 'js/dist/ripples.js' : 'js/src/ripples.js', 'js/dist/autofill.js' : 'js/src/autofill.js', 'js/dist/checkbox.js' : 'js/src/checkbox.js', - //'js/dist/carousel.js' : 'js/src/carousel.js', + 'js/dist/togglebutton.js' : 'js/src/togglebutton.js', //'js/dist/collapse.js' : 'js/src/collapse.js', //'js/dist/dropdown.js' : 'js/src/dropdown.js', //'js/dist/modal.js' : 'js/src/modal.js', @@ -131,7 +131,7 @@ module.exports = function (grunt) { 'dist/js/umd/ripples.js' : 'js/src/ripples.js', 'dist/js/umd/autofill.js' : 'js/src/autofill.js', 'dist/js/umd/checkbox.js' : 'js/src/checkbox.js', - //'dist/js/umd/button.js' : 'js/src/button.js', + 'dist/js/umd/togglebutton.js' : 'js/src/togglebutton.js', //'dist/js/umd/carousel.js' : 'js/src/carousel.js', //'dist/js/umd/collapse.js' : 'js/src/collapse.js', //'dist/js/umd/dropdown.js' : 'js/src/dropdown.js', @@ -194,7 +194,7 @@ module.exports = function (grunt) { 'js/src/ripples.js', 'js/src/autofill.js', 'js/src/checkbox.js', - //'js/src/carousel.js', + 'js/src/togglebutton.js', //'js/src/collapse.js', //'js/src/dropdown.js', //'js/src/modal.js', diff --git a/js/src/old/material.js b/js/src/old/material.js index a63c14c2..b75e4422 100644 --- a/js/src/old/material.js +++ b/js/src/old/material.js @@ -59,12 +59,12 @@ // .data("mdproc", true) // .after(""); //}, - "togglebutton": function(selector) { - $((selector) ? selector : this.options.togglebuttonElements) - .filter(":notmdproc") - .data("mdproc", true) - .after(""); - }, + //"togglebutton": function(selector) { + // $((selector) ? selector : this.options.togglebuttonElements) + // .filter(":notmdproc") + // .data("mdproc", true) + // .after(""); + //}, "radio": function(selector) { // Add fake-radio to material radios $((selector) ? selector : this.options.radioElements) @@ -241,11 +241,12 @@ this.attachInputEventHandlers(); } if (this.options.checkbox) { - this.checkbox(); + //this.checkbox(); $(this.options.checkboxElements).checkbox() } if (this.options.togglebutton) { - this.togglebutton(); + //this.togglebutton(); + $(this.options.togglebuttonElements).togglebutton() } if (this.options.radio) { this.radio(); @@ -279,7 +280,7 @@ } if (this.options.togglebutton) { $document.arrive(this.options.togglebuttonElements, function() { - $.material.togglebutton($(this)); + $(this).togglebutton(); }); } diff --git a/js/src/togglebutton.js b/js/src/togglebutton.js new file mode 100644 index 00000000..433fccb1 --- /dev/null +++ b/js/src/togglebutton.js @@ -0,0 +1,72 @@ +//import Util from './util' + +const Togglebutton = (($) => { + + /** + * ------------------------------------------------------------------------ + * Constants + * ------------------------------------------------------------------------ + */ + const NAME = 'togglebutton' + const DATA_KEY = `mdb.${NAME}` + const JQUERY_NO_CONFLICT = $.fn[NAME] + + const Default = { + template: `` + } + + /** + * ------------------------------------------------------------------------ + * Class Definition + * ------------------------------------------------------------------------ + */ + class Togglebutton { + + constructor(element, config) { + this.element = element + this.config = $.extend({}, Default, config) + + this.element.after(this.config.template) + } + + dispose() { + $.removeData(this.element, DATA_KEY) + this.element = null + this.config = null + } + + // ------------------------------------------------------------------------ + // private + + // ------------------------------------------------------------------------ + // static + static _jQueryInterface(config) { + return this.each(function () { + let $element = $(this) + let data = $element.data(DATA_KEY) + + if (!data) { + data = new Togglebutton(this, config) + $element.data(DATA_KEY, data) + } + }) + } + } + + /** + * ------------------------------------------------------------------------ + * jQuery + * ------------------------------------------------------------------------ + */ + $.fn[NAME] = Togglebutton._jQueryInterface + $.fn[NAME].Constructor = Togglebutton + $.fn[NAME].noConflict = () => { + $.fn[NAME] = JQUERY_NO_CONFLICT + return Togglebutton._jQueryInterface + } + + return Togglebutton + +})(jQuery) + +export default Togglebutton