bildergalerie dynamisieren

[stifflers mum]

hallo leute,

heute benötige ich mal euer as-wissen. ich habe hier folgendes script, welches teil einer bildergalerie von sascha wenning ist (imagebox 1). ich möchte dieses nun erweitern, und zwar mit der möglichkeit, die bilder dynamisch per php und xml aus einem ordner auslesen zu lassen. nun zu meinem anliegen: ich hätte gerne einen hinweis daurauf, wie ich die xml-funktion (anbei) korrekt in das gallerie-script einfüge.

[stifflers mum]

hier das script aus der galerie: teil 1

var fotos_array = new Array(); //bilder-container
var polaroid_strecke = 696-93; //breite strecke polaroids (93=polaroid_mc-breite)
var bilderordner = "bilder/"; //Pfad zum Bilderordner relativ zur swf
_global.picturepath; //Pfad zum Bild ab Bilderordner
_global.tiefe = 1; //steuert ebenen
_global.indexMeineAuswahl; //referenz auf meineAuswahl_array
var meinVerlauf_array = new Array; //speichert die reihenfolge der ansicht
var meineAuswahl_array = new Array; //speichert gewaehlte Bilder des Nutzers
var buttons_array = ["diashow_start_btn", "diashow_stop_btn", "zoomplus_btn", "zoomminus_btn", 
"drehe_rechts_btn", "drehe_links_btn",
 "drucke_btn", "speicher_btn", "verlauf_vor_btn", "verlauf_zurueck_btn"]; 
//speichert buttons, die keinen handcursor haben sollen
 
//----
//INIT
//----
init();
function init(){
    Stage.showMenu=false;
    bildansicht_mc.setMask(maske_mc);
    versteckeHandCursor();
    diashow_stop_mc._alpha = 25;
    diashow_stop_btn.enabled = false;
    this.attachMovie("FComboBoxSymbol", "shooting_cb", 10000, {_x:555 , _y:95, _xscale: 150})
    this.attachMovie("FScrollPaneSymbol", "verlauf_mc", 2, {_x:552 , _y:200, _xscale: 142, _yscale: 200})
}
 
function disableButtons(buttons){
    optionen_icons_mc._alpha=25;
    var buttons_array = new Array();
    buttons_array = buttons.split(",");
    for (var i=0; i<buttons_array.length; i++){
        this[buttons_array[i]].enabled = false;
    }
    delete buttons_array;   
}
function enableButtons(buttons){
    optionen_icons_mc._alpha=100;   
    var buttons_array = new Array();
    buttons_array = buttons.split(",");
    for (var i=0; i<buttons_array.length; i++){
        this[buttons_array[i]].enabled = true;
    }
    delete buttons_array;
}
//
function tip(label){
    tip_txt.text = label;
}
 
