Loading external images (library)

[Geert81]

Hello,

I want to make a photo uploader and after uploading the photo to the server you can load all the photo's that are in a folder in kind of a library.

I can load one single image because I name it in AS but I want to load the whole "images" folder so I can see all the pictures that are in it.
Is this possible? And is there someone who did dat before and that can help me?
Some help would be very nice

Thanks!

Geert

"This is what I got so far"

load_btn.addEventListener(MouseEvent.CLICK, LoadBox);

function LoadBox(event:MouseEvent):void {
    //create a Loader instance
var myImageLoader:Loader = new Loader();
//create a  URLRequest instance to indicate the image source
var myImageLocation:URLRequest = new URLRequest("url to website");
// load the bitmap data from the image source in the Loader instance
myImageLoader.load(myImageLocation);
// add the Loader instance to the display list
addChild(myImageLoader);

}

[5TonsOfFlax]

You can't load an entire folder at once. To know all the contents of a folder, your server will need to have some script which produces a list of those images. Apache and some other servers can be set to list directory contents, but I don't suggest that. Instead have your server generate an xml file which lists the images. Load the xml first, then use that to load the individual images.

[Geert81]

Hi,

Tnx for your reply.

So what I have to do is let my server (PHP file or ? ) generate a xml file so that my Flash can read those into movieclips or something?

To be honest I dont know where to start. Can you help me or is there a tutorial about this subject?

Thanks!

Geert

[5TonsOfFlax]

Yes, have PHP our some other server-side script generate an xml file that looks something like this:

<images>
  <image>/somedir/a.jpg</image>
  <image>/somedir/horse.jpg</image>
</images>

Load that and parse out the image nodes and use those to get the urls of the actual images.

[Geert81]

When you are saying that it sounds so easy but I think it is going to be a hell of a job for me...

We will see how far I get

Tnx for your time and help

[Geert81]

Hi,

I found a tutorial and I got it working only one thing is going wrong...
The images are shown its original size.. they not fit in my movieclip..

How can I make that work?

I will attach the files with MegaUpload

http://www.megaupload.com/?d=056NQIIF

Here is the Link btw so you can see it

http://www.photo-upload.justenter.nl/Loader/gallery.swf

Tnx!

[5TonsOfFlax]

You can adjust the scaleX and scaleY properties of the Loader or Bitmap. The scale you want is the desired size / actual size.

[doggbiter]

I'd like to pick up where this question left off if the OP doesn't mind...

Let's say I have a (random) number of images I want to load through an xml file like the one previous, and I want to load them in frame 1 into loaders. Is there a way to load them into an array for reference later in the movie?

Any ideas?

[5TonsOfFlax]

Of course. You can put the Loaders in an array just like you'd put anything else in an array.

[doggbiter]

Can somebody take a look at this. It just hangs after loading the loadArray() and never goes to the second frame. I know the XML pull is working fine, all vars are declared and the XML list is correct.

var xmlURL:URLRequest = new URLRequest("gallery.xml");
    var xmlLoader:URLLoader = new URLLoader();
    var galleryXML:XML;
    var galleryList:XMLList = new XMLList();
    var soundList:XMLList = new XMLList();
            xmlLoader.addEventListener(Event.COMPLETE, buildXMLList, false, 0, true);
            xmlLoader.load(xmlURL);
    
function buildXMLList(evt:Event):void {
    galleryXML = new XML(evt.target.data);
    galleryList = galleryXML.img;
    soundList= galleryXML.snd;
    trackURL = String(soundList.attribute("src")[0]);
    trackLength = Number(soundList.attribute("seconds")[0]);
    totalPics = galleryList.length();
    for (var i:Number=0; i<galleryList.length(); i++) { 
        imgArray[i] = galleryList.attribute("src")[i];
        delayArray[i] = Number(galleryList.attribute("duration")[i]);
     }//for
    loadInitialImg();
}


