Cristalab estará en la Campus Party Colombia 2009! Wooh!

Quiero ser parte y estar con Cristalab en la Campus ¿Cómo hago parte?

Special Internet Service Announcement

LOLCats y los Accelerators

Desorden obsesivo compulsivo y Web Slices

Microsoft odia IE6 y muestra la velocidad de IE8

Modo porno y... (no lo vean en la oficina)

• Descargar ADM

Mejorando la web en Español

Pronto, consejos y criticas a tus sitios web en vivo

Código :

private var _url:String = "http://www.cristalab.com";
private var _width:Number= 400;
private var _height:Number= 300;
private var _title:String = "title";
private var _resize:String = "yes";
private var _window:String = "_blank";

Código :

public function openWindow(newUrl:String = null):void{
   if(newUrl)
      this.url = newUrl;
   var _urlRequest:URLRequest=new URLRequest();
   _urlRequest.url="javascript:window.open('"+url+"','"+title+"','width="+width+",height="+height+", resizable="+resize+"');newWindow.focus(); void(0);";
   navigateToURL(_urlRequest,_window);
}

Código :

package com.cristalab.utils
{
   import flash.net.URLRequest;
   import flash.net.navigateToURL;
   
   public class PopUp
   {
      
      private var _url:String = "http://www.cristalab.com";
      private var _width:Number= 400;
      private var _height:Number= 300;
      private var _title:String = "title";
      private var _resize:String = "yes";
      private var _window:String = "_blank";
      
      public function PopUp()
      {
      }
      
      public function openWindow(newUrl:String = null):void{
         if(newUrl)
            this.url = newUrl;
         var _urlRequest:URLRequest=new URLRequest();
         _urlRequest.url="javascript:window.open('"+url+"','"+title+"','width="+width+",height="+height+", resizable="+resize+"');newWindow.focus(); void(0);";
         navigateToURL(_urlRequest,_window);
      }


      public function set url(val:String):void
      {
         _url = val;
      }

      public function get url():String
      {
         return _url;
      }

      public function set width(val:Number):void
      {
         _width = val;
      }

      public function get width():Number
      {
         return _width;
      }

      public function set height(val:Number):void
      {
         _height = val;
      }

      public function get height():Number
      {
         return _height;
      }

      public function set title(val:String):void
      {
         _title = val;
      }

      public function get title():String
      {
         return _title;
      }

      public function set resize(val:String):void
      {
         _resize = val;
      }

      public function get resize():String
      {
         return _resize;
      }

      public function set window(val:String):void
      {
         _window = val;
      }

      public function get window():String
      {
         return _window;
      }
   }
}

Código :

import com.cristalab.utils.PopUp;

var t:PopUp = new PopUp();


btn1.addEventListener(MouseEvent.CLICK, popUpNormal);
btn2.addEventListener(MouseEvent.CLICK, popUpEditado);

function popUpNormal(e:MouseEvent):void {
   var ir:String;
   ir="http://www.cristalab.com/tutoriales/";
   t.openWindow(ir);
}

function popUpEditado(e:MouseEvent):void {
   t.url="http://www.google.com";
   t.title="Estamos en Google";
   t.width=640;
   t.height=480;
   t.resize="yes";
   t.window="_self";
   t.openWindow();
}

HTC Hero

Flash Lite ahora, Flash Player 10 luego

Otros detalles

<application/>

Código :

<application xmlns="http://ns.adobe.com/air/application/1.0">

<id/>

Código :

<id>com.zguillez.cristalab.demos.demoApp1</id>

<filename/>

Código :

<filename>demoApp1</filename>

<name/>

Código :

<name>demoApp1</name>

<version/>

Código :

<version>1.0</version>

<description/>

Código :

<description>Aplicación AIR de pruebas</description>

<copyright/>

Código :

<copyright>Copyright 2008 Zguillez</copyright>

Código :

<initialWindow/>

<content/>

Código :

* <content>demoApp1.swf</content>

<title/>

Código :

<title>demoApp1</title>

<systemChrome/>

Código :

<systemChrome>none</systemChrome>

<transparent/>

Código :

<transparent>true</transparent>

<visible/>

Código :

<visible>false</visible>

<minimizable/> <maximizable/> <resaizable/>

Código :

<minimizable>true</minimizable>
<maximizable>true</maximizable>
<resizable>false</resizable>

<width/> <height/>

Código :

<width>800</width>
<height>600</height>

<x/> <y/>

Código :

<x>0</x>
<y>0</y>

<minSize/> <maxSize/>

Código :

<minSize>400 300</minSize>
<maxSize>1600 1200</maxSize>

<installFolder/>

<programMenuFolder/>

Código :

<programMenuFolder>Aplicaciones Cristalab</programMenuFolder>

<icon/>

Código :

<image16x16>icon16.png</image16x16>
<image32x32>icon32.png</image32x32>
<image48x48>icon48.png</image48x48>
<image128x128>icon128.png</image128x128>

<customUpdateUI/>

Código :

<customUpdateUI>true</customUpdateUI>

<allowBrowserInvocation/>

Código :

<allowBrowserInvocation>true</allowBrowserInvocation>

<fileTypes/>

Código :

<fileTypes>
  <fileType>
<name>Cristalab</name>
<extension>.clab</extension>
<description>Archivo Cristalab</description>
<contentType>text</contentType>
<icon>
  <image16x16>ico16.png</image16x16>
  <image32x32>ico32.png</image32x32>
  <image48x48>ico48.png</image48x48>
  <image128x128>ico128.png</image128x128>
</icon>
  </fileType>
</fileTypes>

Procura hacer un cuestionario corto y preciso, que te permita luego crear un brief

Ten al menos una reunión con tu cliente para hablar sobre el proyecto

Prepara un contrato y no comiences el trabajo hasta tener la aceptación del mismo, por escrito, de parte del cliente

Comienza siempre con un mockup

Ten siempre presente la posibilidad de que el cliente retrase el trabajo.

1. Colocar tiempos de revisión -normalmente de una semana- por parte del cliente, advirtiéndole que cada día de retraso implicará un cambio en la fecha de entrega y/o un recargo (de un 1%, máximo) en el precio final. Si quieres que se apure, tócale los bolsillos.
   
2. Preveer estos retrasos, dándole más tiempo a los lapsos de entrega de material o revisiones. Esta no es la mejor solución, pero si conoces más o menos a tu cliente, puede funcionar.

Piensa en el usuario final, que tu sitio sea usable y accesible

Se un profesional o no te vendas como tal

Estudia, lee, aprende

Código :

Polar:
[
   (1 + 0.9 * cos(8 * i)) * (1 + 0.1 * cos(24 * i)) * (0.9 + 0.05 * cos(200 * i)) * (1+sin(i)),
   {-π → π}
];

Código :

// Primero declaramos el Sprite donde dibujar
var graph:Sprite = new Sprite();
graph.graphics.beginFill(0xC0C0B4);
graph.graphics.drawCircle(0, 0, 5);
graphics.lineStyle(1, 0xC0C0B4, 1);
graph.visible = false;
addChild(graph);
// Estas variables las necesitaremos para trazar coordenadas en 
// el plano polar, y deshacernos del convencional plano cartesiano
// que esta por defecto en Flash 
var a:Number = -10*Math.PI;
var theta:Number = -Math.PI;
var r:Number = 0;
// Función encargada que colocar el punto en el sitio indicado
function polar(sprite:Sprite):void
{
   sprite.x = 10 * r * Math.cos(theta) + r;
   sprite.y = 10 * r * Math.sin(theta) + r;
}
// Una vez que tenemos todo listo, comenzamos a dibujar
addEventListener(Event.ENTER_FRAME, listener);
function listener(event:Event):void
{
   switch(event.type)
   {
      // Recuperamos el evento ENTER_FRAME para comenzar a trabajar
      case Event.ENTER_FRAME:
         if(a < 0)
         {
            a += 0.01;
            r = 10*(1+.9*Math.cos(8*a))*(1+.1*Math.cos(24*a))*(.9+.05*Math.cos(200*a))*(1+Math.sin(a));
            graphics.lineTo(graph.x , graph.y);
         } else {
            // Removemos el evento ENTER_FRAME una vez que hemos terminado
            removeEventListener(Event.ENTER_FRAME, listener);
            graph.visible = false;
            return;
         }
         // Mientras la ecuación anterior trabaja, debemos desplazar poco a poco el angulo
         polar(graph);
         theta += 0.01;
      break;
   }
}

Requerimientos

• Conocimiento básico de Javascript
  
• Sentido Común
  
• Una pizca de concentración

¿Cómo hacerlo?

Problema

1. Tenemos una fecha y no sabemos el numero de semana del año al que pertenece.

Sabemos

1. Sabemos que el año tiene 52 semana.
   
2. Que la semana empieza el Lunes.
   
3. Que el año empieza el 1 de Enero.
   
4. Que si el 1 de Enero no es Lunes entonces pertenece a la semana 52 del año anterior.
   
5. Que a cada fecha le corresponde una marca de tiempo.
   
6. Que las marcas de tiempo se operar matemáticamente ( + , - , * , / ).

Podemos

1. Obtener la marca de tiempo del 1 de Enero del mismo año de la fecha en cuestión.
   
2. Obtener la marca de tiempo de la fecha en cuestión.
   
3. Compensar ambas fechas en caso que el 1 de Enero no sea Lunes.
   
4. Restar ambas marcas de tiempo para obtener una nueva que represente al tiempo transcurrida entre ambas.
   
5. Dividir esa marca de tiempo hasta obtener la unidad de tiempo deseada.

El Código

Código :

// A esta funcion se le pasa el parametro en formato fecha
// dd/mm/yyyy o dd-mm-yyyy ambos son aceptados

function semanadelano($fecha){
  $const  =  [2,1,7,6,5,4,3]; 
  // Constantes para el calculo del primer dia de la primera semana del año
   
  if ($fecha.match(/\//)){
    $fecha   =  $fecha.replace(/\//g,"-",$fecha);
  };
  // Con lo anterior permitimos que la fecha pasada a la funcion este
  // separada por "/" al remplazarlas por "-" mediante .replace y el uso
  // de expresiones regulares
      
  $fecha  =  $fecha.split("-");
  // Partimos la fecha en trozos para obtener dia, mes y año por separado
  $dia    =  eval($fecha[0]);
  $mes    =  eval($fecha[1]);
  $ano       =  eval($fecha[2]);   
  if ($mes!=0) {
    $mes--;
  };
  // Convertimos el mes a formato javascript 0=enero
  
  $dia_pri   =  new Date($ano,0,1); 
  $dia_pri   =  $dia_pri.getDay();
  // Obtenemos el dia de la semana del 1 de enero
  $dia_pri   =  eval($const[$dia_pri]);
  // Obtenemos el valor de la constante correspondiente al día
  $tiempo0   =  new Date($ano,0,$dia_pri);
  // Establecemos la fecha del primer dia de la semana del año
  $dia       =  ($dia+$dia_pri);
  // Sumamos el valor de la constante a la fecha ingresada para mantener 
  // los lapsos de tiempo
  $tiempo1   =  new Date($ano,$mes,$dia);
  // Obtenemos la fecha con la que operaremos
  $lapso     =  ($tiempo1 - $tiempo0)
  // Restamos ambas fechas y obtenemos una marca de tiempo
  $semanas   =  Math.floor($lapso/1000/60/60/24/7);
  // Dividimos la marca de tiempo para obtener el numero de semanas
   
  if ($dia_pri == 1) {
    $semanas++;
  };
  // Si el 1 de enero es lunes le sumamos 1 a la semana caso contrarios el
  // calculo nos daria 0 y nos presentaria la semana como semana 52 del 
  // año anterior
   
  if ($semanas == 0) {
    $semanas=52;
    $ano--;
  };
  // Establecemos que si el resultado de semanas es 0 lo cambie a 52 y 
  // reste 1 al año esto funciona para todos los años en donde el 1 de 
  // Enero no es Lunes
   
  if ($ano < 10) {
    $ano = '0'+$ano;
  };
  // Por pura estetica establecemos que si el año es menor de 10, aumente 
  // un 0 por delante, esto para aquellos que ingresen formato de fecha
  // corto dd/mm/yy
   
  alert($semanas+" - "+$ano);
  // Con esta sentencia arrojamos el resultado. Esta ultima linea puede ser
  // cambiada a gusto y conveniencia del lector 
};

El renacimiento del software móvil

El cambio, las nuevas tribus los turistas perdidos

La muerte, irrelevancia y resurrección de Flash

El futuro de Internet

3. El Destino

1. Crear y configurar la aplicación en Facebook.
   
2. Subir archivos al servidor, configurar, programar y probar.
   

Paso 1: Crear y configurar la aplicación en Facebook

Basic:

• Application ID: es el identificador único de nuestra aplicación.
  
• API KEY: llave privada para acceso al API.
  
• Secret: códido secreto de nuestra aplicación.
  

Autenticaction:

Canvas:

Paso 2: Subir archivos al servidor, configurar, programar y probar.

Código :

<?php
/**
* @Archivo que contiene los parametros de configuración "facebook_config.php"
* @versión: 1.0
* @autor: Psycho
*/

require_once 'facebook-platform/php/facebook.php';

// codigo(KEY) que identifica a nuestra aplicación y es utilizadas en cada llamada a Facebook
$appapikey = 'Coloca tu API Key aquí';

// llave privada para autenticar la aplicación en el servidor de Facebook
$appsecret = 'Coloca tu Application Secret aquí';

// Crear una instancia del objeto Facebook
$facebook = new Facebook($appapikey, $appsecret);

// Obtener el id del usuario que este utilizando la aplicación
$id_usuario = $facebook->require_login();
?>

Código :

<?php
/**
* @Archivo que imprime Hello Wold al usuario que utiliza la aplicación "index.php"
* @versión: 1.0
* @autor: Psycho
*/

// Llamar el archivo que contiene los parametros de configuración y obtine el id del usuario
require_once 'includes/facebook_config.php';
?>

Hello World <fb:name uid="<?php echo $id_usuario; ?>" useyou="false" />

Fichero gallery.php

Código :

<?
class gallery {
   var $files = array();
   var $path;
   
   function loadFolder($path){
      $this->path = $path;
      
      //---Guardar en un arreglo todos los archivos en el directorio   
      $folder = opendir($this->path);
         
      while ($fil = readdir($folder)) {
         
         //---Si no es un directorio
         if(!is_dir($fil)){
            
            $arr = explode('.', $fil);
            if(count($arr) > 1){
               
               //---Ir guardando los nombres en un arreglo
               $this->files[] = $fil;
            }
         }
      }
      
      //---Cerrar el directorio
      closedir($folder);
      
      //---Ordenar alfabeticamente el arreglo
      sort($this->files);
   }

   function show($area = 500, $width = 100, $space = 10){
   
      //---Crear la galería con los nombres de todos los archivos
      $total = count($this->files);
      $cont = 0;
      
      echo '<div name="xx" style="width:'.$area.'px">';
      
         //---Situar los thumbnails
         for($i = 0; $i < $total; $i++){      
            echo '<div style="width:'.$width.'px; float:left; padding-right:'.$space.'px; padding-bottom:'.$space.'px;"><a href="'.$this->path.'/'.$this->files[$i].'" rel="lightbox"><img src="show_thumb.php?src='.$this->path.'/'.$this->files[$i].'&width='.$width.'" width="'.$width.'" height="'.$width.'" border="0"></img></a></div>';
         }
?>        
                <script language="javascript">
                $(document).ready(function(){
                   $("a[rel = 'lightbox']").lightBox();
                });
                </script>        
<?
      echo '</div>';
   }
}
?>

Código :

// Referencia de la carpeta de donde se van a leer las imágenes
loadFolder($path:string)

// Muestra los thumbnails (con un ancho de $width) de todas las imágenes contenidas en la carpeta
// separados por una distancia $space en un área de ancho $area
show($area:int, $width:int, $space:int) 

Código :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP Gallery Example</title>

<link href="css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />

<script src="scripts/jquery-1.3.2.js" language="javascript"></script>
<script src="scripts/jquery.lightbox-0.5.js" language="javascript"></script>

</head>

<body>

   <div align="center">    
<?      
      // Incluir la clase   
      include_once('gallery.php');
      
      $mygallery = new gallery(); // Crear una nueva instancia
      $mygallery->loadFolder('galley_images'); // Leer las imágenes de la carpeta "galley_images"
      $mygallery->show(500, 100, 10); // Mostrar la galería en este lugar en un area de 500px      
?>    
    </div>

</body>
</html>

Código :

import com.facebook.commands.profile.SetFBML;
import com.facebook.commands.users.HasAppPermission;
import com.facebook.commands.users.GetInfo;
import com.facebook.data.users.GetInfoData;
import com.facebook.data.BooleanResultData;
import com.facebook.data.auth.ExtendedPermissionValues;
import com.facebook.data.users.HasAppPermissionValues;
import com.facebook.data.users.GetInfoFieldValues;
import com.facebook.data.users.FacebookUser;
import com.facebook.errors.FacebookError;
import com.facebook.events.FacebookEvent;
import com.facebook.net.FacebookCall;
import com.facebook.Facebook;
import com.facebook.session.WebSession;
import com.facebook.utils.FacebookSessionUtil

Código :

var flashVarsParams:Object = loaderInfo.parameters;

var fbSessionUtil:FacebookSessionUtil = new FacebookSessionUtil("*ApyKey", null, loaderInfo);
fbSessionUtil.addEventListener(FacebookEvent.CONNECT, onFacebookConnect, false, 0, true);
var fb:Facebook = fbSessionUtil.facebook;
var user:FacebookUser;

Código :

function isAppAllowed(SessionKey:String):void {
   if (SessionKey != null) {
      fbSessionUtil.verifySession();
   } else {
      shown.text="Facebook nesesita validad al usuario.";
   }
}
isAppAllowed(flashVarsParams.fb_sig_session_key);

function onFacebookConnect(e:FacebookEvent):void { 
   if (e.success){
      setApplicationFBML();
   } else {
      shown.text="Error, No se puede conectar a Facebook.";
   }
}

function setApplicationFBML():void{
   var call:FacebookCall=fb.post(new GetInfo([fb.uid],[GetInfoFieldValues.ALL_VALUES]));
   call.addEventListener(FacebookEvent.COMPLETE,onGetInfo);
}

function onGetInfo(e:FacebookEvent):void{
   user=(e.data as GetInfoData).userCollection.getItemAt(0) as FacebookUser;
   trace("Hello "+user.first_name+" "+user.last_name);
}

Mejorando la web en español

Mandanos tus proyectos

• Wordpress
  
• APIs de Google (Google Maps, Youtube, charts, etc)
  
• Software de Google (AppEngine)
  
• Flash o Flex
  
• UStream

Fichero thumb.php

Código :

<?php
class thumb {

var $image;
var $type;
var $width;
var $height;

//---Método de leer la imagen
function loadImage($name) {

//---Tomar las dimensiones de la imagen
$info = getimagesize($name);

$this->width = $info[0];
$this->height = $info[1];
$this->type = $info[2];

//---Dependiendo del tipo de imagen crear una nueva imagen
switch($this->type){
case IMAGETYPE_JPEG:
$this->image = imagecreatefromjpeg($name);
break;
case IMAGETYPE_GIF:
$this->image = imagecreatefromgif($name);
break;
case IMAGETYPE_PNG:
$this->image = imagecreatefrompng($name);
break;
}
}

//---Método de guardar la imagen
function save($name, $quality = 100) {

//---Guardar la imagen en el tipo de archivo correcto
switch($this->type){
case IMAGETYPE_JPEG:
imagejpeg($this->image, $name, $quality);
break;
case IMAGETYPE_GIF:
imagegif($this->image, $name);
break;
case IMAGETYPE_PNG:
$pngquality = floor(($quality - 10) / 10);
imagepng($this->image, $name, $pngquality);
break;
}
}

//---Método de mostrar la imagen sin salvarla
function show() {

//---Mostrar la imagen dependiendo del tipo de archivo
switch($this->type){
case IMAGETYPE_JPEG:
imagejpeg($this->image);
break;
case IMAGETYPE_GIF:
imagegif($this->image);
break;
case IMAGETYPE_PNG:
imagepng($this->image);
break;
}
}

//---Método de redimensionar la imagen sin deformarla
function resize($value, $prop){

//---Determinar la propiedad a redimensionar y la propiedad opuesta
$prop_value = ($prop == 'width') ? $this->width : $this->height;
$prop_versus = ($prop == 'width') ? $this->height : $this->width;

//---Determinar el valor opuesto a la propiedad a redimensionar
$pcent = $value / $prop_value;
$value_versus = $prop_versus * $pcent;

//---Crear la imagen dependiendo de la propiedad a variar
$image = ($prop == 'width') ? imagecreatetruecolor($value, $value_versus) : imagecreatetruecolor($value_versus, $value);

//---Hacer una copia de la imagen dependiendo de la propiedad a variar
switch($prop){

case 'width':
imagecopyresampled($image, $this->image, 0, 0, 0, 0, $value, $value_versus, $this->width, $this->height);
break;

case 'height':
imagecopyresampled($image, $this->image, 0, 0, 0, 0, $value_versus, $value, $this->width, $this->height);
break;

}

//---Actualizar la imagen y sus dimensiones
$info = getimagesize($name);

$this->width = imagesx($image);
$this->height = imagesy($image);
$this->image = $image;

}

//---Método de extraer una sección de la imagen sin deformarla
function crop($cwidth, $cheight, $pos = 'center') {

//---Dependiendo del tamaño deseado redimensionar primero la imagen a uno de los valores
if($cwidth > $cheight){
$this->resize($cwidth, 'width');
}else{
$this->resize($cheight, 'height');
}

//---Crear la imagen tomando la porción del centro de la imagen redimensionada con las dimensiones deseadas
$image = imagecreatetruecolor($cwidth, $cheight);

switch($pos){

case 'center':
imagecopyresampled($image, $this->image, 0, 0, abs(($this->width - $cwidth) / 2), abs(($this->height - $cheight) / 2), $cwidth, $cheight, $cwidth, $cheight);
break;

case 'left':
imagecopyresampled($image, $this->image, 0, 0, 0, abs(($this->height - $cheight) / 2), $cwidth, $cheight, $cwidth, $cheight);
break;

case 'right':
imagecopyresampled($image, $this->image, 0, 0, $this->width - $cwidth, abs(($this->height - $cheight) / 2), $cwidth, $cheight, $cwidth, $cheight);
break;

case 'top':
imagecopyresampled($image, $this->image, 0, 0, abs(($this->width - $cwidth) / 2), 0, $cwidth, $cheight, $cwidth, $cheight);
break;

case 'bottom':
imagecopyresampled($image, $this->image, 0, 0, abs(($this->width - $cwidth) / 2), $this->height - $cheight, $cwidth, $cheight, $cwidth, $cheight);
break;

}

$this->image = $image;
}

}
?>

Código :

// Lee la imagen desde la ruta especificada
loadImage($name:string)

// Guarda la imagen en la ruta especificada y con una calidad de 0 a 100 definida por el usuario (máxima calidad por defecto)
save($name:string, $quality:int = 100)

// Muestra la imagen en la página sin guardarla previamente
show()

// Redimensiona la imagen en ancho o alto manteniendo sus proporciones
// $prop puede tomar los valores de "width" o "height"
resize($value:int, $prop:string)

// Crea un thumbnail de la imagen con las medidas especificadas y manteniendo las proporciones visuales de la imagen intactas
// $pos puede tomar los valores de "left", "top", "right", "bottom" o "center"
crop($cwidth:int, $cheight:int, $pos:string)

fichero image_width_100.php

Código :

<?
include_once('thumb.php');
$mythumb = new thumb();
$mythumb->loadImage('http://img43.imageshack.us/img43/3022/finalfantasyn.jpg');
$mythumb->resize(100, 'width');
$mythumb->show();
?>

Código :

echo '<img src="image_width_100.php"/>';

Código :

<?
include_once('thumb.php');
$mythumb = new thumb();
$mythumb->loadImage('http://img43.imageshack.us/img43/3022/finalfantasyn.jpg');
// Como el rostro del personaje está a la derecha le especifico el parámetro $pos en "right"
// Si este valor es obviado el crop se hará del centro de la imagen
$mythumb->crop(100, 100, 'right');
$mythumb->show();
?>

Código :

<?php

$arreglo = array();

if (!empty($arreglo))
{
 // si no está vacío
}

if (count($array)>0)
{
 // si no está vacío
}

?>