PluginProbe
Page Builder: Pagelayer – Drag and Drop website builder / 2.1.7
Page Builder: Pagelayer – Drag and Drop website builder v2.1.7
2.2.1 2.2.0 2.1.9 2.1.8 2.1.7 2.1.6 2.1.5 2.1.4 2.1.3 trunk 0.9.0 0.9.1 0.9.2 0.9.3 0.9.4 0.9.5 0.9.6 0.9.7 0.9.8 0.9.9 1.0.0 1.0.2 1.0.3 1.0.4 1.0.5 All 129 releases
pagelayer / js / widgets.js

widgets.js in Page Builder: Pagelayer – Drag and Drop website builder 2.1.7, at js/widgets.js

2,179 lines 65.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1
2 pagelayer_svg_cache = {};
3 var pagelayer_document_width;
4
5 // For automatic row parent change
6 jQuery(window).resize(function(){
7
8 var new_vw = jQuery(document).width();
9
10 if(new_vw == pagelayer_document_width){
11 return false;
12 }
13
14 pagelayer_document_width = new_vw;
15
16 // Set a timeout to prevent bubbling
17 setTimeout(function(){
18
19 jQuery(pagelayer_editable+' .pagelayer-row-stretch-full').each(function(){
20 var par = jQuery(this).parent();
21 pagelayer_pl_row_parent_full(par);
22 });
23
24 }, 200);
25
26 });
27
28 // Render for row
29 function pagelayer_render_pl_row(el){
30
31 var img_urls = !pagelayer_empty(el.tmp['bg_slider-urls']) ? JSON.parse(el.tmp['bg_slider-urls']) : [];
32 el.atts['slider'] = '';
33 if(!pagelayer_empty(img_urls)){
34 for(var x in img_urls){
35 el.atts['slider'] += '<div class="pagelayer-bgimg-slide" style="background-image:url('+img_urls[x]+')"></div>';
36 }
37 }
38
39 // Row background parallax image.
40 if(!pagelayer_empty(el.atts['parallax_img'])){
41 el.atts['parallax_img_src'] = el.tmp['parallax_img-'+el.atts['parallax_id_size']+'-url'] || el.tmp['parallax_img-url'];
42 el.atts['parallax_img_src'] = el.atts['parallax_img_src'] || el.atts['parallax_img'];
43 }
44
45 pagelayer_bg_video(el);
46 }
47
48 // Render for inner row
49 function pagelayer_render_pl_inner_row(el){
50 pagelayer_render_pl_row(el);
51 }
52
53 // Render for col
54 function pagelayer_render_pl_col(el){
55
56 var img_urls = !pagelayer_empty(el.tmp['bg_slider-urls']) ? JSON.parse(el.tmp['bg_slider-urls']) : [];
57 el.atts['slider'] = '';
58 if(!pagelayer_empty(img_urls)){
59 for(var x in img_urls){
60 el.atts['slider'] += '<div class="pagelayer-bgimg-slide" style="background-image:url('+img_urls[x]+')"></div>';
61 }
62 }
63
64 // We need the parent of type pagelayer-wrap-col
65 var par = el.$.parent('.pagelayer-wrap-col');
66
67 // Apply to wrapper
68 if(!pagelayer_empty(el.atts['col'])){
69
70 for(var x=1; x<=12; x++){
71 if(par.hasClass('pagelayer-col-'+x)){
72 par.removeClass('pagelayer-col-'+x);
73 break;
74 }
75 }
76
77 par.addClass('pagelayer-col-'+el.atts['col']);
78 par.css('width', '');
79 }
80
81 if(el.atts['col_width']){
82 par.css('width', '');
83 }
84
85 // Col background parallax image.
86 if(!pagelayer_empty(el.atts['parallax_img'])){
87 el.atts['parallax_img_src'] = el.tmp['parallax_img-'+el.atts['parallax_id_size']+'-url'] || el.tmp['parallax_img-url'];
88 el.atts['parallax_img_src'] = el.atts['parallax_img_src'] || el.atts['parallax_img'];
89 }
90
91 pagelayer_bg_video(el);
92 }
93
94 function pagelayer_bg_video(el){
95
96 el.tmp['bg_video_src-url'] = el.tmp['bg_video_src-url'] || el.atts['bg_video_src'];
97
98 var src = el.tmp['bg_video_src-url'];
99
100 if(pagelayer_empty(src)){
101 return;
102 }
103
104 var iframe_atts = pagelayer_video_url(src, true);
105 // console.log(iframe_atts);
106
107 iframe_atts['src'] += (iframe_atts['src'].indexOf('?') == -1 ? '?' : '');
108
109 // Adding mute and loop option in row or col
110 if(el.atts['mute'] == "true"){
111 iframe_atts['src'] +="&mute=1";
112 el.atts['mute'] = " muted ";
113 }else{
114 iframe_atts['src'] +="&mute=0";
115 el.atts['mute'] = "";
116 }
117
118 if(el.atts['stop_loop'] != "true"){
119 iframe_atts['src'] +="&loop=1";
120 el.atts['stop_loop'] = " loop ";
121 }else{
122 iframe_atts['src'] +="&loop=0";
123 el.atts['stop_loop'] ="";
124 }
125
126 if (iframe_atts['type'] == 'youtube') {
127
128 var settings = 'data-loop="'+(!pagelayer_empty(el['atts']['stop_loop']) ? 1 : 0)+'" data-mute="'+ (!pagelayer_empty(el['atts']['mute']) ? 1 : 0)+'" data-videoid="'+(iframe_atts['id'].split('&')[0])+'"';
129
130 el.atts['vid_src'] = '<div class = "pagelayer-youtube-video" '+ settings +'></div>';
131
132 } else if (iframe_atts['type'] == 'vimeo') {
133
134 el.atts['vid_src'] = '<iframe src="'+iframe_atts['src']+'&background=1&autoplay=1&byline=0&title=0" allowfullscreen="1" webkitallowfullscreen="1" mozallowfullscreen="1" frameborder="0"></iframe>';
135
136 }else{
137
138 el.atts['vid_src'] = '<video autoplay playsinline '+el.atts['mute']+el.atts['stop_loop']+'>'+
139 '<source src="'+iframe_atts['src']+'" type="video/mp4">'+
140 '</video>';
141
142 }
143
144 }
145
146 // Load the full width row
147 function pagelayer_render_end_pl_row(el){
148
149 // The parent
150 var par = el.$.parent();
151
152 // Any class with full width
153 if(el.$.hasClass('pagelayer-row-stretch-full')){
154
155 // Give it the full width
156 pagelayer_pl_row_full(el.$);
157
158 // Give full width to the parent
159 pagelayer_pl_row_parent_full(par);
160
161 // Also add that we had a full width
162 el.$.addClass('pagelayer-row-stretch-had-full');
163
164 // Did this row have full width ?
165 }else if(el.$.hasClass('pagelayer-row-stretch-had-full')){
166
167 // Remove style
168 el.$.removeAttr('style');
169 par.removeAttr('style');
170 par.children('.pagelayer-ele-overlay').removeAttr('style');
171
172 // Remove HAD class
173 el.$.removeClass('pagelayer-row-stretch-had-full');
174
175 }
176
177 pagelayer_pl_row_video(el.$);
178
179 el.$.find('.pagelayer-parallax-window img').each(function(){
180 pagelayer_pl_row_parallax(jQuery(this));
181 });
182
183 el.$.find('.pagelayer-bgimg-slider').each(function(){
184 pagelayer_pl_row_slider(jQuery(this));
185 });
186
187 // Row shape
188 if('row_shape_type_top' in el.atts){
189 pagelayer_render_row_shape(el, 'top')
190 }
191
192 if('row_shape_type_bottom' in el.atts){
193 pagelayer_render_row_shape(el, 'bottom')
194 }
195 }
196
197 // Render for inner row
198 function pagelayer_render_end_pl_inner_row(el){
199 pagelayer_render_end_pl_row(el);
200 }
201
202 // Set Row parent width
203 function pagelayer_pl_row_parent_full(par){
204 var vw = jQuery('html').width();
205 par.css({'width': vw,'max-width': '100vw'});
206 par.offset({left: 0});
207 par.children('.pagelayer-row').css({left: 0});
208 }
209
210 // Row shape render
211 function pagelayer_render_row_shape(el, shape_pos){
212
213 var name = el.atts['row_shape_type_'+shape_pos]+'-'+shape_pos+'.svg';
214
215 // DO we have in cache
216 if(!(name in pagelayer_svg_cache)){
217 // Make url and fetch
218 var url = pagelayer_url+'/images/shapes/'+name;
219 jQuery.get(url, function(data){
220 el.$.find('.pagelayer-svg-'+shape_pos).html(data);
221 pagelayer_svg_cache[name] = data;
222 }, 'html');
223
224 // Fill with cache
225 }else{
226 el.$.find('.pagelayer-svg-'+shape_pos).html(pagelayer_svg_cache[name]);
227 }
228
229 }
230
231 // Load the col
232 function pagelayer_render_end_pl_col(el){
233
234 pagelayer_pl_row_video(el.$);
235
236 el.$.find('.pagelayer-parallax-window img').each(function(){
237 pagelayer_pl_row_parallax(jQuery(this));
238 });
239
240 el.$.find('.pagelayer-bgimg-slider').each(function(){
241 pagelayer_pl_row_slider(jQuery(this));
242 });
243
244 }
245
246 // Render the image object
247 function pagelayer_render_pl_image(el){
248
249 // Decide the image URL
250 el.atts['func_id'] = el.tmp['id-'+el.atts['id-size']+'-url'] || el.tmp['id-url'];
251 el.atts['func_id'] = el.atts['func_id'] || el.atts['id'];
252 el.atts['pagelayer-srcset'] = el.atts['func_id']+', '+el.atts['func_id']+' 1x, ';
253
254 var image_atts = {
255 name : 'id',
256 size : 'id-size'
257 };
258
259 pagelayer_get_img_src(el, image_atts);
260
261 // What is the link ?
262 if('link_type' in el.atts){
263
264 // Custom url
265 if(el.atts['link_type'] == 'custom_url'){
266 el.atts['func_link'] = el.tmp['link'] || '';
267 }
268
269 // Link to the media file itself
270 if(el.atts['link_type'] == 'media_file'){
271 el.atts['func_link'] = el.tmp['id-url'] || el.atts['id'];
272 }
273
274 // Lightbox
275 if(el.atts['link_type'] == 'lightbox'){
276 el.atts['func_link'] = el.tmp['id-url'] || el.atts['id'];
277 }
278 }
279 }
280
281 // Incase if there is a lightbox
282 function pagelayer_render_end_pl_image(el){
283 pagelayer_pl_image(el.$);
284 }
285
286 // Pre DragAndDrop function
287 function pagelayer_preDAndD_image(jEle){
288
289 dropzoneParent = jEle.find('.pagelayer-img').parent();
290
291 // Check if drop zone is already there then return
292 if(dropzoneParent.find('.pagelayer-image-drop-zone').length > 0){
293 return;
294 }
295
296 var dropDiv = '<div class="pagelayer-image-drop-zone">'+
297 '<div>'+
298 '<i class="fas fa-upload"></i>'+
299 '<h4>'+pagelayer_l('drop_file')+'</h4>'+
300 '<div class="pagelayer-img-up-progress">'+
301 '<div class="pagelayer-img-up-bar"></div>'+
302 '</div>'+
303 '</div>'+
304 '</div>';
305
306 dropzoneParent.prepend(dropDiv);
307
308 dropZone = dropzoneParent.find('.pagelayer-image-drop-zone');
309
310 // Inserting values in image drag and drop function
311 pagelayer_img_dragAndDrop(dropzoneParent, dropZone, jEle, '');
312
313 }
314
315 // Render for video
316 function pagelayer_render_pl_video(el){
317 el.atts['video_overlay_image-url'] = el.tmp['video_overlay_image-'+el.atts['custom_size']+'-url'] || el.tmp['video_overlay_image-url'];
318 el.atts['video_overlay_image-url'] = el.atts['video_overlay_image-url'] || el.atts['video_overlay_image'];
319 el.tmp['src-url'] = el.tmp['src-url'] || el.atts['src'];
320 el.tmp['ele_id'] = el['id'];
321 var vid_atts = pagelayer_video_url(el.tmp['src-url'], true);
322
323 vid_atts['src'] += (vid_atts['src'].indexOf('?') == -1 ? '?' : '');
324
325 vid_atts['src'] += el.atts['autoplay'] == 'true' ? '&autoplay=1' : '&autoplay=0' ;
326
327 var mute = el.atts['mute'] == 'true' ? 1 : 0;
328 vid_atts['src'] +='&'+(vid_atts['type'] == 'vimeo' ? 'muted' : 'mute')+'='+mute;
329
330 vid_atts['src'] += el.atts['loop'] == 'true' ? '&loop=1' : '&loop=0' ;
331
332 el.atts['vid_src'] = vid_atts['src']+(vid_atts['type'] == 'youtube' ? '&playlist='+vid_atts['id'] : '');
333 }
334
335 // Incase if there is a lightbox
336 function pagelayer_render_end_pl_video(el){
337 pagelayer_pl_video(el.$);
338 }
339
340 // Render the testimonial
341 function pagelayer_render_pl_testimonial(el){
342
343 if(!pagelayer_empty(el.tmp['avatar-no-image-set'])){
344 el.atts['avatar'] = '';
345 return;
346 }
347
348 //console.log(el);
349
350 // Decide the image URL
351 el.atts['func_image'] = el.tmp['avatar-'+el.atts['custom_size']+'-url'] || el.tmp['avatar-url'];
352 el.atts['func_image'] = el.atts['func_image'] || el.atts['avatar'];
353
354 }
355
356 // Render the stars
357 function pagelayer_render_end_pl_stars(el){
358 var jEle = el.$.find('.pagelayer-stars-container');
359 pagelayer_stars(jEle);
360 };
361
362 // Render the service box
363 function pagelayer_render_pl_service(el){
364
365 // Decide the image URL
366 el.atts['func_image'] = el.tmp['service_image-'+el.atts['service_image_size']+'-url'] || el.tmp['service_image-url'];
367 el.atts['func_image'] = el.atts['func_image'] || el.atts['service_image'];
368 el.atts['pagelayer-srcset'] = el.atts['func_image']+', '+el.atts['func_image']+' 1x, ';
369
370 var image_atts = {
371 name : 'service_image',
372 size : 'service_image_size'
373 };
374
375 pagelayer_get_img_src(el, image_atts);
376
377 }
378
379 function pagelayer_render_end_pl_service(el){
380 // Drag and Drop function for image
381 if (typeof pagelayer_preDAndD_image !== "undefined") {
382 pagelayer_preDAndD_image(el.$);
383 }
384 }
385
386 function pagelayer_social(jEle,sel){
387 var holder = jEle.find(sel);
388 var icon = holder.data('icon');
389
390 if(pagelayer_empty(icon)){
391 return;
392 }
393
394 //alert(icon);
395 var icon_splited = icon.split(' fa-');
396 //console.log(icon_splited);
397 holder.addClass('pagelayer-'+icon_splited[1]);
398
399 }
400
401 function pagelayer_social_icon_onchange(jEle, row, val){
402
403 var url = '';
404
405 // Lets get the value of the nearest social icon
406 for(var k in pagelayer_social_urls){
407 var patt = new RegExp(k, 'i');
408 if(patt.test(val)){
409 url = pagelayer_social_urls[k];
410 }
411 }
412
413 if(url.length > 0){
414 var social_url_row = row.parent().find('[pagelayer-elp-name="social_url"]');
415 //console.log(social_url_row);
416 social_url_row.find('.pagelayer-elp-link').val(url).trigger('change');
417 }
418 }
419
420 // Render the social icon
421 function pagelayer_render_end_pl_social(el){
422 pagelayer_social(el.$, '.pagelayer-icon-holder');
423 }
424
425 // Render the social profile group
426 function pagelayer_render_end_pl_social_grp(el){
427
428 // Removing extra animation classes
429 el.$.find('.pagelayer-icon-holder').removeClass (function (index, className) {
430 return (className.match (/(^|\s)pagelayer-animation-\S+/g) || []).join(' ');
431 });
432
433 pagelayer_pl_social_profile(el.$);
434 }
435
436 // Render the counter
437 function pagelayer_render_end_pl_counter(el){
438 pagelayer_counter();
439 };
440
441 // Render the progress
442 function pagelayer_render_end_pl_progress(el){
443 pagelayer_progress();
444 };
445
446 // Render the image slider
447 function pagelayer_render_pl_image_slider(el){
448
449 // The URLs
450 var img_urls = !pagelayer_empty(el.tmp['ids-urls']) ? JSON.parse(el.tmp['ids-urls']) : [];
451 var all_urls = !pagelayer_empty(el.tmp['ids-all-urls']) ? JSON.parse(el.tmp['ids-all-urls']) : [];
452 var img_title = !pagelayer_empty(el.tmp['ids-all-titles']) ? JSON.parse(el.tmp['ids-all-titles']) : [];
453 //console.log(img_urls);
454
455 var ul = '';
456 var is_link = 'link_type' in el.atts && !pagelayer_empty(el.atts['link_type']) ? true : false;
457
458 // Create figure HTML
459 for (var x in img_urls){
460
461 // Use the default URL first
462 var url = img_urls[x];
463
464 // But if we have a custom size, use that
465 if(el.atts['size'] != 'custom' && x in all_urls && el.atts['size'] in all_urls[x]){
466 url = all_urls[x][el.atts['size']];
467 }
468
469 ul += '<li class="pagelayer-slider-item">';
470
471 if(is_link){
472 var link = (el.atts['link_type'] == 'media_file' ? (!pagelayer_empty(img_urls[x]) ? img_urls[x] : url) : (el.tmp['link'] || ''))
473 ul += '<a href="'+link+'" class="pagelayer-link-sel">';
474 }
475
476 ul += '<img class="pagelayer-img" src="'+url+'" title="'+img_title[x]+'" alt="'+img_title[x]+'">';
477
478 if(is_link){
479 ul += '</a>';
480 }
481
482 ul += '</li>';
483 }
484
485 if(pagelayer_empty(ul)){
486 ul = '<h4 style="text-align:center;">'+ pagelayer_l('Please select Images from left side Widget properties.')+'</h4>';
487 }
488
489 el.atts['ul'] = ul;
490
491 // Which arrows to show
492 if('controls' in el.atts && (el.atts['controls'] == 'arrows' || el.atts['controls'] == 'none')){
493 el.CSS.attr.push({'sel': '.pagelayer-image-slider-ul', 'val': 'data-pager="false"'});
494 }
495
496 if('controls' in el.atts && (el.atts['controls'] == 'pager' || el.atts['controls'] == 'none')){
497 el.CSS.attr.push({'sel': '.pagelayer-image-slider-ul', 'val': 'data-controls="false"'});
498 }
499
500 };
501
502 // Render the image slider
503 function pagelayer_render_end_pl_image_slider(el){
504 pagelayer_owl_destroy(el.$, '.pagelayer-image-slider-ul');
505 pagelayer_pl_image_slider(el.$);
506 }
507
508 // Render the grid gallery
509 function pagelayer_render_pl_grid_gallery(el){
510 // The URLs
511 var img_urls = !pagelayer_empty(el.tmp['ids-urls']) ? JSON.parse(el.tmp['ids-urls']) : [];
512 var all_urls = !pagelayer_empty(el.tmp['ids-all-urls']) ? JSON.parse(el.tmp['ids-all-urls']) : [];
513 var img_title = !pagelayer_empty(el.tmp['ids-all-titles']) ? JSON.parse(el.tmp['ids-all-titles']) : [];
514 var img_links = !pagelayer_empty(el.tmp['ids-all-links']) ? JSON.parse(el.tmp['ids-all-links']) : [];
515 var img_captions = !pagelayer_empty(el.tmp['ids-all-captions']) ? JSON.parse(el.tmp['ids-all-captions']) : [];
516 //console.log(img_urls);
517
518 var ul = '';
519 var pagin = '<li class="pagelayer-grid-page-item active">1</li>';
520 var is_link = 'link_to' in el.atts && !pagelayer_empty(el.atts['link_to']) ? true : false;
521
522 var i = 0;
523 var j = 1;
524 if(pagelayer_empty(el.tmp)){
525 ul = '<h4 style="text-align:center;">'+ pagelayer_l('select_images')+'</h4>';
526 el.atts['ul'] = ul;
527 el.atts['pagin'] = '';
528 return;
529 }
530
531 ul += '<ul class="pagelayer-grid-gallery-ul">';
532 var gallery_rand = 'gallery-id-'+Math.floor((Math.random() * 100) + 1);
533 var imgInPage = el.atts['images_no'];
534
535 // Create figure HTML
536 for (var x in img_urls){
537
538 if(imgInPage != 0 && (i % imgInPage) == 0 && i != 0){
539 ul += '</ul><ul class="pagelayer-grid-gallery-ul">';
540 j++;
541 pagin += '<li class="pagelayer-grid-page-item">'+j+'</li>';
542 }
543
544 // Use the default URL first
545 var url = img_urls[x];
546
547 // But if we have a custom size, use that
548 if(el.atts['size'] != 'custom' && x in all_urls && el.atts['size'] in all_urls[x]){
549 url = all_urls[x][el.atts['size']];
550 }
551
552
553 ul += '<li class="pagelayer-gallery-item" >';
554
555 if(!is_link){
556 ul += '<div>';
557 }
558
559 if(is_link && el.atts['link_to'] == 'media_file'){
560 var link = (el.atts['link_to'] == 'media_file' ? url : (el.atts['link'] || ''));
561 ul += '<a href="'+link+'" class="pagelayer-ele-link">';
562 }
563
564 if(is_link && el.atts['link_to'] == 'attachment'){
565 var link = img_links[x];
566 ul += '<a href="'+link+'" class="pagelayer-ele-link">';
567 }
568
569 if(is_link && el.atts['link_to'] == 'lightbox'){
570 ul += '<a href="'+img_urls[x]+'" class="pagelayer-ele-link" data-lightbox-gallery="'+gallery_rand+'" alt="'+img_title[x]+'" pagelayer-grid-gallery-type="'+el.atts['link_to']+'">';
571 }
572
573 ul += '<img class="pagelayer-img" src="'+url+'" title="'+img_title[x]+'" alt="'+img_title[x]+'">';
574
575 if(el.atts['caption'] == 'true'){
576 ul += '<span class="pagelayer-grid-gallery-caption">'+img_captions[x]+'</span>';
577 }
578
579 if(is_link){
580 ul += '</a>';
581 }
582
583 if(!is_link){
584 ul += '</div>';
585 }
586
587 ul += '</li>';
588 i++;
589 }
590 ul += '</ul>';
591
592 el.atts['pagin'] = (j > 1) ? '<div class="pagelayer-grid-gallery-pagination"><ul class="pagelayer-grid-page-ul">'+'<li class="pagelayer-grid-page-item">&laquo;</li>'+
593 pagin+
594 '<li class="pagelayer-grid-page-item">&raquo;</li>'+'</ul></div>' : '';
595
596 el.tmp['gallery-random-id'] = gallery_rand;
597
598 el.atts['ul'] = ul;
599
600 }
601
602 function pagelayer_render_end_pl_grid_gallery(el){
603 pagelayer_pl_grid_lightbox(el.$);
604 }
605
606 // Render for tabs
607 function pagelayer_render_html_pl_tabs(el){
608 el.CSS.attr.push({'sel': '{{element}}', 'val': 'pagelayer-tabs-rotate="'+el.atts["rotate"]+'"'});
609 };
610
611 // Render the tab item
612 function pagelayer_render_end_pl_tabs(el){
613 pagelayer_pl_tabs(el.$);
614 }
615
616 // Render the accordion item
617 function pagelayer_render_end_pl_accordion(el){
618 pagelayer_pl_accordion(el.$);
619 };
620
621 // Render the collapse item
622 function pagelayer_render_end_pl_collapse(el){
623 pagelayer_pl_collapse(el.$);
624 };
625
626 // Render the accordion item handler
627 pagelayer_add_action('pagelayer_element_setup', function(e, jEle){
628 var tag = pagelayer_tag(jEle);
629
630 if( tag != 'pl_accordion_item'){
631 return;
632 }
633
634 var panel = jEle.find('.pagelayer-accordion-panel');
635
636 pagelayer_add_inner_row_notice(panel);
637 });
638
639 // Render the accordion item handler
640 pagelayer_add_action('pagelayer_do_dirty', function(e, jEle){
641 var panel = jEle.closest('.pagelayer-accordion-panel');
642
643 pagelayer_add_inner_row_notice(panel);
644 });
645
646 // Add inner row notice
647 function pagelayer_add_inner_row_notice(panel){
648
649 if(panel.length < 1 || panel.children('.pagelayer-ele-wrap, .pagelayer-ele').not('.pagelayer-row-not-found').length > 0){
650
651 if(panel.children('.pagelayer-row-not-found').length > 0){
652 panel.children('.pagelayer-row-not-found').remove();
653 }
654
655 return;
656 }
657
658 var div = `<div class="pagelayer-row-not-found pagelayer-ele-wrap"> There is no editable area found. Please <span class="pagelayer-click-add-row">click here</span> to Add a Row and continue editing!<div>`;
659
660 panel.html(div);
661
662 panel.find('.pagelayer-click-add-row').on('click', function(){
663 panel.find('.pagelayer-row-not-found').remove();
664
665 // Create Row
666 var row = jQuery('<div pagelayer-tag="pl_inner_row"></div>');
667 panel.append(row);
668 var row_id = pagelayer_onadd(row, false);
669 var rEle = pagelayer_ele_by_id(row_id);
670
671 // Create Column
672 var col = jQuery('<div pagelayer-tag="pl_col"></div>');
673 rEle.find('.pagelayer-row-holder').append(col);
674 var col_id = pagelayer_onadd(col, false);
675 var cEle = pagelayer_ele_by_id(col_id);
676 cEle.click();
677
678 });
679
680 }
681
682 // Shortcode Handler
683 var pagelayer_shortcodes_timer;
684 function pagelayer_render_pl_shortcodes(el){
685
686 // Clear any previous timeout
687 clearTimeout(pagelayer_shortcodes_timer);
688
689 // Set a timer for constant change
690 pagelayer_shortcodes_timer = setTimeout(function(){
691
692 // Make the call
693 jQuery.ajax({
694 url: pagelayer_ajax_url+'&action=pagelayer_do_shortcodes',
695 type: 'POST',
696 data: {
697 pagelayer_nonce: pagelayer_ajax_nonce,
698 shortcode_data: el.atts['data']
699 },
700 success:function(data) {
701 el.$.find('.pagelayer-shortcodes-container').html(data);
702 }
703 });
704
705 }, 500);
706
707 };
708
709 // Render the widget area i.e. Sidebars
710 function pagelayer_render_pl_wp_widgets(el){
711
712 // Clear any previous timeout
713 clearTimeout(pagelayer_shortcodes_timer);
714
715 // Set a timer for constant change
716 pagelayer_shortcodes_timer = setTimeout(function(){
717
718 // Make the call
719 jQuery.ajax({
720 url: pagelayer_ajax_url+'&action=pagelayer_fetch_sidebar',
721 type: 'POST',
722 data: {
723 pagelayer_nonce: pagelayer_ajax_nonce,
724 sidebar: el.atts['sidebar']
725 },
726 success:function(data) {
727 el.$.find('.pagelayer-wp-sidebar-holder').html(data);
728 }
729 });
730
731 }, 500);
732
733 };
734
735 function pagelayer_owl_destroy(jEle, slides_class){
736
737 var ul = jEle.find(slides_class);
738 var setup = jEle.attr('pagelayer-setup');
739
740 // Already setup ?
741 if(setup && setup.length > 0){
742 if(ul.children('.pagelayer-ele-wrap')){
743 ul.pagelayerOwlCarousel('destroy');
744 ul.find('[class^="pagelayer-owl-"]').remove();
745 jEle.removeAttr('pagelayer-setup');
746 }
747 }
748 }
749
750
751 // Render the google maps v3
752 function pagelayer_render_pl_google_maps(el){
753
754 el.atts['show_v2'] = true;
755
756 if(pagelayer_empty(el.atts['api_version'])){
757 el.atts['src_code'] = '';
758 return;
759 }
760
761 el.atts['show_v2'] = false;
762
763 var gmaps_key = (pagelayer_empty(pagelayer_gmaps_key) ? '' : pagelayer_gmaps_key);
764
765 var api_key = (pagelayer_empty(el.atts['api_key']) ? gmaps_key : el.atts['api_key']);
766
767 if(el.atts['map_modes'] == 'view'){
768 el.atts['center'] = pagelayer_empty(el.atts['center']) ? '-33.8569,151.2152' : el.atts['center'];
769 }
770
771 var src_code = (pagelayer_empty(el.atts['center']) ? '' : '&center='+el.atts['center'])+(el.atts['map_modes'] == 'streetview' ? '' : '&maptype='+el.atts['map_type']+'&zoom='+el.atts['zoom']);
772
773 switch(el.atts['map_modes']){
774 case 'place':
775 src_code += encodeURI('&q='+(pagelayer_empty(el.atts['address']) ? 'New York, New York, USA' : el.atts['address'] ));
776 break;
777
778 case 'directions':
779 src_code += encodeURI('&origin='+(pagelayer_empty(el.atts['direction_origin']) ? 'Oslow Norway' : el.atts['direction_origin'] ));
780 src_code += encodeURI('&destination='+(pagelayer_empty(el.atts['direction_destination']) ? 'Telemark Norway' : el.atts['direction_destination'] ));
781 src_code += (pagelayer_empty(el.atts['direction_waypoints']) ? '' : '&waypoints='+(el.atts['direction_waypoints'].trim()).split(' ').join('|') );
782 src_code += (pagelayer_empty(el.atts['direction_modes']) ? '' : '&mode='+el.atts['direction_modes'] );
783 src_code += (pagelayer_empty(el.atts['direction_avoid']) ? '' : '&avoid='+el.atts['direction_avoid'].split(',').join('|') );
784 src_code += (pagelayer_empty(el.atts['direction_units']) ? '' : '&units='+el.atts['direction_units'] );
785 break;
786
787 case 'streetview':
788 src_code += '&pano='+(pagelayer_empty(el.atts['streetview_pano']) ? 'eTnPNGoy4bxR9LpjjfFuOw' : el.atts['streetview_pano'] );
789 src_code += '&location='+(pagelayer_empty(el.atts['streetview_location']) ? '46.414382,10.013988' : el.atts['streetview_location'] );
790 src_code += (pagelayer_empty(el.atts['streetview_heading']) ? '' : '&heading='+el.atts['streetview_heading'] );
791 src_code += (pagelayer_empty(el.atts['streetview_pitch']) ? '' : '&pitch='+el.atts['streetview_pitch'] );
792 src_code += (pagelayer_empty(el.atts['streetview_fov']) ? '' : '&fov='+el.atts['streetview_fov'] );
793 break;
794
795 case 'search':
796 src_code += encodeURI('&q='+(pagelayer_empty(el.atts['search_term']) ? 'Record stores in Seattle' : el.atts['search_term'] ));
797 break;
798
799 }
800
801 var src_code_url = 'https://www.google.com/maps/embed/v1/'+el.atts['map_modes']+'?key='+api_key+src_code;
802
803 el.atts['src_code'] = '<iframe width="600" height="450" style="border:0" loading="lazy" allowfullscreen src="'+src_code_url+'"></iframe>';
804
805 }
806
807 ////////////
808 // Freemium
809 ////////////
810
811 // Render the excerpt
812 function pagelayer_render_html_pl_post_excerpt(el){
813 el.$.find('.pagelayer-post-excerpt').addClass('pagelayer-empty-widget');
814 }
815
816 // Render the featured image
817 function pagelayer_render_html_pl_featured_img(el){
818
819 var param = {};
820
821 param['pagelayer_nonce'] = pagelayer_ajax_nonce;
822
823 // Post Id
824 param['post_id'] = pagelayer_postID;
825
826 // Image size
827 if('size' in el.atts){
828 param['size'] = el.atts['size'];
829 }
830
831 jQuery.ajax({
832 url: pagelayer_ajax_url+'action=pagelayer_fetch_featured_img',
833 type: 'post',
834 data: param,
835 dataType: 'json',
836 success: function(data){
837
838 var src = '';
839 var title = '';
840 var alt = '';
841 if(pagelayer_empty(data)){
842 src = el.tmp['img-'+el.atts['size']+'-url'] || el.tmp['img-url'];
843 src = src || el.atts['img'];
844 }else{
845 src = data['url'];
846 alt = data['alt'];
847 title = data['title'];
848 if(el.atts['size']+'-url' in data){
849 src = data[el.atts['size']+'-url'];
850 }
851 }
852
853 var img_html = '<img class="pagelayer-img" src="'+pagelayer.blank_img+'" />';
854 if(src){
855 img_html = '<img class="pagelayer-img" src="' + src + '" title="' + title + '" alt="' + alt + '"/>';
856 }
857
858 el.$.find('.pagelayer-featured-img').html(img_html);
859
860 if('link_type' in el.atts){
861
862 // Custom url
863 if(el.atts['link_type'] == 'custom_url'){
864 el.$.find('a').attr('href', el.tmp['link']);
865 }
866
867 // Link to the media file itself
868 if(el.atts['link_type'] == 'media_file' || el.atts['link_type'] == 'lightbox'){
869 el.$.find('a').attr('href', src);
870 }
871 }
872
873 pagelayer_pl_image(el.$);
874 }
875 });
876 }
877
878 // Retina image setting attribute.
879 function pagelayer_get_img_src(el, image_atts){
880
881 // Check if retina images is set
882 if(!pagelayer_empty(el.tmp[image_atts.name+'-retina-url']) && el.tmp[image_atts.name+'-retina-url'].includes('default-image') == false){
883 var retina_image = el.tmp[image_atts.name+'-retina-'+el.atts[image_atts.size]+'-url'];
884 retina_image = pagelayer_empty(retina_image) ? el.tmp[image_atts.name+'-retina-url'] : retina_image;
885 el.atts['pagelayer-srcset'] += retina_image +' 2x, ';
886 }
887
888 // Check if retina mobile images is set
889 if(!pagelayer_empty(el.tmp[image_atts.name+'-retina-mobile-url']) && el.tmp[image_atts.name+'-retina-mobile-url'].includes('default-image') == false){
890 var retina_image_mobile = el.tmp[image_atts.name+'-retina-mobile-'+el.atts[image_atts.size]+'-url'];
891 retina_image_mobile = pagelayer_empty(retina_image_mobile) ? el.tmp[image_atts.name+'-retina-mobile-url'] : retina_image_mobile;
892 el.atts['pagelayer-srcset'] += retina_image_mobile +' 3x';
893 }
894 }
895
896 /////////////////
897 // Freemium
898 /////////////////
899
900 // If you want to store ajax data then you can use this variable
901 var pagelayer_ajax_data = {};
902
903 var pagelayer_posts_data = {};
904
905 // Compare two objects
906 function pagelayer_compare_object(obj1, obj2){
907 var objectsAreSame = true;
908 for(var propertyName in obj1){
909 if(obj1[propertyName] !== obj2[propertyName]){
910 objectsAreSame = false;
911 break;
912 }
913 }
914 for(var propertyName in obj2){
915 if(obj1[propertyName] !== obj2[propertyName]){
916 objectsAreSame = false;
917 break;
918 }
919 }
920 return objectsAreSame;
921 }
922
923 // Incase if there is a lightbox
924 function pagelayer_render_end_pl_featured_img(el){
925 pagelayer_pl_image(el.$);
926 }
927
928 // Render the archive Posts
929 function pagelayer_render_pl_archive_posts(el){
930
931 // Need to do empty
932 el.atts['pagelayer_pagination_top'] = '';
933 el.atts['pagelayer_pagination_bottom'] = '';
934
935 }
936
937 // Render the archive Posts
938 function pagelayer_render_end_pl_archive_posts(el){
939 var post = {};
940
941 // All atts
942 post['atts'] = JSON.parse(JSON.stringify(el.atts));
943 post['atts']['pagelayer-id'] = el['id'];
944
945 // The nonce
946 post['pagelayer_nonce'] = pagelayer_ajax_nonce;
947
948 var data_handle = function(data){
949 //console.log(data);
950 var d = jQuery(data);
951 el.$.children(':not(style)').remove();
952 var child = el.$.append(d.children(':not(style)'));
953 pagelayer_ajax_data[el['id']] = data;
954 }
955
956 if(pagelayer_empty(pagelayer_posts_data) || !pagelayer_compare_object(pagelayer_posts_data, post) || pagelayer_empty(pagelayer_ajax_data[el['id']])){
957
958 pagelayer_posts_data = post;
959
960 jQuery.ajax({
961 url: pagelayer_ajax_url+'action=pagelayer_archive_posts_data',
962 type: 'post',
963 data: post,
964 success: data_handle
965 });
966 }else{
967 data_handle(pagelayer_ajax_data[el['id']]);
968 }
969 }
970
971 function pagelayer_apply_megamenu_items(html, menuID, menuEle, eleActive){
972
973 if(pagelayer_empty(pagelayer_menus_items_list[menuID])){
974 return html;
975 }
976
977 var menu_data = jQuery('<div>').html(html);
978 var $elements = pagelayer_menus_items_list[menuID];
979 var unset_ele = function(navItem){
980 var src = jQuery(navItem);
981 var nhtml = src[0].outerHTML;
982
983 var nEle = jQuery(nhtml);
984 nEle.removeAttr('pagelayer-parent');
985 nEle.find('[pagelayer-parent]').removeAttr('pagelayer-parent');
986 nEle.find('style').remove();
987 nEle.find('.pagelayer-ele-overlay').remove();
988
989 // Unwrap the wraps
990 nEle.find('.pagelayer-ele').each(function (){
991 var ele = jQuery(this);
992 if(ele.parent().is('.pagelayer-ele-wrap')){
993 ele.unwrap();
994 }
995 });
996
997 return nEle;
998 }
999
1000 for($e in $elements){
1001 var savedHTML = '';
1002
1003 if(pagelayer_empty($elements[$e]['pagelayer_content'])){
1004 continue;
1005 }
1006
1007 var mID = $elements[$e]['ID'];
1008 var navItem = menuEle.find('.pagelayer-mega-editor-'+mID).find('.pagelayer-nav_menu_item').first();
1009 var id = pagelayer_id(menuEle);
1010
1011 if(navItem.length > 0 && eleActive){
1012 savedHTML = unset_ele(navItem);
1013 }else{
1014 savedHTML = pagelayer_element_unsetup($elements[$e]['pagelayer_content']);
1015 }
1016
1017 menu_data.find('.pagelayer-mega-editor-'+mID).html(savedHTML[0].outerHTML);
1018 }
1019
1020 return menu_data.html();
1021 }
1022
1023 var pagelayer_nav = {};
1024 var pagelayer_wp_menu_timer;
1025 var pagelayer_nav_force_refresh = {};
1026
1027 // Render the Primary menu
1028 function pagelayer_render_pl_wp_menu(el){
1029
1030 var jEle = el.$;
1031 var menuID = el.atts['nav_list'];
1032 var parMenu = jEle.parent().closest('.pagelayer-wp_menu');
1033 var inside_mega = '';
1034 var menu_error = '';
1035
1036 // If we are inside primary menu and have a same menu ID
1037 if(parMenu.length > 0){
1038
1039 var parMenuID = pagelayer_get_att(parMenu, 'nav_list');
1040
1041 if(menuID == parMenuID){
1042 pagelayer_show_msg('Not allowed same Menu inside the Primary menu widget!', 'warning');
1043 inside_mega = true;
1044
1045 // If parent menu menuID is empty then we prevent menu inside menu
1046 }else if(pagelayer_empty(menuID) || pagelayer_empty(parMenuID) ){
1047 menu_error = 'Primary Menu Holder. Please select the correct menu or parent menu.';
1048 inside_mega = true;
1049 }
1050
1051 }
1052
1053 // Set atts for easy rendering in PHP
1054 pagelayer_set_atts(jEle, 'inside_mega', inside_mega);
1055
1056 if(!pagelayer_empty(inside_mega)){
1057
1058 if(pagelayer_empty(menu_error)){
1059 menu_error = 'Primary Menu Holder. Please select the correct menu.';
1060 }
1061
1062 el.atts['nav_menu'] = menu_error;
1063 return;
1064 }
1065
1066 // Setting default toggle icon. If the icon is empty.
1067 if(pagelayer_empty(el.atts['menu_toggle_icon'])){
1068 el.atts['menu_toggle_icon'] = 'fas fa-bars';
1069 }
1070
1071 // To avoid remove pagelayer id of mega menu item
1072 var eleActive = !pagelayer_empty(pagelayer_active.el) && (el.id == pagelayer_active.el.id || jEle.find(pagelayer_active.el.$).length > 0);
1073
1074 if(pagelayer_empty(pagelayer_nav[menuID]) || !pagelayer_empty(pagelayer_nav_force_refresh[el.id])){
1075
1076 var pagelayer_nav_items_list = pagelayer_get_nav_items(jEle);
1077 var findPar = jEle.find('.pagelayer-wp_menu-ul').parent();
1078 el.atts['nav_menu'] = '';
1079
1080 // Get menu container for the hold place of the menu
1081 if(findPar.length > 0){
1082 el.atts['nav_menu'] = findPar[0].outerHTML;
1083 }
1084
1085 // Clear any previous timeout
1086 clearTimeout(pagelayer_wp_menu_timer);
1087
1088 // Set a timer for constant change
1089 pagelayer_wp_menu_timer = setTimeout(function(){
1090
1091 jQuery.ajax({
1092 url: pagelayer_ajax_url+'&action=pagelayer_fetch_primary_menu&postID='+pagelayer_postID, // Send post id to on live mode
1093 type: 'post',
1094 data: {
1095 pagelayer_nonce: pagelayer_ajax_nonce,
1096 nav_list: menuID,
1097 pagelayer_nav_items: pagelayer_nav_items_list,
1098 'pagelayer-live': 1
1099 },
1100 success: function(data) {
1101 //console.log(data);
1102 data = pagelayer_apply_megamenu_items(data, menuID, jEle, eleActive);
1103 pagelayer_nav[menuID] = data;
1104 },
1105 complete: function() {
1106 //console.log(data);
1107
1108 // Is element html rendered ?
1109 var findCont = setInterval( function(){
1110
1111 var container = jEle.find('.pagelayer-wp-menu-container');
1112
1113 if(container.length < 1){
1114 return;
1115 }
1116
1117 clearInterval(findCont);
1118
1119 // Replace the menu HTML
1120 container.find('.pagelayer-wp_menu-ul').parent().remove();
1121 container.append(pagelayer_nav[menuID]);
1122
1123 var render_ref = pagelayer_render_menu_par;
1124 pagelayer_render_menu_par = false;
1125
1126 container.find('.pagelayer-ele').each(function(){
1127 var iEle = jQuery(this);
1128
1129 if(iEle.parent('.pagelayer-ele-wrap').length > 0){
1130 return;
1131 }
1132
1133 var id = pagelayer_assign_id(iEle);
1134 pagelayer_element_setup('[pagelayer-id="'+id+'"]', true);
1135 });
1136
1137 pagelayer_render_menu_par = render_ref;
1138
1139 pagelayer_primary_menu(jEle);
1140
1141 }, 100);
1142
1143 }
1144 });
1145 }, 500);
1146
1147 }else{
1148 el.atts['nav_menu'] = pagelayer_apply_megamenu_items(pagelayer_nav[menuID], menuID, jEle, eleActive);
1149 }
1150
1151 pagelayer_nav_force_refresh[el.id] = false;
1152 }
1153
1154 // Render end the Primary menu
1155 function pagelayer_render_end_pl_wp_menu(el){
1156
1157 var jEle = el.$;
1158 var render_ref = pagelayer_render_menu_par;
1159
1160 pagelayer_render_menu_par = false;
1161
1162 // Re-setup the element
1163 jEle.find('.pagelayer-ele').each(function(){
1164 var ele = jQuery(this);
1165
1166 if(ele.parent('.pagelayer-ele-wrap').length > 0){
1167 return;
1168 }
1169
1170 var id = pagelayer_assign_id(ele);
1171
1172 pagelayer_element_setup('[pagelayer-id="'+id+'"]', true);
1173 });
1174
1175 pagelayer_render_menu_par = render_ref;
1176
1177 pagelayer_primary_menu(el.$);
1178 }
1179
1180 // The Primary menu handler on live
1181 pagelayer_add_action('pagelayer_primary_menu_setup_end', function(e, jEle){
1182 jEle.find('li.pagelayer-mega-menu-item a > .after-icon').unbind('click');
1183 jEle.unbind('click.mega_menu');
1184 jEle.on('click.mega_menu', 'li.pagelayer-mega-menu-item', function(e){
1185
1186 var target = jQuery(e.target);
1187 var mEle = jQuery(this);
1188
1189 if(target.closest('.pagelayer-mega-menu').length > 0 || target.closest(mEle).length < 1){
1190 return;
1191 }
1192
1193 jQuery('.pagelayer-active-mega-menu').each(function(){
1194 var oEle = jQuery(this);
1195
1196 if(mEle.is(oEle)){
1197 return;
1198 }
1199
1200 oEle.removeClass('pagelayer-active-mega-menu');
1201 });
1202
1203 mEle.toggleClass('pagelayer-active-mega-menu');
1204 });
1205 });
1206
1207 var pagelayer_render_menu = {};
1208 var pagelayer_render_menu_par = true;
1209
1210 // Render end the Primary menu
1211 function pagelayer_render_end_pl_nav_menu_item(el){
1212
1213 if(pagelayer_empty(pagelayer_menus_items_ref[el.atts['ID']])){
1214 return;
1215 }
1216
1217 var jEle = el.$;
1218
1219 if(pagelayer_render_menu_par){
1220
1221 // Render parent
1222 clearTimeout(pagelayer_render_menu);
1223 pagelayer_render_menu = setTimeout(function(){
1224 var par = jEle.closest('.pagelayer-wp_menu');
1225 var plID = pagelayer_id(par);
1226
1227 if(par.length < 1) return;
1228
1229 pagelayer_nav_force_refresh[plID] = true;
1230
1231 pagelayer_render_menu_par = false;
1232 pagelayer_sc_render(par);
1233 pagelayer_render_menu_par = true;
1234 }, 500);
1235 }
1236 }
1237
1238 var pagelayer_nav_menu_timmer = {}
1239
1240 // On nav dirty handler
1241 pagelayer_add_action('pagelayer_do_dirty', function(e, jEle){
1242
1243 var navEle = jEle.closest('[pagelayer-tag="pl_nav_menu_item"]');
1244
1245 if(navEle.length < 1){
1246 return;
1247 }
1248
1249 var itemData = pagelayer_data(navEle);
1250 var atts = itemData.atts;
1251 var itemID = atts['ID'];
1252
1253 if( !(itemID in pagelayer_menus_items_ref) ){
1254 pagelayer_menus_items_ref[itemID] = {};
1255 }
1256
1257 var props = pagelayer_get_props(navEle);
1258 var menuEle = jEle.closest('.pagelayer-wp_menu');
1259 var plID = pagelayer_id(menuEle);
1260
1261 for(var prop in props['settings']){
1262 for(var section in props[prop]){
1263
1264 if(section in atts){
1265 pagelayer_menus_items_ref[itemID][section] = atts[section];
1266 continue;
1267 }
1268
1269 pagelayer_menus_items_ref[itemID][section] = '';
1270 }
1271 }
1272
1273 pagelayer_menus_items_ref[itemID]['pagelayer_content'] = navEle;
1274 pagelayer_menus_items_ref[itemID]['is_dirty'] = true;
1275
1276 var currentID = pagelayer_get_att(menuEle, 'nav_list');
1277
1278 // Prevent unnecessary render
1279 jQuery(pagelayer_editable).find('.pagelayer-wp_menu').each(function(){
1280 var mEle = jQuery(this);
1281 var mID = pagelayer_get_att(mEle, 'nav_list');
1282
1283 if(currentID != mID){
1284 return;
1285 }
1286
1287 mEle.attr('pagelayer-click-render', 1);
1288 });
1289
1290 menuEle.removeAttr('pagelayer-click-render');
1291
1292 });
1293
1294 // We need to render the original content before we can start editing
1295 pagelayer_add_action('pagelayer_element_clicked', function(e, jEle){
1296
1297 var menus = jQuery(pagelayer_editable).find('.pagelayer-wp_menu');
1298
1299 // Prevent unnecessary render
1300 if(!jEle.hasClass('pagelayer-wp_menu') || menus.length < 2 || pagelayer_empty(jEle.attr('pagelayer-click-render'))){
1301 return;
1302 }
1303
1304 jEle.find('[pagelayer-tag="pl_nav_menu_item"]').each(function(){
1305 var cEle = jQuery(this),
1306 postID = pagelayer_get_att(cEle, 'ID');
1307
1308 if(!(postID in pagelayer_menus_items_ref)){
1309 return;
1310 }
1311
1312 var ref_data = pagelayer_menus_items_ref[postID];
1313
1314 if(!('is_dirty' in ref_data) || pagelayer_empty(ref_data['is_dirty'])){
1315 return;
1316 }
1317
1318 pagelayer_sc_render(jEle);
1319
1320 return false; // Break the loop
1321
1322 });
1323
1324 });
1325
1326 // Render the post navigation
1327 function pagelayer_render_end_pl_post_nav(el){
1328
1329 jQuery.ajax({
1330 url: pagelayer_ajax_url+'&action=pagelayer_post_nav&postID='+pagelayer_postID,
1331 type: 'post',
1332 data: {
1333 pagelayer_nonce: pagelayer_ajax_nonce,
1334 data: el['atts'],
1335 },
1336 async:false,
1337 success: function(response){
1338 //console.log(response);
1339 var obj = jQuery.parseJSON(response);
1340 el.$.find('.pagelayer-prev-post').html(obj['atts']['prev_link']);
1341 el.$.find('.pagelayer-next-post').html(obj['atts']['next_link']);
1342 }
1343 });
1344
1345 }
1346
1347 // Render the site title
1348 function pagelayer_render_pl_wp_title(el){
1349 //console.log(el.tmp);
1350
1351 // Use default logo
1352 if(pagelayer_empty(el.atts['logo_img_type'])){
1353
1354 // But is there a default logo
1355 if(!pagelayer_empty(pagelayer_site_logo)){
1356 el.atts['func_image'] = pagelayer_site_logo[el.atts['logo_img_size']+'-url'] || pagelayer_site_logo['url'];
1357
1358 el.atts['logo_img-title'] = pagelayer_empty(pagelayer_site_logo.title) ? '' : pagelayer_site_logo.title;
1359 el.atts['logo_img-alt'] = pagelayer_empty(pagelayer_site_logo.alt) ? '' : pagelayer_site_logo.alt;
1360 }
1361
1362 // Custom logo
1363 }else{
1364 el.atts['func_image'] = el.tmp['logo_img-'+el.atts['logo_img_size']+'-url'] || el.tmp['logo_img-url'];
1365 el.atts['func_image'] = pagelayer_empty(el.atts['func_image']) ? el.atts['logo_img'] : el.atts['func_image'];
1366 }
1367 }
1368
1369 // Render the Post comment
1370 function pagelayer_render_end_pl_post_comment(el){
1371
1372 var postID = pagelayer_postID;
1373
1374 if(el['atts']['post_type'] == 'custom' && el['atts']['post_id']){
1375 postID = el['atts']['post_id'];
1376 }
1377
1378 jQuery.ajax({
1379 url: pagelayer_ajax_url+'&action=pagelayer_post_comment&postID='+postID,
1380 type: 'post',
1381 data: {
1382 pagelayer_nonce: pagelayer_ajax_nonce,
1383 },
1384 success: function(response){
1385 el.$.find('.pagelayer-post-comment-container').html(response);
1386 }
1387 });
1388
1389 }
1390
1391 var pagelayer_post_info_timer = {};
1392
1393 // Render the Post info list
1394 function pagelayer_render_pl_post_info_list(el){
1395
1396 el.atts['post_info_content'] = 1;
1397
1398 // Clear any previous timeout
1399 clearTimeout(pagelayer_post_info_timer[el.id]);
1400
1401 // Set a timer for constant change
1402 pagelayer_post_info_timer[el.id] = setTimeout(function(){
1403
1404 // Make the call
1405 jQuery.ajax({
1406 url: pagelayer_ajax_url+'&action=pagelayer_post_info&postID='+pagelayer_postID,
1407 type: 'post',
1408 data: {
1409 pagelayer_nonce: pagelayer_ajax_nonce,
1410 el: el.atts,
1411 },
1412 success: function(response){
1413 var obj = jQuery.parseJSON(response);
1414 //console.log(obj);el['atts'] = obj;
1415
1416 if( pagelayer_empty(obj['post_info_content']) ){
1417 el.$.find('.pagelayer-post-info-list-container').remove();
1418 return;
1419 }
1420
1421 el.$.find('.pagelayer-post-info-list-container').show();
1422 el.$.find('.pagelayer-post-info-label').html(obj['post_info_content']);
1423 el.$.find('.pagelayer-post-info-icon img').attr('src', obj['avatar_url']);
1424 el.$.find('.pagelayer-post-info-list-container > a').attr('href', obj['link']);
1425 }
1426 });
1427
1428 }, 500);
1429
1430 }
1431
1432 // Render the Post info list
1433 function pagelayer_render_html_pl_post_info_list(el){
1434 el.$.find('.pagelayer-post-info-list-container').hide();
1435 }
1436
1437 // Render the contact form
1438 function pagelayer_render_pl_contact(el){
1439
1440 // Set post id in atts
1441 el.atts['con_post_id'] = pagelayer_postID;
1442 el.atts['grecaptcha'] = pagelayer_recaptch_site_key;
1443
1444 if(pagelayer_recaptch_version == 'v3') {
1445 el.atts['grecaptcha_v3'] = true;
1446 }else{
1447 el.atts['grecaptcha_v2'] = true;
1448 }
1449 }
1450
1451 // Render the contact form
1452 function pagelayer_render_end_pl_contact(el){
1453
1454 jQuery(el.$).find('.pagelayer-recaptcha').each(function(){
1455 var recaptcha = jQuery(this);
1456 var widgetID = recaptcha.attr('recaptcha-widget-id');
1457
1458 if( !pagelayer_empty(window.grecaptcha) && (!pagelayer_empty(widgetID) || widgetID == 0) && pagelayer_recaptch_version != 'v3'){
1459 grecaptcha.reset(widgetID);
1460 }else{
1461 pagelayer_recaptcha_loader(recaptcha, true);
1462 }
1463 });
1464
1465 // Showing contact form message in the editor only.
1466 if(el.atts['show_msg_box']){
1467 var msgBox = el.$.find('.pagelayer-message-box');
1468 if(el.$.find('.pagelayer-message-box').length==2){
1469 msgBox.eq(0).text('Demo success box');
1470 msgBox.eq(0).addClass('pagelayer-cf-msg-suc');
1471 msgBox.eq(1).text('Demo failed box');
1472 msgBox.eq(1).addClass('pagelayer-cf-msg-err');
1473 }
1474 }
1475
1476 pagelayer_set_atts(el.$, 'con_post_id', pagelayer_postID);
1477
1478 }
1479
1480 function pagelayer_render_end_pl_heading(el) {
1481 pagelayer_search_widgets(el.$);
1482 }
1483
1484 function pagelayer_render_end_pl_text(el) {
1485 pagelayer_search_widgets(el.$);
1486 }
1487
1488 // Render the contact form
1489 function pagelayer_render_pl_contact_item(el){
1490 var html = '';
1491 var options = '';
1492 var placeholder = '';
1493 var required = '';
1494
1495 if(!pagelayer_empty(el.atts['required'])){
1496 required = 'required';
1497 }
1498
1499 if(!pagelayer_empty(el.atts['label_name']) && pagelayer_empty(el.atts['label_as_holder'])){
1500 html = '<label for="'+el.atts['field_name']+'">'+
1501 '<span class="pagelayer-form-label">'+el.atts['label_name']+'</span>';
1502
1503 if(!pagelayer_empty(required)){
1504 html += ' *';
1505 }
1506
1507 html += '</label>';
1508 }
1509
1510 if(!pagelayer_empty(el.atts['label_as_holder'])){
1511 placeholder = el.atts['label_name'];
1512 }else{
1513 if(!pagelayer_empty(el.atts['placeholder'])) placeholder = el.atts['placeholder'];
1514 }
1515
1516 // File accept
1517 var file_accept = '.jpg,.jpeg,.png,.gif,.pdf,.doc,.docx,.ppt,.pptx,.odt,.avi,.ogg,.m4a,.mov,.mp3,.mp4,.mpg,.wav,.wmv';
1518
1519 if(!pagelayer_empty(el.atts['accept_file'])){
1520 file_accept = el.atts['accept_file'];
1521 }
1522
1523 if(el.atts['field_type'] == 'select'){
1524 html += '<select name="'+el.atts['field_name']+'" '+required+'>'
1525 if(!pagelayer_empty(el.atts['label_name']) && !pagelayer_empty(el.atts['label_as_holder'])){
1526 html += '<option value="" disabled selected>'+el.atts['label_name']+'</option>';
1527 }else{
1528 html += '<option value="" disabled selected>---</option>';
1529 }
1530
1531 if(!pagelayer_empty(el.atts['values'])){
1532 options = el.atts['values'].split("\n");
1533 for(var x in options){
1534 html += '<option value="'+options[x].trim()+'">'+options[x].trim()+'</option>';
1535 }
1536 }
1537 html += '</select>';
1538 }else if(el.atts['field_type'] == 'checkbox'){
1539 if(!pagelayer_empty(el.atts['values'])){
1540 options = el.atts['values'].split("\n");
1541 html += '<div class="pagelayer-radcheck-holder pagelayer-contact-checkbox" '+required+'>';
1542 for(var x in options){
1543 html += '<div><input type="checkbox" id="'+el.id+options[x].trim()+'" name="'+el.atts['field_name']+'[]" '+
1544 'value="'+options[x].trim()+'" /><label for="'+el.id+options[x].trim()+'" class="pagelayer-form-label">'+options[x].trim()+'</label></div>';
1545 }
1546 html += '</div>';
1547 }
1548 }else if(el.atts['field_type'] == 'radio'){
1549 if(!pagelayer_empty(el.atts['values'])){
1550 options = el.atts['values'].split("\n");
1551 html += '<div class="pagelayer-radcheck-holder">';
1552 for(var x in options){
1553 html += '<div><input type="radio" name="'+el.atts['field_name']+'" '+
1554 'value="'+options[x].trim()+'" '+required+'/><span>'+options[x].trim()+'</span></div>';
1555 }
1556 html += '</div>';
1557 }
1558 }else if(el.atts['field_type'] == 'textarea'){
1559 html += '<textarea name="'+el.atts['field_name']+'" rows="'+el.atts['textarea_rows']+'" placeholder="'+placeholder+'" '+
1560 ''+required+'></textarea>';
1561 }else if(el.atts['field_type'] == 'file'){
1562 html += '<input type="'+el.atts['field_type']+'" '+
1563 'name="'+el.atts['field_name']+'" placeholder="'+placeholder+'" accept="'+file_accept+'" '+required+' />';
1564 }else if(el.atts['field_type'] == 'label'){
1565 html += '';
1566 }else{
1567 html += '<input type="'+el.atts['field_type']+'" '+
1568 'name="'+el.atts['field_name']+'" placeholder="'+placeholder+'" '+required+'/>';
1569 }
1570
1571 el.atts['fieldhtml'] = html;
1572
1573 }
1574
1575 // Render the post content
1576 function pagelayer_render_pl_post_content(el){
1577 el.atts['post_content'] = 'Post Content Holder';
1578 el.CSS.css.push({'sel': '{{element}} .entry-content', 'val': 'min-height:20px;background-color:#e3e3e3;'});
1579 }
1580
1581 // Render the post excertp
1582 function pagelayer_render_pl_post_excerpt(el){
1583 el.tmp['post_excerpt'] = '<div class="pagelayer-post-excerpt pagelayer-empty-widget"></div>';
1584 }
1585
1586 // Render the flipbox
1587 function pagelayer_render_pl_flipbox(el){
1588 var jEle = el.$;
1589 el.atts['func_image'] = el.tmp['heading_image-'+el.atts['heading_image_size']+'-url'] || el.tmp['heading_image-url'];
1590 el.atts['func_image'] = el.atts['func_image'] || el.atts['heading_image'];
1591
1592 var back = pagelayer_get_att(jEle, 'back_section');
1593 if(back){
1594 jEle.attr('back_section', back);
1595 }else{
1596 jEle.removeAttr('back_section', back);
1597 }
1598 }
1599
1600 // Render the Testimonial Slider
1601 function pagelayer_render_end_pl_testimonial_slider(el){
1602 pagelayer_owl_destroy(el.$, '.pagelayer-testimonials-holder');
1603 pagelayer_pl_testimonial_slider(el.$);
1604 }
1605
1606 // Render the countdown
1607 function pagelayer_render_pl_countdown(el){
1608 if(pagelayer_empty(el.atts['custom_label_text'])){
1609 el.atts['days_label_text'] = 'Days';
1610 el.atts['hours_label_text'] = 'Hours';
1611 el.atts['minutes_label_text'] = 'Minutes';
1612 el.atts['seconds_label_text'] = 'Seconds';
1613 }
1614 }
1615
1616 // Render the countdown
1617 function pagelayer_render_end_pl_countdown(el){
1618 var jEle = el.$;
1619 var exp = pagelayer_get_att(jEle, 'display_expired_text');
1620 if(exp){
1621 jEle.attr('display_expired_text', exp);
1622 }else{
1623 jEle.removeAttr('display_expired_text', exp);
1624 }
1625
1626 pagelayer_countdown(jEle);
1627
1628 if(pagelayer_empty(el['atts']['days']) && pagelayer_empty(el['atts']['hours']) && pagelayer_empty(el['atts']['minutes']) && pagelayer_empty(el['atts']['seconds']) ){
1629 jEle.find('.pagelayer-countdown-counter').html('<h2>Countdown Timer Holder</h2>');
1630 }
1631
1632 }
1633
1634 // Render the share
1635 function pagelayer_render_pl_share(el){
1636
1637 if('text' in el.atts){
1638 el.atts['icon_label'] = el.atts['text'];
1639 return;
1640 }
1641
1642 var icon = '';
1643
1644 if(!pagelayer_empty(el.atts['icon'])){
1645 var icon_splited = el.atts['icon'].split(' fa-');
1646 icon = icon_splited[1];
1647 }
1648
1649 var labelList = { 'Facebook' : ['facebook', 'facebook-official', 'facebook-f', 'facebook-messenger', 'facebook-square'],
1650 'Twitter' : ['twitter', 'twitter-square'],
1651 'X' : [ 'x-twitter', 'x-twitter-square'],
1652 'Google+' : ['google-plus', 'google-plus-square', 'google-plus-g'],
1653 'Instagram' : ['instagram'],
1654 'Linkedin' : ['linkedin', 'linkedin-square', 'linkedin-in'],
1655 'Pinterest' : ['pinterest', 'pinterest-p', 'pinterest-square'],
1656 'Reddit' : ['reddit-alien', 'reddit-square', 'reddit'],
1657 'Skype' : ['skype'],
1658 'Stumbleupon' : ['stumbleupon', 'stumbleupon-circle'],
1659 'Telegram' : ['telegram', 'telegram-plane'],
1660 'Tumblr' : ['tumblr', 'tumblr-square'],
1661 'VK' : ['vk'],
1662 'Weibo' : ['weibo'],
1663 'WhatsApp' : ['whatsapp', 'whatsapp-square'],
1664 'WordPress' : ['wordpress', 'wordpress-simple'],
1665 'Xing' : ['xing', 'xing-square'],
1666 'Delicious' : ['delicious'],
1667 'Dribbble' : ['dribbble', 'dribbble-square'],
1668 'Snapchat' : ['snapchat-ghost'],
1669 'Pocket' : ['get-pocket'],
1670 'Email' : ['envelope', 'envelope-open', 'envelope-o']
1671 }
1672
1673 jQuery.each(labelList, function(key, value){
1674 if(jQuery.inArray(icon, value) != -1){
1675 el.atts['icon_label'] = key;
1676 }
1677 });
1678
1679 }
1680
1681 // Render the share icon
1682 function pagelayer_render_end_pl_share(el){
1683 pagelayer_social(el.$, '.pagelayer-share-content');
1684 }
1685
1686 // copyright rendering function
1687 var pagelayer_copyright;
1688 function pagelayer_render_pl_copyright(el){
1689 if(pagelayer_empty(el.atts['copyright_text'])){
1690 return;
1691 }
1692 pagelayer_copyright = el.atts['copyright_text'];
1693
1694 }
1695
1696 // Render the animated heading
1697 function pagelayer_render_pl_anim_heading(el){
1698
1699 el.atts['rotate_html'] = '';
1700
1701 // Creates html for rotating text
1702 if(!pagelayer_empty(el.atts['rotate_text'])){
1703
1704 var rotate_text = '';
1705 rotate_text = el.atts['rotate_text'].split(',');
1706
1707 el.atts['rotate_html'] += '<div class="pagelayer-animated-heading pagelayer-rotating-text pagelayer-words-wrapper">';
1708
1709 jQuery.each(rotate_text, function(i){
1710 el.atts['rotate_html'] += '<span';
1711 if(i == 0){
1712 el.atts['rotate_html'] += ' class="pagelayer-is-visible"';
1713 }
1714 el.atts['rotate_html'] += '>' + rotate_text[i] + '</span>';
1715 });
1716
1717 el.atts['rotate_html'] += '</div>';
1718
1719 }
1720
1721 // Required classes for particular rotate
1722 el.atts['rotate_req'] = '';
1723 var letters = ['pagelayer-aheading-rotate2', 'pagelayer-aheading-rotate3', 'type', 'pagelayer-aheading-scale'];
1724
1725 if(jQuery.inArray(el.atts['animations'], letters) != -1){
1726 el.atts['rotate_req'] = 'letters ';
1727 }
1728
1729 if(el.atts['animations'] == 'pagelayer-aheading-clip'){
1730 el.atts['rotate_req'] = 'is-full-width ';
1731 }
1732
1733 }
1734
1735 // Render animated heading
1736 function pagelayer_render_end_pl_anim_heading(el){
1737 var jEle = el.$;
1738 pagelayer_anim_heading(jEle);
1739 }
1740
1741 function pagelayer_render_pl_post_title(el){
1742 el['atts']['open_html_tag'] = !pagelayer_empty(el['atts']['html_tag']) ? '<'+el['atts']['html_tag']+'>' : '';
1743 el['atts']['close_html_tag'] = !pagelayer_empty(el['atts']['html_tag']) ? '</'+el['atts']['html_tag']+'>' : '';
1744 }
1745
1746 // Render Markdown
1747 function pagelayer_inject_md_button(wrapper){
1748 if(wrapper.find('.pagelayer-float-edit-btn').length === 0){
1749 wrapper.prepend('<button class="pagelayer-float-edit-btn" type="button" onclick="pagelayer_open_md_modal(event)">Open Markdown Editor <span class="dashicons dashicons-edit"></span></button>');
1750 }
1751 }
1752
1753 pagelayer_add_action('pagelayer_element_setup', function(e, j_ele){
1754 // Check if the element being set up is our Markdown widget
1755 var tag = j_ele.attr('pagelayer-tag') || '';
1756 if(tag === 'pl_markdown'){
1757 var wrapper = j_ele.find('.pagelayer-markdown-wrapper');
1758 pagelayer_inject_md_button(wrapper);
1759 }
1760 });
1761
1762 function pagelayer_render_end_pl_markdown(el){
1763
1764 if(typeof pagelayer_render_end_pl_markdown.vault === 'undefined'){
1765 pagelayer_render_end_pl_markdown.vault = {};
1766 }
1767
1768 var memory_vault = pagelayer_render_end_pl_markdown.vault;
1769 var widget_id = el.id || el.ele_id || el.$.attr('id') || 'md_fallback_id';
1770 var default_placeholder = 'Select a Markdown file or enter a URL to load content.';
1771
1772 var wrapper = el.$.find('.pagelayer-markdown-wrapper');
1773 var output_div = wrapper.find('.pagelayer-markdown-output');
1774
1775 // Ensure button is there on setting changes
1776 pagelayer_inject_md_button(wrapper);
1777
1778 var src_type = el.atts['src_type'] || 'upload';
1779 var current_file = el.atts['markdown_file'] || '';
1780 var current_url = el.atts['markdown_url'] || '';
1781 var current_text_file = el.atts['markdown_text_file'] || '';
1782 var current_text_url = el.atts['markdown_text_url'] || '';
1783 var loader_html = '<div class="pagelayer-markdown-spinner"><i class="fa fa-spinner fa-spin fa-3x fa-fw" aria-hidden="true"></i></div>';
1784
1785 var active_text = src_type === 'upload' ? current_text_file : current_text_url;
1786 var active_source = src_type === 'upload' ? current_file : current_url;
1787
1788 wrapper.find('.pagelayer-markdown-hidden-raw').val(active_text);
1789 var has_source = active_source !== '' || (active_text !== '' && active_text !== default_placeholder);
1790
1791 if(typeof memory_vault[widget_id] === 'undefined'){
1792 var initial_html = (el.atts['markdown_rendered'] !== default_placeholder) ? el.atts['markdown_rendered'] : '';
1793 memory_vault[widget_id] = {
1794 el: el,
1795 source: active_source,
1796 src_type: src_type,
1797 text: active_text,
1798 html: initial_html,
1799 timer: null,
1800 force_fetch: false
1801 };
1802 }
1803
1804 var cache = memory_vault[widget_id];
1805 cache.el = el; // Always update the el reference
1806 cache.src_type = src_type; // Update src_type too
1807
1808 // Sync Buttons for Sidebar (Event Delegation)
1809 if(typeof pagelayer !== 'undefined' && pagelayer.$$){
1810 var sidebar_body = pagelayer.$$('body');
1811
1812 sidebar_body.off('click', '.pagelayer-md-sync-file').on('click', '.pagelayer-md-sync-file', function(e){
1813 e.preventDefault();
1814 cache.force_fetch = true;
1815 el.atts['markdown_rendered'] = loader_html;
1816 el.atts['markdown_text_file'] = '';
1817 var text_input = pagelayer.$$('[pagelayer-elp-name="markdown_text_file"] .pagelayer-elp-textarea');
1818 if(text_input.length) text_input.val('').trigger('input');
1819 });
1820
1821 sidebar_body.off('click', '.pagelayer-md-sync-url').on('click', '.pagelayer-md-sync-url', function(e){
1822 e.preventDefault();
1823 cache.force_fetch = true;
1824 el.atts['markdown_rendered'] = loader_html;
1825 el.atts['markdown_text_url'] = '';
1826 var text_input_url = pagelayer.$$('[pagelayer-elp-name="markdown_text_url"] .pagelayer-elp-textarea');
1827 if(text_input_url.length) text_input_url.val('').trigger('input');
1828 });
1829 }
1830
1831 if(!has_source){
1832 output_div.html('<div class="pagelayer-markdown-placeholder">' + default_placeholder + '</div>');
1833 return;
1834 }
1835
1836 var is_empty = (active_text === '' || active_text === default_placeholder);
1837 var source_changed = cache.source !== active_source;
1838 var text_changed = cache.text !== active_text;
1839
1840 cache.source = active_source;
1841 cache.text = active_text;
1842
1843 var should_compile = false;
1844
1845 if(cache.force_fetch){
1846 should_compile = true;
1847 cache.force_fetch = false;
1848 } else if(is_empty && source_changed){
1849 should_compile = true;
1850 } else if(text_changed){
1851 should_compile = true;
1852 }
1853
1854 if(!should_compile){
1855 var saved_html = cache.html || el.atts['markdown_rendered'];
1856 if(saved_html && saved_html !== default_placeholder && saved_html !== ''){
1857 output_div.html(saved_html);
1858 el.atts['markdown_rendered'] = saved_html;
1859 }
1860 return;
1861 }
1862
1863 if(is_empty || source_changed){
1864 output_div.html(loader_html);
1865 el.atts['markdown_rendered'] = loader_html;
1866 }
1867
1868 clearTimeout(cache.timer);
1869 cache.timer = setTimeout(function(){
1870 jQuery.ajax({
1871 url: pagelayer_ajax_url + '&action=pagelayer_handle_markdown',
1872 type: 'post',
1873 data: {data: el.atts, pagelayer_nonce: pagelayer_ajax_nonce},
1874 success: function(response){
1875 var json = jQuery.parseJSON(response);
1876
1877 output_div.html(json.html);
1878 el.atts['markdown_rendered'] = json.html;
1879 cache.html = json.html;
1880
1881 if(json.is_error){
1882 return;
1883 }
1884
1885 if(json.raw_text){
1886 var input_name = src_type === 'upload' ? 'markdown_text_file' : 'markdown_text_url';
1887 var current_saved_text = el.atts[input_name] || '';
1888
1889 if(current_saved_text === '' || current_saved_text.indexOf(default_placeholder) !== -1){
1890 el.atts[input_name] = json.raw_text;
1891 cache.text = json.raw_text;
1892 wrapper.find('.pagelayer-markdown-hidden-raw').val(json.raw_text);
1893
1894 var sidebar_input = pagelayer.$$('[pagelayer-elp-name="' + input_name + '"] .pagelayer-elp-textarea');
1895 if(sidebar_input.length > 0 && sidebar_input.val() !== json.raw_text){
1896 sidebar_input.val(json.raw_text).trigger('input');
1897 }
1898 }
1899 }
1900 }, error: function(){
1901 var error_html = 'Failed to load content. Please check your connection or try clicking "Fetch File Content".';
1902 output_div.html('');
1903 el.atts['markdown_rendered'] = '';
1904 cache.html = '';
1905 }
1906 });
1907 }, 1000);
1908 }
1909
1910 // Open Markdown Modal
1911 function pagelayer_open_md_modal(e){
1912 e.preventDefault();
1913
1914 var wrapper = jQuery(e.target).closest('.pagelayer-markdown-wrapper');
1915 if(wrapper.length === 0) return;
1916
1917 var el = pagelayer_active ? pagelayer_active.el : null;
1918 var widget_id = wrapper.closest('.pagelayer-ele').attr('id');
1919 var cache = (typeof pagelayer_render_end_pl_markdown.vault !== 'undefined') ? pagelayer_render_end_pl_markdown.vault[widget_id] : null;
1920
1921 if(!pagelayer_active || !pagelayer_active.el){
1922 // If clicking button before clicking widget, force Pagelayer to select the widget first
1923 wrapper.closest('.pagelayer-ele').click();
1924 }
1925
1926 var modal = jQuery('body > .pagelayer-markdown-modal');
1927 if (modal.length === 0){
1928 var editor_html = `
1929 <div class="pagelayer-markdown-modal" style="display: none;">
1930 <div class="pagelayer-mardown-modal-editor">
1931 <div class="pagelayer-markdown-modal-header">
1932 <h3>Markdown Editor</h3>
1933 <span>Press <strong>Ctrl + Enter</strong> to Compile and Preview</span>
1934 <button type="button" class="pagelayer-btn-success" onclick="pagelayer_close_md_modal(event)">Save & Close</button>
1935 <span class="pagelayer-markdown-close-btn" onclick="pagelayer_cancel_md_modal(event)" title="Discard Changes">&times;</span>
1936 </div>
1937 <div class="pagelayer-markdown-modal-container">
1938 <div class="pagelayer-markdown-modal-input-box">
1939 <textarea class="pagelayer-markdown-modal-input" placeholder="Type Markdown here..."></textarea>
1940 </div>
1941 <div class="pagelayer-markdown-modal-preview">
1942 Loading preview...
1943 </div>
1944 </div>
1945 </div>
1946 </div>
1947 `;
1948 jQuery('body').append(editor_html);
1949 modal = jQuery('body > .pagelayer-markdown-modal');
1950 }
1951
1952 var textarea = modal.find('.pagelayer-markdown-modal-input');
1953 var preview = modal.find('.pagelayer-markdown-modal-preview');
1954
1955 var el = cache ? cache.el : (pagelayer_active ? pagelayer_active.el : null);
1956 var src_type = (el && el.atts['src_type']) ? el.atts['src_type'] : 'upload';
1957
1958 // If sidebar is open, it might have more recent unsaved changes for src_type
1959 var active_radio_btn = pagelayer.$$('[pagelayer-elp-name="src_type"] .pagelayer-elp-radio-active');
1960 if(active_radio_btn.length > 0){
1961 src_type = active_radio_btn.attr('val');
1962 }
1963
1964 var active_input_name = (src_type === 'upload') ? 'markdown_text_file' : 'markdown_text_url';
1965
1966 modal.data('parent_wrapper', wrapper);
1967
1968 var backup_text = wrapper.find('.pagelayer-markdown-hidden-raw').val() || '';
1969 var backup_html = wrapper.find('.pagelayer-markdown-output').html() || '';
1970 modal.data('backup_text', backup_text);
1971 modal.data('backup_html', backup_html);
1972 modal.data('is_modified', false);
1973
1974 var current_text = wrapper.find('.pagelayer-markdown-hidden-raw').val() || '';
1975 var default_placeholder = 'Select a Markdown file or enter a URL to load content.';
1976
1977 if(current_text === default_placeholder){
1978 current_text = '';
1979 } else{
1980 if(el){
1981 el.atts[active_input_name] = current_text;
1982 }
1983 }
1984
1985 textarea.val(current_text);
1986 modal.fadeIn(200);
1987
1988 if(current_text !== ''){
1989 pagelayer_modal_compile(current_text, preview, wrapper, false);
1990 } else{
1991 preview.html('<p>Type Markdown here to see preview...</p>');
1992 }
1993
1994 textarea.off('keydown').on('keydown', function(e){
1995 if((e.ctrlKey || e.metaKey) && (e.key === 'Enter' || e.keyCode === 13)){
1996 e.preventDefault();
1997 var new_text = jQuery(this).val();
1998 modal.data('is_modified', true);
1999
2000 if(el){
2001 el.atts[active_input_name] = new_text;
2002 }
2003 wrapper.find('.pagelayer-markdown-hidden-raw').val(new_text);
2004
2005 var sidebar_input = pagelayer.$$('[pagelayer-elp-name="' + active_input_name + '"] .pagelayer-elp-textarea');
2006 if(sidebar_input.length > 0){
2007 sidebar_input.val(new_text).trigger('input');
2008 }
2009 pagelayer_modal_compile(new_text, preview, wrapper);
2010 }
2011 });
2012
2013 textarea.off('paste').on('paste', function(e){
2014 e.preventDefault();
2015 e.stopPropagation();
2016
2017 var pasted_data = (e.originalEvent || e).clipboardData.getData('text/plain');
2018 var $this = jQuery(this);
2019 var current_val = $this.val();
2020 var start = this.selectionStart;
2021 var end = this.selectionEnd;
2022 var new_text = current_val.substring(0, start) + pasted_data + current_val.substring(end);
2023
2024 $this.val(new_text);
2025 modal.data('is_modified', true);
2026
2027 if(el) {
2028 el.atts[active_input_name] = new_text;
2029 }
2030 wrapper.find('.pagelayer-markdown-hidden-raw').val(new_text);
2031
2032 var sidebar_input = pagelayer.$$('[pagelayer-elp-name="' + active_input_name + '"] .pagelayer-elp-textarea');
2033 if(sidebar_input.length > 0){
2034 sidebar_input.val(new_text).trigger('input');
2035 }
2036 pagelayer_modal_compile(new_text, preview, wrapper);
2037 });
2038 }
2039
2040 // Close Markdown Modal
2041 function pagelayer_close_md_modal(e){
2042 e.preventDefault();
2043 var modal = jQuery(e.target).closest('.pagelayer-markdown-modal');
2044 modal.hide();
2045 var wrapper = modal.data('parent_wrapper');
2046
2047 if(modal.data('is_modified') && pagelayer_active && pagelayer_active.el){
2048 var active_radio_btn = pagelayer.$$('[pagelayer-elp-name="src_type"] .pagelayer-elp-radio-active');
2049 var src_type = active_radio_btn.length > 0 ? active_radio_btn.attr('val') : (pagelayer_active.el.atts['src_type'] || 'upload');
2050 var active_input_name = (src_type === 'upload') ? 'markdown_text_file' : 'markdown_text_url';
2051
2052 var sidebar_input = pagelayer.$$('[pagelayer-elp-name="' + active_input_name + '"] .pagelayer-elp-textarea');
2053 if(sidebar_input.length > 0){
2054 sidebar_input.trigger('input');
2055 }
2056 modal.data('is_modified', false);
2057 }
2058
2059 modal.remove();
2060 }
2061
2062 // Cancel Markdown Modal
2063 function pagelayer_cancel_md_modal(e){
2064 e.preventDefault();
2065 var modal = jQuery(e.target).closest('.pagelayer-markdown-modal');
2066 var wrapper = modal.data('parent_wrapper');
2067 if(!wrapper) return;
2068
2069 var widget_id = wrapper.closest('.pagelayer-ele').attr('id');
2070 var cache = (typeof pagelayer_render_end_pl_markdown.vault !== 'undefined') ? pagelayer_render_end_pl_markdown.vault[widget_id] : null;
2071 var el = cache ? cache.el : (pagelayer_active ? pagelayer_active.el : null);
2072
2073 var backup_text = modal.data('backup_text') || '';
2074 var backup_html = modal.data('backup_html') || '';
2075
2076 // Restore state if we have the element
2077 if(el){
2078 var src_type = el.atts['src_type'] || 'upload';
2079 var active_radio_btn = pagelayer.$$('[pagelayer-elp-name="src_type"] .pagelayer-elp-radio-active');
2080 if(active_radio_btn.length > 0){
2081 src_type = active_radio_btn.attr('val');
2082 }
2083 var active_input_name = (src_type === 'upload') ? 'markdown_text_file' : 'markdown_text_url';
2084
2085 el.atts[active_input_name] = backup_text;
2086 el.atts['markdown_rendered'] = backup_html;
2087
2088 if(cache){
2089 cache.html = backup_html;
2090 cache.text = backup_text;
2091 }
2092
2093 var sidebar_input = pagelayer.$$('[pagelayer-elp-name="' + active_input_name + '"] .pagelayer-elp-textarea');
2094 if(sidebar_input.length > 0 && sidebar_input.val() !== backup_text){
2095 sidebar_input.val(backup_text).trigger('input');
2096 }
2097 }
2098
2099 // Restore UI
2100 wrapper.find('.pagelayer-markdown-hidden-raw').val(backup_text);
2101 wrapper.find('.pagelayer-markdown-output').html(backup_html);
2102
2103 modal.fadeOut(200, function(){
2104 modal.appendTo(wrapper.find('.pagelayer-markdown-editor-ui'));
2105 });
2106 }
2107
2108 // Compile Markdown
2109 function pagelayer_modal_compile(text, preview_element, wrapper_element){
2110 var widget_id = wrapper_element.closest('.pagelayer-ele').attr('id');
2111 var cache = (typeof pagelayer_render_end_pl_markdown.vault !== 'undefined') ? pagelayer_render_end_pl_markdown.vault[widget_id] : null;
2112 var el = cache ? cache.el : (pagelayer_active ? pagelayer_active.el : null);
2113
2114 if(!el) return;
2115
2116 preview_element.html('<p>Compiling...</p>');
2117
2118 var src_type = el.atts['src_type'] || 'upload';
2119 var active_radio_btn = pagelayer.$$('[pagelayer-elp-name="src_type"] .pagelayer-elp-radio-active');
2120 if(active_radio_btn.length > 0){
2121 src_type = active_radio_btn.attr('val');
2122 }
2123
2124 var active_input_name = (src_type === 'upload') ? 'markdown_text_file' : 'markdown_text_url';
2125
2126 var ajax_data = jQuery.extend(true, {}, el.atts);
2127 ajax_data[active_input_name] = text;
2128 ajax_data['src_type'] = src_type;
2129
2130 jQuery.ajax({
2131 url: pagelayer_ajax_url + '&action=pagelayer_handle_markdown',
2132 type: 'post',
2133 data: {data: ajax_data, pagelayer_nonce: pagelayer_ajax_nonce},
2134 success: function(response){
2135 var json = jQuery.parseJSON(response);
2136 preview_element.html(json.html);
2137
2138 wrapper_element.find('.pagelayer-markdown-output').html(json.html);
2139 el.atts['markdown_rendered'] = json.html;
2140
2141 if(cache){
2142 cache.html = json.html;
2143 }
2144
2145 if(json.is_error){
2146 return;
2147 }
2148
2149 if(cache){
2150 cache.text = json.raw_text || text;
2151 }
2152
2153 if(json.raw_text){
2154 var default_placeholder = 'Select a Markdown file or enter a URL to load content.';
2155 var current_saved_text = el.atts[active_input_name] || '';
2156
2157 if(current_saved_text === '' || current_saved_text.indexOf(default_placeholder) !== -1){
2158 wrapper_element.find('.pagelayer-markdown-modal-input').val(json.raw_text);
2159 el.atts[active_input_name] = json.raw_text;
2160 wrapper_element.find('.pagelayer-markdown-hidden-raw').val(json.raw_text);
2161
2162 var sidebar_input = pagelayer.$$('[pagelayer-elp-name="' + active_input_name + '"] .pagelayer-elp-textarea');
2163 if(sidebar_input.length > 0){
2164 sidebar_input.val(json.raw_text).trigger('input');
2165 }
2166 }
2167 }
2168 },
2169 error: function(){
2170 var error_html = 'Failed to compile. The server did not respond correctly. Please check your connection and try again.';
2171 preview_element.html(error_html);
2172 }
2173 });
2174 }
2175
2176 ////////////////
2177 // Freemium End
2178 ////////////////
2179