Dakoo » mootools

Container para marcas de google maps

admin — Tue, 09 Mar 2010 01:59:21 +0000

Este post es debido a un enojo que tuve una véz. Me gusta mucho la orientación a objetos y estaba utilizando la api de google maps. El problema surgía al momento de tener un container con todos los marcadores que tenía en el mapa( en el cliente claro está) y despues de darme cuenta que lo que se suponía era la solución de google estaba deprecada, decidí ir por mi cuenta y crear una pequeña clase. Es algo super sencillo y que se vale de la clase Hash de Mootools y tiene como único objetivo tener algo más ordenado.
Aquí va el código

LA CLASE

PLAIN TEXT

JavaScript:

function containerMarcas(){
this.cont = new Hash();
this.add = function(key,marca){
this.cont.include(key,marca);
}
this.rm = function(key){
this.cont.erase(key);
}
this.getLen = function(){
return this.cont.getLength();
}
this.setNombreMarca = function(key,nombre){
var mar = this.cont.get(key);
mar.setNombre(nombre);
this.cont.set(key,mar);
}
this.setDescripcionMarca = function(key,des){
var mar = this.cont.get(key);
mar.setDescripcion(des);
this.cont.set(key,mar);
}
}

Un ejemplo de uso

PLAIN TEXT

JavaScript:

var container = new containerMarcas();
container.add(k,m);

Shell de Mootools

admin — Tue, 09 Mar 2010 00:49:51 +0000

Hoy Mootools nuevamente me ha sorprendido, debo reconocer que tengo un cierto "amor" por este framework . Estoy hablando de una shell que te permite ir probando tus scripts antes de subirlos o solamente para testear.
Si quieres probar esta maravilla entra aquí

saludos tuto

Mootools Highlight, bueno, bonito y barato

admin — Thu, 25 Jun 2009 03:11:14 +0000

Una funcionalidad de mootools bastante bonita es el Hightlight. Su objetivo es producir un parpadeo en un objeto de la pagina, entiendase por parpadeo como un cambio de color por un tiempo corto. El color por defecto que trae es un amarillo claro, pero trae la opcion que se puedan setear los 2 colores entre los cuales se producirá el cambio.
En este ejemplo pueden ver 3 casos, uno donde se muestra el valor por defecto, otro donde se cambia entre dos colores dados por el usuario y el último un efecto que se genera con muy poco código y un poco de imaginacion
Para ver los ejemplos en funcionamiento entra aca
El código del primer ejemplo es este

   $('primero').addEvent('click', function(){
      $('primero').highlight();
  });

El del segundo

$('segundo').addEvent('click', function(){
$('segundo').highlight('#f00','#000');
});

Mientras que el último es

$$('.item').each(function(item, index){
item.addEvent('mouseover', function(){
item.highlight('#f00','#000');
});
});

Como ven el código que se escribe es mínimo para un efecto bastante llamativo

Si quieren ver el codigo completo descarguenlo de aquí

Saludos tuto