Files
kupshop/web/common/static/wpj/wpj_toolbar.js
2025-08-02 16:30:27 +02:00

337 lines
10 KiB
JavaScript

/* global blocek_config, CKFinder, Sentry */
import cookies from 'js-cookie';
function openAdmin(e) {
var url = $(this).attr('href');
if (!url) {
return false;
}
var $dialog = $('#wpjToolbar_dialog'),
$iframe = false;
$dialog.find('iframe').each(function() {
if ($(this).attr('src') == url) {
$iframe = $(this);
$iframe.css('display', 'block');
} else {
$(this).css('display', 'none');
}
});
if ($iframe === false) {
$iframe = $('<iframe>');
$iframe.attr('src', url);
$('.wpjToolbar_dialog').append($iframe);
$dialog
.on('hide.bs.modal', function(e) {
var refresh = !$iframe[0].contentWindow.document.intact;
if (refresh) {
window.location = window.location;
}
})
.modal();
/*title: $(this).data("title"),*/
var first = true;
$iframe.on('load', function() {
if (first) {
this.contentWindow.document.intact = true;
first = false;
}
// prida classu rychupr pokud je pouzita rychla uprava
$(this.contentWindow.document)
.find('body')
.addClass('rychupr');
this.contentWindow.closeWindow = closeWindow;
});
} else {
$dialog.modal('show');
}
return false;
}
function closeWindow() {
$('#wpjToolbar_dialog').modal('hide');
}
function wpjSEODebug(on) {
var alertInfo = '';
alertInfo += '<span>SEO popis</span>' + $('meta[name="description"]').attr('content') + '<hr>';
alertInfo += '<span>Titulek</span>' + $('title').text() + '<hr>';
alertInfo += '<span>H1</span>' + $('h1').text() + '<hr>';
if ($('link[rel="canonical"]').length) {
alertInfo += '<span>Canonical URL</span>' + $('link[rel="canonical"]').attr('href') + '<hr>';
}
alertInfo += '<span>Meta robots</span>' + $('meta[name="robots"]').attr('content');
if (on) {
// boxik pro hlasky
$('body').append('<div id="wpjSEODbgr"></div>');
var dbgr = $('#wpjSEODbgr');
dbgr.html(alertInfo);
} else {
$('#wpjSEODbgr').remove();
}
}
window.wpjSEODebug = wpjSEODebug;
let currentComponentInfo = null, componentFreeze = false;
$('body').on('keydown', function(e) {
if ((e.code === 'KeyC' || e.code === 'KeyK') && e.altKey) {
$('[data-debug="Components"]').trigger('click');
}
})
function wpjComponentsDebug(on) {
if (on) {
// boxik pro hlasky
let $body = $('body');
$body.append('<div id="wpjSEODbgr"></div>');
const $dbgr = $('#wpjSEODbgr');
$body.on('keydown.toolbar', function(e) {
if (!currentComponentInfo) {
return;
}
if (e.code === 'KeyF') {
componentFreeze = !componentFreeze;
}
if (e.code === 'KeyT') {
window.location.replace(currentComponentInfo.template_file);
}
if (e.code === 'KeyP' || e.code === 'KeyC') {
window.location.replace(currentComponentInfo.class_file);
}
})
$body.addClass('wpj-debug-components').on('mousemove.toolbar keydown.toolbar', function(event) {
let info = currentComponentInfo;
if (!componentFreeze && event.type === 'mousemove') {
currentComponentInfo = info = $(event.target).closest('[data-component-info]').data('component-info');
}
var alertInfo = '';
if (info) {
alertInfo += `
<span>Name - Class</span>${info.name} - ${info.class}<hr>
<span>Template</span>${info.template}<hr>
<span>Entrypoints</span>${info.entrypoints.join(', ')}<hr>
<span>Versions</span>Current: ${info.shop.version} (twig: ${info.shop.template}, ts: ${info.shop.js}, scss: ${info.shop.css}), Latest: ${info.latest_version}<hr>
<span>Props</span>${info.props}<hr>
<span>Attributes</span>${info.attributes}<hr>
<span>HotKeys</span> (F)reeze: ${componentFreeze?'1':'0'}, open (C)lass, open (T)emplate
`;
}
$dbgr.html(alertInfo);
})
} else {
$('#wpjSEODbgr').remove();
$('body').removeClass('wpj-debug-components').off('mousemove.toolbar').off('keydown.toolbar');
}
}
window.wpjComponentsDebug = wpjComponentsDebug;
window.wpjSymfonyToolbarDebug = function(on) {
// pass
}
window.blocekHandler = {
enabled: false,
loadedCount: 0,
scriptCount: 0,
$button: null,
timer: null,
init: function() {
this.$button = $('#blocekEdit');
if (this.contentIsEditable()) {
this.$button.show();
var me = this;
this.$button.find('a').on('click', function() {
if (!$(this).hasClass('loading') && !$(this).hasClass('error')) {
me.enable();
}
return false;
});
}
},
contentIsEditable: function() {
return $('[data-blocek-editable]').length;
},
enable: function() {
if (!this.enabled) {
this.$button.find('a').addClass('loading');
this.startTimeOut();
jQuery.cachedScript = function(url, success, watchLoad = false) {
if (watchLoad) {
window.blocekHandler.handlePreLoad();
}
var options = {
dataType: 'script',
cache: true,
url: url,
success: function() {
if (typeof success === 'function') {
success();
}
if (watchLoad) {
window.blocekHandler.handleLoading(url);
}
},
error: function(err) {
if (watchLoad) {
window.blocekHandler.handleError(err);
}
}
};
return jQuery.ajax(options);
};
$('head').append(
'<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap&subset=latin-ext" rel="stylesheet">'
);
$.cachedScript('/common/static/wpj/wpj.blocek.js?1' + blocek_config.version, function() {
fetch("/_blocek/settings/").then(r => r.json()).then(response => {
wpj.blocek.config = { ...wpj.blocek.config, ...response.data };
wpj.blocek.config = { ...wpj.blocek.config, ...blocek_config };
$.cachedScript(blocek_config.bundleUrl ? blocek_config.bundleUrl : '/web/blocek/bundle' + blocek_config.version + '.js', undefined, true);
});
}, true);
$.cachedScript('/web/bundles/cksourceckfinder/ckfinder/ckfinder.js', function() {
CKFinder.config({ connectorPath: '/ckfinder/connector' });
CKFinder.basePath = '/web/bundles/cksourceckfinder/ckfinder/';
}, true);
// Set CKEditor4 base path
window.CKEDITOR_BASEPATH = '/ckeditor/';
$.cachedScript('/ckeditor/ckeditor.js', undefined, true);
$.cachedScript(
'https://maps.googleapis.com/maps/api/js?key=AIzaSyATr7a_ArAMgvJKPQp62dsYkyrWfTvQypc&libraries=places&language=cs&location=49.743755,15.338649&radius=333000'
);
} else if (this.enabled) {
this.handleStartEdit();
}
},
startTimeOut: function() {
this.timer = setTimeout(function() {
window.blocekHandler.handleError(new Error('Blocek loading has timed-out'));
}, 30000);
},
stopTimeOut: function() {
if (this.timer !== null) {
clearTimeout(this.timer);
}
},
handlePreLoad: function() {
this.scriptCount = this.scriptCount + 1;
},
handleLoading: function(url = null, error = false) {
this.loadedCount = this.loadedCount + 1;
var percent = (this.loadedCount * 100) / this.scriptCount;
this.$button.find('.wpjtoolbar-progress').width(`${percent}%`);
},
handleBlocekLoaded: function() {
this.enabled = true;
this.handleStartEdit();
this.stopTimeOut();
this.$button.find('a').removeClass('loading');
},
handleStartEdit: function() {
try {
wpj.blocek.startEdit();
this.stopTimeOut();
} catch (e) {
this.handleError(e);
}
},
handleError: function(error) {
this.enabled = false;
this.$button.find('a').addClass('error');
this.$button.find('a').removeClass('loading');
Sentry.captureException(error);
if (!$('.wpjtoolbar-error').length) {
const $errorMessage = `<div class="wpjtoolbar-error"><p>Jejda, něco se nepovedlo. Zkuste stránku načíst znovu.</p></div>`;
$('body').append($errorMessage);
}
}
};
$(document).ready(function() {
var $wpjToolbar = $('#wpj-header');
var $toolbarToggler = $('[data-wpjtoolbar-toggler]');
$('body').on('touchstart', function() {
$('#blocekEdit').hide();
});
$toolbarToggler.click(function() {
$wpjToolbar.toggleClass('wpjtoolbar-hidden');
var opened = $wpjToolbar.hasClass('wpjtoolbar-hidden');
cookies.set('adminToolbarHidden', opened ? 1 : 0, { path: '/', expires: 30 });
});
if (cookies.get('adminToolbarHidden') === '1') {
$wpjToolbar.toggleClass('wpjtoolbar-hidden', true);
}
$wpjToolbar.show();
$('[data-edit_button]').click(openAdmin);
function initDebug(debugType) {
if (cookies.get(debugType) === '1') {
$('[name=' + debugType + ']').prop('checked', 'checked');
window[debugType](true);
}
}
initDebug('wpjSEODebug');
initDebug('wpjSymfonyToolbarDebug');
$('[data-debug]').change(function() {
var debugType = 'wpj' + $(this).data('debug') + 'Debug';
var checked = $(this).prop('checked');
cookies.set(debugType, checked ? 1 : 0, { path: '/', expires: 30 });
window[debugType](checked);
});
window.blocekHandler.init();
if (window.location.href.includes('inlineEditable=1')) {
window.blocekHandler.enable();
// remove "inlineEditable" from url
var params = new URLSearchParams(window.location.search);
params.delete('inlineEditable');
if (window.history.replaceState) {
window.history.replaceState(Object.fromEntries(params.entries()), null, '?' + params.toString());
}
}
if (window.location.hash.includes('#noedit')) {
$('#wpj-header').hide();
}
$("[data-wpjClearCache]").click(function () {
cookies.set('skip_cache', 1, { path: '/', expires: 1 });
location.reload();
});
});