User:Mr. A/common.js: Difference between revisions
Page last edited 3 months ago by Mr. A
Created page with "// Word, character and byte counter for the wiki editor $(function() { // 1. Detect only the source editor using the recommended hook mw.hook('wikipage.editform').add(function($editForm) { if ($('#wpTextbox1').length === 0) return; // 2. Create the counter var counter = $(` <div id="mw-edit-counter" style=" position: fixed; bottom: 20px; right: 20px; padding: 12px..." |
(No difference)
|
Latest revision as of 17:42, 13 July 2025
// Word, character and byte counter for the wiki editor
$(function() {
// 1. Detect only the source editor using the recommended hook
mw.hook('wikipage.editform').add(function($editForm) {
if ($('#wpTextbox1').length === 0) return;
// 2. Create the counter
var counter = $(`
<div id="mw-edit-counter" style="
position: fixed;
bottom: 20px;
right: 20px;
padding: 12px 16px;
background: #20232a;
color: #61dafb;
border-radius: 8px;
font-family: system-ui, sans-serif;
font-size: 14px;
box-shadow: 0 4px 12px rgba(0,0,0,0.25);
z-index: 1100;
opacity: 0.95;
transition: background 0.3s;
">
<div style="display: flex; gap: 15px;">
<div><b>Words:</b> <span id="edit-words">0</span></div>
<div><b>Characters:</b> <span id="edit-chars">0</span></div>
<div><b>Bytes:</b> <span id="edit-bytes">0</span></div>
</div>
</div>
`);
$('body').append(counter);
// 3. Optimized counting function with text cleaning
function updateCounter() {
try {
var text = $('#wpTextbox1').val();
// Text cleaning for more accurate counting
var cleanText = text
.replace(/\[\[.*?\]\]/g, '') // Remove wiki links
.replace(/\{\{.*?\}\}/g, '') // Remove templates
.replace(/<[^>]+>/g, '') // Remove HTML tags
.replace(/={2,}.*?={2,}/g, '') // Remove headers
.replace(/[\[\]\{\}\|\*\#\:;]/g, '') // Other wiki characters
.replace(/\s+/g, ' ') // Multiple spaces -> single
.trim();
// Calculations using cleaned text
var words = cleanText === '' ? 0 : cleanText.split(/\s+/).length;
var chars = cleanText.length;
// Bytes calculation with original text (uncleaned)
var bytes = new Blob([text]).size;
// Update DOM
$('#edit-words').text(words);
$('#edit-chars').text(chars);
$('#edit-bytes').text(bytes);
// Change background color if exceeding 1000 words
$('#mw-edit-counter').css(
'background',
words > 1000 ? '#4a1a1a' : '#20232a' // Dark red / Dark blue
);
} catch (e) {
console.error('Error in updateCounter:', e);
}
}
// 4. Events and additional features
$('#wpTextbox1').on('input change keyup paste', updateCounter);
updateCounter(); // Initialize
// Make counter draggable (requires jquery.ui)
$('#mw-edit-counter').draggable({
handle: 'div',
containment: 'window'
});
});
});