11<?php
22/**
3- * Copyright © Magento, Inc. All rights reserved.
4- * See COPYING.txt for license details .
3+ * Copyright 2015 Adobe
4+ * All Rights Reserved .
55 */
66
77/**
1515<?php
1616$ isUseMassAction = $ block ->getUseMassaction () ? 1 : 0 ;
1717$ isAnchorOnly = $ block ->getIsAnchorOnly () ? 1 : 0 ;
18+
1819$ scriptString = <<<script
1920
2021require(['jquery', 'jquery/jstree/jquery.jstree'], function($) {
2122
22- let tree = $('#tree {$ escaper ->escapeJs ($ block ->getId ())}');
23- let useMassAction = {$ isUseMassAction };
24- let isAnchorOnly = {$ isAnchorOnly };
25- let isAnchorArr = [];
23+ const tree = $('#tree {$ block ->escapeJs ($ block ->getId ())}');
24+ const useMassAction = {$ isUseMassAction };
25+ const isAnchorOnly = {$ isAnchorOnly };
2626 let checkedNodes = [];
27-
28- function addLastNodeProperty(nodes) {
29- return nodes.map(node => {
30- return node.children
31- ? { ...node, children: addLastNodeProperty(node.children) }
32- : { ...node, lastNode: true };
33- });
34- }
27+ let anchorNodes = [];
28+ let nonAnchorNodes = [];
3529
3630 function actionBasedOnIsAnchorOnly() {
37- tree.jstree().get_json('#', { flat: true }).each((node, value) => {
38- const attrId = node.a_attr.id;
39- const rootNode = tree.jstree().get_node("#");
40- const rootId = rootNode.children[0];
41-
42- if (isAnchorOnly === 1) {
43- if (1 === isAnchorArr[parseInt(node.id)]) {
44- tree.jstree(true).enable_node(node);
45- } else {
46- tree.jstree(true).disable_node(node);
47- }
48- } else {
49- if (0 === isAnchorArr[parseInt(node.id)]) {
50- tree.jstree(true).enable_node(node);
51- } else {
52- tree.jstree(true).disable_node(node);
53- }
54- }
55- });
31+ if (isAnchorOnly) {
32+ tree.jstree(true).disable_node(nonAnchorNodes);
33+ } else {
34+ tree.jstree(true).disable_node(anchorNodes);
35+ }
5636 }
5737
58- function handleLoadedTree (e, data) {
38+ function handleLoadedNode (e, data) {
5939 const container = $(e.target).closest('div.chooser_container');
60- checkedNodes = container.find('input[type="text"].entities').val().split(',').map(item => item.trim());
40+ if (container.find('input[type="text"].entities').val() !== '') {
41+ checkedNodes = container.find('input[type="text"].entities').val().split(',').map(item => item.trim());
42+ }
6143
62- data.instance.get_json('#', { flat: true }).forEach(nodeId => {
63- const node = data.instance.get_node(nodeId );
64- getAnchorNodeIds(tree, node );
65- });
44+ if ( data.status) {
45+ tree.jstree(true).select_node(checkedNodes );
46+ actionBasedOnIsAnchorOnly( );
47+ }
6648 }
6749
6850 function handleChange(e, data) {
@@ -72,18 +54,16 @@ require(['jquery', 'jquery/jstree/jquery.jstree'], function($) {
7254
7355 if (useMassAction) {
7456 const clickedNodeID = data.node.id;
75- const currentCheckedNodes = data.instance.get_checked();
7657
7758 if (data.action === 'select_node' && !checkedNodes.includes(clickedNodeID)) {
78- checkedNodes = currentCheckedNodes ;
59+ checkedNodes.push(clickedNodeID) ;
7960 } else if (data.action === 'deselect_node') {
80- checkedNodes = currentCheckedNodes .filter(nodeID => nodeID !== clickedNodeID);
61+ checkedNodes = checkedNodes .filter(nodeID => nodeID !== clickedNodeID);
8162 }
8263
8364 checkedNodes.sort((a, b) => a - b);
84-
8565 const container = $(e.target).closest('div.chooser_container');
86- container.find('input[type="text"].entities').val(checkedNodes.join(', '));
66+ container.find('input[type="text"].entities').val(checkedNodes.join(','));
8767 } else {
8868 node = data.node;
8969 node.attributes = node.original;
@@ -92,94 +72,55 @@ require(['jquery', 'jquery/jstree/jquery.jstree'], function($) {
9272 }
9373 }
9474
95- function getCheckedNodeIds(tree, node ) {
96- if (node.children_d && node.children_d.length > 0) {
97- const selectChildrenNodes = node.children_d.filter(item => checkedNodes.includes(item));
98-
99- if (selectChildrenNodes.length > 0 ) {
100- tree.jstree(true).select_node(selectChildrenNodes );
75+ function updateChildrenKey(treeJson ) {
76+ treeJson.forEach (node => {
77+ if (Array.isArray(node.children) && node.children.length === 0) {
78+ node.children = true;
79+ } else if (Array.isArray(node.children) ) {
80+ updateChildrenKey(node.children );
10181 }
102- }
103- }
10482
105- function addLastNodeFlag(treeData) {
106- if (treeData.children) {
107- treeData.children.forEach(child => addLastNodeFlag(child));
108- } else {
109- treeData.lastNode = true;
110- }
111- }
112-
113- function getAnchorNodeIds(tree, node) {
114- if (useMassAction) {
115- isAnchorArr[parseInt(node.id)] = node.original.is_anchor;
116- if (checkedNodes.includes(node.id)) {
117- tree.jstree(true).select_node(node.id);
83+ if (node.is_anchor === 1) {
84+ anchorNodes.push(node.id);
85+ } else {
86+ nonAnchorNodes.push(node.id);
11887 }
119- getCheckedNodeIds(tree, node);
120- actionBasedOnIsAnchorOnly();
121- }
88+ });
89+ return treeJson;
12290 }
12391
124- function handleSuccessResponse(response, childNode, data) {
125- if (response.length > 0) {
126- response.forEach(newNode => {
127- addLastNodeFlag(newNode);
128-
129- // Create the new node and execute node callback
130- data.instance.create_node(childNode, newNode, 'last', node => {
131- if (useMassAction) {
132- if ($.inArray(childNode.id, isAnchorArr) === -1) {
133- getAnchorNodeIds(tree, childNode);
134- }
135- }
136- });
137- });
138- }
139- }
92+ var jstreeConfig = {
93+ core: {
94+ data: function (obj, callback) {
95+ if (obj.id != '#' && obj.children.length === 0) {
96+ let data = {
97+ id: obj.id,
98+ store: obj.original.store,
99+ node: obj.id,
100+ form_key: FORM_KEY
101+ };
140102
141- function handleOpenNode(e, data) {
142- let parentNode = data.node;
143- if (parentNode && parentNode.children.length > 0) {
144- parentNode.children.forEach(function(childId) {
145- let childNode = data.instance.get_node(childId, false);
146- if ($.inArray(childNode.id, isAnchorArr) === -1) {
147- getAnchorNodeIds(tree, childNode);
148- }
149- // Check if the child node has no children (is not yet loaded)
150- if (childNode.children && childNode.children.length === 0
151- && childNode.original && !childNode.original.lastNode) {
152103 $.ajax({
153- url: ' {$ block ->escapeJs ($ block ->escapeUrl ( $ block -> getLoadTreeUrl () ))}',
104+ url: ' {$ block ->escapeJs ($ block ->getLoadTreeUrl ())}',
154105 type: "POST",
155- data: {
156- id: childNode.original.id,
157- store: childNode.original.store,
158- form_key: FORM_KEY
159- },
106+ data: data,
160107 dataType: 'json',
161108 success: function (response) {
162- handleSuccessResponse(response, childNode, data);
109+ response = updateChildrenKey(response);
110+ callback.call(this, response);
163111 },
164112 error: function (jqXHR, status, error) {
165- console.log(status + ': ' + error + 'Response text:' + jqXHR.responseText );
113+ console.log(status + ': ' + error);
166114 }
167115 });
116+ } else {
117+ let defaultTree = updateChildrenKey( {$ block ->getTreeJson ()});
118+ callback.call(this, defaultTree);
168119 }
169- })
170- }
171- else if ((parentNode.children.length === 0
172- && parentNode.original && parentNode.original.lastNode)) {
173- getAnchorNodeIds(tree, parentNode);
174- }
175- }
176-
177- var jstreeConfig = {
178- core: {
179- data: addLastNodeProperty( {$ block ->getTreeJson ()}),
120+ },
180121 check_callback: true
181122 },
182- plugins: []
123+ plugins: ['dnd' ]
183124 };
184125
185126 if (useMassAction) {
@@ -192,11 +133,10 @@ require(['jquery', 'jquery/jstree/jquery.jstree'], function($) {
192133 tree.jstree(jstreeConfig);
193134
194135 if (useMassAction) {
195- tree.on('loaded .jstree', (e, data) => handleLoadedTree (e, data));
136+ tree.on('load_node .jstree', (e, data) => handleLoadedNode (e, data));
196137 }
197138
198139 tree.on('changed.jstree', (e, data) => handleChange(e, data));
199- tree.on('open_node.jstree', (e, data) => handleOpenNode(e, data));
200140});
201141
202142script ;
0 commit comments