homepage Welcome to WebmasterWorld Guest from 54.145.191.14
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / Flash and Shockwave
Forum Library, Charter, Moderator: open

Flash and Shockwave Forum

    
Problem loading images into Flash carousel via XML
Problem loading images into Flash carousel via XML
galahad2

5+ Year Member



 
Msg#: 3621143 posted 7:11 pm on Apr 7, 2008 (gmt 0)

I'm having a problem with a Flash carousel player which I'm trying to set up, where each of the carousel items is a different file (at present I'm trying to test with images but in time these will be FLV video files).

The carousel is based on the ones demo'd at www.gotoandlearn.com. I followed the second of the tutorials and have got to the point where I've created a movie clip inside a movie clip inside a movie clip (required for the carousel) and have the accompanying ActionScript working, however when I preview the SWF file I only see the "filler shape" of the innermost movie clip, not the image file (.png) that it's supposed to contain.

The three movie clips are called item (the outermost), icon (inside item) and inner (the innermost). The outermost one ("item") is the one set to "export to ActionScript".

The images are grabbed from an XML file. The ActionScript is as follows:

var numOfItems:Number; //don't declare yet as number of items will be read from XML
var radiusX:Number = 250;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var perspective:Number = 130; //skew the perspective so items further back are smaller
var home:MovieClip = this; //create variable to be used inside the XML for loop later as we can't use "this" inside that loop

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

xml.onLoad = function()
{
var nodes = this.firstChild.childNodes; //i.e the XML file hierarchy
numOfItems = nodes.length;
for (var i=0;i<numOfItems;i++)
{
var t = home.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.icon.inner.loadMovie (nodes[i].attributes.image); //load the image files
}
}

for (var i=0;i<numOfItems;i++)
{
var t = this.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
}

xml.load("icons.xml");

function mover ()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective)/(centerY + radiusY - perspective); //add the new perspective variable to the calculation
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale)+100);
}
this.onMouseMove = function()
{
speed = (this._xmouse-centerX)/2000;
}

The XML file:

<?xml version="1.0" encoding="iso-8859-1"?>
<icons>

<icon image="icon1.png" />

<icon image="icon2.png" />

</icons>

The XML file seems to be read (to a degree) by the ActionScript, because if I had a new "icon" item, the carousel "grows" another item accordingly (although as before, it only displays the background shape of the image "placeholder" movie clip).

Amyone got any ideas?

 

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3621143 posted 4:16 pm on Apr 8, 2008 (gmt 0)

Sorry I'm not going to be much help - but when I encounter these situations, most often I put a text box in the Flash and have it display the value if the missing element, since you can't trace live SWF's. I'm guessing a path issue? Does it work when tested within the authoring environment? If not, use trace() to get that working first. Trace them through, make sure the right image file names are being referenced, make sure they are visible, etc.

What caught my eye is this:
at present I'm trying to test with images but in time these will be FLV video files

If this is your eventual goal, this won't work with video. Video has a begin and an end, you need to take your "next action" on queue of the previous video's end. Timing it will not work due to differences in download speed, plus there's issues with preload, play, and differing lengths of movies.

galahad2

5+ Year Member



 
Msg#: 3621143 posted 4:35 pm on Apr 8, 2008 (gmt 0)

Hi, thanks for the reply- I did check the paths and the XML and FLA are in the same directory, and the XML is being read somehow (for example, adding a new item spawns a new item in the SWF when played). It seems that it's just the actual image itself that doesn't display- it just shows the background shape of the innermost movie clip.

It doesn't work within the authoring environment or when embedded in a page.

With regards the FLV files that I hope to "embed", these will categorically not play within the carousel item?

A getaround might be to simply have a link to the FLV object on the carousel item (problem is, it gives the user one more thing to have to click and contend with)- presumably this would work though? (assuming I can get past this current impasse!)

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3621143 posted 6:21 pm on Apr 10, 2008 (gmt 0)

Without being there, I'm shooting in the dark, but maybe the following will help.

I did check the paths and the XML and FLA are in the same directory,

Here I hope you mean images. :-) Different methods are used to load movies as opposed to images or other static data.

it just shows the background shape of the innermost movie clip. . . . It doesn't work within the authoring environment or when embedded in a page.

Are you familiar with the trace() command in Flash? In the authoring environment, this will be one of the most useful debugging tools. Follow your ActionScript through and wherever you suspect a problem, insert trace().

