index.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. $(function() {
  2. // initialize highlight.js
  3. hljs.initHighlightingOnLoad();
  4. // initialize all the inputs
  5. $('input[type="checkbox"],[type="radio"]').not('#create-switch').not('#events-switch').bootstrapSwitch();
  6. // dimension
  7. $('#btn-size-regular-switch').on('click', function () {
  8. $('#dimension-switch').bootstrapSwitch('size', '');
  9. });
  10. $('#btn-size-mini-switch').on('click', function () {
  11. $('#dimension-switch').bootstrapSwitch('size', 'mini');
  12. });
  13. $('#btn-size-small-switch').on('click', function () {
  14. $('#dimension-switch').bootstrapSwitch('size', 'small');
  15. });
  16. $('#btn-size-large-switch').on('click', function () {
  17. $('#dimension-switch').bootstrapSwitch('size', 'large');
  18. });
  19. // state
  20. $('#toggle-state-switch-button').on('click', function () {
  21. $('#toggle-state-switch').bootstrapSwitch('toggleState');
  22. });
  23. $('#toggle-state-switch-button-on').on('click', function () {
  24. $('#toggle-state-switch').bootstrapSwitch('state', true);
  25. });
  26. $('#toggle-state-switch-button-off').on('click', function () {
  27. $('#toggle-state-switch').bootstrapSwitch('state', false);
  28. });
  29. $('#toggle-state-switch-button-state').on('click', function () {
  30. alert($('#toggle-state-switch').bootstrapSwitch('state'));
  31. });
  32. // destroy
  33. $('#btn-destroy-switch').on('click', function () {
  34. $('#destroy-switch').bootstrapSwitch('destroy');
  35. $(this).remove();
  36. });
  37. // CREATE
  38. $('#btn-create').on('click', function () {
  39. $('#create-switch').bootstrapSwitch();
  40. $(this).remove();
  41. });
  42. // activation
  43. var $disable = $('#disable-switch');
  44. $('#btn-disable-is').on('click', function () {
  45. alert($disable.bootstrapSwitch('disabled'));
  46. });
  47. $('#btn-disable-toggle').on('click', function () {
  48. $disable.bootstrapSwitch('toggleDisabled');
  49. });
  50. $('#btn-disable-set').on('click', function () {
  51. $disable.bootstrapSwitch('disabled', true);
  52. });
  53. $('#btn-disable-remove').on('click', function () {
  54. $disable.bootstrapSwitch('disabled', false);
  55. });
  56. // readonly
  57. var $readonly = $('#readonly-switch');
  58. $('#btn-readonly-is').on('click', function () {
  59. alert($readonly.bootstrapSwitch('readonly'));
  60. });
  61. $('#btn-readonly-toggle').on('click', function () {
  62. $readonly.bootstrapSwitch('toggleReadonly');
  63. });
  64. $('#btn-readonly-set').on('click', function () {
  65. $readonly.bootstrapSwitch('readonly', true);
  66. });
  67. $('#btn-readonly-remove').on('click', function () {
  68. $readonly.bootstrapSwitch('readonly', false);
  69. });
  70. // label
  71. $('#btn-label-on-switch').on('click', function() {
  72. $('#label-switch').bootstrapSwitch('onText', 'I');
  73. });
  74. $('#btn-label-off-switch').on('click', function() {
  75. $('#label-switch').bootstrapSwitch('offText', 'O');
  76. });
  77. $('#label-toggle-switch').on('click', function(e, data) {
  78. $('.label-toggle-switch').bootstrapSwitch('toggleState');
  79. });
  80. $('.label-toggle-switch').on('switch-change', function(e, data) {
  81. alert(data.value);
  82. });
  83. // event handler
  84. $('#events-switch').on({
  85. init: function() {
  86. console.log('Initialized!');
  87. },
  88. switchChange: function (e, data) {
  89. var $element = $(data.el),
  90. value = data.value;
  91. console.log(e, $element, value);
  92. }
  93. }).bootstrapSwitch();
  94. // color
  95. $('#btn-color-on-switch').on('click', function() {
  96. $('#change-color-switch').bootstrapSwitch('onColor', 'success');
  97. });
  98. $('#btn-color-off-switch').on('click', function() {
  99. $('#change-color-switch').bootstrapSwitch('offColor', 'danger');
  100. });
  101. // animation
  102. $('#btn-animate-switch').on('click', function() {
  103. $('#animated-switch').bootstrapSwitch('animate', true);
  104. });
  105. $('#btn-dont-animate-switch').on('click', function() {
  106. $('#animated-switch').bootstrapSwitch('animate', false);
  107. });
  108. // radio
  109. $('.radio1').on('switch-change', function () {
  110. $('.radio1').bootstrapSwitch('toggleRadioState');
  111. });
  112. $('.radio2').on('switch-change', function () {
  113. console.log("ok");
  114. $('.radio2').bootstrapSwitch('toggleRadioState', true);
  115. });
  116. });