lunes, 22 de junio de 2009

Haciendo Drag & Drop con Mochikit

Hacer drag & drop con mochikit, es relativamente facil.

Hace unos dias hice un ejemplo bastante sencillo. y con pocas lineas de javascript podia hacer que se arastratan unos divs o lo que sean hacia otro div.

El planteamiento para hacer esto es, hay que crear uno o mas elementos Draggable, y por otra parte crear elementos Droppable aqui definimos todos los elementos que puede permitir tener esta seccion[esta discriminacion la hace por la clase CSS asignada].

Y despues simplemente lo conectamos, nuestras funciones para que cree los elementos al cargar la pagina, en mochikit esto se hace con addLoadEvent.


Aqui dejo el codigo, el codigo casi habla por si solo.

addLoadEvent(function (){
createDrag();
createDrop();
});

function createDrag(){
var arreglo = getElementsByTagAndClassName(null,"draggable");
for (var i = 0;i < arreglo.length;i++){
new Draggable(arreglo[i],{revert:true,
handle: false,
starteffect: MochiKit.Visual.Opacity,
endeffect: MochiKit.Visual.Opacity,
zindex: 1000,
setclass: null,
ghosting: null,
onchange: MochiKit.Base.noop,
scroll: false,
scrollSensitivity: 20,
scrollSpeed: 15 });
}
}

function createDrop(){
var arreglo = getElementsByTagAndClassName(null,"droppable");
for (var i = 0;i < arreglo.length;i++){
new Droppable(arreglo[i], {
accept: ['draggable'],
ondrop: function (element,dropElement,ev) {
appendChildNodes(dropElement,element);
log("llamando a servicios");
}
});
}
}




mochikit nos simplifica mucho la vida, el hacer esto a solo javascript, me imagino que no debe ser tan trivial, y con mochikit pareciera que si lo fuera.

Nota: getElementsByTagAndClassName y $ son de mochikit, una busca un tag especifico que tenga X clase Css, y el otro es el renombramiento de getElementById como esta aqui.
--
Atte.
Victor Hugo Saavedra
http://vhspiceros.blogspot.com

martes, 16 de junio de 2009

Cambio en la encuesta II

La encuesta anterior ¿En que Lenguaje te gusta mas programar?, con un total de 178 votos se redistrubuyeron de la siguiente forma

C# 90 (50%)
Java 56 (31%)
Javascript 36 (20%)
C/C++ 23 (12%)
Vbscript 17 ( 9%)
Python 11 ( 6%)
Pascal 10 ( 5%)
Cobol 10 ( 5%)
Ruby 9 ( 5%)

Y ahora nueva encuesta como es costumbre,

¿Que prefieres Escuchar mientras Trabajas?

--
Atte.
Victor Hugo Saavedra
http://vhspiceros.blogspot.com

lunes, 15 de junio de 2009

Sushi en Familia

Este fin de semana, con mi señora se nos ocurrio hacer sushi en casa.

de aqui sacamos las receta. y de aqui como hacer el arroz.

no voy a poner la receta ni nada, por que en internet esta lleno de como hacer el arroz, y los rollitos de sushi

no nos quedaron muy bonitos, pero si muy ricos. aqui dejo algunas fotitos.



Eso los hice yo :(. nunca a sido mi fuerte las manualidades.



En pleno proceso de armado.

uno que otro ingrediente, Arroz, palta, salmon, camarones, zanahoria, queso, cebollines, y obvio la infaltable bebida.

Estos ya quedaron mas bonitos

Pero a algunos le pusimos el queso arriba, jajajajajaja. Aunque no sacamos fotos, tuvimos la osadia de hacer Palta maki sushi envuelto en palta. quedaron bien ricos tambien.


--
Atte.
Victor Hugo Saavedra
http://vhspiceros.blogspot.com

viernes, 12 de junio de 2009

Doblandole la mano a los updatePanels de AjaxcontrolToolkit y javascript

Tenia que hacer que un texbox de .net se vieran y escribieran con mayuscula.

Hasta ningun problema, con css se puede hacer sin problema, y al momento de guardar en la DB hago un Uppercase, y estoy listo dije yo.

Hice una pequeña funcion , en javascript que lo hiciera, por que no eran textbox nativos ni de html ni de webform, eran de webform ya extendidos.

function changeUpperCaseCss(){
var textBox= $('<%=txtNombre.ClientID %>');
textBox.style.textTransform = 'uppercase';
}


listo, ahora solo me quedaba conectar el elemento en el onload, de la siguiente forma con mochikit.

addLoadEvent(
function (){
changeUpperCaseCss();
}
);


Funcionaba todo de maravilla, pero el problema el maldito updatePanel, cada vez que se refrescaba el panel, se perdia o refrescaba el texbox, entonces perdia la propiedad textTransform que le habia puesto con javascript.

para solucionar esto tuve que usar el javascript que tiene el ajaxControlToolkit
de la siguiente forma

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
changeUpperCaseCss();
}


Que hace esto, primero optiene la instacia PageRequestManager. y definimos la funcion EndRequestHandler esta funcion se llamara cada vez que se termine el request producido por un update panel.

Asi quedo soluciona. y todo en el Cliente :D
--
Atte.
Victor Hugo Saavedra
http://vhspiceros.blogspot.com

Ordenando por fechas en c# :D

Siguiendo con este post.

Aqui Ordenamos una lista de objetos por fecha. la gran diferencia que solo usamos DateTime.Compare. Este lo ordena de forma acendente.

var personas = getAllPersonas();
personas.Sort(new Comparison(
delegate(persona a, persona b) {
return DateTime.Compare((DateTime)a.fechaNac, (DateTime)b.fechaNac);
}));


Si lo queremos ordenar de forma descendente simplemente cambiamos el orden de comparacion :D de esta forma.


var personas = getAllPersonas();
personas.Sort(new Comparison(
delegate(persona a, persona b) {
return DateTime.Compare((DateTime)b.fechaNac, (DateTime)a.fechaNac);
}));

--
Atte.
Victor Hugo Saavedra
http://vhspiceros.blogspot.com

miércoles, 10 de junio de 2009

bonito el Logo, Banco Estado



Igualito al de nuestro querido Firefox.


aun no cacho si es legal modificarlo de esa forma.
--
Atte.
Victor Hugo Saavedra
http://vhspiceros.blogspot.com