git.s-ol.nu leap-finger-scan / 11f852a
store/load s-ol 2 years ago
3 changed file(s) with 57 addition(s) and 18 deletion(s). Raw diff Collapse all Expand all
29492949 "integrity": "sha512-vNKxJHTEKNThjfrdJwHc7brvM6eVevuO5nTj6ez8ZQ1qbXTvGthucRF7S4vf2cr71QVnT70V34v0S1DyQsti0w==",
29502950 "dev": true
29512951 },
2952 "file-saver": {
2953 "version": "2.0.2",
2954 "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.2.tgz",
2955 "integrity": "sha512-Wz3c3XQ5xroCxd1G8b7yL0Ehkf0TC9oYC6buPFkNnU9EnaPlifeAFCyCh+iewXTyFRcg0a6j3J7FmJsIhlhBdw=="
2956 },
29522957 "fill-range": {
29532958 "version": "4.0.0",
29542959 "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
46214626 "gl-matrix": "2.2.1",
46224627 "underscore": "1.4.4",
46234628 "ws": "0.4.25"
4624 }
4625 },
4626 "leapjs-plugins": {
4627 "version": "0.1.12",
4628 "resolved": "https://registry.npmjs.org/leapjs-plugins/-/leapjs-plugins-0.1.12.tgz",
4629 "integrity": "sha1-EteObjgMGHd4ESxvJtoDgWqTnyk=",
4630 "requires": {
4631 "three": "^0.69.0"
4632 },
4633 "dependencies": {
4634 "three": {
4635 "version": "0.69.0",
4636 "resolved": "https://registry.npmjs.org/three/-/three-0.69.0.tgz",
4637 "integrity": "sha1-21VlOMtNejpmZcdS7Dnt/KMHIo8="
4638 }
46394629 }
46404630 },
46414631 "loader-runner": {
1414 ]
1515 },
1616 "dependencies": {
17 "file-saver": "^2.0.2",
1718 "leapjs": "^0.6.4",
1819 "three": "^0.110.0"
1920 },
00 import Leap from 'leapjs';
11 import * as T from 'three';
22 import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
3 import { saveAs } from 'file-saver';
34
45 const clamp = (val, min=0, max=1) => Math.min(max, Math.max(min, val));
56 const lerp = (a, b, t) => a.plus(b.minus(a).times(t));
1415 const scene = new T.Scene();
1516 scene.background = new T.Color().setHSL(0.7, .95, .93);
1617
18 const grid = new T.GridHelper(250, 10);
19 scene.add(grid);
20
1721 const hemiLight = new T.HemisphereLight(0xffffff, 0xffffff, 0.6);
1822 hemiLight.color.setHSL(0.6, 1, 0.6);
1923 hemiLight.groundColor.setHSL(0.095, 1, 0.75);
2731 scene.add(dirLight);
2832
2933 const camera = new T.PerspectiveCamera(75, 1, 0.1, 1000);
30 camera.position.set(80, 100, 200);
34 camera.position.set(-30, 400, 80);
3135 const controls = new OrbitControls(camera, canvas);
3236 // const context = canvas.getContext('webgl2', { alpha: false });
3337 const renderer = new T.WebGLRenderer({ canvas }); // , context });
7680 dip: finger.dipPosition,
7781 pip: finger.pipPosition,
7882 });
79 console.log(this.dataPoints.length);
8083 }
8184
8285 this.tip.position.set(...finger.tipPosition);
8487 this.lineGeometry.vertices[1].set(...finger.dipPosition);
8588 this.lineGeometry.vertices[2].set(...finger.pipPosition);
8689 this.lineGeometry.verticesNeedUpdate = true;
90 }
91
92 clear() {
93 this.dataPoints = [];
94 for (let i = 0; i < Finger.MAX_TRACK; i++) {
95 this.trackers.setMatrixAt(i, new T.Matrix4());
96 }
97
98 this.trackers.instanceMatrix.needsUpdate = true;
99 }
100
101 store() {
102 return this.dataPoints;
103 }
104
105 load(dataPoints) {
106 for (const dp of dataPoints) {
107 this.trackers.setMatrixAt(this.dataPoints.length % Finger.MAX_TRACK, new T.Matrix4().makeTranslation(...dp.tip));
108 this.dataPoints.push(dp);
109 }
110
111 this.trackers.instanceMatrix.needsUpdate = true;
87112 }
88113 }
89114
102127 window.F = fingers;
103128
104129 window.onkeydown = (e) => {
130 if (e.key === 'r') {
131 e.preventDefault();
132 fingers.forEach(finger => finger.clear());
133 return;
134 } else if (e.key === 's') {
135 e.preventDefault();
136 const data = fingers.map(finger => finger.store());
137 saveAs(new Blob([JSON.stringify(data)]), 'text/json');
138 } else if (e.key === 'l') {
139 e.preventDefault();
140 const input = document.createElement('input');
141 input.type = 'file';
142 input.click();
143
144 input.onchange = e => {
145 const reader = new FileReader();
146 reader.onload = e => {
147 const data = JSON.parse(e.target.result);
148 data.forEach((data, i) => fingers[i].load(data));
149 }
150 reader.readAsText(e.target.files[0]);
151 }
152 }
153
105154 const i = +e.key;
106155
107156 if (i > -1 && i < 6) {
111160 }
112161
113162 window.onkeyup = (e) => {
114 e.preventDefault();
115163 const i = +e.key;
116164
117165 if (i > -1 && i < 6) {