La verdad, aunque sí bajé Firefox 3 para cumplir con la meta de hacer un nuevo record guiness , me resistía un poco a instalarlo por la simple razón, de que no todos los agregados funcionaban, o funcionan. Y sobretodo Firebug, que es una herramienta indispensable en mi programar diario. Gracias a esta herramienta me es mucho más sencillo “debuggear” el código, y sobretodo, hacer que una vez que ha jalado el software en toooooodos los navegadores, jale igual de bien en Internet Explorer (lo odio). En fin, enhorabuena por Firefox 3!!!, que me ha encantado como jala, aunque los suggest de la barra de direcciones al momento de estar esscribiendo, aún se me hacen medio raros. Y pues no se preocupen los amantes de firebug…que todo parece andar muy bien.

Creo que la parte más difícil de todo blogger, es precisamente ponerse a escribir. Sobre todo para todos aquellos que como yo, el tiempo es el peor enemigo. ¿Que pasa cuando de repente te inspiras, quieres escribir algo, entras a tu “dashboard” de wordpress, y años cargando y cargando!!!?

Por lo menos desde mi muy particular punto de vista, es muy molesto entrar a la administración de wordpress y escribir. Será porque es feo, y lento, nosé. Encontré 3 buenas soluciones para escribir de manera alterna en tu blog, y no tener que hacerlo de la manera tradicional en wordpress. En los 3, es tan sencillo como poner la dirección de tu blog, el nombre de usuario con el que escribes, y tu password.

1. ScribeFire. Es un “agregado” o Extensión del navegador Mozilla Firefox. se integra con el Firefox en la parte de abajo, y en cualquier momento mientras estás navegando es posible escribir.

   Descargar ScribeFire
   
   

2. Flock. Un buen navegador. Ignoro porqué no ha llegado más allá, pero me parece muy bueno. Aún así, tampoco lo utilizo. Sólo por mi fidelidad a Firefox. Bueno, pues Flock tiene muchas virtudes, como manejar diversos contenidos en redes sociales. Una de estas virtudes, es precisamente la integración con tu blog. Es como si contara con su “ScribeFire” propio. Ambos tienen muy buenas opciones: manejo de tags, incluir imagenes por url, API de wordpress o por ftp, editor de texto. Flock es una herramienta estupenda para navegar por la web, y escribir en tu blog.Descargar Flock.

   
   
   

3. Windows Live Writer. Es tanto un software de escritorio como un agregado de Firefox. Odio aceptarlo, al ser un producto de Microsoft, pero me parece una buena herramienta. Siento que está muy pensada para wordpress, ya que maneja, por ejemplo, la un botón para separar el artículo; lo que vendría siendo la etiqueta “more”. Además, la inserción de elementos de video, como de youtube, es realmente tan sencillo como quitarle un dulce a un niño; ó como poner la url del video, y listo. La desventaja que le veo, es que el manejo de tags de wordpress no viene por default, sino que tienes que hacer algo para poder manejarlos. Pero me agrada, que tiene la opción de agregar complementos, que aumenten la funcionalidad de windows live writer. Lo que le falta, o por lo menos yo no lo he encontrado, es que no sólo te sirva para escribir un nuevo artículo, sino que te sirva para editar y manipular todos los posts de tu blog.Descargar Windows Live Writer

   

Yo me quedo con ScribeFire, por la posibilidad no sólo escribir, sino administrar todos los posts. Aunque creo que de vez en cuando requeriré abrir Windows Live Writer, para complementar el post por algunas opciones que maneja. Como la de los videos.

TIP IMPORTANTE: Si al tratar de utilizar cualquiera de estas 3 herramientas, no logras configurar tu blog, es por tu servicio de hosting, tiene por ahí deshabilitado el permiso para usar este tipo de tecnologías xmlrpc. No te preocupes, si agregas un archivo .htacess (o lo editas, en caso de que cuentes con uno), y agregas lo siguiente, se resolverán todos tus problemas:

SecFilterInheritance Off

Desventaja de scribeFire: te pone el comercial como lo ves aquí abajito.

Powered by ScribeFire.

Por las múltiples ocupaciones, y por la locura más grande que he hecho, que es estudiar maestría a 2 horas de la ciudad donde radico, no he podido darle mucho tiempo a este pobre blog, pero regreso y gratamente me percato, quizás tarde pero igual grato, de 2 cosas maravillosas que el equipo de Google nos ha hecho favor:

