...

View Full Version : Get images from a folder and render it random into a banner?



CaptainB
03-26-2008, 09:17 PM
Hi guys,

First, I started out with a simple flash-movie where I putted all the pictures I wanted in my banner and rendered it. However, I have found that it isn't exactly what I'm looking for.

I don't know what to call it, so here goes an example:

I have a folder called: header_images. In that folder I put all the images I want to be rendered in my banner, each time random. The image should change to another one from the folder in like some minutes, just like a slideshow.

If I want to change or add an image to the banner slideshow, then I simple put it or delete it from the folder and the script will no longer render it into my banner.

I've already searched google and various websites, but I don't know what that kind of application is called, so any examples or tutorials would be really appriciated. If it even CAN be done?

_Aerospace_Eng_
03-26-2008, 09:35 PM
You will need to use a server side language to read the directory and generate an xml file with the images in a random order. Then you can use actionscript to read the dynamic xml file to get your photos and any other info you need.

CaptainB
03-26-2008, 10:35 PM
Thank you for your advice, Aerospace.

I did some research which turned into a nice tutorial on how to generate an .xml file with php. However, I'm now stuck - With no further knowledge in xml and actionscript I don't know what to do now.

Here's what I got so far, which should generate my .xml file (Added some comments to make it easier to figure out):

<?php
/*Inform if the script should invert Windows slashes (’\’ to ‘/’). It’s true if you run the script on Windows and then need to move it to Linux or another Unix platform. */
$invertSlash = false;

/*The list of directories the script should read and create an XML file for. Inform the path relative to the location of the xmlgen.php*/
$directoryList = array('images/header_images');

/*The name of the XML file to be generated.*/
$xmlFileName = 'header_images.xml';

/*The name of the root tag. (Applies to the order of the .xml file tags)*/
$rootTagName = 'Images';

/*The name of the root immediate child tags (the directory entries tag). (Applies to the order of the .xml file tags)*/
$childTagName = 'Image';

/*The tag list of each directory entry. You need to provide a pair of ‘tagName’ => ‘tagValue’ for each desired tag. */
$childTagList = array('name' => 'images/header_images');
?>

Any clues on where to continue?

_Aerospace_Eng_
03-26-2008, 11:44 PM
http://www.kirupa.com/web/xml/XMLwithFlash3.htm

Please do some searching on your own before asking a question.

CaptainB
03-27-2008, 12:10 AM
I did and I found what I looked for.

