Esoteric Framework

Intro

Description

This is the application embedded on the homepage. It demonstrates basic 2D and 3D functionality, sound, tweening, and mouse input.

Source Code

<Application>
	
	<EventListener target="{parent}" type="complete">
		root.getElementById("container").rotationX = -5;
		root.getElementById("container").rotationY = 10;
		root.getElementById("viewport").startTween("alpha", .8, 3);
	</EventListener>
	
	<SoundFile id="a" url="{{ MEDIA_URL }}applications/a.mp3" />
	<SoundFile id="b" url="{{ MEDIA_URL }}applications/b.mp3" />
	<SoundFile id="c" url="{{ MEDIA_URL }}applications/c.mp3" />
	<SoundFile id="d" url="{{ MEDIA_URL }}applications/d.mp3" />
	<SoundFile id="e" url="{{ MEDIA_URL }}applications/e.mp3" />
	<SoundFile id="f" url="{{ MEDIA_URL }}applications/f.mp3" />
	<SoundFile id="g" url="{{ MEDIA_URL }}applications/g.mp3" />
	
	<Script id="react">
		args[0].startTween('rotationZ', parent.parent.rotationZ + Math.random() * 360, 2);
		soundFile = root.getElementById(args[1]);
		soundFile.playing = false;
		soundFile.position = 0;
		soundFile.playing = true;
	</Script>
	
	<Shape>
		<GradientFill width="{root.applicationWidth}" height="{root.applicationHeight}" colors="{[0x333333, 0x000000]}" rotation="90">
			<Rectangle width="{root.applicationWidth}" height="{root.applicationHeight}" />
		</GradientFill>
	</Shape>
	
	<Camera3D id="camera" z="{-this.perfectDistance}" />
	
	<Scene3D id="scene">
		<DisplayObject3D id="container" x="-30" rotationY="{-50 + 120 * (root.globalX / root.applicationWidth)}"  rotationX="{-30 + 50 * (root.globalY / root.applicationHeight)}" z="100">
			<Sprite3D z="-100">
				
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "a");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xff9933, 0x9c0000]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
			<Sprite3D z="-50" x="-90" y="-30" rotationZ="30">
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "b");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xccffcc, 0x066a1d]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
			<Sprite3D z="0" x="130" y="70" rotationZ="-5">
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "c");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xccffff, 0x008080]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
			<Sprite3D z="50" x="-200" y="-20" rotationZ="20">
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "d");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xffccff, 0x4d066a]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
			<Sprite3D z="100" x="200" y="-50" rotationZ="-13">
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "e");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xffffcc, 0xfff000]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
			<Sprite3D z="150" x="-280" y="-20" rotationZ="5">
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "f");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xb6b8dd, 0x333399]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
			<Sprite3D z="200" x="300" y="10" rotationZ="-60">
				<Sprite>
					<EventListener target="{parent}" type="over">
						root.getElementById("react").run(parent.parent, "g");
					</EventListener>
					<Shape>
						<GradientFill width="120" height="120" colors="{[0xffcccc, 0x9e0b0f]}" rotation="90">
							<RoundedRectangle width="120" height="120" />
						</GradientFill>
					</Shape>
					<TextField width="{this.textWidth}" height="{this.textHeight}" x="{60 - this.width / 2}" y="{60 - this.height / 2}" font="Helvetica, Arial, _sans" color="0xFFFFFF" size="32">:)</TextField>
				</Sprite>
			</Sprite3D>
		</DisplayObject3D>
	</Scene3D>
	
	<Viewport3D id="viewport" alpha="0" viewportWidth="{root.applicationWidth}" viewportHeight="{root.applicationHeight}" camera="{root.getElementById('camera')}" scene="{root.getElementById('scene')}" />
</Application>