Skip to content

Archive for the 'Expert' Category

Papervision Custom Primitive Source code for use with cool particle field effect.

Published

by

on September 9, 2008

in AS3, Adobe, Expert, Flash, Intermediate, Papervision, Particle, Particle Field, Primitive, Source Code and Tutorials

. 1 Comment

Carlos Lunetta was kind enough to send me his custom primitive and vertex particle classes for this blog entry. These are similar to the ones that he used for the Terra TV website. In this example that concept is rather simple. You create a primitive object (Plane, Cube, Sphere) and run a for loop on the verticles.

As shown here:

Actionscript:

for (var i:int = 0; i <disc.geometry.vertices.length; i++)
{
var discVert:Vertex3D = disc.geometry.vertices[i];
}

Link to my example

Now that you are looping through the verticles of this primitive you are now privy to information such as the x y and z locations of each point. So what can we do with that.....

One thing we can do is attach particles to it.. such as

Actionscript:

for (var i:int = 0; i <disc.geometry.vertices.length; i++)
{
var discVert:Vertex3D = disc.geometry.vertices[i];
var vertexParticle:VertexParticle = new VertexParticle(particalMaterial, 5, discVert);
vertexParticle.x = discVert.x;
vertexParticle.y = discVert.y;
vertexParticle.z = discVert.z;
myParticles.addParticle(vertexParticle);
}

Doing this lends itself to some neat particle field effects such as the one shown above. Of course you can mess around with the settings to optimize it for your needs.

Here is how you put it all together:

Actionscript:

package com.cs54.papervision
{
import flash.events.Event;
import org.papervision3d.core.geom.Particles;
import org.papervision3d.core.geom.renderables.Particle;
import org.papervision3d.core.geom.renderables.Vertex3D;
import org.papervision3d.core.geom.Vertices3D;
import org.papervision3d.materials.ColorMaterial;
import org.papervision3d.materials.special.MovieAssetParticleMaterial;
import org.papervision3d.materials.special.ParticleMaterial;
import org.papervision3d.materials.utils.MaterialsList;
import org.papervision3d.materials.WireframeMaterial;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.objects.primitives.Cone;
import org.papervision3d.objects.primitives.Plane;
import src.primitives.Dome;
import src.primitives.Disc;
import src.primitives.VertexParticle;
public class PV3DScene extends PaperBase
{
protected var displayContainer :DisplayObject3D;
protected var particle :Particle
protected var myParticles :Particles;
protected var domeParticles :Particles;
protected var partMat :ParticleMaterial;
protected var colorMaterial :ColorMaterial;
protected var disc :Disc;
protected var particalMaterial :ParticleMaterial;
protected var particalMaterial2 :ParticleMaterial;
protected var container :DisplayObject3D;
protected var domeContainer :DisplayObject3D;
protected var dome :Dome;
override public function init(vpWidth:Number = 800, vpHeight:Number = 600):void
{
super.init(vpWidth, vpHeight);
default_camera.y = 800;
default_camera.rotationX = 20;
}
override protected function createChildren3D():void
{
super.createChildren3D();
container = new DisplayObject3D();
domeContainer = new DisplayObject3D();
default_scene.addChild(container);
default_scene.addChild(domeContainer);
default_camera.zoom = 50;
default_camera.z = -3000
colorMaterial = new ColorMaterial(0xFF0000, 1, true);
colorMaterial.doubleSided = true;
particalMaterial = new ParticleMaterial(0xFF00CC, 100, ParticleMaterial.SHAPE_CIRCLE);
particalMaterial2 = new ParticleMaterial(0x000000, 100, ParticleMaterial.SHAPE_CIRCLE);
myParticles = new Particles();
domeParticles = new Particles();
disc = new Disc(colorMaterial, 500,15,2,3,this);
dome = new Dome(colorMaterial, 500, 100, 10, 5, 2);
for (var i:int = 0; i <disc.geometry.vertices.length; i++)
{
var discVert:Vertex3D = disc.geometry.vertices[i];
var vertexParticle:VertexParticle = new VertexParticle(particalMaterial2, 5, discVert);
vertexParticle.x = discVert.x;
vertexParticle.y = discVert.y;
vertexParticle.z = discVert.z;
myParticles.addParticle(vertexParticle);
}
for (var j:int = 0; j <dome.geometry.vertices.length; j++)
{
var domeVert:Vertex3D = dome.geometry.vertices[j];
var domeVertexParticle:VertexParticle = new VertexParticle(particalMaterial, 5, domeVert);
domeVertexParticle.x = domeVert.x;
domeVertexParticle.y = domeVert.y;
domeVertexParticle.z = domeVert.z;
domeParticles.addParticle(domeVertexParticle);
}
container.addChild(myParticles)
domeContainer.addChild(domeParticles)
domeContainer.y = -10
default_scene.addChild(container)
default_scene.addChild(domeContainer);
}
override protected function renderEnterFrame(ThisEvent:Event):void
{
super.renderEnterFrame(ThisEvent);
if (default_camera.z <0)
{
default_camera.z += (0 - default_camera.z)*.01
}
default_camera.y += (50 - default_camera.y)*.01;
container.yaw(1);
domeContainer.yaw(1);
}
}
}

