El chiki chiki del programador

¡Teclea, teclea!El javascripy mola mogollón, funciona en el Explorer y también en Firefox.
Ponle javascripy a esa paginita,que el javascripy la deja muy bonita.
Abre ventanas, muestra mensajes, valida formularios, mi amol ya tu sabes!

Programan los seniors, programan los juniors, programa mi jefe con acentos en el function!

Y el javascripy se programa asi:

  1. El tag < script > >
  2. el function vars
  3. el alert-confirm
  4. el return trú

Programa el javascripy, programa el javascripy, programan los heavys y también los frikis
Programan en las ofis, programan en la uni,
Programan los Fruittis y también los Lunnis.

Programa Maradona esnifando una raya, y Juan Carlos le dice: ¿Porque no usas Ajax?
En el formulario de un triste portal,
pusieron javascripy y ya pudo validar¡¡¡Validar!! ¡¡Validar, validarr, validarrr

Y el javascripy se programa asi:

  1. El tag < script > >
  2. el function vars
  3. el alert-confirm
  4. el return trú

validar textarea teniendo en cuenta los saltos de línea

//Función per validar la longitud màxima de un textarea teniendo en cuenta los saltos de línia.

function ismaxlength(obj, longitud_ini) {
var alineas;
var nlineas, longitud;
longitud = longitud_ini;
alineas = obj.value.split(“rn”);
nlineas = alineas.length;
if (nlineas > 0) {
//Si hay saltos de línea hay que tenerlos en cuenta en la longitud máxima
longitud = longitud_ini – ((nlineas – 1) * 2);
}
if (obj.value.length > longitud) {
obj.value=obj.value.substring(0,longitud);
alert(msg.TXTA[0] + longitud_ini + msg.TXTA[1] +’n’);
}
}

Hacer un trim en Javascript con Regular expressions

Cómo hacer un trim en javascript de manera “elegante” usando regular expressions:

function trim(s){
s = s.replace(/\s+/gi, ‘ ‘); //sacar espacios repetidos dejando solo uno
s = s.replace(/^\s+|\s+$/gi, ”); //sacar espacios blanco principio y final

return s;
}

NICEDIT: Editor de contenido en Ajax y Javascript muy ligero. Solo 35kb

No cabe duda de que las formas de publicación de contenidos de textos ha cambiado a mejor gracias a los editores wysiwyg, permitiéndonos la edición visual de los propios contenidos casi como si estuviésemos escribiendo un texto formateado en un procesador de textos convencional.Y por suerte, a estos editores wysiwyg se le añaden otros nuevos con características más que interesantes. Y es que a los editores wysiwg conocidos, como puedan ser FCKEditor y TinyMCE, éste lo conocemos por su incorporación como editor visual en WordPress, tenemos NicEdit.

NicEdit viene a ser una alternativa eficiente, flexible y ligera frente a los otros pesos pesados. De hecho, sólo nos facilitan un archivo javascript más los iconos, ocupando en total unos 35 KB de peso, mucho menor que otras soluciones existentes, integrándose perfectamente en nuestros sitios web manteniendo nuestro look&feel.

Pero para aquellos que no puedan añadir estas librerías en los servidores que usan para sus sitios web, y siempre que puedan editar sus códigos, NicEdit facilita un script para que puedan ser añadidos en estos sitios web, usando las librerías desde su propio servidor.

Bastará con poner:

<html xmlns=”http://www.w3.org/1999/xhtml&#8221; xml:lang=”es” lang=”es”>

<head>
<title>sin título</title>
<meta http-equiv=”content-type” content=”text/html;charset=utf-8″ />
<meta name=”generator” content=”Geany 0.11″ />
<script src=”http://js.nicedit.com/nicEdit.js&#8221; type=”text/javascript”></script>
<script type=”text/javascript”>
bkLib.onDomLoaded(nicEditors.allTextAreas);
</script>
</head>

<body>
<textarea></textarea>
</body>
</html>

