bootstrap-switch.js 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470
  1. /* ========================================================================
  2. * bootstrap-switch - v3.0.0
  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. BootstrapSwitch.prototype.name = "bootstrap-switch";
  28. function BootstrapSwitch(element, options) {
  29. var addClasses;
  30. if (options == null) {
  31. options = {};
  32. }
  33. this.$element = $(element);
  34. this.options = $.extend({}, $.fn.bootstrapSwitch.defaults, options, {
  35. state: this.$element.is(":checked"),
  36. size: this.$element.data("size"),
  37. animate: this.$element.data("animate"),
  38. disabled: this.$element.is(":disabled"),
  39. readonly: this.$element.is("[readonly]"),
  40. onColor: this.$element.data("on-color"),
  41. offColor: this.$element.data("off-color"),
  42. onText: this.$element.data("on-text"),
  43. offText: this.$element.data("off-text"),
  44. labelText: this.$element.data("label-text")
  45. });
  46. addClasses = (function(_this) {
  47. return function(cls) {
  48. var c, classes, _i, _len;
  49. if (!$.isArray(cls)) {
  50. return "" + _this.options.baseClass + "-" + cls;
  51. }
  52. classes = [];
  53. for (_i = 0, _len = cls.length; _i < _len; _i++) {
  54. c = cls[_i];
  55. classes.push("" + _this.options.baseClass + "-" + c);
  56. }
  57. return classes.join(" ");
  58. };
  59. })(this);
  60. this.$wrapper = $("<div>", {
  61. "class": (function(_this) {
  62. return function() {
  63. var classes;
  64. classes = ["" + _this.options.baseClass, "" + _this.options.baseClass + "-" + _this.options.wrapperClass];
  65. classes.push(_this.options.state ? "" + _this.options.baseClass + "-" + _this.options.onModifierClass : "" + _this.options.baseClass + "-" + _this.options.offModifierClass);
  66. if (_this.options.size != null) {
  67. classes.push("" + _this.options.baseClass + "-" + _this.options.size);
  68. }
  69. if (_this.options.animate) {
  70. classes.push("" + _this.options.baseClass + "-" + _this.options.animateModifierClass);
  71. }
  72. if (_this.options.disabled) {
  73. classes.push("" + _this.options.baseClass + "-" + _this.options.disabledModifierClass);
  74. }
  75. if (_this.options.readonly) {
  76. classes.push("" + _this.options.baseClass + "-" + _this.options.readonlyModifierClass);
  77. }
  78. if (_this.$element.attr("id")) {
  79. classes.push("" + _this.options.baseClass + "-id-" + (_this.$element.attr("id")));
  80. }
  81. return classes.join(" ");
  82. };
  83. })(this)()
  84. });
  85. this.$container = $("<div>", {
  86. "class": addClasses(this.options.containerClass)
  87. });
  88. this.$on = $("<span>", {
  89. html: this.options.onText,
  90. "class": "" + (addClasses(this.options.handleOnClass)) + " " + this.options.baseClass + "-" + this.options.onColor
  91. });
  92. this.$off = $("<span>", {
  93. html: this.options.offText,
  94. "class": "" + (addClasses(this.options.handleOffClass)) + " " + this.options.baseClass + "-" + this.options.offColor
  95. });
  96. this.$label = $("<label>", {
  97. "for": this.$element.attr("id"),
  98. html: this.options.labelText,
  99. "class": addClasses(this.options.labelClass)
  100. });
  101. this.$element.on("init.bootstrapSwitch", (function(_this) {
  102. return function() {
  103. return _this.options.onInit.apply(element, arguments);
  104. };
  105. })(this));
  106. this.$element.on("switchChange.bootstrapSwitch", (function(_this) {
  107. return function() {
  108. return _this.options.onSwitchChange.apply(element, arguments);
  109. };
  110. })(this));
  111. this.$container = this.$element.wrap(this.$container).parent();
  112. this.$wrapper = this.$container.wrap(this.$wrapper).parent();
  113. this.$element.before(this.$on).before(this.$label).before(this.$off).trigger("init.bootstrapSwitch");
  114. this._elementHandlers();
  115. this._handleHandlers();
  116. this._labelHandlers();
  117. this._formHandler();
  118. }
  119. BootstrapSwitch.prototype._constructor = BootstrapSwitch;
  120. BootstrapSwitch.prototype.state = function(value, skip) {
  121. if (typeof value === "undefined") {
  122. return this.options.state;
  123. }
  124. if (this.options.disabled || this.options.readonly) {
  125. return this.$element;
  126. }
  127. value = !!value;
  128. this.$element.prop("checked", value).trigger("change.bootstrapSwitch", skip);
  129. return this.$element;
  130. };
  131. BootstrapSwitch.prototype.toggleState = function(skip) {
  132. if (this.options.disabled || this.options.readonly) {
  133. return this.$element;
  134. }
  135. return this.$element.prop("checked", !this.options.state).trigger("change.bootstrapSwitch", skip);
  136. };
  137. BootstrapSwitch.prototype.size = function(value) {
  138. if (typeof value === "undefined") {
  139. return this.options.size;
  140. }
  141. if (this.options.size != null) {
  142. this.$wrapper.removeClass("" + this.options.baseClass + "-" + this.options.size);
  143. }
  144. this.$wrapper.addClass("" + this.options.baseClass + "-" + value);
  145. this.options.size = value;
  146. return this.$element;
  147. };
  148. BootstrapSwitch.prototype.animate = function(value) {
  149. if (typeof value === "undefined") {
  150. return this.options.animate;
  151. }
  152. value = !!value;
  153. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-" + this.options.animateModifierClass);
  154. this.options.animate = value;
  155. return this.$element;
  156. };
  157. BootstrapSwitch.prototype.disabled = function(value) {
  158. if (typeof value === "undefined") {
  159. return this.options.disabled;
  160. }
  161. value = !!value;
  162. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-" + this.options.disabledModifierClass);
  163. this.$element.prop("disabled", value);
  164. this.options.disabled = value;
  165. return this.$element;
  166. };
  167. BootstrapSwitch.prototype.toggleDisabled = function() {
  168. this.$element.prop("disabled", !this.options.disabled);
  169. this.$wrapper.toggleClass("" + this.options.baseClass + "-" + this.options.disabledModifierClass);
  170. this.options.disabled = !this.options.disabled;
  171. return this.$element;
  172. };
  173. BootstrapSwitch.prototype.readonly = function(value) {
  174. if (typeof value === "undefined") {
  175. return this.options.readonly;
  176. }
  177. value = !!value;
  178. this.$wrapper[value ? "addClass" : "removeClass"]("" + this.options.baseClass + "-" + this.options.readonlyModifierClass);
  179. this.$element.prop("readonly", value);
  180. this.options.readonly = value;
  181. return this.$element;
  182. };
  183. BootstrapSwitch.prototype.toggleReadonly = function() {
  184. this.$element.prop("readonly", !this.options.readonly);
  185. this.$wrapper.toggleClass("" + this.options.baseClass + "-" + this.options.readonlyModifierClass);
  186. this.options.readonly = !this.options.readonly;
  187. return this.$element;
  188. };
  189. BootstrapSwitch.prototype.onColor = function(value) {
  190. var color;
  191. color = this.options.onColor;
  192. if (typeof value === "undefined") {
  193. return color;
  194. }
  195. if (color != null) {
  196. this.$on.removeClass("" + this.options.baseClass + "-" + color);
  197. }
  198. this.$on.addClass("" + this.options.baseClass + "-" + value);
  199. this.options.onColor = value;
  200. return this.$element;
  201. };
  202. BootstrapSwitch.prototype.offColor = function(value) {
  203. var color;
  204. color = this.options.offColor;
  205. if (typeof value === "undefined") {
  206. return color;
  207. }
  208. if (color != null) {
  209. this.$off.removeClass("" + this.options.baseClass + "-" + color);
  210. }
  211. this.$off.addClass("" + this.options.baseClass + "-" + value);
  212. this.options.offColor = value;
  213. return this.$element;
  214. };
  215. BootstrapSwitch.prototype.onText = function(value) {
  216. if (typeof value === "undefined") {
  217. return this.options.onText;
  218. }
  219. this.$on.html(value);
  220. this.options.onText = value;
  221. return this.$element;
  222. };
  223. BootstrapSwitch.prototype.offText = function(value) {
  224. if (typeof value === "undefined") {
  225. return this.options.offText;
  226. }
  227. this.$off.html(value);
  228. this.options.offText = value;
  229. return this.$element;
  230. };
  231. BootstrapSwitch.prototype.labelText = function(value) {
  232. if (typeof value === "undefined") {
  233. return this.options.labelText;
  234. }
  235. this.$label.html(value);
  236. this.options.labelText = value;
  237. return this.$element;
  238. };
  239. BootstrapSwitch.prototype.destroy = function() {
  240. var $form;
  241. $form = this.$element.closest("form");
  242. if ($form.length) {
  243. $form.off("reset.bootstrapSwitch").removeData("bootstrap-switch");
  244. }
  245. this.$container.children().not(this.$element).remove();
  246. this.$element.unwrap().unwrap().off(".bootstrapSwitch").removeData("bootstrap-switch");
  247. return this.$element;
  248. };
  249. BootstrapSwitch.prototype._elementHandlers = function() {
  250. return this.$element.on({
  251. "change.bootstrapSwitch": (function(_this) {
  252. return function(e, skip) {
  253. var checked;
  254. e.preventDefault();
  255. e.stopPropagation();
  256. e.stopImmediatePropagation();
  257. checked = _this.$element.is(":checked");
  258. if (checked === _this.options.state) {
  259. return;
  260. }
  261. _this.options.state = checked;
  262. _this.$wrapper.removeClass(checked ? "" + _this.options.baseClass + "-" + _this.options.offModifierClass : "" + _this.options.baseClass + "-" + _this.options.onModifierClass).addClass(checked ? "" + _this.options.baseClass + "-" + _this.options.onModifierClass : "" + _this.options.baseClass + "-" + _this.options.offModifierClass);
  263. if (!skip) {
  264. if (_this.$element.is(":radio")) {
  265. $("[name='" + (_this.$element.attr('name')) + "']").not(_this.$element).prop("checked", false).trigger("change.bootstrapSwitch", true);
  266. }
  267. return _this.$element.trigger("switchChange.bootstrapSwitch", [checked]);
  268. }
  269. };
  270. })(this),
  271. "focus.bootstrapSwitch": (function(_this) {
  272. return function(e) {
  273. e.preventDefault();
  274. e.stopPropagation();
  275. e.stopImmediatePropagation();
  276. return _this.$wrapper.addClass("" + _this.options.baseClass + "-" + _this.options.focusedModifierClass);
  277. };
  278. })(this),
  279. "blur.bootstrapSwitch": (function(_this) {
  280. return function(e) {
  281. e.preventDefault();
  282. e.stopPropagation();
  283. e.stopImmediatePropagation();
  284. return _this.$wrapper.removeClass("" + _this.options.baseClass + "-" + _this.options.focusedModifierClass);
  285. };
  286. })(this),
  287. "keydown.bootstrapSwitch": (function(_this) {
  288. return function(e) {
  289. if (!e.which || _this.options.disabled || _this.options.readonly) {
  290. return;
  291. }
  292. switch (e.which) {
  293. case 32:
  294. e.preventDefault();
  295. e.stopPropagation();
  296. e.stopImmediatePropagation();
  297. return _this.toggleState();
  298. case 37:
  299. e.preventDefault();
  300. e.stopPropagation();
  301. e.stopImmediatePropagation();
  302. return _this.state(false);
  303. case 39:
  304. e.preventDefault();
  305. e.stopPropagation();
  306. e.stopImmediatePropagation();
  307. return _this.state(true);
  308. }
  309. };
  310. })(this)
  311. });
  312. };
  313. BootstrapSwitch.prototype._handleHandlers = function() {
  314. this.$on.on("click.bootstrapSwitch", (function(_this) {
  315. return function(e) {
  316. _this.state(false);
  317. return _this.$element.trigger("focus.bootstrapSwitch");
  318. };
  319. })(this));
  320. return this.$off.on("click.bootstrapSwitch", (function(_this) {
  321. return function(e) {
  322. _this.state(true);
  323. return _this.$element.trigger("focus.bootstrapSwitch");
  324. };
  325. })(this));
  326. };
  327. BootstrapSwitch.prototype._labelHandlers = function() {
  328. return this.$label.on({
  329. "mousemove.bootstrapSwitch touchmove.bootstrapSwitch": (function(_this) {
  330. return function(e) {
  331. var left, percent, right;
  332. if (!_this.drag) {
  333. return;
  334. }
  335. e.preventDefault();
  336. percent = (((e.pageX || e.originalEvent.touches[0].pageX) - _this.$wrapper.offset().left) / _this.$wrapper.width()) * 100;
  337. left = 25;
  338. right = 75;
  339. if (percent < left) {
  340. percent = left;
  341. } else if (percent > right) {
  342. percent = right;
  343. }
  344. _this.$container.css("margin-left", "" + (percent - right) + "%");
  345. return _this.$element.trigger("focus.bootstrapSwitch");
  346. };
  347. })(this),
  348. "mousedown.bootstrapSwitch touchstart.bootstrapSwitch": (function(_this) {
  349. return function(e) {
  350. if (_this.drag || _this.options.disabled || _this.options.readonly) {
  351. return;
  352. }
  353. e.preventDefault();
  354. _this.drag = true;
  355. if (_this.options.animate) {
  356. _this.$wrapper.removeClass("" + _this.options.baseClass + "-" + _this.options.animateModifierClass);
  357. }
  358. return _this.$element.trigger("focus.bootstrapSwitch");
  359. };
  360. })(this),
  361. "mouseup.bootstrapSwitch touchend.bootstrapSwitch": (function(_this) {
  362. return function(e) {
  363. if (!_this.drag) {
  364. return;
  365. }
  366. e.preventDefault();
  367. _this.drag = false;
  368. _this.$element.prop("checked", parseInt(_this.$container.css("margin-left"), 10) > -(_this.$container.width() / 6)).trigger("change.bootstrapSwitch");
  369. _this.$container.css("margin-left", "");
  370. if (_this.options.animate) {
  371. return _this.$wrapper.addClass("" + _this.options.baseClass + "-" + _this.options.animateModifierClass);
  372. }
  373. };
  374. })(this),
  375. "mouseleave.bootstrapSwitch": (function(_this) {
  376. return function(e) {
  377. return _this.$label.trigger("mouseup.bootstrapSwitch");
  378. };
  379. })(this)
  380. });
  381. };
  382. BootstrapSwitch.prototype._formHandler = function() {
  383. var $form;
  384. $form = this.$element.closest("form");
  385. if ($form.data("bootstrap-switch")) {
  386. return;
  387. }
  388. return $form.on("reset.bootstrapSwitch", function() {
  389. return window.setTimeout(function() {
  390. return $form.find("input").filter(function() {
  391. return $(this).data("bootstrap-switch");
  392. }).each(function() {
  393. return $(this).bootstrapSwitch("state", false);
  394. });
  395. }, 1);
  396. }).data("bootstrap-switch", true);
  397. };
  398. return BootstrapSwitch;
  399. })();
  400. $.fn.bootstrapSwitch = function() {
  401. var args, option, ret;
  402. option = arguments[0], args = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
  403. ret = this;
  404. this.each(function() {
  405. var $this, data;
  406. $this = $(this);
  407. data = $this.data("bootstrap-switch");
  408. if (!data) {
  409. $this.data("bootstrap-switch", data = new BootstrapSwitch(this, option));
  410. }
  411. if (typeof option === "string") {
  412. return ret = data[option].apply(data, args);
  413. }
  414. });
  415. return ret;
  416. };
  417. $.fn.bootstrapSwitch.Constructor = BootstrapSwitch;
  418. return $.fn.bootstrapSwitch.defaults = {
  419. state: true,
  420. size: null,
  421. animate: true,
  422. disabled: false,
  423. readonly: false,
  424. onColor: "primary",
  425. offColor: "default",
  426. onText: "ON",
  427. offText: "OFF",
  428. labelText: "&nbsp;",
  429. baseClass: "bootstrap-switch",
  430. wrapperClass: "wrapper",
  431. containerClass: "container",
  432. handleOnClass: "handle-on",
  433. handleOffClass: "handle-off",
  434. labelClass: "label",
  435. onModifierClass: "on",
  436. offModifierClass: "off",
  437. focusedModifierClass: "focused",
  438. animateModifierClass: "animate",
  439. disabledModifierClass: "disabled",
  440. readonlyModifierClass: "readonly",
  441. onInit: function() {},
  442. onSwitchChange: function() {}
  443. };
  444. })(window.jQuery, window);
  445. }).call(this);