Paperbase.as

Actionscript:

package com.cs54.papervision
{
import flash.display.Sprite;
import flash.events.Event;
import org.papervision3d.view.Viewport3D;
import org.papervision3d.cameras.*;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.render.BasicRenderEngine;
public class PaperBase extends Sprite
{
public var viewport:Viewport3D;
public var renderer:BasicRenderEngine;
public var default_scene:Scene3D;
public var default_camera:Camera3D;
public function init(vpWidth:Number = 800, vpHeight:Number = 600):void
{
initPapervision(vpWidth, vpHeight);
createChildren3D();
createChildren2D();
size();
initEvents();
}
protected function initPapervision(vpWidth:Number, vpHeight:Number):void
{
viewport = new Viewport3D(vpWidth, vpHeight);
addChild(viewport);
renderer = new BasicRenderEngine();
default_scene = new Scene3D();
default_camera = new Camera3D();
}
protected function createChildren3D():void
{
// This function should hold all of the stages needed
// to initialise everything used for papervision.
// Models, materials, cameras etc.
}
protected function createChildren2D():void
{
// This function should create all of the 2d items
// that will be overlayed on your papervision project.
// User interfaces, Heads up displays etc.
}
protected function size():void
{
}
protected function initEvents():void
{
addEventListener(Event.ENTER_FRAME, renderEnterFrame);
}
protected function processFrame():void
{
// Process any movement or animation here.
}
protected function renderEnterFrame( ThisEvent:Event ):void
{
//trace("RENDERING")
//We need to render the scene and update anything here.
renderer.renderScene(default_scene, default_camera, viewport);
processFrame();
}
}
}

Here are Carlos Lunetta's classes for the Dome,Disc and VertexParticle

Dome.as

Actionscript:

package src.primitives
{
import org.papervision3d.core.geom.*;
import org.papervision3d.core.geom.renderables.Vertex3D;
import org.papervision3d.core.proto.*;
/**
* ...
* @author clunetta
*/
public class Dome extends TriangleMesh3D
{
private var segments:uint;
private var sides:uint;
private var radius:Number
private var height:Number;
private var sideIncrement:Number;
private var currentIncrement:Number = 0;
public function Dome (material:MaterialObject3D=null, radius:Number=100, height:Number = 100, segments:uint=0, sides:uint=3, sideIncrement:Number=0, initObject:Object=null )
{
super(material, new Array(), new Array());
this.segments = 1 + segments;
this.sides = sides;
this.radius = radius;
this.sideIncrement = sideIncrement;
this.height = 2 * height;
buildDome();
}
private function buildDome():void
{
var matInstance:MaterialObject3D = material;
var i:Number, j:Number, k:Number;
var aVertice:Array = this.geometry.vertices;
var oVtx:Vertex3D;
oVtx = new Vertex3D(0,height,0);
aVertice.push(oVtx);
for (j = 1; j <segments; j++) {
//var hRds:Number = (segments-j)* (height/segments)
var fZ:Number = height * Math.sin((segments-(j-1)) * (0.5*Math.PI) / segments);
//var fZ:Number = (height)*Math.sin((j-1)*(0.5*Math.PI/segments));
currentIncrement += sideIncrement;
var curSides:uint = uint(Math.floor(sides + currentIncrement));
for (i = 0; i <curSides; i++) {
var fRds:Number = j * radius / segments;
var fX:Number = fRds*Math.sin(i*(2*Math.PI/curSides));
var fY:Number = fRds*Math.cos(i*(2*Math.PI/curSides));
oVtx = new Vertex3D(fY,fZ,fX);
aVertice.push(oVtx);
}
}
this.geometry.ready = true;
}
}
}

Disc.as

Actionscript:

package src.primitives
{
import org.papervision3d.core.geom.*;
import org.papervision3d.core.geom.renderables.Vertex3D;
import org.papervision3d.core.proto.*;
/**
* ...
* @author clunetta
*/
public class Disc extends TriangleMesh3D
{
private var segments :uint;
private var sides :uint;
private var radius :Number;
private var sideIncrement:Number;
private var currentIncrement:Number = 0;
public function Disc (material:MaterialObject3D=null, radius:Number=100, segments:uint=0, sides:uint=3, sideIncrement:Number=0, initObject:Object=null )
{
super(material, new Array(), new Array());
this.segments = 1+ segments;
this.sides = sides;
this.radius = radius;
this.sideIncrement = sideIncrement;
buildDisc();
}
private function buildDisc():void
{
var matInstance:MaterialObject3D = material;
var i:Number, j:Number, k:Number;
var aVertice:Array = this.geometry.vertices;
var fZ:Number = 0;
var oVtx:Vertex3D;
oVtx = new Vertex3D(0,0,0);
aVertice.push(oVtx);
for (j = 0; j <segments; j++) {
currentIncrement += sideIncrement;
var curSides:uint = uint(Math.floor(sides + currentIncrement));
for (i = 0; i <curSides; i++) {
var fRds:Number = (j + 1) * radius / segments;
var fX:Number = fRds*Math.sin(i*(2*Math.PI/curSides));
var fY:Number = fRds*Math.cos(i*(2*Math.PI/curSides));
oVtx = new Vertex3D(fY,fZ,fX);
aVertice.push(oVtx);
}
}
this.geometry.ready = true;
}
}
}

VertexParticle.as

Actionscript:

package src.primitives
{
import org.papervision3d.core.geom.renderables.Particle;
import org.papervision3d.core.geom.renderables.Vertex3D;
import org.papervision3d.materials.special.ParticleMaterial;
/**
* ...
* @author clunetta
*/
public class VertexParticle extends Particle
{
public function VertexParticle(material:ParticleMaterial, size:Number, vertex:Vertex3D)
{
super(material, size);
super.vertex3D = vertex;
}
}
}

Papervision with 3D Physics WOW engine (Getting started)

Published

by

on September 9, 2008

in 3D Physics, AS3, Expert, Flash, Intermediate, Papervision, Source Code, Tutorials and WOW Engine

. 2 Comments

