Truquillos de desarrollo web y programación #2: habilitar y deshabilitar un enlace con Javascript

En esta entrada voy a desarrollar una solución personal al problema de habilitar o deshabilitar un enlace web mediante Javascript.

Para ello he optado por modificar el atributo href del enlace, de manera que si el enlace está deshabilitado, cuando se haga clic en el enlace no se realice ninguna acción. Con esta solución no importa si el valor de href es una acción Javascript o una URL a la que se enlaza, cuando se desactive el enlace dejará de funcionar y cuando se vuelva a activar volverá a realizar la acción que tenía indicada en href.

Para ello, he creado dos funciones Javascript: una que activa el enlace y otra que lo desactiva. Las dos reciben como parámetro el enlace a activar o desactivar. Estas funciones son las siguientes:

function activarEnlaceJavascript(enlace){
    var href = enlace.href;
    var patron = /^javascript:;\/\*[\s\S]*\*\/$/;

    if(patron.test(enlace.href)){
        href = href.replace(/javascript:;\/\*/g, "");
        href = href.substr(0, href.length - 2);
    }
    enlace.href = href;
}

function desactivarEnlaceJavascript(enlace){
    var href = enlace.href;
    var patron = /^javascript:;\/\*[\s\S]*\*\/$/;

    if(!patron.test(href))
        href = "javascript:;/*" + href + "*/";

    enlace.href = href;
}

La función desactivarEnlaceJavascript() cambia el atributo href para que ejecute un código Javascript vacío. Si el valor del campo href del enlace original es valorHref, al desactivar el enlace el valor nuevo del campo href quedará como javascript:;/*valorHref*/. De esta manera, cuando hagamos clic en el enlace no se realizará ninguna acción, ya que el valor del enlace original quedará dentro de los comentarios y no se ejecutará.

El enlace sólo se desactivará si el campo href no cumple la expresión regular /^javascript:;\/\*[\s\S]*\*\/$/, lo que significa que no ha sido desactivado anteriormente, por lo que se puede desactivar. Esta expresión regular comprueba que el enlace comience por la cadena javascript:;/*, continúe por cualquier número de caracteres y finalice con */, que sería la forma de un enlace desactivado.

La función activarEnlaceJavascript() se encarga simplemente de volver a restaurar el valor original del campo href del enlace. Esta función quita lo que había añadido la función desactivarEnlaceJavascript(): el trozo de código javascript:;/* de la parte inicial y la finalización del comentario */ de la parte final. La activación del enlace sólo se producirá si se cumple la expresión regular ya citada anteriormente, lo que significa que sólo se activará si se encuentra en estado desactivado.

Pongo el código HTML de una pequeña página para probar el funcionamiento de la activación y desactivación. Esta página contiene un enlace y dos botones: uno para activar el enlace y otro para desactivarlo.

<html>
<head>
<script type="text/javascript">
function desactivarEnlaceJavascript(enlace){
    var href = enlace.href;
    var patron = /^javascript:;\/\*[\s\S]*\*\/$/;

    if(!patron.test(href))
        href = "javascript:;/*" + href + "*/";

    enlace.href = href;
}

function activarEnlaceJavascript(enlace){
    var href = enlace.href;
    var patron = /^javascript:;\/\*[\s\S]*\*\/$/;

    if(patron.test(enlace.href)){
        href = href.replace(/javascript:;\/\*/g, "");
        href = href.substr(0, href.length - 2);
    }
    enlace.href = href;
}
</script>
</head>
<body>
<a href="http://www.wordpress.com">Enlace</a>
<input type="button" onclick="activarEnlaceJavascript(document.getElementsByTagName('a')[0])" value="Activar" />
<input type="button" onclick="desactivarEnlaceJavascript(document.getElementsByTagName('a')[0])" value="Desactivar"/>

</body>
</html>

Espero que os sea útil :D .

Truquillos de desarrollo web y programación #1: cambiar el cursor del ratón mediante CSS

