Error Day 11 Jobeet

Todos los que hallan puesto esta parte del código

isRedirected()->
followRedirect()->
 
with('request')->begin()->

isParameter('module', 'job')->

isParameter('action', 'show')->

end()->

y les salio el siguiente error el consola por ejecutar las pruebas funcionales

PHP sent a "warning" error at C:\xampp\htdocs\symfony-1.4.8\lib\test\sfTestFunctionalBase.class.php line 433 (call_user_func_array() expects parameter 1 to be a valid callback, class 'sfBrowser' does not have a method 'isRedirected')


Les traigo la solución, realmente se debe de clocar asi

with('response')->begin()->
    isRedirected()->
end()->
 
 followRedirect()->

  with('request')->begin()->
    isParameter('module', 'job')->
    isParameter('action', 'show')->
  end()
;

Esta solución fue gracias a el Ing. Leonardo Chacon.

Chiste - Como medir un buen codigo de un mal codigo

Refrán - Aldous Huxley

La experiencia no es lo que sucede a un hombre. Es lo que un hombre hace con lo que le pasa.

Instalar Symfony Windows - sin pear

Lo primero que tenemos que hacer es

Instalar XAMPP para Windows


http://www.apachefriends.org/en/xampp-windows.html

Dejamos todo por defecto, la instalacion abrira una consola del sistema dejamos todas las opciones por defecto.

Una ves instalado tenemos que Vincular PHP a la consola del sistema de Windows.

Windows XP , con click derecho en Mi Pc y luego a Propiedades, llegaron al lugar.
Windows Vista y 7, lo mismo pero no llegan a donde es, esto les abrirá una ventana y le dan clic a  ADVANCED SYSTEM SETTINGS.

Una ves que nos encontremos en System Properties, Vamos a la pestaña Advances y luego a Enviroment Variables.

Colocamos una ruta  mas en Path:

• Doble click en la variable Path 

• Agregamos el camino a la carpeta php del XAMPP

Creamos una nueva variable llamada php:

• Click en nuevo

• la llamamos php y le damos el camino a el ejecutable php.exe

Ahora probemos si php sirve en la consola con el comando php -v que nos dirá que versión esta instalada.

Una ves que veamos que ya nuestra consola puede ejecutar comando php, vamos a pasar la prueba de fuego, bajamos Symfony de la pagina http://www.symfony-project.org/installation yo baje la versión SOURCE 1.4.8 anexo el link http://www.symfony-project.org/get/symfony-1.4.8.zip

Lo descomprimimos Symfony en una carpeta, yo la descomprimí en la misma carpeta publica del XAMP pero se aconseja no hacerlo por medidas de seguridad, pero como trabajaremos de manera local y luego se exporta a producción no creo que tengamos problemas.

Una ves que descomprimimos la carpeta navegamos a ella por la consola.

Una ves en la carpeta bin de symfony ejecutamos php check_configuration.php

Vemos que tenemos 2 Warnings, el cual esta muy bien porque ninguno de los 2 nos perjudica cuando programemos ya que no son de mucha importancia.

posix_isatty( ) por ahora no se puede resolver en el entorno Windows. Si alguien sabe como instalarlo, bienvenido sea el comentario, en LINUX se puede resolver.

El Segundo Warning si lo podemos quitar solo tenemos que descomentar  php_apc.dll en el PHP.INI en la carpeta C:\xampp\php, solo le quitamos el ; para poder dejar libre el dll para su ejecucion

También debemos des comentar los PDO de base de datos y el manejador de base de datos en este caso, nosotros usamos postgres

Salvamos el php.ini y volvemos a ejecutar el comando php check_configuration.php

Felicidades hemos instalado SYMFONY EN WINDOWS

Refrán - Peter Drucker

La mejor organización no asegura los resultados. Pero una estructura equivocada sería garantía de fracaso.

Instalar Symfony Linux

Crear un proyecto Symfony 1.4

• Tener apache instalado:

Verificamos si tenemos apache instalado:

sudo /etc/init.d/apache2 start

Si esto no existe  entonces no tienes apache instalado y lo instalamos con el siguiente comando:

sudo apt-get install apache2

y volvemos a intentar el comando anterior:

sudo /etc/init.d/apache2 start

• Tener php 5.2.4 o mejor

Verificamos si ya tenemos PHP instalado, por la consola colocamos:

php -v

si ese comando nos responde, buenisimo, tenemos PHP instalado solo tenemos que verificar que la versión sea mayor o igual a 5.2.4.

Si no lo tenemos instalado lo instalamos con

sudo apt-get install php5

sudo apt-get install php5-cli

sudo apt-get install php5-dev

sudo apt-get install php5-common



sudo apt-get install php5-xsl

sudo apt-get install libapache2-mod-php5

sudo apt-get install php-pear

sudo apt-get install php-apc

y luego ejecutamos el comando anterior:

php -v

• Instalamos algún tipo de Base de datos

PostgreSQL

