mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2025-02-02 21:04:13 +03:00
converted togglebutton to es6
This commit is contained in:
parent
d1fe1a06dd
commit
2eb61027da
|
@ -104,7 +104,7 @@ module.exports = function (grunt) {
|
||||||
'js/dist/ripples.js' : 'js/src/ripples.js',
|
'js/dist/ripples.js' : 'js/src/ripples.js',
|
||||||
'js/dist/autofill.js' : 'js/src/autofill.js',
|
'js/dist/autofill.js' : 'js/src/autofill.js',
|
||||||
'js/dist/checkbox.js' : 'js/src/checkbox.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/collapse.js' : 'js/src/collapse.js',
|
||||||
//'js/dist/dropdown.js' : 'js/src/dropdown.js',
|
//'js/dist/dropdown.js' : 'js/src/dropdown.js',
|
||||||
//'js/dist/modal.js' : 'js/src/modal.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/ripples.js' : 'js/src/ripples.js',
|
||||||
'dist/js/umd/autofill.js' : 'js/src/autofill.js',
|
'dist/js/umd/autofill.js' : 'js/src/autofill.js',
|
||||||
'dist/js/umd/checkbox.js' : 'js/src/checkbox.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/carousel.js' : 'js/src/carousel.js',
|
||||||
//'dist/js/umd/collapse.js' : 'js/src/collapse.js',
|
//'dist/js/umd/collapse.js' : 'js/src/collapse.js',
|
||||||
//'dist/js/umd/dropdown.js' : 'js/src/dropdown.js',
|
//'dist/js/umd/dropdown.js' : 'js/src/dropdown.js',
|
||||||
|
@ -194,7 +194,7 @@ module.exports = function (grunt) {
|
||||||
'js/src/ripples.js',
|
'js/src/ripples.js',
|
||||||
'js/src/autofill.js',
|
'js/src/autofill.js',
|
||||||
'js/src/checkbox.js',
|
'js/src/checkbox.js',
|
||||||
//'js/src/carousel.js',
|
'js/src/togglebutton.js',
|
||||||
//'js/src/collapse.js',
|
//'js/src/collapse.js',
|
||||||
//'js/src/dropdown.js',
|
//'js/src/dropdown.js',
|
||||||
//'js/src/modal.js',
|
//'js/src/modal.js',
|
||||||
|
|
|
@ -59,12 +59,12 @@
|
||||||
// .data("mdproc", true)
|
// .data("mdproc", true)
|
||||||
// .after("<span class='checkbox-material'><span class='check'></span></span>");
|
// .after("<span class='checkbox-material'><span class='check'></span></span>");
|
||||||
//},
|
//},
|
||||||
"togglebutton": function(selector) {
|
//"togglebutton": function(selector) {
|
||||||
$((selector) ? selector : this.options.togglebuttonElements)
|
// $((selector) ? selector : this.options.togglebuttonElements)
|
||||||
.filter(":notmdproc")
|
// .filter(":notmdproc")
|
||||||
.data("mdproc", true)
|
// .data("mdproc", true)
|
||||||
.after("<span class='toggle'></span>");
|
// .after("<span class='toggle'></span>");
|
||||||
},
|
//},
|
||||||
"radio": function(selector) {
|
"radio": function(selector) {
|
||||||
// Add fake-radio to material radios
|
// Add fake-radio to material radios
|
||||||
$((selector) ? selector : this.options.radioElements)
|
$((selector) ? selector : this.options.radioElements)
|
||||||
|
@ -241,11 +241,12 @@
|
||||||
this.attachInputEventHandlers();
|
this.attachInputEventHandlers();
|
||||||
}
|
}
|
||||||
if (this.options.checkbox) {
|
if (this.options.checkbox) {
|
||||||
this.checkbox();
|
//this.checkbox();
|
||||||
$(this.options.checkboxElements).checkbox()
|
$(this.options.checkboxElements).checkbox()
|
||||||
}
|
}
|
||||||
if (this.options.togglebutton) {
|
if (this.options.togglebutton) {
|
||||||
this.togglebutton();
|
//this.togglebutton();
|
||||||
|
$(this.options.togglebuttonElements).togglebutton()
|
||||||
}
|
}
|
||||||
if (this.options.radio) {
|
if (this.options.radio) {
|
||||||
this.radio();
|
this.radio();
|
||||||
|
@ -279,7 +280,7 @@
|
||||||
}
|
}
|
||||||
if (this.options.togglebutton) {
|
if (this.options.togglebutton) {
|
||||||
$document.arrive(this.options.togglebuttonElements, function() {
|
$document.arrive(this.options.togglebuttonElements, function() {
|
||||||
$.material.togglebutton($(this));
|
$(this).togglebutton();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
72
js/src/togglebutton.js
Normal file
72
js/src/togglebutton.js
Normal file
|
@ -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: `<span class='toggle'></span>`
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ------------------------------------------------------------------------
|
||||||
|
* 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
|
Loading…
Reference in New Issue
Block a user