Manejo de Cookies en javascript

Os dejamos unas funciones por si se necesita manejar cookies en javascript.

function createCookie(name,value,days) {

    if (days) {

        var date = new Date();

        date.setTime(date.getTime()+(days*24*60*60*1000));

        var expires = "; expires="+date.toGMTString();

    }

    else var expires = "";

    document.cookie = name+"="+value+expires+"; path=/";

}



function readCookie(name) {

    var nameEQ = name + "=";

    var ca = document.cookie.split(';');

    for(var i=0;i < ca.length;i++) {

        var c = ca[i];

        while (c.charAt(0)==' ') c = c.substring(1,c.length);

        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);

    }

    return null;

}



function eraseCookie(name) {

    createCookie(name,"",-1);

}

Una aplicación de esto, podría ser, por ejemplo, si queremos mostrar un cierto mensaje a un usuario que entra por primera vez a nuestra página:

var aviso_nueva_web = readCookie('aviso_nueva_web');

if(!aviso_nueva_web || (aviso_nueva_web == '')) {

    show_aviso_new_web();

    createCookie('aviso_nueva_web', 1, 365);

}

Happy coding!

Publicado por: 0

Problema con el onchange en radiobuttons en IE

Resulta que en Internet Explorer solo se ejecuta el onchange de un radiobutton cuando pierde el foco, y normalmente eso no es lo que queremos, sino que se ejecute el evento conforme se selecciona algún valor.

Para solucionar esto podemos encontrar 3 soluciones:

1 – Utilizar el onclick en lugar del onchange.

2- Solucionarlo con un poco de jQuery.

3- Añadir que haga blur en el onclick.

De las 3 opciones, la primera no da muy buenos resultados, y la segunda no nos gusta porque no mola cargar la pagina con jQuery si no es necesario.

Así que nos quedamos con la tercera opción.

El resultado sería algo así como:

<input type="radio" name="foo" value="Uno" onchange="alert(this.value);" onclick="this.blur();"/>Green<br/>

<input type="radio" name="foo" value="Dos" onchange="alert(this.value);" onclick="this.blur();"/>Blue

Happy coding!!

Publicado por: 0

Juego del ‘caza patos’ con Html5 y javascript

Juego cazapatos html5 y javascriptAdemás de que el juego es un clásico, de los que seguro que muchos de nosotros nos acordaremos por haber estrenado con él la pistola de la Nintendo (la de 8 bits), ahora nos servirá para algo un poco más didáctico como aprender html 5.

El creador del juego nos explica que es su primer juego hecho en javascript y que le ha costado alrededor de 18-20 horas y unas 500 líneas de código, usando jquery y spritely aunque algo modificado.

Nos comenta además, la problemática de llevar el juego al iPad.

Desde luego un ejercicio interesante.

A tener en cuenta si deseamos emprendernos en este tipo de aventuras.

http://mattsurabian.com/duckhunt/.

Publicado por: 1

Reemplazar parámetro de una url por javascript

Este tipo de funciones que trabajan con cadenas de texto más o menos complejas como lo pueda ser una ‘url’, siempre son tediosas de hacer, y para algunos son todo un suplicio.

Seguro que hay mil maneras de hacer lo mismo que hace esta función, pero bueno, es una alternativa más, además, sin usar jquery ni ningún otro plugin o framework adicional.

Ahí va:

function replace_url_param(url, param_name, new_value)

{

    var base = url.substr(0, url.indexOf('?'));

    var query = url.substr(url.indexOf('?')+1, url.length);

    var a_query = query.split('&');

    for(var i=0; i < a_query.length; i++){

        var name = a_query[i].split('=')[0];

        var value = a_query[i].split('=')[1];

        if (name == param_name) a_query[i] = param_name+'='+new_value;

    }

    return base + '?' + a_query.join('&');

}

Esperamos que os sea útil.
(No dudéis en comentar otras alternativas, que seguro que son muy interesantes)

Publicado por: 2

Guía de buenas prácticas en el desarrollo Front End

Aquí os dejamos un gran recopilatorio sobre ciertos aspectos que tenemos que tener en cuenta cuando estamos desarrollando un proyecto.

Desde la definición del DOCTYPE, el uso de microformatos, o los ‘alt’ en las imágenes, hasta el código en javascript, jquery, css, e incluso alguna anotación sobre HTML5.

Front end development guidelines (en inglés)

Vale la pena darle un vistazo.

xD

Publicado por: 0