efecto relieve en ActionScript 3.0

Hola!

Antes de nada, me presento, soy nuevo por aquí.

Estaba hojeando tutoriales de esta maravillosa web y me encontré con este que cumple lo que necesito:
[url= http://www.cristalab.com/tutoriales/efecto-de-relieve-en-imagenes-con-bitmapdata-de-flash-8-c33528l ][/url]

Me pareció realmente espectacular. Sin embargo, mi proyecto está hecho en ActionScript 3, y ese código es AS2, por lo que no me sirve. He inentado traducirlo como puedo, pero soy muy novato y no para de darme errores. Lo más cercano que logré no funciona.

¿Alguien podría facilitarme este código en AS3 o el de un ejemplo que contenga un efecto visual parecido? ¿O quizás exista un modo de importar directamente este pequeño código AS2 como una clase de AS3? Muchisimas gracias de antemano. Me quitaríais de un gran apuro.

se me olvidaba deciros que este es el código que quiero migrar de AS2 a AS3:

Código :

import flash.display.*;
import flash.geom.*;
import flash.filters.*;
_quality = "low";
pt = new Point();
Mouse.hide();
img = BitmapData.loadBitmap("imagen");
rc = img.rectangle;
img.width>img.height ? h=img.width : h=img.height;
h = Math.round(h);
img2 = img.clone();
temp = img.clone();
img.colorTransform(rc, new ColorTransform(1, 1, 1, 0, 127, 127, 127, 255));
img2.colorTransform(rc, new ColorTransform(1, 1, 1, 1, 0, 0, 0, 255));
temp.perlinNoise(20, 20, 2, 0, true, true, 15, false, null);
img.merge(temp, rc, pt, 80, 80, 80, 255);
temp.dispose();
img.applyFilter(img, rc, pt, new BlurFilter(4, 4, 1));
mc1 = this.createEmptyMovieClip("mc1", 1);
mc1.attachBitmap(img2, 2);
marco = this.createEmptyMovieClip("marco", 2);
marco.blendMode = 14;
mc2 = marco.createEmptyMovieClip("mc2", 1);
cl = [0xffffff, 0xe7cf07, 0];
al = [40, 60, 100];
rt = [0, 37, 255];
matrix = new Matrix();
matrix.createGradientBox(h, h, 0, h/2, h/2);
mc2.beginGradientFill("radial", cl, al, rt, matrix);
mc2.moveTo(0, 0);
mc2.lineTo(0, 2*h);
mc2.lineTo(2*h, 2*h);
mc2.lineTo(2*h, 0);
mc2.lineTo(0, 0);
mc2.endFill();
sal = temp=img.clone();
mx1 = [0, 0, 0, -1, 0, 1, 0, 0, 0];
mx2 = [0, -1, 0, 0, 0, 0, 0, 1, 0];
temp.applyFilter(img, rc, pt, new ConvolutionFilter(3, 3, mx1, 1, 127));
sal.copyPixels(temp, rc, pt);
temp = img.clone();
temp.applyFilter(img, rc, pt, new ConvolutionFilter(3, 3, mx2, 1, 127));
sal.copyChannel(temp, rc, pt, 1, 2);
temp.dispose();
dMap = new DisplacementMapFilter(sal, pt, 1, 2, -300, -300);
onMouseMove = function () {
   x = h-_xmouse;
   y = h-_ymouse;
   dMap.mapPoint = new Point(x, y);
   mc2.filters = [dMap];
   mc2._x = -x;
   mc2._y = -y;
   updateAfterEvent();
};
onMouseMove();

He logrado hacer esto:

Código :

function update():void{
//efecto luz
//--------------------------------------------------------


var _quality: String = "low";
var pt : Point = new Point();
Mouse.hide();

var miBitmapData:BitmapData = new lllo(200,200);
var img:Bitmap = new Bitmap(miBitmapData);

trace("fail0:"+img.width+img.height);

var rc:Rectangle = new Rectangle(0,0,img.width,img.height);


if (img.width>img.height){
   h=img.width;
}else{
   h=img.height;
} 
h = Math.round(h);
var img2 : Bitmap= img;
var temp:Bitmap = img;
img.transform.colorTransform=new ColorTransform(1, 1, 1, 0, 127, 127, 127, 255);
img2.transform.colorTransform=new ColorTransform(1, 1, 1, 1, 0, 0, 0, 255);
temp.bitmapData.perlinNoise(20, 20, 2, 0, true, true, 15, false, null);
img.bitmapData.merge(temp.bitmapData, rc, pt, 80, 80, 80, 255);
temp.bitmapData.dispose();
var filter:BitmapFilter = new BlurFilter(4, 4, BitmapFilterQuality.HIGH);
var myFilters:Array = new Array();
myFilters.push(filter);

img.filters = myFilters;
//img.bitmapData.applyFilter(img.bitmapData, rc, pt, new BlurFilter(4, 4, 1));
var mc1:MovieClip = new MovieClip();
this.addChild(mc1);
mc1.addChild(img2);
var marco:MovieClip = new MovieClip();
this.addChild(marco);
marco.blendMode = BlendMode.HARDLIGHT;
mc2 = new MovieClip();
marco.addChild(mc2);

var cl:Array = [0xffffff, 0xe7cf07, 0];
var al:Array = [40, 60, 100];
var rt:Array = [0, 37, 255];
var matrix:Matrix = new Matrix();
matrix.createGradientBox(h, h, 0, h/2, h/2);

mc2.graphics.beginGradientFill("radial", cl, al, rt, matrix);
mc2.graphics.moveTo(0, 0);
mc2.graphics.lineTo(0, 2*h);
mc2.graphics.lineTo(2*h, 2*h);
mc2.graphics.lineTo(2*h, 0);
mc2.graphics.lineTo(0, 0);
mc2.graphics.endFill();

var miBitmapData33:BitmapData = img.bitmapData;
var sal:Bitmap = new Bitmap(miBitmapData33);

trace("fail0:"+img.width+img.height);

//var miBitmapData22:BitmapData = img.bitmapData;
var miBitmapData22:BitmapData = new BitmapData(200,200,true,0x000000);
var temp2:Bitmap = new Bitmap(miBitmapData22);
temp2.bitmapData=img.bitmapData;

trace("fail0:"+temp2.width+temp2.height);

var mx1: Array = [0, 0, 0, -1, 0, 1, 0, 0, 0];
var mx2:Array = [0, -1, 0, 0, 0, 0, 0, 1, 0];
var filter2:BitmapFilter = new ConvolutionFilter(3, 3, mx1, 1, 127);
var myFilters2:Array = new Array();
myFilters2.push(filter2);
temp2.filters=myFilters2;

//temp.bitmapData.applyFilter(img.bitmapData, rc, pt, new ConvolutionFilter(3, 3, mx1, 1, 127));

trace("fail0:"+temp2.width+temp2.height);
sal.bitmapData.copyPixels(temp2.bitmapData, rc, pt);
temp2 = img;
trace("test");


var filter3:BitmapFilter = new ConvolutionFilter(3, 3, mx1, 1, 127);
var myFilters3:Array = new Array();
myFilters3.push(filter3);
temp2.filters=myFilters3;

//temp.bitmapData.applyFilter(img.bitmapData, rc, pt, new ConvolutionFilter(3, 3, mx2, 1, 127));
sal.bitmapData.copyChannel(temp2.bitmapData, rc, pt, 1, 2);
temp2.bitmapData.dispose();
dMap = new DisplacementMapFilter(sal.bitmapData, pt, 1, 2, -300, -300);

stage.addEventListener(MouseEvent.MOUSE_MOVE,MouseMove);


}



function MouseMove(e:MouseEvent):void {
   var x:Number = h-e.target.mouseX;
   var y:Number = h-e.target.mouseY;
   dMap.mapPoint = new Point(x, y);
   mc2.filters = [dMap];
   mc2.x = -x;
   mc2.y = -y;
   this.update();
}


//---------------

Peor tengo problemas con el método copypixels. Al asociar el bitmapData al de "img", en vez de devolverme una imagen de 200x200 como es la "img" original, me devuelve una de 0x0 y el método falla:

Código :

var miBitmapData22:BitmapData = new BitmapData(200,200,true,0x000000);
var temp2:Bitmap = new Bitmap(miBitmapData22);
temp2.bitmapData=img.bitmapData;

trace("fail0:"+temp2.width+temp2.height); //¡Aqui ya devuelve 0x0 en vez de 200x200 como al principio!

var mx1: Array = [0, 0, 0, -1, 0, 1, 0, 0, 0];
var mx2:Array = [0, -1, 0, 0, 0, 0, 0, 1, 0];
var filter2:BitmapFilter = new ConvolutionFilter(3, 3, mx1, 1, 127);
var myFilters2:Array = new Array();
myFilters2.push(filter2);
temp2.filters=myFilters2;

sal.bitmapData.copyPixels(temp2.bitmapData, rc, pt);

Gracias por vuestro tiempo...

El error que me sale es "objeto BitMapData no valido en copypixels".

He conseguido portar el código; sin embargo, el efecto producido no es exactamente el mismo. No obstante, supongo que sólo habrá que jugar un poco con los valores para poder hacer algo parecido.

El código es el siguiente:

Código ActionScript :

import flash.display.*;
import flash.geom.*;
import flash.filters.*;

var ancho:Number = /* AQUÍ EL ANCHO DE TU IMAGEN */;
var alto:Number = /* AQUÍ EL ALTO DE TU IMAGEN */;

stage.quality = "low";

var pt:Point = new Point();

Mouse.hide();

var img:BitmapData = new Imagen(ancho, alto);

var rc:Rectangle=img.rect;

var h:Number;
img.width>img.height?h=img.width:h=img.height;

h=Math.round(h);

var img2:BitmapData=img.clone();

var temp:BitmapData=img.clone();

img.colorTransform(rc, new ColorTransform(1, 1, 1, 0, 127, 127, 127, 255));
img2.colorTransform(rc, new ColorTransform(1, 1, 1, 1, 0, 0, 0, 255));

temp.perlinNoise(20, 20, 2, 0, true, true, 15, false, null);

img.merge(temp, rc, pt, 80, 80, 80, 255);

temp.dispose();

img.applyFilter(img, rc, pt, new BlurFilter(4, 4, 1));

var mc1:MovieClip = new MovieClip();
this.addChild(mc1);

/* Esto... */
mc1.graphics.beginBitmapFill(img);
mc1.graphics.drawRect(0, 0, rc.width, rc.height);
mc1.graphics.endFill();

var marco:MovieClip = new MovieClip();
this.addChild(marco);
marco.blendMode=BlendMode.HARDLIGHT;

var mc2:MovieClip = new MovieClip();
marco.addChild(mc2);

var cl:Array=[0xffffff,0xe7cf07,0];
var al:Array=[40,60,100];
var rt:Array=[0,37,255];

var matrix:Matrix = new Matrix();

matrix.createGradientBox(h, h, 0, h/2, h/2);

mc2.graphics.beginGradientFill("radial", cl, al, rt, matrix);
mc2.graphics.moveTo(0, 0);
mc2.graphics.lineTo(0, 2*h);
mc2.graphics.lineTo(2*h, 2*h);
mc2.graphics.lineTo(2*h, 0);
mc2.graphics.lineTo(0, 0);
mc2.graphics.endFill();

var sal:BitmapData=temp=img.clone();

var mx1:Array=[0,0,0,-1,0,1,0,0,0];
var mx2:Array=[0,-1,0,0,0,0,0,1,0];

temp.applyFilter(img, rc, pt, new ConvolutionFilter(3, 3, mx1, 1, 127));
sal.copyPixels(temp, rc, pt);

temp=img.clone();
temp.applyFilter(img, rc, pt, new ConvolutionFilter(3, 3, mx2, 1, 127));

sal.copyChannel(temp, rc, pt, 1, 2);

temp.dispose();

var dMap:DisplacementMapFilter = new DisplacementMapFilter(sal,pt,1,2,-300,-300);

stage.addEventListener(MouseEvent.MOUSE_MOVE, moverRaton);

function moverRaton(e:MouseEvent) {

   var x:Number = h-this.mouseX;
   var y:Number = h-this.mouseY;

   dMap.mapPoint=new Point(x,y);

   mc2.filters=[dMap];
   mc2.x = -x;
   mc2.y = -y;

   e.updateAfterEvent();

}

No obstante, ahora las imágenes son una clase propia, en este caso llamada Imagen, la cual hereda de flash.display.BitmapData. La clase BitmapData recibe como argumentos un ancho y un alto, de ahí que usemos new Imagen(ancho, alto). No obstante, no he notado ninguna diferencia entre poner los valores reales u otros cualesquiera...

En fin, espero que te sirva como punto de partida al menos. Si no consigues imitar el efecto original, seguiré probando, pero ahora me pillas con un poco de prisa

Un saludo!

Buah, MUCHISIMAS GRACIAS, de todo corazón. Es más de lo que esperaba y me sirve como punto de partida para situarme(yo siempre he trabajado sobre AS3 y lenguajes OOB y el AS2 me suena realmente extraño). Probaré a toquetear los filtros y ya te contaré como va y lo compartiré por si a alguien le sirve.

Saludiños.

De nada, de nada si consigues hacer el efecto igual (o un poco más parecido), postéalo y coméntanos qué cambiaste