bootstrap-switch.js 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532
  1. /* ========================================================================
  2. * bootstrap-switch - v3.0.2
  3. * http://www.bootstrap-switch.org
  4. * ========================================================================
  5. * Copyright 2012-2013 Mattia Larentis
  6. *
  7. * ========================================================================
  8. * Licensed under the Apache License, Version 2.0 (the "License");
  9. * you may not use this file except in compliance with the License.
  10. * You may obtain a copy of the License at
  11. *
  12. * http://www.apache.org/licenses/LICENSE-2.0
  13. *
  14. * Unless required by applicable law or agreed to in writing, software
  15. * distributed under the License is distributed on an "AS IS" BASIS,
  16. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  17. * See the License for the specific language governing permissions and
  18. * limitations under the License.
  19. * ========================================================================
  20. */
  21. (function() {
  22. var __slice = [].slice;
  23. (function($, window) {
  24. "use strict";
  25. var BootstrapSwitch;
  26. BootstrapSwitch = (function() {
  27. function BootstrapSwitch(element, options) {
  28. if (options == null) {
  29. options = {};
  30. }
  31. this.$element = $(element);
  32. this.options = $.extend({}, $.fn.bootstrapSwitch.defaults, {
  33. state: this.$element.is(":checked"),
  34. size: this.$element.data("size"),
  35. animate: this.$element.data("animate"),
  36. disabled: this.$element.is(":disabled"),
  37. readonly: this.$element.is("[readonly]"),
  38. indeterminate: this.$element.data("indeterminate"),
  39. onColor: this.$element.data("on-color"),
  40. offColor: this.$element.data("off-color"),
  41. onText: this.$element.data("on-text"),
  42. offText: this.$element.data("off-text"),
  43. labelText: this.$element.data("label-text"),
  44. baseClass: this.$element.data("base-class"),
  45. wrapperClass: this.$element.data("wrapper-class"),
  46. radioAllOff: this.$element.data("radio-all-off")
  47. }, options);
  48. this.$wrapper = $("<div>", {
  49. "class": (function(_this) {
  50. return function() {
  51. var classes;
  52. classes = ["" + _this.options.baseClass].concat(_this._getClasses(_this.options.wrapperClass));
  53. classes.push(_this.options.state ? "" + _this.options.baseClass + "-on" : "" + _this.options.baseClass + "-off");
  54. if (_this.options.size != null) {
  55. classes.push("" + _this.options.baseClass + "-" + _this.options.size);
  56. }
  57. if (_this.options.animate) {
  58. classes.push("" + _this.options.baseClass + "-animate");
  59. }
  60. if (_this.options.disabled) {
  61. classes.push("" + _this.options.baseClass + "-disabled");
  62. }
  63. if (_this.options.readonly) {
  64. classes.push("" + _this.options.baseClass + "-readonly");
  65. }
  66. if (_this.options.indeterminate) {
  67. classes.push("" + _this.options.baseClass + "-indeterminate");
  68. }
  69. if (_this.$element.attr("id")) {
  70. classes.push("" + _this.options.baseClass + "-id-" + (_this.$element.attr("id")));
  71. }
  72. return classes.join(" ");
  73. };
  74. })(this)()
  75. });
  76. this.$container = $("<div>", {
  77. "class": "" + this.options.baseClass + "-container"
  78. });
  79. this.$on = $("<span>", {
  80. html: this.options.onText,
  81. "class": "" + this.options.baseClass + "-handle-on " + this.options.baseClass + "-" + this.options.onColor
  82. });
  83. this.$off = $("<span>", {
  84. html: this.options.offText,
  85. "class": "" + this.options.baseClass + "-handle-off " + this.options.baseClass + "-" + this.options.offColor
  86. });
  87. this.$label = $("<label>", {
  88. html: this.options.labelText,
  89. "class": "" + this.options.baseClass + "-label"
  90. });
  91. if (this.options.indeterminate) {
  92. this.$element.prop("indeterminate", true);
  93. }
  94. this.$element.on("init.bootstrapSwitch", (function(_this) {
  95. return function() {
  96. return _this.options.onInit.apply(element, arguments);
  97. };
  98. })(this));
  99. this.$element.on("switchChange.bootstrapSwitch", (function(_this) {
  100. return function() {
  101. return _this.options.onSwitchChange.apply(element, arguments);
  102. };
  103. })(this));
  104. this.$container = this.$element.wrap(this.$container).parent();
  105. this.$wrapper = this.$container.wrap(this.$wrapper).parent();
  106. this.$element.before(this.$on).before(this.$label).before(this.$off).trigger("init.bootstrapSwitch");
  107. this._elementHandlers();
  108. this._handleHandlers();
  109. this._labelHandlers();
  110. this._formHandler();
  111. }
  112. BootstrapSwitch.prototype._constructor = BootstrapSwitch;
  113. BootstrapSwitch.prototype.state = function(value, skip) {
  114. if (typeof value === "undefined") {
  115. return this.options.state;
  116. }
  117. if (this.options.disabled || this.options.readonly || this.options.indeterminate) {
  118. return this.$element;
  119. }
  120. if (this.options.state && !this.options.radioAllOff && this.$element.is(':radio')) {
  121. return this.$element;
  122. }
  123. value = !!value;
  124. this.$element.prop("checked", value).trigger("change.bootstrapSwitch", skip);
  125. return this.$element;
  126. };
  127. BootstrapSwitch.prototype.toggleState = function(skip) {
  128. if (this.options.disabled || this.options.readonly || this.options.indeterminate) {
  129. return this.$element;
  130. }
  131. return this.$element.prop("checked", !this.options.state).trigger("change.bootstrapSwitch", skip);
  132. };
  133. BootstrapSwitch.prototype.size = function(value) {
  134. if (typeof value === "undefined") {
  135. return this.options.size;
  136. }
  137. if (this.options.size != null) {
  138. this.$wrapper.removeClass("" + this.options.baseClass + "-" + this.options.size);
  139. }
  140. if (value) {
  141. this.$wrapper.addClass("" + this.options.baseClass + "-" + value);
  142. }
  143. this.options.size = value;
  144. return this.$element;
  145. };
  146. BootstrapSwitch.prototype.animate = function(value) {
  147. if (typeof value === "undefined") {
  148. return this.options.animate;
  149. }
  150. value = !!value;
  151. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-animate");
  152. this.options.animate = value;
  153. return this.$element;
  154. };
  155. BootstrapSwitch.prototype.disabled = function(value) {
  156. if (typeof value === "undefined") {
  157. return this.options.disabled;
  158. }
  159. value = !!value;
  160. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-disabled");
  161. this.$element.prop("disabled", value);
  162. this.options.disabled = value;
  163. return this.$element;
  164. };
  165. BootstrapSwitch.prototype.toggleDisabled = function() {
  166. this.$element.prop("disabled", !this.options.disabled);
  167. this.$wrapper.toggleClass("" + this.options.baseClass + "-disabled");
  168. this.options.disabled = !this.options.disabled;
  169. return this.$element;
  170. };
  171. BootstrapSwitch.prototype.readonly = function(value) {
  172. if (typeof value === "undefined") {
  173. return this.options.readonly;
  174. }
  175. value = !!value;
  176. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-readonly");
  177. this.$element.prop("readonly", value);
  178. this.options.readonly = value;
  179. return this.$element;
  180. };
  181. BootstrapSwitch.prototype.toggleReadonly = function() {
  182. this.$element.prop("readonly", !this.options.readonly);
  183. this.$wrapper.toggleClass("" + this.options.baseClass + "-readonly");
  184. this.options.readonly = !this.options.readonly;
  185. return this.$element;
  186. };
  187. BootstrapSwitch.prototype.indeterminate = function(value) {
  188. if (typeof value === "undefined") {
  189. return this.options.indeterminate;
  190. }
  191. value = !!value;
  192. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-indeterminate");
  193. this.$element.prop("indeterminate", value);
  194. this.options.indeterminate = value;
  195. return this.$element;
  196. };
  197. BootstrapSwitch.prototype.toggleIndeterminate = function() {
  198. this.$element.prop("indeterminate", !this.options.indeterminate);
  199. this.$wrapper.toggleClass("" + this.options.baseClass + "-indeterminate");
  200. this.options.indeterminate = !this.options.indeterminate;
  201. return this.$element;
  202. };
  203. BootstrapSwitch.prototype.onColor = function(value) {
  204. var color;
  205. color = this.options.onColor;
  206. if (typeof value === "undefined") {
  207. return color;
  208. }
  209. if (color != null) {
  210. this.$on.removeClass("" + this.options.baseClass + "-" + color);
  211. }
  212. this.$on.addClass("" + this.options.baseClass + "-" + value);
  213. this.options.onColor = value;
  214. return this.$element;
  215. };
  216. BootstrapSwitch.prototype.offColor = function(value) {
  217. var color;
  218. color = this.options.offColor;
  219. if (typeof value === "undefined") {
  220. return color;
  221. }
  222. if (color != null) {
  223. this.$off.removeClass("" + this.options.baseClass + "-" + color);
  224. }
  225. this.$off.addClass("" + this.options.baseClass + "-" + value);
  226. this.options.offColor = value;
  227. return this.$element;
  228. };
  229. BootstrapSwitch.prototype.onText = function(value) {
  230. if (typeof value === "undefined") {
  231. return this.options.onText;
  232. }
  233. this.$on.html(value);
  234. this.options.onText = value;
  235. return this.$element;
  236. };
  237. BootstrapSwitch.prototype.offText = function(value) {
  238. if (typeof value === "undefined") {
  239. return this.options.offText;
  240. }
  241. this.$off.html(value);
  242. this.options.offText = value;
  243. return this.$element;
  244. };
  245. BootstrapSwitch.prototype.labelText = function(value) {
  246. if (typeof value === "undefined") {
  247. return this.options.labelText;
  248. }
  249. this.$label.html(value);
  250. this.options.labelText = value;
  251. return this.$element;
  252. };
  253. BootstrapSwitch.prototype.baseClass = function(value) {
  254. return this.options.baseClass;
  255. };
  256. BootstrapSwitch.prototype.wrapperClass = function(value) {
  257. if (typeof value === "undefined") {
  258. return this.options.wrapperClass;
  259. }
  260. if (!value) {
  261. value = $.fn.bootstrapSwitch.defaults.wrapperClass;
  262. }
  263. this.$wrapper.removeClass(this._getClasses(this.options.wrapperClass).join(" "));
  264. this.$wrapper.addClass(this._getClasses(value).join(" "));
  265. this.options.wrapperClass = value;
  266. return this.$element;
  267. };
  268. BootstrapSwitch.prototype.radioAllOff = function(value) {
  269. if (typeof value === "undefined") {
  270. return this.options.radioAllOff;
  271. }
  272. this.options.radioAllOff = value;
  273. return this.$element;
  274. };
  275. BootstrapSwitch.prototype.onInit = function(value) {
  276. if (typeof value === "undefined") {
  277. return this.options.onInit;
  278. }
  279. if (!value) {
  280. value = $.fn.bootstrapSwitch.defaults.onInit;
  281. }
  282. this.options.onInit = value;
  283. return this.$element;
  284. };
  285. BootstrapSwitch.prototype.onSwitchChange = function(value) {
  286. if (typeof value === "undefined") {
  287. return this.options.onSwitchChange;
  288. }
  289. if (!value) {
  290. value = $.fn.bootstrapSwitch.defaults.onSwitchChange;
  291. }
  292. this.options.onSwitchChange = value;
  293. return this.$element;
  294. };
  295. BootstrapSwitch.prototype.destroy = function() {
  296. var $form;
  297. $form = this.$element.closest("form");
  298. if ($form.length) {
  299. $form.off("reset.bootstrapSwitch").removeData("bootstrap-switch");
  300. }
  301. this.$container.children().not(this.$element).remove();
  302. this.$element.unwrap().unwrap().off(".bootstrapSwitch").removeData("bootstrap-switch");
  303. return this.$element;
  304. };
  305. BootstrapSwitch.prototype._elementHandlers = function() {
  306. return this.$element.on({
  307. "change.bootstrapSwitch": (function(_this) {
  308. return function(e, skip) {
  309. var checked;
  310. e.preventDefault();
  311. e.stopImmediatePropagation();
  312. checked = _this.$element.is(":checked");
  313. if (checked === _this.options.state) {
  314. return;
  315. }
  316. _this.options.state = checked;
  317. _this.$wrapper.removeClass(checked ? "" + _this.options.baseClass + "-off" : "" + _this.options.baseClass + "-on").addClass(checked ? "" + _this.options.baseClass + "-on" : "" + _this.options.baseClass + "-off");
  318. if (!skip) {
  319. if (_this.$element.is(":radio")) {
  320. $("[name='" + (_this.$element.attr('name')) + "']").not(_this.$element).prop("checked", false).trigger("change.bootstrapSwitch", true);
  321. }
  322. return _this.$element.trigger("switchChange.bootstrapSwitch", [checked]);
  323. }
  324. };
  325. })(this),
  326. "focus.bootstrapSwitch": (function(_this) {
  327. return function(e) {
  328. e.preventDefault();
  329. return _this.$wrapper.addClass("" + _this.options.baseClass + "-focused");
  330. };
  331. })(this),
  332. "blur.bootstrapSwitch": (function(_this) {
  333. return function(e) {
  334. e.preventDefault();
  335. return _this.$wrapper.removeClass("" + _this.options.baseClass + "-focused");
  336. };
  337. })(this),
  338. "keydown.bootstrapSwitch": (function(_this) {
  339. return function(e) {
  340. if (!e.which || _this.options.disabled || _this.options.readonly || _this.options.indeterminate) {
  341. return;
  342. }
  343. switch (e.which) {
  344. case 37:
  345. e.preventDefault();
  346. e.stopImmediatePropagation();
  347. return _this.state(false);
  348. case 39:
  349. e.preventDefault();
  350. e.stopImmediatePropagation();
  351. return _this.state(true);
  352. }
  353. };
  354. })(this)
  355. });
  356. };
  357. BootstrapSwitch.prototype._handleHandlers = function() {
  358. this.$on.on("click.bootstrapSwitch", (function(_this) {
  359. return function(e) {
  360. _this.state(false);
  361. return _this.$element.trigger("focus.bootstrapSwitch");
  362. };
  363. })(this));
  364. return this.$off.on("click.bootstrapSwitch", (function(_this) {
  365. return function(e) {
  366. _this.state(true);
  367. return _this.$element.trigger("focus.bootstrapSwitch");
  368. };
  369. })(this));
  370. };
  371. BootstrapSwitch.prototype._labelHandlers = function() {
  372. return this.$label.on({
  373. "mousemove.bootstrapSwitch touchmove.bootstrapSwitch": (function(_this) {
  374. return function(e) {
  375. var left, pageX, percent, right;
  376. if (!_this.isLabelDragging) {
  377. return;
  378. }
  379. e.preventDefault();
  380. _this.isLabelDragged = true;
  381. pageX = e.pageX || e.originalEvent.touches[0].pageX;
  382. percent = ((pageX - _this.$wrapper.offset().left) / _this.$wrapper.width()) * 100;
  383. left = 25;
  384. right = 75;
  385. if (_this.options.animate) {
  386. _this.$wrapper.removeClass("" + _this.options.baseClass + "-animate");
  387. }
  388. if (percent < left) {
  389. percent = left;
  390. } else if (percent > right) {
  391. percent = right;
  392. }
  393. _this.$container.css("margin-left", "" + (percent - right) + "%");
  394. return _this.$element.trigger("focus.bootstrapSwitch");
  395. };
  396. })(this),
  397. "mousedown.bootstrapSwitch touchstart.bootstrapSwitch": (function(_this) {
  398. return function(e) {
  399. if (_this.isLabelDragging || _this.options.disabled || _this.options.readonly || _this.options.indeterminate) {
  400. return;
  401. }
  402. e.preventDefault();
  403. _this.isLabelDragging = true;
  404. return _this.$element.trigger("focus.bootstrapSwitch");
  405. };
  406. })(this),
  407. "mouseup.bootstrapSwitch touchend.bootstrapSwitch": (function(_this) {
  408. return function(e) {
  409. if (!_this.isLabelDragging) {
  410. return;
  411. }
  412. e.preventDefault();
  413. if (_this.isLabelDragged) {
  414. _this.isLabelDragged = false;
  415. _this.state(parseInt(_this.$container.css("margin-left"), 10) > -(_this.$container.width() / 6));
  416. if (_this.options.animate) {
  417. _this.$wrapper.addClass("" + _this.options.baseClass + "-animate");
  418. }
  419. _this.$container.css("margin-left", "");
  420. } else {
  421. _this.state(!_this.options.state);
  422. }
  423. return _this.isLabelDragging = false;
  424. };
  425. })(this),
  426. "mouseleave.bootstrapSwitch": (function(_this) {
  427. return function(e) {
  428. return _this.$label.trigger("mouseup.bootstrapSwitch");
  429. };
  430. })(this)
  431. });
  432. };
  433. BootstrapSwitch.prototype._formHandler = function() {
  434. var $form;
  435. $form = this.$element.closest("form");
  436. if ($form.data("bootstrap-switch")) {
  437. return;
  438. }
  439. return $form.on("reset.bootstrapSwitch", function() {
  440. return window.setTimeout(function() {
  441. return $form.find("input").filter(function() {
  442. return $(this).data("bootstrap-switch");
  443. }).each(function() {
  444. return $(this).bootstrapSwitch("state", this.checked);
  445. });
  446. }, 1);
  447. }).data("bootstrap-switch", true);
  448. };
  449. BootstrapSwitch.prototype._getClasses = function(classes) {
  450. var c, cls, _i, _len;
  451. if (!$.isArray(classes)) {
  452. return ["" + this.options.baseClass + "-" + classes];
  453. }
  454. cls = [];
  455. for (_i = 0, _len = classes.length; _i < _len; _i++) {
  456. c = classes[_i];
  457. cls.push("" + this.options.baseClass + "-" + c);
  458. }
  459. return cls;
  460. };
  461. return BootstrapSwitch;
  462. })();
  463. $.fn.bootstrapSwitch = function() {
  464. var args, option, ret;
  465. option = arguments[0], args = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
  466. ret = this;
  467. this.each(function() {
  468. var $this, data;
  469. $this = $(this);
  470. data = $this.data("bootstrap-switch");
  471. if (!data) {
  472. $this.data("bootstrap-switch", data = new BootstrapSwitch(this, option));
  473. }
  474. if (typeof option === "string") {
  475. return ret = data[option].apply(data, args);
  476. }
  477. });
  478. return ret;
  479. };
  480. $.fn.bootstrapSwitch.Constructor = BootstrapSwitch;
  481. return $.fn.bootstrapSwitch.defaults = {
  482. state: true,
  483. size: null,
  484. animate: true,
  485. disabled: false,
  486. readonly: false,
  487. indeterminate: false,
  488. onColor: "primary",
  489. offColor: "default",
  490. onText: "ON",
  491. offText: "OFF",
  492. labelText: "&nbsp;",
  493. baseClass: "bootstrap-switch",
  494. wrapperClass: "wrapper",
  495. radioAllOff: false,
  496. onInit: function() {},
  497. onSwitchChange: function() {}
  498. };
  499. })(window.jQuery, window);
  500. }).call(this);