94 lines
1.7 KiB
JavaScript
94 lines
1.7 KiB
JavaScript
|
import $ from 'jquery';
|
||
|
|
|
||
|
|
const $body = $('body');
|
||
|
|
const $doc = $(document);
|
||
|
|
const $preview = $('#vp_preview');
|
||
|
|
|
||
|
|
// prevent click on links.
|
||
|
|
document.addEventListener(
|
||
|
|
'click',
|
||
|
|
(e) => {
|
||
|
|
e.stopPropagation();
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
if (window.parentIFrame) {
|
||
|
|
window.parentIFrame.sendMessage('clicked');
|
||
|
|
}
|
||
|
|
},
|
||
|
|
true
|
||
|
|
);
|
||
|
|
|
||
|
|
// prevent click on <select> and similar elements.
|
||
|
|
document.addEventListener(
|
||
|
|
'mousedown',
|
||
|
|
(e) => {
|
||
|
|
e.stopPropagation();
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
e.target.blur();
|
||
|
|
window.focus();
|
||
|
|
},
|
||
|
|
true
|
||
|
|
);
|
||
|
|
|
||
|
|
// add dynamic data to AJAX calls.
|
||
|
|
$doc.on('startLoadingNewItems.vpf', (event, vpObject, url, ajaxData) => {
|
||
|
|
if (event.namespace !== 'vpf') {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
ajaxData.data = Object.assign(
|
||
|
|
ajaxData.data || {},
|
||
|
|
window.vp_preview_post_data
|
||
|
|
);
|
||
|
|
});
|
||
|
|
|
||
|
|
// Dynamic CSS cache.
|
||
|
|
const dynamicCSScache = {};
|
||
|
|
|
||
|
|
// configure iFrame resizer script.
|
||
|
|
window.iFrameResizer = {
|
||
|
|
log: false,
|
||
|
|
heightCalculationMethod() {
|
||
|
|
return $preview.outerHeight(true);
|
||
|
|
},
|
||
|
|
onMessage(data) {
|
||
|
|
if (!data || !data.name) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
switch (data.name) {
|
||
|
|
case 'resize':
|
||
|
|
// This random number needed for proper resize Isotope and other plugins.
|
||
|
|
$body.css('max-width', data.width + Math.random());
|
||
|
|
break;
|
||
|
|
case 'dynamic-css': {
|
||
|
|
// Insert dynamic styles.
|
||
|
|
const styleId = `vp-dynamic-styles-${data.blockId}-inline-css`;
|
||
|
|
|
||
|
|
// Skip if styles haven't changed.
|
||
|
|
if (
|
||
|
|
dynamicCSScache[styleId] &&
|
||
|
|
data.styles === dynamicCSScache[styleId]
|
||
|
|
) {
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
|
||
|
|
let $style = $(`#${styleId}`);
|
||
|
|
|
||
|
|
if (!$style.length) {
|
||
|
|
$style = $(`<style id="${styleId}"></style>`).appendTo(
|
||
|
|
'head'
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
dynamicCSScache[styleId] = data.styles;
|
||
|
|
|
||
|
|
$style.text(data.styles);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
// no default
|
||
|
|
}
|
||
|
|
},
|
||
|
|
};
|