gaea-uv: junio 2010

martes, 29 de junio de 2010

Vista de árbol en Combobox, Extjs

Encontré dos ejemplos para resolver este problema en la pagina de Extjs implementados por Saki

link:

ComboBox-Tree

y la pagina de publicaciones de saki

extjs.eu

viernes, 25 de junio de 2010

Generar pdf con dompdf en symfony

Bueno en general la librería dompdf me ha parecido muy fácil de trabajar, ya que se genera un html y este se pasa a pdf, es fácil la inclusión de imágenes y de caracteres especiales.

Para integrarla con symfony, sigues los siguientes pasos

instalar el plugin para symfony,
ya sea que la descarguen de http://www.symfony-project.org/plugins/sfDomPDFPlugin la descompriman en la carpeta plugins del sproyecto en el cual estan trabajando y la publiquen mediante el comando plugin:publish-assets o ya sea que los instalen con los comandos de sinfony, creo que es algo asi: plugin:install sfDomPDF
descargar la librería dompdf, http://eclecticgeek.com/dompdf/
reemplazar la carperta de dompdf que hay en el proyecto de symfony en plugins/sfDomPDFPlugin/lib
copiar la carpeta dompdf que descargaste en web/
limpiar la cache de synfony: symfony cc
empezar a utilizar la libreria

hay les dejo un ejemplo de como usarlo



 public function reporte()
  {
        require_once("dompdf/dompdf_config.inc.php");
        $html=stripslashes('<html>');
        $html.=stripslashes('');
        $html.=stripslashes("<body>");
        $html.="Espero que les sirva ";
        $html.=stripslashes('</body></html>');

        //uso de dom
        $dompdf = new DOMPDF();
        $dompdf->load_html($html);
        $dompdf->set_paper('letter','landscape');
        $dompdf->render();
        $dompdf->stream("reporte.pdf");

        exit(0);
  }

Incluir imágenes con dompdf
Para incluir imágenes que se incluye en el html que se va a cargar la etiqueta img.

 <img alt='gaea-uv' height='139'  src='logo.png'  width='485'/>

Para incluir imágenes de urls externas a la de donde reside la aplicación deben editar el archivo dompdf_config.init.php y cambiar el false de la variable "DOMPDF_ENABLE_REMOTE" por true.


//configuracion inicial
define("DOMPDF_ENABLE_REMOTE", false);

//configuracion final
define("DOMPDF_ENABLE_REMOTE", true);

Nota:lo que me parecio charro fue que la forma de agregar pies de pagina y numeración no me parecio natural, en este caso me parece que TCPDF tiene su fuerte.

Visualización de gráficos

Hace rato estuve buscando librerías y cosas para hacer gráficos embebidos en la web.encontré unas muy chereveres aqui les dejo las url para que chismeen.

FusionChar. http://www.fusioncharts.com/LiveDemos.asp
Char de extjs si trabajas con esto. http://www.sencha.com/products/js/
Google char y api de visualización. http://code.google.com/intl/es-CL/apis/charttools/docs/choosing.html

A mi personalmente me pareció que los gráficos del api de visualización y los gráficos de Fusion están súper cheveres y se pueden hacer cosas con un mayor grado de complejidad.

viernes, 11 de junio de 2010

Crear proyecto en Symfony + Extjs

Ya he visto cosas muy raras, así que voy a sugerir una forma de trabajar en Symfony y Extjs desde el principio y con calma. La versión de Symfony que sera usada, sera la 1.2.9 con el ORM Propel.

Para empezar instalamos Symfony como lo he puesto en las otras entradas o como quiera complicarse la vida (yo uso linux ubuntu no por rápido ni seguro ni nada de eso, simplemente por que es muy fácil trabajar allí), a continuación creamos el proyecto en nuestro servidor web, por ejemplo en /var/www/ , en el public_html de una cuenta, o si es win en c:\xampp\htdocs.

Para crear el proyecto recomiendo crear una carpeta como por ejemplo Proyecto, nos situamos dentro de ella y ejecutamos:

symfony generate:project Proyecto

esto nos creara todas las carpetas con la arquitectura usada por symfony. ahora crearemos una aplicación, para esto, allí mismo en la carpeta del proyecto ejecutamos:

symfony generate:app Aplicacion

esto creara una carpeta llamada Aplicacion en la carpeta apps del proyecto, lo siguiente es crear un modulo para esa aplicacion, allí mismo en la carpeta del proyecto ejecutamos:

symfony generate:module Aplicacion Modulo

Aplicacion= aplicacion creada anteriormente

Modulo= modulo de la aplicación creada anteriormente

esto creara una carpeta llamada Modulo en la carpeta Modules de la carpeta de la aplicación creada anteriormente, ya con esto podemos trabajar, pero antes debemos configurar algunos archivos:

databases.yml (configuración de conexión a la base de datos)
propel.ini (configuración de conexión a la base de datos)

en los archivos anteriores, configuramos la conexion a la base de datos para que Symfony se pueda conectar a ella, recuerde ser muy cuidadoso con los archivos yml, estos archivos se encuentran en la carpeta config del proyecto.

