source: OpenRLabs-Git/deploy/rlabs-docker/web2py-rlabs/applications/admin/static/plugin_statebutton/js/bootstrap-switch.js

main
Last change on this file was 42bd667, checked in by David Fuertes <dfuertes@…>, 4 years ago

Historial Limpio

  • Property mode set to 100755
File size: 12.5 KB
Line 
1/*! ============================================================
2 * bootstrapSwitch v1.8 by Larentis Mattia @SpiritualGuru
3 * http://www.larentis.eu/
4 *
5 * Enhanced for radiobuttons by Stein, Peter @BdMdesigN
6 * http://www.bdmdesign.org/
7 *
8 * Project site:
9 * http://www.larentis.eu/switch/
10 * ============================================================
11 * Licensed under the Apache License, Version 2.0
12 * http://www.apache.org/licenses/LICENSE-2.0
13 * ============================================================ */
14
15!function ($) {
16  "use strict";
17
18  $.fn['bootstrapSwitch'] = function (method) {
19    var inputSelector = 'input[type!="hidden"]';
20    var methods = {
21      init: function () {
22        return this.each(function () {
23            var $element = $(this)
24              , $div
25              , $switchLeft
26              , $switchRight
27              , $label
28              , $form = $element.closest('form')
29              , myClasses = ""
30              , classes = $element.attr('class')
31              , color
32              , moving
33              , onLabel = "ON"
34              , offLabel = "OFF"
35              , icon = false
36              , textLabel = false;
37
38            $.each(['switch-mini', 'switch-small', 'switch-large'], function (i, el) {
39              if (classes.indexOf(el) >= 0)
40                myClasses = el;
41            });
42
43            $element.addClass('has-switch');
44
45            if ($element.data('on') !== undefined)
46              color = "switch-" + $element.data('on');
47
48            if ($element.data('on-label') !== undefined)
49              onLabel = $element.data('on-label');
50
51            if ($element.data('off-label') !== undefined)
52              offLabel = $element.data('off-label');
53
54            if ($element.data('label-icon') !== undefined)
55              icon = $element.data('label-icon');
56
57            if ($element.data('text-label') !== undefined)
58              textLabel = $element.data('text-label');
59
60            $switchLeft = $('<span>')
61              .addClass("switch-left")
62              .addClass(myClasses)
63              .addClass(color)
64              .html('' + onLabel + '');
65
66            color = '';
67            if ($element.data('off') !== undefined)
68              color = "switch-" + $element.data('off');
69
70            $switchRight = $('<span>')
71              .addClass("switch-right")
72              .addClass(myClasses)
73              .addClass(color)
74              .html('' + offLabel + '');
75
76            $label = $('<label>')
77              .html("&nbsp;")
78              .addClass(myClasses)
79              .attr('for', $element.find(inputSelector).attr('id'));
80
81            if (icon) {
82              $label.html('<i class="icon ' + icon + '"></i>');
83            }
84
85            if (textLabel) {
86              $label.html('' + textLabel + '');
87            }
88
89            $div = $element.find(inputSelector).wrap($('<div>')).parent().data('animated', false);
90
91            if ($element.data('animated') !== false)
92              $div.addClass('switch-animate').data('animated', true);
93
94            $div
95              .append($switchLeft)
96              .append($label)
97              .append($switchRight);
98
99            $element.find('>div').addClass(
100              $element.find(inputSelector).is(':checked') ? 'switch-on' : 'switch-off'
101            );
102
103            if ($element.find(inputSelector).is(':disabled'))
104              $(this).addClass('deactivate');
105
106            var changeStatus = function ($this) {
107              if ($element.parent('label').is('.label-change-switch')) {
108
109              } else {
110                $this.siblings('label').trigger('mousedown').trigger('mouseup').trigger('click');
111              }
112            };
113
114            $element.on('keydown', function (e) {
115              if (e.keyCode === 32) {
116                e.stopImmediatePropagation();
117                e.preventDefault();
118                changeStatus($(e.target).find('span:first'));
119              }
120            });
121
122            $switchLeft.on('click', function (e) {
123              changeStatus($(this));
124            });
125
126            $switchRight.on('click', function (e) {
127              changeStatus($(this));
128            });
129
130            $element.find(inputSelector).on('change', function (e, skipOnChange) {
131              var $this = $(this)
132                , $element = $this.parent()
133                , thisState = $this.is(':checked')
134                , state = $element.is('.switch-off');
135
136              e.preventDefault();
137
138              $element.css('left', '');
139
140              if (state === thisState) {
141
142                if (thisState)
143                  $element.removeClass('switch-off').addClass('switch-on');
144                else $element.removeClass('switch-on').addClass('switch-off');
145
146                if ($element.data('animated') !== false)
147                  $element.addClass("switch-animate");
148
149                if (typeof skipOnChange === 'boolean' && skipOnChange)
150                  return;
151
152                $element.parent().trigger('switch-change', {'el': $this, 'value': thisState})
153              }
154            });
155
156            $element.find('label').on('mousedown touchstart', function (e) {
157              var $this = $(this);
158              moving = false;
159
160              e.preventDefault();
161              e.stopImmediatePropagation();
162
163              $this.closest('div').removeClass('switch-animate');
164
165              if ($this.closest('.has-switch').is('.deactivate')) {
166                $this.unbind('click');
167              } else if ($this.closest('.switch-on').parent().is('.radio-no-uncheck')) {
168                $this.unbind('click');
169              } else {
170                $this.on('mousemove touchmove', function (e) {
171                  var $element = $(this).closest('.make-switch')
172                    , relativeX = (e.pageX || e.originalEvent.targetTouches[0].pageX) - $element.offset().left
173                    , percent = (relativeX / $element.width()) * 100
174                    , left = 25
175                    , right = 75;
176
177                  moving = true;
178
179                  if (percent < left)
180                    percent = left;
181                  else if (percent > right)
182                    percent = right;
183
184                  $element.find('>div').css('left', (percent - right) + "%")
185                });
186
187                $this.on('click touchend', function (e) {
188                  var $this = $(this)
189                    , $myInputBox = $this.siblings('input');
190
191                  e.stopImmediatePropagation();
192                  e.preventDefault();
193
194                  $this.unbind('mouseleave');
195
196                  if (moving)
197                    $myInputBox.prop('checked', !(parseInt($this.parent().css('left')) < -25));
198                  else
199                    $myInputBox.prop("checked", !$myInputBox.is(":checked"));
200
201                  moving = false;
202                  $myInputBox.trigger('change');
203                });
204
205                $this.on('mouseleave', function (e) {
206                  var $this = $(this)
207                    , $myInputBox = $this.siblings('input');
208
209                  e.preventDefault();
210                  e.stopImmediatePropagation();
211
212                  $this.unbind('mouseleave mousemove');
213                  $this.trigger('mouseup');
214
215                  $myInputBox.prop('checked', !(parseInt($this.parent().css('left')) < -25)).trigger('change');
216                });
217
218                $this.on('mouseup', function (e) {
219                  e.stopImmediatePropagation();
220                  e.preventDefault();
221
222                  $(this).trigger('mouseleave');
223                });
224              }
225            });
226
227            if ($form.data('bootstrapSwitch') !== 'injected') {
228              $form.bind('reset', function () {
229                setTimeout(function () {
230                  $form.find('.make-switch').each(function () {
231                    var $input = $(this).find(inputSelector);
232
233                    $input.prop('checked', $input.is(':checked')).trigger('change');
234                  });
235                }, 1);
236              });
237              $form.data('bootstrapSwitch', 'injected');
238            }
239          }
240        );
241      },
242      toggleActivation: function () {
243        var $this = $(this);
244
245        $this.toggleClass('deactivate');
246        $this.find(inputSelector).prop('disabled', $this.is('.deactivate'));
247      },
248      isActive: function () {
249        return !$(this).hasClass('deactivate');
250      },
251      setActive: function (active) {
252        var $this = $(this);
253
254        if (active) {
255          $this.removeClass('deactivate');
256          $this.find(inputSelector).removeAttr('disabled');
257        }
258        else {
259          $this.addClass('deactivate');
260          $this.find(inputSelector).attr('disabled', 'disabled');
261        }
262      },
263      toggleState: function (skipOnChange) {
264        var $input = $(this).find(':checkbox');
265        $input.prop('checked', !$input.is(':checked')).trigger('change', skipOnChange);
266      },
267      toggleRadioState: function (skipOnChange) {
268        var $radioinput = $(this).find(':radio');
269        $radioinput.not(':checked').prop('checked', !$radioinput.is(':checked')).trigger('change', skipOnChange);
270      },
271      toggleRadioStateAllowUncheck: function (uncheck, skipOnChange) {
272        var $radioinput = $(this).find(':radio');
273        if (uncheck) {
274          $radioinput.not(':checked').trigger('change', skipOnChange);
275        }
276        else {
277          $radioinput.not(':checked').prop('checked', !$radioinput.is(':checked')).trigger('change', skipOnChange);
278        }
279      },
280      setState: function (value, skipOnChange) {
281        $(this).find(inputSelector).prop('checked', value).trigger('change', skipOnChange);
282      },
283      setOnLabel: function (value) {
284        var $switchLeft = $(this).find(".switch-left");
285        $switchLeft.html(value);
286      },
287      setOffLabel: function (value) {
288        var $switchRight = $(this).find(".switch-right");
289        $switchRight.html(value);
290      },
291      setOnClass: function (value) {
292        var $switchLeft = $(this).find(".switch-left");
293        var color = '';
294        if (value !== undefined) {
295          if ($(this).attr('data-on') !== undefined) {
296            color = "switch-" + $(this).attr('data-on')
297          }
298          $switchLeft.removeClass(color);
299          color = "switch-" + value;
300          $switchLeft.addClass(color);
301        }
302      },
303      setOffClass: function (value) {
304        var $switchRight = $(this).find(".switch-right");
305        var color = '';
306        if (value !== undefined) {
307          if ($(this).attr('data-off') !== undefined) {
308            color = "switch-" + $(this).attr('data-off')
309          }
310          $switchRight.removeClass(color);
311          color = "switch-" + value;
312          $switchRight.addClass(color);
313        }
314      },
315      setAnimated: function (value) {
316        var $element = $(this).find(inputSelector).parent();
317        if (value === undefined) value = false;
318        $element.data('animated', value);
319        $element.attr('data-animated', value);
320
321        if ($element.data('animated') !== false) {
322          $element.addClass("switch-animate");
323        } else {
324          $element.removeClass("switch-animate");
325        }
326      },
327      setSizeClass: function (value) {
328        var $element = $(this);
329        var $switchLeft = $element.find(".switch-left");
330        var $switchRight = $element.find(".switch-right");
331        var $label = $element.find("label");
332        $.each(['switch-mini', 'switch-small', 'switch-large'], function (i, el) {
333          if (el !== value) {
334            $switchLeft.removeClass(el);
335            $switchRight.removeClass(el);
336            $label.removeClass(el);
337          } else {
338            $switchLeft.addClass(el);
339            $switchRight.addClass(el);
340            $label.addClass(el);
341          }
342        });
343      },
344      status: function () {
345        return $(this).find(inputSelector).is(':checked');
346      },
347      destroy: function () {
348        var $element = $(this)
349          , $div = $element.find('div')
350          , $form = $element.closest('form')
351          , $inputbox;
352
353        $div.find(':not(input)').remove();
354
355        $inputbox = $div.children();
356        $inputbox.unwrap().unwrap();
357
358        $inputbox.unbind('change');
359
360        if ($form) {
361          $form.unbind('reset');
362          $form.removeData('bootstrapSwitch');
363        }
364
365        return $inputbox;
366      }
367    };
368
369    if (methods[method])
370      return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
371    else if (typeof method === 'object' || !method)
372      return methods.init.apply(this, arguments);
373    else
374      $.error('Method ' + method + ' does not exist!');
375  };
376}(jQuery);
377
378(function ($) {
379  $(function () {
380    $('.make-switch')['bootstrapSwitch']();
381  });
382})(jQuery);
Note: See TracBrowser for help on using the repository browser.