57 lines
1.6 KiB
JavaScript
57 lines
1.6 KiB
JavaScript
/**
|
|
* S1 SEO Meta — Admin Scripts
|
|
* Live character counter with colour feedback.
|
|
*/
|
|
( function ( $ ) {
|
|
'use strict';
|
|
|
|
/**
|
|
* Update a counter element with the current length and apply colour classes.
|
|
*
|
|
* @param {jQuery} $counter The <span> element showing the count.
|
|
* @param {number} len Current character length.
|
|
* @param {number} soft Ideal upper boundary (turns amber above this).
|
|
* @param {number} hard Hard limit (turns red at or above this).
|
|
*/
|
|
function updateCounter( $counter, len, soft, hard ) {
|
|
$counter.text( len );
|
|
$counter
|
|
.removeClass( 's1-count-ok s1-count-warn s1-count-over' )
|
|
.addClass(
|
|
len >= hard ? 's1-count-over' :
|
|
len >= soft ? 's1-count-warn' :
|
|
len > 0 ? 's1-count-ok' : ''
|
|
);
|
|
}
|
|
|
|
function initCounters() {
|
|
// Title field
|
|
var $titleInput = $( '#s1_seo_title' );
|
|
var $titleCounter = $( '#s1_seo_title_count' );
|
|
|
|
if ( $titleInput.length && $titleCounter.length ) {
|
|
// Initialise on page load.
|
|
updateCounter( $titleCounter, $titleInput.val().length, 50, 60 );
|
|
|
|
$titleInput.on( 'input', function () {
|
|
updateCounter( $titleCounter, $( this ).val().length, 50, 60 );
|
|
} );
|
|
}
|
|
|
|
// Description field
|
|
var $descInput = $( '#s1_seo_description' );
|
|
var $descCounter = $( '#s1_seo_desc_count' );
|
|
|
|
if ( $descInput.length && $descCounter.length ) {
|
|
updateCounter( $descCounter, $descInput.val().length, 120, 160 );
|
|
|
|
$descInput.on( 'input', function () {
|
|
updateCounter( $descCounter, $( this ).val().length, 120, 160 );
|
|
} );
|
|
}
|
|
}
|
|
|
|
$( document ).ready( initCounters );
|
|
|
|
} )( jQuery );
|