sudo apt-get install postgresSQL-version  (la version que desee my postgreSQL is 8.4)
sudo apt-get instal php5-pgsql (para que php pueda manejar esta base de datos)

MySQL

sudo apt-get install mysql  (la version que desee)
sudo apt-get instal php5-mysql (para que php pueda manejar esta base de datos)

etc.

• Descargamos Symfony

Symfony Source 1.4 (DESCARGAR)

NOTA: siempre es recomendable que en un desarrollo no se coloque el workspace dentro del www publico del apache es preferible crear un VIRTUAL HOST, que apunte a nuestra carpeta workspace y sea local, si es de ser necesario un acceso remoto configurarlo en nuestro VIRTUAL HOST y le damos acceso a quien nosotros queramos.

• Crear el Workspace

Crearemos el mismo workspace que el tutorial de Symfony para Jobeet:

mkdir -p /DIRECCIÓN DONDE VAS A TRABAJAR/sfprojects/jobeet

mkdir crea una carpeta pero cuando queremos crear varias carpetas existan o no usamos -p

• Creamos donde vamos a Instalar Symfony

Nos paramos en jobeet y escribimos el siguiente comando:

mkdir -p lib/vendor

ahora tenemos esta estructura:

sfprojects

     -  jobeet

             -  lib

                  - vendor

Nos mudamos a vendor y movemos el TGZ de symfony a la misma carpeta y ejecutamos:

cd lib/vendor (Nos paramos en la carpeta Vendor)

tar zxvf symfony-1.4.0.tgz  (esto symfony-1.4.0.tgz Cambia de acuerdo a la versión que descargaste)

mv symfony-1.4.0 symfony  (Renombrar la carpeta descomprimida)

rm symfony-1.4.0.tgz (Eliminamos el archivo comprimido ya que no lo necesitaremos mas)

• Nos salimos a la carpeta Jobeet

Si estamos parados en vendor hacemos

cd .. 

cd ..

ya estamos en Jobbet

• verificamos que Symfony funciona sacando una leyenda de ayuda

php lib/vendor/symfony/data/bin/symfony -v

• Creando el proyecto en Symfomy  (estamos parados en la carpeta Jobeet)

Aquí tenemos que tomar una decisión la cual es en que ORM vamos a trabajar PROPEL o DOCTRINE 

DOCTRINE ( viene por defecto por lo tanto el comando es )

php lib/vendor/symfony/data/bin/symfony generate:project jobeet

PROPEL ( viene por defecto por lo tanto el comando es )

php lib/vendor/symfony/data/bin/symfony generate:project jobeet --orm=Propel

Ambos comandos nos crearan las carpetas

     apps/

     cache/

     config/

     lib/

     log/

     plugins/

     test/

     web/

Ya no necesitamos acceder a symfony con esta dirección lib/vendor/symfony/data/bin/symfony ahora tenemos en la carpeta jobeet un archivo symfony que nos permitirá ejecutar comandos parados desde jobeet. 

Ya veremos unos ejemplos a continuación.

• Creamos nuestro Front End y Back End (seguimos parados en la carpeta jobeet)

Front End: es la parte visible a internet para todos los usuarios que puedas llevar a tu pagina.

php symfony generate:app frontend

Back End: es la zona administrativa, o simplemente algo que necesite de un acceso restringido para hacer algo.

php symfony generate:app backend

• Ahora la prueba de fuego CHEQUEAR SI TODO ESTA BIEN INSTALADO ( en la carpeta Jobeet)

php lib/vendor/symfony/data/bin/check_configuration.php

Esperamos este resultado

********************************

*                                                            *

*  symfony requirements check             *

*                                                            *

********************************

php.ini used by PHP: /etc/php5/cli/php.ini

** WARNING **

*  The PHP CLI can use a different php.ini file

*  than the one used with your web server.

*  If this is the case, please launch this

*  utility from your web server.

** WARNING **

** Mandatory requirements **

  OK        PHP version is at least 5.2.4 (5.3.2-1ubuntu4.5)

** Optional checks **

  OK        PDO is installed

  OK        PDO has some drivers installed: pgsql

  OK        PHP-XML module is installed

  OK        XSL module is installed

  OK        The token_get_all() function is available

  OK        The mb_strlen() function is available

  OK        The iconv() function is available

  OK        The utf8_decode() is available

  OK        The posix_isatty() is available

  OK        A PHP accelerator is installed

  OK        php.ini has short_open_tag set to off

  OK        php.ini has magic_quotes_gpc set to off

  OK        php.ini has register_globals set to off

  OK        php.ini has session.auto_start set to off

  OK        PHP version is not 5.2.9

NOTA: si algo dice  WARNING lo mas probable explique que falta instalar.

FELICIDADES HAS INSTALADO SYMFONY

Ahora hacer los tutoriales de Symfony

TUTORIAL CON DOCTRINE

TUTORIAL CON PROPEL

Refrán - William G. McGowan

La única práctica gerencial que ahora es constante es la práctica de acomodarse constantemente al cambio

