Y aquí fue donde se presentaron los contratiempos: Mostrar los datos en un Datagrid puede parecer algo sumamente sencillo. Pero, en mi caso, al ser tanta la cantidad de columnas que debía mostrar, si quería lograr algunos detalles como por ejemplo 1 tooltip, (o seleccionar el ultimo registro con otro color), se tornaba algo bastante inflexible.

El Datagrid nativo de Flash sinceramente me hizo perder bastante tiempo y no logre hacer nada de lo que quería. “Llenar el datagrid fue fácil, el resto imposible :p”. Supuse que alguien tenia que haber armado algo en la red. Pero no encontre nada.

Aqui va el datagrid creado.

Es bastante mas liviano pero a la hora de configurarlo, (al no ser un componente), hay que modificar mucho codigo.

A Futuro: Le falta pulir muchas cosas: Scroll vertical y horizontal y/o paginacion. Y armarlo como componente.

Creo que el uso es bastante puntual. Pero seguramente mas de uno ha perdido tiempo. Enjoy!.

Descarga de archivos

___________________

nicolas Tech-nico.com/blog

El funcionamiento es sencillo pero poco robusto

El sistema de comentarios se basa en 1 solo archivo PHP llamado guestBook.php que se conecta a la base de datos e interactua con flash como gateway para postear comentarios o leerlos.

Tiene filtro de malas palabras, y para el que quiere también puede habilitar las lineas para envié por mail un aviso en caso de que haya comentarios nuevos.

Con respecto a la base de datos:  Esta hecho para mysql, y consiste de tan solo una sola tablita.

CREATE TABLE `fotolog` (
`id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`name` CHAR( 200 ) NOT NULL ,
`nombrefoto` CHAR( 200 ) NOT NULL ,
`email` VARCHAR( 200 ) NULL ,
`comments` LONGTEXT NULL ,
`time` TIME NULL
) ENGINE = innodb COMMENT = ‘comentarios galery comment’;

El funcionamiento es sencillo pero poco robusto

Como las fotos no están en la base de datos; tome en cuenta el nombre de la foto como ID, por lo tanto hay que tener mucho cuidado con los nombres de fotos duplicadas.
Ademas, como no hay ningún Admin para administrar la galería o comentarios, si eliminamos una foto por FTP, el comentario “no se elimina”, entonces van quedan registros perdidos en la tabla de la base de datos.
Con una galeria que no tenga demaciado movimiento no va a haber problema (como fue en mi caso), pero si hay mucho trafico de fotos que se suben y se eliminan podria aparecer comentarios huerfanos.

Configuracion:

Abrir archivo guestBook.php y modificar las lineas siguientes por las de tu base de datos.

$DBhost = “localhost”;   // servidor
$DBuser = “root”;            // usuario
$DBpass = “”;            // clave
$DBName = “fotolog”;            // nombre base de datos
$table = “fotolog”;             // nombre tabla base de datos
$numComments = 5;       // cantidad de comentarios por pagina.

To DO // Para hacer

• Lo ideal seria armar un mini admin que muestre las fotos y te permita eliminar la foto con el comentario relacionado.
• Agregando un campito mas de “activate” podriamos mostrar los comentarios que solo esten aprobados.
• Modificar BadWords desde el admin.
• Agregar filtros de metacaracteres para evitar el sql injection.

Descargar Fla Modificado y guestBook.php

________________
tech-nico.com/blog

Lo particularmente bueno de esta galería es que levanta las fotos on the fly desde carpetas del servidor que creemos o ya estén creadas. Entonces el cliente mismo puede generar galerías de fotos simplemente creando carpetas por FTP y haciendo copy paste de las imágenes que desea subir. Algo muy practico y sencillo para los clientes no entendidos.
Mi propósito principal fue evitar que alguien tenga que editar un FLA… o un XML o mas engorroso aun tener que armar un admin con upload para el manejo de la galería.

Características de la galería:

• Usa Flash para precarga de fotos.
• Lee varias carpetas de fotos.
• Paginación de fotos (20 x página).
• Librería GD de php para generar los thumbs con cacheo para agilizar la carga.
• No usa base de datos ni XML.
• Fácil configuración y mantenimiento.

Dentro de la carpeta “galery” debe haber 5 archivos y 1 carpeta llamada “images”. Se recomienda no cambiar el nombre de la carpeta. (De lo contrario la galería no funciona).

galery_tech_nico.fla
Archivo editable de Flash contenedor de la galería de fotos.

galery_tech_nico.swf
Este archivo es la galería de fotos compilada y lista para embeber en tu web.

folderImages.php
Recibe como parámetro un string (“nombre de carpeta”) y recorre en el servidor las imágenes que esta contenga. Finalmente devuelve sus rutas a flash.

folders.php
Recorre todo el directorio “images” y devuelve a flash los nombres, rutas, tamaño de cada una de las fotos y además la cantidad de fotos por directorio.

thumb.php
Recibe varios parámetros como alto, ancho, etc. y devuelve la imagen resampleada para generar los thumbnail de la galería.

INSTALACION:
1) Editar archivo galery_tech_nico.fla.
Escribe el nombre de tu dominio

2) Editar folderImages.php y folders.php.

Esta versión también tenia para postear comentarios en las fotos. Pero esa parte usa una base de datos MySQL así que verán que en el archivo de flash esta comentado. (Si alguien los necesita subo los archivos.).
Se que tiene muchas cosas por mejorar, pero ya cumplió su ciclo .

GALERIA CON COMENTARIOS:
http://www.tech-nico.com/blog/galeria-de-fotos-flash-con-comentarios-php/

descargar galery

Nicolas
______________________
www.tech-nico.com/blog

Vamos a aclarar que salio una version de “WordPress Audio Player“ version standalone. Por lo tanto podemos customizarla y usarla en cualquiera de nuestros sitios webs (aunque no tengan WP instalado).

Entonces hasta aca tenemos:
- Funcion JS para embeber objetos flash con DOM de 11 Kb.
- Reproductor de audio WordPress Audio Player (Standalone)
- Y una funcion para incluir Objetos Flash (mas especificamente Videos Youtube)

Aqui abajo les muestro como implementarlo:

<!– HEADER –>
<script src=”player/player.js” type=”text/javascript”></script>

<script type=”text/javascript”>  
 // VIDEO DE YOUTUBE
 function show_video(element_descripcion, video_objeto, video_descripcion){
     var div_element_descrip = document.getElementById(element_descripcion); 
     audioplayer_swfobject.embedSWF(video_objeto, “main_video”, “295″, “237″, “9.0.0″);
     div_element_descrip.innerHTML = video_descripcion;
 }

 // WP_STANDALONE_PLAYER ( la siguiente linea, invoca el audioPlayer )
        AudioPlayer.setup(“http://<?php echo $tudominio; ?>/player/player.swf”, {  
                width: 290  
        });   
</script>

 Son 2 funciones totalmente distintas; la primera, show_video( ), es la que usaremos para embeber video.  Y AudioPlayer.setup( ), es la que invoca al reproductor de audio. Lo que tienen en comun, es que ambas funciones utilizan el mismo Include player.js con el que embeben los tags usando DOM.

En el Body:

<!– BODY –>
 <!– audio player –>
<p id=”audioplayer_1″>Alternative content</p>  
<script type=”text/javascript”> 
                 AudioPlayer.embed(“audioplayer_1″, {soundFile: “http://<?php echo $tudominio;?>/<?php echo $ruta_de_tu_audio .’/’. $nombre_archivo; ?>”,transparentpagebg: “yes”,titles: “descripcion del audio”});   
</script>                                   

 <!– video player –>
<script type=”text/javascript”> 
          show_video(‘video_descripcion’, ’http://www.youtube.com/v/codigovideo’,  ‘la descripcion del video desde la base de datos’);
</script>
 <div id=”main_video”></div>
 <div id=”video_descripcion”></div> 

Multiples Instancias:

Los contenedores para cada reproductor son los que estab en negrita.
Para agregar multiples reproductores de audio, solo basta con cambiar el ID del contenedor y duplicar el codigo. Para el caso del reproductor de video habria que hacer unas minimas modificaciones en la funcion show_video( ), y pasandole como parametro el identificador del DIV podriamos tener multiples reproductores de video.

Bien!. veran que es muy facil!!!

UN TIP > USAR YOUTUBE COMO SERVIDOR DE VIDEO STREAM:
Esto es para los que ahorramos ancho de banda. (Hoy en dia los que tienen reproductores de video propios insertados en su sitio web, estimo que es porque el sitio les da mucha ganancia) 
Lo que yo hice fue guardar toda las rutas de los videos de youtube en mi base de datos. Para ello, se me presento un inconveniente; las URL’s de los videos son diferentes a la URL de publicacion que estan en los tags.. se entiende?.

Ejemplo: esta es la URL del video que esta en la barra de direcciones del navegador, http://www.youtube.com/watch?v=Mxo9D_aTrx4. (Esta URL NO FUNCIONA!).
pero si miramos la URL del objeto a insertar:

<object width="425" height="344"><param name="movie" value="
http://www.youtube.com/v/G8whC4Me8d4&hl=en&fs=1“></param> <param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param> <embed src=”http://www.youtube.com/v/G8whC4Me8d4&hl=en&fs=1” type=”application/x-shockwave-flash” allowscriptaccess=”always” allowfullscreen=”true” width=”425″ height=”344″></embed></object>

Ja, si!  es totalmente distinta; en mi caso, necesitaba guardar solo la URL en el campo de la Base de datos, entonces lo que hice fue armar una expresion regular que me devuelva la URL del video de forma limpia.

function validate_youtube(text_element) {
if (text_element.value != ""){
var matches = "";
var expression = /((http:\/\/)|(www\.[^ \[\]\(\)\n\r\t]+)|(([012]?[0-9]{1,2}\.){3}[012]?[0-9]{1,2})\/)([^ \[\]\(\),;\"'<>\n\r\t]+)([^\. \[\]\(\),;\"'<>\n\r\t])|(([012]?[0-9]{1,2}\.){3}[012]?[0-9]{1,2})/gi;
var rx = new RegExp(expression);
var str = text_element.value;
matches = str.match(rx);
text_element.value=matches[0];
}
}

La podes agregar en el textfield con el evento onChange, entonces cuando hagas “Copy/Paste” del codigo <object…/object> en el textbox de tu CMS, obtendras la URL on the fly.

Esto ultimo tambien podria hacerce mucho mejor con el API de google para Youtube, y se podrian obtener hasta los comentarios de los videos (estuve viendo el codigo y no es para nada dificil). Pero yo necesitaba una solucion sencilla y rapida, asi que dejamos el API para el Upgrade del sitio.

descargar archivos

Nicolas. tech-nico.com/blog

Hace algunos años tuve la necesidad de implementar en uno de mis sitios, algun sistema o especie de SNMP que sea capás de mostrar en tiempo real el estado de la red troncal de internet a los clientes.

Mas bien, la idea era reducir llamadas telefónicas innecesarias, ya que si el problema esta en el Carrier, o Telefónica aprovechamos para decir que esta andando pésimo, o que tengamos un problema nosotros mismos, en fin, estamos mostrandole al cliente “en tiempo real”, que hay un corte en tal tramo de la red o en nuestro carrier de internet.

Googleando… no pude encontrar ninguna solución sencilla que represente dicha utilidad. >Todos los SNMP que publican estados de servicios en WEB, son mas bien para usos de Admins, y no para clientes finales, entonces vienen demaciado completos y/o complejos.

Aqui debajo el ejemplo: En este caso ( al estar corriendo sobre un hosting pago y compartido ) tienen desactivado el shell_exec() por razones de seguridad y politicas propias del hosting. Por eso, solo muestra color amarillo el primer tramo y arroja el error: Warning: shell_exec() has been disabled for security reasons. (solo visible en el modo debug de Flash).
Pero don’t worry; nosotros lo queremos para nuestra pagina hosteada en nuestro servidor, situado en el mismo segmento de red que queremos monitorear. Ya que, no tiene ningun sentido que queramos ver el estado de la red estando fuera de ella, precisamente porque si hay un corte en cualquier punto de la red, y la Web y Tool estan hosteados fuera, el cliente no tiene forma accederlos y menos aun ver el estado.
Entonces, para que funcione correctamente el tool, debe estar corriendo en un servidor Linux Apache que este situado dentro de la red troncal / LAN / Intranet, etc. la cual estamos monitoreando.

Desarrollar el tool: Soluciones:

• 1) Applet Java.
• 2) Ajax.
• 3) Macromedia Flash.

Opte por la Tercer opcion: “Macromedia Flash” (solo poque me resulta amigable para programar).

Explicación: Se crea un archivo SWF (extención nativa de un archivo flash compilado) que viene a ser el Front End. Este interactua con 1 archivo PHP ( que no es ni mas ni menos que un ping ) que hace de MiddleWare entre el servidor Apache donde hosteamos nuestro Site y Flash, entonces cada x tiempo ejecutamos una función de flash que llama al PHP pasandole como parámetro la IP que queremos chequear si esta caido. El PHP ejecuta el comando “PING x.x.x.x”, e imprime el resultado en una variable que parseamos desde Flash para interpretar que hacer con las graficas. Si el resultado da que perdio 1 paquete, cambia el estado del grafico (objeto que tiene como nombre de instancia la misma IP que chequeamos) a color Amarillo, inmediatamente vuelve a tirarle un ping para ver si realmente esta caido, y de ser asi cambia el estado a color Rojo. Como chequea (loopea) cada X segundos, la proxima vez evaluará en que estado debera estar el objeto. (Verde, Amarillo o Rojo).
Un poco de Codigo ActionScript:

function PING(ip){
pinger = new LoadVars();
pinger.host = ip;
pinger.sendAndLoad(pat + "ping.php?host=" + ip, pinger, "POST");
pinger.onLoad = function (success) {
if (success){
tramasDato = String(pinger.ping).split(" ");
trace(tramasDato[20] + " " + tramasDato[21] + " " + tramasDato[1]);
if (String(tramasDato[20] + " " + tramasDato[21]) != "1 received,"){
trace("PIERDE PAQUETE !!!!");
bad = bad + 1;
i = i - 1;
if (i < 0){
i = 1;
} // end if
gotoAndPlay(25);
}else{
bad = 0;
} // end if
trace("BAD:::: " + bad);
if (bad == 0){
colores(ip.replace(".", "_"), "on");
}else if (bad == 1){
colores(ip.replace(".", "_"), "lose");
}else if (bad > 1){
colores(ip.replace(".", "_"), "off");
i = i + 1;
if (i > 3){
i = 1;
} // end if
bad = 0;
} // end if
}else{
colores(tramo3.replace(".", "_"), "off");
colores(tramo2.replace(".", "_"), "off");
colores(tramo1.replace(".", "_"), "off");
}
};
}
function colores(tram, goto){
trace(eval(tram) + "  ///  " + goto);
eval(tram).gotoAndStop(goto);
}
pat = "http://www.tusitio.com.ar/";
tramo3 = "64.233.167.147" // ping a google.
tramo2 = "201.X.X.X"; // equipo de radio troncal.
tramo1 = "201.X.X.X"; // equipo de radio troncal.
actual = tramo1;
i = 1;
bad = 0;
tramasDato = new Array();
Para pulir un poco mas se podria haber creado un XML con la lista de IPs, y de esta manera no tener que editar el FLA cada ves que cambie el nro. de IP de algun tramo.

PHP del archivo ping.php:

// Declare some globals
global $ip, $host_name, $host_ip;
$host = $_GET['host'];

function get_ip()
{
if (isset($_SERVER['HTTP_X_FORWARDED_FOR'])) {
$ip = $_SERVER['HTTP_X_FORWARDED_FOR']; }
elseif (isset($_SERVER['HTTP_CLIENT_IP'])) {
$ip = $_SERVER['HTTP_CLIENT_IP']; }
else {
$ip = $_SERVER['REMOTE_ADDR']; }

return $ip;
}

function ping($host, $ping_count)
{
if (get_ip()==”127.0.0.1″){
$command = “ping -c $ping_count $host”;
$fp = shell_exec(“$command 2>&1″);
$output = (htmlentities(trim($fp)));
echo ‘&ping=’.$output;
}else{
echo ‘&ping=error’;
}
}

ping($host, 1);

NOTA: sin duda “algo muy util para WISPs”. Espero les sirva.

Descargar Codigo Fuente y Archivos FLA, SWF y PHP.
Recuerda que tienes que tener shell_exec habilitado en tu apache.

__________________________
Tech-Nico.com

Nicolas.