Y ya lo tendremos funcionando:

Su página oficial és: http://www.nicedit.com/

Navega por las fotos de Badongo con esta sencilla página

Código sencillo en Javascript y Html para navegar por las fotos de badongo. Es muy sencilla, sin ningún css de estilo que lo dejo a gusto de cada uno. Solo contiene lo minimo. Para hacerla servir crear un archivo html con este código.

<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>

<script type=”text/javascript”>

var i;

function nextImage(){

document.getElementById(“ibadongo”).src=”http://www.badongo.com/pix/&#8221; + i;

i++;
document.getElementById(“numimage”).value = i;

}

function prevImage(){

document.getElementById(“ibadongo”).src=”http://www.badongo.com/pix/&#8221; + i;

i–;
document.getElementById(“numimage”).value = i;

}

function randomImage(){

random(3000000);
document.getElementById(“ibadongo”).src=”http://www.badongo.com/pix/&#8221; + i;
document.getElementById(“numimage”).value = i;

}

function loadPage(){

random(3000000);
document.getElementById(“ibadongo”).src=”http://www.badongo.com/pix/&#8221; + i;

document.getElementById(“numimage”).value = i;

}

function random(num){

i = Math.round(num*Math.random())

}
function nav2image(){

i=document.getElementById(“numimage”).value
document.getElementById(“ibadongo”).src=”http://www.badongo.com/pix/&#8221; + i;
document.getElementById(“numimage”).value = i;

}

</script>

</head>
<body onload=”loadPage();”>
<input id=”btn_prev” type=”button” value=”Previo” name=”btn_previo” onclick=”prevImage();” />
<input id=”btn_next” type=”button” value=”Siguiente” name=”btn_next” onclick=”nextImage();” />
<input id=”btn_random” type=”button” value=”Random” name=”btn_next” onclick=”randomImage();” />
<input type=”text” id=”numimage” name=”numimage” value=”1″ /><input type=”submit” value=”Buscar” onclick=”nav2image();” />
<br>
<iframe id=”ibadongo” width=”1024″ height=”700″ name=”ibadongo”></iframe>
</body>
</html>

Esta página esta hecha con Geany, editor de textos GNU, desde linux Ubuntu 7.10

Benchmark de javascript en navegadores

Jeff Atwood de Coding Horror ha realizado un benchmark de la implementación de javascript de las últimas versiones de los navegadores más usados actualmente: Opera 9.5, Safari 3, Explorer 7 y Firefox 2. Para ello utilizó un nuevo benchmark lanzado por Apple llamado SunSpider que se basa en código “real” o sea código que normalmente es usado en aplicaciones web, las diferentes categorías que cubre son:

3d Cómputo que se usaría para renderizar 3d, como operaciones de punto flotante.
accesso Acceso a arrays, propiedades de objetos y a variables
bitops Operaciones bitwise
Control de flujo Bucles, recursividad, condicionales.
criptografía Código para funciones criptográficas.
fecha Desempeño del objeto “Date”
Matemáticas Cálculos matemáticos
regexp RExpresiones regulares
string Operaciones con cadenas de caracteres

Como podrás ver en los resultados del benchmark, Opera tuvo el mejor desempeño pero como indica Jeff tuvo que usar la última beta del navegador para que todo el benchmark funcionara correctamente. Le sigue Safari, un gran resultado considerando que las pruebas se hicieron sobre el SO Windows, seguramente sobre mac OSX sus números incluso mejorarían. El tercer lugar sería para Firefox 2, pero eso gracias a una anomalía de Explorer en las operaciones con Strings, de no ser por eso, Explorer gana por bastante margen al navegador de Mozilla.

En un mundo en que cada vez se usa más javascript, este tipo de benchmark empiezan a tener sentido. Lo de Firefox es una llamada de atención al equipo de desarrollo, resulta increible que es prácticamente el browser más lento en javascript. Sería interesante ejecutar el benchmark sobre Firefox 3 beta 2.

Gráfico de la comparativa