juni/junisaber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

press button on non-active hand to swap raycaster in menu mode (fixes #9)

Browse Source
This commit is contained in:
Kevin Ngo
2018-09-20 05:12:09 -07:00
parent 2130fed441
commit 12d9d0044a
8 changed files with 234 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
src/components/debug-controller.js
View File

@@ -3,38 +3,40 @@
* Position controller in front of camera.
*/
AFRAME.registerComponent('debug-controller', {
schema: {
enabled: { default: false },
},
init: function() {
init: function () {
var primaryHand;
var secondaryHand;
if (!this.data.enabled && !AFRAME.utils.getUrlParameter('debug')) {
return;
}
if (!AFRAME.utils.getUrlParameter('debug')) { return; }
console.log('%c debug-controller enabled ', 'background: #111; color: red');
this.isCloning = false;
this.isDeleting = false;
this.isTriggerDown = false;
primaryHand = document.getElementById('leftGloveContainer');
secondaryHand = document.getElementById('rightGloveContainer');
primaryHand = document.getElementById('rightHand');
secondaryHand = document.getElementById('leftHand');
primaryHand.setAttribute('position', { x: 0.2, y: 1.5, z: -0.5 });
secondaryHand.setAttribute('position', { x: -0.2, y: 1.5, z: -0.5 });
primaryHand.setAttribute('rotation', { x: 0, y: 0, z: 0 });
secondaryHand.setAttribute('rotation', { x: 0, y: 0, z: 0 });
if (AFRAME.utils.getUrlParameter('debug') === 'oculus') {
primaryHand.emit('controllerconnected', {name: 'oculus-touch-controls'});
secondaryHand.emit('controllerconnected', {name: 'oculus-touch-controls'});
primaryHand.setAttribute('controller', 'controllerType', 'oculus-touch-controls');
secondaryHand.setAttribute('controller', 'controllerType', 'oculus-touch-controls');
} else {
primaryHand.emit('controllerconnected', {name: 'vive-controls'});
secondaryHand.emit('controllerconnected', {name: 'vive-controls'});
primaryHand.setAttribute('controller', 'controllerType', 'vive-controls');
secondaryHand.setAttribute('controller', 'controllerType', 'vive-controls');
}
document.addEventListener('keydown', evt => {
var primaryPosition;
var primaryRotation;
var secondaryPosition;
var secondaryRotation;
if (!evt.shiftKey) {
return;
}
if (!evt.shiftKey) { return; }
// <space> for trigger.
if (evt.keyCode === 32) {
@@ -48,6 +50,18 @@ AFRAME.registerComponent('debug-controller', {
return;
}
// <q> for secondary trigger.
if (evt.keyCode === 81) {
if (this.isSecondaryTriggerDown) {
secondaryHand.emit('triggerup');
this.isSecondaryTriggerDown = false;
} else {
secondaryHand.emit('triggerdown');
this.isSecondaryTriggerDown = true;
}
return;
}
// <n> secondary grip.
if (evt.keyCode === 78) {
if (this.secondaryGripDown) {
@@ -70,48 +84,63 @@ AFRAME.registerComponent('debug-controller', {
}
}
// Menu button <1>.
if (evt.keyCode === 49) {
secondaryHand.emit('menudown');
}
// Position bindings.
if (!evt.ctrlKey) {
primaryPosition = primaryHand.object3D.position;
if (evt.keyCode === 72) {
primaryPosition.x -= 0.01;
} // h.
if (evt.keyCode === 74) {
primaryPosition.y -= 0.01;
} // j.
if (evt.keyCode === 75) {
primaryPosition.y += 0.01;
} // k.
if (evt.keyCode === 76) {
primaryPosition.x += 0.01;
} // l.
if (evt.keyCode === 59 || evt.keyCode === 186) {
primaryPosition.z -= 0.01;
} // ;.
if (evt.keyCode === 222) {
primaryPosition.z += 0.01;
} // ;.
if (evt.ctrlKey) {
secondaryPosition = secondaryHand.getAttribute('position');
if (evt.keyCode === 72) { secondaryPosition.x -= 0.01 } // h.
if (evt.keyCode === 74) { secondaryPosition.y -= 0.01 } // j.
if (evt.keyCode === 75) { secondaryPosition.y += 0.01 } // k.
if (evt.keyCode === 76) { secondaryPosition.x += 0.01 } // l.
if (evt.keyCode === 59 || evt.keyCode === 186) { secondaryPosition.z -= 0.01 } // ;.
if (evt.keyCode === 222) { secondaryPosition.z += 0.01 } // ;.
secondaryHand.setAttribute('position', AFRAME.utils.clone(secondaryPosition));
} else {
secondaryPosition = secondaryHand.object3D.position;
if (evt.keyCode === 72) {
secondaryPosition.x -= 0.01;
} // h.
if (evt.keyCode === 74) {
secondaryPosition.y -= 0.01;
} // j.
if (evt.keyCode === 75) {
secondaryPosition.y += 0.01;
} // k.
if (evt.keyCode === 76) {
secondaryPosition.x += 0.01;
} // l.
if (evt.keyCode === 59 || evt.keyCode === 186) {
secondaryPosition.z -= 0.01;
} // ;.
if (evt.keyCode === 222) {
secondaryPosition.z += 0.01;
} // ;.
primaryPosition = primaryHand.getAttribute('position');
if (evt.keyCode === 72) { primaryPosition.x -= 0.01 } // h.
if (evt.keyCode === 74) { primaryPosition.y -= 0.01 } // j.
if (evt.keyCode === 75) { primaryPosition.y += 0.01 } // k.
if (evt.keyCode === 76) { primaryPosition.x += 0.01 } // l.
if (evt.keyCode === 59 || evt.keyCode === 186) { primaryPosition.z -= 0.01 } // ;.
if (evt.keyCode === 222) { primaryPosition.z += 0.01 } // ;.
primaryHand.setAttribute('position', AFRAME.utils.clone(primaryPosition));
}
// Rotation bindings.
if (evt.ctrlKey) {
secondaryRotation = secondaryHand.getAttribute('rotation');
if (evt.keyCode === 89) { secondaryRotation.x -= 10 } // y.
if (evt.keyCode === 79) { secondaryRotation.x += 10 } // o.
if (evt.keyCode === 85) { secondaryRotation.y -= 10 } // u.
if (evt.keyCode === 73) { secondaryRotation.y += 10 } // i.
secondaryHand.setAttribute('rotation', AFRAME.utils.clone(secondaryRotation));
} else {
primaryRotation = primaryHand.getAttribute('rotation');
if (evt.keyCode === 89) { primaryRotation.x -= 10 } // y.
if (evt.keyCode === 79) { primaryRotation.x += 10 } // o.
if (evt.keyCode === 85) { primaryRotation.y -= 10 } // u.
if (evt.keyCode === 73) { primaryRotation.y += 10 } // i.
primaryHand.setAttribute('rotation', AFRAME.utils.clone(primaryRotation));
}
});
},
play: function () {
var primaryHand;
var secondaryHand;
if (!AFRAME.utils.getUrlParameter('debug')) { return; }
primaryHand = document.getElementById('rightHand');
secondaryHand = document.getElementById('leftHand');
secondaryHand.object3D.position.set(-0.2, 1.5, -0.5);
primaryHand.object3D.position.set(0.2, 1.5, -0.5);
secondaryHand.setAttribute('rotation', {x: 35, y: 0, z: 0});
primaryHand.setAttribute('rotation', {x: 35, y: 0, z: 0});
}
});

32
src/components/hand-swapper.js Normal file
View File

@@ -0,0 +1,32 @@
const events = [
'triggerdown',
'gripdown',
'abuttondown',
'bbuttondown',
'xbuttondown',
'ybuttondown',
'trackpaddown'
];
/**
* Swap left or right-handed mode.
*/
AFRAME.registerComponent('hand-swapper', {
schema: {
enabled: {default: false}
},
init: function () {
this.swapHand = this.swapHand.bind(this);
events.forEach(event => {
this.el.addEventListener(event, this.swapHand);
});
},
swapHand: function () {
if (!this.data.enabled) { return; }
// Handled via state.
this.el.sceneEl.emit('activehandswap', null, false);
}
});

29
src/components/pauser.js Normal file
View File

@@ -0,0 +1,29 @@
const events = [
'menudown',
'abuttondown',
'bbuttondown',
'xbuttondown',
'ybuttondown'
];
/**
* Tell app to pause game if playing.
*/
AFRAME.registerComponent('pauser', {
schema: {
enabled: {default: true}
},
init: function () {
this.pauseGame = this.pauseGame.bind(this);
events.forEach(event => {
this.el.addEventListener(event, this.pauseGame);
});
},
pauseGame: function () {
if (!this.data.enabled) { return; }
this.el.sceneEl.emit('pausegame', null, false);
}
});

52
src/components/saber-controls.js
View File

@@ -1,6 +1,7 @@
AFRAME.registerComponent('saber-controls', {
schema: {
hand: {default: 'left', oneOf: ['left', 'right']},
activeHand: {default: 'right'},
hand: {default: 'right', oneOf: ['left', 'right']},
bladeEnabled: {default: true}
},
@@ -13,11 +14,26 @@ AFRAME.registerComponent('saber-controls', {
var el = this.el;
var data = this.data;
el.addEventListener('controllerconnected', this.initSaber.bind(this));
el.setAttribute('oculus-touch-controls', {hand: data.hand, model: false});
el.setAttribute('vive-controls', {hand: data.hand, model: true});
el.setAttribute('windows-motion-controls', {hand: data.hand, model: false});
const hand = {hand: data.hand, model: false};
el.setAttribute('oculus-touch-controls', hand);
el.setAttribute('vive-controls', hand);
el.setAttribute('windows-motion-controls', hand);
},
update: function () {
if (!this.bladeEl) { return; }
this.bladeEl.object3D.visible = this.data.bladeEnabled;
if (this.data.bladeEnabled) {
this.bladeEl.emit('drawblade');
}
},
tick: function () {
if (!this.bladeEl || !this.bladeEl.getObject3D('mesh')) { return; }
this.boundingBox.setFromObject(this.bladeEl.getObject3D('mesh'));
},
initSaber: function (evt) {
var el = this.el;
var saberHandleEl = document.createElement('a-entity');
@@ -33,12 +49,12 @@ AFRAME.registerComponent('saber-controls', {
bladeEl.setAttribute('material', {shader: 'flat', color: this.colors[this.data.hand]});
bladeEl.setAttribute('geometry', {primitive: 'box', height: 0.9, depth: 0.020, width: 0.020});
bladeEl.setAttribute('position', '0 -0.55 0');
bladeEl.setAttribute('play-sound', {event: 'draw', sound: "#saberDraw"});
bladeEl.setAttribute('play-sound', {event: 'drawblade', sound: "#saberDraw"});
bladeEl.object3D.visible = this.data.bladeEnabled;
// For blade saber draw animation
// For blade saber draw animation.
bladeElPivot.appendChild(bladeEl);
bladeElPivot.setAttribute('animation', 'property: scale; from: 0 0 0; to: 1.0 1.0 1.0; dur: 2000; easing: easeOutCubic; startEvents: draw');
bladeElPivot.setAttribute('animation', 'property: scale; from: 0 0 0; to: 1.0 1.0 1.0; dur: 2000; easing: easeOutCubic; startEvents: drawblade');
saberHandleEl.setAttribute('material', {shader: 'flat', color: '#151515'});
saberHandleEl.setAttribute('geometry', {primitive: 'box', height: 0.2, depth: 0.025, width: 0.025});
@@ -62,23 +78,8 @@ AFRAME.registerComponent('saber-controls', {
this.controllerConnected = true;
this.controllerType = evt.detail.name;
if (this.data.hand === 'left') { return; }
el.setAttribute('cursor', controllerConfig.cursor || {});
el.setAttribute('raycaster', 'objects: [raycastable]; far: 20; enabled: true');
el.setAttribute('line', {opacity: 0.75, color: 'pink', end: {x: 0, y: 0, z: -20}});
},
update: function () {
if (!this.bladeEl) { return; }
this.bladeEl.object3D.visible = this.data.bladeEnabled;
if (this.data.bladeEnabled) {
this.bladeEl.emit('draw');
}
},
tick: function () {
if (!this.bladeEl) { return; }
this.boundingBox.setFromObject(this.bladeEl.getObject3D('mesh'));
el.querySelector('.raycaster').setAttribute('cursor', controllerConfig.cursor || {});
},
config: {
@@ -117,5 +118,4 @@ AFRAME.registerComponent('saber-controls', {
},
}
}
});
});