presets.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. import $ from 'jquery';
  2. import Forms from '../forms';
  3. let body = $('body');
  4. let fields = [];
  5. const FormState = Forms.FormState.Instance;
  6. const setField = (field, value) => {
  7. let name = field.prop('name');
  8. let tag = field.prop('tagName').toLowerCase();
  9. let type = field.prop('type');
  10. fields.push(name);
  11. switch (tag) {
  12. case 'select':
  13. field.val(value);
  14. field.data('selectize').setValue(value);
  15. field.trigger('change');
  16. break;
  17. case 'input':
  18. if (type === 'radio') {
  19. let strValue = value ? '1' : '0';
  20. field.filter((index, radio) => $(radio).val() === strValue).prop('checked', true);
  21. break;
  22. }
  23. if (type === 'checkbox') {
  24. field.prop('checked', value);
  25. break;
  26. }
  27. field.val(value);
  28. field.trigger('keyup');
  29. }
  30. };
  31. body.on('click', '[data-preset-values]', (event) => {
  32. let target = $(event.currentTarget);
  33. let data = target.data('preset-values');
  34. Object.keys(data).forEach((section) => {
  35. if (typeof data[section] === 'string') {
  36. return;
  37. }
  38. Object.keys(data[section]).forEach((key) => {
  39. let field = $(`[name="data[whitelabel][color_scheme][${section}][${key}]"], [name="data[${section}][${key}]"]`);
  40. let value = data[section][key];
  41. setField(field, value);
  42. });
  43. });
  44. });
  45. body.on('click', '[data-reset-scss]', (event) => {
  46. event && event.preventDefault();
  47. let element = $(event.currentTarget);
  48. let links = $('link[id^=admin-pro-preview-]');
  49. element.remove();
  50. links.remove();
  51. fields.forEach((field) => {
  52. let value = FormState.loadState.get(field);
  53. setField($(`[name="${field}"]`), value);
  54. });
  55. fields = [];
  56. });
  57. // Horizontal Scroll Functionality
  58. $.fn.hscrollarrows = function() {
  59. return this.each(function() {
  60. let navNext = $('<a class="nav-next hide"></a>');
  61. let navPrev = $('<a class="nav-prev hide"></a>');
  62. let scrollTime = null;
  63. let resizeTime = null;
  64. let scrolling = false;
  65. let elm_w = 0;
  66. let elem_data_w = 0;
  67. let max_scroll = 0;
  68. let inc_scroll = 0;
  69. let calcData = function() {
  70. elm_w = elem.width();
  71. elem_data_w = elem_data.get(0).scrollWidth;
  72. max_scroll = elem_data_w - elm_w;
  73. inc_scroll = elm_w * 0.3; // 20%
  74. };
  75. let revalidate = function() {
  76. calcData();
  77. stateNavs();
  78. };
  79. let run = function() {
  80. calcData();
  81. setupNavs();
  82. };
  83. let setupNavs = function() {
  84. elem.parent().prepend(navNext);
  85. elem.parent().prepend(navPrev);
  86. navNext.on('click', next);
  87. navPrev.on('click', prev);
  88. stateNavs();
  89. $(elem).scroll(function() {
  90. if (!scrolling) {
  91. clearTimeout(scrollTime);
  92. scrollTime = setTimeout(function() {
  93. stateNavs();
  94. }, 250);
  95. }
  96. });
  97. $(window).resize(function() {
  98. clearTimeout(resizeTime);
  99. resizeTime = setTimeout(function() {
  100. revalidate();
  101. }, 250);
  102. });
  103. };
  104. let stateNavs = function() {
  105. let current_scroll = elem.scrollLeft();
  106. if (current_scroll < max_scroll) {
  107. navNext.removeClass('hide');
  108. } else {
  109. navNext.addClass('hide');
  110. }
  111. if (current_scroll > 0) {
  112. navPrev.removeClass('hide');
  113. } else {
  114. navPrev.addClass('hide');
  115. }
  116. scrolling = false;
  117. };
  118. let next = function() {
  119. let current_scroll = elem.scrollLeft();
  120. if (current_scroll < max_scroll) {
  121. scrolling = true;
  122. elem.stop().animate({
  123. scrollLeft: (current_scroll + inc_scroll)
  124. }, stateNavs);
  125. }
  126. };
  127. let prev = function() {
  128. let current_scroll = elem.scrollLeft();
  129. if (current_scroll > 0) {
  130. scrolling = true;
  131. elem.stop().animate({
  132. scrollLeft: (current_scroll - inc_scroll)
  133. }, stateNavs);
  134. }
  135. };
  136. let elem = $(this);
  137. let elem_data = $(':first-child', elem);
  138. run();
  139. });
  140. };
  141. $(document).ready(() => {
  142. $('.jquery-horizontal-scroll').hscrollarrows();
  143. });