var nextImg = imgArray[i];
trace('next image should be ' + nextImg);

You can store variables in it or just use it for benchmark messages to see if a function is loading:

onEnterFrame = function() { trace('got to frame 4'); }

A window will pop up with the values as it's running. This will only work when testing from the authoring environment, and if you export it with trace() in the coding, it won't hurt a thing, it's all ignored when exporting to .swf. Trace the project through, see why the images aren't loading up.

With regards the FLV files that I hope to "embed", these will categorically not play within the carousel item?

It sounds like you have an image viewer, right? Somewhere in this project will be a setting for how long each will display - example, 5 seconds. When the image loads, a timer is set to move to the next images.

If you have 10 second video clips, it will change halfway through the video. You need to set the timer off on the end of the video, whenever that is.

galahad2

5+ Year Member



 
Msg#: 3621143 posted 8:46 am on Apr 11, 2008 (gmt 0)

Okay, I inserted trace commands as follows in the script:

var numOfItems:Number; //don't declare yet as number of items will be read from XML
var radiusX:Number = 250;
var radiusY:Number = 75;
var centerX:Number = Stage.width/2;
var centerY:Number = Stage.height/2;
var speed:Number = 0.05;
var perspective:Number = 130; //skew the perspective so items further back are smaller
var home:MovieClip = this; //create variable to be used inside the XML for loop later as we can't use "this" inside that loop
var xml:XML = new XML();
xml.ignoreWhite = true;
trace(xml.ignoreWhite);
xml.onLoad = function()
{
var nodes = this.firstChild.childNodes; //i.e the XML file hierarchy
numOfItems = nodes.length;
for (var i=0;i<numOfItems;i++)
{
var t = home.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.icon.inner.loadMovie (nodes[i].attributes.image); //load the image files
}
}
trace(t.icon.inner.loadMovie);
for (var i=0;i<numOfItems;i++)
{
var t = this.attachMovie("item","item"+i,i+1);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
}
trace(t.onEnterFrame);
xml.load("icons.xml");
trace(xml.load);
function mover ()
{
this._x = Math.cos(this.angle) * radiusX + centerX;
this._y = Math.sin(this.angle) * radiusY + centerY;
var s:Number = (this._y - perspective)/(centerY + radiusY - perspective); //add the new perspective variable to the calculation
this._xscale = this._yscale = s * 100;
this.angle += this._parent.speed;
this.swapDepths(Math.round(this._xscale)+100);
}
this.onMouseMove = function()
{
speed = (this._xmouse-centerX)/2000;
}
trace(this.onMouseMove);

But the output I got wasn't particularly helpful. Output was:

true
undefined
undefined
[type Function]
[type Function]

Any ideas?

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3621143 posted 4:05 pm on Apr 11, 2008 (gmt 0)

What do you get when you do this?

xml.onLoad = function()
{
var nodes = this.firstChild.childNodes; //i.e the XML file hierarchy
numOfItems = nodes.length;
for (var i=0;i<numOfItems;i++)
{
var t = home.attachMovie("item","item"+i,i+1);
trace(' item ' + i + ' ' + "item"+i);
t.angle = i * ((Math.PI*2)/numOfItems);
t.onEnterFrame = mover;
t.icon.inner.loadMovie (nodes[i].attributes.image);
trace(nodes[i].attributes.image);
}
}

This should give you the names of the items, followed by file name of the images that are supposed to load.

galahad2

5+ Year Member



 
Msg#: 3621143 posted 1:40 pm on Apr 14, 2008 (gmt 0)

Okay, tried this and got more output as follows:

true
undefined
undefined
[type Function]
[type Function]
item 0 item0
icon1.png
item 1 item1
icon2.png
item 2 item2
icon2.png

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3621143 posted 2:16 pm on Apr 15, 2008 (gmt 0)

Galahad could you PM the link to the version you used, I'll see if I can pick it apart.

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3621143 posted 5:25 pm on Apr 16, 2008 (gmt 0)

Well I've had a look, sorry to say I won't be a lot of help. I see you've changed the nature of the "icon" symbol. I downloaded the original and it's working fine, I would suggest to start with the original again and retrace your steps. It's most likely something in those symbols that you changed that isn't working.

galahad2

5+ Year Member



 
Msg#: 3621143 posted 6:27 pm on Apr 16, 2008 (gmt 0)

Ok, well thanks for taking the time to investigate- I appreciate it!

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / Flash and Shockwave
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved