[Plugin] Contador de caracteres no SCEditor

por Shek 02.09.15 15:42

Contador de caracteres no SCEditor
O objetivo deste plugin é calcular a quantidade de caracteres digitados mais os caracteres restantes. Se você exceder o limite de caracteres, provavelmente você receberá um aviso "você excedeu o limite estipulado". O objetivo é mantê-lo ciente de sua contagem de caracteres enquanto você digita.
Características e aplicação
Criador: Ange Tuteur
Versão: 1.0
Versão: Todas as versões
Resultado da aplicação

Local de instalação
A instalação é única, e pode ser feita apenas criando um novo javascript. Para isso, basta acessar Painel de Controle >> Módulos >> HTML e Javascript >> Gestão dos códigos Javascript >> Criar um novo javascript >> e Investimento, marque Para os tópicos ou para Todas as páginas como preferir. Código: $(function() { if (!document.getElementById('text_editor_textarea')) return; // no textarea ? better not continue :( // definir dados globais para ser armazenada em cache e reutilizada window.$fa_char = { area : document.getElementById('text_editor_textarea'), // mensagem da caixa de mensagem current : 0, // caracteres digitados atuais maximum : /page_profil=signature/.test(window.location.search) ? 1000 : 60000, // caracteres máximo permitido used : null, // cache de nó para caracteres usados remain : null, // cache de nó para caracteres restantes instance : null, // sceditor instance // calcular os caracteres utilizados e restante calculate : function() { $fa_char.current = ($fa_char.instance ? $fa_char.instance.val() : $fa_char.area.value).length; // get the message length $fa_char.used.innerHTML = $fa_char.current; // Atualiza a contagem atual $fa_char.remain.innerHTML = '<span ' + ($fa_char.current >= $fa_char.maximum ? 'style="color:#F00"' : '') + '>' + ($fa_char.maximum - $fa_char.current) + '</span>'; // atualizar os caracteres restantes } }; var node = document.createElement('DIV'); // recipiente para os dados chararacter node.id = 'faCharCounter'; // o ID é usado principalmente para estilos definidos pelo usuário node.innerHTML = '<span id="faCharUsed">0</span> caracteres utilizados de ' + $fa_char.maximum + ' (<span id="faCharRemain" style="color:#090">' + $fa_char.maximum + '</span> restantes)'; // definir os nossos dados de caráter $fa_char.area.parentNode.insertBefore(node, $fa_char.area); // inserir o recipiente antes da área de texto // atualizar os caches nó de modo que não tem que continuo recebendo esses elementos $fa_char.used = document.getElementById('faCharUsed'); $fa_char.remain = document.getElementById('faCharRemain'); // executar outro doc pronto para corresponder-se com o sceditor $(function() { // dependendo se o sceditor estiver presente, um destes eventos será ligado if ($.sceditor) { var container = $('.sceditor-container'); $fa_char.instance = $($fa_char.area).sceditor('instance'); $('textarea', container)[0].oninput = $fa_char.calculate; // source $('iframe', container).contents()[0].body.oninput = $fa_char.calculate; // wysiwyg } else $fa_char.area.oninput = $fa_char.calculate; $fa_char.calculate(); // obter a contagem de caracteres atual no carregamento da página }); });