view/theme/frio/frameworks/bootstrap-toggle/js/bootstrap2-toggle.js

   1 /*! ========================================================================
   2  * Bootstrap Toggle: bootstrap2-toggle.js v2.2.0
   3  * http://www.bootstraptoggle.com
   4  * ========================================================================
   5  * Copyright 2014 Min Hur, The New York Times Company
   6  * Licensed under MIT
   7  * ======================================================================== */
   8
   9
  10  +function ($) {
  11         'use strict';
  12
  13         // TOGGLE PUBLIC CLASS DEFINITION
  14         // ==============================
  15
  16         var Toggle = function (element, options) {
  17                 this.$element  = $(element)
  18                 this.options   = $.extend({}, this.defaults(), options)
  19                 this.render()
  20         }
  21
  22         Toggle.VERSION  = '2.2.0'
  23
  24         Toggle.DEFAULTS = {
  25                 on: 'On',
  26                 off: 'Off',
  27                 onstyle: 'primary',
  28                 offstyle: 'default',
  29                 size: 'normal',
  30                 style: '',
  31                 width: null,
  32                 height: null
  33         }
  34
  35         Toggle.prototype.defaults = function() {
  36                 return {
  37                         on: this.$element.attr('data-on') || Toggle.DEFAULTS.on,
  38                         off: this.$element.attr('data-off') || Toggle.DEFAULTS.off,
  39                         onstyle: this.$element.attr('data-onstyle') || Toggle.DEFAULTS.onstyle,
  40                         offstyle: this.$element.attr('data-offstyle') || Toggle.DEFAULTS.offstyle,
  41                         size: this.$element.attr('data-size') || Toggle.DEFAULTS.size,
  42                         style: this.$element.attr('data-style') || Toggle.DEFAULTS.style,
  43                         width: this.$element.attr('data-width') || Toggle.DEFAULTS.width,
  44                         height: this.$element.attr('data-height') || Toggle.DEFAULTS.height
  45                 }
  46         }
  47
  48         Toggle.prototype.render = function () {
  49                 this._onstyle = 'btn-' + this.options.onstyle
  50                 this._offstyle = 'btn-' + this.options.offstyle
  51                 var size = this.options.size === 'large' ? 'btn-large'
  52                         : this.options.size === 'small' ? 'btn-small'
  53                         : this.options.size === 'mini' ? 'btn-mini'
  54                         : ''
  55                 var $toggleOn = $('<label class="btn">').html(this.options.on)
  56                         .addClass(this._onstyle + ' ' + size)
  57                 var $toggleOff = $('<label class="btn">').html(this.options.off)
  58                         .addClass(this._offstyle + ' ' + size + ' active')
  59                 var $toggleHandle = $('<span class="toggle-handle btn btn-default">')
  60                         .addClass(size)
  61                 var $toggleGroup = $('<div class="toggle-group">')
  62                         .append($toggleOn, $toggleOff, $toggleHandle)
  63                 var $toggle = $('<div class="toggle btn" data-toggle="toggle">')
  64                         .addClass( this.$element.prop('checked') ? this._onstyle : this._offstyle+' off' )
  65                         .addClass(size).addClass(this.options.style)
  66
  67                 this.$element.wrap($toggle)
  68                 $.extend(this, {
  69                         $toggle: this.$element.parent(),
  70                         $toggleOn: $toggleOn,
  71                         $toggleOff: $toggleOff,
  72                         $toggleGroup: $toggleGroup
  73                 })
  74                 this.$toggle.append($toggleGroup)
  75
  76                 var width = this.options.width || Math.max($toggleOn.width(), $toggleOff.width())+($toggleHandle.outerWidth()/2)
  77                 var height = this.options.height || Math.max($toggleOn.height(), $toggleOff.height())
  78                 $toggleOn.addClass('toggle-on')
  79                 $toggleOff.addClass('toggle-off')
  80                 this.$toggle.css({ width: width, height: height })
  81                 if (this.options.height) {
  82                         $toggleOn.css('line-height', $toggleOn.height() + 'px')
  83                         $toggleOff.css('line-height', $toggleOff.height() + 'px')
  84                 }
  85                 this.update(true)
  86                 this.trigger(true)
  87         }
  88
  89         Toggle.prototype.toggle = function () {
  90                 if (this.$element.prop('checked')) this.off()
  91                 else this.on()
  92         }
  93
  94         Toggle.prototype.on = function (silent) {
  95                 if (this.$element.prop('disabled')) return false
  96                 this.$toggle.removeClass(this._offstyle + ' off').addClass(this._onstyle)
  97                 this.$element.prop('checked', true)
  98                 if (!silent) this.trigger()
  99         }
 100
 101         Toggle.prototype.off = function (silent) {
 102                 if (this.$element.prop('disabled')) return false
 103                 this.$toggle.removeClass(this._onstyle).addClass(this._offstyle + ' off')
 104                 this.$element.prop('checked', false)
 105                 if (!silent) this.trigger()
 106         }
 107
 108         Toggle.prototype.enable = function () {
 109                 this.$toggle.removeAttr('disabled')
 110                 this.$element.prop('disabled', false)
 111         }
 112
 113         Toggle.prototype.disable = function () {
 114                 this.$toggle.attr('disabled', 'disabled')
 115                 this.$element.prop('disabled', true)
 116         }
 117
 118         Toggle.prototype.update = function (silent) {
 119                 if (this.$element.prop('disabled')) this.disable()
 120                 else this.enable()
 121                 if (this.$element.prop('checked')) this.on(silent)
 122                 else this.off(silent)
 123         }
 124
 125         Toggle.prototype.trigger = function (silent) {
 126                 this.$element.off('change.bs.toggle')
 127                 if (!silent) this.$element.change()
 128                 this.$element.on('change.bs.toggle', $.proxy(function() {
 129                         this.update()
 130                 }, this))
 131         }
 132
 133         Toggle.prototype.destroy = function() {
 134                 this.$element.off('change.bs.toggle')
 135                 this.$toggleGroup.remove()
 136                 this.$element.removeData('bs.toggle')
 137                 this.$element.unwrap()
 138         }
 139
 140         // TOGGLE PLUGIN DEFINITION
 141         // ========================
 142
 143         function Plugin(option) {
 144                 return this.each(function () {
 145                         var $this   = $(this)
 146                         var data    = $this.data('bs.toggle')
 147                         var options = typeof option == 'object' && option
 148
 149                         if (!data) $this.data('bs.toggle', (data = new Toggle(this, options)))
 150                         if (typeof option == 'string' && data[option]) data[option]()
 151                 })
 152         }
 153
 154         var old = $.fn.bootstrapToggle
 155
 156         $.fn.bootstrapToggle             = Plugin
 157         $.fn.bootstrapToggle.Constructor = Toggle
 158
 159         // TOGGLE NO CONFLICT
 160         // ==================
 161
 162         $.fn.toggle.noConflict = function () {
 163                 $.fn.bootstrapToggle = old
 164                 return this
 165         }
 166
 167         // TOGGLE DATA-API
 168         // ===============
 169
 170         $(function() {
 171                 $('input[type=checkbox][data-toggle^=toggle]').bootstrapToggle()
 172         })
 173
 174         $(document).on('click.bs.toggle', 'div[data-toggle^=toggle]', function(e) {
 175                 var $checkbox = $(this).find('input[type=checkbox]')
 176                 $checkbox.bootstrapToggle('toggle')
 177                 e.preventDefault()
 178         })
 179
 180 }(jQuery);