William G. McGowan

Growler Lib - Ejemplo

Please upgrade your Flash Player
This is the content that would be shown if the user does not have Flash Player 6.0.65 or higher installed.

Aqui les dejo el AIR para que puedan ver como funciona el growler, los codigos del ejemplo estan dentro del air, se le puede hacer clic derecho VIEW SOURCE.

Codigo Main

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
   xmlns:s="library://ns.adobe.com/flex/spark" 
   xmlns:mx="library://ns.adobe.com/flex/mx" 
   width="100%" height="100%" 
   xmlns:www="http://www.flex-tutorial.fr/2009"
   left="10" right="10" bottom="10" top="10"
   >

 <fx:Script>
  <![CDATA[
   import mx.graphics.GradientEntry;
   
   import net.developyourdream.growler.Growler;
   import net.developyourdream.growler.growlers.GrowlerTypeUbuntu;
   import net.developyourdream.view.growler.GrowlerTypeCustom;
   import net.developyourdream.view.growler.GrowlerTypeCustomTwo;
   

   protected function basicSkinClickHandler(event:MouseEvent):void
   {
    var growler:Growler = new Growler;
    growler.dispach();
   }
   
   protected function ubuntuSkinClickHandler(event:MouseEvent):void
   {
    var growler:GrowlerTypeUbuntu = new GrowlerTypeUbuntu;
    growler.width = 200;
    growler.theTitle = myTitle.text;
    growler.message = myMessage.text;
    growler.dispach();
   }
   
   protected function customSkinClickHandler(event:MouseEvent):void
   {
    var growler:GrowlerTypeCustom = new GrowlerTypeCustom;
    growler.theTitle = myTitle.text;
    growler.story = myStory.text;
    growler.message = myMessage.text;
    growler.gradientFillColors = [new GradientEntry(Math.random()*0xFFFFFF,NaN,0.8),new GradientEntry(Math.random()*0xFFFFFF,NaN,0.8)];
    growler.dispach();
   }
   
   protected function custom2SkinClickHandler(event:MouseEvent):void
   {
    var growler:GrowlerTypeCustomTwo = new GrowlerTypeCustomTwo;
    growler.dispach();
   }
  ]]>
 </fx:Script>

 <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
 <s:layout>
  <s:VerticalLayout/>
 </s:layout> 
 
 <mx:Image source="../../../assets/image/LogoLargo.png"  width="400"/>
 <s:Label text="TITLE" />
 <s:TextInput id="myTitle" text="Develop Your Dream Lib" width="100%"/>
 <s:Label text="STORY" />
 <s:TextInput id="myStory" text="Este campo solo es para el CUSTOM GROWLER" width="100%"/>
 <s:Label text="MESSAGE" />
 <s:TextArea id="myMessage" width="100%" text="A los growlers del lib no se ajuntan al texto por lo tanto se le debe especificar su WIDTH y HEIGHT. &#13;&#13;Para lograr que los growler se ajusten dinamicamente se pueden hacer GROWLERS CUSTOM extendiendo de la clase GROWLER, se calcula el tamaño de los hijos y se sobre escribe el metodo updateDisplayList. &#13;&#13;Ejemplo: CUSTOM SKIN 1."
 />
 <s:Group width="100%" height="100%">
  <s:layout>
   <s:TileLayout/>
  </s:layout>
  <s:Button label="Lib Basic Skin" click="basicSkinClickHandler(event)"/>
  <s:Button label="Lib Ubuntu Skin" click="ubuntuSkinClickHandler(event)"/>
  <s:Button label="Custom Skin 1" click="customSkinClickHandler(event)"/>
  <s:Button label="Custom Skin 2" click="custom2SkinClickHandler(event)"/>
 </s:Group>
 
</s:Group>

Para crear un Growler Básico, se crea una instancia y se puede mostrar con el metodo dispatch().

El método dispach solo se usa cuando estamos seguros que el growler esta listo para mostrarse, en mejores palabras una ves que se le coloca el Width y el Height y se le setea los parámetros bien sea propio o personalizados.

Flex Growler Lib

Flex Growler Lib

Flex Growler Lib, es una librería para flex para crear popups tipo gtalk, messenger, o cualquier tipo de alerta de sistema o notificación de cualquier tipo. Actualmente solo sirve en AIR, pronto le colocaremos la capacidad que salgan en aplicaciones con flash player, para lograr los mismos resultados dentro de un browser.

La librería es totalmente open source y se puede descargar en el siguiente link http://gitorious.org/develop-your-dream/growler-flex-lib

Tambien les dejo el link a la libreria para que se la descarguen:

DESCARGAR SWC

Aqui esta una imagen de como se ven los growlers.

Ejemplo:

Flex Pivotal Tracker Lib - Documentacion

La documentación de la librería se hará mientras se desarrollan las clases, esto quiere decir que a medida que salgan funciones dentro de las clases se colocara la explicación de la misma, los parámetros a usar, y que retorna cada función.
A todos los métodos de las clases se les pasan tres funciones fijas donde solo 1 de ellas es obligatorio pasarla, las otras 2 no si no se quiere manejar las mismas, estas funciones son:

• Result Function (Obligatoria): esta función devuelve la petición de la librería, en otras palabras si pedimos un ActivityFeed.(cualquier tipo de método) esto enviara un ActivityFeedEvent. 
• Error Function: siempre llamara a una función de tipo ErrorEvent y dentro de ella contendrá un ErrorVO con el detalle del error generado.
• Security Function: siempre llamara a una función de tipo SecurityEvent y dentro de ella contendrá un SecurityVO con el detalle de segur generado.

DESCARGAR LIBRERIA SWC

Retrieive User Token

getUserToken
Esta librería se comunica por SSL, es una autenticación básica, se crea un hash del usuario y su contraseña y se envía.

RetrieveUserToken.getUserToken("NOMBRE DEL USUARIO","CONTRASEÑA",resultFunction,errorFunction,securityFunction);

Llamara a la función resultFunction(event:RetrieveUserTokenEvent), dentro de event encontraremos UserTokenVO con toda la información de la consulta.

Activity Feed
Le permite recuperar la actividad reciente de todos sus proyectos.
En esta clase tenemos un parámetro similar en todas las funciones:

• Limit: este parámetro por defecto es 10 y tiene un techo de 100 registros.

Tenemos otros dos parámetros mas:

• Since: se puede pasar de tipo String o de  tipo Date, este permite restringir a solo aquellos elementos que se produjeron después de una fecha suministrada, ejemplo del formato 2009/12/18 21:00:00 UTC.
• Version: es de tipo INT, este permite restringir a solo aquellos elementos que tienen una versión mayor a la suministrada.

Existe un parametro mas pero son solo para los metodos que empiezan con project:

• Project ID: es de tipo INT, y permite buscar las actividades de un proyecto la combinación de los tres parámetros mencionados anteriormente.

allActivity_OccurredSinceDate

ActivityFeed.allActivity_OccurredSinceDate("TOKEN",resultFunction,new Date("2009","10","16"),LIMIT,faultFunction,securityFuncion);

Llamara a la función resultFunction(event:ActivityFeedEvent), dentro de event encontraremos ActivitiesVO con toda la información de la consulta.

allActivity_NewerThanVersion
Esta función recibe como parámetro  la versión de la actividad y devuelve todas las versiones que sea mayor a la ingresada de todos los proyectos, siempre tomen en cuenta que el limite máximo llega hasta 100 actividades.

ActivityFeed.allActivity_NewerThanVersion("TOKEN",resultFunction,VERSION,LIMIT,faultFunction,securityFuncion); 

Llamara a la función resultFunction(event:ActivityFeedEvent), dentro de event encontraremos ActivitiesVO con toda la información de la consulta.

allActivity_OccurredSinceDate_And_NewerThanVersion
Esta función recibe como parámetro  la versión de la actividad y la fecha y devuelve todas las versiones que sea mayor a la ingresada y que sea en las fechas superior a la suministrada para todos los proyectos, siempre tomen en cuenta que el limite máximo llega hasta 100 actividades.

ActivityFeed.allActivity_OccurredSinceDate_And_NewerThanVersion("TOKEN",resultFunction,VERSION,LIMIT,faultFunction,securityFuncion); 

Llamara a la función resultFunction(event:ActivityFeedEvent), dentro de event encontraremos ActivitiesVO con toda la información de la consulta.

projectActivity_OccurredSinceDate
Esta función recibe como parámetro el id del proyecto y  la fecha, devuelve todas las actividades de dicho proyecto y sea en las fechas superior a la suministrada, siempre tomen en cuenta que el limite máximo llega hasta 100 actividades.

ActivityFeed.projectActivity_OccurredSinceDate("TOKEN",PROJECT ID,resultFunction,new Date("2009","10","16"),LIMIT,faultFunction,securityFuncion); 

Llamara a la función resultFunction(event:ActivityFeedEvent), dentro de event encontraremos ActivitiesVO con toda la información de la consulta.

projectActivity_NewerThanVersion
Esta función recibe como parámetro el id del proyecto y  la version, devuelve todas las actividades de dicho proyecto y superior a la version suministrada, siempre tomen en cuenta que el limite máximo llega hasta 100 actividades.

ActivityFeed.projectActivity_NewerThanVersion("TOKEN",PROJECT ID,resultFunction,VERSION,LIMIT,faultFunction,securityFuncion); 

Llamara a la función resultFunction(event:ActivityFeedEvent), dentro de event encontraremos ActivitiesVO con toda la información de la consulta.

projectActivity_OccurredSinceDate_And_NewerThanVersion
Esta función recibe como parámetro el id del proyecto, la fecha y  la version, devuelve todas las actividades de dicho proyecto y superior a la version suministrada y a su ves superior a la fecha suministrada, siempre tomen en cuenta que el limite máximo llega hasta 100 actividades.

