Buscar en este blog

Chris Gerdes: The future race car -- 150mph, and no driver

Se ha producido un error en este gadget.

viernes, 22 de enero de 2010

jQuery Project

El Proyecto jQuery administra todos los proyectos de jQuery, incluyendo el Nucleo de jQuery, jQuery UI, Sizzle y QUnit






jQuery Core es una libreria JavaScript rapida y concisa que simplifica la navegacion, manejo de eventos, animaciones y llamadas AJAX de los documentos HTML. jQuery esta diseñado para cambiar la manera de utilizar JavaScript

jQuery UI  provee animaciones, efectos avanzados, temas perzonalizables para tus aplicaciones WEB utilizando jQuery.

QUnit  es una suite de pruebas de Javascript poderosa y facil de usar. Es usada por el Proyecto jQuery para probar su codigo y los plugins, pero es capaz de probar cualquier codigo JavaScript generico.

Sizzle un motor de selectores CSS hecho en JavaScript, diseñado para utilizarlo facilmente como una libreria.

miércoles, 20 de enero de 2010

Sistema de Control de Atletas

Aqui dejo un pequeño Sistema Web que lleva el control de los atletas de distintas sedes deportivas y los deportes que practica cada uno.


Esta hecho utilizando:
  • Javascript, para la interfaz del usuario con el sistema (FrontEnd)
    • Framework jQuery 1.4
      • tableFilter - Plugin que transforma una tabla HTML normal en una tabla HTML con opciones para:
        • Filtrar
        • Buscar
        • Ordenar
        • Paginar
        • Estilos de las celdas
        • Totales
      • Funciones Get y Post  de jquery para las llamadas a archivos utilizando AJAX
      • Uploadify - Plugin de jQuery para subir archivos al servidor (imagenes de los atletas)
    • jQuery UI 1.7.2
      • Dialog - Dialogos modales para mostrar mensajes y formularios
      • Datepicker - Calendario
  • Php, para la interfaz del sistema con la base de datos (Backend)
    • No use clases, la conexion mas simple que hay. El fin de este sistema es mostrar el uso de jQuery.
Puede ser descargado haciendo clic aqui o en la zona de descargas del blog en la parte inferior.