• Primera, Google Reader sale de Beta. Esto quiere decir que ya es formalmente una aplicación web por todas las de la ley. Google Reader brinda un excelente servicio como lector de feeds. Considero que es el mejor de todos los del mundo. Como practcamente todo lo que hace San Google. Y no sólo eso, sino que también al abrirlo, veo quepor fin podía entender el inglés sin problemas!!!!!, sólo hasta que noté que ahora estaba en español.
• Segunda, y aún más emocionante. Las presentaciones de Google Docs ahora son una realidad. Llevaba mucho tiempo especulándose acerca de la alternativa de Google para Microsoft Powerpoint en versión web, y no sé si salió ayer o cuándo, pero entro a mi Google Docs y lo veo, y casi me dan ganas de llorar, es en serio…. Y es que ya practicamente pude liberarme de la suite Microsoft Office, y ahora todo lo hago por Google Docs, por toda la ventaja que ello representa. y el “ya practicamente” es porque si se requería hacer presentaciones, Google Docs no disponía de esa opción. Ahora ya, no le he dado un análisis exhaustivo… pero ya lo haré, y lo comentaré por aquí. Pero lo poco que le he podido mover, me doy cuenta que está muy muy funcional. Me encantó. 100% recomendable.

Adiós Microsoft Office!!!!

El día de ayer el equipo de El Peor Blog tuvo a bien hacer el lanzamiento oficial de Cuelga los Tenis. Y….

¿Qué es Cuelga los tenis?

Una comunidad en la cuál tú como navegante de la red podrás tener un espacio propio para plasmar lo que se te venga en gana… “Porque cualquiera merece tener un blog”.

En Cuelga los tenis es posible iniciar un blog en unos cuantos minutos, siguiendo algunos pasos muy sencillos.

Visita el sitio y te enterarás de la forma en que puedes obtener un blog por tu propia cuenta, y de paso, puedes ir visitando a los amigos que ya se nos han añadido…

Enlace: www.cuelgalostenis.com

• ZAMZAR. Excelente sitio para convetir de cualquier formato, a otro, en línea. Soporta gran variedad de formatos, a mí me ha servido muchísimo.
• Ajax Resources. Gran recopilación de enlaces web relacionados con AJAX, por parte del equipo de solutoire. Encontrarás mucho sobre frameworks Javascript, toolkits, debugging, libros, manuales, tutoriales, API’s, y recursos de todo tipo.
• Javascript packer en php. Compresor de código javascript hecho en php. Disponible para descarga e incluir en tus proyectos. Puedes relacionar archivos JS sin comprimir y al vuelo empaquetarlo.
• mooItems. Vladimir Prieto desarrolla esta ingeniosa clase que por medio de JSON, permite manejarcon una mínima configuración una serie de items, con posibilidad de realizar funciones sobre ellos.

Estoy indignado. MySpace es la red social más horripilante y mal hecha en la historia. Visualmente ni se diga, es una verdadera cochinada. Y la indignación es, ¿cómo es posible que la gente que está detrás de esto esté ganando millones de dolares por algo como es?, y otra más, ¿Cómo es posible que millones de personas estén dentro de esa red?, y otra más, ¿No hay otros montones de redes sociales mucho mejor que MySpace?… entonces… ¿Porqué rayos existe MySpace, y porque rayos la gente lo utiliza?.. y encima de todo se atreven a pedirle a yahoo el 25% de la empresa a cambio de dicha red social…. En mi opinión,  hasta MSN Spaces es mejor, y mira que ya es demasiado decir.

Parte del auge y crecimiento acelerado de MySpace ha sido su uso por diversos artistas y músicos famosos. Por ejemplo, no sé si realmente Madonna, cantante de talla internacional (creo que no hace falta comentar de ella), realmente sea la autor intelectual de este espacio,  pero si sí, creo que el sólo hecho de ver este espacio, le baja muchos puntos de rating. Es una verdadera porquería, y creo que artistas como las que mencione, pueden hasta pagar porque el mejor programador les haga su propia red social, si así lo desean.

En fin, a raiz de mi indignación de ver cómo la gente se hace realmente millonaria por proyectos tan mal realizados, he decidido comenzar un proyecto al que le titulé: “Proyecto multimillonario”; con el cual, como su nombre lo dice,  pretendo hacerme multimillonario, y dejar de preocuparme por qué le daré de comer a mi familia día a día. Ya somos un equipo de 5 personas. Pueden integrase más si dan una maravillosa idea que nos haga más millonarios. Se pretende que en 2 años google o yahoo nos compren por 120 millones de dolares. Si todo va bien, puede ser un poco más. Es una red social…. se aceptan ideas para complementar el proyecto.

Ya había mencionado que, MySpace sucks?

