Cambio sfumato colore di sfondo

[robertaburattin]

Salve a tutti, vorrei sapere se qualcuno conosce uno script in FLASH che possa riprodurre l'effetto di variazione di colore dello sfondo che si vede in questa pagina:
http://www.muellerhess.ch/

In questo caso è stato utilizzato uno javascript, però volevo sapere se è possibile riprodurre l'effetto anche in flash.

In sostanza a seconda della direzione del mouse lo sfondo cambia colore gradualmente..

Grazie

[KillerWorm]

Ciao

Specifica se utilizzi AS2 o AS3.

[robertaburattin]

Ciao

Io ho Flash CS3 e posso usare sia AS2 che AS3

[KillerWorm]

ok
vedo se riesco a fare qualcosa in AS2

[KillerWorm]

Ho elaborato qualcosa di simile..
Non è proprio uguale all'effetto del link perché non ho capito l'algoritmo utilizzato nel JavaScript riguardo le variazioni di tonalità. A dire il vero lo trovo un po' "incoerente" (passami il termine) perché se si prova a ridimensionare la finestra dello stage, cambia il tipo di variazione del colore rispetto allo spostamento del mouse..

Io invece ho associato il valore della tonalità alla proprietà _xmouse mentre il valore della luminosità alla proprietà _ymouse.

Di seguito, lo script.
Dovrai inserirlo in un frame (ad es il primo frame della root).

Tieni conto che l'ho creato da zero (probabilmente ne esistono di più ottimali, anche se ho provato a cercare sul web e non ne ho trovati).. inoltre non so se esistano già delle classi predisposte per l'elaborazione del colore, per cui mi sono inventato alcune funzioni.. (non chiedermi di spiegartele, ti prego) :master:

Perché funzioni basterà creare un clip rettangolare grande quanto lo stage, che abbia il centro di registrazione sull'angolo superiore sinistro, quindi istanziarlo come "mc_sfondo".

var t:Number = 0;
var l:Number = 0;
var c:Color = new Color(mc_sfondo);
function getrgb(t:Number, l:Number):Number {
    t = limit(t, 0, 1);
    l = limit(l, 0, 1);
    return Number('0x'+colorcomponent(t, l, 0.5)+colorcomponent(t, l, -1/6)+colorcomponent(t, l, 1/6));
}
function limit(v:Number, a:Number, b:Number):Number {
    with (Math) {
        return max(a, min(b, v));
    }
}
function triangular(v:Number, f:Number):Number {
    return Math.abs(1-Math.abs(1-(v-f)*2));
}
function colorcomponent(t:Number, l:Number, f:Number) {
    var v = (limit((limit(triangular(t, f), 1/3, 2/3)-1/3)*3, l, 1)*255).toString(16);
    return v.length == 1 ? '0'+v : v;
}
mc_sfondo.onMouseMove = function() {
    c.setRGB(getrgb(this._xscale*this._xmouse/this._width*0.01, this._yscale*this._ymouse/this._height*0.01));
}; 

[robertaburattin]

Grazie mille
E' praticamente perfetto, credo tu abbia realizzato un ottimo script complimenti

Vorrei sapere se è possibile impostare il colore di sfondo bianco quando il mouse è nell'area centrale dello stage..

Se ti crea troppi problemi non importa comunque

Grazie mille ancora!

[KillerWorm]

Per ora la luminosità (quindi la quantità di bianco) viene data dalla variazione di _ymouse, cioè lo spostamento verticale (una "semplice" funzione lineare). In effetti la si potrebbe impostare secondo una funzione radiale in modo che il bianco sia dato verso il centro...
Proverò a fare qualche esperimento ma non ti garantisco nulla.

[KillerWorm]

Ecco la modifica...

Ora la variazione di tonalità è data in base all'angolo, quindi girando attorno al centro otterrai tutte le tonalità, mentre la luminosità e data dal raggio, cioè dalla distanza dal centro, più ti avvicini al centro più il colore diventa bianco..
Ho incluso anche un valore di tolleranza per impostare la distanza dal centro entro la quale si ottiene sempre il bianco.
Puoi impostarlo attraverso la variabile "o" (raggio centrale).

var t:Number = 0;
var l:Number = 0;
var o:Number = .2; //raggio centrale (impostare un valore decimale da 0 a 1)
var c:Color = new Color(mc_sfondo);
function getrgb(t:Number, l:Number):Number {
    t = limit(t, 0, 1);
    l = limit(l, 0, 1);
    return Number('0x'+colorcomponent(t, l, 0.5)+colorcomponent(t, l, -1/6)+colorcomponent(t, l, 1/6));
}
function limit(v:Number, a:Number, b:Number):Number {
    with (Math) {
        return max(a, min(b, v));
    }
}
function triangular(v:Number, f:Number):Number {
    return Math.abs(1-Math.abs(1-(v-f)*2));
}
function colorcomponent(t:Number, l:Number, f:Number):String {
    var v = (limit((limit(triangular(t, f), 1/3, 2/3)-1/3)*3, l, 1)*255).toString(16);
    return v.length == 1 ? '0'+v : v;
}
function radial(x:Number, y:Number):Number {
    return 1-limit(Math.sqrt(x*x+y*y)*(1+o)-o, 0, 1);
}
function angular(x:Number, y:Number):Number {
    return (Math.atan2(y, x)*.5/Math.PI+1)%1;
}
mc_sfondo.onMouseMove = function() {
    var xm:Number = (this._xscale*this._xmouse/this._width*0.01)*2-1;
    var ym:Number = (this._yscale*this._ymouse/this._height*0.01)*2-1;
    c.setRGB(getrgb(angular(xm, ym), radial(xm, ym)));
}; 

[robertaburattin]

Guarda non ho parole per ringraziarti *_*

Sei stato bravissimo e molto molto gentile! Grazie infinite!!

[KillerWorm]

Nessun problema!
Buon proseguimento.