Cómo cargar una imagen de error

Valencia, 09/08/2013 Gatsu

Desde hace tiempo llevo viendo en muchas páginas web que si una imagen no se carga correctamente porque la ruta que tiene no es válida (lo normal es porque haya dejado de existir), se cargue una imagen de error, pero claro, solo se carga si no existe la imagen original, y hoy he descubierto cual es el truco, ni frameworks ni librerías, el simple evento de la etiqueta img onerror.

onerror es un evento como onclick, onload,... que en cuanto se cumple su condición, ejecuta la sentencia que lleve, de normal javascript, y claro, en ese momento podemos hacer un pequeño script que cambie el atributo src de la imagen por una ruta que contenga una imagen de error y chapuza solucionada. Un ejemplo sencillo sería el siguiente:

function errorImagen(){
    $("#imagen").attr("src","imagen/error.jpg");
}

Con ese código solo necesitaríamos añadir la función al evento onerror:

<img src="http://ruta-mala" onerror="javascript:errorImagen();" alt="" title="" />

Posibles soluciones para que los USB reconozcan los discos duros externos

Valencia, 01/07/2013 Gatsu

Hoy quería actualizar un poco mi disco duro multimedia, que de vez en cuando se agradece ver una película en una tele más grande que mi monitor, pero cuál ha sido mi sorpresa cuando, al conectar el disco duro multimedia con el portátil, no lo reconocía. El verdadero problema surgió cuando, de repente, ningún USB más me funcionaba, pero reiniciando se me solucionó. En fin, he aquí algunas soluciones para cuando los USB se ponen puñeteros:

• Comprueba que hace conexión, si el dispositivo USB tiene algún LED, debe parpadear.
• En la administración de dispositivos comprueba si no hay fallos con los USB, en tal caso, busca actualizar los drivers o volver al controlador anterior.
• Apaga el ordenador de la fuente de alimentación, por si acaso queda algún residuo.
• Si nada funciona, entonces métete en las herramientas administrativas (botón derecho sobre Mi PC/Equipo, Administrar), Almacenamiento, Administración de discos, verás el disco duro externo conectado, pulsa sobre el con el botón derecho y dale a "Marcar como partición activa" y después "Cambiar letra y rutas de la unidad", en esta última deja las opciones por defecto y dale a aceptar. Esta opción NO FORMATEA la unidad, creo que en Windows XP tenías que crear una partición y eso equivale a formatear, yo con Windows 7 no he tenido ningún problema y tenía todos mis vídeos.
• Prueba a conectar ese dispositivo (HDD externo) en Linux, si no lo reconoce ya no hay nada que hacer.

Si nada de lo anterior funciona, es posible que, o tu puerto USB, o tu dispositivo USB esté estropeado, entonces será el momento de abrir dispositivos, literalmente.

Trabajar con particiones con GParted

Valencia, 28/06/2013 Gatsu.

Como ya he mencionado con anterioridad, tengo una máquina virtual con Lubuntu 13.04, a la cual le puse solo 8 GB de disco duro, pues bien, se me ha quedado pequeño y he ampliado el tamaño del disco duro virtual a 12, pero en lugar de incrementar el tamaño, WMware me crea una segunda partición con la diferencia entre el nuevo y viejo tamaño (12 - 8 = 4 GB en la otra partición). Entonces trabajar con 2 particiones "pequeñas" me resulta molesto, así que busqué y encontré la herramienta GParted. Podría decir que es como el Partition Magic pero en versión libre, aunque es bastante más light, pero lo necesario lo cumple, y con buenos resultados. Básicamente he conseguido tener un solo disco duro de 12 GB en la máquina virtual y no he tenido que formatearla ni nada.

Para trabajar con GParted propongo que miréis este tutorial, que ha sido el que he seguido para realizar la fusión de particiones: GParted: Gestiona tus particiones gráficamente.

Comentarios al respecto: Yo me descargué la imagen .iso bootable de GParted desde su página oficial, porque así puedes trabajar con todo el disco duro sin ninguna restricción, sino, si trabajas con el disco duro montado, no podrás hacer nada (lógico).

Otro aspecto que me costó sacar es que, si queremos unir dos particiones que no están cercanas (por ejemplo en medio está la partición de swap), tenemos que ir "arrastrando" el tamaño que queremos poner en la partición a través de las demás, es decir, que tenemos que redimensionar el espacio de todas las particiones que estén antes de la partición que queremos alterar, y eso se traduce en varias operaciones, pero si se hace bien, no pasa nada.

Compartir archivos con una máquina virtual

Valencia, 21/06/2013 Gatsu

Ante la gran cantidad de problemas que me da Skype y los drivers de linux para mi portátil, me he visto obligado a tirar de máquinas virtuales, ya que por suerte dispongo de recursos para ejecutar un linux medianamente ligero sin comprometer el rendimiento de mi ordenador, en mi caso he instalado con VMware Player un Lubuntu 13.04, distribución linux que por venir no viene ni con el gcc, pero bueno todo es instalable.

La gracia de las máquinas virtuales es la posibilidad de compartir carpetas entre ellas o con el ordenador host, en el caso de VMware dispones de unas herramientas instalables en el sistema operativo virtualizado, pero la funcionalidad de compartir carpetas no he conseguido que arrancase, así que a pesar de matar moscas a cañonazos, he instalado un servidor FTP en mi pc de manera que con Lubuntu y un cliente FTP accedo a la carpeta y puedo transferir archivos de un sistema operativo a otro.

Comenzamos:

1. Descargamos e instalamos Filezilla Server desde su página web.
2. Lo ejecutamos y la ventana para conectar al servidor la dejamos como está (yo le he puesto contraseña, se hace más adelante)
   
   
   
