rules.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442
  1. /**
  2. * Copyright © Magento, Inc. All rights reserved.
  3. * See COPYING.txt for license details.
  4. */
  5. /**
  6. * @api
  7. */
  8. define([
  9. 'jquery',
  10. 'Magento_Ui/js/modal/alert',
  11. 'mage/translate',
  12. 'prototype'
  13. ], function (jQuery) {
  14. var VarienRulesForm = new Class.create();
  15. VarienRulesForm.prototype = {
  16. initialize: function (parent, newChildUrl) {
  17. this.parent = $(parent);
  18. this.newChildUrl = newChildUrl;
  19. this.shownElement = null;
  20. this.updateElement = null;
  21. this.chooserSelectedItems = $H({});
  22. this.readOnly = false;
  23. var elems = this.parent.getElementsByClassName('rule-param');
  24. for (var i = 0; i < elems.length; i++) {
  25. this.initParam(elems[i]);
  26. }
  27. },
  28. setReadonly: function (readonly) {
  29. this.readOnly = readonly;
  30. var elems = this.parent.getElementsByClassName('rule-param-remove');
  31. for (var i = 0; i < elems.length; i++) {
  32. var element = elems[i];
  33. if (this.readOnly) {
  34. element.hide();
  35. } else {
  36. element.show();
  37. }
  38. }
  39. var elems = this.parent.getElementsByClassName('rule-param-new-child');
  40. for (var i = 0; i < elems.length; i++) {
  41. var element = elems[i];
  42. if (this.readOnly) {
  43. element.hide();
  44. } else {
  45. element.show();
  46. }
  47. }
  48. var elems = this.parent.getElementsByClassName('rule-param');
  49. for (var i = 0; i < elems.length; i++) {
  50. var container = elems[i];
  51. var label = Element.down(container, '.label');
  52. if (label) {
  53. if (this.readOnly) {
  54. label.addClassName('label-disabled');
  55. } else {
  56. label.removeClassName('label-disabled');
  57. }
  58. }
  59. }
  60. },
  61. initParam: function (container) {
  62. container.rulesObject = this;
  63. var label = Element.down(container, '.label');
  64. if (label) {
  65. Event.observe(label, 'click', this.showParamInputField.bind(this, container));
  66. }
  67. var elem = Element.down(container, '.element');
  68. if (elem) {
  69. var trig = elem.down('.rule-chooser-trigger');
  70. if (trig) {
  71. Event.observe(trig, 'click', this.toggleChooser.bind(this, container));
  72. }
  73. var apply = elem.down('.rule-param-apply');
  74. if (apply) {
  75. Event.observe(apply, 'click', this.hideParamInputField.bind(this, container));
  76. } else {
  77. elem = elem.down('.element-value-changer');
  78. elem.container = container;
  79. if (!elem.multiple) {
  80. Event.observe(elem, 'change', this.hideParamInputField.bind(this, container));
  81. this.changeVisibilityForValueRuleParam(elem);
  82. }
  83. Event.observe(elem, 'blur', this.hideParamInputField.bind(this, container));
  84. }
  85. }
  86. var remove = Element.down(container, '.rule-param-remove');
  87. if (remove) {
  88. Event.observe(remove, 'click', this.removeRuleEntry.bind(this, container));
  89. }
  90. },
  91. showChooserElement: function (chooser) {
  92. this.chooserSelectedItems = $H({});
  93. if (chooser.hasClassName('no-split')) {
  94. this.chooserSelectedItems.set(this.updateElement.value, 1);
  95. } else {
  96. var values = this.updateElement.value.split(','),
  97. s = '';
  98. for (i = 0; i < values.length; i++) {
  99. s = values[i].strip();
  100. if (s != '') {
  101. this.chooserSelectedItems.set(s, 1);
  102. }
  103. }
  104. }
  105. new Ajax.Request(chooser.getAttribute('url'), {
  106. evalScripts: true,
  107. parameters: {
  108. 'form_key': FORM_KEY, 'selected[]': this.chooserSelectedItems.keys()
  109. },
  110. onSuccess: function (transport) {
  111. if (this._processSuccess(transport)) {
  112. jQuery(chooser).html(transport.responseText);
  113. this.showChooserLoaded(chooser, transport);
  114. jQuery(chooser).trigger('contentUpdated');
  115. }
  116. }.bind(this),
  117. onFailure: this._processFailure.bind(this)
  118. });
  119. },
  120. showChooserLoaded: function (chooser, transport) {
  121. chooser.style.display = 'block';
  122. },
  123. showChooser: function (container, event) {
  124. var chooser = container.up('li');
  125. if (!chooser) {
  126. return;
  127. }
  128. chooser = chooser.down('.rule-chooser');
  129. if (!chooser) {
  130. return;
  131. }
  132. this.showChooserElement(chooser);
  133. },
  134. hideChooser: function (container, event) {
  135. var chooser = container.up('li');
  136. if (!chooser) {
  137. return;
  138. }
  139. chooser = chooser.down('.rule-chooser');
  140. if (!chooser) {
  141. return;
  142. }
  143. chooser.style.display = 'none';
  144. },
  145. toggleChooser: function (container, event) {
  146. if (this.readOnly) {
  147. return false;
  148. }
  149. var chooser = container.up('li').down('.rule-chooser');
  150. if (!chooser) {
  151. return;
  152. }
  153. if (chooser.style.display == 'block') {
  154. chooser.style.display = 'none';
  155. this.cleanChooser(container, event);
  156. } else {
  157. this.showChooserElement(chooser);
  158. }
  159. },
  160. cleanChooser: function (container, event) {
  161. var chooser = container.up('li').down('.rule-chooser');
  162. if (!chooser) {
  163. return;
  164. }
  165. chooser.innerHTML = '';
  166. },
  167. showParamInputField: function (container, event) {
  168. if (this.readOnly) {
  169. return false;
  170. }
  171. if (this.shownElement) {
  172. this.hideParamInputField(this.shownElement, event);
  173. }
  174. Element.addClassName(container, 'rule-param-edit');
  175. var elemContainer = Element.down(container, '.element');
  176. var elem = Element.down(elemContainer, 'input.input-text');
  177. jQuery(elem).trigger('contentUpdated');
  178. if (elem) {
  179. elem.focus();
  180. if (elem && elem.id && elem.id.match(/__value$/)) {
  181. this.updateElement = elem;
  182. }
  183. }
  184. var elem = Element.down(elemContainer, '.element-value-changer');
  185. if (elem) {
  186. elem.focus();
  187. }
  188. this.shownElement = container;
  189. },
  190. hideParamInputField: function (container, event) {
  191. Element.removeClassName(container, 'rule-param-edit');
  192. var label = Element.down(container, '.label'),
  193. elem;
  194. if (!container.hasClassName('rule-param-new-child')) {
  195. elem = Element.down(container, '.element-value-changer');
  196. if (elem && elem.options) {
  197. var selectedOptions = [];
  198. for (i = 0; i < elem.options.length; i++) {
  199. if (elem.options[i].selected) {
  200. selectedOptions.push(elem.options[i].text);
  201. }
  202. }
  203. var str = selectedOptions.join(', ');
  204. label.innerHTML = str != '' ? str : '...';
  205. }
  206. this.changeVisibilityForValueRuleParam(elem);
  207. elem = Element.down(container, 'input.input-text');
  208. if (elem) {
  209. var str = elem.value.replace(/(^\s+|\s+$)/g, '');
  210. elem.value = str;
  211. if (str == '') {
  212. str = '...';
  213. } else if (str.length > 30) {
  214. str = str.substr(0, 30) + '...';
  215. }
  216. label.innerHTML = str.escapeHTML();
  217. }
  218. } else {
  219. elem = container.down('.element-value-changer');
  220. if (elem.value) {
  221. this.addRuleNewChild(elem);
  222. }
  223. elem.value = '';
  224. }
  225. if (elem && elem.id && elem.id.match(/__value$/)) {
  226. this.hideChooser(container, event);
  227. this.updateElement = null;
  228. }
  229. this.shownElement = null;
  230. },
  231. changeVisibilityForValueRuleParam: function(elem) {
  232. let parsedElementId = elem.id.split('__');
  233. if (parsedElementId[2] != 'operator') {
  234. return false;
  235. }
  236. let valueElement = jQuery('#' + parsedElementId[0] + '__' + parsedElementId[1] + '__value');
  237. if(elem.value == '<=>') {
  238. valueElement.closest('.rule-param').hide();
  239. } else {
  240. valueElement.closest('.rule-param').show();
  241. }
  242. return true;
  243. },
  244. addRuleNewChild: function (elem) {
  245. var parent_id = elem.id.replace(/^.*__(.*)__.*$/, '$1');
  246. var children_ul_id = elem.id.replace(/__/g, ':').replace(/[^:]*$/, 'children').replace(/:/g, '__');
  247. var children_ul = $(this.parent).select('#' + children_ul_id)[0];
  248. var max_id = 0,
  249. i;
  250. var children_inputs = Selector.findChildElements(children_ul, $A(['input.hidden']));
  251. if (children_inputs.length) {
  252. children_inputs.each(function (el) {
  253. if (el.id.match(/__type$/)) {
  254. i = 1 * el.id.replace(/^.*__.*?([0-9]+)__.*$/, '$1');
  255. max_id = i > max_id ? i : max_id;
  256. }
  257. });
  258. }
  259. var new_id = parent_id + '--' + (max_id + 1);
  260. var new_type = elem.value;
  261. var new_elem = document.createElement('LI');
  262. new_elem.className = 'rule-param-wait';
  263. new_elem.innerHTML = jQuery.mage.__('This won\'t take long . . .');
  264. children_ul.insertBefore(new_elem, $(elem).up('li'));
  265. new Ajax.Request(this.newChildUrl, {
  266. evalScripts: true,
  267. parameters: {
  268. form_key: FORM_KEY, type: new_type.replace('/', '-'), id: new_id
  269. },
  270. onComplete: this.onAddNewChildComplete.bind(this, new_elem),
  271. onSuccess: function (transport) {
  272. if (this._processSuccess(transport)) {
  273. $(new_elem).update(transport.responseText);
  274. }
  275. }.bind(this),
  276. onFailure: this._processFailure.bind(this)
  277. });
  278. },
  279. _processSuccess: function (transport) {
  280. if (transport.responseText.isJSON()) {
  281. var response = transport.responseText.evalJSON();
  282. if (response.error) {
  283. alert(response.message);
  284. }
  285. if (response.ajaxExpired && response.ajaxRedirect) {
  286. setLocation(response.ajaxRedirect);
  287. }
  288. return false;
  289. }
  290. return true;
  291. },
  292. _processFailure: function (transport) {
  293. location.href = BASE_URL;
  294. },
  295. onAddNewChildComplete: function (new_elem) {
  296. if (this.readOnly) {
  297. return false;
  298. }
  299. $(new_elem).removeClassName('rule-param-wait');
  300. var elems = new_elem.getElementsByClassName('rule-param');
  301. for (var i = 0; i < elems.length; i++) {
  302. this.initParam(elems[i]);
  303. }
  304. },
  305. removeRuleEntry: function (container, event) {
  306. var li = Element.up(container, 'li');
  307. li.parentNode.removeChild(li);
  308. },
  309. chooserGridInit: function (grid) {
  310. //grid.reloadParams = {'selected[]':this.chooserSelectedItems.keys()};
  311. },
  312. chooserGridRowInit: function (grid, row) {
  313. if (!grid.reloadParams) {
  314. grid.reloadParams = {
  315. 'selected[]': this.chooserSelectedItems.keys()
  316. };
  317. }
  318. },
  319. chooserGridRowClick: function (grid, event) {
  320. var trElement = Event.findElement(event, 'tr');
  321. var isInput = Event.element(event).tagName == 'INPUT';
  322. if (trElement) {
  323. var checkbox = Element.select(trElement, 'input');
  324. if (checkbox[0]) {
  325. var checked = isInput ? checkbox[0].checked : !checkbox[0].checked;
  326. grid.setCheckboxChecked(checkbox[0], checked);
  327. }
  328. }
  329. },
  330. chooserGridCheckboxCheck: function (grid, element, checked) {
  331. if (checked) {
  332. if (!element.up('th')) {
  333. this.chooserSelectedItems.set(element.value, 1);
  334. }
  335. } else {
  336. this.chooserSelectedItems.unset(element.value);
  337. }
  338. grid.reloadParams = {
  339. 'selected[]': this.chooserSelectedItems.keys()
  340. };
  341. this.updateElement.value = this.chooserSelectedItems.keys().join(', ');
  342. }
  343. };
  344. return VarienRulesForm;
  345. });