Muchas veces, durante mi trabajo como desarrollador web y programador, he necesitado solucionar pequeños problemas relativamente simples de los que no recordaba su solución exacta o que desconocía y necesitaba conocer. Imagino que a la mayoría de los que nos dedicamos a esto nos ha ocurrido muchas veces, y hemos tenido que recurrir a San Google, responsable de gran parte de los conocimientos adquiridos a lo largo de nuestra etapa de estudiantes y de currantes. Con todo esto, he pensado en crear una sección en el blog que recopile los diferentes “truquillos” de desarrollo web y de programación que me vaya encontrando por el camino y que crea que pueden ser curiosos y útiles para la gente.

El primer truquillo del que quiero hablar es el de cambiar el cursor del ratón en una página web utilizando CSS. Para ello, utilizaremos la propiedad CSS cursor. Si hemos modificado la propiedad cursor de un elemento HTML de la página con CSS, al pasar el ratón por encima de dicho elemento el cursor cambiará al que le hayamos indicado en la propiedad.

Los posibles valores que podemos dar a la propiedad cursor son los que se listan a continuación. Se puede comprobar el efecto de los diferentes valores pasando el ratón por encima de su recuadro.

cursor: auto;

cursor: default;

cursor: none;

cursor: help;

cursor: pointer;

cursor: progress;

cursor: wait;

cursor: crosshair;

cursor: text;

cursor: vertical-text;

cursor: alias;

cursor: copy;

cursor: move;

cursor: no-drop;

cursor: not-allowed;

cursor: e-resize;

cursor: n-resize;

cursor: ne-resize;

cursor: nw-resize;

cursor: s-resize;

cursor: se-resize;

cursor: sw-resize;

cursor: w-resize;

cursor: ew-resize;

cursor: ns-resize;

cursor: nesw-resize;

cursor: nwse-resize;

cursor: context-menu;

cursor: cell;

cursor: col-resize;

cursor: row-resize;

cursor: all-scroll;

También existe la posibilidad de indicar un cursor personalizado con la propiedad cursor, indicando como valor url(cursor.cur);, siendo cursor.cur la url del fichero con nuestro cursor personalizado. En el estándar no se especifica nada sobre el formato del fichero de cursor, se pueden utilizar por ejemplo cursores en formato CUR (similar al formato ICO) y en formato SVG.

Para más información sobre la propiedad cursor de CSS podéis mirar en la descripción de la propiedad cursor en el texto sobre el estándar. Espero que os sea útil.

Descargar Ubuntu 9.04 sin esperar

jj1Ya han pasado algo más de seis meses desde la última entrada que dejé en el blog. Para retomar nuevamente el hábito de escribir, voy a empezar con una entrada similar a la última que puse: enlaces para poder descargar la última versión de ubuntu sin tener que esperar a que se coloque el enlace oficial en la página de Ubuntu.

Los servidores europeos de los que se puede bajar la imagen del nuevo Ubuntu son:

http://es.releases.ubuntu.com/9.04/ubuntu-9.04-desktop-i386.iso

http://releases.ubuntu.com/9.04/ubuntu-9.04-desktop-i386.iso

http://se.releases.ubuntu.com/9.04/ubuntu-9.04-desktop-i386.iso

http://nl.releases.ubuntu.com/releases/9.04/ubuntu-9.04-desktop-i386.iso

La suma MD5 de la versión es la siguiente:

66fa77789c7b8ff63130e5d5a272d67b

En el momento en el que salga la versión oficial actualizaré la entrada confirmando si la suma MD5 de la versión alojada en estos servidores es la misma que la versión “definitiva”.

¡A descargar!

Actualización: la suma MD5 es correcta!

Descargar Ubuntu 8.10 sin esperar

Hasta que oficialmente se informe en la web de Ubuntu de la salida de la nueva versión 8.10, ya está disponible en algunos servidores la descarga de la versión definitiva. Podéis mirar en los diferentes servidores que hay en esta dirección, buscando el archivo de nombre ubuntu-8.10-desktop-i386.iso. Las sumas MD5 se encuentran en el fichero MD5SUM. Podéis descargar de los siguientes servidores europeos:

http://es.releases.ubuntu.com/8.10/ubuntu-8.10-desktop-i386.iso