En el archivo WEB - Sistema de control de atletas.zip, encontraran todo lo necesario para instalar el sistema:
  • La carpeta del proyecto, de nombre "deportistas"
  • El archivo SQL de la base de datos listo para ser importado
    • Crea la base de datos "deportistas" y las tablas.
    • Es necesario que creen manualmente el usuario de base de datos "deportistas", con la clave "03100310" y le otorguen todos los permisos. ( Luego subire el archivo SQL para que cree automaticamente el usuario cuando se importe el archivo)
 Adicionalmente hay una presentacion de power point que contiene:
  • Descripcion del sistema
  • Requerimientos
  • Plataforma utilizada
  • Diseño de la base de datos
  • Pasos para instalar el sistema

    Agregar elementos dinamicamente utilizando JQuery 1.4

    Una de las mejoras de esta nueva version del framework de JQuery es la construccion rapida de elementos.

    Cuando se crea un elemento simple con la funcion jQuery, ahora puedes pasar un objeto, sus atributos y eventos al mismo tiempo: 



    jQuery("<div/>", {
    id: "prueba",
        css: {
            height: "50px",
            width: "50px",
            color: "blue",
            backgroundColor: "#ccc"
        },
        click: function() {
           $(this).css("backgroundColor", "red"); 
        }
    }).appendTo("body");

    Fuente: http://api.jquery.com/jQuery/#jQuery2

    martes, 19 de enero de 2010

    lunes, 18 de enero de 2010

    Icon Finder

    Icon finder es un Excelente buscador de iconos!!! nos ahorrara mucho tiempo! Pueden acceder en: http://www.iconfinder.net/


     

    Iconos en la barra de URL de nuestro sitio

    Navegando en http://www.htmlkit.com/ encontre una forma de cambiar el icono que nos aparece en la barra de URL de nuestro sitio y en las pestañas de el Navegador donde se esta visualizando:

    Imagenes por defecto (Utilizando XAMPP):


     


    Imagenes personalizadas utilizando el servicio http://www.htmlkit.com/services/favicon/:



     

    Para hacerlo necesitas:

    • Una imagen cualquiera en cualquier formato (PNG, JPEG, etc)
    • Entrar a  http://www.htmlkit.com/services/favicon/   y seleccionar la imagen que queremos transformar a icono.






    • Descargar el fichero
    • Entrar a la carpeta ROOT de tu sistema y colocar dentro de la etiqueta <head>:    
    <link rel="shortcut icon" href="favicon.ico" >
    <link rel="icon" type="image/gif" href="animated_favicon1.gif" >

    viernes, 15 de enero de 2010

    14 dias de jQuery

    Celebrando el lanzamiento de jQuery 1.4, habran 14 dias consecutivos de nuevas entregas para celebrar la salida de jQuery 1.4. Todos los dias se haran anuncios nuevos sobre el contenido de este lanzamiento.






    Fuente: http://jquery14.com/

    Lanzamiento de JQuery 1.4

    JQuery ya acaba de lanzar su version estable 1.4. Para todos los desarrolladores y diseñadores que usan este grandioso framework creado por John Resig esta disponible para descargas en http://jquery.com/. Los que todavia no conocen este framework es momento de que visiten esta pagina.




    La documentacion la pueden encontrar en: the jQuery 1.4 docs.

    Fuente: http://jquery.com/

    Table Sorter


    TableSorter es un plugin de jQuery desarrollado por Christian Bach para ofrecer la funcionalidad de ordenar por columnas nuestras tablas html:


    Para usarlo necesitas:
    • Agregar el plugin de tableSorter a tu proyecto


    • Diseñar una tabla Html:


    • Agregar el Paginador

    • Agregar el codigo jQuery que activara el plugin TableSorter: 



    LISTO!!! ahora estamos listos para ordenar nuestra tabla por cualquier columna.


    Fuente: http://tablesorter.com/docs/

    jueves, 14 de enero de 2010

    JavaFX - Una mejor experiencia

    JavaFX, es una plataforma de cliente enriquecido expresiva diseñada para crear Experiencias de Internet a traves de todas las pantallas de tu vida. JavaFX 1.0 fue lanzado el 4 de diciembre de 2008. En Junio de 2009 ya habian casi 400.000 descargas de la herramienta y del SDK; JavaFX estaba disponible en mas de 250 Millones de desktops.




    JavaFX esta totalmente integrado con Java Runtime y toma ventaja del rendimiento de Java Runtime Environment de Sun, que esta instalado, literalmente, en billones de equipos a nivel mundial.


    Desarrolladores y diseñadores pueden usar JavaFX para imaginar, crear y expresar una experiencia real que sale del navegador web y entra en nuestro dia a dia. JavaFX combina poderosamente un lenguaje de Script (JavaFx Script), una plataforma de cliente rica y un conjunto de herramientas que habilitan un flujo de trabajo completo, productivo y colaborativo entre el desarrollador y el diseñador.


    Los desarrolladores pueden empezar a construir contenido expresivo con JavaFX descargando el JavaFX SDK en http://www.javafx.com. Los diseñadores pueden descargar el JavaFX Production Suite para obtener herramientas para simplificar el trabajo en equipo con los desarrolladores.

    Fuente: http://www.javafx.com.

    miércoles, 13 de enero de 2010

    Table Filter

    El plugin tableFilter de jQuery, es una opcion para transformar tablas simples html:




    en tablas con capacidad de:
    • Ordenacion
    • Busqueda por filtros
    • Formato de Textos
    • Paginacion


    Con solo una linea de codigo javascript.

    Ejemplo:

    HTML

    <. table id="miTabla" .> - Aqui van todas las filas de la tabla - <./table>

    JAVASCRIPT
    $("#miTabla").eq(0).tableFilter();

    Puedes ver la demostracion en:
    http://ideamill.synaptrixgroup.com/jquery/tablefilter/tabletest.htm

    Puedes descargarlo en:
    http://ideamill.synaptrixgroup.com/jquery/tablefilter/tablefilter.zip

    Fuente: http://ideamill.synaptrixgroup.com/

    jqGrid PHP y ASP.net

    Ahora hay componentes de jqGrid para PHP y ASP.net, entra en: http://www.trirand.net/demo.aspx





    Fuente: http://www.trirand.com/blog/

    jqGrid Componente PHP

    El 10 de Enero se lanzo la version Beta de jqGrid para PHP. Esto es un nuevo producto creado por desarrolladores PHP y equipos que radicalmente se benefician por la reduccion de costo/tiempo del jqGrid.

    El producto estara siendo ofrecido con licencias comerciales que incluiran un soporte tecnico rapido y seguro, codigos fuente y subscripciones basadas en beneficios.

    Puntos resaltantes:
    • Soporta toda la funcionalidad de jqGrid
    • No se necesita javascript engorroso. Todo es manejado en PHP
    • El componente PHP automaticamente maneja la recuperacion de datos, paginador, ordenacion, busquedas y todas las operaciones ( crear, leer, actualizar y borrar). No hay necesidad de codigos personalizados.
    • Puedes tener un grid funcional con solo unas pocas lineas de PHP
    • Soporta exportaciones a excel
    • Soporta los gestores de base de datos: MySql, Postgre SQL, Microsoft SQL server
    Puedes ver los demos online en:
    http://www.trirand.net/demophp.aspx

    Puedes hacer pretungas en los foros publicos de jqGrid para PHP  en:
    http://www.trirand.net/forum/default.aspx?g=forum

    y puedes descargar el demo aqui:
    http://www.trirand.net/download.aspx

    Fuente: http://www.trirand.com/blog/

    La version JqGrid 3.6.1 esta lista!

    El 23 de noviembre liberaron el jqGrid 3.6.1, es una mejora par la entrega oficial 3.6. Para una lista completa de los bugs verificados en esta version visita el siguiente enlace: WIKI .


    Lo nuevo en la version 3.6:




    Entre tantas mejoras visuales, destaco la opcion de mostrar/ocultar/reordenar columnas del grid con una accion drag and drop del raton. Esto debido a un plugin llamado ColumnChooser, creado por Mark Williams.





    Fuente: http://www.trirand.com/blog/

    jueves, 7 de enero de 2010

    Select o Combo Box Dinamicos desde Base de Datos con PHP y Javascript

    Aqui dejo un ejemplo para hacer selects dinamicos (alimentados de una base de datos). El ejemplo es una lista de sedes de universidades:

    HTML - Formulario que tiene el SELECT (sin options)


     

    PHP - Consulta a la Base de datos





    JAVASCRIPT - Se recibe el vector JSON de PHP , se crean y agregan las opciones para el Select.







    Resultado