Today I decided to create this simple example that used Papervision and the 3D physics WOW Engine. It is actually quite simple. Basically all that happens is you setup your objects for papervision (5 minutes) - setup your objects for the wow engine (5 mintues) then when you render - you just attach the movements of the WOW objects to your Papervision objects. (5 more minutes or less and you're DONE)

So taking out 3D and Papervision all together here is what is happening. Let's say you setup an enterframe and then assign a movieclips x and y positions to your mouse x and y position. SAME Exact thing happening here. Except you are attaching the x y and z properties of a papervision object to a wow object. Pretty simple! I'll take corrections if I am wrong since I have spent all of 30 minutes playing around with it.

Here is a quick sample of what goes on when rendering:

Actionscript:

sphere.x = wowSphere.px;
sphere.y = -wowSphere.py;
sphere.z = wowSphere.pz;

Not too hard right.

Here is the ActionScript code for creating a simple sphere boucing on the stage. Source code is below. (Basically a modified example shown on the WOW site)

Main.as

Actionscript:

package
{
import com.cs54.papervision.PV3DSceneWOW;
import flash.display.Sprite;
public class Main extends Sprite
{
protected var papervisionSceneWOW:PV3DSceneWOW
public function Main():void
{
papervisionSceneWOW = new PV3DSceneWOW();
papervisionSceneWOW.init(stage.stageWidth, stage.stageHeight)
addChild(papervisionSceneWOW);
}
}
}

PV3DSceneWOW.as:

Actionscript:

package com.cs54.papervision
{
import flash.events.Event;
import fr.seraf.wow.core.data.WVector;
import fr.seraf.wow.core.WOWEngine;
import fr.seraf.wow.primitive.WBox;
import fr.seraf.wow.primitive.WOWPlane;
import fr.seraf.wow.primitive.WSphere;
import org.papervision3d.materials.ColorMaterial;
import org.papervision3d.materials.utils.MaterialsList;
import org.papervision3d.materials.WireframeMaterial;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.objects.primitives.Plane;
import org.papervision3d.objects.primitives.Sphere;
public class PV3DSceneWOW extends PaperBase
{
protected var displayContainer :DisplayObject3D;
protected var holder :DisplayObject3D
protected var sphere :Sphere;
protected var wireframeMat :WireframeMaterial;
protected var wow :WOWEngine
protected var wowSphere :WSphere
override public function init(vpWidth:Number = 800, vpHeight:Number = 600):void
{
super.init(vpWidth, vpHeight);
default_camera.y = 300;
}
override protected function createChildren3D():void
{
super.createChildren3D();
wireframeMat = new WireframeMaterial(0, 100, .2);
wireframeMat.doubleSided = true;
sphere = new Sphere(wireframeMat, 100);
default_camera.zoom = 40;
default_scene.addChild(sphere);
setupWow();
createGround();
createWOWSphere();
}
public function setupWow(): void
{
//this is the physics engine
wow=new WOWEngine(.3);
wow.collisionResponseMode = wow.STANDARD;
//setup the gravity
wow.addMasslessForce(new WVector(0,50,0));
}
public function createGround(): void
{
//we create a ground on the physics engine
var ground:WOWPlane = new WOWPlane(0,0,0);
ground.elasticity =.35;
ground.friction =2;
wow.addParticle(ground);
// we create the ground on the render engine so we start by setup the material...
var material:WireframeMaterial = new WireframeMaterial(0,100,1)
material.doubleSided = true
var plane:Plane = new Plane(material , 1000, 1000, 5, 5 );
plane.rotationX =-90
default_scene.addChild(plane);
}
public function createWOWSphere(): void
{
wowSphere = new WSphere(0,-900,100,100,false,0.1);
wowSphere.elasticity = 0;
wowSphere.friction=3320;
wow.addParticle(wowSphere);
sphere.x =-wowSphere.px;
sphere.y =-wowSphere.py;
sphere.z =-wowSphere.pz;
}
override protected function processFrame():void
{
super.processFrame();
wow.step()
sphere.x = wowSphere.px;
sphere.y = -wowSphere.py;
sphere.z = wowSphere.pz;
}
override protected function renderEnterFrame(ThisEvent:Event):void
{
super.renderEnterFrame(ThisEvent);
}
}
}

The paper base that I reuse:
Based off of this example

Actionscript:

package com.cs54.papervision
{
import flash.display.Sprite;
import flash.events.Event;
import org.papervision3d.view.Viewport3D;
import org.papervision3d.cameras.*;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.render.BasicRenderEngine;
public class PaperBase extends Sprite
{
public var viewport:Viewport3D;
public var renderer:BasicRenderEngine;
public var default_scene:Scene3D;
public var default_camera:Camera3D;
public function init(vpWidth:Number = 800, vpHeight:Number = 600):void
{
initPapervision(vpWidth, vpHeight);
createChildren3D();
createChildren2D();
size();
initEvents();
}
protected function initPapervision(vpWidth:Number, vpHeight:Number):void
{
viewport = new Viewport3D(vpWidth, vpHeight);
addChild(viewport);
renderer = new BasicRenderEngine();
default_scene = new Scene3D();
default_camera = new Camera3D();
}
protected function createChildren3D():void
{
// This function should hold all of the stages needed
// to initialise everything used for papervision.
// Models, materials, cameras etc.
}
protected function createChildren2D():void
{
// This function should create all of the 2d items
// that will be overlayed on your papervision project.
// User interfaces, Heads up displays etc.
}
protected function size():void
{
}
protected function initEvents():void
{
addEventListener(Event.ENTER_FRAME, renderEnterFrame);
}
protected function processFrame():void
{
// Process any movement or animation here.
}
protected function renderEnterFrame( ThisEvent:Event ):void
{
//trace("RENDERING")
//We need to render the scene and update anything here.
renderer.renderScene(default_scene, default_camera, viewport);
processFrame();
}
}
}

Don't forget to download the latest Papervision Great White Branch.

Papervision Double Sided Plane (err sorta) :/

Published

by

on September 1, 2008

in AS3, Adobe, Double Sided Plane, Expert, Flash, Intermediate, OOP, Papervision, Papervision Plane, Source Code, Tutorials and Uncategorized

. 2 Comments

As far as I know there are 2 options when creating a double sided plane. Double sided meaning a different material for each side.

Option 1:
Create two planes. Plane 1 with a z sorting of 1 and the other with 0 and the rotationY of one of those planes set to 180. You could then contain this in one display container.

Version 2:
Create one cube with a depth of 0. Then you just apply a material to the front and back. OK OK OK so this is not really a Plane... but I like this approach because it allows me to more easily use things like Bend Modifier.

If anyone has a better or more improved approach I would love to hear about it.

Here is what the code for Option 1:

Actionscript:

package com.cs54.ui
{
import org.papervision3d.objects.primitives.Plane;
import org.papervision3d.materials.MovieMaterial;
import org.papervision3d.materials.utils.MaterialsList;
import org.papervision3d.objects.DisplayObject3D;
import com.everydayflash.pv3d.modifiers.Bend;
import flash.display.DisplayObject;public class Tree2Planes extends DisplayObject3D
{
[Embed(source="/assets/tree-side-1.png")]
public var TreeFront :Class;[Embed(source="/assets/tree-side-2.png")]
public var TreeBack :Class;
protected var treeFront :DisplayObject;
protected var treeBack :DisplayObject;
protected var treeFrontMat :MovieMaterial;
protected var treeBackMat :MovieMaterial;
protected var treeMatList :MaterialsList;
protected var _height :Number = 175;
protected var _width :Number = 191;
protected var _container :DisplayObject3D;
protected var plane1 :Plane;
protected var plane2 :Plane;
public function Tree2Planes():void
{
treeMatList = new MaterialsList();
treeFront = new TreeFront();
treeBack = new TreeBack();
//Tree Materials
treeFrontMat = new MovieMaterial(treeFront, true);
treeBackMat = new MovieMaterial(treeBack, true);
treeFrontMat.allowAutoResize = false;
plane1 = new Plane(treeFrontMat,_width,_height);
plane2 = new Plane(treeBackMat,_width,_height);
plane1.z = 1;
plane1.rotationY = 180;
_container = new DisplayObject3D();
addChild(_container);
_container.addChild(plane1);
_container.addChild(plane2);
}
public function get height():Number
{
return _height;
}
public function get width():Number
{
return _width;
}
}
}

Here is what the code for Option 2:

Actionscript:

package com.cs54.ui
{
import org.papervision3d.materials.MovieMaterial;
import org.papervision3d.materials.utils.MaterialsList;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.objects.primitives.Cube;
import com.everydayflash.pv3d.modifiers.Bend;
import flash.display.DisplayObject;
public class Tree extends DisplayObject3D
{
[Embed(source="/assets/tree-side-1.png")]
public var TreeFront :Class;
[Embed(source="/assets/tree-side-2.png")]
public var TreeBack :Class;
protected var treeFront :DisplayObject;
protected var treeBack :DisplayObject;
protected var treeFrontMat :MovieMaterial;
protected var treeBackMat :MovieMaterial;
protected var treeMatList :MaterialsList;
protected var treeCube :Cube;
protected var _height :Number = 175;
protected var _width :Number = 191;
protected var _container :DisplayObject3D;
public function Tree():void
{
treeMatList = new MaterialsList();
treeFront = new TreeFront();
treeBack = new TreeBack();
//Tree Materials
treeFrontMat = new MovieMaterial(treeFront, true);
treeBackMat = new MovieMaterial(treeBack, true);
treeFrontMat.allowAutoResize = false;
treeFrontMat.animated = true;
treeMatList.addMaterial( treeFrontMat, "front" );
treeMatList.addMaterial( treeBackMat, "back" );
treeCube = new Cube(treeMatList, _width, 0, _height, 6, 6, 6);
var bend:Bend = new Bend(treeCube);
bend.quickBend(1, .1);
addChild(treeCube);
}
public function get height():Number
{
return _height;
}
public function get width():Number
{
return _width;
}
}
}

Papervision Collada – Spongebob SquarePants

Published

by

on August 31, 2008

in AS3, Adobe, Collada, Expert, Intermediate, Model, OOP, Papervision and Source Code

. 0 Comments

View Collada Spongebob in Papervision

I had some time on my hands this weekend and decided to mess around with loading Collada models with Papervision. I snagged a few models from Google Sketchup and went to town. Also tried to work in some OOP instead of just having one huge papervision file. I really need to clean up the source but rest assured the full source will be posted soon.

Basic lesson is that you can load a Collada file with just actionscript (packaged as a zip or just the dae file)

Actionscript:

//Load zipped dae file
protected function loadKMZ():void
{
kmz = new KMZ();
kmz.load("model/spongebob_squarepants.zip");
kmz.addEventListener(FileLoadEvent.LOAD_ERROR, onKmzError);
kmz.addEventListener(FileLoadEvent.LOAD_COMPLETE, onKmzLoaded);
//Scale if needed
kmz.scale = 20;
container.addChild(kmz);
}
//load the dae file
protected function loadDAE():void
{
dae = new DAE();
dae.load("model/spongebob_squarepants.dae");
dae.addEventListener(FileLoadEvent.LOAD_ERROR, onDaeError);
dae.addEventListener(FileLoadEvent.LOAD_COMPLETE, onDaeLoaded);
container.addChild(dae);
}

Papervision Popup Book : The source – Just the elements on the stage

Published

by

on June 20, 2008

in AS3, Adobe, Expert, Flash, Papervision, Source Code and Tutorials

. 17 Comments

Sorry for putting this up so late. This code is only used to arrange the items on the stage. Much work and re-working will need to be done to even start to achieve the effect of the ecodazoo website. Anyways, perhaps this will get someones brain moving in the right direction and help lead us in the path to re-creating this effect fully. As soon as I get some free time I will post a version that is a true popup book in papervision.

If anyone gets a chance sooner to do some cool things with the code please shoot me an email or a blog post and I would love to share it, with myself and with everyone else.

Download : FLA - AS & SOURCE

Don't forget the other code you will need to compile:

1) Papervision 2.0

