Delirios de un Informático

Delirando sobre informática, fotografía, programación, móviles y mucho más desde 2003

JW FLV Media Player, JavaScript y Linux

votar
Archivado en JavaScript con fecha 24/Sep/2009 - 1 comentario

Llevo un buen rato para encontrar la solución este dichoso fallo: imposible controlar con JavaScript el reproductor JW FLV Media Player. Al obtener el objeto el método getConfig() no existe y la función playerReady() no se llama. Se debe a que en Linux el reproductor necesita que se indique el parámetro id en la variable flasvars con el ID del objeto en cuestión. De otro modo no se cargará correctamente y no será posible hacer nada con JavaScript para controlarlo. Encontrado en este hilo del foro oficial.

En la portada de Bitacoras.com descubro Pushup, un sencillo archivo JavaScript que permite notificar a tus visitantes que su navegador no está actualizado. Soporta Internet Explorer, Firefox, Safari y Opera.

29/Jul/2008 | 0 comentarios | En Bitacoras.com

Unit PNG Fix: más transparencias en IE6

votar
Archivado en JavaScript con fecha 19/Jul/2008 - 0 comentarios

Como otras alternativas, el hack está programado en JavaScript, pero esta vez, tiene interesantes características:

  • No depende de frameworks como jQuery o Mootools
  • Funciona con etiquetas <img> y con el atributo background-image de CSS
  • Permite elementos con ancho y alto automáticos
  • Es ligero: sólo 999 bytes
  • Muy fácil de usar: basta un <script src=”unitpngfix.js”&gt</script>
  • Funciona automáticamente, no es necesario llamar a funciones o crear objetos

Puede descargarse desde Unit Interactive

Introducción a JSON

votar
Archivado en JavaScript con fecha 9/Jun/2006 - 2 comentarios

JSON empieza a pegar fuerte ya que combinándolo con Ajax las posibilidades son infinitas. Según la Wikipedia:

JSON, acrónimo de “JavaScript Object Notation”, es un formato ligero para el intercambio de datos. JSON es un subconjunto de la notación literal de objetos de Javascript pero no requiere el uso de Javascript.

Básicamente JSON proporciona una manera sencilla de convertir matrices, objectos o variables en general desde cualquier lenguaje a Javascript mediante una representación en texto plano la variable que luego es interpretada por el motor Javascript.

Los que programeis en PHP conocereis de sobra la función serialize, que permite convertir una variable en texto plano que puede almacenarse en un archivo o una base de datos para recuperarla tal cual ( las variables de sesión de PHP se guardan así ). Pues esto es exactamente lo mismo.

Por ejemplo, partamos de esta matriz en PHP:

$matriz = array(256, 512, array('p1'=>256, 'p2'=>512));

Se realiza la transformación y se interpreta. Desde Javascript:

alert(matriz[0]);
alert(matriz[2].p2);

El primer alert mostraría 256 y el segundo 512. Como se ve, las matrices asociativas se convierten a objetos en Javascript debido a la carencia de éste. El resto de variables se mantiene.

¿Y cuál es la utilidad real de esto?. Imaginad un formulario para introducir los datos de una persona. Al meter el NIF se comprueba que exista en la base de datos. Si es así se cargan los datos mediante Ajax y JSON y se autorrellena el formulario permitiendo actualizar los datos.

¿Y cómo se usa esto?. Necesitaremos las dos partes: un codificador en nuestro lenguaje favorito que puede encontrarse en los enlaces de JSON.org ( Para PHP he usado tanto la extensión php-json en mi servidor como la clase Services_JSON ) y el descodificador en Javascript, que añade el método parseJSON() al objeto String.

Un ejemplo simple con la extensión php-json:

<script type="text/javascript">
datos = '<?php echo json_encode(array('nombre'=>'David')); ?>';
datos = datos.parseJSON();
alert(datos.nombre);
</script>

Esto es aplicable a Ajax simplemente haciendo que la URL consultada devuelva variables serializadas.

Parametros para onComplete en Prototype

votar
Archivado en JavaScript con fecha 12/May/2006 - 2 comentarios

La clases Ajax.Request y Ajax.Updater de la famosa Prototype facilitan mucho el trabajo con Ajax. Por ejemplo, para actualizar el contenido de un <div> basta con esto:

