← All changes | assets/js/admin.js +225 -221 3.0 → 3.3 View file →

		@@ -101,9 +101,43 @@
101	101	};
102	102
103	103	editorSettings.codemirror = _.extend({}, editorSettings.codemirror, codemirror_gen, codemirror_el,);
104	104
105		- wp.codeEditor.initialize(html_code, editorSettings);
	105	+ const htmleditor = wp.codeEditor.initialize(html_code, editorSettings);
	106	+
	107	+ const htmlNavigationMenu = document.getElementById("htmlNavigationMenu");
	108	+
	109	+ htmleditor.codemirror.eachLine(function (line) {
	110	+ const text = line.text;
	111	+ if (text.startsWith("<!-- NAV:")) {
	112	+ let navItem = document.createElement("li");
	113	+ let navLink = document.createElement("a");
	114	+ navLink.href = "#";
	115	+ // navLink.innerText = text.replace("<!-- NAV:", "").trim();
	116	+ navLink.innerText = text.replace(/<!-- NAV:|-->|<!-- NAV: -->/g, '').trim();
	117	+ navLink.addEventListener("click", function (e) {
	118	+ e.preventDefault();
	119	+
	120	+ // Remove existing highlights from the gutter
	121	+ htmleditor.codemirror.eachLine(function (l) {
	122	+ htmleditor.codemirror.removeLineClass(l, 'gutter', 'highlighted-gutter');
	123	+ });
	124	+
	125	+ // Set cursor and scroll to line
	126	+ htmleditor.codemirror.setCursor(line.lineNo());
	127	+ let heightOfLine = htmleditor.codemirror.defaultTextHeight();
	128	+ let verticalPos = line.lineNo() * heightOfLine;
	129	+ htmleditor.codemirror.scrollTo(null, verticalPos);
	130	+
	131	+ // Highlight the line number in the gutter
	132	+ htmleditor.codemirror.addLineClass(line.lineNo(), 'gutter', 'highlighted-gutter');
	133	+
	134	+ htmleditor.codemirror.focus();
	135	+ });
	136	+ navItem.appendChild(navLink);
	137	+ htmlNavigationMenu.appendChild(navItem);
	138	+ }
	139	+ });
106	140	}
107	141
108	142	const css_code = document.getElementById('css_code');
109	143	if (css_code) {
		@@ -108,12 +142,46 @@
108	142	const css_code = document.getElementById('css_code');
109	143	if (css_code) {
110	144	let codemirror_el = {"mode": 'css',};
111	145	editorSettings.codemirror = _.extend({}, editorSettings.codemirror, codemirror_gen, codemirror_el,);
112		- const tab = document.querySelector('[data-content="css-code"]');
113		- tab.classList.add('tab-content-active');
114		- wp.codeEditor.initialize(css_code, editorSettings);
115		- tab.classList.remove('tab-content-active');
	146	+ // const tab = document.querySelector('[data-content="css-code"]');
	147	+ // tab.classList.add('tab-content-active');
	148	+ const csseditor = wp.codeEditor.initialize(css_code, editorSettings);
	149	+ // tab.classList.remove('tab-content-active');
	150	+
	151	+ const cssNavigationMenu = document.getElementById("cssNavigationMenu");
	152	+
	153	+ csseditor.codemirror.eachLine(function (line) {
	154	+ const text = line.text;
	155	+ if (text.startsWith("/* NAV:")) {
	156	+ let navItem = document.createElement("li");
	157	+ let navLink = document.createElement("a");
	158	+ navLink.href = "#";
	159	+ // navLink.innerText = text.replace("// NAV:", "").trim();
	160	+ navLink.innerText = text.replace(/\/\* NAV:|\*\/|\/\* NAV: \*\//g, '').trim();
	161	+ navLink.addEventListener("click", function (e) {
	162	+ e.preventDefault();
	163	+
	164	+ // Remove existing highlights from the gutter
	165	+ csseditor.codemirror.eachLine(function (l) {
	166	+ csseditor.codemirror.removeLineClass(l, 'gutter', 'highlighted-gutter');
	167	+ });
	168	+
	169	+ // Set cursor and scroll to line
	170	+ csseditor.codemirror.setCursor(line.lineNo());
	171	+ let heightOfLine = csseditor.codemirror.defaultTextHeight();
	172	+ let verticalPos = line.lineNo() * heightOfLine;
	173	+ csseditor.codemirror.scrollTo(null, verticalPos);
	174	+
	175	+ // Highlight the line number in the gutter
	176	+ csseditor.codemirror.addLineClass(line.lineNo(), 'gutter', 'highlighted-gutter');
	177	+
	178	+ csseditor.codemirror.focus();
	179	+ });
	180	+ navItem.appendChild(navLink);
	181	+ cssNavigationMenu.appendChild(navItem);
	182	+ }
	183	+ });
116	184	}
117	185
118	186	const js_code = document.getElementById('js_code');
119	187	if (js_code) {
		@@ -142,152 +210,192 @@
142	210	},
143	211	"mode": 'javascript',
144	212	};
145	213	editorSettings.codemirror = _.extend({}, editorSettings.codemirror, codemirror_gen, codemirror_el,);
146		- const tab = document.querySelector('[data-content="js-code"]');
147		- tab.classList.add('tab-content-active');
148		- wp.codeEditor.initialize(js_code, editorSettings);
149		- tab.classList.remove('tab-content-active');
150		- }
	214	+ // const tab = document.querySelector('[data-content="js-code"]');
	215	+ // tab.classList.add('tab-content-active');
	216	+ const jseditor = wp.codeEditor.initialize(js_code, editorSettings);
	217	+ // tab.classList.remove('tab-content-active');
