2009 March | pv3d.org

Archive for March, 2009

Twitter + Papervision3D (using Tweetr)

Tuesday, March 31st, 2009 | examples | Comments

Thanks to Tweetr, using Twitter with Flash is extremely simple. This example shows the last tweet with the word “pv3d” in it. So feel free to post to twitter to see your tweet appear

package
{
	import com.swfjunkie.tweetr.Tweetr;
	import com.swfjunkie.tweetr.data.objects.SearchResultData;
	import com.swfjunkie.tweetr.events.TweetEvent;
 
	import flash.events.Event;
	import flash.filters.GlowFilter;
 
	import org.papervision3d.materials.special.Letter3DMaterial;
	import org.papervision3d.typography.Text3D;
	import org.papervision3d.typography.fonts.HelveticaBold;
	import org.papervision3d.view.BasicView;
 
	[SWF(width="900", height="480", backgroundColor="#000000", frameRate="31")]
	public class TweetrDemo extends BasicView
	{
		private var text3d:Text3D;
		private var yaw:Number = 0;
 
		public function TweetrDemo()
		{
			super(900, 480);
			opaqueBackground = 0x000000;
 
			var tweetr:Tweetr = new Tweetr();
			tweetr.search("pv3d");
//			tweetr.serviceHost = "http://pv3d.org/twitter/proxy";
 
			tweetr.addEventListener(TweetEvent.COMPLETE, tweetr_completeHandler);
			tweetr.addEventListener(TweetEvent.FAILED, tweetr_failedHandler);
		}
 
		private function tweetr_completeHandler(event:TweetEvent):void
		{
			var searchResultData:SearchResultData = event.responseArray[0] as SearchResultData;
 
			var letterMaterial:Letter3DMaterial = new Letter3DMaterial(0xcc0000);
			letterMaterial.doubleSided = true;
			text3d = new Text3D(searchResultData.text, new HelveticaBold(), letterMaterial);
 
			scene.addChild(text3d); 
 
			startRendering();
 
			viewport.filters = [new GlowFilter(0xffffff, 1, 3, 3, 10, 2)];
		}
 
		private function tweetr_failedHandler(event:TweetEvent):void
		{
			//fail
		}		
 
		override protected function onRenderTick(event:Event=null):void
		{
			text3d.rotationX++;
			camera.orbit(90, yaw++, true, text3d);
			super.onRenderTick(event);
		}
	}
}

Using a Flex Component as a Material

Tuesday, March 31st, 2009 | examples | Comments

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
	layout="absolute" 
	minWidth="640" 
	minHeight="480" 
	xmlns:mx="http://www.adobe.com/2006/mxml" 
	applicationComplete="applicationCompleteHandler(event)"
	>
	<mx:Script>
		<![CDATA[
			import org.papervision3d.objects.primitives.Plane;
			import org.papervision3d.materials.MovieMaterial;
			import org.papervision3d.view.BasicView;
			import mx.events.FlexEvent;
 
			private var plane:Plane;
			private var basicView:BasicView;
 
			protected function applicationCompleteHandler(event:FlexEvent):void
			{
				basicView = new BasicView(width, height);
				rawChildren.addChild(basicView);
				basicView.camera.focus = 10;
				basicView.camera.zoom = 100;	
				basicView.viewport.interactive = true;
 
				var material:MovieMaterial = new MovieMaterial(myAwesomePanel, true, true, true);
				material.interactive = true;
				material.smooth = true;
				material.doubleSided = true;
 
				plane = new Plane(material, myAwesomePanel.width, myAwesomePanel.height, 10, 10);
 
				basicView.scene.addChild(plane);
 
				addEventListener(Event.ENTER_FRAME, enterFrameHandler);
			}
 
			private function enterFrameHandler(event:Event):void
			{
				plane.rotationY++;
				basicView.singleRender();
			}
 
 
			protected function button_clickHandler(event:MouseEvent):void
			{
				textArea.text = "";
			}
 
		]]>
	</mx:Script>
	<mx:Panel 
		id="myAwesomePanel" 
		width="204"
		height="160"
		verticalAlign="middle" 
		layout="vertical" 
		horizontalAlign="center"
		includeInLayout="false"
		blendMode="{BlendMode.ERASE}"
		x="-1000"
		y="-1000"
		>
		<mx:TextArea id="textArea" text="Blah blah blah"/>
		<mx:Button label="Click to clear text" click="button_clickHandler(event)"/>
	</mx:Panel>
</mx:Application>

Using the viewport for interactivity

Tuesday, March 31st, 2009 | examples | Comments

This example shows an alternate way of allowing you to click on 3d objects. Since every 3d object is rendered to the viewport, you can just add a mouse click event listener to the viewport directly. Of course, this limits you to having only one click action for every 3d object.

My next post will show how to create individual viewport layers for each object.

package
{
	import flash.events.MouseEvent;
 
	import org.papervision3d.core.proto.MaterialObject3D;
	import org.papervision3d.materials.ColorMaterial;
	import org.papervision3d.objects.DisplayObject3D;
	import org.papervision3d.objects.primitives.Sphere;
	import org.papervision3d.view.BasicView;
 
	[SWF(width="900", height="480", backgroundColor="#000000", frameRate="31")]
	public class AlternateInteractivity extends BasicView
	{
		public function AlternateInteractivity()
		{
			super(900, 480, false, false);
 
			var n:int = 30;
			for(var i:int = 0; i < n; i++)
			{
				var color:Number = Math.random() * 0xffffff;
				var material:MaterialObject3D = new ColorMaterial(color);
				var sphere:Sphere = new Sphere(material);
				sphere.x = Math.random() * 3000 - 1500;
				sphere.y = Math.random() * 3000 - 1500;
				sphere.z = Math.random() * 3000;
 
				scene.addChild(sphere);
			}
 
			singleRender();
 
			//shows hand cursor when rolling over spheres
			viewport.buttonMode = true;
			//allows you to click on any of the spheres
			//since they're just bitmaps in the viewport
			viewport.addEventListener(MouseEvent.CLICK, viewport_clickHandler);
		}
 
		private function viewport_clickHandler(event:MouseEvent):void
		{
			for each(var sphere:Sphere in scene.children)
			{
				sphere.x = Math.random() * 3000 - 1500;
				sphere.y = Math.random() * 3000 - 1500;
				sphere.z = Math.random() * 3000;
			}
 
			singleRender();
		}
	}
}

RenderLayers – Selective Rendering

Monday, March 30th, 2009 | examples | Comments

I haven’t quite decided where to work yet, but I was getting tired of not blogging

After the pop-up launches, make sure to click to give the .swf keyboard focus. Then use the “right” and “left” keys to render the right or left sphere. The important thing to notice here is that the spheres are both in the same scene, but they’re only being rendered when you choose.

package
{
	import flash.events.Event;
	import flash.events.KeyboardEvent;
	import flash.ui.Keyboard;
 
	import org.papervision3d.core.proto.MaterialObject3D;
	import org.papervision3d.lights.PointLight3D;
	import org.papervision3d.materials.shadematerials.FlatShadeMaterial;
	import org.papervision3d.objects.primitives.Sphere;
	import org.papervision3d.view.BasicView;
	import org.papervision3d.view.layer.ViewportLayer;
 
	[SWF(width="900", height="480", backgroundColor="#000000", frameRate="31")]
	public class RenderLayers extends BasicView
	{
		private var isLeftRendering:Boolean = false;
		private var isRightRendering:Boolean = false;
 
		private var leftSphere:Sphere;
		private var rightSphere:Sphere;
 
		private var rightLayers:Array = [];
		private var leftLayers:Array = [];
 
		public function RenderLayers()
		{
			super(900, 480, false, false);
			var light:PointLight3D = new PointLight3D(true);
 
			var leftSphereMaterial:MaterialObject3D = new FlatShadeMaterial(light, 0xcc0000, 0x111111, 10);
			leftSphere = new Sphere(leftSphereMaterial, 300);
			leftSphere.x = -500;
 
			var rightSphereMaterial:MaterialObject3D = new FlatShadeMaterial(light, 0x00cc00, 0x111111, 10);
			rightSphere = new Sphere(rightSphereMaterial, 300);
			rightSphere.x = 500;
 
			var leftSphereLayer:ViewportLayer = new ViewportLayer(viewport, leftSphere);
			viewport.containerSprite.addLayer(leftSphereLayer);
			leftLayers.push(leftSphereLayer);
 
			var rightSphereLayer:ViewportLayer = new ViewportLayer(viewport, rightSphere);
			viewport.containerSprite.addLayer(rightSphereLayer);
			rightLayers.push(rightSphereLayer);
 
			scene.addChild(leftSphere);
			scene.addChild(rightSphere);
 
			//Render once so the spheres appear
			renderer.renderScene(scene, camera, viewport);
 
			startRendering();
 
			stage.addEventListener(KeyboardEvent.KEY_DOWN, stage_keyDownHandler);
			stage.addEventListener(KeyboardEvent.KEY_UP, stage_keyUpHandler);
		}
 
		private function stage_keyDownHandler(event:KeyboardEvent):void
		{
			switch(event.keyCode)
			{
				case Keyboard.LEFT:
					isLeftRendering = true;
					break;
 
				case Keyboard.RIGHT:
					isRightRendering = true;
					break;
			}
		}
 
		private function stage_keyUpHandler(event:KeyboardEvent):void
		{
			switch(event.keyCode)
			{
				case Keyboard.LEFT:
					isLeftRendering = false;
					break;
 
				case Keyboard.RIGHT:
					isRightRendering = false;
					break;
			}
 
		}
 
		override protected function onRenderTick(event:Event = null):void
		{
			//The spheres are always rotating
			leftSphere.rotationX++;
			rightSphere.rotationX--;
 
			//But they're only rendered if their selected layer is rendered
			if(isLeftRendering)
			{
				renderer.renderLayers(scene, camera, viewport, leftLayers);
			}
 
			if(isRightRendering)
			{
				renderer.renderLayers(scene, camera, viewport, rightLayers);
			}
		}
	}
}