Otra cosa que recomiendo es cambiar el nombre del archivo .htaccess que se encuentra en la carpeta web por el de htaccess (quitar el punto), y añadir a la carpeta web la carpeta sf que la pueden descargar del siguiente link:

http://dl.dropbox.com/u/5610373/sf.zip

listo, ya con esto podemos revisar que vamos bien, para esto vamos a nuestro navegador, y accedemos al modulo creado de la siguiente manera:

localhost/Proyecto/web/index.php/Modulo

Ahora, después de la configuración de la base de datos, vamos a hacer el mapeo de la base de datos, para esto hay muchas formas de hacerlo, pero aquí explicare la forma de crear el schema.yml a partir de las tablas ya creadas en la base de datos.

Después de tener las tablas creadas en la base de datos, ejecutamos en la carpeta del proyecto:

symfony propel:build-schema

esto creara (modificara) el schema.yml que se encuentra en la carpeta config, este archivo se puede configurar pero recuerde ser muy cuidadoso con los espacios y demás. A partir de este schema, crearemos el modelo (clases de las relaciones), para esto ejecutamos:

symfony propel:build-model

y listo, ya tenemos preparada nuestra conexión y acceso de datos para nuestro proyecto.

Lo siguiente que haremos sera incluir el Extjs, para esto sugiero hacerlo asi como lo he explicado en una entrada anterior (Integración de Extjs en Symfony) perdón pero estoy muy cansado, apenas tenga tiempo lo termino.

Symfony + PDF, TCPDDF (sfTCPDFPlugin)

Bueno, como todo proyecto tiene reportes(en pdf), aquí va como agregar TCPDF a nuestro proyecto de Symfony.

Hasta donde hemos trabajado, lo hemos hecho de dos formas.

La primera es agregándolo con Symfony, situados en la carpeta de nuestro proyecto, ejecutamos:

symfony plugin:install sfTCPDFPlugin

luego

symfony plugin:publish-assets

luego

symfony cc

La segunda forma es descargarlo de:

http://www.symfony-project.org/plugins/sfTCPDFPlugin

recuerde revisar que la versión que descargue sea compatible con la versión del Symfony con la que esta trabajando. Despues de descargado lo descomprimen y lo copian en la carpeta de plugins del proyecto, debe quedar algo así: nombreProyecto/plugins/sfTCPDFPlugin, y despues ejecutamos:

symfony plugin:publish-assets

luego

symfony cc

y listo, ya tenemos el TCPDF en nuestro proyecto, ahora un ejemplo:

en el action de un modulo creamos una nueva acción

public function executeReportePDF()

{

$config = sfTCPDFPluginConfigHandler::loadConfig();

$pdf = new sfTCPDF();

$pdf->SetFont('FreeSerif', '', 8);

$pdf->SetMargins(PDF_MARGIN_LEFT, PDF_MARGIN_TOP, PDF_MARGIN_RIGHT);

$pdf->setHeaderFont(array(PDF_FONT_NAME_MAIN, '', '13'));

$pdf->SetHeaderData('', 2, 'Symfony', 'Reporte PDF');

$pdf->setFooterFont(array(PDF_FONT_NAME_DATA, '', PDF_FONT_SIZE_DATA));

$pdf->SetHeaderMargin(PDF_MARGIN_HEADER);

$pdf->SetFooterMargin(PDF_MARGIN_FOOTER);

$pdf->AliasNbPages();

$pdf->AddPage();

$this->html='Linux Rulez';

$pdf->writeHTML($this->html);

$pdf->ln();

$pdf->Output();

throw new sfStopException();

}

es un ejemplo muy sencillo, como para probar, ya cada quien lo modificara y le agregara cosas a su antojo. (por ahora no se como poner etiquetas html en las entradas del blog.)

miércoles, 9 de junio de 2010

Integración de Extjs en Symfony

Bueno para empezar voy a decir que existen muchas formas, e incluso yo probé muchas de esas, con variantes y todo (links, doble carpeta, etc), pero la verdad es que es muy simple, bueno aquí presentare la que yo adapte y adopte en un proyecto que estoy realizando para la u.

Lo primero es copiar la carpeta del extjs a la carpeta web de nuestro proyecto (nombreProyecto/web/extjs), e incluir en view.yml de la aplicación (nombreProyecto/apps/nombreAplicacion/config/view.yml) los js y css respectivos para el funcionamiento del extjs, el archivo view.yml se tendría que ver algo así:

....

stylesheets: [../extjs/resources/css/ext-all.css, main.css, ../extjs/resources/css/xtheme-blue.css , ...]

...

javascripts: [../extjs/adapter/ext/ext-base.js, ../extjs/ext-all-debug.js, ../extjs/src/locale/ext-lang-es.js, ...]

...

y listo, no olviden aquí mismo incluir sus js.

