3rd Person Player & Camera Controller 2021 - Programming and Scripting Forum

Ambiera Forum

Discussions, Help and Support.

[

2 3 4 5 ] Page 1 of 5

	Ambiera Forum > CopperCube > Programming and Scripting
	3rd Person Player & Camera Controller 2021

hadoken Guest
Quote
2021-02-21 12:59:09

*** Within the forum we can regularly read the question: ***

How can a better third person player & camera controller be achieved in CopperCube?

(e.g. like in this example: http://www.letterskingdom.com/newdemo/ or you could also take prominent examples from the Elder Scrolls, Tomb Raider, Gothic or The Witcher series)

Dieter from csp-games has recently done some groundbreaking work here, for which I would like to thank him sincerly (check his itch.io site: https://jfkeo1010etc.itch.io/mini3dsoundenginejs).

At the moment we might not be quite there yet, but possibly everyone being interested could work together here in this newly opened thread towards a perfect result:

@Dieter
Your latest webgl control script works really great! Although you can't set any animations for the player regarding the movements yet, but that should be easy doable by adding variables and key queries, even without scripting I guess. You wondered "whether it is better than the built in one I can't say." -> Now this is already better than the existing built-in solution after having already done a lot of research in this field!

Dieter, you wrote:
"If you need it for windows, you must convert the keys and mouse routines." (in this ;-) somewhat hitchhiked thread: https://ambiera.com/forum.php?t=8790&page=2)

For a WASD control I was successfully able to replace the keycodes of your script, so that is now also working great in WebGl.

However, I have no idea where to start in order to adapt "keys and mouse routines" for a desired Windows target.

Could you or anyone else skilled and interested maybe help with another detailed info or contribution?

Would some additional vertical mouse look behavior also be easy?
(I have already dealt with something like this in godot, where I used a gimbal kind of node architecture for the camera mouse look/rotation, but maybe such thing would not be necessary in Coppercube...?)

csp-games Guest
Quote
2021-02-21 16:57:33

Hi Hadoken, thanks for you attention.

Vertical mouse look is currently used to alter the camera height (even tho this still requires smoothing), if allowed in the parameter settings. It may however be possible to alternatively tild the camera dynamically based on mouseYspeed. Just use this.omycam_pitch for tilting where it uses this.CamTilt.

The other thing, keys and mouse in windows, I have also no clue. Compiling it for windows resulted in error "undefined document.", but I see no way to code in JS without to use the "document" element, esp. for canvas access and event handling.

While it's possible to get the mouse speed only from the CC functions for mouse xy, it is still required to repeatedly position the mouse at the screen center to prevent it from reaching the screen edge. So if we had Positionpointer in CC built in functions, a movementX/Y substitute could be written easily. But only IF so. And the keys you probably could read from the CC internal key behaviour features, then simply set and unset the global variables bb2js__keyLeft etc. from within those built-in key response features, that are multiplatform I suppose. Theoretically the camera could be controlled by keys only.

hadoken Guest
Quote
2021-02-21 18:43:16

Dieter, you are completely right. My efforts also stopped at exactly this point some time ago for which I did not found a scripting reference for CopperCube desktop builds:

"it is still required to repeatedly position the mouse at the screen center to prevent it from reaching the screen edge" :-((

But I am sure there must be some solution or workaround to the problem as two promising examples may suggest which can be found here:

https://www.dropbox.com/sh/njn6svl9e6o89pc/AADR7twXePhvPPVGWPFLXID-a?dl=0

A) behavior_thirdPersonShooter.js from the official CopperCube extensions page (https://www.ambiera.com/coppercube/download_extensions.html)

B) action_horizontalrotatewithmouse.js by forum member Just_in_case who also contributed lots of valuable content to our CopperCube community (THX!)

I am not satisfied with my attempts so far, because none of these two examples does simultaneously the job for two important requirements:
1.) rotate player & camera with mouse movement (keys better for strafe behavior)
2.) camera must follow player & player rotation smoothly always from behind the player

csp-games Guest
Quote
2021-02-21 19:14:37

Indeed, the 3rd person shooter extension by Niko shows a way to deal with it. As I understand from "Rotates the character to where the mouse is", it uses the 3D coords of where the mouse xy hit the world ( ccbGet3DPosFrom2DPos(x,y) ), then uses Math.atan2 to calculate the angle the player should be rotated on the pitch angle. It isn't mouselook per se, but certaily a way to make a playable game. You can then aim at enemies by moving the mouse over them, or some 2d overlay, decal etc.

However, as soon as the camera moves behind the player, the mouse xy would point to a diffrent 3d location, requiring to add a click / mousedown condition or something like that.

With the mousedown condition you can also implement mousespeed, as the user can bring the mouse back on the canvas while not holding the mouse down. So that is an option too. Like the controls in the editor, just smoothed.

For an adventure I probably would rather combine cursor rotation and walk-to clicked location.

csp-games Guest
Quote
2021-02-21 19:45:46

EDIT forum thinks this is spam because of variable m.o.u.s.e.x, so I write mouse?...

here's how to mod my script to get mouse speed without the browsers movement xy handler

at the top add global variables;
var bb2js__oldmouse? = 0;
var bb2js__oldmousey = 0;

at the beginning of the main task add something like

bb2js__oldmouse? = bb2js__mouse? ;
bb2js__oldmousey = bb2js__mousey;

bb2js__mouse? =ccbGetMousePosX();
bb2js__mousey =ccbGetMousePosY();

if(bb2js__mouse_down==1)
{
bb2js__mouseXspeed=bb2js__mouse?-bb2js__oldmouse?;
bb2js__mouseYspeed=bb2js__mousey-bb2js__oldmousey;
}

That would require also these functions:

function mousePressedDown(button)
{
if(button==1){bb2js__mouse_down=1;}
}

function mouseLeftUp(button)
{
if(button==1){bb2js__mouse_down=0;}
}

And to make them CC callbacks in the first execution section, where now mouseinit() and keysinit() are called:

ccbRegisterMouseDownEvent("mousePressedDown");
ccbRegisterMouseUpEvent("mouseLeftUp");

You can proceed similarly with all the keys used. Once this works, remove my keys and mouse handlers.

csp-games Guest
Quote
2021-02-21 20:20:57

BTW, in behavior_CameraZoomByMouseWheel.js by Niko, you can see that not everything is in the docs:


behavior_CameraZoomByMouseWheel.prototype.onMouseEvent = function(mouseEvent, mouseWheelDelta)
{
  if (mouseEvent == 1)
  {
	// mouse wheel
	this.targetZoomValue += mouseWheelDelta * this.ZoomSpeed;
			 
	 if (this.targetZoomValue < this.MinZoom)
		this.targetZoomValue = this.MinZoom;
		
	 if (this.targetZoomValue > this.MaxZoom)
		this.targetZoomValue = this.MaxZoom;
  }
}

So there is "onMouseEvent" (undocumented AFAIS), but it can read only:
// mouseEvent: 0=mouse moved, 1=mouse wheel moved, 2=left mouse up,
// 3=left mouse down, 4=right mouse up, 5=right mouse down

Better keep the docs up to date, a tool fails if docs are failing.

hadoken Guest
Quote
2021-02-21 20:43:03

I tried to modify your script "behavior_SmoothTPPCam.js" kind of as you suggested:

https://www.dropbox.com/sh/12pahpoicpkk6gs/AAAJgLK-a0sAgWraY5ZNX2lxa?dl=0

but in CopperCube I get this error:

behavior_SmoothTPPCam:349:ReferenceError: document is not defined
script:0:(void 0) is not a function

Â¯\_(ãƒ„)_/Â¯

Guess, I still have a lot to learn ...

hadoken Guest
Quote
2021-02-21 21:00:24

Mouse buttons are mentioned in the docs, but mouse movement for player/camera rotation or mouse cursor repositioning seems to be missing (or did I overlook something?)

"...

ccbRegisterMouseDownEvent(funcstr)

Note: This function is not available in the editor, and only in the Windows and Mac OS X app target. For getting mouse events, use the behavior functions onMouseEvent().

Registers a function for receiving a key down event. The function registered must take one parameter which will be the mouse button pressed (1 for left button, 2 for right button, 3 for middle button).
Examples:

ccbRegisterMouseDownEvent("mousePressedDown");

function mousePressedDown(button)
{
print("A mouse button was presssed down:" + button);
}

Prints which mouse button was pressed when it is pressed

..."

csp-games Guest
Quote
2021-02-21 21:34:50

BTW2, better use onKeyEvent and onMouseEvent...

csp-games Guest
Quote
2021-02-21 21:51:42

I got it working in windows, but there is an error message

"could not load shader function D3DXCompileShader from dll, shaders sisabled d3dx9_43.dll"

I guess that's just my system, CC also wabts to install DX sdk runtimes on each start, so...

csp-games Guest
Quote
2021-02-21 21:59:46

also, when I choose to add the directX redist in the settings, it tries to install it, takes like a minute, but then the same error. I guess that version is rejected by the system. I'll try OpenGL...

csp-games Guest
Quote
2021-02-21 22:11:11

Ok, that's about as far as I get: compiled it for OpenGL windows still wants to install directX runtime, despite unchecked and targeting OpenGL anyway ... twilight zone ahead. It then runs without error message, but also without dynamic shadows.

I also see the camera rotation lag / smoothing is way too rigid at this higher framerate, there must be a bug with delta timing... for now I just suggest to increase RotSmoothAmount to get that cinematic following motion.

I'll upload this to itch.io in a few minutes...

csp-games Guest
Quote
2021-02-21 23:11:57

ok, if anybody has already downloaded it, I've uploaded 2 new versions, the itch.io friendly webGL only, and the windows mac browser one (that requires lmb to mouselook). They feature less clipping artefacts (still a problem, when cam close and parallel to wall) and also one nasty camera jump was successfully removed.
However, I hope I will find the time to make a 4-linepick test, to get the camera to a clipping-save position.
https://jfkeo1010etc.itch.io/min...

hadoken Guest
Quote
2021-02-22 01:01:16

Great news for everyone!!!

Mainly by the precious work of Dieter(csp-games) the invention of a better 3rd person player & camera controller for CopperCube reached an important milestone for webgl and desktop builds. Although still missing some minor features, at its current core state it is ready for first use and seems better than anything before. If you are interested you can have a look at this demo:

https://www.dropbox.com/sh/ydran691y0gdypw/AABurILZrj7bARUEBSyl87qZa?dl=0

@Dieter
for the demo I made some smaller modifications:
- adapted keys to WASD
- hid the mouse cursor with Execute JavaScript "ccbSetCursorVisible(false);" at the "Before first drawing do something" behavior
- added Zoom camera by mouse wheel (from CopperCube's official extensions) to the camera

some future improvements could include:
- vertical mouse look for a defined degree range
- adjustable player run acceleration with Shift key
- at the moment diagonal movements seem to a bit faster than strict forward/backward/sideward ones
(-> Maybe caused by xz vector addition? Would something like vector normalization help when calculating diagonal directions?)

Many thanks to you Dieter for your creative ideas, well documented coding style and the sense of humor you share with us in some of your comments being a pleasure to read (?x) and most of all thank you for sharing your brilliant coding skills with us here in the CC forum!!! Fun fact: common folk are in for CopperCube for less coding ;-)

hadoken Guest
Quote
2021-02-22 11:23:45

Update:

I've played around a bit more with the behavior_SmoothTPPCamWin.js script and found out that Dieter has taken good care of some settings:
!!! Now I got also vertical mouse look to work with it !!!

You can take a look at the demo:
https://www.dropbox.com/sh/0tsikx4lmiz7pkz/AADl7K2SoY6KBrsIpv5gdtnSa?dl=0

Unfortunately I also faced another minor problem: the player can't be horizontal turned around unlimited. Horizontal mouse rotation seems to be somewhat restricted after turning the player more than one round somewhat after 360 degrees. Nevertheless in comparism what already is working great here, that isn't a big deal at the moment.

When targeting WebGL we can have working realtime shadows and dynamic materials. As I said I use CopperCube with wine on Linux, so I prefer OpenGL being better handled on my system over Directx. Therefore I mainly do without realtime shadows within my CC Desktop builds. I can live with that by trying some workarounds like shadow texture baking and simple parented player/npc shadows as you can find in the above demo scene.

[

2 3 4 5 ] Page 1 of 5

Create reply:

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