dcsimg
A Flash Developer Resource Site

Results 1 to 3 of 3

Thread: 3D Carousel

  1. #1
    Member
    Join Date
    Sep 2004
    Posts
    40

    3D Carousel

    Hi I followed Lee's Creating a 3D carousel part 3.

    http://www.gotoandlearn.com/play?id=34

    I have constructed it as he explained. I am just trying to change one element of it. When a icon is pressed I want a larger image to be displayed instead of the current image size.

    I edited the xml file:
    Code:
    <icon image="icon1.png" largeImage="icon1b.png" tooltip="Multi Purpose - 8'' 2108XPRO" content="LimeWire is a peer-to-peer file sharing client for the Gnutella network. It is free software released under the GNU General Public License. Limewire was the first file sharing program to support firewall-to-firewall file transfers, a feature introduced in version 4.2, which was released in November 2004.LimeWire is written in Java and therefore runs on any computer with a Java Virtual Machine installed. To facilitate installation for casual users, installation packages are available for Microsoft Windows, Mac OS X, and in the RPM format for Linux. Support for Mac OS 9 and previous versions has been dropped with LimeWire 4.0.10. The Windows version of the LimeWire installer includes a version of Sun Microsystems' Java installer which will download and install version 1.5 of the Java Runtime Environment if it detects the machine does not have a recent version of Java installed."/>
    The actionscript:
    Code:
    import mx.utils.Delegate;
    import mx.transitions.Tween;
    import mx.transitions.easing.*;
    
    var numOfItems:Number;
    var radiusX:Number = 300;
    var radiusY:Number = 75;
    var centerX:Number = Stage.width/2;
    var centerY:Number = Stage.height/2;
    //experiment the speed here
    var speed:Number = 0.05;
    var perspective:Number = 130;
    var home:MovieClip = this;
    theText._alpha = 0;
    
    var tooltip:MovieClip = this.attachMovie("tooltip","tooltip",10000);
    tooltip._alpha = 0;
    
    var xml:XML = new XML();
    xml.ignoreWhite = true;
    
    xml.onLoad = function()
    {
    	var nodes = this.firstChild.childNodes;
    	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.toolText = nodes[i].attributes.tooltip;
    		t.content = nodes[i].attributes.content;
    		t.icon.inner.loadMovie(nodes[i].attributes.Image);
    		t.ref.inner.loadMovie(nodes[i].attributes.image);
    		t.icon.the2nd.loadMovie(nodes[i].attributes.largeImage);//attach instance the2nd to largeImage in XML file
    		t.icon.onRollOver = over;
    		t.icon.onRollOut = out;
    		t.icon.onRelease = released;
    	}
    }
    
    function over()
    {
    	home.tooltip.tipText.text = this._parent.toolText;
    	home.tooltip._x = this._parent._x;
    	home.tooltip._y = this._parent._y - this._parent._height/2;
    	home.tooltip.onEnterFrame = Delegate.create(this,moveTip);
    	home.tooltip._alpha = 100;
    }
    
    function out()
    {
    	delete home.tooltip.onEnterFrame;
    	home.tooltip._alpha = 0;
    }
    
    function released()
    {
    	//trace(this._parent.toolText);
    	home.tooltip._alpha = 0;
    	for(var i=0;i<numOfItems;i++)
    	{
    		var t:MovieClip = the2nd["item"+i];
    		t.xPos = t._x;
    		t.yPos = t._y;
    		t.theScale = t._xscale;
    		delete t.icon.onRollOver;
    		delete t.icon.onRollOut;
    		delete t.icon.onRelease;
    		delete t.onEnterFrame;
    		if(t != this._parent)
    		{
    			var tw:Tween = new Tween(t,"_xscale",Strong.easeOut,t._xscale,0,1,true);
    			var tw2:Tween = new Tween(t,"_yscale",Strong.easeOut,t._yscale,0,1,true);
    			var tw3:Tween = new Tween(t,"_alpha",Strong.easeOut,100,0,1,true);
    		}
    		else
    		{
    			var tw:Tween = new Tween(t,"_xscale",Strong.easeOut,t._xscale,100,1,true);
    			var tw2:Tween = new Tween(t,"_yscale",Strong.easeOut,t._yscale,100,1,true);
    			var tw3:Tween = new Tween(t,"_x",Strong.easeOut,t._x,200,1,true);
    			var tw4:Tween = new Tween(t,"_y",Strong.easeOut,t._y,320,1,true);
    			var tw5:Tween = new Tween(theText,"_alpha",Strong.easeOut,0,100,1,true);
    			theText.text = t.content;
    			var s:Object = this;
    			tw.onMotionStopped = function()
    			{
    				s.onRelease = unReleased;
    				//delete t.icon.onRollOver;
    				//delete t.icon.onRollOut;
    				//delete t.icon.onRelease;
    				//delete t.onEnterFrame;
    
    			}
    		}
    	}
    }
    
    function unReleased()
    {
    	delete this.onRelease;
    	var tw:Tween = new Tween(theText,"_alpha",Strong.easeOut,100,0,0.5,true);
    	for(var i=0;i<numOfItems;i++)
    	{
    		var t:MovieClip = home["item"+i];
    		if(t != this._parent)
    		{
    			var tw:Tween = new Tween(t,"_xscale",Strong.easeOut,0,t.theScale,1,true);
    			var tw2:Tween = new Tween(t,"_yscale",Strong.easeOut,0,t.theScale,1,true);
    			var tw3:Tween = new Tween(t,"_alpha",Strong.easeOut,0,100,1,true);
    		}
    		else
    		{
    			var tw:Tween = new Tween(t,"_xscale",Strong.easeOut,100,t.theScale,1,true);
    			var tw2:Tween = new Tween(t,"_yscale",Strong.easeOut,100,t.theScale,1,true);
    			var tw3:Tween = new Tween(t,"_x",Strong.easeOut,t._x,t.xPos,1,true);
    			var tw4:Tween = new Tween(t,"_y",Strong.easeOut,t._y,t.yPos,1,true);
    			tw.onMotionStopped = function()
    			{
    				for(var i=0;i<numOfItems;i++)
    				{
    					var t:MovieClip = home["item"+i];
    					t.icon.onRollOver = Delegate.create(t.icon,over);
    					t.icon.onRollOut = Delegate.create(t.icon,out);
    					t.icon.onRelease = Delegate.create(t.icon,released);
    					t.onEnterFrame = mover;
    				}
    			}
    		}
    	}
    }
    
    function moveTip()
    {
    	home.tooltip._x = this._parent._x;
    	home.tooltip._y = this._parent._y - this._parent._height/2;
    }
    
    
    xml.load("icons.xml");
    
    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;
    }
    
    
    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);
    	this._xscale = this._yscale = s * 100;
    	this.angle += this._parent.speed;
    	this.swapDepths(Math.round(this._xscale) + 100);
    }
    
    this.onMouseMove = function()
    {
    	//speed of carousel
    	speed = (this._xmouse-centerX)/2500;
    }
    This does not work as it comes up with the error opening URL undefined. My edits are highlighted in red. Any ideas how i can get this to work?

  2. #2
    :
    Join Date
    Dec 2002
    Posts
    3,518
    Code:
    		var t = home.attachMovie("item", "item"+i, i+1);
    		t.angle = i*((Math.PI*2)/numOfItems);
    		t.onEnterFrame = mover;
    		t.toolText = nodes[i].attributes.tooltip;
    		t.content = nodes[i].attributes.content;
    		//t.icon.inner.loadMovie(nodes[i].attributes.Image);
    		t.icon.inner.loadMovie(nodes[i].attributes.image);
    		t.ref.inner.loadMovie(nodes[i].attributes.image);
    		t.icon.the2nd.loadMovie(nodes[i].attributes.largeImage);//attach instance the2nd to largeImage in XML file
    		t.icon.onRollOver = over;
    		t.icon.onRollOut = out;
    		t.icon.onRelease = released;
    	}

  3. #3
    Junior Member
    Join Date
    Aug 2009
    Posts
    17
    Did you manage to get this working?? I'm looking for the same thing...

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center