//verstecke mauszeiger
function versteckeHandCursor(){
    for(var i=0; i<=buttons_array.length-1; i++){
        this[buttons_array[i]].useHandCursor = false;
    }
}
//diashow
var indexDiashow = -1;
function diashowVor(){
    indexDiashow += 1;
    //maske entfernen
    _root.dia_maske.removeMovieClip();
    //bild laden
    bildansicht_mc.container_mc.loadMovie(meineAuswahl_array[indexDiashow]);
    //maske attachen
    _root.attachMovie("diashow_maske_mc","dia_maske", tiefe++);
    _root.dia_maske._xscale=220;
    _root.dia_maske._yscale=180;
    bildansicht_mc.setMask("dia_maske");
    if(indexDiashow == meineAuswahl_array.length-1){
        indexDiashow = -1;
    }
}
function diashow(){
    bildgroesse_reset();
    bildansicht_mc._rotation = 0;
    //enable diashow_stop_mc
    diashow_stop_mc._alpha = 100;
    diashow_stop_btn.enabled = true;    
    //deactivate other menue items (comma seperated, no spaces)
    disableButtons("diashow_start_btn,zoomplus_btn,zoomminus_btn,drehe_rechts_btn,drehe_links_btn,drucke_btn,speicher_btn,
verlauf_vor_btn,verlauf_vor_btn,verlauf_zurueck_btn");
    //call interval function
    _global.diaShowinterval = setInterval(diashowVor, 5000);
}
//
bildgroesse_reset = function(){
    bildansicht_mc._xscale=100;
    bildansicht_mc._yscale=100;
    bildansicht_mc._x = 280;
    bildansicht_mc._y = 265;
}
 
//Funktionen
// Funktion, die prüft, ob eine Zahl gerade ist 
 
Math.isEven = function(num){ 
    return num%2 == 0 ? true : false; 
} 
//Zufallszahl
function zufallszahl(minWert, maxWert){
    do{
        r = Math.random();
    }while(r == 1);
    return minWert + Math.floor(r*(maxWert + 1 - minWert))
}
 
//fuege Bild verlauf_mc hinzu
function ergaenzeVerlauf(bild){
 
    gewaehlt = bilderordner+picturepath+"/"+bild
    var meineAuswahl_string = meineAuswahl_array.join();
    
    //picture selected before?
    if(meineAuswahl_string.indexOf(gewaehlt) == -1){
        //no -> go
        meineAuswahl_array.push(bilderordner+picturepath+"/"+bild); //array zufuegen
        verlauf_mc.tmp_mc.attachMovie("polaroid_mc", bild, tiefe ,{pic_txt: bild, shooting: picturepath}); //platzieren
        verlauf_mc.tmp_mc[bild].ladejpg(bild); //laden  
        meinVerlauf_array.push(bilderordner+picturepath+"/"+bild);
        indexMeineAuswahl = meinVerlauf_array.length-1;
        //schicke den pfad zum bilderordner mit
        verlauf_mc.tmp_mc[bild].selectPolaroidVerlauf(bild, bilderordner+picturepath+"/");
        verlauf_mc.tmp_mc[bild]._xscale = 70; //groesse
        verlauf_mc.tmp_mc[bild]._yscale = 70;
        //koords 2spaltig (anhand meineAuswahl_array ermitteln)
        if (Math.isEven(meineAuswahl_array.length)){ 
            //gerade
            verlauf_mc.tmp_mc[bild]._x = 72;
            verlauf_mc.tmp_mc[bild]._y = (Math.ceil(meineAuswahl_array.length/2)*60)-60;
        }else{
            //ungerade
            verlauf_mc.tmp_mc[bild]._x = 4;
            verlauf_mc.tmp_mc[bild]._y = (Math.ceil(meineAuswahl_array.length/2)*60)-60;
        }
        verlauf_mc.refreshPane();      
    }
}
 
 
 
 
// Klasse Bild
bild = function(){
}
 
Object.registerClass("polaroid_mc", bild);
bild.prototype = new MovieClip();
 
// ordnet preview-polaroids zufaellig an
 
bild.prototype.verteilePolaroid = function(){
    //koord
    this._x = random(polaroid_strecke);
    this._y = 5 + random(40);
    //rotation
/////////////////////////////////////////////////////////////////////////////// 
 

[stifflers mum]

teil zwei:

///////////////////////////////////////////////////////////////////////////////
    //this._rotation = zufallszahl(-5, 5);
}
 
//
bild.prototype.ladejpg = function(bild){
    this.bild_mc.loadMovie(bilderordner+picturepath+"/"+bild);
}
//
// drag polaroid from bottom on stage
bild.prototype.ReleaseHandler = function(bild, ursprungx, ursprungy){
    this.stopDrag();
    //stop wobbling
    delete this.onEnterFrame;
    delete stopit;
    delete cnt;
    //
    if(this._droptarget != "/bildansicht_mc" && this._droptarget != "/bildansicht_mc/container_mc"){            
    //nicht zeigen
        if((this._x > 700) || (this._x < 0) || (this._y > 100) || (this._y < 0)){
            this.onEnterFrame=function(){
                if(this._x != urspr_x){
                    this._x -= ((this._x-ursprungx)/2);
                    this._y -= ((this._y-ursprungy)/4);
                }else{
                    delete this.onEnterFrame;
                }
            }
        }
    }else{
        //zeige grossansicht
        bildgroesse_reset();
        bildansicht_mc.container_mc.loadMovie(bilderordner+shooting_cb.getValue()+"/"+bild);
        ergaenzeVerlauf(bild); //zum verlauf hinzufuegen
        this.bild_mc._alpha=30;
        this._rotation = urspr_rot;
        this.onEnterFrame=function(){
            if(this._x != ursprungx){
                this._x -= ((this._x-ursprungx)/2);
                this._y -= ((this._y-ursprungy)/4);
            }else{
                delete this.onEnterFrame;
            }
        }
        //nach einmaliger auswahl nicht mehr waehlbar
        delete this.onPress;
        delete this.onRelease;
        delete this.onReleaseOutside;
    }
}
 
 
bild.prototype.selectPolaroid = function(bild){
    this.useHandCursor = false;
    var urspr_x = this._x;
    var urspr_y = this._y;
    var urspr_rot = this._rotation;  
    this.onPress=function(){
        urspr_x = this._x;
        urspr_y = this._y;
        this.swapDepths(tiefe++);
        //position upper left corner to mouse
        this._x = this._parent._xmouse-10;
        this._y = this._parent._ymouse-10;
        this.startDrag();
        //start wobbling    
//////////////////////////////////////////////////////////////////////////////////////
        /*
        this.onEnterFrame = function(){
            cnt++;
            stopit-=0.05
            this._rotation = (Math.sin(cnt/2)*-5)/(stopit);
        }
    */
    }
    
    this.onRelease=function(){
        this.ReleaseHandler(bild, urspr_x, urspr_y);
    }
    
    this.onReleaseOutside=function(){      
        this.ReleaseHandler(bild, urspr_x, urspr_y);
    }      
}
//
//select aus scroll pane
bild.prototype.selectPolaroidVerlauf = function(bild){
    this.useHandCursor = false;
    this.onPress=function(){
        _root.attachMovie("polaroid_mc", "p", tiefe++, {pic_txt: bild});
        _root.p._xscale = 70;
        _root.p._yscale = 70;
        _root.p.bild_mc.loadMovie(bilderordner+this.shooting+"/"+bild);
        meinVerlauf_array.push(bilderordner+this.shooting+"/"+bild);
        indexMeineAuswahl = meinVerlauf_array.length-1;
        _root.p.drag(bild, this.shooting);
    }   
}
 
//vom pane auf die buehne
bild.prototype.drag = function(bild, shooting){
    this._x = _root._xmouse - 20;
    this._y = _root._ymouse - 20;
 
    this.onRollOver=function(){
        if(this._droptarget == "/bildansicht_mc/container_mc"){
            bildgroesse_reset();
            //mini-bild in dragsequenz laden
            bildansicht_mc.container_mc.loadMovie(bilderordner+shooting+"/"+bild);
        }
        removeMovieClip(this);
    }   
    if (hitTest( _root._xmouse, _root._ymouse, false)){;
        this.startDrag();
    }   
}
//
//Optionen
//
//verschieben
movieclip.prototype.verschieben = function(){
    this.useHandCursor=false;
    this.onPress = function(){
        var abstandx = 20; //20px abstand
        var abstandy = 70; //70px abstand
        var links = ((this._width/2)-260)-abstandx;
        var oben = ((this._height/2)-195)-abstandy;
        var rechts = ((this._width/2)-260)+abstandx;
        var unten = ((this._height/2)-195)+abstandy;
        this.startDrag(false, 260-links, 195-oben, 260+rechts, 195+unten);
    }
    this.onRelease = function(){
        this.stopDrag();
    }
    this.onReleaseOutside = function(){
        this.stopDrag();
    }   
}
//navigiereVerlauf
navigiereVerlauf = function( aktion, ziel){
    bildgroesse_reset();
    if(aktion == "zurueck"){
        if(indexMeineAuswahl>0){
            bildansicht_mc.container_mc.loadMovie(meinVerlauf_array[indexMeineAuswahl-1]);
            indexMeineAuswahl -= 1;
        }
    }
    if(aktion == "vor"){
        if(indexMeineAuswahl<meinVerlauf_array.length-1){
            indexMeineAuswahl += 1;
            bildansicht_mc.container_mc.loadMovie(meinVerlauf_array[indexMeineAuswahl]);
        }
    }   
}
//drehen
drehen = function( ziel, rotation){
    with(this[ziel]){
        _rotation += rotation;
    }
}
//zoom
zoom = function( aktion, type, ziel, faktor){
    if(aktion == "start"){
        if(type == "plus"){
            this[ziel].onEnterFrame = function(){         
                with(this){
                    _xscale += faktor;
                    _yscale += faktor;          
                }
            }
        }
        if(type == "minus"){
            this[ziel].onEnterFrame = function(){
                if(this._xscale>101){
                    with(this){
                        _xscale += faktor;
                        _yscale += faktor;          
                    }
                }
            }
        }      
    }else{
        delete this[ziel].onEnterFrame;
    }
}
 
//Fuelle shootings_dd
shooting_lv = new LoadVars();
shooting_lv.onLoad = function(){
    var shootings_array = new Array();
    for(var i=0; i<this.anz_shootings; i++){
        shootings_array = this.ordner.split("|");
    }
    shooting_cb.setDataProvider(shootings_array);
}
shooting_lv.load("bilder/config.txt",shooting_lv,"GET");
 
shooting_cb.setChangeHandler("ladePolaroidPreview");
ladePolaroidPreview = function(){
    _global.picturepath = shooting_cb.getValue();
    //aufruf zum bilder laden
    bilder_lv.Load(bilderordner+picturepath+"/bilder.txt", bilder_lv, "GET");
}
 
//Load Pictures from File Bilder.txt
bilder_lv = new LoadVars();
bilder_lv.onLoad = function(){
    bildansicht_mc.verschieben();
    _root.container_thumbs_mc.removeMovieClip();
    _root.createEmptyMovieClip("container_thumbs_mc", tiefe++)
    container_thumbs_mc._x = 18;
    container_thumbs_mc._y = 480;
    //var fotos in bilder_array splitten
    for(var i=0; i<this.anz_bilder; i++){
        fotos_array = this.fotos.split("|");
        container_thumbs_mc.attachMovie("polaroid_mc", "polaroid"+i, tiefe++,{pic_txt: fotos_array[i]});
        container_thumbs_mc["polaroid"+i].verteilePolaroid();
        container_thumbs_mc["polaroid"+i].ladejpg(fotos_array[i]);
        container_thumbs_mc["polaroid"+i].selectPolaroid(fotos_array[i]);
    }
}
 
 
stop(); 

[stifflers mum]

und hier dei xml:

var tempxml:XMLNode;
 
var pic:XMLNode;
 
var link:XMLNode;
 
var amountNodes:Number;
 
var fehler;
 
var ordner:String = "bilder/la_poesia/";
 
//pfad zu einer statischen xml
//var pfad:String = "images.xml";
 
//pfad für eine dynamische xml
var pfad:String = "http://www.meinedomain.de/kb/1la_poesia.php?remotePath=bilder/la_poesia&cachekilla="+random(999);
 
 
var aBilder:Array = new Array();
 
var aLink:Array = new Array();
 
var slideShow:SlideShow;
 
function initPics()
{
    //trace ("length: " + tempxml.length);
    for (var i = 0; i<amountNodes; i++)
    {
        pic = meinXML.firstChild.childNodes[i].firstChild.nodeValue;
        link = meinXML.firstChild.childNodes[i].attributes.link;
        aLink.push(link);
        aBilder.push(pic);
        //
        fehler += pic;
        // ergibt die richtigen bilder  
        fehler += aBilder[i];
        // bilder nicht ins array eingefügt!!!  
        fehler += "\n";
    }
    startShow();
}
var meinXML:XML = new XML();
meinXML.ignoreWhite = true;
meinXML.load(pfad);
meinXML.onLoad = function(status)
{
    if (status)
    {
        tempxml = meinXML.firstChild;
        amountNodes = meinXML.firstChild.childNodes.length;
        fehler = "";
        initPics();
        delete meinXML;
    }
    else
    {
        fehler = "Leider keine Bilder vorhanden.";
    }
};
startShow = function ():Void 

[stifflers mum]

sacht mal leute, kann oder will niemand helfen? ich brauch ja nur nen tipp. ich sitz alleine zu hause und hab sonst niemanden zum fragen...also wenn sich mal jemand bequemen könnte, dann wär ich sehr dankbar!

[PinkDragon]

Dann probier ichs halt

Also zuerstmal versteh ich dein Problem nicht ganz... hier mal meine Interpretation: Du willst eine xml-Datei dynamisch mit php erstellen (Ordnerstruktur usw auslesen) und diese xml-Datei dann mit Flash laden, oder?
Nur leider verstehe ich die Frage nicht:

ich hätte gerne einen hinweis daurauf, wie ich die xml-funktion (anbei) korrekt in das gallerie-script einfüge.

Die xml-Datei wird mit diesen beiden Befehlen ausgewertet

PHP-Code:

pic = meinXML.firstChild.childNodes[i].firstChild.nodeValue;
link = meinXML.firstChild.childNodes[i].attributes.link; 


Das sollte so auch funtkionieren. Ist dein Problem das Auslesen der Daten per php? Dazu brauchst du für den offline betrieb erstmal einen Webserver. Wenn du das ganze online stellenn willst, brauchst du einen Server, der das Auslesen der Verzeichnisse zulässt.

Naja wirklich helfen konnte ich dir vermutlich nicht, aber ich habs versucht...
Erkläre doch bitte, was du genau willst, mit "xml-funktion" kann ich absolut nichts anfangen

[stifflers mum]

hi ho, und dankeschön für deine bemühungen!

ich glaub das hilft mir schon, muss noch mehr verstehen lernen.
mein problem ist nur, das angefügte xml script, in die angefügten teile des galerie-scriptes richtig zu implementieren. momentan werden die bilder für die gallerie per loadmovie in jene geladen. ich möchte das aber nciht, sondern es soll aus der xml ausgelesen werden.

original fliegen die bilder aus loadmovie ja in ein arry (oder) und ich möchte halt, das die per xml herangeholten auch dahin gehen...

danke schonmal!

[PinkDragon]

Aha das ist ja schon mal n bischen klarer

Du musst nur noch wissen, wie eine xml-Datei aufgebaut ist. Mit der Funktion

PHP-Code:

function initPics(){
for (var i = 0; i<amountNodes; i++){        
    pic = meinXML.firstChild.childNodes[i].firstChild.nodeValue;
    link = meinXML.firstChild.childNodes[i].attributes.link;
    aLink.push(link);         
    aBilder.push(pic);
}
startShow();
} 


Damit liest du die xml-Datei aus und speicherst die Werte in einem Array. Dein Problem ist vermutlich, wie muss diese xml-Datei jetzt ausschauen, damit sie richtig geladen wird?
meinXML.firstChild greift auf das erste Element zu und childNodes[i] auf das i-te Unterelement. Dort wird mit attributes.link das Attribut Link ausgelesen.
Zum Veranschaulichen:

PHP-Code:

<bilder> //firstChild
  <child link="images/bild1.jpg">Bild1</child>  //firstChild.childNodes[1]
  <child link="images/bild2.jpg" /*Attribut "link"*/ >Bild2 /*nodeValue*/</child>
</bilder> 


War es das was du suchst?
Wenn nicht, ich werds weiter versuchen

mfg
PD