Categoría: Programacion
Video en HTML5
Luego de leer un excelente artículo sobre estos temas me dieron ganas de escribir al respecto, al menos para probar un poco del tag VIDEO de HTML5 que tanto se ha ido mencionando en el ambiente de desarrollo web y que pocos estan usando todavía.
Justamente este post es para aquellos que utilizan un browser moderno, y cuando digo moderno me refiero a, en algunos casos, experimentales, como Fireofx 4 Beta 7 o el recientemente lanzado Chrome 8, son browsers muy nuevos y que todavía no conforman la mayoría.
Para aquellos que no entienden de que se trata, un breve repaso, hasta ahora ver un video en la web significa que el browser tiene que llamar a un plugin o aplicación externa para hacerlo, un "objeto" extraño que se mete entre el browser y vos para mostrarte algo tan básico como un video o un audio.
La adopción de HTML5 agrega dos nuevos tags, AUDIO y VIDEO justamente para suplir este hueco y que el mismo browser pueda integrar correctamente el video. En poco tiempo tendremos a Youtube con todos sus videos en WebM, el formato propuesto por ellos, pero he aquí el problema, no todos los browsers usarán el mismo codec/container para sus navegadores ¡que rompehuevos! así es, lo discutimos varias veces en el blog cuando Apple y Nokia insistieron en no definir el formato default cuando definían HTML5, así que pasamos de un draft con el OGG/Theora a uno que no dice nada sobre este combo indispensable.
Adentro del post les cuento como se puede "resolver" esto para el usuario, no para nosotros, claro 
Post Revolution 0.8.0 Alpha
¿Hace cuanto no posteo nada del PostRev en mi blog? respondo yo mismo, hace más de un año. Es que los vaivenes de la vida entre los que se incluyen: independización, matrimonio, radio, blogs, redes sociales, familia, negocios y un largo etcétera dejan poco tiempo para programar.
Pero me lo hice y si bien todavía es una versión muy primitiva como para recomendar su uso, muchos me pedían que libere el código y ahí lo tienen.
No sólo liberé el código, estreno sitio nuevo con el dominio propio, postrev.com.ar y un wiki para ir completando a medida que tenga tiempo con cada detalle del sistema.
Los más jóvenes se preguntarán ¿que es el postrev? pues bien, el Post Revolution es el sistema que utiliza este blog. Ni Wordpress ni Blogspot, acá usamos PostRev! 
desde 2004 es el encargado de que el blog funcione y tan mal no se portó.
Está mal programado, su código es una basura, no respeta ningún patrón, pero sin embargo tiene algo que pocos, funciona, lo hice yo y me gusta seguir cambiándole cosas cada tanto. Es mi herramienta de aprendizaje y gracias al mismo entendí que la mayoría de los bloggers no entiende cómo funciona su propio blog, algo imprescindible para un nardogeek.
Los kakers estarán de parabienes, espero que aporten código, el wiki está para ellos, para que me reporten cada cagadita del código y yo pueda arreglarla. También a futuro planeo abrir públicamente el SVN y si algún programador se quiere sumar pasando código, bienvenido sea, es 100% software libre. Obviamente, hay muchos huecos que estaría bueno cubrir, sean piadosos
Otro detalle, el diseño default que tiene es horrible, es mi intención crear uno nuevo pero se me ocurrió ¿que tal si hago un concurso para diseñadores? no tengo grandes premios todavía, más bien, tengo una cajita llena de porquerías, pero... probablemente más de un diseñador lo aprecie así que proximamente habrá concurso y los mejores diseños serán adaptados al PostRev. Lo único que hace falta es HTML+CSS, del resto me encargo yo 
Para aquellos viejos usuarios del sistemita, pueden divertirse un par de minutos recordando como era, total... el panel de administración es el mismo desde hace 6 años
Como implementar el nuevo botón de Twitter
El nuevo Tweet Button es bastante fácil de implementar aunque no es perfecto. El primer y más obvio problema es que, como todo lo que viene de twitter, depende de twitter.
Si estuviésemos hablando de un servicio estable y bien implementado, es decir, separando las cosas, no habría problema, pero justo ayer me demostró que tan así no era. Durante un rato entrar a este blog fue un martirio culpa del javascript oficial de Twitter, fallaba, generaba errores, impedía navegar, hasta parecía el blog hackeado.
No, era el botón oficial y el javascript tomado de http://platform.twitter.com/widgets.js
Si ese widgets.js llega malformado o inclompleto a tu browser es probable que todo falle. Obviamente es algo que también puede suceder con el botón de Facebook (podría escribir en otro post cómo implementar ese otro ) así que cada vez que dependemos de un servicio externo a nuestro blog, si este falla, encadena el fallo hacia nuestro blog.
Por algo a veces uno prefiere que la mayor parte del código esté en un mismo lugar, para no depender de terceros. Uno podría bajarse el widgets.js e instalarlo localmente pero no vería aparecer las actualizaciones, igual, no es mala idea
El botón es muy sencillo y para crearlo tan sólo hay que entrar en la sección de "goodies" de Twitter y utilizar el wizzard para creación.
Primero elijen el estilo, yo opté por el horizontal, luego el texto a imprimir en el twitt, que puede ser el título del post, la url que vamos a compartir y por último el idioma.
Un detalle opcional es que el twitt aclara a qué usuario de la red le pertenece el contenido publicado, así pues si hacen click en el botón aquí podrán ver que el twitt resultante dice "by @fabiomb" que es mi usuario.
El código generado hay que ubicarlo en el template de tu sitio pero hay que tener en cuenta los parámetros utilizados:
- data-url es el parámetro del enlace al post, en mi caso es fácil, pero uso PostRev, no es wordpress esto así que es el enlace numerado como siempre.
- data-text es el título del post, se le puede agregar lo que uno quiera, saldrá en forma de twitt así que hay 140 caracteres disponibles menos la url simplificada por el servicio propio de Twitter
- data-via es el parámetro de quien es el dueño, aquí recomiendo tu usuario de twitter
- data-lang el idioma, "es" para español, obviamente.
En Wordpress sería fácil, the_permalink() en data-url, the_title() en data-text más lo que querramos incluír.
En PostRev sería $titulo para el título y $id_noticia para el id de la nota, digamos, en ambos casos es fácil.
Se puede utilizar la API de distintas formas, para hacerlo con un iFrame o para desarrollar el propio.
Mariano se preguntaba que harán los servicios alternativos que ya hacían esto, por lo pronto hacer uno que no se cuelgue y no te haga fallar todo tu blog es ya un punto a favor
el uptime de Twitter es una porquería
Proyecto 1 - Streaming
Pero eso no significa que me quede de brazos cruzados así que me puse a diseñar un concepto, al menos un diagrama, una interfaz y una idea como para que la haga otro. Sería algo así como "Diseño Open Source", yo lo diseño, que lo haga el que quiera, total... que problema hay con un diseño GPL / Creative Commons? ni idea.
Tampoco es que tenga una idea brillante sólo que tenía ganas de hacer una aplicación y no pude. Al que le interese, como hobby o porque vea una veta, genial, el que diga que es una bosta, también, el que tenga mejores ideas, bienvenido sea! es más un intercambio de ideas que otra cosa.
Ahora al grano, les presento la idea y un esquema de como debería ser...
Diseñador o Programador ¿quien se encarga de la maquetación?
Gracias a una consulta por mail de un lector, Dante, molesto por los avisos piden como requisito/deseable "maquetar html+css en base a un JPG o PSD" surgió un post, je, si, ya se que tengo varios mails pidiéndome que hable de tal o cual tema o sugiriéndome, pero este como me toca de cerca me pareció bueno tomarlo.
- Un buen programador no es un buen diseñador
- Un buen diseñador no es un buen programador
- Un buen maquetador tiene que ser medianamente decente en ambas tareas.
- Siempre existe un capo que es la excepción a estas reglas, lo felicito
El problema es que aquí las empresas es donde ponen un parate: prefieren un diseñador mediocre con más conocimientos de programación y exigirle un nivel profesional o un programador con buen gusto antes que pagarle a una persona extra en el esquema para tener bien maquetado algo.
Así entonces muchos diseñadores tuvieron que, de prepo, aprenderse muchas cosas de PHP o sistemas de templates y a algunos les ha ido bien aunque la mayoría sea un desastre en esto. A la vez muchos programadores prefieren aprender sobre diseño, PSDs, Illustrator y demás yerbas para evitar tener que lidiar con diseñadores prehistóricos.
Esa fusión de conocimientos es prácticamente una materia nueva que pocos reconocen pero que debería ser ya una disciplina: el maquetador.
El programador debería saber hasta el HTML y punto, el CSS debería ser área del diseñador, pero ¿y el intermedio? el maquetador le debería asignar el HTML disponible al programador y el CSS al diseñador, es la guía. Este rol lo puede cumplir cualquiera de los otros dos pero ahí volvemos a encimar funciones.
Un maquetador podría ser una persona que maneje:
- HTML
- CSS
- Conversión de PSD/Illustrator a HTML+CSS+Imagenes
- Definición de estructuras a utilizar
- Definición de complementos a utilizar (Javascript, etc.)
- Diseño de interfaz (algo inexistente pero con tanta app. web)
Seguramente se me escapa algo porque lo estoy pensando así por arriba, pero creo que se entiende, una persona que pueda darle forma a los sitios web más allá del código duro del programador que no debería estar preocupándose por la presentación y más allá del diseñador que no debería estar preocupándose en aprender un lenguaje de código.
¿o si?
Me sigue quedando la duda si este rol no es parte de lo que deberían agregar a su currícula los diseñadores y programadores ¿es necesaria la división? ¿es realmente una tarea inalcanzable? ¿o sólo una comodidad para el empleador? Valen las opiniones
En mi caso tuve que aprender los tres roles, con sus falencias claro, pero como venía del lado de la programación y aprendí a armar boludeces en HTML hace mucho tiempo es como que ciertas cosas me resultan fácil, ahora bien, sigo sin poder creer como un diseñador no sabe nada de HTML o como un programador no se actualizó y sigue usando el tag FONT
Novedades para los Links de Viernes
Cada dos o tres días tengo tiempo para escribir un par de líneas de código para el nuevo Links de Viernes. Como algunos sabrán el sistema lo voy a independizar del blog. Esto no implica que los viernes no tengan sus links de siempre, no, para nada, sólo que quiero manejarlo como un sitio aparte y que no esté tan pegado al blog así puede tener vuelo propio.
Como tal estuve trabajando en algunas mejoras, nada del otro mundo, pero si que sirven para un sitio más independizado, así que ahora les comento en que estuve trabajando y que falta para estar listo. El día que esté lo subo y emancipo del blog supongo que será antes de fin de año, je.
Mysql: actualizar un dato con una condición
Es un minitip para programadores en apuros, como siempre sirve googlear y que te aparezca un resultado, venga, hice lo mismo y correspondo con contribuir con la sociedad.
Querés actualizar un valor de 0 a 1 o de 1 a 0? una cosa que dependa de otra? por una condición? es fácil:
update usuario set negativizer = case when negativizer = 0 then 1 else 0 end where id_usuario = 1
Para darles un ejemplo, lo que hace es simplemente cambiar el valor cuando ya tiene uno y al volver a ejecutar esta sentencia lo vuelve a cambiar, ideal para valores binarios como este caso.
Se que hay otras formas pero me gustó esta de resolverlo
A Ponicke le gusta el Flamewar
Como lo conozco en persona y se que es un tipazo y un groso en ciertos aspectos (y no lo digo por el tamaño!), luego de haberlo acusado de "osito" en público
creo que puedo criticarlo en esta oportunidad. Aprovechando que Sechole me pasó la data pienso criticarlo porque se la buscó
El amigo Alejandro Ponicke, conocido por el programa de TV Dominio Digital, varios eventos y empleado de Microsoft, es confrontativo, ya lo se, no voy a discutir eso de él porque yo soy igual
pero esta vez... ah... que lindo flame war que provocó pero... ¿alguien se lo cree?
Vamos Ponicke, que armar dos artículos en contra de Open Office (costo: 0$) para marcar sus bugs (que los tiene y muchos) en tono "burla"... ¿no es un poco berreta? más porque, a diferencia de MS Office, hasta podés entrar en el código, encontrar el bug y crear un parche!
eso seguro seguro que ni participando de las mejores reuniones que puedas tener con tu empleador te van a dejar hacer con el Office (costo: 400u$s) de tu empresa!
Lo paradójico del caso es que viniendo de MS, aunque lo haga de forma particular claro, es su blog (aunque esté dentro de Technet
), es no encontrar este tipo de análisis de forma autocrítica. MS tiene muchísimo software y como tal es imperfecto, bugs le sobran, algunos de larga data, ni hablar en el Excel o el Word, es software tan complejo y con miles de funcionalidades que no extraña que falle.
Lo que tampoco extraña son los errores en Open Office, siendo elaborada por muchos menos desarrolladores pagos que su primo lejano y, para colmo, con demasiado control por parte de Sun, tiende a tener algunos huecos de calidad que otro software libre no tiene. Aun así funciona muy bien y al igual que me pasaba con el Office pago y caro de Microsoft, con Open Office algunas cosas fallan o no reaccionan como uno espera, aun así puedo hacer de todo con esta suite.
Mi recomendación para Ponicke, si tiene el valor para criticar el funcionamiento lo desafío a que encuentre uno de esos bugs en el código y postee justamente el parche a ese error, a ver si le sale
si es así habrá contribuído con la sociedad. Porque una cosa es que alguien que no sepa nada de programación cite un error o bug, lo investigue y lo reporte, pero otra es que, siendo de la "competencia" te dediques a hacer un perfecto bugtracking pero... luego no hagas nada! eso sólo evidencia mala leche y no creo que sea el caso de Ponicke ¿no? pero... que se puede esperar de alguien que es un osito tan cariñoso! él lo hizo porque busca el amor masculino y la tetosterona del Software Libre si, busca un flame war para llenarse de comentarios, jejejeje, si los conozco!
Los dos posts, "Los bloopers de la suite de Oficina del Vecino y no es chiste, pase y vea" 1 y 2
Programando LdV
Cada cierto tiempo les voy a ir contando los cambios que hago del sistema de Links de Viernes para que, aquellos que los pidieron, puedan ir viendo el avance.
Este finde trabajé en lo siguiente:
Modificar horarios a 24:00 [OK]
Agregar link al perfil de usuario para editar las preferencias [OK]
Autovoto al publicar [OK]
retorno a nuevas cuando la cuenta vuelve atrás de un valor umbral [OK]
control de negativity [OK]
Corregir el error del [+] que lleva al tope de la página sin pedirlo [OK]
Ahora lo siguiente es:
Sistema de denuncias
Mejora en la interacción de usuarios
Marcar como favoritos
Generar listados de favoritos
En fin, la idea es que les sea útil y también me sea útil a mí
así que proximamente habrá más novedades.
Para aquellos que temían que los Links que publico los viernes acá "ya estan todos vistos", tranquilos, que no publico los mismos, siempre vendrá con sorpresita a escondidas
es decir, una selección de lo mejor del sitio y una selección personal que no necesariamente salió de ahí
Demo con HTML5 y Canvas
Sólo para aquellos usuarios con Chrome, Safari 4, Opera 10 y Firefox 3.5, excelente demo realizada en HTML5 con el objeto Canvas y música, genial.