touch, keyboard and mouse control components

beta.r3js.org
-=yb4f310 2017-09-27 14:38:58 +02:00
parent c572393a54
commit e6f61fac58
13 changed files with 468 additions and 112 deletions

View File

@ -145,13 +145,15 @@ GameLib.Component.COMPONENT_SHAPE_HEIGHT_MAP = 0x2e;
GameLib.Component.COMPONENT_SHAPE_PLANE = 0x2f;
GameLib.Component.COMPONENT_CONTROLS = 0x30;
GameLib.Component.COMPONENT_CONTROLS_EDITOR = 0x31;
GameLib.Component.COMPONENT_CONTROLS_FLY = 0x32;
GameLib.Component.COMPONENT_CONTROLS_TOUCH = 0x32;
GameLib.Component.COMPONENT_FRICTION_MATERIAL = 0x33;
GameLib.Component.COMPONENT_FRICTION_CONTACT_MATERIAL = 0x34;
GameLib.Component.COMPONENT_RAYCAST_VEHICLE = 0x35;
GameLib.Component.COMPONENT_RAYCAST_WHEEL = 0x36;
GameLib.Component.COMPONENT_CLOCK = 0x37;
GameLib.Component.COMPONENT_ANIMATION = 0x38;
GameLib.Component.COMPONENT_CONTROLS_KEYBOARD = 0x39;
GameLib.Component.COMPONENT_CONTROLS_MOUSE = 0x3a;
/**
* Returns string name for component number
@ -210,13 +212,15 @@ GameLib.Component.GetComponentName = function(number) {
case 0x2f : return 'GameLib.D3.Shape.Plane';
case 0x30 : return 'GameLib.D3.Controls';
case 0x31 : return 'GameLib.D3.Controls.Editor';
case 0x32 : return 'GameLib.D3.Controls.Fly';
case 0x32 : return 'GameLib.D3.Controls.Touch';
case 0x33 : return 'GameLib.D3.FrictionMaterial';
case 0x34 : return 'GameLib.D3.FrictionContactMaterial';
case 0x35 : return 'GameLib.D3.RaycastVehicle';
case 0x36 : return 'GameLib.D3.RaycastWheel';
case 0x37 : return 'GameLib.Clock';
case 0x38 : return 'GameLib.D3.Animation';
case 0x39 : return 'GameLib.D3.Controls.Keyboard';
case 0x3a : return 'GameLib.D3.Controls.Mouse';
break;
}

View File

@ -13,11 +13,6 @@ GameLib.API.DomElement = function(
parentEntity
) {
if (GameLib.Utils.UndefinedOrNull(parentEntity)) {
parentEntity = null;
}
this.parentEntity = parentEntity;
if (GameLib.Utils.UndefinedOrNull(id)) {
id = GameLib.Utils.RandomId();
}
@ -32,6 +27,11 @@ GameLib.API.DomElement = function(
domElementId = '';
}
this.domElementId = domElementId;
if (GameLib.Utils.UndefinedOrNull(parentEntity)) {
parentEntity = null;
}
this.parentEntity = parentEntity;
};
GameLib.API.DomElement.prototype = Object.create(GameLib.Component.prototype);

View File

@ -1,8 +1,9 @@
/**
* Raw Controls API object - should always correspond with the Controls Schema
* Raw Controls API object
* @param id
* @param controlsType
* @param name
* @param domElement
* @param parentEntity
* @constructor
*/
@ -10,6 +11,7 @@ GameLib.D3.API.Controls = function(
id,
controlsType,
name,
domElement,
parentEntity
) {
if (GameLib.Utils.UndefinedOrNull(id)) {
@ -18,18 +20,56 @@ GameLib.D3.API.Controls = function(
this.id = id;
if (GameLib.Utils.UndefinedOrNull(controlsType)) {
controlsType = GameLib.D3.Controls.CONTROLS_TYPE_EDITOR;
if (this instanceof GameLib.D3.Controls.Editor) {
controlsType = GameLib.D3.Controls.CONTROLS_TYPE_EDITOR;
}
if (this instanceof GameLib.D3.Controls.Touch) {
controlsType = GameLib.D3.Controls.CONTROLS_TYPE_TOUCH;
}
if (this instanceof GameLib.D3.Controls.Keyboard) {
controlsType = GameLib.D3.Controls.CONTROLS_TYPE_KEYBOARD;
}
if (this instanceof GameLib.D3.Controls.Mouse) {
controlsType = GameLib.D3.Controls.CONTROLS_TYPE_MOUSE;
}
if (GameLib.Utils.UndefinedOrNull(controlsType)) {
throw new Error('Could not determine controls type from this');
}
}
this.controlsType = controlsType;
if (GameLib.Utils.UndefinedOrNull(name)) {
name = 'Controls (' + this.id + ')';
if (controlsType === GameLib.D3.Controls.CONTROLS_TYPE_EDITOR) {
name = 'Controls for Editing';
name = 'Editing Controls';
}
if (controlsType === GameLib.D3.Controls.CONTROLS_TYPE_TOUCH) {
name = 'Touch Controls';
}
if (controlsType === GameLib.D3.Controls.CONTROLS_TYPE_KEYBOARD) {
name = 'Keyboard Controls';
}
if (controlsType === GameLib.D3.Controls.CONTROLS_TYPE_MOUSE) {
name = 'Mouse Controls';
}
name += ' (' + this.id + ')';
}
this.name = name;
if (GameLib.Utils.UndefinedOrNull(domElement)) {
domElement = null;
}
this.domElement = domElement;
if (GameLib.Utils.UndefinedOrNull(parentEntity)) {
parentEntity = null;
}
@ -49,6 +89,7 @@ GameLib.D3.API.Controls.FromObject = function (objectControls){
objectControls.id,
objectControls.controlsType,
objectControls.name,
objectControls.domElement,
objectControls.parentEntity
);
};

View File

@ -144,6 +144,23 @@ GameLib.D3.Camera.prototype.createInstance = function() {
* Updates the instance with the current state
*/
GameLib.D3.Camera.prototype.updateInstance = function() {
if (
this.cameraType === GameLib.D3.Camera.CAMERA_TYPE_ORTHOGONAL &&
this.instance instanceof THREE.PerspectiveCamera
) {
this.instance = this.createInstance();
return;
}
if (
this.cameraType === GameLib.D3.Camera.CAMERA_TYPE_PERSPECTIVE &&
this.instance instanceof THREE.OrthographicCamera
) {
this.instance = this.createInstance();
return;
}
if (this.cameraType === GameLib.D3.Camera.CAMERA_TYPE_ORTHOGONAL) {
this.instance.left = this.minX;
this.instance.right = this.maxX;

View File

@ -24,27 +24,36 @@ GameLib.D3.Controls = function (
apiControls.id,
apiControls.controlsType,
apiControls.name,
apiControls.domElement,
apiControls.parentEntity
);
var componentType = GameLib.Component.COMPONENT_CONTROLS;
var linkedObjects = null;
var linkedObjects = {
domElement : GameLib.DomElement
};
if (this.controlsType === GameLib.D3.Controls.CONTROLS_TYPE_EDITOR) {
componentType = GameLib.Component.COMPONENT_CONTROLS_EDITOR;
linkedObjects = {
'raycaster' : GameLib.D3.Raycaster,
'renderer' : GameLib.D3.Renderer
}
linkedObjects.raycaster = GameLib.D3.Raycaster;
linkedObjects.renderer = GameLib.D3.Renderer;
}
if (this.controlsType === GameLib.D3.Controls.CONTROLS_TYPE_FLY) {
componentType = GameLib.Component.COMPONENT_CONTROLS_FLY
if (this.controlsType === GameLib.D3.Controls.CONTROLS_TYPE_TOUCH) {
componentType = GameLib.Component.COMPONENT_CONTROLS_TOUCH
}
if (this.controlsType === GameLib.D3.Controls.CONTROLS_TYPE_KEYBOARD) {
componentType = GameLib.Component.COMPONENT_CONTROLS_KEYBOARD
}
if (this.controlsType === GameLib.D3.Controls.CONTROLS_TYPE_MOUSE) {
componentType = GameLib.Component.COMPONENT_CONTROLS_MOUSE
}
GameLib.Component.call(
this,
componentType,
@ -59,8 +68,10 @@ GameLib.D3.Controls.prototype.constructor = GameLib.D3.Controls;
* Controls Type
* @type {number}
*/
GameLib.D3.Controls.CONTROLS_TYPE_EDITOR = 0x0;
GameLib.D3.Controls.CONTROLS_TYPE_FLY = 0x1;
GameLib.D3.Controls.CONTROLS_TYPE_EDITOR = 0x0;
GameLib.D3.Controls.CONTROLS_TYPE_TOUCH = 0x1;
GameLib.D3.Controls.CONTROLS_TYPE_KEYBOARD = 0x2;
GameLib.D3.Controls.CONTROLS_TYPE_MOUSE = 0x3;
/**
* Creates a mesh instance or updates it
@ -86,6 +97,7 @@ GameLib.D3.Controls.prototype.toApiObject = function() {
this.id,
this.controlsType,
this.name,
GameLib.Utils.IdOrNull(this.domElement),
GameLib.Utils.IdOrNull(this.parentEntity)
);

View File

@ -112,8 +112,8 @@ GameLib.D3.Controls.Editor.prototype.updateInstance = function() {
};
/**
* Converts a GameLib.D3.Mesh to a GameLib.D3.API.Mesh
* @returns {GameLib.D3.API.Mesh}
* Converts a GameLib.D3.Controls.Editor to a GameLib.D3.API.Mesh
* @returns {GameLib.D3.API.Controls}
*/
GameLib.D3.Controls.Editor.prototype.toApiObject = function() {
@ -134,14 +134,14 @@ GameLib.D3.Controls.Editor.prototype.toApiObject = function() {
*/
GameLib.D3.Controls.Editor.FromObject = function(graphics, objectControls) {
var apiMesh = GameLib.D3.API.Controls.FromObject(objectControls);
var apiControls = GameLib.D3.API.Controls.FromObject(objectControls);
apiMesh.renderer = objectControls.renderer;
apiMesh.raycaster = objectControls.raycaster;
apiControls.renderer = objectControls.renderer;
apiControls.raycaster = objectControls.raycaster;
return new GameLib.D3.Controls.Editor(
graphics,
apiMesh
apiControls
);
};

View File

@ -0,0 +1,75 @@
/**
* Keyboard Controls
* @param graphics GameLib.D3.Graphics
* @param apiControls GameLib.D3.API.Controls
* @constructor
*/
GameLib.D3.Controls.Keyboard = function (
graphics,
apiControls
) {
this.graphics = graphics;
this.graphics.isNotThreeThrow();
GameLib.D3.Controls.call(
this,
this.graphics,
apiControls
);
};
/**
* Inheritance
* @type {GameLib.D3.Controls}
*/
GameLib.D3.Controls.Keyboard.prototype = Object.create(GameLib.D3.Controls.prototype);
GameLib.D3.Controls.Keyboard.prototype.constructor = GameLib.D3.Controls.Keyboard;
/**
* Create Instance
* @returns
*/
GameLib.D3.Controls.Keyboard.prototype.createInstance = function() {
/**
* Return true to indicate no dependencies to other components
*/
return true;
};
/**
* Update Instance
*/
GameLib.D3.Controls.Keyboard.prototype.updateInstance = function() {
GameLib.D3.Controls.prototype.updateInstance.call(this);
};
/**
* Converts a GameLib.D3.Controls.Keyboard to a GameLib.D3.API.Controls
* @returns {GameLib.D3.API.Controls}
*/
GameLib.D3.Controls.Keyboard.prototype.toApiObject = function() {
var apiControls = GameLib.D3.Controls.prototype.toApiObject.call(this);
/**
* add other properties here as this component develops...
*/
return apiControls;
};
/**
* Construct an Keyboard Controls object from data
* @param graphics
* @param objectControls
* @returns {GameLib.D3.Controls.Keyboard}
* @constructor
*/
GameLib.D3.Controls.Keyboard.FromObject = function(graphics, objectControls) {
var apiControls = GameLib.D3.API.Controls.FromObject(objectControls);
return new GameLib.D3.Controls.Keyboard(
graphics,
apiControls
);
};

View File

@ -0,0 +1,75 @@
/**
* Mouse Controls
* @param graphics GameLib.D3.Graphics
* @param apiControls GameLib.D3.API.Controls
* @constructor
*/
GameLib.D3.Controls.Mouse = function (
graphics,
apiControls
) {
this.graphics = graphics;
this.graphics.isNotThreeThrow();
GameLib.D3.Controls.call(
this,
this.graphics,
apiControls
);
};
/**
* Inheritance
* @type {GameLib.D3.Controls}
*/
GameLib.D3.Controls.Mouse.prototype = Object.create(GameLib.D3.Controls.prototype);
GameLib.D3.Controls.Mouse.prototype.constructor = GameLib.D3.Controls.Mouse;
/**
* Create Instance
* @returns
*/
GameLib.D3.Controls.Mouse.prototype.createInstance = function() {
/**
* Return true to indicate no dependencies to other components
*/
return true;
};
/**
* Update Instance
*/
GameLib.D3.Controls.Mouse.prototype.updateInstance = function() {
GameLib.D3.Controls.prototype.updateInstance.call(this);
};
/**
* Converts a GameLib.D3.Controls.Mouse to a GameLib.D3.API.Controls
* @returns {GameLib.D3.API.Controls}
*/
GameLib.D3.Controls.Mouse.prototype.toApiObject = function() {
var apiControls = GameLib.D3.Controls.prototype.toApiObject.call(this);
/**
* add other properties here as this component develops...
*/
return apiControls;
};
/**
* Construct an Mouse Controls object from data
* @param graphics
* @param objectControls
* @returns {GameLib.D3.Controls.Mouse}
* @constructor
*/
GameLib.D3.Controls.Mouse.FromObject = function(graphics, objectControls) {
var apiControls = GameLib.D3.API.Controls.FromObject(objectControls);
return new GameLib.D3.Controls.Mouse(
graphics,
apiControls
);
};

View File

@ -0,0 +1,75 @@
/**
* Touch Controls
* @param graphics GameLib.D3.Graphics
* @param apiControls GameLib.D3.API.Controls
* @constructor
*/
GameLib.D3.Controls.Touch = function (
graphics,
apiControls
) {
this.graphics = graphics;
this.graphics.isNotThreeThrow();
GameLib.D3.Controls.call(
this,
this.graphics,
apiControls
);
};
/**
* Inheritance
* @type {GameLib.D3.Controls}
*/
GameLib.D3.Controls.Touch.prototype = Object.create(GameLib.D3.Controls.prototype);
GameLib.D3.Controls.Touch.prototype.constructor = GameLib.D3.Controls.Touch;
/**
* Create Instance
* @returns
*/
GameLib.D3.Controls.Touch.prototype.createInstance = function() {
/**
* Return true to indicate no dependencies to other components
*/
return true;
};
/**
* Update Instance
*/
GameLib.D3.Controls.Touch.prototype.updateInstance = function() {
GameLib.D3.Controls.prototype.updateInstance.call(this);
};
/**
* Converts a GameLib.D3.Controls.Touch to a GameLib.D3.API.Controls
* @returns {GameLib.D3.API.Controls}
*/
GameLib.D3.Controls.Touch.prototype.toApiObject = function() {
var apiControls = GameLib.D3.Controls.prototype.toApiObject.call(this);
/**
* add other properties here as this component develops...
*/
return apiControls;
};
/**
* Construct an Touch Controls object from data
* @param graphics
* @param objectControls
* @returns {GameLib.D3.Controls.Touch}
* @constructor
*/
GameLib.D3.Controls.Touch.FromObject = function(graphics, objectControls) {
var apiControls = GameLib.D3.API.Controls.FromObject(objectControls);
return new GameLib.D3.Controls.Touch(
graphics,
apiControls
);
};

View File

@ -5,7 +5,11 @@
*/
GameLib.DomElement = function (apiDomElement) {
if (apiDomElement instanceof GameLib.DomElement) {
if (GameLib.Utils.UndefinedOrNull(apiDomElement)) {
apiDomElement = {};
}
if (apiDomElement instanceof GameLib.DomElement) {
return apiDomElement;
}
@ -35,14 +39,14 @@ GameLib.DomElement.prototype.createInstance = function() {
};
/**
* Updates the instance vector, calls updateInstance on the parent object
* Updates instance domElement
*/
GameLib.DomElement.prototype.updateInstance = function() {
this.instance = document.getElementById(this.domElementId);
};
/**
* Converts runtime vector to API Vector
* Converts runtime DomElement to API DomElement
* @returns {GameLib.API.DomElement}
*/
GameLib.DomElement.prototype.toApiObject = function() {
@ -50,7 +54,7 @@ GameLib.DomElement.prototype.toApiObject = function() {
this.id,
this.name,
this.domElementId,
this.parentEntity
GameLib.Utils.IdOrNull(this.parentEntity)
);
};

View File

@ -737,7 +737,18 @@ GameLib.System.GUI.prototype.buildControl = function(folder, componentTemplate,
}
)
);
} else if (property === 'materialType') {
} else if (property === 'cameraType') {
controllers.push(
folder.add(
object,
property,
{
'perspective' : GameLib.D3.Camera.CAMERA_TYPE_PERSPECTIVE,
'orthographic' : GameLib.D3.Camera.CAMERA_TYPE_ORTHOGONAL
}
)
);
} else if (property === 'materialType') {
controllers.push(
folder.add(
object,
@ -1071,6 +1082,15 @@ GameLib.System.GUI.prototype.buildControl = function(folder, componentTemplate,
property === 'intensity'
) {
controllers.push(folder.add(object, property, 0, 10, 0.001));
} else if (
property === 'minX' ||
property === 'minY' ||
property === 'minZ' ||
property === 'maxX' ||
property === 'maxY' ||
property === 'maxZ'
) {
controllers.push(folder.add(object, property, -100, 100, 1));
} else if (
property === 'widthSegments' ||
property === 'radiusSegments' ||
@ -1087,10 +1107,13 @@ GameLib.System.GUI.prototype.buildControl = function(folder, componentTemplate,
} else if (
property === 'near' ||
property === 'distanceGrain' ||
property === 'bumpScale' ||
property === 'envMapIntensity'
) {
controllers.push(folder.add(object, property, -10, 100, 0.001));
} else if (
property === 'bumpScale'
) {
controllers.push(folder.add(object, property, 0, 20, 0.001));
} else if (
property === 'heightOffset' ||
property === 'rotationFactor'

View File

@ -11,10 +11,10 @@ GameLib.System.Input = function(
apiSystem
);
this.meshMoveMode = false;
this.meshMoveXMode = false;
this.meshMoveYMode = false;
this.meshMoveZMode = false;
// this.meshMoveMode = false;
// this.meshMoveXMode = false;
// this.meshMoveYMode = false;
// this.meshMoveZMode = false;
/**
* We need new function pointers with scope bound to this so we can remove the
@ -31,7 +31,11 @@ GameLib.System.Input = function(
this.controlLeft = false;
this.renderers = [];
this.renderers = [];
this.editorControls = [];
this.touchControls = [];
this.keyboardControls = [];
this.mouseControls = [];
};
@ -45,75 +49,97 @@ GameLib.System.Input.prototype.start = function() {
GameLib.System.prototype.start.call(this);
this.renderers = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Renderer);
this.editorControls = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Controls.Editor);
this.renderers.map(
function(renderer) {
this.touchControls = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Controls.Touch);
var editorControls = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Controls.Editor);
this.keyboardControls = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Controls.Keyboard);
renderer.controls = editorControls.reduce(
function(result, editorControls) {
if (editorControls.renderer === renderer) {
result = editorControls;
}
return result;
},
null
);
this.mouseControls = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Controls.Mouse);
renderer.mouseDown = this.onMouseDown(renderer, renderer.controls).bind(this);
renderer.domElement.instance.addEventListener(
'mousedown',
renderer.mouseDown,
false
);
/**
* If we have editor controls - start behaving like it...
*/
if (this.editorControls.length > 0) {
renderer.mouseMove = this.onMouseMove.bind(this);
renderer.domElement.instance.addEventListener(
'mousemove',
renderer.mouseMove,
false
);
this.renderers = GameLib.EntityManager.Instance.queryComponents(GameLib.D3.Renderer);
renderer.keyDown = this.onKeyDown.bind(this);
renderer.domElement.instance.addEventListener(
'keydown',
renderer.keyDown,
false
);
this.renderers.map(
renderer.keyUp = this.onKeyUp.bind(this);
renderer.domElement.instance.addEventListener(
'keyup',
renderer.keyUp,
false
);
function(renderer) {
if (renderer.controls) {
/**
* Create the delayed instance here - it affects the order of event listeners attached to DOM
*/
renderer.controls.instance = renderer.controls.delayedInstance();
} else {
console.warn('no third party controls for renderer : ' + renderer.name);
}
renderer.controls = this.editorControls.reduce(
function(result, editorControl) {
if (editorControl.renderer === renderer) {
result = editorControl;
}
return result;
},
null
);
renderer.mouseWheel = this.onMouseWheel(renderer.camera).bind(this);
renderer.domElement.instance.addEventListener(
'mousewheel',
renderer.mouseWheel,
false
);
renderer.mouseDown = this.onMouseDown(renderer, renderer.controls).bind(this);
renderer.domElement.instance.addEventListener(
'mousedown',
renderer.mouseDown,
false
);
renderer.mouseUp = this.onMouseUp(renderer.camera, renderer.controls).bind(this);
renderer.domElement.instance.addEventListener(
'mouseup',
renderer.mouseUp,
false
);
}.bind(this)
);
renderer.mouseMove = this.onMouseMove.bind(this);
renderer.domElement.instance.addEventListener(
'mousemove',
renderer.mouseMove,
false
);
renderer.keyDown = this.onKeyDown.bind(this);
renderer.domElement.instance.addEventListener(
'keydown',
renderer.keyDown,
false
);
renderer.keyUp = this.onKeyUp.bind(this);
renderer.domElement.instance.addEventListener(
'keyup',
renderer.keyUp,
false
);
if (renderer.controls) {
/**
* Create the delayed instance here - it affects the order of event listeners attached to DOM
*/
renderer.controls.instance = renderer.controls.delayedInstance();
} else {
console.warn('no third party controls for renderer : ' + renderer.name);
}
renderer.mouseWheel = this.onMouseWheel(renderer.camera).bind(this);
renderer.domElement.instance.addEventListener(
'mousewheel',
renderer.mouseWheel,
false
);
renderer.mouseUp = this.onMouseUp(renderer.camera, renderer.controls).bind(this);
renderer.domElement.instance.addEventListener(
'mouseup',
renderer.mouseUp,
false
);
}.bind(this)
);
}
if (this.touchControls.length > 0) {
}
if (this.keyboardControls.length > 0) {
}
};
@ -382,6 +408,7 @@ GameLib.System.Input.prototype.stop = function() {
* Now remove all input capabilities
*/
this.renderers.map(
function(renderer) {
renderer.domElement.instance.removeEventListener(

View File

@ -394,22 +394,25 @@ GameLib.System.Storage.prototype.loadComponent = function(apiUrl, toProcess, inc
parentEntity = runtimeComponent;
} else {
try {
runtimeComponent = fn(__system.coder, component);
} catch (error) {
try {
runtimeComponent = fn(__system.graphics, component);
} catch (error) {
try {
runtimeComponent = fn(__system.physics, component);
} catch (error) {
/**
* ok - we don't cannot create this component
*/
}
}
}
try {
runtimeComponent = fn(component);
} catch (error) {
try {
runtimeComponent = fn(__system.coder, component);
} catch (error) {
try {
runtimeComponent = fn(__system.graphics, component);
} catch (error) {
try {
runtimeComponent = fn(__system.physics, component);
} catch (error) {
/**
* ok - we don't cannot create this component
*/
}
}
}
}
if (!runtimeComponent) {
if (clientErrorCallback) {
clientErrorCallback('Could not create a runtime component: ' + component.name);