http://de.archive.ubuntu.com/ubuntu-releases/8.10/ubuntu-8.10-desktop-i386.iso

http://releases.ubuntu.com/8.10/ubuntu-8.10-desktop-i386.iso

http://se.releases.ubuntu.com/8.10/ubuntu-8.10-desktop-i386.iso

http://nl.releases.ubuntu.com/releases/8.10/ubuntu-8.10-desktop-i386.iso

MD5: 24ea1163ea6c9f5dae77de8c49ee7c03

Si descargáis ahora y la versión es la misma que la anunciada en la web, os habréis ahorrado las típicas sobrecargas de servidor que ocurren cuando aparece una nueva versión. Recomiendo una vez se haya anunciado la versión definitiva comprobar si la suma MD5 de la nueva versión y la que he puesto es igual, para asegurarse de que es la misma.

En una entrada posterior describiré el proceso de instalación paso a paso. ¡Saludos y a descargar!

Edito: confirmo que la suma MD5 que he puesto en la entrada y la de la versión final son iguales.

Ideario

¿Habéis visto el videoclip de “Standby”? Es una de las mejores canciones de Extremoduro, en mi opinión. En el comienzo de este videoclip se recita un fragmento de un poema de Francisco M. Ortega Palomares llamado Ideario, de su libro Cuenta atrás. Podéis leer más de su obra aquí. A continuación os pongo el videoclip y la versión completa de este poema que nos hace reflexionar sobre el tipo de vida que tenemos hoy en día.

Me da vértigo el punto muerto
y la marcha atrás,
vivir en los atascos,
los frenos automáticos y el olor a gasoil.

Me angustia el cruce de miradas
la doble dirección de las palabras
y el obsceno guiñar de los semáforos.

Me da pena la vida, los cambios de sentido,
las señales de stop y los pasos perdidos.

Me agobian las medianas,
las frases que están hechas,
los que nunca saludan y los malos profetas.

Me fatigan los dioses bajados del Olimpo
a conquistar la Tierra
y los necios de espíritu.

Me entristecen quienes me venden clines
en los pasos de cebra,
los que enferman de cáncer
y los que sólo son simples marionetas.

Me aplasta la hermosura
de los cuerpos perfectos,
las sirenas que ululan en las noches de fiesta,
los códigos de barras,
el baile de etiquetas.

Me arruinan las prisas y las faltas de estilo,
el paso obligatorio, las tardes de domingo
y hasta la línea recta.

Me enervan los que no tienen dudas
y aquellos que se aferran
a sus ideales sobre los de cualquiera.

Me cansa tanto tráfico
y tanto sinsentido,
parado frente al mar mientras el mundo gira.

Ideario, Francisco Ortega Palomares

La Finca de Osorio

El pasado fin de semana estuve en un lugar totalmente diferente a lo que se suele ver en el campo de Gran Canaria: la Finca de Osorio. Acostumbrado a ver playas y lugares con poca vegetación, me sorprendió gratamente encontrarme con un bosque tan frondoso y abundante como el que se encuentra en esta finca.

La Finca de Osorio se encuentra a las afueras de Teror, en la carretera hacia Arucas. Esta finca perteneció antiguamente al mayorazgo de los Manrique de Lara y actualmente pertenece al Cabildo de Gran Canaria, por lo que podemos visitarla solicitándolo previamente. En la finca se pueden encontrar algunas extensiones de terreno dedicadas al cultivo, y grandes extensiones de bosques, principalmente de castaños y algunos restos de bosque de laurisilva, pero también de otras especies como encinas, plátanos, alcornoques y pinos. También se dedica parte de la finca a cultivos, tiene un aula de la naturaleza e incluso es posible alojarse en su albergue.

Continuar leyendo ‘La Finca de Osorio’

Videos de humor chanante

Os pongo unos vídeos de Alex Cornejo (afcorn en Youtube), que realiza vídeos publicitarios (la mayoría de los que he visto de festivales de música) utilizando humor del tipo “Muchachada nui” o “La hora chanante”. Son doblajes de vídeos de imágenes antiguas en blanco y negro, de Epi y Blas o de cualquier cosa, y son buenísimos, de mis favoritos de internet. No sé si os sonará el del anuncio del Fiat Punto, ese que salen unos pavos o uno que dice “soy un looser”, pues creo que él es el autor de ellos.

