[Papervision3D] PV3D 2.0 interactive TextInput
Alexander C. Pelzl
alexander.pelzl at softmax.es
Fri Dec 14 07:46:07 PST 2007
Hi Thorsten and great Community,
thank you to help us clear our minds about ISM, drawNow() ... I just
dont understand how your class seems in the end to be working without
imports for construction of
a) new manipulator()
var cman:MovieMaterial = new MovieMaterial(new manipulator(),
true, true);
b) new singleDay()
var cm:MovieMaterial = new MovieMaterial(new singleDay(), true,
true, true);
.
Could you be so nice to provide the classes? It would really help to get
the concept.
Cheers, ALEX
De'Angelo Richardson schrieb:
> A quick answer to #2 is to move it off the stage as in make the x =
> -9999 or something.
> drawNow() is to make sure it draws currectly.
>
>
> -De'Angelo
>
>
>
> ----- Original Message ----
> From: Thorsten Michelfelder <Thorsten at Michelfelder.net>
> To: papervision3d at osflash.org
> Sent: Thursday, December 13, 2007 3:40:41 PM
> Subject: Re: [Papervision3D] PV3D 2.0 interactive TextInput
>
> Hello
>
> Thank you for your respons.
> Meanwhile, I got some professional help from De'Angelo. (Thanks again!)
>
> A few things that I possibly made wrong from the beginning:
> 1) I never used the drawNow() method, not sure what its used for.
> 2) Obviously, the material needs to be added to the stage. I never did
> this. How to make it invisible, so that the 3D textinput still works,
> thats another mystery to solve. (De'Angelo?)
> 3) I used a native Input Text at first. What is needed, is a TextInput
> Component.
> 4) You named already the interactive flags. I did not consider those
> at the very beginning, but realized very soon that those are a key to
> the whole functionality.
>
> Also, you might want to use: viewport.containerSprite.buttonMode =
> true; in some way, to make the mouse pointer change.
>
> I never worked with Flash/PV3D before, just started out two weeks ago,
> or so and layed my hands on the alpha release. Not the smartest thing
> to do, but Im fighting my way through.
>
> I though I should just paste my code, hopefully it will be usefull for
> someone.
>
> Hints:
> Make "singleDay" a simple movieclip as a blue rectangle or something.
> Make "manipulator" a simple movieclip as a red rectangle or something
> and place a TextInput component on it. Give it an instance name called
> "heading".
> You might want to download and use Tweener.
>
> Then, the following code should just run as it is.
>
> ---------
> import flash.events.*;
>
> import org.papervision3d.cameras.*;
> import org.papervision3d.scenes.*;
> import org.papervision3d.objects.*;
> import org.papervision3d.objects.special.*;
> import org.papervision3d.materials.*;
> import org.papervision3d.materials.special.*;
> import org.papervision3d.lights.*;
> import org.papervision3d.render.*;
> import org.papervision3d.view.*;
> import org.papervision3d.materials.shaders.*;
> import org.papervision3d.objects.primitives.*;
> import org.papervision3d.events.*
>
> import classes.caurina.transitions.Tweener;
>
>
>
> // -----------------------------------------------------------
> // Global variables
>
> // Create a viewport
> var viewport:Viewport3D = new Viewport3D(500, 500, true, true);
> // Create a renderer
> var renderer:BasicRenderEngine = new BasicRenderEngine();
> // Create a scene
> var scene:Scene3D = new Scene3D(true);
> // Create a camera
> var camera:Camera3D = new Camera3D();
> // Create camera center
> var pc:Plane = new Plane();
>
> // Variables supporting the functionality
> var angle:Number = 0;
> var manipElement:Plane;
>
> // Spiral properties
> const num:int = 90;
> const numOfRotations:Number = 6;
> const anglePer:Number = ((Math.PI*2) * numOfRotations) / num;
> const yOffset:Number = 60;
> const spiralRadius:Number = 1000;
> var yPos:Number = 0;
>
>
> // -----------------------------------------------------------
> // Functions
>
> function init()
> {
> // Setup of Viewport3D
> viewport.containerSprite.buttonMode = true;
> addChild(viewport);
>
> // set camera up
> camera.zoom = 1;
> camera.focus = spiralRadius-(spiralRadius/10);
>
> // set scene center up
> pc.visible = false;
> camera.target = pc;
>
> // Create the render loop
> addEventListener(Event.ENTER_FRAME, render);
> }
>
> function setManipulatorElement()
> {
> // Manipulator plane
> var cman:MovieMaterial = new MovieMaterial(new manipulator(),
> true, true);
> cman.interactive = true; // This one is a key to make it work.
> cman.oneSide = false;
> cman.animated = true;
> cman.smooth = true;
> cman.movie['heading'].addEventListener(MouseEvent.CLICK,
> onTextFieldClick); // This one is a key to make it work.
> cman.movie['heading'].drawNow();
>
> addChild(cman.movie); // This one is a key to make it work.
>
> manipElement = new Plane(cman, 400, 200, 4, 4);
> manipElement.x = 100;
> manipElement.y = 100;
> manipElement.z = 100;
> scene.addChild(manipElement, "manipElement");
> }
>
> function setSpiralElement()
> {
> // Create the planes
> for(var i:uint=0; i<num ; i++)
> {
> var cm:MovieMaterial = new MovieMaterial(new
> singleDay(), true, true, true);
> cm.oneSide = false;
> cm.interactive = true;
> cm.animated = true;
> cm.smooth = true;
> cm.addEventListener(MouseEvent.CLICK, onMouseClick);
> var p:Plane = new Plane(cm, 320, 120);
> p.x = Math.cos(i * anglePer) * spiralRadius;
> p.z = Math.sin(i * anglePer) * spiralRadius;
> p.y = yPos += yOffset;
> p.rotationY = (-i*anglePer) * (180/Math.PI) + 270;
> scene.addChild(p, "day");
>
> p.addEventListener
> (InteractiveScene3DEvent.OBJECT_CLICK, onMouseClick);
> p.addEventListener
> (InteractiveScene3DEvent.OBJECT_OVER, onMouseOver);
> p.addEventListener
> (InteractiveScene3DEvent.OBJECT_OUT, onMouseOut);
> }
> }
>
>
>
> // -----------------------------------------------------------
> // Event handler functions
>
> function onTextFieldClick(e:MouseEvent):void
> {
> e.currentTarget.drawNow();
> var indexT:Number =
> e.target.getCharIndexAtPoint(e.localX,e.localY);
> e.target.setSelection(indexT,indexT);
> }
>
> function onMouseClick (e:InteractiveScene3DEvent):void
> {
> // Do this only if its not the manipulator
> if (e.displayObject3D.material.id
> <http://e.displayobject3d.material.id/>!=91)
> {
> var x =
> viewport.interactiveSceneManager.currentDisplayObject3D.x;
> var y =
> viewport.interactiveSceneManager.currentDisplayObject3D.y;
> var z =
> viewport.interactiveSceneManager.currentDisplayObject3D.z;
> var u =
> viewport.interactiveSceneManager.currentDisplayObject3D.rotationY;
> var t = 2;
>
>
> Tweener.addTween(e.displayObject3D.material,{fillAlpha:255, time:t});
>
> Tweener.addTween(manipElement,{rotationY:u,time:t,transition:"easeoutquint"});
> Tweener.addTween(manipElement,{y:y-200, time:t,
> transition:"easeoutquint"});
> Tweener.addTween(manipElement,{x:x, time:t,
> transition:"easeoutquint"});
> Tweener.addTween(manipElement,{z:z, time:t,
> transition:"easeoutquint"});
> }
> }
>
>
> var rotY:Number;
>
> function onMouseOver (e:InteractiveScene3DEvent):void
> {
> fixLocation = true;
>
> if (e.displayObject3D.material.id
> <http://e.displayobject3d.material.id/>!=91)
> {
> rotY =
> viewport.interactiveSceneManager.currentDisplayObject3D.rotationY;
> var t = 2;
> var r = -(spiralRadius+1800);
>
>
> Tweener.addTween(e.displayObject3D,{x:Math.sin(Math.PI/180*rotY)*r,
> z:Math.cos(Math.PI/180*rotY)*r, time:t, transition:"easeoutquint"});
> }
>
> }
>
> function onMouseOut (e:InteractiveScene3DEvent):void
> {
> fixLocation = false;
>
> if (e.displayObject3D.material.id
> <http://e.displayobject3d.material.id/>!=91)
> {
> var t = 2;
> var r = -(spiralRadius);
>
>
> Tweener.addTween(e.displayObject3D,{x:Math.sin(Math.PI/180*rotY)*r,
> z:Math.cos(Math.PI/180*rotY)*r, time:t, transition:"easeoutquint"});
> }
> }
>
>
>
> // -----------------------------------------------------------
> // The renderer
> var fixLocation=false;
>
> function render(e:Event):void
> {
> var upperBoarder:Number = 36;
> var lowerBoarder:Number = 0;
> var inc:Number = 0;
>
> if (fixLocation==false)
> {
> var mouseLoc:Number = ((stage.mouseX) -
> stage.stageWidth * 0.5);
>
> // Move the carousel faster, when farther away from
> the centre
> inc = Math.pow(Math.abs(mouseLoc),1.3) * 0.0001;
> if (mouseLoc<0)
> inc*=-1;
> }
> else
> {
>
> //Tweener.addTween(camera,{x:Math.sin(Math.PI/180*rotY)*(spiralRadius+2000),
> z:Math.cos(Math.PI/180*rotY)*(spiralRadius+2000), time:5,
> transition:"easeoutquint"});
> }
>
> angle += inc;
> camera.x = Math.cos(angle) * (spiralRadius+2000);
> camera.z = Math.sin(angle) * (spiralRadius+2000);
>
> if (angle>lowerBoarder && angle<upperBoarder)
> camera.y += inc *
> (num/numOfRotations*yOffset)/(2*Math.PI);
>
> if(angle <lowerBoarder) angle = lowerBoarder;
> if(angle> upperBoarder) angle = upperBoarder;
>
> pc.y = camera.y;
>
> // Finally, render the scene with the given setup.
> renderer.renderScene(scene, camera, viewport);
> }
>
>
>
>
> // -------------------------------------------------------------------
> // Methods to start the application
> init();
> setSpiralElement();
> setManipulatorElement();
>
>
>
> At 23:10 2007-12-13, you wrote:
>> Hi,
>>
>> I kinda started looking into the same thing – not much success with
>> what I wanted to do.
>> Anyways, maybe it would help if you stick to the code as used in the
>> phunky-branch.
>> Skimming through your code it looks like you just make the plane
>> listen for events.
>> I used the component from the phunky example and added a listener the
>> same way it
>> was done there. Unfortunately it does not work well yet, no responds
>> from the drop down but
>> maybe it will help you a bit.
>>
>> var materialForm:MovieMaterial = new
>> MovieMaterial(formUIContainer["formUI"],true,true,true);
>> materialForm.doubleSided = true;
>> materialForm.interactive = true;
>> materialForm.smooth = true;
>> materialForm.animated = true;
>> materialForm.movie["btn"].addEventListener(MouseEvent.CLICK,
>> onMouseClick);
>>
>> don
>>
>> *Von:* papervision3d-bounces at osflash.org [
>> mailto:papervision3d-bounces at osflash.org] *Im Auftrag von *Thorsten
>> Michelfelder
>> *Gesendet:* Mittwoch, 12. Dezember 2007 00:07
>> *An:* papervision3d at osflash.org
>> *Betreff:* Re: [Papervision3D] PV3D 2.0 interactive TextInput
>>
>> Papervision hates me.
>> I know what steps to do - at least im under the impression that I do
>> - but this text input refuses to let me type stuff into it.
>> I can click on it, to get an event fired. Thats about it. No cursor
>> change, to let me know that there is some place to enter something.
>>
>> Any ideas?
>>
>> Oh, here is the application code to dig in.
>> The "manipulator" element is a MovieClip with a simple text field
>> (Input Text - created via the Text Tool in Flash CS3) on it, where I
>> want to type some text.
>> You probably want to take your first look into the function
>> "setManipulatorElement()".
>>
>>
>>
>> import org.papervision3d.cameras.*;
>> import org.papervision3d.scenes.*;
>> import org.papervision3d.objects.*;
>> import org.papervision3d.objects.special.*;
>> import org.papervision3d.materials.*;
>> import org.papervision3d.materials.special.*;
>> import org.papervision3d.lights.*;
>> import org.papervision3d.render.*;
>> import org.papervision3d.view.*;
>> import org.papervision3d.materials.shaders.*;
>> import org.papervision3d.objects.primitives.*;
>> import org.papervision3d.events.*
>>
>> import caurina.transitions.Tweener;
>>
>>
>>
>> // -----------------------------------------------------------
>> // Global variables
>>
>> // Create a viewport
>> var viewport:Viewport3D = new Viewport3D(500, 500, true, true);
>> // Create a renderer
>> var renderer:BasicRenderEngine = new BasicRenderEngine();
>> // Create a scene
>> var scene:Scene3D = new Scene3D(true);
>> // Create a camera
>> var camera:Camera3D = new Camera3D();
>> // Create camera center
>> var pc:Plane = new Plane();
>>
>> // Variables supporting the functionality
>> var angle:Number = 0;
>> var manipElement:Plane;
>>
>> // Spiral properties
>> const num:int = 90;
>> const numOfRotations:Number = 6;
>> const anglePer:Number = ((Math.PI*2) * numOfRotations) / num;
>> const yOffset:Number = 60;
>> const spiralRadius:Number = 1000;
>> var yPos:Number = 0;
>>
>>
>> // -----------------------------------------------------------
>> // Functions
>>
>> function init()
>> {
>> // Setup of Viewport3D // Not used any more, trying to
>> add events directly to the element they belong to.
>> //
>> viewport.interactiveSceneManager.addEventListener(InteractiveScene3DEvent.OBJECT_CLICK,
>> onMouseClick);
>> //
>> viewport.interactiveSceneManager.addEventListener(InteractiveScene3DEvent.OBJECT_OVER,
>> onMouseOver);
>> //
>> viewport.interactiveSceneManager.addEventListener(InteractiveScene3DEvent.OBJECT_OUT,
>> onMouseOut);
>> addChild(viewport);
>>
>> // set camera up
>> camera.zoom = 1;
>> camera.focus = spiralRadius-(spiralRadius/10);
>>
>> // set scene center up
>> pc.visible = false;
>> camera.target = pc;
>>
>> // Create the render loop
>> addEventListener(Event.ENTER_FRAME, render);
>> }
>>
>> function setManipulatorElement()
>> {
>> // Manipulator plane
>> var cman:MovieAssetMaterial = new
>> MovieAssetMaterial("manipulator", true, true, true);
>> cman.interactive = true;
>> cman.oneSide = false;
>> cman.animated = true;
>> cman.smooth = true;
>>
>> manipElement = new Plane(cman, 400, 200, 4, 4);
>> manipElement.x = 100;
>> manipElement.y = 100;
>> manipElement.z = 100;
>> scene.addChild(manipElement, "manipElement");
>> manipElement.addEventListener
>> (InteractiveScene3DEvent.OBJECT_CLICK, onTest);
>>
>> //var m : DisplayObject3D = scene.getChildByName(
>> "manipElement" );
>> //m.addEventListener( InteractiveScene3DEvent.OBJECT_CLICK,
>> onTest );
>> }
>>
>> function setSpiralElement()
>> {
>> // Create the planes
>> for(var i:uint=0; i<num ; i++)
>> { var cm:MovieAssetMaterial = new
>> MovieAssetMaterial("day", true, true, true);
>> cm.oneSide = false;
>> cm.interactive = true;
>> cm.animated = true;
>> cm.smooth = true;
>> var p:Plane = new Plane(cm, 320,
>> 120);
>> p.x = Math.cos(i * anglePer) * spiralRadius;
>> p.z = Math.sin(i * anglePer) * spiralRadius;
>> p.y = yPos += yOffset;
>> p.rotationY = (-i*anglePer) * (180/Math.PI) + 270;
>> scene.addChild(p, "day");
>> p.addEventListener
>> (InteractiveScene3DEvent.OBJECT_CLICK, onMouseClick);
>> p.addEventListener
>> (InteractiveScene3DEvent.OBJECT_OVER, onMouseOver);
>> p.addEventListener
>> (InteractiveScene3DEvent.OBJECT_OUT, onMouseOut);
>> }
>> }
>>
>>
>>
>> // -----------------------------------------------------------
>> // Event handler functions
>>
>> function onTest(e:InteractiveScene3DEvent):void
>> {
>> trace("Test fired !");
>> }
>>
>>
>> function onMouseClick (e:InteractiveScene3DEvent):void
>> {
>> // Do this only if its not the manipulator
>> if (e.displayObject3D.material.id
>> <http://e.displayobject3d.material.id/>!=91)
>> {
>> var x =
>> viewport.interactiveSceneManager.currentDisplayObject3D.x;
>> var y =
>> viewport.interactiveSceneManager.currentDisplayObject3D.y;
>> var z =
>> viewport.interactiveSceneManager.currentDisplayObject3D.z;
>> var u =
>> viewport.interactiveSceneManager.currentDisplayObject3D.rotationY;
>> var t = 2;
>>
>> Tweener.addTween(e.displayObject3D.material,{fillAlpha:255, time:t});
>>
>> Tweener.addTween(manipElement,{rotationY:u,time:t,transition:"easeoutquint"});
>> Tweener.addTween(manipElement,{y:y-200, time:t,
>> transition:"easeoutquint"});
>> Tweener.addTween(manipElement,{x:x, time:t,
>> transition:"easeoutquint"});
>> Tweener.addTween(manipElement,{z:z, time:t,
>> transition:"easeoutquint"});
>> }
>> }
>>
>>
>> var rotY:Number;
>>
>> function onMouseOver (e:InteractiveScene3DEvent):void
>> {
>> fixLocation = true;
>> if (e.displayObject3D.material.id
>> <http://e.displayobject3d.material.id/>!=91)
>> {
>> rotY =
>> viewport.interactiveSceneManager.currentDisplayObject3D.rotationY;
>> var t = 2;
>> var r = -(spiralRadius+1800);
>>
>>
>> Tweener.addTween(e.displayObject3D,{x:Math.sin(Math.PI/180*rotY)*r,
>> z:Math.cos(Math.PI/180*rotY)*r, time:t, transition:"easeoutquint"});
>> }
>> }
>>
>> function onMouseOut (e:InteractiveScene3DEvent):void
>> {
>> fixLocation = false;
>> if (e.displayObject3D.material.id
>> <http://e.displayobject3d.material.id/>!=91)
>> {
>> var t = 2;
>> var r = -(spiralRadius);
>>
>>
>> Tweener.addTween(e.displayObject3D,{x:Math.sin(Math.PI/180*rotY)*r,
>> z:Math.cos(Math.PI/180*rotY)*r, time:t, transition:"easeoutquint"});
>> }
>> }
>>
>>
>>
>> // -----------------------------------------------------------
>> // The renderer
>> var fixLocation=false;
>>
>> function render(e:Event):void
>> {
>> var upperBoarder:Number = 36;
>> var lowerBoarder:Number = 0;
>> var inc:Number = 0;
>>
>> if (fixLocation==false)
>> {
>> var mouseLoc:Number = ((stage.mouseX) -
>> stage.stageWidth * 0.5);
>> // Move the carousel faster, when
>> farther away from the centre
>> inc = Math.pow(Math.abs(mouseLoc),1.3) * 0.0001;
>> if (mouseLoc<0)
>> inc*=-1;
>> }
>> else
>> {
>>
>> //Tweener.addTween(camera,{x:Math.sin(Math.PI/180*rotY)*(spiralRadius+2000),
>> z:Math.cos(Math.PI/180*rotY)*(spiralRadius+2000), time:5,
>> transition:"easeoutquint"});
>> }
>> angle += inc;
>> camera.x = Math.cos(angle) * (spiralRadius+2000);
>> camera.z = Math.sin(angle) * (spiralRadius+2000);
>>
>> if (angle>lowerBoarder && angle<upperBoarder)
>> camera.y += inc *
>> (num/numOfRotations*yOffset)/(2*Math.PI);
>>
>> if(angle <lowerBoarder) angle = lowerBoarder;
>> if(angle> upperBoarder) angle = upperBoarder;
>> pc.y = camera.y;
>> // Finally, render the scene with the given setup.
>> renderer.renderScene(scene, camera, viewport);
>> }
>>
>>
>>
>>
>> // -------------------------------------------------------------------
>> // Methods to start the application
>> init();
>> setSpiralElement();
>> setManipulatorElement();
>>
>>
>> Any ideas?
>> Thanks in advance!
>>
>>
>>
>> At 15:09 2007-12-11, you wrote:
>> Fullwebs* ''intelligent solutions for intelligent people,,
>>
>> Take a look at this post (If you don't have already see it):
>>
>> http://www.nabble.com/Example-interactive-form-with-GreatWhite-tp14256727p14256727.html
>>
>>
>> That's not Flash CS3, but the code can be ported from Flex to Flash.
>> Hope it could help you ;-). See ya!
>>
>> P.S: I'm not english speaker... Maybe there are a lot of mistakes.
>> Sorry :-P
>>
>> .........................................................................................
>> Maximiliano < ßersërker ReznoR> Fernández do Santos
>> .............................................................Dpto
>> Diseño/Sistemas | Fullwebs*
>>
>> _______________________________________________
>> Papervision3D mailing list
>> Papervision3D at osflash.org
>> http://osflash.org/mailman/listinfo/papervision3d_osflash.org
>>
>> >------------------------------------------------------=->
>> > my homepage at http://Thorsten.Michelfelder.net
>> <http://thorsten.michelfelder.net/>
>> ___________________________________________________
>> _______________________________________________
>> Papervision3D mailing list
>> Papervision3D at osflash.org
>> http://osflash.org/mailman/listinfo/papervision3d_osflash.org
>
> >------------------------------------------------------=->
> > my homepage at http://Thorsten.Michelfelder.net
> <http://thorsten.michelfelder.net/>___________________________________________________
>
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> Papervision3D mailing list
> Papervision3D at osflash.org
> http://osflash.org/mailman/listinfo/papervision3d_osflash.org
>
--
**** A L E X A N D E R P E L Z L
**** Proprietario
****
**** SOFTMAX.ES
**** Fon: +34 971 729 173
**** Mob: +34 636 262 911
**** eMail: alexander.pelzl at softmax.es
****
**** SOFTMAX.ES | NIE X7741417P | Plaza de la Lonja 7/4B
**** E-07012 Palma de Mallorca
**** www.softmax.es | office at softmax.es
____________________________________________________________________________
AVÍS LEGAL
Aquest missatge s'adreça només al seu destinatari i és confidencial. Si
l'heu rebut o n'heu tingut coneixement per error, "SA NOSTRA" us informa que
el seu contingut és reservat. Atès que, conseqüentment, la seva lectura,
còpia i ús no estan autoritzats, us pregam que ens comuniqueu la recepció
d'aquest missatge per la mateixa via i que l'esborreu com més aviat millor.
"SOFTMAX.ES" es reserva el dret d'exercir les accions legals pertinents contra
qualsevol persona o entitat que pugui accedir de forma il·legitima al
contingut d'aquest missatge i al dels fitxers que conté.
____________________________________________________________________________
AVISO LEGAL
Este mensaje está dirigido únicamente a su destinatario y es confidencial.
Si lo ha recibido o tenido conocimiento del mismo por error, "SA NOSTRA" le
informa que su contenido es reservado y su lectura, copia y uso no está
autorizado, por lo que en tal caso le rogamos nos lo comunique por la misma
vía y proceda a borrarlo de manera inmediata.
"SOFTMAX.ES" se reserva el derecho de ejercer las acciones legales que le
correspondan contra todo tercero que acceda de forma ilegítima al contenido
de este mensaje y al de los ficheros contenidos en el mismo.
____________________________________________________________________________
More information about the Papervision3D
mailing list