var myAjax = new Ajax.Updater(
'id_div_destino' ,
'url_datos',
{
method: 'get',
parameters: 'parametro1=tal'
});

¿Pero si quiero filtrar antes el contenido a mostrar?. Para eso necesitamos usar Ajax.Request:

var myAjax = new Ajax.Request(
'url_datos',
{
method: 'get',
parameters: 'parametro1=tal',
onComplete: mostrar
});

Esto hará que cuando se complete se llame a la función mostrar que como parámetro recibirá un objeto request. El problema es si se quieren pasar más parámetros a la funcion de mostrar, ya que onComplete: mostrar('parametro') sólo envía ese parametro. La solución es usar el método bind() del objeto function:

var myAjax = new Ajax.Request(
'url_datos',
{
method: 'get',
parameters: 'parametro1=tal',
onComplete: mostrar.bind(this, 'parametro')
});

Para más información sobre Prototype lo mejor es este manual de Sergio Pereira.

Mejorando Internet Explorer

votar
Archivado en JavaScript con fecha 21/Oct/2005 - 2 comentarios

Comentaba ayer lo frustrante de intentar usar pseudoclases hover en Internet Explorer. Curioseando un poco más di con una serie de scripts y trucos ¿recopilados? ¿programados? por Dean Edwards agrupados en un paquete llamado IE7. Añade soporte completo para CSS 2 y parte de CSS 3 ( selectores, atributos, pseudoclases…), soporte para transparencias de PNG ( incluso para las imágenes usadas como fondos con CSS ) y muchas cosas más que se pueden comprobar con ejemplos.

El paquete tiene una instalación muy sencilla y está licenciado con Creative Commons.

Escuchando Alan Parsons Project – The gold bug en el disco Turn of a friendly card

Modificando estilos CSS con JavaScript

votar
Archivado en JavaScript con fecha 14/Oct/2005 - 3 comentarios

Hace tiempo que descubrí este script de Apple que permite modificar estilos dinámicamente de un modo muy sencillo con JavaScript. Se compone de seis funciones: setStyleById(), setStyleByClass(), setStyleByTag, getStyleById(), getStyleByClass() y getStyleByTag. Su nombre indica perfectamente lo que hacen. Basta con indicar el objecto a modificar, la propiedady y el valor y listo.

Funcionan perfectamente tanto en navegadores basados en Mozilla como en Opera e Internet Explorer y tiene licencia de libre uso y distribución siempre y cuando no se modifique:

You may incorporate this Apple sample code into your own code without restriction. This Apple sample code has been provided “AS IS” and the responsibility for its operation is yours. You may redistribute this code, but you are not permitted to redistribute it as “Apple sample code” after having made changes.

Cambiar estilos CSS con JavaScript

votar
Archivado en JavaScript con fecha 22/Sep/2003 - 3 comentarios

Una de las ideas que tenía a la hora de programar esta bitácora era la de poner a disposición de los visitantes varios estilos CSS. El problema era aplicar el estilo sin tener que recargar la página completamente. La solución la encontré en Javascript.
Javascript nos permite cambiar las propiedades de un objeto usando la sintaxis objeto.propiedad=valor así que cambiando la propiedad href de la etiqueta <link> que enlaza los archivos CSS el estilo especificado se cargará.
Primero, crearemos un enlace al estilo CSS por defecto asignándole un identificador :
<link href="css/defecto.css" rel="stylesheet" type="text/css" id="estilo">
Despues crearemos en Javascript la función que cambiará el estilo. Funciona pasándole como único argumento el nombre o ruta completa del archivo CSS a mostrar. Usaremos la propiedad getElementById() para identificar el objeto:
function estilo(arquivo) {
    document.getElementById('estilo').href=arquivo;
}

Y finalmente sólo tendremos que llamar a la función desde un enlace o botón pasándole como argumento el nombre o ruta del arquivo CSS que queramos mostrar:
<input type="buton" value="Cambiar Estilo" onClick="estilo('azul.css');">
Podeis comprobar el funcionamento del script en la sección Opciones del menú de la derecha.

Delirios de un Informático :: Gestionado con WordPress :: Alojado en Bitacoras.com :: Licenciado bajo Creative Commons