nota: no se si al hacer esto altere en algo la arquitectura del proyecto (organizacion de las carpetas y demas), y a la hora de la revisión, algún profesor salga con las que el proyecto ya no esta en 3 + 1 capas. En lo personal creo que no, ya que solo estamos tocando la interfaz de presentacion.

domingo, 6 de junio de 2010

Extjs Carousel

Estoy trabajando con Extjs para mis trabajos de la universidad y encontré una forma de presentar imágenes o divs (que contienen cualquiercosa), de una manera muy agradable.

La extensión se llama carousel y esta disponible en:

http://www.extjs.com/learn/Extension:Image_Carousel

y el ejemplo en:

http://www.extjs.com/playpen/ext-core-latest/examples/carousel/

yo lo organice de la forma en que están los ejemplos de Extjs que me gusta mucho y lo tengo publicado en el siguiente enlace.

descarga aquí el carousel.

un ejemplo para agregar imágenes dinamicamente:

var carouselpanel = new Ext.Panel({

title: 'titulo panel',

boxMaxHeight: 465,

boxMaxWidth: 700,

style: 'margin:0 auto 0 auto;',

footer: false

});

var imagenes_template = new Ext.Template(

'aqui creo el div como todos lo sabemos hacer con el id donde el carousel se va a renderizar, también se puede agregar de una vez imágenes'

///no pude poner el codigo todavia no se publicar codigo :'(

);

carouselpanel.add( imagenes_template );

carouselpanel.doLayout( true, true );

var imagenes_carousel = new Ext.ux.Carousel(

'imagenes_div',

{

itemSelector: 'img',

interval: 10,

autoPlay: true,

showPlayButton: true,

pauseOnNavigate: true,

freezeOnHover: true,

transitionType: 'fade',

navigationOnHover: false,

width: 650,

height: 460

}

);

para quitar las imágenes actuales:

imagenes_carousel.clear();

para agregarlas dinamicamente:

var img = document.createElement('img');

img.src = 'url_imagen';

img.title = 'nombre_imagen';

img.setAttribute('style', 'width:300px; height:300px');

imagenes_carousel.add(img, true);

imagenes_carousel.play();

por si alguien no sabe agregar el carousel:

type="text/javascript" src=".../carousel/carousel.js" ///script

rel="stylesheet" type="text/css" media="screen" href=".../carousel/css/carousel.css" ///css

espero les sea de ayuda.

Instalar symfony en win

Después de tener instalado php, apache y mysql, ya sea usando el xampp o wampp o cada uno independiente (yo lo hago con xampp), descargamos el symfony desde

http://www.symfony-project.org

o para una version especifica

http://www.symfony-project.org/get/symfony-"version".tgz

por ejemplo:

http://www.symfony-project.org/get/symfony-1.2.9.tgz

despues de descargado, lo extraemos en el directorio htdocs (xampp) que se encuentra en

c:\xampp\htdocs

y agregamos las variables de entorno para php y el symfony de la siguiente manera:

Equipo -> Clic derecho (propiedades) -> Configuración Avanzada del Sistema -> variables

de entorno. Modifico la variable Path, y le adiciono las rutas absolutas donde se encuentran el php y el symfony:

PHP: C:\xampp\php

Symfony: C:\xampp\htdocs\symfony-1.2.9\data\bin

y listo ya tenemos instalado Symfony en win.

Redactado con ayuda de una guía desarrollada por Jose Omar (jomaroc). vamos a ver si me deja publicarla aquí, ya que ahí se encuentra el proceso un poco mas detallado y ademas explica como crear y configurar un proyecto.

jomaroc, gracias por el comentario y por dejar publicar su trabajo.

Bueno sin mas aquí esta el link.

Symfony_en_Windows_Vista

Instalar Symfony en Linux (Ubuntu)

Después de tener instalado el Php, Mysql y el Apache, ya sea por Lamp, Xampp, o cada uno independiente, lo siguiente es instalar Pear de la siguiente manera:

sudo apt-get install php-pear

luego agregar el canal de Symfony:

pear channel-discover pear.symfony-project.com

y finalmente instalar Symfony

sudo pear install symfony/symfony

si se quiere instalar una versión especifica, agregamos la versión al final, ej

sudo pear install symfony/symfony-1.2.9

y listo, recuerden tener instalado el php5-cli, y libxslt para usar el propel.

Migrar proyecto Symfony de Win a Linux o viceversa

Para migrar un proyecto realizado con el framework symfony de win a linux, usando la misma versión de symfony, lo unico que se necesita hacer es cambiar o alternar las siguiente linea del archivo ProjectConfiguration.class.php que se encuentra en

nombreProyecto/config/ProjectConfiguration.class.php

la linea que hay que cambiar es la siguiente.

require_once 'C:\xampp\htdocs\symfony-1.2.9\lib/autoload/sfCoreAutoload.class.php'; (win)

la cambiamos por:

require_once '/usr/share/php/symfony/autoload/sfCoreAutoload.class.php'; (linux)

o donde sea que tengamos instalado el symfony.

Lo he probado con la versión de symfony 1.2.9 y ha funcionado perfectamente.