151	218
152		-}
	219	+ const jsNavigationMenu = document.getElementById("jsNavigationMenu");
153	220
154		-const cloneIncludes = function () {
	221	+ jseditor.codemirror.eachLine(function (line) {
	222	+ const text = line.text;
	223	+ if (text.startsWith("// NAV:")) {
	224	+ let navItem = document.createElement("li");
	225	+ let navLink = document.createElement("a");
	226	+ navLink.href = "#";
	227	+ navLink.innerText = text.replace("// NAV:", "").trim();
	228	+ navLink.addEventListener("click", function (e) {
	229	+ e.preventDefault();
155	230
156		- const template = document.getElementById('clone-includes');
157		- if (!template) {
158		- return false;
159		- }
	231	+ // Remove existing highlights from the gutter
	232	+ jseditor.codemirror.eachLine(function (l) {
	233	+ jseditor.codemirror.removeLineClass(l, 'gutter', 'highlighted-gutter');
	234	+ });
160	235
161		- const addBtn = document.getElementById('add-include');
162		- if (!addBtn) {
163		- return false;
	236	+ // Set cursor and scroll to line
	237	+ jseditor.codemirror.setCursor(line.lineNo());
	238	+ let heightOfLine = jseditor.codemirror.defaultTextHeight();
	239	+ let verticalPos = line.lineNo() * heightOfLine;
	240	+ jseditor.codemirror.scrollTo(null, verticalPos);
	241	+
	242	+ // Highlight the line number in the gutter
	243	+ jseditor.codemirror.addLineClass(line.lineNo(), 'gutter', 'highlighted-gutter');
	244	+
	245	+ jseditor.codemirror.focus();
	246	+ });
	247	+ navItem.appendChild(navLink);
	248	+ jsNavigationMenu.appendChild(navItem);
	249	+ }
	250	+ });
164	251	}
165	252
166		- addBtn.addEventListener('click', (event) => {
167		- event.preventDefault();
168		- const clone = template.content.cloneNode(true);
169		- const targetElement = document.getElementById('includes-files');
170		- targetElement.appendChild(clone);
171		- });
	253	+ const php_code = document.getElementById('php_code');
	254	+ if (php_code) {
	255	+ let codemirror_el = {
	256	+ firstLineNumber: 4,
	257	+ mode: {
	258	+ name: 'php',
	259	+ startOpen: true
	260	+ }
	261	+ };
	262	+ editorSettings.codemirror = _.extend({}, editorSettings.codemirror, codemirror_gen, codemirror_el,);
	263	+ // const tab = document.querySelector('[data-content="php-code"]');
	264	+ // tab.classList.add('tab-content-active');
	265	+ const phpeditor = wp.codeEditor.initialize(php_code, editorSettings);
	266	+ // tab.classList.remove('tab-content-active');
172	267
173		-}
	268	+ const phpNavigationMenu = document.getElementById("phpNavigationMenu");
174	269
175		-const removeLast = function () {
176		- const btn = document.getElementById('remove-include');
177		- if (!btn) {
178		- return false;
179		- }
	270	+ phpeditor.codemirror.eachLine(function (line) {
	271	+ const text = line.text;
	272	+ if (text.startsWith("// NAV:")) {
	273	+ let navItem = document.createElement("li");
	274	+ let navLink = document.createElement("a");
	275	+ navLink.href = "#";
	276	+ navLink.innerText = text.replace("// NAV:", "").trim();
	277	+ navLink.addEventListener("click", function (e) {
	278	+ e.preventDefault();
180	279
181		- btn.addEventListener('click', (event) => {
182		- event.preventDefault();
183		- const parentElement = document.getElementById('includes-files');
184		- const lastChild = parentElement.querySelector('.wowp-fields-group:last-child');
185		- if (lastChild) {
186		- lastChild.remove();
187		- }
188		- });
	280	+ // Remove existing highlights from the gutter
	281	+ phpeditor.codemirror.eachLine(function (l) {
	282	+ phpeditor.codemirror.removeLineClass(l, 'gutter', 'highlighted-gutter');
	283	+ });
189	284
	285	+ // Set cursor and scroll to line
	286	+ phpeditor.codemirror.setCursor(line.lineNo());
	287	+ let heightOfLine = phpeditor.codemirror.defaultTextHeight();
	288	+ let verticalPos = line.lineNo() * heightOfLine;
	289	+ phpeditor.codemirror.scrollTo(null, verticalPos);
190	290
191		-}
	291	+ // Highlight the line number in the gutter
	292	+ phpeditor.codemirror.addLineClass(line.lineNo(), 'gutter', 'highlighted-gutter');
192	293
193		-const changeIncludes = function () {
194		- const parentContainer = document.getElementById('includes-files');
195		- if (!parentContainer) {
196		- return false;
	294	+ phpeditor.codemirror.focus();
	295	+ });
	296	+ navItem.appendChild(navLink);
	297	+ phpNavigationMenu.appendChild(navItem);
	298	+ }
	299	+ });
197	300	}
198	301
199		- parentContainer.addEventListener('change', function (event) {
	302	+ const global_php = document.getElementById('wpcoder-global-php');
	303	+ if (global_php) {
	304	+ let codemirror_el = {
	305	+ mode: {
	306	+ name: 'php',
	307	+ startOpen: true,
200	308
201		- // Check if the clicked element matches the desired selector
202		- if (event.target.matches('[name^="param[include]"]')) {
203		- const el = event.target.value;
204		- const parent = event.target.closest('.wowp-fields-group');
205		- const el_js = parent.querySelector('.wowp-include-js');
206		- el_js.classList.toggle('is-hidden');
207		- }
208		- });
	309	+ },
	310	+ firstLineNumber: 4,
	311	+ };
	312	+ editorSettings.codemirror = _.extend({}, editorSettings.codemirror, codemirror_gen, codemirror_el,);
	313	+ const editor = wp.codeEditor.initialize(global_php, editorSettings);
209	314
210		-}
	315	+ const navigationMenu = document.getElementById("phpNavigationMenu");
211	316
212		-const cloneDisplayRules = function () {
	317	+ editor.codemirror.eachLine(function (line) {
	318	+ const text = line.text;
	319	+ if (text.startsWith("// NAV:")) {
	320	+ let navItem = document.createElement("li");
	321	+ let navLink = document.createElement("a");
	322	+ navLink.href = "#";
	323	+ navLink.innerText = text.replace("// NAV:", "").trim();
	324	+ navLink.addEventListener("click", function (e) {
	325	+ e.preventDefault();
213	326
214		- const template = document.getElementById('clone-display-rules');
215		- if (!template) {
216		- return false;
217		- }
	327	+ // Remove existing highlights from the gutter
	328	+ editor.codemirror.eachLine(function (l) {
	329	+ editor.codemirror.removeLineClass(l, 'gutter', 'highlighted-gutter');
	330	+ });
218	331
219		- const addBtn = document.getElementById('add-display');
220		- if (!addBtn) {
221		- return false;
222		- }
	332	+ // Set cursor and scroll to line
	333	+ editor.codemirror.setCursor(line.lineNo());
	334	+ let heightOfLine = editor.codemirror.defaultTextHeight();
	335	+ let verticalPos = line.lineNo() * heightOfLine;
	336	+ editor.codemirror.scrollTo(null, verticalPos);
223	337
224		- addBtn.addEventListener('click', (event) => {
225		- event.preventDefault();
226		- const clone = template.content.cloneNode(true);
227		- const container = document.getElementById('display-rules');
228		- const targetElement = document.querySelector('#display-rules .wowp-btn-actions');
229		- container.insertBefore(clone, targetElement);
230		- });
	338	+ // Highlight the line number in the gutter
	339	+ editor.codemirror.addLineClass(line.lineNo(), 'gutter', 'highlighted-gutter');
231	340
232		-}
	341	+ editor.codemirror.focus();
	342	+ });
	343	+ navItem.appendChild(navLink);
	344	+ navigationMenu.appendChild(navItem);
	345	+ }
	346	+ });
233	347
234		-const removeDisplayRules = function () {
235		- const btn = document.getElementById('remove-display');
236		- if (!btn) {
237		- return false;
	348	+
238	349	}
239	350
240		- btn.addEventListener('click', (event) => {
241		- event.preventDefault();
242		- const parentElement = document.getElementById('display-rules');
243		- const lastChild = parentElement.querySelector('.wowp-fields-group:not(:first-child):nth-last-child(2)');
244		- if (lastChild) {
245		- lastChild.remove();
246		- }
247		- });
	351	+}
248	352
249		-}
250	353
251		-const changeDisplayRules = function () {
252		- const parentContainer = document.getElementById('display-rules');
253		- if (!parentContainer) {
	354	+const changeTemplate = function () {
	355	+
	356	+ const template = document.getElementById('template');
	357	+ if (!template) {
254	358	return false;
255	359	}
256	360
257		- parentContainer.addEventListener('change', function (event) {
258	361
259		- // Check if the clicked element matches the desired selector
260		- if (event.target.matches('[name^="param[show]"]')) {
261		- let el = event.target.value;
262		- el = default_custom_post(el);
263		- const parent = event.target.closest('.wowp-fields-group');
264		- const elements = parent.querySelectorAll('.wowp-field');
265		- switch (el) {
266		- case 'shortcode':
267		- case 'everywhere':
268		- case 'post_all':
269		- case 'page_all':
270		- elements[1].classList.add('is-hidden');
271		- elements[2].classList.add('is-hidden');
272		- elements[3].classList.add('is-hidden');
273		- break;
274		- case 'post_selected':
275		- case 'post_category':
276		- case 'page_selected':
277		- elements[1].classList.remove('is-hidden');
278		- elements[2].classList.remove('is-hidden');
279		- elements[3].classList.add('is-hidden');
280		- break;
281		- case 'page_type':
282		- elements[1].classList.remove('is-hidden');
283		- elements[2].classList.add('is-hidden');
284		- elements[3].classList.remove('is-hidden');
285		- break;
	362	+ template.addEventListener('change', function (event) {
286	363
287		- }
	364	+ const parent = document.getElementById('wpcoder-template');
	365	+ let type = template.value;
	366	+ type = default_custom_post(type);
	367	+ const elements = parent.querySelectorAll('.wowp-field');
288	368
	369	+ switch (type) {
	370	+ case 'post_all':
	371	+ case 'page_all':
	372	+ elements[1].classList.add('is-hidden');
	373	+ elements[2].classList.add('is-hidden');
	374	+ elements[3].classList.add('is-hidden');
	375	+ break;
	376	+ case 'post_selected':
	377	+ case 'post_in_category':
	378	+ case 'page_selected':
	379	+ case 'archive_category':
	380	+ case 'archive_tag':
	381	+ elements[1].classList.remove('is-hidden');
	382	+ elements[2].classList.remove('is-hidden');
	383	+ elements[3].classList.add('is-hidden');
	384	+ break;
	385	+ case 'page_type':
	386	+ elements[1].classList.remove('is-hidden');
	387	+ elements[2].classList.add('is-hidden');
	388	+ elements[3].classList.remove('is-hidden');
	389	+ break;
	390	+ default:
	391	+ elements[1].classList.add('is-hidden');
	392	+ elements[2].classList.add('is-hidden');
	393	+ elements[3].classList.add('is-hidden');
	394	+ break;
	395	+
289	396	}
	397	+
290	398	});
291	399
292	400	function default_custom_post(el) {
293	401	if (el.includes('custom_post_selected')) {
		@@ -303,101 +411,9 @@
303	411	}
304	412
305	413	}
306	414
307		-const userRoles = function () {
308		- const user = document.getElementById('item_user');
309		- if (!user) {
310		- return false;
311		- }
312		- const parent = user.closest('fieldset');
313	415
314		- user.addEventListener('change', (el) => {
315		- const role = user.value;
316		- const roles = parent.querySelector('.wowp-users-roles');
317		- if (parseInt(role) === 2) {
318		- roles.classList.remove('is-hidden');
319		- } else {
320		- roles.classList.add('is-hidden');
321		- }
322		- })
323		-
324		- const checkboxes = parent.querySelectorAll('input[type="checkbox"]');
325		- const role_all = document.getElementById('user_role_all');
326		-
327		- role_all.addEventListener('change', () => {
328		- if (role_all.checked) {
329		- checkboxes.forEach(el => el.checked = true);
330		- } else {
331		- checkboxes.forEach(el => el.checked = false);
332		- }
333		- });
334		-}
335		-
336		-const languages = function () {
337		- const depending = document.getElementById('depending_language');
338		- if (!depending) {
339		- return false;
340		- }
341		- const parent = depending.closest('fieldset');
342		-
343		- depending.addEventListener('change', () => {
344		- if (depending.checked) {
345		- parent.querySelector('.wowp-languages').classList.remove('is-hidden');
346		- } else {
347		- parent.querySelector('.wowp-languages').classList.add('is-hidden');
348		- }
349		- });
350		-}
351		-
352		-const schedule = function () {
353		- const schedule = document.getElementById('schedule');
354		-
355		- if (!schedule) {
356		- return false;
357		- }
358		-
359		- const template = document.getElementById('clone-schedule');
360		- const addBtn = document.getElementById('add-schedule');
361		- const removeBtn = document.getElementById('remove-schedule');
362		-
363		- addBtn.addEventListener('click', (event) => {
364		- event.preventDefault();
365		- const clone = template.content.cloneNode(true);
366		- const container = document.getElementById('schedule');
367		- const targetElement = document.querySelector('#schedule .wowp-btn-actions');
368		- container.insertBefore(clone, targetElement);
369		- });
370		-
371		- removeBtn.addEventListener('click', (event) => {
372		- event.preventDefault();
373		- const parentElement = document.getElementById('schedule');
374		- const lastChild = parentElement.querySelector('.wowp-fields-group:nth-last-child(2)');
375		- if (lastChild) {
376		- lastChild.remove();
377		- }
378		- });
379		-
380		- schedule.addEventListener('change', function (event) {
381		- if (event.target.matches('[name^="param[dates]"]')) {
382		- const check_date = event.target;
383		- const parent = check_date.closest('.wowp-fields-group');
384		- const date_start = parent.querySelector('.wowp-field:nth-last-child(2)');
385		- const date_end = parent.querySelector('.wowp-field:nth-last-child(1)');
386		- if (check_date.checked) {
387		- date_start.classList.remove('is-hidden');
388		- date_end.classList.remove('is-hidden');
389		- } else {
390		- date_start.classList.add('is-hidden');
391		- date_end.classList.add('is-hidden');
392		- }
393		-
394		-
395		- }
396		- });
397		-
398		-}
399		-
400	416	const feature = function () {
401	417	const texts = document.querySelectorAll('.w_card-description');
402	418
403	419	if (!texts) {
		@@ -413,20 +429,8 @@
413	429
414	430	document.addEventListener('DOMContentLoaded', function () {
415	431
416	432	new codeEditor;
417		- new cloneIncludes;
418		- new removeLast;
419	433	new settingTabs;
420		- new changeIncludes;
421		-
422		- new cloneDisplayRules;
423		- new removeDisplayRules;
424		- new changeDisplayRules;
425		-
426		- new userRoles;
427		- new languages;
428		-
429		- new schedule;
430		-
	434	+ new changeTemplate;
431	435	new feature;
432	436	})