bootstrap-switch.js 16 KB

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