Ambiera Forum

Discussions, Help and Support.

Ambiera Forum > CopperLicht
Adding Mouse Listeners

sagh0900
Registered User
Quote
2012-08-29 21:37:04

Hi,

I'm a newbie for this technology, webGL or CopperLicht. But trying to learn bit by bit.

I took this example,

http://apachepersonal.miun.se/~rogols/teaching/dt069g/Copperlicht-exempel.html

and trying to add mouse listeners so that I can drag and turn myself the cube. I did the following, and never happening for me.

This is my code:



function CopperlichtStart() {

var engine = new CL3D.CopperLicht('glcanvas');
if (!engine.initRenderer())
return; // this browser doesn't support WebGL


scene = new CL3D.Scene();
engine.addScene(scene);


scene.setBackgroundColor(CL3D.createColor(1, 0, 0, 0));

scene.setRedrawMode(CL3D.Scene.REDRAW_EVERY_FRAME);


var boxnode = new CL3D.CubeSceneNode();
scene.getRootSceneNode().addChild(boxnode);



boxnode.getMaterial(0).Tex1 = engine.getTextureManager().getTexture("resources/girl.jpg", true);




boxnode.addAnimator(new CL3D.AnimatorRotation(new CL3D.Vect3d(0.0,-0.15,0.15)));


var cam = new CL3D.CameraSceneNode();

cam.Pos.X = 0;
cam.Pos.Y = 0;
cam.Pos.Z = 20;

var canvas = document.getElementById("glcanvas");
var AR = canvas.width / canvas.height;
cam.setAspectRatio(AR);

cam.setFov(45);
scene.getRootSceneNode().addChild(cam);
scene.setActiveCamera(cam);

var vshaderScript = document.getElementById("vshader");
var fshaderScript = document.getElementById("fshader");
var newMaterialType = engine.getRenderer().createMaterialType(vshaderScript.text, fshaderScript.text);
if (newMaterialType != -1)
boxnode.getMaterial(0).Type = newMaterialType;
else
alert('Cannot create Shaders');
}



Can someone please explain (if you can, please in terms of code), how can i do this? I blew my mind for this since 2 days. When I'm doing in general JS style, my mouse events are not firing. I even tried to register the listeners with 3D engine like:


var dragging = false;


document. = function(event)
{
if (dragging)
{

boxnode.Pos.X+=event.clientX;
boxnode.Pos.y+=event.clientY;

}
engine.handleMouseMove(event);
};

document. = function(event)
{
dragging = false;
engine.handleMouseUp(event);
};

document. = function(event)
{
dragging = true;
boxnode.Pos.X+=event.clientX;
boxnode.Pos.y+=event.clientY;
engine.handleMouseDown(event);
};



yet no hopes..:(. I'm really thankful, if someone explains me how I can do this.


niko
Moderator
Quote
2012-08-30 17:55:53

Unfortunately, the forum swallowed some of your code (it doesn'T like the event handler names :) ), but did you try and look at the keyboard input tutorial? http://www.ambiera.com/copperlic... Mouse input should work the same way.


sagh0900
Registered User
Quote
2012-09-08 14:28:08

There are two ways creating copperlicht application as I found:

1. Creating the scene from CL3D engine and cubescenenode etc..

2. Create the scene from COpperCube ccjbs file.

In the link you provided, it's worked on second way, but I want to work on first way, you can find that I in't use any .ccjbs file on above code.

I'm confused, so you are saying there is no way of performing mouse events on 3D objects in the canvas?


sagh0900
Registered User
Quote
2012-09-08 14:32:50

Any particular example of mouse events handling? I found none in searching internet.


niko
Moderator
Quote
2012-09-09 22:36:11

For an example, do it like this:
 document.on mousemove = function(event)
{
// your code here, like
// something.Pos.X+=event.clientX;
}
engine.handleMouseMove(event);

(remove the space between on and mousemove)


Create reply:


Posted by: (you are not logged in)


Enter the missing letter in: "Internation?l" (you are not logged in)


Text:

 

  

Possible Codes


Feature Code
Link [url] www.example.com [/url]
Bold [b]bold text[/b]
Image [img]http://www.example.com/image.jpg[/img]
Quote [quote]quoted text[/quote]
Code [code]source code[/code]

Emoticons


   






Copyright© Ambiera e.U. all rights reserved.
Privacy Policy | Terms and Conditions | Imprint | Contact