However, I still have problems. I found out how to load the xml file with following code: (http://www.flash-creations.com/notes/dynamic_xml.php)



// import the Delegate class
import mx.utils.Delegate;

// declare a new XML instance
var peoplexml:XML = new XML();

function onXmlLoaded(success:Boolean) {
if (success) {
// do whatever you want to do if the XML file was read successfully
// use peoplexml.firstChild to access the main node
} else {
// do whatever you want to do if an XML read error occurred
}
}

function init() {
// ignore tabs, returns, and other whitespace between nodes
peoplexml.ignoreWhite = true;

// set the scope of the onLoad function to the main timeline, not peoplexml
peoplexml.onLoad = Delegate.create(this, onXmlLoaded);

// start loading the file
peoplexml.load("file.xml");
}

init();

Try pasting the code above into a new blank movie, replacing "// do whatever you want to do if an XML read error occurred" with "trace('error reading file');" (without quotes) and you should see your error message, plus a Flash built-in error message, appear in the Output panel when the movie is tested.

But. As I've understood it, the php file I created (code in the previous post) should generate the xml file for me to load. However, when I load that php page, nothing gets generated = I have no xml file to load.

I don't think I've grasped the whole concept, and if I'm right about that, please enlighten me. All this is new to me.

_Aerospace_Eng_
03-27-2008, 02:24 AM
You need generate the xml file nodes and parent elements however you also need to pass the correct headers so the browser knows its an xml file. Something like this should work

<?php

/*
This is a sample file that reads through a directory, filters the jpg
files and builds an xmllist from it. After looking through this file, you'll
probably 'get the idea' and'll be able to setup your own directory.
*/


// search for jpg files
$filter = ".jpg";
// path to the directory you want to scan
$directory = "images/header_images/";


// read through the directory and filter files to an array
$d = dir($directory);
if ($d) {
while($entry=$d->read()) {
$ps = strpos(strtolower($entry), $filter);
if (!($ps === false)) {
$items[] = $entry;
}
}
$d->close();
shuffle($items);
}

// third, the playlist is built in an xspf format
// we'll first add an xml header and the opening tags ..
header("content-type:text/xml;charset=utf-8");

echo "<photolist xmlns='http://xspf.org/ns/0/'>\n";

// .. then we loop through the array ..
for($i=0; $i<sizeof($items); $i++) {
echo "<photo>".$directory.$items[$i]."</photo>";
}

// .. and last we add the closing tags
echo "</photolist>\n";

?>
Edit the directory if you need to, upload it, navigate to it, if it displays an xml file you are one step closer.

CaptainB
03-27-2008, 10:50 AM
Uhm, it doesn't...:


Something like this should work PHP Code:
Warning: shuffle() expects parameter 1 to be array, null given in C:\Documents and Settings\User\Path\To\File\generator.php on line 37

Warning: Cannot modify header information - headers already sent by (output started at C:\Documents and Settings\User\Path\To\File\generator.php:12) in C:\Documents and Settings\User\Path\To\File\generator.php on line 42

_Aerospace_Eng_
03-27-2008, 12:43 PM
Did you edit the path name? I tested this on my server and it works fine. Thats saying that the array was never populated. You will have to edit the filter as well if the images aren't jpg.

CaptainB
03-27-2008, 02:14 PM
Yeah, I did edit the file extension and the path, though the path was correct.

It's strange, I tested it on my local server, which did not work and returned the above errors, but when I tested it on my online server it worked.

However, no file is generated.

_Aerospace_Eng_
03-27-2008, 04:42 PM
Huh? That IS the xml file. Its not meant to generate a .xml file.

CaptainB
03-28-2008, 07:02 PM
Oh, I thought so as it was within the php tags, but now I really see.
Well, apparently it works then, as it returns no errors but just gives me this: http://behrentzs.com/sites/Hjemmeside/xml.php

Would that be correct? If yes, should I then paste the url into following code:

// import the Delegate class
import mx.utils.Delegate;

// declare a new XML instance
var peoplexml:XML = new XML();

function onXmlLoaded(success:Boolean) {
if (success) {
// do whatever you want to do if the XML file was read successfully
// use peoplexml.firstChild to access the main node
} else {
// do whatever you want to do if an XML read error occurred
}
}

function init() {
// ignore tabs, returns, and other whitespace between nodes
peoplexml.ignoreWhite = true;

// set the scope of the onLoad function to the main timeline, not peoplexml
peoplexml.onLoad = Delegate.create(this, onXmlLoaded);

// start loading the file
peoplexml.load("xml.php");
}

init();

Or what should I do?

_Aerospace_Eng_
03-29-2008, 06:38 PM
Yes thats accurate but its not reading the photos from the directory meaning the path to the directory is likely incorrect. It should return something like this: http://prod.freehostia.com/test.php

CaptainB
03-29-2008, 07:31 PM
There we go:

http://behrentzs.com/sites/Hjemmeside/xml.php

which results in:

// import the Delegate class
import mx.utils.Delegate;

// declare a new XML instance
var peoplexml:XML = new XML();

function onXmlLoaded(success:Boolean) {
if (success) {
// do whatever you want to do if the XML file was read successfully
// use peoplexml.firstChild to access the main node
} else {
// do whatever you want to do if an XML read error occurred
}
}

function init() {
// ignore tabs, returns, and other whitespace between nodes
peoplexml.ignoreWhite = true;

// set the scope of the onLoad function to the main timeline, not peoplexml
peoplexml.onLoad = Delegate.create(this, onXmlLoaded);

// start loading the file
peoplexml.load("xml.php");
}

init();

Right?

If correct, would I then insert the above code into a .as file and then somehow link to the file in my document or what should I do?

Thank you a lot for the help so far!! Without you I would not even have got started on this.

_Aerospace_Eng_
03-30-2008, 04:20 PM
Now you just have load the xml file into your flash document then loop through the nodes in the xml file. You just have to do some research on your own now.

CaptainB
03-30-2008, 07:50 PM
Okay, I tried some different things, but all didn't work. When I view the flash document nothing happens.

I don't think I've really got the grasp on this, but I'm trying. This is what I have so far, though it does not work.

As far as I've understood, the bottom part should loop the child notes.
But since I don't really know how to do it, I've gone through pretty many search results now, I still can't do it.


var xm:XML = new XML();//creating XML object
xm.ignoreWhite = true;//white spaces will be discarded
xm.onLoad = function() {//function will be call when xml file data loaded into xml object
trace(this)
};
xm.load("xml.php");//loading the xml file data into xml object


Song_Array = new Array;

myXML = new XML;
myXML.ignoreWhite = true;
myXML.onLoad = function(success:Boolean) {
trace("success: "+success);
trace("loaded: "+this.loaded);
trace("firstChild: "+this.firstChild.childNodes.length);
TotalNumOfSongs = this.firstChild.childNodes.length;
TotalNumOfInfoPerSong = this.firstChild.firstChild.childNodes.length;
for (var i=0; i<this.firstChild.childNodes.length; i++)
{
var _node = this.firstChild.childNodes[i];
Song_Array[i] = new Array();
trace("_node:"+_node.childNodes.length);
for (var j=0; j<_node.childNodes.length; j++)
{
Song_Array[i].push(_node.childNodes[j].firstChild.nodeValue);
trace("~~~ childNodes: "+_node.childNodes[j].firstChild.nodeValue);
}
}
//trace("songName, songArtist, songPath:"+ [songName, songArtist, songPath]);

trace("Song_Array.length: "+Song_Array[1]);
};
myXML.load("xml.php");

_Aerospace_Eng_
03-30-2008, 10:15 PM
Are the traces accurate? Check out this tutorial. http://gotoandlearn.com/player.php?id=22
Another tutorial using AS3, http://gotoandlearn.com/player.php?id=64

CaptainB
04-14-2008, 08:14 PM
Sorry for the very late answear, but I've been busy and did not have the time to work on the site.

I watched the links provided and decided to go for the first one, just without the forward / back buttons.

So, I tried to filter the script to make it fit my needs, but I have done something wrong as it does still not work.

The .swf file and the xml.php file is in my server root. The images are located in images --> header_images.

This is the actionscript I've got (where the fault is, I'm sure). I think it has something to do with the line in bold as it gets the url attribute from the xml file. But I'm not sure what I should put in there as I don't have an url attr. in my xml.php file.