ActivityFeed.projectActivity_OccurredSinceDate_And_NewerThanVersion("TOKEN",PROJECT ID,resultFunction,VERSION,new Date("2009","10","16"),LIMIT,faultFunction,securityFuncion); 

Llamara a la función resultFunction(event:ActivityFeedEvent), dentro de event encontraremos ActivitiesVO con toda la información de la consulta.

Get Projects

allMyProjects
Esta función devuelve todos los proyectos a los cuales esta asociado el usuario de este token.

GetProjects.allMyProjects("TOKEN",resultFunction,faultFunction,securityFuncion,data); 

Llamara a la función resultFunction(event:GetProjectsEvent), dentro de event encontraremos ProjectsVO con toda la información de la consulta.

getSingleProject
Esta función devuelve el detalle de un proyecto, este proyecto debe estar asociado al miembro del token que lo esta pidiendo, de lo contrario la respuesta vendría vacía. .

GetProjects.getSingleProject("TOKEN",PROJECT ID,resultFunction,faultFunction,securityFuncion,data); 

Llamara a la función resultFunction(event:GetProjectsEvent), dentro de event encontraremos ProjectVO con toda la información de la consulta.

Flex Pivotal Tracker Lib

Flex Pivotal Tracker Lib, es una librería para flex para comunicarse con el API de Pivotal Tracker, esta librería podrá hacer lo mismo que ofrece la librería de Pivotal Tracker Version 3, esta librería la podrán consultar en http://www.pivotaltracker.com/help/api?version=v3, usan CURL como medio de comunicación para enviarnos un XML.

La librería para Flex convierte los XML ofrecidos por Pivotal Tracker y los converte en Value Objects "VO" y de igual forma se podrá acceder al XML para los amantes del lenguaje.
La librería es totalmente open source y se puede descargar en el siguiente link http://gitorious.org/develop-your-dream/flex-pivotaltracker-lib

Un Archivo en Varias Computadoras

DropBox

Es una solución bastante buena para tener un archivo respaldado en muchas partes a la ves, simplemente es un programa que al instalarse en la computadora, crea una carpeta que todo lo que coloques dentro de la carpeta se sube automáticamente a Internet y se sincroniza con todas las computadoras que tengan instalado el mismo programa y le hayas dado permiso de ver esta carpeta.

Esto nos garantiza que nuestros archivos estén seguros, y si se nos daña la computadora donde teníamos todos esos documentos importantes, ya solo nos dolerá perder la laptop, porque la información esta segura y se recupera en cualquier momento, tan solo ingresando a DropBox.

También podemos no solo guardar archivos sino compartirlos

• Comparte con tus amigos tus Fotos
• Comparte con tus Compañeros de trabajo tus Documentos.
• Mandarle a tu familia tus últimos Vídeos.
• Entre muchas otras posibilidades de uso que tiene.

La mejor de todas es que tienes tu Información Segura donde quieras y cuando quieras.

REGISTRATE EN ESTE LINK A DROPBOX

Flash fondo transparente o swf transparente

swf con fondo transparente
Solo tenemos que colocar  wmode="transparent" en el tag embed del HTML para lograr la transparencia del fondo del SWF.

<div style="background: url(img/testimage.jpg) no-repeat;">
 <object height="500" width="500">
  <embed src="swf/Cairngorm.swf" height="500" width="500" wmode="transparent">
  </embed>
 </object>
</div>

swf sin fondo trasparente

<div style="background: url(img/testimage.jpg) no-repeat;">
 <object height="500" width="500">
  <embed src="swf/Cairngorm.swf" height="500" width="500">
  </embed>
 </object>
</div>

Herramienta Gratis de Gestión de Tareas - Pivotal Tracker

Pivotal Tracker

Es una herramienta gratuita de Pivotal Labs, que nos permite organizar las tareas de un proyecto, utilizando el concepto de gestión de pilas.

Esta herramienta es recomendable para los programadores y coordinadores del proyecto, como para los clientes y agentes externos, ya que es fácil de usar, fácil de aprender y muy amigable para los usuarios que interactúan con el mismo.

Cuenta con diversas fuentes de información y métricas para brindar de una forma detallada y comprensible, el progreso diario, semanal o mensual de un proyecto o de los miembros, dependiendo de las tareas y sus estados ( empezado, terminado y rechazado ), entre muchas más plantillas de información.

La curva de aprendizaje de la herramienta es muy sencilla, lo cual nos permite tomar esta herramienta en cualquier momento y probarla sin tener un costo adicional en cuanto a perdida de tiempo.

Cómo Se Usa
Lo primero que tenemos que hacer es registrarnos en Pivotal Tracker, luego creamos un proyecto y a trabajar. Agregamos a todos los miembros del proyecto ( desarrolladores, clientes, agentes externos, coordinadores ).

Creamos tareas, las tareas se crean pensando en el usuario y no pensando en cual es la forma más simbólica para mi de nombrar la tarea para que mi equipo entienda de que se trata, si le colocas un nombre pensando asi, el usuario final ( nuestro cliente ) no va a entender que se está haciendo, me explico,