Actionscript:

package {
import caurina.transitions.Tweener;
import org.papervision3d.cameras.FreeCamera3D;
import org.papervision3d.core.data.qTree.QuadTree;
import org.papervision3d.objects.DisplayObject3D;
import com.foomonger.utils.Later;
import flash.display.*;
import flash.events.Event;
import flash.events.MouseEvent;
import org.papervision3d.cameras.Camera3D;
import org.papervision3d.materials.ColorMaterial;
import org.papervision3d.materials.MovieMaterial;
import org.papervision3d.objects.primitives.Cube;
import org.papervision3d.objects.primitives.Plane;
import org.papervision3d.render.BasicRenderEngine;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.view.Viewport3D;
public class Main extends Sprite
{
private var __camera :FreeCamera3D;
private var __scene :Scene3D;
private var __viewport :Viewport3D;
private var __renderer :BasicRenderEngine;
private var __width :Number;
private var __height :Number;
private var __background :Shape;
protected var __wallLeft isplayObject;
protected var __wallRight isplayObject;
protected var __wallBack isplayObject;
protected var __floor :DisplayObject;
protected var __tree isplayObject;
protected var __monster :DisplayObject;
protected var __moveMatWallLeft :MovieMaterial;
protected var __moveMatRightWall :MovieMaterial;
protected var __moveMatWallBack :MovieMaterial;
protected var __moveMatFloor :MovieMaterial;
protected var __moveMatTree :MovieMaterial;
protected var __moveMatMonster :MovieMaterial;
protected var __plane_wallLeft lane;
protected var __plane_rightWall lane;
protected var __plane_wallBack lane;
protected var __floorPlane :Plane;
protected var __treePlane lane;
protected var __monsterPlane lane;
protected var __rotation :Number;
public function Main():void
{
init();
}
protected function init():void
{
__rotation = 0;
setDefaultWidthHeight();
createChildren();
initPapervision();
initMaterials();
initObjects();
initEvents();
}
protected function setDefaultWidthHeight():void
{
__width = 1000;
__height = 600;
}
protected function initPapervision():void
{
__scene = new Scene3D();
__camera = new FreeCamera3D();
__camera.zoom = 11;
__camera.z = -2000;
__camera.y = 20;
__viewport = new Viewport3D(__width,__height,false,true,true);
__renderer = new BasicRenderEngine();
addChild(__viewport);
}
protected function initMaterials():void
{
__moveMatRightWall = new MovieMaterial(__wallRight, true)
__moveMatWallLeft = new MovieMaterial(__wallLeft, true);
__moveMatWallBack = new MovieMaterial(__wallBack)
__moveMatFloor = new MovieMaterial(__floor);
__moveMatTree = new MovieMaterial(__tree, true );
__moveMatMonster = new MovieMaterial(__monster, true);
__moveMatRightWall.doubleSided = true;
__moveMatWallLeft.doubleSided = true;
__moveMatWallBack.doubleSided = true;
__moveMatTree.doubleSided = true;
__moveMatFloor.doubleSided = true;
__moveMatTree.doubleSided = true;
__moveMatMonster.doubleSided = true;
}
protected function initObjects():void
{
__monsterPlane = new Plane(__moveMatMonster, 184, 237, 4, 4);
__plane_rightWall = new Plane(__moveMatRightWall, 386, 239, 4,4)
__plane_wallBack = new Plane(__moveMatWallBack, 734, 240, 4,4);
__plane_wallLeft = new Plane(__moveMatWallLeft,386,239,4,4)
__floorPlane = new Plane(__moveMatFloor, 800, 800, 14,14);
__treePlane = new Plane(__moveMatTree, 79, 112, 4, 4);
__scene.addChild(__floorPlane);
__scene.addChild(__plane_wallBack);
__scene.addChild(__treePlane);
__scene.addChild(__plane_wallLeft);
__scene.addChild(__plane_rightWall);
__scene.addChild(__monsterPlane);
__floorPlane.y = -120;
__treePlane.y = -69;
__floorPlane.pitch(90);
__monsterPlane.z = -300;
__monsterPlane.x = 150;
__monsterPlane.y = -10;
__plane_wallBack.z += 340
__treePlane.z = 300;
__treePlane.x = -220;
__plane_wallLeft.x = -155;
__plane_rightWall.x = 155;
__plane_wallLeft.rotationY = -35;
__plane_rightWall.rotationY = 35
}
protected function initEvents():void
{
this.addEventListener(Event.ENTER_FRAME,render);
}
protected function render(e:Event):void
{
__renderer.renderScene(__scene, __camera, __viewport, true);
var moveXAmount:Number = (mouseX - 1000 / 2) * 4
var moveYAmount:Number = (mouseY - 600 / 2) * 2
if (moveYAmount <0)
{
moveYAmount = 0;
}
__camera.x = moveXAmount;
__camera.y = moveYAmount;
__camera.lookAt(__floorPlane)
}
protected function createChildren():void
{
//Movieclips with Export for AS in Library
__wallBack = new Wall_back();
__wallLeft = new Wall_left();
__wallRight = new Wall_right();
__floor = new Floor();
__tree = new Tree();
__monster = new Monster();
}
}
}

Papervision Popup Book : Source Code To Follow Shortly

Published

by

on June 18, 2008

in AS3, Adobe, Expert, Flash and Papervision

. 5 Comments

While talking with Mike Britton this evening he sent me this link - http://www.ecodazoo.com/ If you surf around a bit you will eventually make your way to a Popup Book which was created with a custom engine (Sharikura 3D) written by Roxik. I decided to take a try at creating it in Papervision. So far I have some of the elements in place which in itself was kinda fun to put together. I would still need to get it to fold into a book but thought this was neat in itself to post.

Download : FLA - AS & SOURCE

Don't forget the other code you will need to compile:

1) Papervision 2.0

Here is a link to my quick version

Papervision 2.0 – Exploding and Rebuilding an Image

Published

by

on May 1, 2008

in AS3, Adobe, Expert, Flash, Papervision, Source Code and Tutorials

. 12 Comments

[kml_flashembed movie="image-explode.swf" height="300" width="550" /]

I took some time last week to have some fun with Papervision. The goal was to just take an image (any image) and have it explode into pieces and then rebuild it. While searching around for code or tutorials I have only found a few where the items on the stage go back into a controlled state. So over the next few weeks I am going to try to create a few examples of things that could be used IN a website rather than having the Papervision BE the website. I am not sure that makes sense. While I love experiments I like to have things I can use on everyday websites. This example I probably be using when I launch my new site. It's just something to break away from the ole fade in and out motion.