Mi nuevo colega Diego, de Serial Blogger, pone a disposición de todo el mundo esta estupenda herramienta a la que denomina: mini u2b (u= iu, 2= tu, b=b…… u2b=youtube). Y es precisamente eso, un youtube muy, pero muy chiquito. Personalmente, yo sí dejaré de visitar un poco youtube, cuándo lo único que me interesa es ver un video. Básicamente consiste en una API de youtube que nos permite realizar una búsqueda de videos alojados en el popular servicio adquirido recientemente por el gigante de la Internet Google. Una vez realizada la búsqueda, te devuelve los primeros 10 resultados encontrados, y al dar click, podemos ver el video.

Podría parecer una cosa bastante sencilla, pero a mí me parece algo fenomenal. Primero porque, cómo me lo dijo el mismo Diego, youtube tiene una interface muy fea poco atractiva, y él mismo se preguntaba: ¿Porqué no hacer algo más sencillo y menos feo más atractivo? Además, casi hace la misma función, de como particularmente yo utilizo youtube. Cuando yo quiero ver un video, abro youtube, introduzco la o las palabras clave, y sobre los resultados elijo el video que quiero ver. Es todo. Youtube nos ofrece una amplia gama de opciones en su portal como comentarios, sistema de rating, videos relacionados, y muchísimas cosas más, pero para los que como yo sólo les interesa buscar y ver un video, ésta es la mejor opción. Además, ya el mismo reproductor ya cuenta con opciones para copiar código html para incluirlo en tu blog o página, así como opciones de videos relacionadas con el video que se terminó de ver.

Mini u2b se puede utilizar vía web, y está libre para descargar y ser usado en cualquier sitio bajo licencia GPL, es ligero, tiene una interfaz atractiva, y tuve el privilegio de colaborar un poquitín con un toque Mootool-esco. Ampliamente recomendado.

Nota: Paris Hilton no patrocina de ninguna manera este espacio ni esta herramienta. Ignoramos porque aparece en los screenshots.

En Sentido Web publican esta entrada en la cual muestran el código con el que por medio de Javascript controlan el número de teclas pulsadas, con el fin de limitar el número de caracteres de entrada. Esto es útil sobre todo cuando la información que se está escribiendo se va directo a un campo de la base de datos, que esté limitado a un tamaño, y así hacer una buena validación de entrada a la base de datos. Bien, pues el ejemplo no impide que se continue escribiendo, pero si te indica con una barra en color rojo cuando te pasaste, y así permitirte reducir el texto deseado a fin e dejarlo en la longitud deseada. Luis Sacristán lo explica a detalle.

Lo que procedemos hacer acontinuación tomando como base el ejemplo de Luis Sacristán, y para todos aquellos que como yo ya no saben escribir Javascript sino MooTools, es Mootoorizar el ejemplo de la siguiente manera:

HTML____________________________________

[html]

[/html]

JAVASCRIPT_______________________________

[js]
var Site={
max:250,
w:300,
start:function(){
var args=[$('progreso'), textarea=$('txtArea')];
textarea.addEvent(‘keyup’,Site.progreso_tecla.pass(args)).fireEvent(“keyup”, args);
},
progreso_tecla:function(progreso,obj){
progreso.setStyles(
(obj.value.length < Site.max)?
{backgroundPosition:"-"+(Site.w-((Site.w*obj.value.length.toInt())/Site.max).toInt())+"px 0px", backgroundColor:'#FFF',backgroundImage:'url(textarea.png)',color:'#000'}:
{backgroundColor:'#C00',backgroundImage:'url()',color:'#fff'}
).setHTML("("+obj.value.length+" / "+Site.max+")");
}
}
window.addEvent('domready',Site.start);
[/js]

El ejemplo corriendo aqui.

Las barras de progreso han sido muy útiles desde que los sistemas de cómputo existen, o por lo menos desde que yo recuerdo que me inicié en este mundo del desarrollo de software mas o menos hace unos 15 años (ouch!!). Sirven básicamente para indicarle al usuario cuanto falta para que cargue lo que desea accesar. Bueno, pues ahora explicaré cómo hacer de manera sencilla una barra de progreso con el siempre fiel Mootools.

Comenzaremos escribiendo el html. Tan sólo se requiere de un contenedor para la barra, y un botón que activará la barra de progreso. Quedaría de la siguiente forma:

HTML |___________________
<div id=”divProgressBar”> </div>
barra de progreso
<button id=”btnBegin”>Iniciar</button>

Sería todo el html necesario para nuestra barra de progreso. Ahora, lo divertido… el javascript, o el mootools, ya no recuerdo muy bien cómo se llama

JAVASCRIPT|______________

• Primero, definiriamos la clase

var progressBar = new Class({
initialize: function(){
}
});

• Luego initialize:

initialize: function(id,opt){
this.id = $(id); //El objeto que fungirá como barra de progreso
this.options=new $H({ //Hacemos un objeto ‘options’, con las características que la barra tendrá por default
width:100, //ancho de la barra de progreso
background: ‘#eee’, //color de fondo de la barra de progreso
border:’1px solid #999′, //borde de la barra de progreso
barBackground:’#0f0′, //color de fondo de la barra de progreso
barInc:1 //incremento de avance en la barra
});

this.options.extend(opt); //extendemos las opciones, si es que le enviamos al crear la instancia de la clase
this.options=this.options.obj; //le pasamos el objeto generado a la variable options
this.setBeauty(); //método que utilizaremos para crear y estilizar la barra
this.go(0); //método encargado de la magia
}

• una maquilladita, setBeauty

setBeauty: function(){
this.divBar=new Element(‘div’,{ // creamos la barra que mostrará el progreso
‘styles’:{ //la maquillamos
width:0,
top:0
background:this.options.barBackground,
position:’absolute’,
}
}).setHTML(‘ ‘);
this.id.adopt(this.divBar); // La insertamos en el contenedor
this.id.setStyles({ // Maquillamos el contenedor
width: this.options.width,
background: this.options.background,
border: this.options.border,
position:’relative’
});
}

• La magia, go()

go: function(w){
this.divBar.setStyle(‘width’,w); // ajustamos el ancho del div que muestra el progreso
if(w<this.options.width)
this.go.pass(w+this.options.barInc,this).delay(10); // si aún no se completa, seguimos llamando al método go. Aquí utilizo delay para fines demostrativos.
else
this.divBar.setHTML(‘Listo!!!’); // Acción a ejecutar tras completar la barra
}

• Instancear la clase, y crear el evento para llamarla

Site={
start:function(){
$(‘btnBegin’).addEvent(‘click’,function(){ // se añade evento click al botón que iniciará el progreso
new progressBar(‘divProgressBar’,{width:200, barBackground:’#00f’, barInc:5}); //se hace instancia a la clase, pasandole como argumentos el id del div contenedor, y las opciones
});
}
}
window.addEvent(“domready”, Site.start); // una vez listo el DOM, llamamos la función que prepara el evento del botón

• Listo, ahora veamos cómo funciona:

new progressBar(‘divProgressBar’); //Default
Iniciar

new progressBar(‘divProgressBar1′,{width:400, barBackground:’#7394B8′, barInc:10, border:’2px outset #23405F’});
Iniciar

new progressBar(‘divProgressBar2′,{width:200, barBackground:’#ccc url(http://techniq.softr.net/assets/bgProgressBar.png) repeat-x’, barInc:5}); // con una imagen de fondo
Iniciar

• Código completo:

<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>SOFTr ProgressBar</title>
<script type=”text/javascript” src=”mootools11.js”></script>
<script type=”text/javascript”>
var progressBar = new Class({
initialize: function(id,opt){
this.id = $(id);
this.options=new $H({
width:100,
background: ‘#eee’,
border:’1px solid #999′,
barBackground:’#0f0′,
barInc:1
});

this.options.extend(opt);
this.options=this.options.obj;
this.setBeauty();
this.go(0);
},
setBeauty: function(){
this.divBar=new Element(‘div’,{
‘styles’:{
width:0,
background:this.options.barBackground,
position:’absolute’,
top:0
}
}).setHTML(‘ ‘)
this.id.adopt(this.divBar);
this.id.setStyles({
width: this.options.width,
background: this.options.background,
border: this.options.border,
position:’relative’
});
},
go: function(w){
this.divBar.setStyle(‘width’,w);
if(w<this.options.width)
this.go.pass(w+this.options.barInc,this).delay(10);
else
this.divBar.setHTML(‘Listo!!!’);

}
});
Site={
start:function(){

$(‘btnBegin’).addEvent(‘click’,function(){
new progressBar(‘divProgressBar’);
});
$(‘btnBegin1′).addEvent(‘click’,function(){
new progressBar(‘divProgressBar1′,{width:400, barBackground:’#7394B8′, barInc:10, border:’2px outset #23405F’});
});
$(‘btnBegin2′).addEvent(‘click’,function(){
new progressBar(‘divProgressBar2′,{width:200, barBackground:’#ccc url(http://techniq.softr.net/assets/bgProgressBar.png) repeat-x’, barInc:5});
});

}
}
window.addEvent(“domready”, Site.start);
</script>
</head>

<body>
<div id=”divProgressBar”> </div>
barra de progreso
<button id=”btnBegin”>Iniciar</button>
</body>

• Descargar ejemplo