Forma Incorrecta
"Implementar Sistema de Pago"

Forma Correcta
"El Usuario a de Poder Pagar"

El porque es muy simple, el momento que un cliente entre a revisar como va el proyecto, supongamos que nuestro cliente es graduado en Educación, cuando lea Implementar Sistema de Pago, se va a imaginar algo que se puede hacer en 30 minutos o menos, según su criterio, ahora si lee El Usuario a de Poder Pagar, ya se imagina, un diseño, diferentes pantallas, suena como mas grande y cuando lo vea en estado Terminado el cliente estará muy feliz y eso es lo que queremos.

Una ves creada la tarea tenemos una bandeja de entrada llamada IceBox, esta bandeja están todas nuestras tareas que alguna ves o quizá vamos a realizar, asignadas a un miembro del grupo que es quien la va a alguna ves o quizá ira realizar.

Las tareas tienen Puntos, que van del 0 a 3 dependiendo su dificultad. una ves colocado el punto según su dificultad, aparecerá un botón llamado START.


Cuando ya se pueda realizar una tarea la podemos arrastrar a la bandeja de entrada Current, la cual estarán todas nuestras historias pendientes actualmente y NO SON ALGUNA VES O QUIZA, esta tareas son para realizar "por que si".

Una ves que la tarea este en la bandeja Current, la puntuación que le hemos dado tiene 3 finalidades:

1. Colocar la carga de trabajo.
2. No sobre cargar el trabajo actual.
3. Calcular la Velocidad de las tareas.

Explico el segundo punto, la bandeja Current tiene un limite de puntos, este limite de puntos nos permite no sobre cargar nuestras actividades actuales, toda actividad que exceda este limite es pasadas automáticamente a la bandeja de BackLog. La idea es mantener la bandeja Current corta y realista.

El tercer punto, es una métrica llamada Velocidad, esta métrica, se calcula en base a la media de puntos por semana de una persona. Esto nos ayuda a calcular 2 cosas:

1. Que tan rápido va mi proyecto
2. Que tan rápido trabaja X persona con respecto a la tarea asignada.

El segundo punto, nos puede ayudar a distribuir mejor las tareas entre la cantidad de miembros, muy útiles para saber las fortalezas y debilidades de nuestro Team de Trabajo.

Conclusión

PivotalTracker es una herramienta gratis, fácil de usar y de aprender y no puede pasar por alto el usarlo por lo menos una ves a ver que beneficios nos trae.

Chiste de Requerimientos

SkinnableComponent Skin, Dynamic Change - Flex 4

Ejemplo:

Muchas veces necesitamos un component que se comporte como queramos y eso lo podiamos hacer perfectamente con flex 3, pero cuando hablamos de que se vea como queramos ya era otro cuento, teníamos que dibujar dentro de nuestro component o simplemente dibujaba nuestro Nuevo component en flash e importarlo desde flash a flex usando flex kid component.

Con el nuevo framework de flex, separaron lo que es la parte grafica de los componentes de la parte funcional del mismo. Esto quiere decir, que podemos hacer una clase para hacer que se comporte como queramos y luego hacer otra clase para crear como queremos que se vea.

Este diagrama de arquitectura nos dará una idea a que nos estamos enfrentando ahora en comparación con flex 3

Los componentes sigues extendiendo de UIComponente pero ahora tienen un clase llamada SkinnableComponent de este lado podemos programar todo lo que queremos que nuestro componente haga, y del lado de la interfaz nos crean lo que es la clase skin con esta clase podemos renderizar cualquier componente, existen skins ya prediseñados pero si queremos hacer uno por nuestra cuenta desde cero, extenderemos de skin class.

También tenemos el diagrama del ciclo de vida de los skin:

