Contenido de la categoría Aplicaciones web

« Entradas anteriores

Lo bueno de FireBug para Internet Explorer 6+

Buxplorer es un pequeño bookmarklet (unas 700 líneas de chatarra) que te iniciará una barra inferior en tu Internet Explorer y que te permitirá recorrer el código HTML viendo los margenes y los paddings de cada elemento, de la misma forma que lo hace Firebug. Es un excelente complemento para la developer toolbar (que tan solo te bordea el elemento).

Hace más de un año que tengo esto pendiente de terminar, naturalmente es una beta que funciona con pinzas, pero funciona:

HTML:
  1. javascript:scScript=document.createElement('script');scScript.src='http://www.javascript.es/bmk/buxplorer.js?nocache='+Math.random();scScript.type='text/javascript';void(document.getElementsByTagName('head')[0].appendChild(scScript));

Recuerda, el bookmarklet que os propongo sólo funciona con Internet Explorer 6.

A ver si alguien se anima a meterle un empujón :), y si lo pruebas, me das tu opinión (O el gran FSM colgará un Ubuntu al azar).

Función PHP para descargar vídeos de youtube

Funciona en la fecha terrestre 23/08/2009:

PHP:
  1. function descarga_video_youtube($youtube,$nom=false){
  2.         $tot = file_get_contents($youtube);
  3.         preg_match('/, "t": "(.*?)",/s', $tot, $regs);
  4.         $codi = $regs[1];
  5.         $_video_id = explode("=",$youtube);
  6.         $video_id = $_video_id[1];
  7.        
  8.         if(!$nom){
  9.             preg_match('/title": "(.*?)",/s', $tot, $nomini);
  10.             $nom = urldecode($nomini[1]);
  11.         }
  12.         $ruta_video = "videos/$nom.flv";
  13.         $url = "http://www.youtube.com/get_video?video_id=$video_id&t=$codi";
  14.        
  15.         $video = file_get_contents($url);
  16.        
  17.         $fp = fopen($ruta_video,'w');
  18.         fputs($fp,$video,strlen($video));
  19.         fclose($fp);
  20.        
  21.         return true;
  22.     }

El uso es bien sencillo:

Si sólo se le pasa la URL del vídeo, lo descargará en la carpeta videos/titulo del video en youtube.flv

PHP:
  1. descarga_video_youtube("http://www.youtube.com/watch?v=edZYah2CdLY")

Si le añadimos el segundo parámetro (nombre), nos guardará el vídeo en la carpeta videos/nombrequelehayamospuesto.flv

PHP:
  1. descarga_video_youtube("http://www.youtube.com/watch?v=edZYah2CdLY","nombrequelehayamospuesto")

¿que son pagerror.gif y refresh.gif? ¡solucionado!

Vaya, después de varios meses recopilando logs de errores 404 sin ningún tipo de sentido, hoy me he decidido a buscar cual era el motivo por el cual dos imágenes imaginarias (pagerror.gif y refresh.gif) aparecían en dichos logs de páginas no encontradas. Parece ser que el error solo se da en versiones de Internet Explorer 6. Tambien parece que dichas imágenes NO EXISTEN en mi servidor (ni en ninguno de las personas que se hayan encontrado con el problema), pues vaya... y entonces ¿porqué? ¡muy sencillo!.

Resulta que nuestro amigo de la infancia Internet Explorer 6 se resiste a ser como los demás (si, después de tantos años de andaduras el tío no ha madurado lo más mínimo) y cada vez que detecta un iframe sin el atributo src dentro de una página cargado mediante SSL (https://), se decide sin ningún tipo de pudor a cargar una página de error, la cual increíblemente carga las supuestas imágenes desde el servidor donde se ha cargado el iframe. Esto es ... una chapuza, yeah!

¿Solución? fácil, hagamos lo que hagamos que necesitemos un iframe vacío, tan solo tenemos que ponerle el siguiente atributo src:

HTML:
  1. <iframe src="javascript:false;" />

Yo (y mi ego) 1 - Internet Exploter 0

Más información en la keynote de microsoft

pagerror.gif refresh.gif

Anomalía en esquemas en Firefox

No tengo mucha idea de cómo explicar esto, a ver si alguien se anima a esclarecer un poco los términos.

He encontrado una ligera anomalía (por no llamarlo bug explotable) en el trato que da Firefox de las URLs que contienen esquemas no reconocidos, ya que si lanzamos una dirección (del tipo ed2k:) desconocida para el navegador, este muestra una alerta. Esto podría no ser nada si no fuese porque nos puede permitir saber que software tiene instalado un visitante. Lo explico:

El principal problema de esto es que si abrimos una URL desconocida por el navegador desde javascript, este lanzará una excepción (un error) que nos permitirá saber si el visitante tiene instalado un programa u otro similar (por ejemplo, con el esquema callto: nos puede abrir Skype como un cliente distinto de Voip).

A continuación podéis ver el script en ejecución*: ver Demo

*: Necesario Firefox, la ejecución puede llegar a colgar el navegador, se guardan datos estadísticos para posterior analisi y post en el blog.

He abierto un track en bugzilla para que me digan algo :P.

Bookmarklet para detectar elementos HTML obsoletos

Basandome en una entrada de webintenta donde menciona una CSS para detectar los elementos y atributos obsoletos, propuestos como obsoletos o elementos vacíos, he montado este bookmarklet para cargar en cualquier página, ya que tan solo ejecutando el enlace de los favoritos, se ejecutará un script que cargará la CSS en la página donde nos encontremos.

Detectar elementos obsoletos

Más información de cómo colorea los elementos en la página del autor de la CSS diagnostics

Es divertido de usar, al menos para criticar un rato :^P

Correcto formato de formularios XHTML

Hace una semana mandé un correo a la lista de Ovillo preguntando cual creía la gente que era la forma más correcta de maquetar un formulario. Las respuestas fueron varias y estuvimos comentando cuales eran los pros y los contras de cada método utilizado.

Finalmente y después de mucho divagar e intentar acercar opiniones me llegó un correo de Daniel Navarro donde daba con una muy correcta solución, ya que a las fuentes se remitió y razón no le faltó (olé):

En un DTD estricto se especifica que dentro de un form sólo puede haber elementos de bloque (que no sean otros form). Así que entre los diferentes controles y el form debe de mediar un elemento de bloque como div o fieldset, por ejemplo. Esto te falta en la solución A. Además, obligas a saltos de línea con br y esto limita la flexibilidad de CSS.

Así que finalmente ganó la opción:

XML:
  1. <form>
  2.     <fieldset>
  3.         <div>
  4.             <label for="campo">Campo:</label>
  5.             <input id="campo" type="text" />
  6.         </div>
  7.         ... más aquí ...
  8.     </fieldset>
  9. </form>

Gracias a todos los que participasteis y me ayudasteis!

Cristalab y MDW desde el Googleplex de Silicon Valley

Literalmente copio y pego el vídeo que he encontrado en los comentarios de Freddie de Cristalab en Twitter, en donde se ve a él y a Christian de Maestros del web en Google Plex pidiendo a la comunidad de desarrolladores que les hagan llegar aplicaciones que estén desarrollando y que hagan uso de servicios de Google o Wordpress. Así, tambien se ofrecen a hacer algunas críticas a tus aplicaciones desarrolladas en Flash, recomiendo echar un vistazo al vídeo.

Que sorpresa me he llevado cuando les he visto a los dos juntos, que cracks!!

Nuevo acortador de direcciones URL largas

Este fin de semana he estado desarrollando junto con Cel (cenics.net) un redireccionador de URLs largas. Basicamente es para que no tengáis que pasar a vuestros contactos esos churros de direcciones tan grandes que a veces se rompen.

http://lost.in

Espero que os sea útil para:

- Mandar correos con URLs largas pero que no se rompen
- Añadir enlaces a vuestra red social de forma seguro
- Facilitar el acceso a ciertos sitios solo a quien vosotros queráis (mediante password)

Espero vuestras aportaciones ;-)

Mapas de los municipios de España vectorizados en flash

Después de un curro de varias semanas por fin he conseguido el objetivo que me había planteado, crear una versión de los mapas vectoriales que enlacé el otro día pero en formato flash, en clips de película con su nombre de instancia y enlazados a una base de datos.

Podéis verlo en funcionamiento y descargarlo en http://municipios.nacionales.es.

Teruel existe!!

Comentarios, mejoras, usos, modificaciones, etc... podéis dejar un comentario aquí o bien hacerme llegar un correo a mi dirección "marc en palaueb punto com".

Ah!! El proyecto lo he licenciado bajo Creative Commons, por lo que podréis usarlo para casi todo lo que queráis. Para los que quieran darle un uso comercial que contacten conmigo a través de mi correo.

Espero vuestro feedback!

Herramientas para webmasters

En CDmon tenemos a disposición de los desarrolladores (sin importar donde tengan su hosting) un listado de herramientas para webmasters que os pueden ser muy útiles:

Estamos abiertos a desarrollar más, así que si queréis algo tan solo me lo comentáis por aquí o me contactáis por correo y veré que podemos hacer.

Espero que os gusten :)

« Entradas anteriores

Get Adobe Flash playerPlugin by wpburn.com wordpress themes