5 Mayo 2010 por Giancarlo Corzo
Sin comentarios »
Uno de los aspectos más importantes para dominar y hacer uso de una tecnología es tener acceso a buena documentación. En el caso específico de la librería JQuery se cuenta con gran cantidad de información disponible en su sitio web, además de recursos de programadores con ejemplos prácticos de uso.
Sin embargo, la documentación oficial de la herramienta es presentada en páginas independientes, por lo que navegar a través de ellas buscando información específica resulta complicado. Es por ello que quiero compartirles una utilidad que permite encontrar rápidamente mayores detalles de cualquier función de JQuery.
La herramienta, JQuery API browser es accesible de dos maneras: la primera es mediante la aplicación web que utiliza una interfaz AJAX para saltar entre funciones de la librería y la segunda mediante una aplicación de escritorio basada en Adobe Air.
Espero la disfruten tanto como yo lo he hecho.
3 Mayo 2010 por Giancarlo Corzo
Sin comentarios »
JQuery es una excelente librería JavaScript que simplifica la manipulación del DOM (Document Object Model) de una página HTML, el manejo de eventos, animaciones y AJAX. Así también, desde hace un tiempo atrás provee una librería de componentes UI que extiende los componentes iniciales de esta librería.
El widget de tipo diálogo es un ventana flotante que tiene un título y contenido (similar a un popup). Este widget resulta ser muy útil para mostrar alertas o formularios que el usuario debe llenar antes de poder continuar. Veamos como lograr lanzar un dialog apenas carga la página
<script type="text/javascript" src="/assets/javascript/jquery-1.4.min.js"></script>
<script type="text/javascript" src="/assets/javascript/jquery-ui-1.8.custom.min.js"></script>
<script type="text/javascript">
$(function() {
$("#dialog").dialog();
});
</script>
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>Ejemplo tomado de la página web de Jquery
Como puede apreciarse en el código anterior, esta es una solución muy sencilla para hacer un widget dialog; sin embargo, cuando se desarrolla un sistema de mayor complejidad lo ideal es separar las ventanas en múltiples archivos y los diálogos no son la excepción. Una implementación bastante difundida en la web es utilizar un elemento iframe en vez de una etiqueta div para construir el contenido del diálogo. Veamos un ejemplo para que quede más clara la idea.
<script type="text/javascript">
$(function() {
$('a.showPopup').click(function(e) {
e.preventDefault();
var $this = $(this);
var horizontalPadding = 15;
var verticalPadding = 15;
$('<iframe id="site" src="' + this.href + '" />').dialog({
title: ($this.attr('title')) ? $this.attr('title') : 'Site',
autoOpen: true,
width: 600,
height: 300,
modal: true,
resizable: false,
autoResize: true,
overlay: {
opacity: 0.5,
background: "black"
}
}).width(600 - horizontalPadding).height(300 - verticalPadding);
});
});
</script>
<a class="showPopup" href="http://www.google.com" title="Google">Como puede apreciarse en el ejemplo anterior, se utiliza un pseudo iframe, al cual le asignamos la dirección con el contenido que queremos mostrar en el diálogo. Algunas posibles mejoras a esta idea inicial sería crear una función que permita reutilizar el código en otros enlaces, pero eso se los dejo como tarea.
29 Marzo 2010 por Pablo Torres Navarrete
Sin comentarios »
Hace poco empezamos a probar Django, uno de los frameworks web más populares para el lenguaje Python. Nos gustaría compartir las características que nos han parecido impresionantes y algunas que no nos han gustado.
Lo más impresionante: el sitio de administración
El “admin site”, como le llaman los Djangonautas, es más que un simple scaffolding para el back-end, puesto que construye una interfaz más avanzada.
Django puede deducir información de los modelos para generar automáticamente las páginas de administración de los objetos de negocio, desde donde se realizan todas las operaciones sobre base de datos: lectura, actualización, creación, eliminación, validación, relación con otros objetos, etc. Así, los usuarios administradores puedan agregar contenido al sitio y tenerla lista para mostrar a los clientes finales.
» Leer más: Primeras Impresiones de Django
7 Octubre 2009 por Giancarlo Corzo
Sin comentarios »
Escribo este post para todos los que alguna vez sufrieron buscando un ejemplo claro y simple de como crear un combobox en base a un Enum en JSF y Seam.
La documentación de Seam (tan clara como el agua) nos nuestra el siguiente ejemplo:
<h:selectOneMenu value="#{person.honorific}">
<s:selectItems value="#{honorifics}"
var="honorific"
label="#{honorific.label}"
noSelectionLabel="Please select" />
<s:convertEnum />
</h:selectOneMenu>Donde solo muestran el ejemplo puntual sin dar mayor detalle.
Googleando un poco encontré la siguiente página web donde se dan el trabajo de explicar de una manera sencilla como crear el combobox.
En esa página se muestra el siguiente ejemplo:
XHTML:
<h:selectOneMenu id="marketStatus"
value="#{person.status}"
required="true">
<s:selectItems value="#{enumLists.statusArray}"
var="status"
label="#{status}"
noSelectionLabel="Select a status..."/>
<s:convertEnum/>
</h:selectOneMenu>ENUM:
@Name("enumLists")
@Scope(ScopeType.STATELESS)
public class EnumLists {
public Status[] getStatusArray() {
return Status.values();
}
}Como se puede ver en el ejemplo han expuesto el Enum como un Seam bean stateless y retornando la lista de valores con status.values().
Para poner un label a cada opción utilizan el toString() del Enum dado que en label colocan label=”#{status}”
Como pueden ver hacer un combobox basado en un Enum es bastante sencillo y útil.
31 Agosto 2009 por Giancarlo Corzo
Sin comentarios »
El día de hoy se celebra el día mundial del blog, esto a raíz del parecido entre la fecha 31 de agosto (3108) y la palabra Blog. El movimiento de los blogs ha ido creciendo año tras año y con el tiempo los bloggers se han sumado a publicar sus sitios preferidos.
Es por ello que el día de hoy el equipo que escribe en Desarrollo Web ha dedicado unas cuantas horas a seleccionar y publicar nuestros blogs preferidos. Es así como -siguiendo la tendencia- nos gustaría contribuir con un listado.
Algunas de estas publicaciones son de Desarrollo Web, otras son de temas genéricos pero a la vez recomendables.
- joelonsoftware de Joel Spolsky.
Tiene muy buenos posts sobre el desarrollo en general y últimamente sobre sus proyectos personales.
- CSSBlog de Pedro Corchero Murga.
Lo encontramos hace poco y nos ha ayudado muchísimo ahora que algunos de los miembros del equipo están revisando temas avanzados de CSS.
- Coding horror de Jeff Atwood.
Sus posts más recientes hacen alusión frecuente a la psicología de los programadores.
- Sinergia sin control de Ender Wiggins.
Es un blog de un comic para frikis muy divertido.
- On Startups de Dharmesh Shah.
Lo llevamos seguimos hace un tiempo y consideramos que se trata de un buen blog sobre negocios.
Si desean compartir otros blogs que suelen visitar pueden hacer comentarios sobre sus blogs preferidos.