(Esta Imagen fue sacada de http://opensource.adobe.com/wiki/display/flexsdk/Spark+Skinning)


Tenemos varios métodos que podemos sobre escribir para poder darle muchas más funcionalidades a nuestros diseños, no solo para decorar sino para crear efectos interesantes.

Communications between two Local Flex Apps - Comicacion entre dos Apps de Flex Locales

Translation:

• Spanish
• English

Algunas veces queremos comunicar dos aplicaciones de Flex o Flash que se encuentran en la misma página, y no vemos la manera de hacerlo.

ActionScript tiene una clase, que nos permite hacer esto sin mucho esfuerzo. Esta clase está ubicada en flash.net. LocalConnection.

Como todo principio de Cliente servidor, una aplicación tiene que escuchar y la otra tiene que ver si hay alguien escuchando.

Veamos el primer código donde vemos la aplicación que escucha, le colocaremos un nombre a la conexión llamada myConnection:

Sometimes we want to communicate two Flex or Flash applications that are on the same page, and do not see how.

ActionScript has a class, allowing us to do so without much effort. This class is located at flash.net. LocalConnection.

The idea is like a client server connection, an application needs to listen and the other has to see if anyone is listening.

Let us first see the application code where you hear, we will place a name to the connection called myConnection:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="500" minHeight="300"
      applicationComplete="applicationCompleteHandler(event)" viewSourceURL="srcview/index.html">
 

 
 <fx:Script>
  <![CDATA[
   import mx.collections.ArrayCollection;
   import mx.controls.Alert;
   import mx.events.FlexEvent;
   
   private const connection:LocalConnection = new LocalConnection();
[Bindable] private var   data:ArrayCollection = new ArrayCollection();
   
   protected function applicationCompleteHandler(event:FlexEvent):void
   {
    // TODO Auto-generated method stub
    data.addItem("Application Complete Handler");
    connection.client = this;
    connection.connect("myConnection");
    data.addItem("The Client es THE APP, The name is myConnection");
   }
   
   public function colorBackground(sendedColor:uint):void
   {
    data.addItem("colorBackground Function");
    try
    {
     remoteColor.setStyle("backgroundColor",sendedColor);
     data.addItem("Recived Color in UInt -> "+ sendedColor);
    }
    catch (error:ArgumentError)
    {
     Alert.show("Error trying to connect to LocalConnection.");
    }
   } 
   
  ]]>
 </fx:Script>
 
 <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
 
 <s:VGroup height="100%" width="100%" 
     x="0" y="0" 
     paddingLeft="20" paddingRight="20" paddingTop="20" paddingBottom="20" 
     horizontalAlign="center">
  <s:Panel id="remoteColor" 
     width="250" height="100" 
     title="Remote Background Color" >
  </s:Panel>
  <s:Panel width="100%" height="100%" 
     title="Console">
   <s:List id="console" 
     width="100%" height="100%" 
     x="0" y="0"
     dataProvider="{data}"></s:List>
  </s:Panel>
 </s:VGroup>
</s:Application>

Ahora veamos la segundo aplicación la cual envía un mensaje a myConnection buscando una función llamada colorBackground y le pasa como parámetro el Color Seleccionado:

Now for the second application which sends a message looking for a function called myConnection colorBackground and passes as parameters the Selected Color:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" 
      minWidth="500" minHeight="300"
      applicationComplete="applicationCompleteHandler(event)" viewSourceURL="srcview/index.html">
 
 <fx:Script>
  <![CDATA[
   import mx.collections.ArrayCollection;
   import mx.controls.Alert;
   import mx.events.ColorPickerEvent;
   import mx.events.FlexEvent;
   
   private const connection:LocalConnection = new LocalConnection();
[Bindable] private var   data:ArrayCollection = new ArrayCollection();
   protected function applicationCompleteHandler(event:FlexEvent):void
   {
    // TODO Auto-generated method stub
    data.addItem("Application Complete Handler");
    connection.addEventListener(StatusEvent.STATUS, connectionStatusHandler);
    data.addItem("Add Listener Status to the Connection");
   }
   
   private function connectionStatusHandler(event:StatusEvent):void
   {
    data.addItem("Connection Status Handler");
    switch (event.level)
    {
     case "status":
      trace("Use of LocalConnection.send() succeeded");
      break;
     case "error":
      Alert.show(
       "The LocalConnection.send() call failed: "
       + event.code + "\n"
       + event.toString() );
      break;
    }
    data.addItem("Status -> "+ event.level );
   }
   
   protected function sendColorHandler(event:ColorPickerEvent):void
   {
    // TODO Auto-generated method stub
    data.addItem("Send Color Handler");
    connection.send("myConnection", "colorBackground", event.color);
    data.addItem("Color Sending in UInt -> " + event.color);
   }
  ]]>
 </fx:Script>
 
 <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
 <s:VGroup x="0" y="0" 
     width="100%" height="100%" 
     paddingLeft="20" paddingRight="20" paddingTop="20" paddingBottom="20" 
     horizontalAlign="center">
  <mx:ColorPicker change="sendColorHandler(event)"/>
  <s:Panel width="100%" height="100%" 
     title="Console">
   <s:List id="console" 
     x="0" y="0" 
     width="100%" height="100%"
     dataProvider="{data}"></s:List>
  </s:Panel>
 </s:VGroup>
</s:Application>

Los archivos pueden Descargarlos arriba de cada ejemplo.

The files can be downloaded above each example.

Ejemplo Uno - Recive el mensaje:

Example One - The message receiver:

Ver y Descargar Archivo del App 1:

• Archivos - Descargar.
  

View Source and Download Files of the App 1:

• Download Source.
  

Ejemplo Dos - Envia el Mensaje:

Example Two - Sends the Message:

Ver y Descargar Archivo del App 2:

• Archivos - Descargar.
  

View Source and Download Files of the App 2:

• Download Source.
  

Cryptography in Flex - Encriptar en Flex - Flex 4

Translation:

• Spanish
• English

Siempre necesitamos usar algún tipo de seguridad, para garantizar a nuestros clientes finales, la seguridad, valga la redundancia, de sus datos. Es por eso que cada ves que vamos a usar un Login o algún texto que necesite de algún tipo de Ofuscamiento, recurrimos a los que son algoritmos de Encriptación.

Flex tiene una librería para encriptar de forma muy sencilla y brinda varios algoritmos, logrando así nuestro objetivo, asegurarnos que nadie tenga la clave o texto de viaje por la red y pueda leerlo o al menos leerlo de forma inmediata.

Aquí les dejo el link para que se bajen la librería para ActionScript, as3corelib Link.

Y aquí le dejos solo la clase donde se ve mejor la implementación, de igual forma al final del texto están todas las clases y archivos del ejemplo, para verlos o descargarlos.

We always need to use some type of security to ensure our end, safety, despite the redundancy of your data. That's why every time we use a login or some text that needs some kind of obfuscation, we turn to those who are encryption algorithms.

Flex is a library for a simple way to encrypt and provides several algorithms, thus achieving our goal, to make sure that no one has the key or text traveling through the network and can read or at least read it immediately.

Here is the link to get off the library for ActionScript, as3corelib Link .

I will leave the most important class, so you can see who is implemented and you can see all the classes and download them at the end of this post.

package com.developyourdream.vo
{
 import com.adobe.crypto.MD5;
 import com.adobe.crypto.SHA1;
 import com.adobe.crypto.SHA224;
 import com.adobe.crypto.SHA256;
 import com.adobe.crypto.WSSEUsernameToken;
 import flash.utils.ByteArray;
[Bindable]
 public class LoginVO
 {
  public function LoginVO()
  {
  }
  private var _username:String;
  private var _password:String;
  private var _cryptoDetail:PasswordVO;
  private var _passwordByteArray:ByteArray;
  
  public function get username():String{
   return _username;
  }
  public function set username(value:String):void{
   _username = value;
  }
  public function get cryptoDetail():PasswordVO{
   return _cryptoDetail;
  }
  public function get password():String{
   return _password;
  }
  public function set password(value:String):void{
   _password = value;
   
   _cryptoDetail = new PasswordVO;
   
   _passwordByteArray = byteArrayTrasform(value);
   
   _cryptoDetail.originalByteArrayPassword = byteArrayToString(_passwordByteArray);
   
   _cryptoDetail.md5   = MD5.hash(_password);
   
   _cryptoDetail.sha1   = SHA1.hash(_password); 
   _cryptoDetail.sha1_base64 = SHA1.hashToBase64(_password); 
   _cryptoDetail.sha1_Bytes = SHA1.hashBytes(_passwordByteArray);
   
   _cryptoDetail.sha224  = SHA224.hash(_password); 
   _cryptoDetail.sha224_base64 = SHA224.hashToBase64(_password); 
   _cryptoDetail.sha224_Bytes = SHA224.hashBytes(_passwordByteArray);
   
   _cryptoDetail.sha256  = SHA256.hash(_password); 
   _cryptoDetail.sha256_base64 = SHA256.hashToBase64(_password); 
   _cryptoDetail.sha256_Bytes = SHA256.hashBytes(_passwordByteArray);
   
   _cryptoDetail.token = WSSEUsernameToken.getUsernameToken(_username,_password);
   
  }
  /*OTHER FUNCTIONS*/
  private function byteArrayTrasform(value:String):ByteArray
  {
   var _auxByteArray:ByteArray;
   _auxByteArray = new ByteArray();
   _auxByteArray.writeMultiByte(value,"utf-8");
   return _auxByteArray;
  }
  private function byteArrayToString(byteArray:ByteArray):String
  {
   byteArray.position = 0;
   var str:String = "";
   while(byteArray.position != byteArray.length - 1)
   {
    str += byteArray.readByte().toString(16).toUpperCase()+" ";
   }
   return str;
  } 
 }
}

Ejemplo:

Example:

Ver y Descargar Archivo:

• Archivos - Descargar.
  

View Source and Download Files:

• Download Source.
  

Google Maps HighLighting - (Country - Region - State - City ) - Flex 3

OBSERVACION: solo sirve en el GOOGLE MAPS 1.09

Zoom Levels:

• Default Zoom: Country.
• Zoom 1 and 2 : Region.
• Zoom 3 and 4 : States.
• Zoom 5 to last : City's.

Default View

Select Country

Drag Country

Region View

Select Region

State View

Select State

Drag State

City View

Select City

Testing Flash Builder 4 Beta 2 - Flex 4

Translation:

• Spanish
• English

Bueno ya tenemos nuestra licencia de Flash Builder 4 Beta 2, ahora vamos a ver que de nuevo nos trae Adobe. Ahora tenemos todo un nuevo Name Space llamado Spark, vamos a ver en este ejemplo como se ven.

Para ver el código, hagan click derecho sobre la aplicación y luego a View Source.

Well we have our license Flash Builder 4 Beta 2, now let's see that again brings us Adobe. We now have a new Name Space called Spark, we'll see in this example how they look.

To view the code, please click right on the application and then View Source.