63 lines
2.3 KiB
JavaScript
63 lines
2.3 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
var data = document.getElementById('pc-data');
|
|
if (!data) return;
|
|
|
|
var defaultTitle = data.dataset.defaultTitle;
|
|
var defaultDesc = data.dataset.defaultDesc;
|
|
var baseUrl = data.dataset.baseUrl;
|
|
|
|
function initCounter(inputId, counterId, max) {
|
|
var el = document.getElementById(inputId);
|
|
var ct = document.getElementById(counterId);
|
|
if (!el || !ct) return;
|
|
function upd() {
|
|
var n = el.value.length;
|
|
ct.textContent = n + ' / ' + max;
|
|
ct.className = n > max ? 'text-danger' : 'text-muted';
|
|
}
|
|
el.addEventListener('input', upd);
|
|
upd();
|
|
}
|
|
initCounter('seo_title', 'seo_title_counter', 60);
|
|
initCounter('seo_description', 'seo_desc_counter', 155);
|
|
|
|
function updatePreview() {
|
|
var seoTitle = document.getElementById('seo_title').value.trim();
|
|
var seoDesc = document.getElementById('seo_description').value.trim();
|
|
var slug = document.getElementById('confirm-slug').value.trim();
|
|
document.getElementById('preview-title').textContent = seoTitle || defaultTitle;
|
|
document.getElementById('preview-desc').textContent = seoDesc || defaultDesc;
|
|
document.getElementById('preview-url').textContent = baseUrl + slug;
|
|
}
|
|
|
|
['seo_title', 'seo_description', 'confirm-slug'].forEach(function (id) {
|
|
var el = document.getElementById(id);
|
|
if (el) el.addEventListener('input', updatePreview);
|
|
});
|
|
|
|
var slugInput = document.getElementById('confirm-slug');
|
|
var slugDisplay = document.getElementById('slug-display');
|
|
|
|
var btnSuggest = document.getElementById('slug-btn-suggest');
|
|
if (btnSuggest) {
|
|
btnSuggest.addEventListener('click', function () {
|
|
var val = btnSuggest.dataset.slugSuggest;
|
|
slugInput.value = val;
|
|
slugDisplay.textContent = val;
|
|
updatePreview();
|
|
});
|
|
}
|
|
|
|
var btnKeep = document.getElementById('slug-btn-keep');
|
|
if (btnKeep) {
|
|
btnKeep.addEventListener('click', function () {
|
|
var val = btnKeep.dataset.slugKeep;
|
|
slugInput.value = val;
|
|
slugDisplay.textContent = val;
|
|
updatePreview();
|
|
});
|
|
}
|
|
|
|
updatePreview();
|
|
});
|