Aquí continuación os pongo los vídeos. Continuar leyendo ‘Videos de humor chanante’

Cómo grabar sonidos del PC en Ubuntu

El otro día estuve pensando que estaría chulo cambiarle el tono de llamada a mi móvil por uno nuevo, así que pensé en creármelo yo mismo a partir de un vídeo de Youtube, de la melodía de alguna película o de alguna de las series que suelo ver. Así que voy a explicar cómo hacer esto en Ubuntu 8.04, la última versión de esta distribución tan conocida de Linux, y que es el sistema operativo que yo utilizo habitualmente.

Continuar leyendo ‘Cómo grabar sonidos del PC en Ubuntu’

Vuelve Extremoduro

Después de seis años sin nuevas canciones de Extremoduro, por fin tenemos un nuevo disco de uno de los mejores grupos del rock español, aún diría yo más, leyenda viva. Como se suele decir: “uno de los nuestros”, “gente con clase”, etcétera.

La ley innata

El disco se titula La ley innata, y en su portada (imagen de la derecha) podemos ver un texto en latín de Cicerón, y de fondo, el hombre de Vitruvio (si hacéis click en la imagen lo veréis mejor). La cita se traduce de la siguiente manera:

Existe, de hecho, jueces, una ley no escrita, sino innata, la cual no hemos aprendido, heredado, leido, sino que de la misma naturaleza la hemos agarrado, exprimido, apurado, ley para la que no hemos sido educados, sino hechos; y en la que no hemos sido instruidos, sino empapados.

Este disco consta de una sola pieza dividida en varias partes. La primera parte es Dulce introducción al caos, un tema en forma de balada, tranquilo, y que contiene un solo de guitarra que personalmente a mí me encanta. Este solo tiene la melodía de la Cantata 147 de Bach que es muy conocida. El tema lo podéis escuchar al entrar en su página web oficial.

Después viene Primer movimiento: el sueño. Un tema tranquilo, pero que ya se empieza a parecer a algunos de los temas clásicos de su discografía. El siguiente tema es Segundo movimiento: lo de fuera. Empieza con una melodía de oboe pero poco a poco van entrando las guitarras y la voz del Robe, que da ese toque tan personal e inconfundible a las canciones de Extremoduro.

El Tercer movimiento: lo de dentro, es la parte más Extremoduro de todas, poesía de la buena. El guitarreo de Uoho, buenísimo. El Cuarto movimiento: la realidad es similar en letra y música al segundo movimiento, pero con un ritmo más tranquilo. Esta parte termina en silencio, y da paso a la última parte, la Coda flamenca (otra realidad), algo distinto que (si no recuerdo mal) no habían hecho nunca: darle un aire de flamenco a una de sus canciones. Un gran colofón para un gran disco.

Reflexión sobre el poder del dinero

Echando un vistazo a algunas páginas y me he encontrado con un blog muy interesante. El blog se llama Jóvenes Despiertos y habla de muchos temas que afectan al mundo en general y a los jóvenes en particular. Recomiendo que le echéis un vistazo, tiene contenidos bastante interesantes.

En este blog he visto una entrada en la que en el título se nos plantea una pregunta: ¿Sólo el 10% del dinero que circula en el mundo es real? El vídeo de Youtube que se muestra en la entrada nos sirve como una pequeña lección de economía financiera muy interesante. Este vídeo es un fragmento de unos 7 minutos de duración de la película Concursante, que pongo aquí:

Un buen tema sobre el que debatir y reflexionar. Lo que sí tengo claro es que el ser humano no es libre y es constantemente manipulado para que sólo unos pocos puedan vivir bien.

Si os interesan este tipo de temas, no debéis perderos el documental Zeitgeist, que podéis ver a través de Google Video en este enlace. En posteriores entradas comentaremos este documental.

¿Sólo el 10% del dinero que circula en el mundo es real?

Entradas siguientes »