var x:XML = new XML();
x.ignoreWhite = true;

var urls:Array = new Array(); /*stores the URLs of the photos*/

x.onLoad = function() {
var photos:Array = this.firstChild.childNodes;
for(i=0;i<photos.length;i++){
urls.push(photos[i].attributes.url);
}
holder.loadMovie(urls[0]);
}

x.load("xml.php");

and this is the xml.php file:

<?php

/*
This is a sample file that reads through a directory, filters the jpg
files and builds an xmllist from it. After looking through this file, you'll
probably 'get the idea' and'll be able to setup your own directory.
*/


// search for jpg files
$filter = ".jpg";
// path to the directory you want to scan
$directory = "images/header_images/";


// read through the directory and filter files to an array
$d = dir($directory);
if ($d) {
while($entry=$d->read()) {
$ps = strpos(strtolower($entry), $filter);
if (!($ps === false)) {
$items[] = $entry;
}
}
$d->close();
shuffle($items);
}

// third, the playlist is built in an xspf format
// we'll first add an xml header and the opening tags ..
header("content-type:text/xml;charset=utf-8");

echo "<photolist xmlns='http://xspf.org/ns/0/'>\n";

// .. then we loop through the array ..
for($i=0; $i<sizeof($items); $i++) {
echo "<photo>".$directory.$items[$i]."</photo>";
}

// .. and last we add the closing tags
echo "</photolist>\n";

?>

gnomeontherun
04-16-2008, 09:26 PM
Well you could change your PHP file here:


// .. then we loop through the array ..
for($i=0; $i<sizeof($items); $i++) {
echo "<photo url=\".$directory.$items[$i]."\"></photo>";
}

That way the xml file fits the code AS. I think I'm understanding what you mean correctly...

CaptainB
04-17-2008, 08:13 AM
Unfortynately that just gives me these errors: :(


Warning: Unexpected character in input: '\' (ASCII=92) state=1 in C:\XXX\XXX\XXX\xampplite\htdocs\Hjemmeside\xml.php on line 37

Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING, expecting ',' or ';' in C:\XXX\XXX\XXX\xampplite\htdocs\Hjemmeside\xml.php on line 37

gnomeontherun
04-17-2008, 03:31 PM
Oops. Php isn't my forte. Try this - I forgot a "


// .. then we loop through the array ..
for($i=0; $i<sizeof($items); $i++) {
echo "<photo url=\"" . $directory.$items[$i] . "\"></photo>";
}

aWishResigned
04-17-2008, 11:36 PM
Sorry, didn't realize there was a second page...

CaptainB
04-18-2008, 07:21 PM
That didn't return any errors, however it still just gives me a black square in the flash file :(

xml: http://behrentzs.com/test/Flash/xml.php
Flash: http://behrentzs.com/test/Flash/Untitled-1.swf

Got any more ideas? :)

_Aerospace_Eng_
04-18-2008, 07:55 PM
Can you attach your .fla file?

CaptainB
04-18-2008, 08:31 PM
Sure:

gnomeontherun
04-18-2008, 09:18 PM
You have an issue with capitalization. Your movie clip is called Holder, but you reference it as holder. They need to be the same. I would suggest changing the movieclip name to holder.

Your php file is outputting the an improper url as well. It was missing a /.

// .. then we loop through the array ..
for($i=0; $i<sizeof($items); $i++) {
echo "<photo url=\"" . $directory."/".$items[$i] . "\"></photo>";
}

That might fix it, but I can't tell without the PHP file getting the files correctly.

CaptainB
04-18-2008, 10:55 PM
You guys ARE the ones!! The 'holder' issue fixed it!
Thanks a bunch!

CaptainB
04-18-2008, 11:00 PM
Now there's just one minor problem, hehe. How would I position this thing right? It's kinda offset..and well, doesn't render a different image unless you refresh the xml.php file and then go refresh the flash file.

http://behrentzs.com/test/Flash/Untitled-1.swf

gnomeontherun
04-18-2008, 11:26 PM
Open the FLA and click ONCE on the holder. You should see a little circle that has crosshairs in the center, that is your center point. Click that circle and drag it to the top left corner of the box and resave it.

It is currently using that point as the reference point to load from, so if you place it at the top left of the banner, it should work correctly.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum