How to make etsy.com Time Machine Part two

devinstar · April 10, 2006, 8:18pm

Hi all,

Okay what I want to make it this:

http://www.etsy.com/time_machine.php#goods

What I have come up with so far is this:

http://www.devincheevers.com/3D/click_zoom.html

The problem with mine is that it draws all the ‘items’ at once where as the etsy.com one only draw a certain amount and then wait till you zoom in to draw the rest.

Any idea on how to do this?

nathan99 · April 10, 2006, 9:13pm

do you have a fla to work with?

joran420 · April 10, 2006, 11:07pm

Take a look at this code

I dont know who originally wrote it but Deceptive posted it in my thread about spirals

play around with it to get it to repsond how you want

[FONT=Courier New][LEFT][COLOR=#000000]function[/COLOR] setBrightness[COLOR=#000000]([/COLOR]col:[COLOR=#0000ff]Color[/COLOR], brightness:[COLOR=#0000ff]Number[/COLOR][COLOR=#000000])[/COLOR]:[COLOR=#0000ff]Void[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#000000]var[/COLOR] anum:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]100[/COLOR]-brightness;
[COLOR=#000000]var[/COLOR] bnum:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]255[/COLOR]/[COLOR=#000080]100[/COLOR]brightness;
col.[COLOR=#0000ff]setTransform[/COLOR][COLOR=#000000]([/COLOR][COLOR=#000000]{[/COLOR]re:anum, ga:anum, ba:anum, rb:bnum, gb:bnum, bb:bnum, aa:[COLOR=#000080]100[/COLOR], ab:[COLOR=#000080]0[/COLOR][COLOR=#000000]}[/COLOR][COLOR=#000000])[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]var[/COLOR] scaleMax:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]800[/COLOR];
[COLOR=#000000]var[/COLOR] fadeOut:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]0[/COLOR].[COLOR=#000080]93[/COLOR];
[COLOR=#000000]var[/COLOR] frequency:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]10[/COLOR];
[COLOR=#000000]var[/COLOR] colMin:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]0[/COLOR];
[COLOR=#000000]var[/COLOR] colMax:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]40[/COLOR];
[COLOR=#000000]var[/COLOR] colVariance:[COLOR=#0000ff]Number[/COLOR] = colMax-colMin;
[COLOR=#000000]function[/COLOR] hRadCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] [COLOR=#000080]4[/COLOR]+[COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]random[/COLOR]COLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]function[/COLOR] vRadCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] [COLOR=#000080]4[/COLOR]+[COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]random[/COLOR]COLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]function[/COLOR] vRadIncCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] [COLOR=#000080]0[/COLOR].[COLOR=#000080]1[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]function[/COLOR] hRadIncCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] [COLOR=#000080]0[/COLOR].[COLOR=#000080]1[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]function[/COLOR] lrSpeedCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] [COLOR=#000080]5[/COLOR]+[COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]random[/COLOR]COLOR=#000000[/COLOR][COLOR=#000080]40[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]function[/COLOR] scaleUpSpeedCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] [COLOR=#000080]1[/COLOR].[COLOR=#000080]02[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]function[/COLOR] nooColCOLOR=#000000[/COLOR]:[COLOR=#0000ff]Number[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]return[/COLOR] colMin+[COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]random[/COLOR]COLOR=#000000[/COLOR]colVariance;
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]var[/COLOR] depth:[COLOR=#0000ff]Number[/COLOR] = [COLOR=#000080]0[/COLOR];
[COLOR=#0000ff]onEnterFrame[/COLOR] = [COLOR=#000000]function[/COLOR] COLOR=#000000[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]if[/COLOR] [COLOR=#000000]([/COLOR][COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]floor[/COLOR]COLOR=#000000[/COLOR] == [COLOR=#000080]0[/COLOR][COLOR=#000000])[/COLOR] [COLOR=#000000]{[/COLOR]
depth++;
[COLOR=#000000]var[/COLOR] noo:[COLOR=#0000ff]MovieClip[/COLOR] = [COLOR=#0000ff]_root[/COLOR].[COLOR=#0000ff]attachMovie[/COLOR][COLOR=#000000]([/COLOR][COLOR=#ff0000]“ball”[/COLOR], [COLOR=#ff0000]“ball”[/COLOR]+depth, depth[COLOR=#000000])[/COLOR];
[COLOR=#000000]var[/COLOR] col:[COLOR=#0000ff]Color[/COLOR] = [COLOR=#000000]new[/COLOR] [COLOR=#0000ff]Color[/COLOR]COLOR=#000000[/COLOR];
setBrightness[COLOR=#000000]([/COLOR]col, nooColCOLOR=#000000[/COLOR][COLOR=#000000])[/COLOR];
noo.[COLOR=#0000ff]_x[/COLOR] = -[COLOR=#000080]50[/COLOR];
noo.[COLOR=#0000ff]_y[/COLOR] = -[COLOR=#000080]50[/COLOR];
noo.[COLOR=#0000ff]_xscale[/COLOR] = noo.[COLOR=#0000ff]_yscale[/COLOR]=[COLOR=#000080]10[/COLOR];
noo.[COLOR=#000080]scaleSpeed[/COLOR] = scaleUpSpeedCOLOR=#000000[/COLOR];
noo.[COLOR=#000080]lrSpeed[/COLOR] = lrSpeedCOLOR=#000000[/COLOR];
noo.[COLOR=#000080]hRad[/COLOR] = hRadCOLOR=#000000[/COLOR];
noo.[COLOR=#000080]vRad[/COLOR] = vRadCOLOR=#000000[/COLOR];
noo.[COLOR=#000080]hRadInc[/COLOR] = hRadIncCOLOR=#000000[/COLOR];
noo.[COLOR=#000080]vRadInc[/COLOR] = vRadIncCOLOR=#000000[/COLOR];
noo.[COLOR=#000080]lr[/COLOR] = [COLOR=#000080]0[/COLOR];
noo.[COLOR=#0000ff]onEnterFrame[/COLOR] = [COLOR=#0000ff]_root[/COLOR].[COLOR=#000080]expand[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]}[/COLOR];
[COLOR=#000000]function[/COLOR] expandCOLOR=#000000[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]this[/COLOR].[COLOR=#000080]lr[/COLOR] += [COLOR=#0000ff]this[/COLOR].[COLOR=#000080]lrSpeed[/COLOR];
[COLOR=#0000ff]this[/COLOR].[COLOR=#000080]hRad[/COLOR] += [COLOR=#0000ff]this[/COLOR].[COLOR=#000080]hRadInc[/COLOR];
[COLOR=#0000ff]this[/COLOR].[COLOR=#000080]vRad[/COLOR] += [COLOR=#0000ff]this[/COLOR].[COLOR=#000080]vRadInc[/COLOR];
[COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]_x[/COLOR] = [COLOR=#0000ff]Stage[/COLOR].[COLOR=#0000ff]width[/COLOR]/[COLOR=#000080]2[/COLOR]+[COLOR=#0000ff]this[/COLOR].[COLOR=#000080]hRad[/COLOR][COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]sin[/COLOR]COLOR=#000000[/COLOR];
[COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]_y[/COLOR] = [COLOR=#0000ff]Stage[/COLOR].[COLOR=#0000ff]width[/COLOR]/[COLOR=#000080]2[/COLOR]+[COLOR=#0000ff]this[/COLOR].[COLOR=#000080]vRad[/COLOR]*[COLOR=#0000ff]Math[/COLOR].[COLOR=#0000ff]cos[/COLOR]COLOR=#000000[/COLOR];
[COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]_yscale[/COLOR] = [COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]_xscale[/COLOR] *= [COLOR=#0000ff]this[/COLOR].[COLOR=#000080]scaleSpeed[/COLOR];
[COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]swapDepths[/COLOR]COLOR=#000000[/COLOR];
[COLOR=#0000ff]if[/COLOR] COLOR=#000000[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]_alpha[/COLOR] *= [COLOR=#0000ff]_root[/COLOR].[COLOR=#000080]fadeOut[/COLOR];
[COLOR=#0000ff]if[/COLOR] COLOR=#000000[/COLOR] [COLOR=#000000]{[/COLOR]
[COLOR=#0000ff]this[/COLOR].[COLOR=#0000ff]removeMovieClip[/COLOR]COLOR=#000000[/COLOR];
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]}[/COLOR]
[COLOR=#000000]}[/COLOR]
[/LEFT]
[/FONT]

Greggeh · April 11, 2006, 8:05am

I see you wrote a new threat.

http://www.devincheevers.com/3D/click_zoom.html is now with 3 grey circles. I thought you had the whole sprial thing goin on already , but with red squares. Anyway, why dont you share the .fla. this is way to hard to help you out

devinstar · April 11, 2006, 12:17pm

http://www.devincheevers.com/share/spiral-share.fla
http://www.devincheevers.com/share/spiral-share-mx2004.fla

Hopefully we can get that a bit more ‘etsy’ like

What I mean by that is mine is just adding the items in a circle pattern then adjusting there z value to give the effect of depth.

But on etsy.com it seems to be more of a proper spiral!

devinstar · April 11, 2006, 12:18pm

I see you wrote a new threat.

http://www.devincheevers.com/3D/click_zoom.html is now with 3 grey circles. I thought you had the whole sprial thing goin on already , but with red squares. Anyway, why dont you share the .fla. this is way to hard to help you out

Just click on the second circle from the top ‘2222’ it then downloads the image paths from a database and loads them in. That was the whole point of trying to create this spiral effect!

devinstar · April 11, 2006, 12:28pm

test

devinstar · April 11, 2006, 6:05pm

Any one come up with anything?

nathan99 · April 11, 2006, 9:28pm

may b3e able to:)

but after school:)

devinstar · April 12, 2006, 11:52am

I’m going to be taking down thoose .flas today if no one has come up with anything new.

Greggeh · April 12, 2006, 2:22pm

i have

well not really much, ive been just playing with it, also added keyfeatures,

up=up
down=down
left=left
right=right
-=zoom out
+= zoom in

Also set the mcs to _visible = false if z<0.

Greggeh · April 12, 2006, 2:24pm

maybe someone can make a rotation function so we get something like http://www.dartdesign.de/ (;

devinstar · April 12, 2006, 3:17pm

thanks Greggeh, good work, do u think u could chuck the .fla up as well?

Greggeh · April 12, 2006, 7:05pm

no prob!

I assume you have F8, as you posted the F8 file aswell (;