// acciones en fotograma 1
stop();
XML.prototype.ignoreWhite = true;
import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.net.URLRequest;
import fl.transitions.Tween;
import fl.transitions.easing.*;
import flash.geom.ColorTransform;
// separacion-> distancia entre las imágenes
// tanto horizontal como vertical
var separacion:Number = 110;
var separacion2:Number = 77;
// vbles para pasar de página
var pagina_actual:Number = 1;
var num_paginas:Number;
// array donde metemos los elementos del XML
var IMG_array:Array;
// objeto XML que carga la lista de miniaturas
var miniaturasXML:XML;
var loader:Loader;
var xmlLoader:URLLoader;
function Main() {
* * loader = new Loader();
* * addChild(loader);
* * xmlLoader = new URLLoader(new URLRequest("../album/verMiniaturas.xml"));
xmlLoader.addEventListener(Event.COMPLETE, mostrarMiniaturas);
}
var lienzo:MovieClip = new MovieClip();
lienzo.name = "lienzo_miniaturas";
// funcion que se ejecuta al cargar el XML
function mostrarMiniaturas() {
// contadores de columna y fila para
// disponer las miniaturas
var fila:Number = 0;
var col:Number = 0;
// paso los datos del XML al array
IMG_array = this.firstChild.childNodes;
// como caben 12 fotos por página podemos
// saber el núm de páginas necesarias para
// mostrar todas las fotos
num_paginas = Math.ceil(IMG_array.length/8);
// creo el clip donde meteremos todas las miniaturas
*
addChild(lienzo);// lo posiciono donde nos conviene
lienzo.x = 0;
lienzo.y = 0;
// y lo enmascaro con el clip situado en la
// capa mascara. se enmascara para hacer el deslizamiento del
// clip cuando tengamos muchas miniaturas y no entren todas a
// la vez en pantalla (nuestro caso)
lienzo.mask = mascara_mc;
// recorro el array que contiene la lista con los nombres de
// los archivos de las miniaturas e invoco la función crearMiniatura
// que es la que carga la imagen, la recoloca, le pone un pequeño
// marco y le asigna las acciones para verla ampliada
for (var k:Number = 0; IMG_array[k]; k++) {
// extraigo la ruta del archivo de imagen
//var ruta:String = "minis/"+IMG_array[k].attributes.nombre;
// como sólo tengo tres columnas, cuando llegue a
// la tercera, avanzo una fila y retorno a la primera
if (col>1) {
col = 0;
fila++;
}
// creo la miniatura. extraigo la ruta del archivo de imagen
// y la paso como tercer parámetro
crearMiniatura(col, fila, IMG_array[k].attributes.nombre);
col++;
}
}
function crearMiniatura(columnaF:Number, filaF:Number, ruta:String) {
// bajo_clip es el clip que contendrá el marco de la miniatura
var bajo_clip:MovieClip = new MovieClip();
clip.name = "bajo_"+filaF+"_"+columnaF;
lienzo.addChild(bajo_clip);
// clip contendrá la imagen
var clip:MovieClip = new MovieClip();
clip.name = "foto_"+filaF+"_"+columnaF;
lienzo.addChild(clip);
// para cargar la miniatura definimos un objeto MovieClipLoader
// y un objeto detector de eventos
var mi_mcl:Loader = new Loader();
var myRequest:URLRequest =
new URLRequest("album/minis/"+ruta);
mi_mcl.load(myRequest);
mi_mcl.contentLoaderInfo.addEventListener(Event.OPEN,showPreloader);
mi_mcl.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,showProgress);
mi_mcl.contentLoaderInfo.addEventListener(Event.COMPLETE,showLoadResult);
function showPreloader(evt:Event):void {
// cuando comienza la carga de la imagen
// ponemos al _alpha a 0
mi_mcl.alpha = 0;
};
function showProgress(evt:ProgressEvent):void {
// aquí podéis poner acciones para mostrar una precarga,
// este caso no lo hemos considerado oportuno
};
// cuando ya se ha completado la carga y tenemos disponible el clip
function showLoadResult(evt:Event):void {
// recolocamos la imagen (todavía está oculta, con _alpha=0)
mi_mcl.x = (separacion*columnaF)+(100-mi_mcl.width)*0.5;
mi_mcl.y = (separacion2*filaF)+(67-mi_mcl.height)*0.5;
// recolocamos el marco que rodea a la foto
bajo_clip.x = mi_mcl.x;
bajo_clip.y = mi_mcl.y;
// dibujamos el marco
with (bajo_clip) {
beginFill(0x516d6e);
lineStyle(1, 0x516d6e, 100);
lineTo(mi_mcl._width, 0);
lineTo(mi_mcl._width, mi_mcl._height);
lineTo(0, mi_mcl._height);
lineTo(0, 0);
endFill();
}
// al pinchar sobre el área del marco,
// mostramos la foto grande con la función
// verFotoGrande
bajo_clip.addEventListener(MouseEvent.CLICK, verFotoGrande(ruta));
// muestro la miniatura animando el _alpha hasta 100
var myTween:Tween = new Tween(mi_mcl, "_alpha", Regular.easeOut, 0, 100, 2, true);
};
}
function verFotoGrande(ruta:String) {
// creo el clip donde irá la foto grande en una profundidad fija
// para que se reemplace cada vez que pincho en una miniatura
var grande:MovieClip = new MovieClip();
grande.name = "grande_mc", 2*IMG_array.length+11;
addChild(grande);
// igual con el clip que contendrá el marco
var bajo_grande:MovieClip = new MovieClip();
bajo_grande.name = "bajo_grande_mc", 2*IMG_array.length+10;
addChild(bajo_grande);
// posición vertical fija
grande.y = 0;
// para cargar la foto grnade definimos otro objeto MovieClipLoader
// y otro objeto detector de eventos
var grande_mcl:Loader = new Loader();
var myRequest:URLRequest =
new URLRequest("album/originales/"+ruta);
grande_mcl.load(myRequest);
grande_mcl.contentLoaderInfo.addEventListener(Event.OPEN,showPreloader);
grande_mcl.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,showProgress);
grande_mcl.contentLoaderInfo.addEventListener(Event.COMPLETE,showLoadResult);
function showPreloader(evt:Event):void {
// aplico una transformación de color que deja el clip
// tintado de blanco
var newColorTransform = grande_mcl.transform.colorTransform;
newColorTransform.color = {ra:100, rb:255, ga:100, gb:255, ba:100, bb:255, aa:100, ab:0};
grande_mcl.transform.colorTransform = newColorTransform;
};
function showProgress(evt:ProgressEvent):void {
// aquí podéis poner acciones para mostrar una precarga,
// este caso no lo hemos considerado oportuno
// aquí podéis poner acciones para mostrar una precarga,
// este caso no lo hemos considerado oportuno
};
function showLoadResult(evt:Event):void {
// recolocamos la imagen (todavía está oculta)
grande_mcl.x = 210+Math.round((455-grande_mcl.width)*0.5);
// recolocamos el marco que rodea a la foto grande
bajo_grande.x = grande_mcl.x;
bajo_grande.y = grande_mcl.y;
// dibujamos el marco
with (bajo_grande) {
beginFill(0x516d6e);
lineStyle(1, 0x516d6e, 100);
lineTo(target_mc._width, 0);
lineTo(target_mc._width, target_mc._height);
lineTo(0, target_mc._height);
lineTo(0, 0);
endFill();
}
// con estas rutinas hacemos la transición de color desde el blanco
var indiceColor:Number = 255;
var intervaloColor = setInterval(cambiarColor, 0);
function cambiarColor() {
var newColorTransform = grande_mcl.transform.colorTransform;
newColorTransform.color = {ra:100, rb:indiceColor, ga:100, gb:indiceColor, ba:100, bb:indiceColor, aa:100, ab:0};
grande_mcl.transform.colorTransform = newColorTransform;
indiceColor -= 2;
if (indiceColor == -1) {
clearInterval(intervaloColor);
}
}
};
}
// con esta función desplazo el lienzo de las miniaturas para
// pasar de página
function moverLienzo(posY:Number) {
var myTween:Tween = new Tween(lienzo, "y", Regular.easeOut, lienzo.y, posY, 1, true);
}
// deshabilito de inicio el botón de volver atrás
// ya que se muestra la página 1