Longitud del texto en un TinyMCE Editor

Este problema lo vi bastante por ahi dando vueltas, pero no encontre una solución piola, con lo cual decidí programarme mi propia solución. Aqui se las comparto, espero que les sirva: tengo un textarea enriquecido con tinyMCE. Este textarea deberia tener una longitud maxima, y no da para evaluar esto del lado del servidor.

Lo más logico sería obtener el contenido del textarea y calcular su longitud, PEEERO el contenido del textarea incluye muuucho html y non-breaking-spaces. O sea, lo ideal seria hacer :

Código:

function getEditorLength(editorid) { var text =  tinyMCE.get(editorid).getContent(); return text.length; // aca estamos al horno }

El tinyMCE no provee ninguna función para obtener el contenido en texto plano, así que tenemos que limpiarlo nosotros. Esta es la solución que se me ocurrió:

Código:

//remueve todo el codigo html function stripHTMLTags(text) { var inicio = text.indexOf(«<«,0); var fin=0; if (inicio == -1) return text; else { fin = text.indexOf(«>»,inicio); if (fin == -1) return text else return ( stripHTMLTags(text.substring(0,inicio) + text.substring(fin+1) ) ) ; } } //remueve todos los &nbsp; function removeNBSP(text) { var pos = text.indexOf(«&nbsp;»); if (pos == -1) return text; else return  removeNBSP(text.substring(0,pos) + text.substring(pos+6)); } //calcula la longitud del editor con id editorid function tinyMCE_editorLength(editorid) { tinyMCE.triggerSave(); var content = tinyMCE.get(editorid).getContent(); var clean = removeNBSP(stripHTMLTags(content)); return clean.length; }

Observacion: si al contenido solo le aplicamos la funcion stripHTML (y le dejamos los espacios), y luego contamos los espacios que tenemos (eliminamos los duplicados) y le sumamos uno , tendremos la cantidad de palabras que tiene ese texto.

Ahora, vamos a darle utilidad a esto. Yo quiero que, a medida que el tipo escribe, se le vaya avisando cuantos caracteres insertó. Para eso, agregué un eventListener onChange sobre el editor, y tengo un span con id totallength que le informa al tipito la longitud. Aca les pongo el codigo:

Código:

/* creo un onload event para que, cuando se termine de cargar toda la ventana, agregue el eventListener sobre el editor. Si no lo hacemos asi, no anda! */ window.onload = function() { var editorid = «id-del-editor-que-queremos-observar»; addOnKey(editorid); } //esta es la función que actualiza el texto de nuestro span cada vez que el editor cambia function addOnKey(editorid) { tinyMCE.triggerSave(); var ed = tinyMCE.get(editorid); ed.onChange.add( function(ed,e) { document.getElementById(«totallength»).innerHTML = » («+tinyMCE_editorLength(editorid)+»)»; }); }

Bueno, espero que les sirva. No anda bien si el tipo selecciona mucho texto y lo borra (el onChange ese no es taaaan onChange) pero básicamente, sirve.