1
0
mirror of https://github.com/troisjs/trois.git synced 2024-11-24 04:12:02 +08:00

remove extra code, formatting

This commit is contained in:
Sander Moolin 2021-03-26 09:15:14 -04:00
parent 2b917a52e6
commit 18b425ff50
2 changed files with 18 additions and 78 deletions

View File

@ -3,7 +3,6 @@ import { Raycaster, Vector2 } from 'three'
export default { export default {
name: 'Raycaster', name: 'Raycaster',
inject: ['three'], inject: ['three'],
// emits: ['created', 'ready'],
props: { props: {
onBeforeRender: { onBeforeRender: {
type: Function, type: Function,
@ -48,7 +47,7 @@ export default {
}, },
mounted() { mounted() {
// add update method // add update method
this.three.onBeforeRender(this.update) this.three.onBeforeRender(this.update);
// if we have a custom onBeforeRender method, assume // if we have a custom onBeforeRender method, assume
// the user is handling everything and exit setup // the user is handling everything and exit setup
@ -56,21 +55,21 @@ export default {
// prep non-reactive list of intersections // prep non-reactive list of intersections
this._intersects = [] this._intersects = [];
// save camera if we don't already have one // save camera if we don't already have one
if (!this.camera) { if (!this.camera) {
let parent = this.$parent let parent = this.$parent;
while (parent && !this.raycasterCamera) { while (parent && !this.raycasterCamera) {
this.raycasterCamera = parent.camera this.raycasterCamera = parent.camera;
parent = parent.$parent parent = parent.$parent;
} }
} }
// add event listeners // add event listeners
window.addEventListener('mousemove', this.onMouseMove) window.addEventListener('mousemove', this.onMouseMove);
window.addEventListener('touchstart', this.onTouchMove) window.addEventListener('touchmove', this.onTouchMove);
window.addEventListener('touchmove', this.onTouchMove) // TODO: touch
}, },
methods: { methods: {
update() { update() {
@ -120,38 +119,32 @@ export default {
// TODO: optimize // TODO: optimize
const newIntersects = intersects.filter(intersect => !old.find(val => val.object === intersect.object && val.instanceId === intersect.instanceId)); const newIntersects = intersects.filter(intersect => !old.find(val => val.object === intersect.object && val.instanceId === intersect.instanceId));
if (newIntersects.length) { if (newIntersects.length) {
this.onPointerEnter(newIntersects) this.onPointerEnter(newIntersects);
} }
} }
// capture current intersects // capture current intersects
if (this.onPointerOver) { if (this.onPointerOver) {
this.onPointerOver(intersects) this.onPointerOver(intersects);
} }
// save internal intersect list // save internal intersect list
this._intersects = intersects; this._intersects = intersects;
}, },
onMouseMove(evt) { onMouseMove(evt) {
const { top: canvasTop, left: canvasLeft } = this.three.mouse_move_element.getBoundingClientRect() const { top: canvasTop, left: canvasLeft } = this.three.mouse_move_element.getBoundingClientRect();
this.pointer.x = ((evt.x - canvasLeft) / this.three.size.width) * 2 - 1; this.pointer.x = ((evt.x - canvasLeft) / this.three.size.width) * 2 - 1;
this.pointer.y = - ((evt.y - canvasTop) / this.three.size.height) * 2 + 1; this.pointer.y = - ((evt.y - canvasTop) / this.three.size.height) * 2 + 1;
}, },
onTouchMove(evt) {
console.log('TODO: handle touch')
// const touch = evt.touches[0]
// const { top: canvasTop, left: canvasLeft } = this.three.mouse_move_element.getBoundingClientRect()
// this.pointer.x = ((touch.x - canvasLeft) / this.three.size.width) * 2 - 1
// this.pointer.y = -((touch.y - canvasTop) / this.three.size.height) * 2 + 1
}
}, },
render() { render() {
return this.$slots.default ? this.$slots.default() : []; return this.$slots.default ? this.$slots.default() : [];
}, },
unmounted() { unmounted() {
window.removeEventListener('mousemove', this.onMouseMove) window.removeEventListener('mousemove', this.onMouseMove);
window.removeEventListener('touchstart', this.onTouchMove) window.removeEventListener('touchstart', this.onTouchMove);
window.removeEventListener('touchmove', this.onTouchMove)
// TODO: touch
}, },
__hmrId: 'Raycaster', __hmrId: 'Raycaster',
}; };

View File

@ -122,8 +122,7 @@ export default function useThree() {
} }
obj.mouse_move_element.addEventListener('mousemove', onMousemove); obj.mouse_move_element.addEventListener('mousemove', onMousemove);
obj.mouse_move_element.addEventListener('mouseleave', onMouseleave); obj.mouse_move_element.addEventListener('mouseleave', onMouseleave);
obj.mouse_move_element.addEventListener('touchstart', onTouchstart); // TODO: touch
obj.mouse_move_element.addEventListener('touchmove', onTouchmove)
} }
if (conf.click) { if (conf.click) {
@ -248,66 +247,14 @@ export default function useThree() {
*/ */
function onMousemove(e) { function onMousemove(e) {
updateMouse(e); updateMouse(e);
onMousechange(e);
} }
/** /**
* mouseleave listener * mouseleave listener
*/ */
function onMouseleave(e) { function onMouseleave(e) {
// mouse.x = 0; mouse.x = Infinity;
// mouse.y = 0; mouse.y = Infinity;
onMousechange(e);
}
/**
* mouse change
*/
function onMousechange(e) {
// if (conf.mouse_over || conf.mouse_raycast) {
// raycaster.setFromCamera(mouse, obj.camera);
// if (conf.mouse_raycast) {
// // get mouse 3d position
// obj.camera.getWorldDirection(mousePlane.normal);
// mousePlane.normal.normalize();
// raycaster.ray.intersectPlane(mousePlane, mouseV3);
// }
// if (conf.mouse_over) {
// const onObjects = raycaster.intersectObjects(intersectObjects);
// const offObjects = [...intersectObjects];
// for (let i = 0; i < onObjects.length; i++) {
// const o = onObjects[i].object;
// if (!o.hover && o.onHover) {
// o.hover = true;
// o.onHover(true);
// }
// offObjects.splice(offObjects.indexOf(o), 1);
// }
// for (let i = 0; i < offObjects.length; i++) {
// const o = offObjects[i];
// if (o.hover && o.onHover) {
// o.hover = false;
// o.onHover(false);
// }
// }
// }
// }
}
/**
* touch start
*/
function onTouchstart(evt) {
console.log('TODO: touchstart', evt)
}
/**
* touch move
*/
function onTouchmove(evt) {
console.log('TODO: touchmove', evt)
} }
/** /**