function loadInitialImg():void {
    for (var i:Number=0; i<galleryList.length(); i++) {
        imgURL = new URLRequest(galleryList.attribute("src")[i]); 
        loadArray[i] = new Loader();
        loadArray[i].load(imgURL);
        trace(loadArray[i]);
    }//for
    gotoAndStop(2);
}

[5TonsOfFlax]

You don't have a loadArray method, so I'm guessing you mean it appears to hang somewhere in loadInitialImg?

I don't see any of your arrays declared, but you say they are so I'll take your word for it. You're using a imgURL variable which is not local to the loadInitialImg function, but that shouldn't have any effect as long as you're not actually using it outside the function.

Why are you creating the imgArray, and not using it? You re-parse the galleryList xml to get your imgURLs.

You are not putting your Loaders on the display list. Did you intend for them to show up at this stage?

Are you running in debug mode? What output do you see from the trace? Do you get any errors, including "a script has executed longer than 15 seconds"?

[doggbiter]

You don't have a loadArray method, so I'm guessing you mean it appears to hang somewhere in loadInitialImg?

I don't see any of your arrays declared, but you say they are so I'll take your word for it. You're using a imgURL variable which is not local to the loadInitialImg function, but that shouldn't have any effect as long as you're not actually using it outside the function.

Why are you creating the imgArray, and not using it? You re-parse the galleryList xml to get your imgURLs.

You are not putting your Loaders on the display list. Did you intend for them to show up at this stage?

Are you running in debug mode? What output do you see from the trace? Do you get any errors, including "a script has executed longer than 15 seconds"?

Thanks for looking at that. Here is what's weird-- when i just Test Movie, it plays just fine. The pictures start cycling based on time increments ("duration") on the second frame. It only hangs when i test streaming.

I condensed the array on your suggestion. It was like that because of "code rot" from previous attempts to make it work. Here's what it looks like:

function buildXMLList(evt:Event):void {
  galleryXML = new XML(evt.target.data);
  galleryList = galleryXML.img;
  soundList= galleryXML.snd;
  trackURL = String(soundList.attribute("src")[0]);
  trackLength = Number(soundList.attribute("seconds")[0]);
  totalPics = galleryList.length();
  for (var i:Number=0; i<galleryList.length(); i++) {	
       imgURL = new URLRequest(galleryList.attribute("src")[i]);
       loadArray[i] = new Loader();
       loadArray[i].load(imgURL);
       delayArray[i] = Number(galleryList.attribute("duration")[i]);
       trace(galleryList.attribute("src")[i]);
       trace(loadArray[i]);
   }//for
    gotoAndStop(2);
}

Here's the output (which looks correct to me):
images/pic0.jpg
[object Loader]
images/pic1.jpg
[object Loader]
images/pic2.jpg
[object Loader]
images/pic3.jpg
[object Loader]
Lastly, in Debug mode, all that shows is the initial "stop()" in the first frame.

Thanks again!

[5TonsOfFlax]

I don't get the Debug mode thing. I just was asking if you got any errors.

Are you positive it's not going to the second frame? How do you know? You aren't putting the loaders on the display in this code, and if your code on the second frame depends on the images having already loaded that would be a problem. They are not guaranteed to load before the gotoAndStop is called. In fact, it's nearly certain they will not. You might want to put complete listeners on the loaderinfos for those loaders and only go to the second frame after they've all completed.

[Geert81]

Hello again,

I still cant get the pictures in right size... You said I have to change the ScaleY and ScaleX of the loader but I seriously dont know where to edit this

[5TonsOfFlax]

You don't have the loaded pictures dimensions until it has loaded, so the logical place to do calculations using those values is in the COMPLETE listener.

Something like this:

function loadComplete(e:Event):void{
  var loader:Loader = LoaderInfo(e.target).loader;
  var content:DisplayObject = loader.content;
  loader.scaleX = desiredWidth / content.width;
  loader.scaleY = desiredHeight / content.height;
  //any other manipulation you need to do, such as actually adding the loader to the display if it's not already.
}

[Geert81]

5TonsOfFlax! Thankyou!

It's working perfect now!

[Geert81]

5TonsOfFlax! Thankyou!

It's working perfect now!