If you want to test this code on your own computer you will need to download a few things first.

1) Papervision 2.0

2) Foomonger's Code (Call Later)

Actionscript:

package
{
import flash.display.*;
import flash.events.*;
import flash.geom.Matrix;
import flash.geom.Point;
import caurina.transitions.*
import com.foomonger.utils.Later;
import org.papervision3d.cameras.FreeCamera3D;
import org.papervision3d.materials.BitmapFileMaterial;
import org.papervision3d.materials.MovieMaterial;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.objects.primitives.Plane;
import org.papervision3d.render.BasicRenderEngine;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.view.Viewport3D;
public class PVImageExplode extends MovieClip
{
private var viewport :Viewport3D;
private var scene :Scene3D;
private var camera :FreeCamera3D;
private var block :BitmapFileMaterial;
private var movieBlock :MovieMaterial;
private var blocksArray :Array;
private var planeArray :Array;
private var clips_array :Array;
private var renderer :BasicRenderEngine;
private var __holder isplayObject3D;
private var __startCamZ :Number;
private var __homePage :MovieClip;
private var __grass isplayObject;
private var __grassHolder :MovieClip;
private var __col :Number;
private var __rows :Number;
private var __blockWidth :Number;
private var __blockHeight :Number;
private var __yawAmount :Number = 0;
public function PVImageExplode()
{
init()
}
private function init():void
{
createChildren();
size();
initPapervision();
initMaterials();
initObjects();
initEvents();
}
//-----------------------------------------------------------------------
//Adds image to the stage to be then broke apart
//-----------------------------------------------------------------------
protected function createChildren():void
{
__grassHolder = new MovieClip();
__grass = new GrassItem();
__grassHolder.visible = false;
__grassHolder.addChild(__grass)
addChild(__grassHolder);
}
protected function size():void
{
__col = 4;
__rows = 10;
}
//-----------------------------------------------------------------------
//Papervision init setup
//-----------------------------------------------------------------------
private function initPapervision():void
{
viewport = new Viewport3D(1000,600,false,true,false);
addChild(viewport);
scene = new Scene3D();
camera = new FreeCamera3D();
renderer = new BasicRenderEngine();
camera.zoom = 11;
__startCamZ = -6000
}
//-----------------------------------------------------------------------
//Papervision materials setup
//-----------------------------------------------------------------------
private function initMaterials():void
{
blocksArray = [];
clips_array = new Array();
var __w:int =Math.ceil(__grassHolder.width / __col);
var __h:int =Math.ceil(__grassHolder.height / __rows);
__blockWidth = __w;
__blockHeight = __h;
var matrix :Matrix;
var bitmap_data :BitmapData;
var point oint;
var clip :MovieClip;
var columns :Number = __col;
var cellWidth :Number = __blockWidth;
var cellHeight :Number = __blockHeight;
var cellX :Number
var cellY :Number
var bx :Number
var by :Number
var bitmap :Bitmap
for (var i:int=0; i <(__rows * __col); i++)
{
cellX = i % columns;
cellY = Math.floor(i / columns);
bitmap_data = new BitmapData(__w,__h,true,0x00FFFFFF);
matrix = __grassHolder.transform.matrix;
bx = (cellX * cellWidth);
by = cellY * cellHeight;
matrix.translate(-__w * cellX, -__h * cellY);
bitmap_data.draw(__grassHolder,matrix);
clip = new MovieClip();
clips_array.push(clip);
clip.id = i;
addChild(clip);
point = new Point(__grassHolder.x + __w * cellX, __grassHolder.y + __h * cellY);
bitmap =new Bitmap(bitmap_data);
clip.addChild(bitmap);
clip.visible = false;
clip.x = point.x;
clip.y = point.y;
}
for(var k:uint = 0;k<clips_array.length;k++)
{
movieBlock = new MovieMaterial(clips_array[k],true);
movieBlock.doubleSided = true;
blocksArray.push(movieBlock);
}
}
//-----------------------------------------------------------------------
//Papervision objects setup (planes etc)
//-----------------------------------------------------------------------
private function initObjects():void
{
planeArray = [];
__holder = new DisplayObject3D();
__holder.x = -420;
__holder.y = 280
scene.addChild(__holder);
for(var k:uint = 0;k<blocksArray.length;k++)
{
var plane:Plane = new Plane(blocksArray[k],__blockWidth,__blockHeight,3,3);
var columns:Number = __col;
var cellWidth:Number = __blockWidth;
var cellHeight:Number = -__blockHeight;
var cellX:Number = k % columns;
var cellY:Number = Math.floor(k / columns);
plane.x = (cellX * cellWidth);
plane.y = cellY * cellHeight;
planeArray.push({plane:plane,pX:plane.x,pY:plane.y,pZ:plane.z,pR:plane.rotationY})
__holder.addChild(plane);
}
Later.call(this, explode, 500, true);
}
//-----------------------------------------------------------------------
//Start enterframe render event
//-----------------------------------------------------------------------
public function initEvents():void
{
this.addEventListener(Event.ENTER_FRAME,renderEvent);
}
//-----------------------------------------------------------------------
//Killin it
//-----------------------------------------------------------------------
public function killEvents():void
{
this.removeEventListener(Event.ENTER_FRAME,renderEvent);
}
//-----------------------------------------------------------------------
//Render the stage
//-----------------------------------------------------------------------
protected function renderEvent(e:Event):void
{
for(var i:uint = 0; i<planeArray.length;i++)
{
var plane = planeArray[i].plane;
plane.yaw(__yawAmount);
}
renderer.renderScene(scene,camera,viewport);
}
protected function resumeYaw():void
{
__yawAmount = 10;
}
//-----------------------------------------------------------------------
//The explosive magic (could be on a button click instead of later calls)
//-----------------------------------------------------------------------
protected function explode(e:Event = null):void
{
for(var i:uint = 0; i<planeArray.length;i++)
{
var plane = planeArray[i].plane;
var __x:Number = Math.random() * 3000 - 1000;
var __y:Number = Math.random() * 1000 - 500;
var __z:Number = Math.random() * 1000 - 500;
var __rY:Number = Math.random()* 720;
Tweener.addTween(plane,{x:__x,y:__y,z:__z,rotationY:__rY,transition:"easeInOutQuint",time:1})
}
Tweener.addTween(camera,{z:__startCamZ,x:1000,y:-400,transition:"easeInOutQuint",time:1,onComplete:resumeYaw})
Later.call(this, putBackTogether, 5000, true);
}
//-----------------------------------------------------------------------
//The Humpty Dumpty
//-----------------------------------------------------------------------
protected function putBackTogether(e:Event = null):void
{
Tweener.addTween(camera,{z:-1000,x:0,y:0,transition:"easeOutQuint",time:.3})
__yawAmount = 0;
for(var i:uint = 0; i<planeArray.length;i++)
{
var plane:Plane = planeArray[i].plane;
var __x:Number = planeArray[i].pX
var __y:Number = planeArray[i].pY
var __z:Number = planeArray[i].pZ
var __rY:Number = planeArray[i].pR
Tweener.addTween(plane,{x:__x,y:__y,z:__z,rotationY:__rY,delay:.3,transition:"easeInOutQuint",time:1})
}
Later.call(this, explode, 5000, true);
}
}
}

Follow papervision2 on Twitter