Publicado en
Programación el
7 de September de 2009 por
Manel Pérez Mata
Tags: JavaScript | Añadir comentario
Alguien con mucho tiempo libre (probablemente sea estudiante o esté parao), se ha entretenido en montar un Super Mario programado integramente en JavaScript y lo mejor es que el código apenas pesa 14Kb.
La verdad es que no me he parado a mirar el código, sin embargo, tal currada es digna de mención. Os dejo screenshot del juego, y enlaces al artículo y al juego para que veais, juzgueis y en caso de estar aburridos, estudieis el código

Artículo: Play Super Mario Bros in 14kB Javascript
Juega aquí
Publicado en
Internet el
4 de September de 2009 por
Manel Pérez Mata
Tags: Google, HTML, JavaScript | Añadir comentario
Si quieres montar unas estadísticas profesionales en tu web de manera rápida y sencilla (y lo que es mejor, gratis!), podemos abusar una vez más de nuestro gran amigo Google, pues a liberado una API mediante la qual podemos generar estadísticas sin recurrir a grandes conocimientos técnicos.
Para mostrar una gráfica en nuestro site, únicamente debemos hacer una llamada a una URL (construida siguiendo unas directrices) en el src de un tag image.
Google pone a nuestra disposición una gran cantidad de tipos de gráficas para que se adapte perfectamente a nuestras necesidades: lineales, barras, circulares, diagr de Venn, gráficas de punto e incluso mapas. … Seguir Leyendo
Publicado en
Programación el
12 de July de 2009 por
Manel Pérez Mata
Tags: AJAX, JavaScript, PHP | (1 Comentario)
Ayer os comentaba como pasar arrays por POST con PHP mediante los métodos serialize y unserialize y dejaba un poco al aire como hacerlo desde JavaScript.
Una manera bastante usual de hacerlo en JavaScript es concatenar los valores del array en un string separados por un token que luego nos permitirá volver a generar el array con la función split de PHP, sin embargo, nos puede ser interesante utilizar la serialización por defecto de PHP, de este modo al recoger el valor, únicamente tendremos que llamar a unserialize y volveremos a tener el array intacto. … Seguir Leyendo
Publicado en
Programación el
11 de July de 2009 por
Manel Pérez Mata
Tags: AJAX, JavaScript, PHP | (2 Comentarios)
Si queremos pasar un array por POST y lo hacemos tal cual, veremos que la cosa no acaba de funcionar. La manera correcta de hacerlo es serializando previamente nuestro vector y una vez enviado, deserializarlo. Para ello PHP dispone de las funciones serialize y unserialize que harán el trabajo por nosotros.
En el siguiente ejemplo, vemos un uso sencillo de este método para enviar nuestros datos por la web:
<?php
if(!isset($_POST['frutas']) && $_POST['frutas']=="" ) {
// Creamos el array frutas
$frutas[] = "Cereza";
$frutas[] = "Pera";
$frutas[] = "Fresa";
$frutas[] = "Manzana";
} else {
// si existe lo deserializamos para poder tratarlo
$frutas = unserialize(stripslashes($_POST['frutas']));
var_dump($frutas);
}
?>
<html>
<form method="POST">
<input type="hidden" name="frutas" value='<?php echo serialize($frutas) ?>'></input>
<input type="submit" value="Pasar">
</form>
</html></pre>
El resultado de hacer un var_dump de la variable $frutas serializado sería:
<pre dir="ltr"><span style="color: #cc0000;">a:4:{i:0;s:6:"Cereza";i:1;s:4:"Pera";i:2;s:5:"Fresa";i:3;s:7:"Manzana";}</span>
Si queremos, por ejemplo, enviar un array desde el lado del cliente mediante AJAX, podríamos por ejemplo, crearnos un método javascript sencillo que nos serializase un array y así luego poder desserializarlo desde PHP.
Mañana publicaré en un nuevo post una función serialize para JavaScript, de este modo, podemos enviar desde el lado cliente un array serializado con el submit de un formulario o mediante AJAX.
Publicado en
Programación el
15 de June de 2009 por
Manel Pérez Mata
Tags: HTML, JavaScript, PHP | (3 Comentarios)
Prácticamente todos los navegadores actuales, soportan imágenes codificadas en base64, sin embargo, esto no pasa con Internet Explorer (hasta su versión 7 al menos). Estareis pensando que no debería ser un problema ya que no solemos colocar las imágenes codificadas en el código html, sin embargo, podemos encontrarnos con la necesidad de tener embedida la imágen dentro del código por motivos x.
Un ejemplo de uso de imágenes en base64 en el código html sería:
<img src="data:image/gif;base64,R0lGODlhNQAkAKIAAHJycvwHBwAAqwCjC+3PDv///wAAAAAAACwAAAAANQAkAAAItAAHCBxIsODAAggTKlyYMIDDhxAjOjRIsSDDiwslaoRYseMAjCALbBzpsWJIjCM3lqR48mJKjSsNtmT4UmJMizMV1ox4k2BOnTsf9jz4E2FQoUM/FhV5NEBSpUWbOk26lOnRp1WlYl2qlSrXplujgvUq9irZn12HZh2r9qvZtmWDhkXLtufat3bdyj2bM23euDvn9q178+5euHTxFtYbmO9Mv4sB1xT8mHBMw40RD1Z8mXHNgAA7" width="200" alt="Base64 encoded image" />
Nos dará como resultado la siguiente imágen:

mira el código fuente si todavía tienes dudas
… Seguir Leyendo
Publicado en
Programación el
8 de June de 2009 por
Manel Pérez Mata
Tags: HTML, JavaScript | (6 Comentarios)
Con este sencillo código JavaScript, ajustamos la altura del iframe al tamaño de la página en él conteido, de ese modo, evitaremos el molesto scroll lateral.
<html>
<body>
<script language="JavaScript">
//Ajusta el tamaño de un iframe al de su contenido interior para evitar scroll
function autofitIframe(id){
if (!window.opera && document.all && document.getElementById){
id.style.height=id.contentWindow.document.body.scrollHeight;
} else if(document.getElementById) {
id.style.height=id.contentDocument.body.scrollHeight+"px";
}
}
</script>
<iframe id="miFrame" src="http://www.tecnoretales.com/" width="100%" height="0" frameborder="1" transparency="transparency" onload="autofitIframe(this);"></iframe>
</body>
</html>
Una vez cargado el iframe, llamamos a la función autofitIframe que se encargará de obtener la altura total de la página contenida y se la asignará al tamaño del iframe.
Simplemente…
Publicado en
Internet el
13 de May de 2009 por
Manel Pérez Mata
Tags: Google, JavaScript, Maps | Añadir comentario
El otro día os dejaba un script para obtener las coordenadas de Google Maps a partir de un código postal y un pais. Esto es muy útil si queremos recoger estas coordenadas de manera masiva, por ejemplo, para cargar toda esta información en nuestra base de datos de poblaciones.
Hoy os dejo un pequeño truco para obtener las coordenadas en la propia web de google maps utilizando las funciones de su API, sin tener que mirar el código fuente o rebuscar por el enlace… … Seguir Leyendo