3. En Edit/Users, en General, creamos un usuario y le ponemos una contraseña, será el usuario con el que nos conectaremos en la máquina virtual.
4. Cambiamos a Shared Folders y buscamos la carpeta que usaremos como raíz para el servidor, dando permisos de lectura, escritura y creación de subcarpetas. Todo esto es local, aunque la configuración es muy pública, si no hay nadie más conectado en nuestra red, no pasa nada.
5. Ahora tenemos que buscar nuestra dirección IP, porque poner "localhost" o 127.0.0.1 en el cliente de dentro de Lubuntu no va a funcionar, no es la misma máquina. Para buscar nuestra IP, basta con abrir un símbolo del sistema en Windows y poner ipconfig /all, ahí buscamos nuestra dirección IPv4 (seguramente 192.168...), esa es la dirección a la que nos conectaremos.
   
   
   
   

Mostrar un fragmento en tu post de wordpress

Valencia, 12/03/2013 Gatsu

Estos días estoy dándole caña a un nuevo blog, Formación Online Web se llama, y un consejo que me han dado para no tener contenido duplicado tanto en la página principal del blog como en los posts es que en la home ponga una parte del post, y hay una forma muy sencilla que no requiere que el tema tenga una función especial ni nada, estoy refiriendome al comentario more.

Como wordpress es perfectamente alterable, un usuario con conocimientos avanzados de php puede hacer muchos cambios en su blog, o bien podemos hacer uso de plugins que nos facilitan mucho la vida, pero de forma nativa en wordpres tenemos un comentario especial llamado more, escrito <!--more -->. Si ponemos en un post dicho comentario, cuando ese post esté publicado solo mostrará en la home el contenido hasta la etiqueta more (sin mostrarla obviamente ya que es un comentario), y generará un texto de continuar leyendo para que el usuario clique y se sumerja en el post a la altura de por donde continúa el post después del comentario de more.

Si queremos personalizar el texto, basta con añadir al comentario las palabras o frases que queramos que salgan de la siguiente manera: <!--more Leer más-->. Un ejemplo es la siguiente imagen:

Evento onclick en la etiqueta option de HTML

Valencia, 01/03/2013 Gatsu

En mi anterior post escribí una anotación curiosa que imagino que a más de uno le habrá llevado de cabeza, en este post me voy a mantener en esa salsa ya que, "con los navegadores hemos topado".

¿Cuántas veces hemos visto que hemos hecho un código html y funciona bien en firefox pero no chrome, o funciona bien en IE pero en ninguno más? En este post hablaré sobre el uso del evento onclick dentro de una etiqueta option.

<select>
    <option value="1" onclick="javascript:alert('1');">primera opción</option>
    <option value="2" onclick="javascript:alert('2');">segunda opción</option>
</select>

Actualmente sólo firefox reconoce eventos dentro del tag option, si esa misma página con ese código lo ejecutas en chrome o IE no hará nada, por lo que la única forma (que me sé) para hacer un código entendible para todos los navegadores es la de usar el evento onchange dentro del select de la siguiente manera:

<select onchange="javascript:alert(this.value);">
    <option value="1" onclick="javascript:alert('1');">primera opción</option>
    <option value="2" onclick="javascript:alert('2');">segunda opción</option>
</select> 

Aunque es una forma que no es tan personalizada como poner lo que queramos en cada onclick, es la forma válida para todos los navegadores, el código lógicamente se debe extrapolar a llamar una función que trabaje adecuadamente con los valores que recibe.

Controlar el envío de un formulario con javascript

Valencia, 27/2/2013 Gatsu

Quizás para muchas personas que lean este título dirán "que fácil, eso lo hace cualquiera", no lo discuto, pero cuando estás como 3 horas para controlar el envío de un formulario con javascript y ves que no te hace caso, es para hacérselo mirar, o dejarlo anotado en un sitio, como es mi intención con este blog.

Como muchos ya sabréis  es importantísimo validar los campos de un formulario HTML mediante javascript para evitar enviar una petición el servidor y que devuelva un error o un mensaje de "introduce el nombre". Hoy en día tenemos ordenadores con cierta potencia, no creo que pase nada si en lugar de enviar muchas peticiones al servidor, le enviamos menos y hacemos que el ordenador trabaje un poquito. Ello no quita que sea importante hacer validaciones en servidor, ¿por qué? muy sencillo, siempre hay un espabilado que deshabilita el javascript de la página y así envía peticiones al servidor, por lo que para ese aspecto es bueno poner las validaciones tanto en el lado del cliente como en el lado del servidor, aunque sea más faena y duplicada, aumentamos considerablemente la seguridad de nuestro formulario.

He aquí un formulario estándar:

<form action="pagina.html" method="post">
    Introduce el nombre:
    <input type="text" value="" id="txtNombre" />
    Introduce el apellido:
    <input type="text" value="" id="txtApellido" />
    <input type="submit" value="Enviar" />
</form>

Y aquí un método javascript de validación estándar para éste formulario:

<script type="text/javascript">
    function validarFormulario(){
        var nombre = document.getElementById("txtNombre");
        var apellido = document.getElementById("txtApellido");
        if (nombre == "" || apellido == ""){
            alert("Introduce el nombre y el apellido");
            return false;
        }
       else{
            return true;
       }
    }
</script>

Yo lo que hacía era ponerlo en el evento onclick del submit, craso error, este método javascript va en el evento onSubmit del formulario de la siguiente manera:

<form action="pagina.html" method="post" onSubmit="javascript: return validarFormulario();">
    Introduce el nombre:
    <input type="text" value="" id="txtNombre" />
    Introduce el apellido:
    <input type="text" value="" id="txtApellido" />
    <input type="submit" value="Enviar" />
</form>