function refreshSerp() {
var titleVal = document.getElementById('serp-title-in').value;
var urlVal = document.getElementById('serp-url-in').value;
var descVal = document.getElementById('serp-desc-in').value;
var viewTitle = document.getElementById('view-title');
var viewUrl = document.getElementById('view-url');
var viewDesc = document.getElementById('view-desc');
var titleCount = document.getElementById('title-count');
var descCount = document.getElementById('desc-count');
// Update Text
viewTitle.innerText = titleVal || 'Your Page Title Preview';
viewUrl.innerText = urlVal ? (urlVal.indexOf('http') === 0 ? urlVal : 'https://' + urlVal) : 'https://example.com/your-slug';
viewDesc.innerText = descVal || 'This is a preview of your meta description. It should provide a concise summary of your content to improve click-through rates.';
// Update Counts
titleCount.innerText = 'Characters: ' + titleVal.length + '/60';
descCount.innerText = 'Characters: ' + descVal.length + '/160';
// Color indicators
titleCount.style.color = (titleVal.length > 60) ? '#d93025' : '#666';
descCount.style.color = (descVal.length > 160) ? '#d93025' : '#666';
}
function clearFields() {
document.getElementById('serp-title-in').value = ";
document.getElementById('serp-url-in').value = ";
document.getElementById('serp-desc-in').value = ";
refreshSerp();
}