@zappar/zappar-cv 3.0.0-beta.7 → 3.0.1-alpha.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/lib/additional.d.ts +5 -1
- package/lib/camera-source.js +8 -4
- package/lib/ceres-worker.d.ts +1 -0
- package/lib/ceres-worker.js +67 -0
- package/lib/data-download.d.ts +8 -0
- package/lib/data-download.js +8 -0
- package/lib/deserializer.d.ts +1 -0
- package/lib/deserializer.js +7 -0
- package/lib/direct.js +3 -1
- package/lib/drawgrid.d.ts +2 -0
- package/lib/drawgrid.js +136 -0
- package/lib/drawpoints.d.ts +11 -0
- package/lib/drawpoints.js +180 -0
- package/lib/gen/zappar-bridge.d.ts +20 -0
- package/lib/gen/zappar-bridge.js +1 -0
- package/lib/gen/zappar-client.d.ts +1 -0
- package/lib/gen/zappar-client.js +208 -13
- package/lib/gen/zappar-cwrap.js +144 -3
- package/lib/gen/zappar-native.d.ts +24 -1
- package/lib/gen/zappar-native.js +6 -0
- package/lib/gen/zappar-server.d.ts +3 -0
- package/lib/gen/zappar-server.js +108 -10
- package/lib/gen/zappar.d.ts +24 -0
- package/lib/gen/zappar.js +1 -0
- package/lib/html-element-source.d.ts +3 -1
- package/lib/html-element-source.js +12 -6
- package/lib/image-process-gl.d.ts +3 -2
- package/lib/image-process-gl.js +9 -7
- package/lib/imagebitmap-camera-source.d.ts +3 -1
- package/lib/imagebitmap-camera-source.js +10 -4
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/mstp-camera-source.d.ts +11 -1
- package/lib/mstp-camera-source.js +84 -6
- package/lib/native.js +56 -2
- package/lib/pipeline.d.ts +3 -1
- package/lib/pipeline.js +12 -2
- package/lib/profile.d.ts +2 -2
- package/lib/profile.js +3 -3
- package/lib/serializer.d.ts +1 -0
- package/lib/serializer.js +1 -0
- package/lib/version.d.ts +1 -1
- package/lib/version.js +1 -1
- package/lib/worker-client.d.ts +1 -0
- package/lib/worker-client.js +23 -1
- package/lib/worker-imagebitmap.js +5 -4
- package/lib/worker-messages.d.ts +10 -0
- package/lib/worker-messages.js +10 -0
- package/lib/worker-server.d.ts +1 -1
- package/lib/worker-server.js +83 -15
- package/lib/worker.js +2 -1
- package/lib/workerinterface.d.ts +8 -1
- package/lib/zappar-cv.js +215 -134
- package/lib/zappar-cv.wasm +0 -0
- package/package.json +4 -3
- package/umd/169.zappar-cv.js +1 -1
- package/umd/25.zappar-cv.js +1 -0
- package/umd/751.zappar-cv.js +1 -0
- package/umd/867.zappar-cv.js +1 -0
- package/umd/ca409d4e8cebe454b816.wasm +0 -0
- package/umd/zappar-cv.js +1 -1
- package/umd/zappar-cv.worker.js +1 -1
- package/umd/51b1854609f16d933fe2.wasm +0 -0
- package/umd/56.zappar-cv.js +0 -1
package/README.md
CHANGED
|
@@ -18,8 +18,8 @@ npm i @zappar/zappar-cv
|
|
|
18
18
|
|
|
19
19
|
You can use our CDN from within your HTML:
|
|
20
20
|
```
|
|
21
|
-
<script src="https://libs.zappar.com/zappar-cv/3.0.
|
|
21
|
+
<script src="https://libs.zappar.com/zappar-cv/3.0.1-alpha.10/zappar-cv.js"></script>
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
Or you can download and host our standalone JavaScript bundle:
|
|
25
|
-
[https://libs.zappar.com/zappar-cv/3.0.
|
|
25
|
+
[https://libs.zappar.com/zappar-cv/3.0.1-alpha.10/zappar-cv.zip](https://libs.zappar.com/zappar-cv/3.0.1-alpha.10/zappar-cv.zip)
|
package/lib/additional.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CameraFrameData } from "./camera-frame-data";
|
|
2
|
-
import { zappar_face_mesh_t, zappar_face_tracker_t, zappar_pipeline_t, zappar_image_tracker_t, zappar_sequence_source_t } from "./gen/zappar";
|
|
2
|
+
import { zappar_face_mesh_t, zappar_face_tracker_t, zappar_world_tracker_t, zappar_pipeline_t, zappar_image_tracker_t, zappar_sequence_source_t } from "./gen/zappar";
|
|
3
3
|
export declare type zappar_html_element_source_t = number & {
|
|
4
4
|
_: 'zappar_html_element_source_t';
|
|
5
5
|
};
|
|
@@ -11,7 +11,10 @@ export interface Additional {
|
|
|
11
11
|
pipeline_draw_face_project(pipeline: zappar_pipeline_t, drawwMatrix: Float32Array, vertices: Float32Array, uvMatrix: Float32Array, uvs: Float32Array, indices: Uint16Array, texture: WebGLTexture): void;
|
|
12
12
|
pipeline_camera_frame_data_raw_enabled_set(pipeline: zappar_pipeline_t, enabled: boolean): void;
|
|
13
13
|
pipeline_camera_frame_data_raw(pipeline: zappar_pipeline_t): Promise<CameraFrameData | undefined>;
|
|
14
|
+
pipeline_camera_frame_data_width(pipeline: zappar_pipeline_t): number;
|
|
15
|
+
pipeline_camera_frame_data_height(pipeline: zappar_pipeline_t): number;
|
|
14
16
|
draw_plane(gl: WebGLRenderingContext, projectionMatrix: Float32Array, cameraMatrix: Float32Array, targetMatrix: Float32Array, texture: string): void;
|
|
17
|
+
draw_grid(gl: WebGLRenderingContext, projectionMatrix: Float32Array, cameraMatrix: Float32Array, targetMatrix: Float32Array): void;
|
|
15
18
|
image_tracker_target_image(o: zappar_image_tracker_t, indx: number): HTMLImageElement | undefined;
|
|
16
19
|
face_mesh_load_default(o: zappar_face_mesh_t): Promise<void>;
|
|
17
20
|
face_mesh_load_default_face(o: zappar_face_mesh_t, fillMouth: boolean, fillEyeL: boolean, fillEyeR: boolean): Promise<void>;
|
|
@@ -27,4 +30,5 @@ export interface Additional {
|
|
|
27
30
|
browser_incompatible_ui: () => void;
|
|
28
31
|
sequence_source_time_set: (o: zappar_sequence_source_t, ms: number) => void;
|
|
29
32
|
cookies_permitted: (p: boolean) => void;
|
|
33
|
+
world_tracker_points_data_matrix(wt: zappar_world_tracker_t, screenWidth: number, screenHeight: number, mirror: boolean): Float32Array;
|
|
30
34
|
}
|
package/lib/camera-source.js
CHANGED
|
@@ -35,11 +35,15 @@ export class CameraSource extends HTMLElementSource {
|
|
|
35
35
|
if (!pipeline)
|
|
36
36
|
return;
|
|
37
37
|
let timeStamp = (ev.timeStamp !== undefined && ev.timeStamp !== null) ? ev.timeStamp : performance.now();
|
|
38
|
-
|
|
39
|
-
if (
|
|
40
|
-
|
|
38
|
+
const interval = ev.interval * profile.intervalMultiplier;
|
|
39
|
+
if (profile.trustSensorIntervals) {
|
|
40
|
+
if (this._lastTimestamp === -1)
|
|
41
|
+
this._lastTimestamp = timeStamp;
|
|
42
|
+
else {
|
|
43
|
+
this._lastTimestamp += interval;
|
|
44
|
+
timeStamp = this._lastTimestamp;
|
|
45
|
+
}
|
|
41
46
|
}
|
|
42
|
-
this._lastTimestamp = timeStamp;
|
|
43
47
|
if (ev.acceleration !== null &&
|
|
44
48
|
ev.acceleration.x !== null &&
|
|
45
49
|
ev.acceleration.y !== null &&
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function launchCeresWorker(wasmUrl: string, module: WebAssembly.Module, port: MessagePort): Promise<void>;
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
import { getWorkerMessageAPI } from "./worker-messages";
|
|
11
|
+
import * as ZNM from "./zappar-cv";
|
|
12
|
+
const ctx = self;
|
|
13
|
+
let launchHandler = (evt) => {
|
|
14
|
+
if (evt && evt.data && evt.data.t === "wasm") {
|
|
15
|
+
let url = location.href.startsWith("blob") ? evt.data.url : new URL("./zappar-cv.wasm", import.meta.url).toString();
|
|
16
|
+
launchCeresWorker(url, evt.data.module, evt.data.port);
|
|
17
|
+
ctx.removeEventListener("message", launchHandler);
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
ctx.addEventListener("message", launchHandler);
|
|
21
|
+
export function launchCeresWorker(wasmUrl, module, port) {
|
|
22
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
23
|
+
let mod = ZNM.default({
|
|
24
|
+
locateFile: (path, prefix) => {
|
|
25
|
+
if (path.endsWith("zappar-cv.wasm")) {
|
|
26
|
+
return wasmUrl;
|
|
27
|
+
}
|
|
28
|
+
return prefix + path;
|
|
29
|
+
},
|
|
30
|
+
instantiateWasm: (imports, successCallback) => {
|
|
31
|
+
const instance = new WebAssembly.Instance(module, imports);
|
|
32
|
+
successCallback(instance);
|
|
33
|
+
return instance.exports;
|
|
34
|
+
},
|
|
35
|
+
onRuntimeInitialized: () => {
|
|
36
|
+
const ceres_worker = mod.cwrap('ceres_worker', null, []);
|
|
37
|
+
const messageAPI = getWorkerMessageAPI(mod);
|
|
38
|
+
port.addEventListener('message', evt => {
|
|
39
|
+
if (evt.data.t !== 'msgsend')
|
|
40
|
+
return;
|
|
41
|
+
const data = evt.data.data;
|
|
42
|
+
const reference = evt.data.reference;
|
|
43
|
+
const ptr = mod._malloc(data.byteLength);
|
|
44
|
+
mod.HEAPU8.set(data, ptr);
|
|
45
|
+
messageAPI.worker_message_receive(reference, data.byteLength, ptr);
|
|
46
|
+
mod._free(ptr);
|
|
47
|
+
ceres_worker();
|
|
48
|
+
const toSend = messageAPI.worker_message_send_count();
|
|
49
|
+
for (let i = 0; i < toSend; i++) {
|
|
50
|
+
const reference = messageAPI.worker_message_send_reference(i);
|
|
51
|
+
const dataSize = messageAPI.worker_message_send_data_size(i);
|
|
52
|
+
const dataPtr = messageAPI.worker_message_send_data(i);
|
|
53
|
+
const data = mod.HEAPU8.slice(dataPtr, dataPtr + dataSize);
|
|
54
|
+
port.postMessage({
|
|
55
|
+
t: 'msgrec',
|
|
56
|
+
data,
|
|
57
|
+
reference
|
|
58
|
+
}, [data.buffer]);
|
|
59
|
+
}
|
|
60
|
+
messageAPI.worker_message_send_clear();
|
|
61
|
+
});
|
|
62
|
+
port.start();
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type * as ZNM from "./zappar-cv";
|
|
2
|
+
export interface DataDownloadAPI {
|
|
3
|
+
data_download_clear: () => void;
|
|
4
|
+
data_download_size: () => number;
|
|
5
|
+
data_download: () => number;
|
|
6
|
+
data_should_record_set: (v: number) => void;
|
|
7
|
+
}
|
|
8
|
+
export declare function getDataDownloadAPI(mod: ZNM.Module): DataDownloadAPI;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export function getDataDownloadAPI(mod) {
|
|
2
|
+
return {
|
|
3
|
+
data_download_clear: mod.cwrap("data_download_clear", null, []),
|
|
4
|
+
data_download_size: mod.cwrap("data_download_size", "number", []),
|
|
5
|
+
data_download: mod.cwrap("data_download", "number", []),
|
|
6
|
+
data_should_record_set: mod.cwrap("data_should_record_set", null, ["number"]),
|
|
7
|
+
};
|
|
8
|
+
}
|
package/lib/deserializer.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ interface Message {
|
|
|
8
8
|
type: () => number;
|
|
9
9
|
matrix4x4: () => Float32Array;
|
|
10
10
|
matrix3x3: () => Float32Array;
|
|
11
|
+
floatArray: () => Float32Array;
|
|
11
12
|
identityCoefficients: () => Float32Array;
|
|
12
13
|
expressionCoefficients: () => Float32Array;
|
|
13
14
|
cameraModel: () => Float32Array;
|
package/lib/deserializer.js
CHANGED
|
@@ -40,6 +40,13 @@ export class MessageDeserializer {
|
|
|
40
40
|
this._startOffset++;
|
|
41
41
|
return ret.buffer;
|
|
42
42
|
},
|
|
43
|
+
floatArray: () => {
|
|
44
|
+
let len = this._i32View[this._startOffset++];
|
|
45
|
+
let ret = new Float32Array(len);
|
|
46
|
+
ret.set(this._f32View.subarray(this._startOffset, this._startOffset + len));
|
|
47
|
+
this._startOffset += len;
|
|
48
|
+
return ret;
|
|
49
|
+
},
|
|
43
50
|
matrix4x4: () => {
|
|
44
51
|
let len = this._i32View[this._startOffset++];
|
|
45
52
|
let ret = new Float32Array(len);
|
package/lib/direct.js
CHANGED
|
@@ -13,6 +13,8 @@ import { messageManager as workerMessageManager } from "./worker-server";
|
|
|
13
13
|
export let messageManager = new MsgManager();
|
|
14
14
|
export function launchWorker(wasm) {
|
|
15
15
|
return __awaiter(this, void 0, void 0, function* () {
|
|
16
|
+
const response = yield fetch(new URL("./zappar-cv.wasm", import.meta.url).toString());
|
|
17
|
+
const module = yield WebAssembly.compileStreaming(response);
|
|
16
18
|
messageManager.onOutgoingMessage.bind(() => {
|
|
17
19
|
let msgs = messageManager.getOutgoingMessages();
|
|
18
20
|
for (let msg of msgs)
|
|
@@ -23,6 +25,6 @@ export function launchWorker(wasm) {
|
|
|
23
25
|
for (let msg of msgs)
|
|
24
26
|
messageManager.postIncomingMessage(msg.msg);
|
|
25
27
|
});
|
|
26
|
-
launchWorkerServer(wasm);
|
|
28
|
+
launchWorkerServer(wasm, module, 0);
|
|
27
29
|
});
|
|
28
30
|
}
|
package/lib/drawgrid.js
ADDED
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import { compileShader, linkProgram } from "./shader";
|
|
2
|
+
let shader;
|
|
3
|
+
let vbo;
|
|
4
|
+
let uvbo;
|
|
5
|
+
export function disposeDrawGrid() {
|
|
6
|
+
shader = undefined;
|
|
7
|
+
vbo = undefined;
|
|
8
|
+
uvbo = undefined;
|
|
9
|
+
}
|
|
10
|
+
function generate(gl) {
|
|
11
|
+
if (vbo)
|
|
12
|
+
return vbo;
|
|
13
|
+
vbo = gl.createBuffer();
|
|
14
|
+
if (!vbo)
|
|
15
|
+
throw new Error("Unable to create buffer object");
|
|
16
|
+
let coords = [
|
|
17
|
+
-0.5, 0, 0.5,
|
|
18
|
+
-0.5, 0, -0.5,
|
|
19
|
+
0.5, 0, 0.5,
|
|
20
|
+
0.5, 0, -0.5
|
|
21
|
+
];
|
|
22
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
|
|
23
|
+
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(coords), gl.STATIC_DRAW);
|
|
24
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, null);
|
|
25
|
+
return vbo;
|
|
26
|
+
}
|
|
27
|
+
function generateUVBO(gl) {
|
|
28
|
+
if (uvbo)
|
|
29
|
+
return uvbo;
|
|
30
|
+
uvbo = gl.createBuffer();
|
|
31
|
+
if (!uvbo)
|
|
32
|
+
throw new Error("Unable to create buffer object");
|
|
33
|
+
let coords = [
|
|
34
|
+
0, 1,
|
|
35
|
+
0, 0,
|
|
36
|
+
1, 1,
|
|
37
|
+
1, 0
|
|
38
|
+
];
|
|
39
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, uvbo);
|
|
40
|
+
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(coords), gl.STATIC_DRAW);
|
|
41
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, null);
|
|
42
|
+
return uvbo;
|
|
43
|
+
}
|
|
44
|
+
export function drawGrid(gl, projectionMatrix, cameraMatrix, targetMatrix) {
|
|
45
|
+
let shader = getShader(gl);
|
|
46
|
+
let v = generate(gl);
|
|
47
|
+
let uvbo = generateUVBO(gl);
|
|
48
|
+
gl.disable(gl.DEPTH_TEST);
|
|
49
|
+
gl.useProgram(shader.prog);
|
|
50
|
+
gl.uniformMatrix4fv(shader.unif_proj, false, projectionMatrix);
|
|
51
|
+
gl.uniformMatrix4fv(shader.unif_camera, false, cameraMatrix);
|
|
52
|
+
gl.uniformMatrix4fv(shader.unif_matrix, false, targetMatrix);
|
|
53
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, v);
|
|
54
|
+
gl.vertexAttribPointer(shader.attr_position, 3, gl.FLOAT, false, 3 * 4, 0);
|
|
55
|
+
gl.enableVertexAttribArray(shader.attr_position);
|
|
56
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, uvbo);
|
|
57
|
+
gl.vertexAttribPointer(shader.attr_textureCoord, 2, gl.FLOAT, false, 2 * 4, 0);
|
|
58
|
+
gl.enableVertexAttribArray(shader.attr_textureCoord);
|
|
59
|
+
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
|
|
60
|
+
gl.disableVertexAttribArray(shader.attr_position);
|
|
61
|
+
gl.disableVertexAttribArray(shader.attr_textureCoord);
|
|
62
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, null);
|
|
63
|
+
}
|
|
64
|
+
let vertexShaderSrc = `
|
|
65
|
+
#ifndef GL_ES
|
|
66
|
+
#define highp
|
|
67
|
+
#define mediump
|
|
68
|
+
#define lowp
|
|
69
|
+
#endif
|
|
70
|
+
|
|
71
|
+
uniform mat4 projMatrix;
|
|
72
|
+
uniform mat4 cameraMatrix;
|
|
73
|
+
uniform mat4 modelViewMatrix;
|
|
74
|
+
attribute vec4 position;
|
|
75
|
+
attribute vec2 textureCoord;
|
|
76
|
+
|
|
77
|
+
varying highp vec2 vTextureCoord;
|
|
78
|
+
|
|
79
|
+
void main()
|
|
80
|
+
{
|
|
81
|
+
gl_Position = projMatrix * cameraMatrix * modelViewMatrix * position;
|
|
82
|
+
vTextureCoord = textureCoord;
|
|
83
|
+
}`;
|
|
84
|
+
let fragmentShaderSrc = `
|
|
85
|
+
#define highp mediump
|
|
86
|
+
#ifdef GL_ES
|
|
87
|
+
// define default precision for float, vec, mat.
|
|
88
|
+
precision highp float;
|
|
89
|
+
#else
|
|
90
|
+
#define highp
|
|
91
|
+
#define mediump
|
|
92
|
+
#define lowp
|
|
93
|
+
#endif
|
|
94
|
+
|
|
95
|
+
varying highp vec2 vTextureCoord;
|
|
96
|
+
uniform sampler2D skinSampler;
|
|
97
|
+
|
|
98
|
+
void main()
|
|
99
|
+
{
|
|
100
|
+
vec2 pixels = 100.0 * vTextureCoord + 0.5;
|
|
101
|
+
if ((int(mod(pixels.x, 10.0)) == 0) || (int(mod(pixels.y, 10.0)) == 0)) {
|
|
102
|
+
gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0);
|
|
103
|
+
} else {
|
|
104
|
+
discard;
|
|
105
|
+
}
|
|
106
|
+
}`;
|
|
107
|
+
function getShader(gl) {
|
|
108
|
+
if (shader)
|
|
109
|
+
return shader;
|
|
110
|
+
let prog = gl.createProgram();
|
|
111
|
+
if (!prog)
|
|
112
|
+
throw new Error("Unable to create program");
|
|
113
|
+
let vertexShader = compileShader(gl, gl.VERTEX_SHADER, vertexShaderSrc);
|
|
114
|
+
let fragmentShader = compileShader(gl, gl.FRAGMENT_SHADER, fragmentShaderSrc);
|
|
115
|
+
gl.attachShader(prog, vertexShader);
|
|
116
|
+
gl.attachShader(prog, fragmentShader);
|
|
117
|
+
linkProgram(gl, prog);
|
|
118
|
+
let unif_proj = gl.getUniformLocation(prog, "projMatrix");
|
|
119
|
+
if (!unif_proj)
|
|
120
|
+
throw new Error("Unable to get uniform location projMatrix");
|
|
121
|
+
let unif_matrix = gl.getUniformLocation(prog, "modelViewMatrix");
|
|
122
|
+
if (!unif_matrix)
|
|
123
|
+
throw new Error("Unable to get uniform location modelViewMatrix");
|
|
124
|
+
let unif_camera = gl.getUniformLocation(prog, "cameraMatrix");
|
|
125
|
+
if (!unif_camera)
|
|
126
|
+
throw new Error("Unable to get uniform location cameraMatrix");
|
|
127
|
+
shader = {
|
|
128
|
+
prog,
|
|
129
|
+
unif_matrix,
|
|
130
|
+
unif_proj,
|
|
131
|
+
unif_camera,
|
|
132
|
+
attr_position: gl.getAttribLocation(prog, "position"),
|
|
133
|
+
attr_textureCoord: gl.getAttribLocation(prog, "textureCoord")
|
|
134
|
+
};
|
|
135
|
+
return shader;
|
|
136
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare class PointsDraw {
|
|
2
|
+
private _gl;
|
|
3
|
+
private _vbo;
|
|
4
|
+
private _shader;
|
|
5
|
+
constructor(_gl: WebGLRenderingContext);
|
|
6
|
+
dispose(): void;
|
|
7
|
+
private _generate;
|
|
8
|
+
drawPoints(screenWidth: number, screenHeight: number, dataWidth: number, dataHeight: number, points: Float32Array, mirror: boolean, color: [number, number, number], pointSize: number): void;
|
|
9
|
+
private _getCameraShader;
|
|
10
|
+
}
|
|
11
|
+
export declare function getPointsDataMatrix(frameWidth: number, frameHeight: number, screenWidth: number, screenHeight: number, mirror: boolean): Float32Array;
|
|
@@ -0,0 +1,180 @@
|
|
|
1
|
+
import { profile } from "./profile";
|
|
2
|
+
import { compileShader, linkProgram } from "./shader";
|
|
3
|
+
import { mat4 } from "gl-matrix";
|
|
4
|
+
let identity = mat4.create();
|
|
5
|
+
export class PointsDraw {
|
|
6
|
+
constructor(_gl) {
|
|
7
|
+
this._gl = _gl;
|
|
8
|
+
}
|
|
9
|
+
dispose() {
|
|
10
|
+
if (this._vbo)
|
|
11
|
+
this._gl.deleteBuffer(this._vbo);
|
|
12
|
+
this._vbo = undefined;
|
|
13
|
+
if (this._shader)
|
|
14
|
+
this._gl.deleteProgram(this._shader.prog);
|
|
15
|
+
this._shader = undefined;
|
|
16
|
+
}
|
|
17
|
+
_generate(gl, points) {
|
|
18
|
+
if (!this._vbo)
|
|
19
|
+
this._vbo = gl.createBuffer();
|
|
20
|
+
if (!this._vbo)
|
|
21
|
+
throw new Error("Unable to create buffer object");
|
|
22
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, this._vbo);
|
|
23
|
+
gl.bufferData(gl.ARRAY_BUFFER, points, gl.DYNAMIC_DRAW);
|
|
24
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, null);
|
|
25
|
+
return this._vbo;
|
|
26
|
+
}
|
|
27
|
+
drawPoints(screenWidth, screenHeight, dataWidth, dataHeight, points, mirror, color, pointSize) {
|
|
28
|
+
if (points.length === 0)
|
|
29
|
+
return; // points = new Float32Array([0, 1, 0, 1]);
|
|
30
|
+
let gl = this._gl;
|
|
31
|
+
const reenableDepthTest = gl.isEnabled(gl.DEPTH_TEST);
|
|
32
|
+
const reenableScissorTest = gl.isEnabled(gl.SCISSOR_TEST);
|
|
33
|
+
const reenableCullFace = gl.isEnabled(gl.CULL_FACE);
|
|
34
|
+
const reenableStencilTest = gl.isEnabled(gl.STENCIL_TEST);
|
|
35
|
+
const reenableBlend = gl.isEnabled(gl.BLEND);
|
|
36
|
+
const previousBoundTexture = gl.getParameter(gl.TEXTURE_BINDING_2D);
|
|
37
|
+
const previousBoundFramebuffer = gl.getParameter(gl.FRAMEBUFFER_BINDING);
|
|
38
|
+
const previousProgram = gl.getParameter(gl.CURRENT_PROGRAM);
|
|
39
|
+
const previousActiveTexture = gl.getParameter(gl.ACTIVE_TEXTURE);
|
|
40
|
+
gl.disable(gl.DEPTH_TEST);
|
|
41
|
+
gl.disable(gl.SCISSOR_TEST);
|
|
42
|
+
gl.disable(gl.CULL_FACE);
|
|
43
|
+
gl.disable(gl.STENCIL_TEST);
|
|
44
|
+
gl.disable(gl.BLEND);
|
|
45
|
+
let shader = this._getCameraShader(gl);
|
|
46
|
+
let vbo = this._generate(gl, points);
|
|
47
|
+
gl.activeTexture(gl.TEXTURE0);
|
|
48
|
+
gl.useProgram(shader.prog);
|
|
49
|
+
gl.uniform3f(shader.unif_color, color[0], color[1], color[2]);
|
|
50
|
+
gl.uniform1f(shader.unif_pointSize, pointSize);
|
|
51
|
+
gl.uniformMatrix4fv(shader.unif_skinTexTransform, false, getPointsDataMatrix(dataWidth, dataHeight, screenWidth, screenHeight, mirror));
|
|
52
|
+
gl.bindTexture(gl.TEXTURE_2D, null);
|
|
53
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
|
|
54
|
+
gl.vertexAttribPointer(shader.attr_position, 2, gl.FLOAT, false, 0, 0);
|
|
55
|
+
gl.enableVertexAttribArray(shader.attr_position);
|
|
56
|
+
gl.drawArrays(gl.POINTS, 0, points.length / 2);
|
|
57
|
+
gl.disableVertexAttribArray(shader.attr_position);
|
|
58
|
+
gl.bindFramebuffer(gl.FRAMEBUFFER, previousBoundFramebuffer);
|
|
59
|
+
gl.useProgram(previousProgram);
|
|
60
|
+
gl.bindTexture(gl.TEXTURE_2D, previousBoundTexture);
|
|
61
|
+
gl.activeTexture(previousActiveTexture);
|
|
62
|
+
if (reenableBlend)
|
|
63
|
+
gl.enable(gl.BLEND);
|
|
64
|
+
if (reenableCullFace)
|
|
65
|
+
gl.enable(gl.CULL_FACE);
|
|
66
|
+
if (reenableDepthTest)
|
|
67
|
+
gl.enable(gl.DEPTH_TEST);
|
|
68
|
+
if (reenableScissorTest)
|
|
69
|
+
gl.enable(gl.SCISSOR_TEST);
|
|
70
|
+
if (reenableStencilTest)
|
|
71
|
+
gl.enable(gl.STENCIL_TEST);
|
|
72
|
+
}
|
|
73
|
+
_getCameraShader(gl) {
|
|
74
|
+
if (this._shader)
|
|
75
|
+
return this._shader;
|
|
76
|
+
let prog = gl.createProgram();
|
|
77
|
+
if (!prog)
|
|
78
|
+
throw new Error("Unable to create program");
|
|
79
|
+
let vertexShader = compileShader(gl, gl.VERTEX_SHADER, vertexShaderSrc);
|
|
80
|
+
let fragmentShader = compileShader(gl, gl.FRAGMENT_SHADER, fragmentShaderSrc);
|
|
81
|
+
gl.attachShader(prog, vertexShader);
|
|
82
|
+
gl.attachShader(prog, fragmentShader);
|
|
83
|
+
linkProgram(gl, prog);
|
|
84
|
+
let unif_skinTexTransform = gl.getUniformLocation(prog, "skinTexTransform");
|
|
85
|
+
if (!unif_skinTexTransform)
|
|
86
|
+
throw new Error("Unable to get uniform location skinTexTransform");
|
|
87
|
+
let unif_color = gl.getUniformLocation(prog, "color");
|
|
88
|
+
if (!unif_color)
|
|
89
|
+
throw new Error("Unable to get uniform location color");
|
|
90
|
+
let unif_pointSize = gl.getUniformLocation(prog, "pointSize");
|
|
91
|
+
if (!unif_pointSize)
|
|
92
|
+
throw new Error("Unable to get uniform location pointSize");
|
|
93
|
+
this._shader = {
|
|
94
|
+
prog,
|
|
95
|
+
unif_skinTexTransform,
|
|
96
|
+
unif_color,
|
|
97
|
+
unif_pointSize,
|
|
98
|
+
attr_position: gl.getAttribLocation(prog, "position"),
|
|
99
|
+
};
|
|
100
|
+
return this._shader;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
let vertexShaderSrc = `
|
|
104
|
+
#ifndef GL_ES
|
|
105
|
+
#define highp
|
|
106
|
+
#define mediump
|
|
107
|
+
#define lowp
|
|
108
|
+
#endif
|
|
109
|
+
|
|
110
|
+
attribute vec2 position;
|
|
111
|
+
uniform mat4 skinTexTransform;
|
|
112
|
+
uniform float pointSize;
|
|
113
|
+
|
|
114
|
+
void main()
|
|
115
|
+
{
|
|
116
|
+
gl_Position = skinTexTransform * vec4(position, 0.0, 1.0);
|
|
117
|
+
// gl_Position = vec4(position.x * 0.0, position.y * 0.0, 0.0, 1.0);
|
|
118
|
+
gl_PointSize = pointSize;
|
|
119
|
+
}`;
|
|
120
|
+
let fragmentShaderSrc = `
|
|
121
|
+
#define highp mediump
|
|
122
|
+
#ifdef GL_ES
|
|
123
|
+
// define default precision for float, vec, mat.
|
|
124
|
+
precision highp float;
|
|
125
|
+
#else
|
|
126
|
+
#define highp
|
|
127
|
+
#define mediump
|
|
128
|
+
#define lowp
|
|
129
|
+
#endif
|
|
130
|
+
|
|
131
|
+
uniform vec3 color;
|
|
132
|
+
|
|
133
|
+
void main()
|
|
134
|
+
{
|
|
135
|
+
gl_FragColor = vec4(color, 1.0);
|
|
136
|
+
}`;
|
|
137
|
+
function cameraRotationForScreenOrientation() {
|
|
138
|
+
if (window.screen.orientation && !profile.forceWindowOrientation) {
|
|
139
|
+
switch (window.screen.orientation.type) {
|
|
140
|
+
case "portrait-primary":
|
|
141
|
+
return 270;
|
|
142
|
+
case "landscape-secondary":
|
|
143
|
+
return 180;
|
|
144
|
+
case "portrait-secondary":
|
|
145
|
+
return 90;
|
|
146
|
+
default:
|
|
147
|
+
return 0;
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
else if (window.orientation !== undefined) {
|
|
151
|
+
switch (window.orientation) {
|
|
152
|
+
case 0: return 270;
|
|
153
|
+
case 90: return 0;
|
|
154
|
+
case 180: return 90;
|
|
155
|
+
case -90: return 180;
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
return 0;
|
|
159
|
+
}
|
|
160
|
+
export function getPointsDataMatrix(frameWidth, frameHeight, screenWidth, screenHeight, mirror) {
|
|
161
|
+
let ret = mat4.create();
|
|
162
|
+
let trans = mat4.create();
|
|
163
|
+
// Translate to centre UV coords
|
|
164
|
+
mat4.fromTranslation(trans, [-0.5 * frameWidth, -0.5 * frameHeight, 0]);
|
|
165
|
+
mat4.multiply(ret, trans, ret);
|
|
166
|
+
mat4.fromScaling(trans, [2 / frameWidth, 2 / -frameHeight, 1]);
|
|
167
|
+
mat4.multiply(ret, trans, ret);
|
|
168
|
+
if (mirror) {
|
|
169
|
+
mat4.fromScaling(trans, [-1, 1, 1]);
|
|
170
|
+
mat4.multiply(ret, trans, ret);
|
|
171
|
+
}
|
|
172
|
+
let screenAspect = screenWidth > screenHeight ? (screenWidth / screenHeight) : (screenHeight / screenWidth);
|
|
173
|
+
let frameAspect = frameWidth / frameHeight;
|
|
174
|
+
mat4.fromScaling(trans, [1, screenAspect / frameAspect, 1]);
|
|
175
|
+
mat4.multiply(ret, trans, ret);
|
|
176
|
+
// Apply rotation back into ZCV's landscape space
|
|
177
|
+
mat4.fromRotation(trans, cameraRotationForScreenOrientation() * Math.PI / 180.0, [0, 0, 1]);
|
|
178
|
+
mat4.multiply(ret, trans, ret);
|
|
179
|
+
return ret;
|
|
180
|
+
}
|
|
@@ -9,6 +9,7 @@ import { log_level_t } from "./zappar-native";
|
|
|
9
9
|
export { log_level_t } from "./zappar-native";
|
|
10
10
|
export { image_target_type_t } from "./zappar-native";
|
|
11
11
|
export { world_tracker_quality_t } from "./zappar-native";
|
|
12
|
+
export { camera_profile_t } from "./zappar-native";
|
|
12
13
|
export declare type zappar_pipeline_t = number & {
|
|
13
14
|
_: 'zappar_pipeline_t';
|
|
14
15
|
};
|
|
@@ -36,6 +37,9 @@ export declare type zappar_barcode_finder_t = number & {
|
|
|
36
37
|
export declare type zappar_instant_world_tracker_t = number & {
|
|
37
38
|
_: 'zappar_instant_world_tracker_t';
|
|
38
39
|
};
|
|
40
|
+
export declare type zappar_zapcode_tracker_t = number & {
|
|
41
|
+
_: 'zappar_zapcode_tracker_t';
|
|
42
|
+
};
|
|
39
43
|
export declare type zappar_world_tracker_t = number & {
|
|
40
44
|
_: 'zappar_world_tracker_t';
|
|
41
45
|
};
|
|
@@ -105,6 +109,15 @@ export interface zappar {
|
|
|
105
109
|
instant_world_tracker_enabled(o: zappar_instant_world_tracker_t): boolean;
|
|
106
110
|
instant_world_tracker_anchor_pose_raw(o: zappar_instant_world_tracker_t): Float32Array;
|
|
107
111
|
instant_world_tracker_anchor_pose_set_from_camera_offset_raw(o: zappar_instant_world_tracker_t, x: number, y: number, z: number, orientation: instant_world_tracker_transform_orientation_t): void;
|
|
112
|
+
zapcode_tracker_create(pipeline: zappar_pipeline_t): zappar_zapcode_tracker_t;
|
|
113
|
+
zapcode_tracker_destroy(o: zappar_zapcode_tracker_t): void;
|
|
114
|
+
zapcode_tracker_target_load_from_memory(o: zappar_zapcode_tracker_t, data: ArrayBuffer): void;
|
|
115
|
+
zapcode_tracker_target_loaded_version(o: zappar_zapcode_tracker_t): number;
|
|
116
|
+
zapcode_tracker_enabled(o: zappar_zapcode_tracker_t): boolean;
|
|
117
|
+
zapcode_tracker_enabled_set(o: zappar_zapcode_tracker_t, enabled: boolean): void;
|
|
118
|
+
zapcode_tracker_anchor_count(o: zappar_zapcode_tracker_t): number;
|
|
119
|
+
zapcode_tracker_anchor_id(o: zappar_zapcode_tracker_t, indx: number): string;
|
|
120
|
+
zapcode_tracker_anchor_pose_raw(o: zappar_zapcode_tracker_t, indx: number): Float32Array;
|
|
108
121
|
world_tracker_create(pipeline: zappar_pipeline_t): zappar_world_tracker_t;
|
|
109
122
|
world_tracker_destroy(o: zappar_world_tracker_t): void;
|
|
110
123
|
world_tracker_enabled(o: zappar_world_tracker_t): boolean;
|
|
@@ -117,4 +130,11 @@ export interface zappar {
|
|
|
117
130
|
world_tracker_ground_anchor_valid(o: zappar_world_tracker_t): boolean;
|
|
118
131
|
world_tracker_ground_anchor_pose_raw(o: zappar_world_tracker_t): Float32Array;
|
|
119
132
|
world_tracker_reset(o: zappar_world_tracker_t): void;
|
|
133
|
+
world_tracker_tracks_data_enabled(o: zappar_world_tracker_t): boolean;
|
|
134
|
+
world_tracker_tracks_data_enabled_set(o: zappar_world_tracker_t, tracks_data_enabled: boolean): void;
|
|
135
|
+
world_tracker_tracks_data_size(o: zappar_world_tracker_t): number;
|
|
136
|
+
world_tracker_tracks_data(o: zappar_world_tracker_t): Float32Array;
|
|
137
|
+
world_tracker_projections_data_enabled_set(o: zappar_world_tracker_t, tracks_data_enabled: boolean): void;
|
|
138
|
+
world_tracker_projections_data_size(o: zappar_world_tracker_t): number;
|
|
139
|
+
world_tracker_projections_data(o: zappar_world_tracker_t): Float32Array;
|
|
120
140
|
}
|
package/lib/gen/zappar-bridge.js
CHANGED
|
@@ -5,3 +5,4 @@ export { instant_world_tracker_transform_orientation_t } from "./zappar-native";
|
|
|
5
5
|
export { log_level_t } from "./zappar-native";
|
|
6
6
|
export { image_target_type_t } from "./zappar-native";
|
|
7
7
|
export { world_tracker_quality_t } from "./zappar-native";
|
|
8
|
+
export { camera_profile_t } from "./zappar-native";
|
|
@@ -17,6 +17,7 @@ export declare class zappar_client {
|
|
|
17
17
|
private _face_landmark_state_by_instance;
|
|
18
18
|
private _barcode_finder_state_by_instance;
|
|
19
19
|
private _instant_world_tracker_state_by_instance;
|
|
20
|
+
private _zapcode_tracker_state_by_instance;
|
|
20
21
|
private _world_tracker_state_by_instance;
|
|
21
22
|
impl: zappar;
|
|
22
23
|
processMessages(a: ArrayBuffer): void;
|