lunchboxjs 0.2.1001-beta.1 → 0.2.1001-beta.2
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/dist/lunchboxjs.js +160 -87
- package/dist/lunchboxjs.min.js +1 -1
- package/dist/lunchboxjs.module.js +159 -82
- package/extras/OrbitControlsWrapper.vue +2 -12
- package/package.json +4 -1
- package/src/components/LunchboxEventHandlers.tsx +29 -31
- package/src/components/LunchboxWrapper/LunchboxWrapper.tsx +42 -1
- package/src/core/index.ts +0 -1
- package/src/core/update.ts +30 -14
- package/src/core/updateObjectProp.ts +16 -2
- package/src/index.ts +55 -33
- package/src/utils/index.ts +10 -0
- package/src/core/ensure.ts +0 -16
package/dist/lunchboxjs.js
CHANGED
|
@@ -124,34 +124,6 @@
|
|
|
124
124
|
return node;
|
|
125
125
|
}
|
|
126
126
|
|
|
127
|
-
const globalsInjectionKey = Symbol();
|
|
128
|
-
const updateGlobalsInjectionKey = Symbol();
|
|
129
|
-
const setCustomRenderKey = Symbol();
|
|
130
|
-
const clearCustomRenderKey = Symbol();
|
|
131
|
-
const beforeRenderKey = Symbol();
|
|
132
|
-
const onBeforeRenderKey = Symbol();
|
|
133
|
-
const offBeforeRenderKey = Symbol();
|
|
134
|
-
const afterRenderKey = Symbol();
|
|
135
|
-
const onAfterRenderKey = Symbol();
|
|
136
|
-
const offAfterRenderKey = Symbol();
|
|
137
|
-
const frameIdKey = Symbol();
|
|
138
|
-
const watchStopHandleKey = Symbol();
|
|
139
|
-
const appRootNodeKey = Symbol();
|
|
140
|
-
const appKey = Symbol();
|
|
141
|
-
const appRenderersKey = Symbol();
|
|
142
|
-
const appSceneKey = Symbol();
|
|
143
|
-
const appCameraKey = Symbol();
|
|
144
|
-
const lunchboxInteractables = Symbol();
|
|
145
|
-
const startCallbackKey = Symbol();
|
|
146
|
-
|
|
147
|
-
const ensuredCamera = () => vue.inject(appCameraKey); // ENSURE RENDERER
|
|
148
|
-
// ====================
|
|
149
|
-
|
|
150
|
-
const ensureRenderer = () => vue.inject(appRenderersKey); // ENSURE SCENE
|
|
151
|
-
// ====================
|
|
152
|
-
|
|
153
|
-
const ensuredScene = () => vue.inject(appSceneKey);
|
|
154
|
-
|
|
155
127
|
/** Add an event listener to the given node. Also creates the event teardown function and any necessary raycaster/interaction dictionary updates. */
|
|
156
128
|
function addEventListener({
|
|
157
129
|
node,
|
|
@@ -282,8 +254,6 @@
|
|
|
282
254
|
|
|
283
255
|
setup() {
|
|
284
256
|
const interactables = useLunchboxInteractables();
|
|
285
|
-
const camera = useCamera();
|
|
286
|
-
const renderer = useRenderer();
|
|
287
257
|
const globals = useGlobals();
|
|
288
258
|
const mousePos = vue.ref({
|
|
289
259
|
x: Infinity,
|
|
@@ -311,7 +281,7 @@
|
|
|
311
281
|
}; // add mouse listener to renderer DOM element when the element is ready
|
|
312
282
|
|
|
313
283
|
|
|
314
|
-
|
|
284
|
+
onRendererReady(v => {
|
|
315
285
|
if (!v?.domElement) return; // we have a DOM element, so let's add mouse listeners
|
|
316
286
|
|
|
317
287
|
const {
|
|
@@ -332,16 +302,14 @@
|
|
|
332
302
|
|
|
333
303
|
domElement.addEventListener('pointermove', mouseMoveListener);
|
|
334
304
|
domElement.addEventListener('pointerdown', mouseDownListener);
|
|
335
|
-
domElement.addEventListener('pointerup', mouseUpListener);
|
|
336
|
-
|
|
337
|
-
stopWatch();
|
|
338
|
-
}, {
|
|
339
|
-
immediate: true
|
|
305
|
+
domElement.addEventListener('pointerup', mouseUpListener);
|
|
340
306
|
});
|
|
307
|
+
const camera = useCamera();
|
|
341
308
|
|
|
342
309
|
const update = () => {
|
|
343
310
|
const c = camera.value;
|
|
344
|
-
if (!c) return;
|
|
311
|
+
if (!c) return; // console.log(camera.value)
|
|
312
|
+
|
|
345
313
|
raycaster.setFromCamera(mousePos.value, c);
|
|
346
314
|
const intersections = raycaster.intersectObjects(interactables?.value.map(v => v.instance) ?? []);
|
|
347
315
|
let leaveValues = [],
|
|
@@ -432,10 +400,13 @@
|
|
|
432
400
|
vue.onBeforeUnmount(teardown);
|
|
433
401
|
const clickEventKeys = ['onClick', 'onPointerDown', 'onPointerUp'];
|
|
434
402
|
vue.watch(inputActive, isDown => {
|
|
435
|
-
//
|
|
403
|
+
// run raycaster on click (necessary when `update` is not automatically called,
|
|
404
|
+
// for example in `updateSource` functions)
|
|
405
|
+
update(); // meshes with multiple intersections receive multiple callbacks by default -
|
|
436
406
|
// let's make it so they only receive one callback of each type per frame.
|
|
437
407
|
// (ie usually when you click on a mesh, you expect only one click event to fire, even
|
|
438
408
|
// if there are technically multiple intersections with that mesh)
|
|
409
|
+
|
|
439
410
|
const uuidsInteractedWithThisFrame = [];
|
|
440
411
|
currentIntersections.forEach(v => {
|
|
441
412
|
clickEventKeys.forEach(key => {
|
|
@@ -637,7 +608,37 @@
|
|
|
637
608
|
// ====================
|
|
638
609
|
|
|
639
610
|
const containerFillStyle = props.sizePolicy === 'container' ? 'static' : 'absolute';
|
|
640
|
-
const canvasFillStyle = props.sizePolicy === 'container' ? 'static' : 'fixed';
|
|
611
|
+
const canvasFillStyle = props.sizePolicy === 'container' ? 'static' : 'fixed'; // REACTIVE CUSTOM CAMERAS
|
|
612
|
+
// ====================
|
|
613
|
+
// find first camera with `type.name` property
|
|
614
|
+
// (which indicates a Lunch.Node)
|
|
615
|
+
|
|
616
|
+
const activeCamera = vue.computed(() => {
|
|
617
|
+
const output = context.slots?.camera?.().find(c => c.type?.name);
|
|
618
|
+
|
|
619
|
+
if (output) {
|
|
620
|
+
return output;
|
|
621
|
+
}
|
|
622
|
+
|
|
623
|
+
return output;
|
|
624
|
+
}); // TODO: make custom cameras reactive
|
|
625
|
+
|
|
626
|
+
vue.watch(activeCamera, async (newVal, oldVal) => {
|
|
627
|
+
// console.log('got camera', newVal)
|
|
628
|
+
if (newVal && newVal?.props?.key !== oldVal?.props?.key) {
|
|
629
|
+
// TODO: remove cast
|
|
630
|
+
camera.value = newVal; // TODO: why isn't this updating app camera?
|
|
631
|
+
// const el = await waitFor(() => newVal.el)
|
|
632
|
+
// console.log(el)
|
|
633
|
+
// camera.value = el
|
|
634
|
+
// console.log(newVal.uuid)
|
|
635
|
+
// updateGlobals?.({ camera: el })
|
|
636
|
+
}
|
|
637
|
+
}, {
|
|
638
|
+
immediate: true
|
|
639
|
+
}); // RENDER FUNCTION
|
|
640
|
+
// ====================
|
|
641
|
+
|
|
641
642
|
return () => vue.createVNode(vue.Fragment, null, [context.slots?.renderer?.()?.length ? // TODO: remove `as any` cast
|
|
642
643
|
renderer.value = context.slots?.renderer?.()[0] : // ...otherwise, add canvas...
|
|
643
644
|
vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
|
|
@@ -667,7 +668,7 @@
|
|
|
667
668
|
}, {
|
|
668
669
|
default: () => [context.slots?.default?.()]
|
|
669
670
|
}), context.slots?.camera?.()?.length ? // TODO: remove `any` cast
|
|
670
|
-
camera.value
|
|
671
|
+
camera.value : props.ortho || props.orthographic ? vue.createVNode(vue.resolveComponent("orthographicCamera"), vue.mergeProps({
|
|
671
672
|
"ref": camera,
|
|
672
673
|
"args": props.cameraArgs ?? []
|
|
673
674
|
}, consolidatedCameraProperties), null) : vue.createVNode(vue.resolveComponent("perspectiveCamera"), vue.mergeProps({
|
|
@@ -1135,6 +1136,26 @@
|
|
|
1135
1136
|
return item?.minidomType === 'RendererNode';
|
|
1136
1137
|
}
|
|
1137
1138
|
|
|
1139
|
+
const globalsInjectionKey = Symbol();
|
|
1140
|
+
const updateGlobalsInjectionKey = Symbol();
|
|
1141
|
+
const setCustomRenderKey = Symbol();
|
|
1142
|
+
const clearCustomRenderKey = Symbol();
|
|
1143
|
+
const beforeRenderKey = Symbol();
|
|
1144
|
+
const onBeforeRenderKey = Symbol();
|
|
1145
|
+
const offBeforeRenderKey = Symbol();
|
|
1146
|
+
const afterRenderKey = Symbol();
|
|
1147
|
+
const onAfterRenderKey = Symbol();
|
|
1148
|
+
const offAfterRenderKey = Symbol();
|
|
1149
|
+
const frameIdKey = Symbol();
|
|
1150
|
+
const watchStopHandleKey = Symbol();
|
|
1151
|
+
const appRootNodeKey = Symbol();
|
|
1152
|
+
const appKey = Symbol();
|
|
1153
|
+
const appRenderersKey = Symbol();
|
|
1154
|
+
const appSceneKey = Symbol();
|
|
1155
|
+
const appCameraKey = Symbol();
|
|
1156
|
+
const lunchboxInteractables = Symbol();
|
|
1157
|
+
const startCallbackKey = Symbol();
|
|
1158
|
+
|
|
1138
1159
|
const requestUpdate = opts => {
|
|
1139
1160
|
if (typeof opts.app.config.globalProperties.lunchbox.frameId === 'number') {
|
|
1140
1161
|
cancelAnimationFrame(opts.app.config.globalProperties.lunchbox.frameId);
|
|
@@ -1168,20 +1189,19 @@
|
|
|
1168
1189
|
const {
|
|
1169
1190
|
app,
|
|
1170
1191
|
renderer,
|
|
1171
|
-
scene
|
|
1172
|
-
camera
|
|
1192
|
+
scene
|
|
1173
1193
|
} = opts; // BEFORE RENDER
|
|
1174
1194
|
|
|
1175
1195
|
app.config.globalProperties.lunchbox.beforeRender.forEach(cb => {
|
|
1176
1196
|
cb?.(opts);
|
|
1177
1197
|
}); // RENDER
|
|
1178
1198
|
|
|
1179
|
-
if (renderer && scene && camera) {
|
|
1199
|
+
if (renderer && scene && opts.app.config.globalProperties.lunchbox.camera) {
|
|
1180
1200
|
if (app.customRender) {
|
|
1181
1201
|
app.customRender(opts);
|
|
1182
1202
|
} else {
|
|
1183
|
-
renderer.render(vue.toRaw(scene),
|
|
1184
|
-
|
|
1203
|
+
renderer.render(vue.toRaw(scene), opts.app.config.globalProperties.lunchbox.camera // toRaw(camera)
|
|
1204
|
+
);
|
|
1185
1205
|
}
|
|
1186
1206
|
} // AFTER RENDER
|
|
1187
1207
|
|
|
@@ -1191,55 +1211,81 @@
|
|
|
1191
1211
|
});
|
|
1192
1212
|
}; // before render
|
|
1193
1213
|
// ====================
|
|
1194
|
-
|
|
1214
|
+
|
|
1215
|
+
/** Obtain callback methods for `onBeforeRender` and `offBeforeRender`. Usually used internally by Lunchbox. */
|
|
1195
1216
|
|
|
1196
1217
|
const useBeforeRender = () => {
|
|
1197
1218
|
return {
|
|
1198
1219
|
onBeforeRender: vue.inject(onBeforeRenderKey),
|
|
1199
1220
|
offBeforeRender: vue.inject(offBeforeRenderKey)
|
|
1200
1221
|
};
|
|
1201
|
-
};
|
|
1222
|
+
};
|
|
1223
|
+
/** Run a function before every render.
|
|
1224
|
+
*
|
|
1225
|
+
* Note that if `updateSource` is set in the Lunchbox wrapper component, this will **only** run
|
|
1226
|
+
* before a render triggered by that `updateSource`. Normally, the function should run every frame.
|
|
1227
|
+
*/
|
|
1202
1228
|
|
|
1203
1229
|
const onBeforeRender = (cb, index = Infinity) => {
|
|
1204
1230
|
useBeforeRender().onBeforeRender?.(cb, index);
|
|
1205
|
-
};
|
|
1231
|
+
};
|
|
1232
|
+
/** Remove a function from the `beforeRender` callback list. Useful for tearing down functions added
|
|
1233
|
+
* by `onBeforeRender`.
|
|
1234
|
+
*/
|
|
1206
1235
|
|
|
1207
1236
|
const offBeforeRender = cb => {
|
|
1208
1237
|
useBeforeRender().offBeforeRender?.(cb);
|
|
1209
1238
|
}; // after render
|
|
1210
1239
|
// ====================
|
|
1211
|
-
|
|
1240
|
+
|
|
1241
|
+
/** Obtain callback methods for `onAfterRender` and `offAfterRender`. Usually used internally by Lunchbox. */
|
|
1212
1242
|
|
|
1213
1243
|
const useAfterRender = () => {
|
|
1214
1244
|
return {
|
|
1215
1245
|
onAfterRender: vue.inject(onBeforeRenderKey),
|
|
1216
1246
|
offAfterRender: vue.inject(offBeforeRenderKey)
|
|
1217
1247
|
};
|
|
1218
|
-
};
|
|
1248
|
+
};
|
|
1249
|
+
/** Run a function after every render.
|
|
1250
|
+
*
|
|
1251
|
+
* Note that if `updateSource` is set in the Lunchbox wrapper component, this will **only** run
|
|
1252
|
+
* after a render triggered by that `updateSource`. Normally, the function should run every frame.
|
|
1253
|
+
*/
|
|
1219
1254
|
|
|
1220
1255
|
const onAfterRender = (cb, index = Infinity) => {
|
|
1221
1256
|
useBeforeRender().onBeforeRender?.(cb, index);
|
|
1222
|
-
};
|
|
1257
|
+
};
|
|
1258
|
+
/** Remove a function from the `afterRender` callback list. Useful for tearing down functions added
|
|
1259
|
+
* by `onAfterRender`.
|
|
1260
|
+
*/
|
|
1223
1261
|
|
|
1224
1262
|
const offAfterRender = cb => {
|
|
1225
1263
|
useBeforeRender().offBeforeRender?.(cb);
|
|
1226
|
-
};
|
|
1264
|
+
};
|
|
1265
|
+
/** Obtain a function used to cancel the current update frame. Use `cancelUpdate` if you wish
|
|
1266
|
+
* to immediately invoke the cancellation function. Usually used internally by Lunchbox.
|
|
1267
|
+
*/
|
|
1227
1268
|
|
|
1228
1269
|
const useCancelUpdate = () => {
|
|
1229
1270
|
const frameId = vue.inject(frameIdKey);
|
|
1230
1271
|
return () => {
|
|
1231
1272
|
if (frameId !== undefined) cancelAnimationFrame(frameId);
|
|
1232
1273
|
};
|
|
1233
|
-
};
|
|
1274
|
+
};
|
|
1275
|
+
/** Cancel the current update frame. Usually used internally by Lunchbox. */
|
|
1234
1276
|
|
|
1235
1277
|
const cancelUpdate = () => {
|
|
1236
1278
|
useCancelUpdate()?.();
|
|
1237
|
-
};
|
|
1279
|
+
};
|
|
1280
|
+
/** Obtain a function used to cancel an update source. Use `cancelUpdateSource` if you wish to
|
|
1281
|
+
* immediately invoke the cancellation function. Usually used internally by Lunchbox.
|
|
1282
|
+
*/
|
|
1238
1283
|
|
|
1239
1284
|
const useCancelUpdateSource = () => {
|
|
1240
1285
|
const cancel = vue.inject(watchStopHandleKey);
|
|
1241
1286
|
return () => cancel?.();
|
|
1242
|
-
};
|
|
1287
|
+
};
|
|
1288
|
+
/** Cancel an update source. Usually used internally by Lunchbox. */
|
|
1243
1289
|
|
|
1244
1290
|
const cancelUpdateSource = () => {
|
|
1245
1291
|
useCancelUpdateSource()?.();
|
|
@@ -1290,6 +1336,7 @@
|
|
|
1290
1336
|
const fullPath = [nestedProperty, finalKey].filter(Boolean).join('.');
|
|
1291
1337
|
liveProperty = liveProperty = lodash.get(target, fullPath);
|
|
1292
1338
|
} // change property
|
|
1339
|
+
// first, save as array in case we need to spread it
|
|
1293
1340
|
|
|
1294
1341
|
|
|
1295
1342
|
if (liveProperty && lodash.isNumber(value) && liveProperty.setScalar) {
|
|
@@ -1300,14 +1347,24 @@
|
|
|
1300
1347
|
const nextValueAsArray = Array.isArray(value) ? value : [value];
|
|
1301
1348
|
target[finalKey].set(...nextValueAsArray);
|
|
1302
1349
|
} else if (typeof liveProperty === 'function') {
|
|
1303
|
-
//
|
|
1304
|
-
|
|
1350
|
+
// some function properties are set rather than called, so let's handle them
|
|
1351
|
+
if (finalKey.toLowerCase() === 'onbeforerender' || finalKey.toLowerCase() === 'onafterrender') {
|
|
1352
|
+
target[finalKey] = value;
|
|
1353
|
+
} else {
|
|
1354
|
+
if (!Array.isArray(value)) {
|
|
1355
|
+
throw new Error('Arguments on a declarative method must be wrapped in an array.\nWorks:\n<example :methodCall="[256]" />\nDoesn\'t work:\n<example :methodCall="256" />');
|
|
1356
|
+
} // if property is a function, let's try calling it
|
|
1357
|
+
|
|
1358
|
+
|
|
1359
|
+
liveProperty.bind(node.instance)(...value);
|
|
1360
|
+
} // pass the result to the parent
|
|
1305
1361
|
// const parent = node.parentNode
|
|
1306
1362
|
// if (parent) {
|
|
1307
1363
|
// const parentAsLunchboxNode = parent as Lunchbox.Node
|
|
1308
1364
|
// parentAsLunchboxNode.attached[finalKey] = result
|
|
1309
1365
|
// ; (parentAsLunchboxNode.instance as any)[finalKey] = result
|
|
1310
1366
|
// }
|
|
1367
|
+
|
|
1311
1368
|
} else if (lodash.get(target, finalKey, undefined) !== undefined) {
|
|
1312
1369
|
// blank strings evaluate to `true`
|
|
1313
1370
|
// <mesh castShadow receiveShadow /> will work the same as
|
|
@@ -1597,33 +1654,51 @@
|
|
|
1597
1654
|
};
|
|
1598
1655
|
};
|
|
1599
1656
|
|
|
1600
|
-
/** The current camera
|
|
1601
|
-
// TODO: update docs
|
|
1657
|
+
/** The current camera as a computed value. */
|
|
1602
1658
|
|
|
1603
|
-
const
|
|
1659
|
+
const useCamera = () => vue.inject(appCameraKey);
|
|
1660
|
+
/** Run a function using the current camera when it's present. */
|
|
1604
1661
|
|
|
1605
|
-
const
|
|
1606
|
-
|
|
1662
|
+
const onCameraReady = cb => {
|
|
1663
|
+
const stopWatch = vue.watch(useCamera(), newVal => {
|
|
1664
|
+
if (newVal) {
|
|
1665
|
+
cb(newVal);
|
|
1666
|
+
stopWatch();
|
|
1667
|
+
}
|
|
1668
|
+
}, {
|
|
1669
|
+
immediate: true
|
|
1670
|
+
});
|
|
1671
|
+
};
|
|
1672
|
+
/** The current renderer as a computed value. */
|
|
1607
1673
|
|
|
1608
|
-
const
|
|
1674
|
+
const useRenderer = () => vue.inject(appRenderersKey);
|
|
1609
1675
|
/** Run a function using the current renderer when it's present. */
|
|
1610
1676
|
|
|
1611
|
-
const
|
|
1612
|
-
|
|
1613
|
-
|
|
1677
|
+
const onRendererReady = cb => {
|
|
1678
|
+
const stopWatch = vue.watch(useRenderer(), newVal => {
|
|
1679
|
+
if (newVal) {
|
|
1680
|
+
cb(newVal);
|
|
1681
|
+
stopWatch();
|
|
1682
|
+
}
|
|
1683
|
+
}, {
|
|
1684
|
+
immediate: true
|
|
1685
|
+
});
|
|
1686
|
+
};
|
|
1687
|
+
/** The current scene as a computed value. */
|
|
1614
1688
|
|
|
1615
|
-
const
|
|
1689
|
+
const useScene = () => vue.inject(appSceneKey);
|
|
1616
1690
|
/** Run a function using the current scene when it's present. */
|
|
1617
|
-
// TODO: update docs
|
|
1618
1691
|
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
if (
|
|
1622
|
-
|
|
1692
|
+
const onSceneReady = cb => {
|
|
1693
|
+
const stopWatch = vue.watch(useScene(), newVal => {
|
|
1694
|
+
if (newVal) {
|
|
1695
|
+
cb(newVal);
|
|
1696
|
+
stopWatch();
|
|
1697
|
+
}
|
|
1623
1698
|
}, {
|
|
1624
1699
|
immediate: true
|
|
1625
1700
|
});
|
|
1626
|
-
} // CUSTOM RENDER SUPPORT
|
|
1701
|
+
}; // CUSTOM RENDER SUPPORT
|
|
1627
1702
|
// ====================
|
|
1628
1703
|
|
|
1629
1704
|
/** Set a custom render function, overriding the Lunchbox app's default render function.
|
|
@@ -1680,14 +1755,15 @@
|
|
|
1680
1755
|
|
|
1681
1756
|
const updateGlobals = newValue => {
|
|
1682
1757
|
useUpdateGlobals()?.(newValue);
|
|
1683
|
-
};
|
|
1684
|
-
|
|
1685
|
-
const useRootNode = () => vue.inject(appRootNodeKey); // TODO: document
|
|
1758
|
+
};
|
|
1759
|
+
/** Use the current Lunchbox app. Usually used internally by Lunchbox. */
|
|
1686
1760
|
|
|
1687
|
-
const useApp = () => vue.inject(appKey);
|
|
1761
|
+
const useApp = () => vue.inject(appKey);
|
|
1762
|
+
/** Obtain a list of the start callback functions. Usually used internally by Lunchbox. */
|
|
1688
1763
|
|
|
1689
|
-
const useStartCallbacks = () => vue.inject(startCallbackKey);
|
|
1690
|
-
|
|
1764
|
+
const useStartCallbacks = () => vue.inject(startCallbackKey);
|
|
1765
|
+
/** Run a given callback once when the Lunchbox app starts. Include an index to
|
|
1766
|
+
* splice the callback at that index in the callback queue. */
|
|
1691
1767
|
|
|
1692
1768
|
const onStart = (cb, index = Infinity) => {
|
|
1693
1769
|
const callbacks = useStartCallbacks();
|
|
@@ -1697,7 +1773,8 @@
|
|
|
1697
1773
|
} else {
|
|
1698
1774
|
callbacks?.splice(index, 0, cb);
|
|
1699
1775
|
}
|
|
1700
|
-
};
|
|
1776
|
+
};
|
|
1777
|
+
/** Obtain a list of interactable objects (registered via onClick, onHover, etc events). Usually used internally by Lunchbox. */
|
|
1701
1778
|
|
|
1702
1779
|
const useLunchboxInteractables = () => vue.inject(lunchboxInteractables); // CREATE APP
|
|
1703
1780
|
// ====================
|
|
@@ -1868,7 +1945,6 @@
|
|
|
1868
1945
|
exports.appRootNodeKey = appRootNodeKey;
|
|
1869
1946
|
exports.appSceneKey = appSceneKey;
|
|
1870
1947
|
exports.beforeRenderKey = beforeRenderKey;
|
|
1871
|
-
exports.camera = camera;
|
|
1872
1948
|
exports.cancelUpdate = cancelUpdate;
|
|
1873
1949
|
exports.cancelUpdateSource = cancelUpdateSource;
|
|
1874
1950
|
exports.clearCustomRender = clearCustomRender;
|
|
@@ -1878,9 +1954,6 @@
|
|
|
1878
1954
|
exports.createDomNode = createDomNode;
|
|
1879
1955
|
exports.createNode = createNode;
|
|
1880
1956
|
exports.createTextNode = createTextNode;
|
|
1881
|
-
exports.ensureRenderer = ensureRenderer;
|
|
1882
|
-
exports.ensuredCamera = ensuredCamera;
|
|
1883
|
-
exports.ensuredScene = ensuredScene;
|
|
1884
1957
|
exports.extend = extend;
|
|
1885
1958
|
exports.find = find;
|
|
1886
1959
|
exports.frameIdKey = frameIdKey;
|
|
@@ -1897,9 +1970,10 @@
|
|
|
1897
1970
|
exports.onAfterRenderKey = onAfterRenderKey;
|
|
1898
1971
|
exports.onBeforeRender = onBeforeRender;
|
|
1899
1972
|
exports.onBeforeRenderKey = onBeforeRenderKey;
|
|
1973
|
+
exports.onCameraReady = onCameraReady;
|
|
1974
|
+
exports.onRendererReady = onRendererReady;
|
|
1975
|
+
exports.onSceneReady = onSceneReady;
|
|
1900
1976
|
exports.onStart = onStart;
|
|
1901
|
-
exports.renderer = renderer;
|
|
1902
|
-
exports.scene = scene;
|
|
1903
1977
|
exports.setCustomRender = setCustomRender;
|
|
1904
1978
|
exports.setCustomRenderKey = setCustomRenderKey;
|
|
1905
1979
|
exports.startCallbackKey = startCallbackKey;
|
|
@@ -1917,7 +1991,6 @@
|
|
|
1917
1991
|
exports.useGlobals = useGlobals;
|
|
1918
1992
|
exports.useLunchboxInteractables = useLunchboxInteractables;
|
|
1919
1993
|
exports.useRenderer = useRenderer;
|
|
1920
|
-
exports.useRootNode = useRootNode;
|
|
1921
1994
|
exports.useScene = useScene;
|
|
1922
1995
|
exports.useStartCallbacks = useStartCallbacks;
|
|
1923
1996
|
exports.useUpdateGlobals = useUpdateGlobals;
|
package/dist/lunchboxjs.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("three"),require("lodash")):"function"==typeof define&&define.amd?define(["exports","vue","three","lodash"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Lunchbox={},e.vue,e.three,e.lodash)}(this,(function(e,t,r,n){"use strict";function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=o(r);const i=e=>e?.$el&&e?.$el?.hasOwnProperty?.("instance"),s=e=>"domMeta"===e?.metaType||e?.props?.["data-lunchbox"],c=e=>"standardMeta"===e?.metaType,d=e=>e.isLunchboxRootNode;function l(t={}){const r={text:t.text??""};return new e.MiniDom.RendererCommentNode({...r,...t,metaType:"commentMeta"})}function u(t={}){const r={domElement:document.createElement(t.type??"")};return new e.MiniDom.RendererDomNode({...r,...t,metaType:"domMeta"})}function p(t={}){const r={text:t.text??""};return new e.MiniDom.RendererTextNode({...t,...r,metaType:"textMeta"})}function m(t={},r={}){const n={attached:t.attached??[],attachedArray:t.attachedArray??{},instance:t.instance??null},o=new e.MiniDom.RendererStandardNode({...t,...n,metaType:"standardMeta"});return!o.type||d(o)||o.instance||(o.instance=_({...o,props:{...o.props,...r}})),o}const h=Symbol(),f=Symbol(),y=Symbol(),b=Symbol(),g=Symbol(),v=Symbol(),x=Symbol(),R=Symbol(),w=Symbol(),P=Symbol(),C=Symbol(),A=Symbol(),E=Symbol(),N=Symbol(),L=Symbol(),M=Symbol(),S=Symbol(),B=Symbol(),j=Symbol(),G=()=>t.inject(S),T=()=>t.inject(L),k=()=>t.inject(M);function O({node:e,key:t,interactables:r,value:n}){return e.eventListeners[t]||(e.eventListeners[t]=[]),e.eventListenerRemoveFunctions[t]||(e.eventListenerRemoveFunctions[t]=[]),e.eventListeners[t].push(n),$.includes(t)&&e.instance&&!r.value.includes(e)&&(r.value.push(e),e.eventListenerRemoveFunctions[t].push((()=>{const t=r.value.indexOf(e);-1!==t&&r.value.splice(t,1)}))),e}const $=["onClick","onPointerUp","onPointerDown","onPointerOver","onPointerOut","onPointerEnter","onPointerLeave","onPointerMove"],D=(e,r,n,o,a)=>{if(!r?.domElement||!n||!e)return;const i=(o=o??window.innerWidth)/(a=a??window.innerHeight);if("perspectivecamera"===e.type?.toLowerCase()){const t=e;t.aspect=i,t.updateProjectionMatrix()}else if("orthographiccamera"===e.type?.toLowerCase()){const t=e,r=a/o;t.top=10*r,t.bottom=10*-r,t.right=10,t.left=-10,t.updateProjectionMatrix()}r.setSize(o,a),n&&e&&r.render(t.toRaw(n),t.toRaw(e))},F=(e,t,r,n,o)=>{const a=e.value?.domElement;if(!a)throw new Error("missing container");const i=()=>{if("container"===o){const e=(e=>{const t=getComputedStyle(e);return{width:e.clientWidth-parseFloat(t.paddingLeft)-parseFloat(t.paddingRight),height:e.clientHeight-parseFloat(t.paddingTop)-parseFloat(t.paddingBottom)}})(a);D(t,r,n,e.width,e.height)}else D(t,r,n)};i();let s=new ResizeObserver((()=>{i()}));return a&&s.observe(a),{dispose(){a&&s.unobserve(a)}}},K=t.defineComponent({name:"LunchboxScene",setup:(e,{slots:r})=>()=>t.createVNode(t.resolveComponent("scene"),null,{default:()=>[r.default?.()]})}),V=t.defineComponent({name:"LunchboxEventHandlers",setup(){const e=Be(),r=we(),n=Ce(),o=Ne(),i=t.ref({x:1/0,y:1/0}),s=t.ref(!1);let c=[];const d=new a.Raycaster(new a.Vector3,new a.Vector3(0,0,-1)),l=({element:e,eventKeys:t,intersection:r})=>{e&&t.forEach((t=>{e.eventListeners[t]&&e.eventListeners[t].forEach((e=>{e({intersection:r})}))}))},u=t.watch(n,(e=>{if(!e?.domElement)return;const{domElement:t}=e;t.addEventListener("pointermove",(e=>{const r=(t.width??1)/o.dpr,n=(t.height??1)/o.dpr;i.value.x=e.offsetX/r*2-1,i.value.y=-e.offsetY/n*2+1})),t.addEventListener("pointerdown",(()=>s.value=!0)),t.addEventListener("pointerup",(()=>s.value=!1)),u()}),{immediate:!0}),p=()=>{const t=r.value;if(!t)return;d.setFromCamera(i.value,t);const n=d.intersectObjects(e?.value.map((e=>e.instance))??[]);let o=[],a=[],s=[];o=c.map((e=>e.intersection)),n?.forEach((t=>{if(-1===c.findIndex((e=>e.intersection.object===t.object))){const r=e?.value.find((e=>e.instance?.uuid===t.object.uuid));r&&a.push({element:r,intersection:t})}else{const r=e?.value.find((e=>e.instance?.uuid===t.object.uuid));r&&s.push({element:r,intersection:t})}const r=o.findIndex((e=>e.object.uuid===t.object.uuid));-1!==r&&o.splice(r,1)}));const u=o.map((t=>({element:e?.value.find((e=>e.instance?.uuid===t.object.uuid)),intersection:t})));a.forEach((({element:e,intersection:t})=>{l({element:e,eventKeys:["onPointerEnter"],intersection:t})})),s.forEach((({element:e,intersection:t})=>{l({element:e,eventKeys:["onPointerOver","onPointerMove"],intersection:t})})),u.forEach((({element:e,intersection:t})=>{l({element:e,eventKeys:["onPointerLeave","onPointerOut"],intersection:t})})),c=[].concat(a,s)};ie(p);t.onBeforeUnmount((()=>se(p)));const m=["onClick","onPointerDown","onPointerUp"];return t.watch(s,(e=>{const t=[];c.forEach((r=>{m.forEach((n=>{const o=r.element.uuid+n;!e||"onClick"!==n&&"onPointerDown"!==n?e||"onPointerUp"!==n||t.includes(o)||(r.element.eventListeners[n]?.forEach((e=>e({intersection:r.intersection}))),t.push(o)):t.includes(o)||(r.element.eventListeners[n]?.forEach((e=>e({intersection:r.intersection}))),t.push(o))}))}))})),()=>t.createVNode(t.resolveComponent("object3D"),null,null)}}),I=e=>({position:e,top:0,right:0,bottom:0,left:0,width:"100%",height:"100%",display:"block"}),U=t.defineComponent({name:"Lunchbox",props:{background:String,cameraArgs:Array,cameraLook:Array,cameraLookAt:Array,cameraPosition:Array,dpr:Number,ortho:Boolean,orthographic:Boolean,r3f:Boolean,rendererArguments:Object,rendererProperties:Object,sizePolicy:String,shadow:[Boolean,Object],transparent:Boolean,zoom:Number,updateSource:Object},setup(e,r){const n=t.ref();let o=e.dpr??-1;const i=t.ref(),s=t.ref(),c=t.ref(),d=t.ref(),l=Ne(),u=Le(),p=Me(),m=t.reactive({}),h=Se();e.r3f&&a?.ColorManagement&&(a.ColorManagement.legacyMode=!1);const f=Be();t.onMounted((async()=>{if(!n.value&&!r.slots?.renderer?.()?.length)throw new Error("missing canvas");for(r.slots?.camera?.()?.length||(e.cameraPosition&&(m.position=e.cameraPosition),(e.cameraLook||e.cameraLookAt)&&(m.lookAt=e.cameraLook||e.cameraLookAt),void 0!==e.zoom&&(m.zoom=e.zoom)),d.value?.$el?.instance&&e.background&&(d.value.$el.instance.background=new a.Color(e.background)),-1===o&&(o=window.devicePixelRatio),u?.({dpr:o});!s.value?.$el?.instance&&!s.value?.component?.ctx.$el?.instance;)await new Promise((e=>requestAnimationFrame(e)));for(;!d.value?.$el?.instance&&!d.value?.component?.ctx.$el?.instance;)await new Promise((e=>requestAnimationFrame(e)));const t=s.value?.$el?.instance??s.value?.component?.ctx.$el?.instance;t.setPixelRatio(l.dpr);const f=d.value?.$el?.instance??d.value?.component?.ctx.$el?.instance,y=c.value?.$el?.instance??c.value?.component?.ctx.$el?.instance;if(!r.slots?.renderer?.()?.length){F(i,y,t,f,e.sizePolicy),e.r3f&&(t.outputEncoding=a.sRGBEncoding,t.toneMapping=a.ACESFilmicToneMapping);const r={shadow:e.shadow};r?.shadow&&(t.shadowMap.enabled=!0,"object"==typeof r.shadow&&(t.shadowMap.type=r.shadow.type))}if(!p)throw new Error("error creating app");p.config.globalProperties.lunchbox.camera=y,p.config.globalProperties.lunchbox.renderer=t,p.config.globalProperties.lunchbox.scene=f;for(let e of h??[])e({app:p,camera:y,renderer:t,scene:f});oe({app:p,camera:y,renderer:t,scene:f,updateSource:e.updateSource})})),t.onBeforeUnmount((()=>{de(),ue()}));const y="container"===e.sizePolicy?"static":"absolute",b="container"===e.sizePolicy?"static":"fixed";return()=>t.createVNode(t.Fragment,null,[r.slots?.renderer?.()?.length?s.value=r.slots?.renderer?.()[0]:t.createVNode(t.Fragment,null,[t.createVNode("div",{class:"lunchbox-container",style:I(y),ref:i,"data-lunchbox":"true"},[t.createVNode("canvas",{ref:n,class:"lunchbox-canvas",style:I(b),"data-lunchbox":"true"},null)]),n.value?.domElement&&t.createVNode(t.resolveComponent("webGLRenderer"),t.mergeProps(e.rendererProperties??{},{ref:s,args:[{alpha:e.transparent,antialias:!0,canvas:n.value?.domElement,powerPreference:e.r3f?"high-performance":"default",...e.rendererArguments??{}}]}),null)]),r.slots?.scene?.()?.length?d.value=r.slots?.scene?.()[0]:t.createVNode(K,{ref:d},{default:()=>[r.slots?.default?.()]}),r.slots?.camera?.()?.length?c.value=r.slots?.camera?.()[0]:e.ortho||e.orthographic?t.createVNode(t.resolveComponent("orthographicCamera"),t.mergeProps({ref:c,args:e.cameraArgs??[]},m),null):t.createVNode(t.resolveComponent("perspectiveCamera"),t.mergeProps({ref:c,args:e.cameraArgs??[e.r3f?75:45,.5625,1,1e3]},m),null),f?.value.length&&t.createVNode(V,null,null)])}}),z={},H={...["mesh","instancedMesh","scene","sprite","object3D","instancedBufferGeometry","bufferGeometry","boxBufferGeometry","circleBufferGeometry","coneBufferGeometry","cylinderBufferGeometry","dodecahedronBufferGeometry","extrudeBufferGeometry","icosahedronBufferGeometry","latheBufferGeometry","octahedronBufferGeometry","parametricBufferGeometry","planeBufferGeometry","polyhedronBufferGeometry","ringBufferGeometry","shapeBufferGeometry","sphereBufferGeometry","tetrahedronBufferGeometry","textBufferGeometry","torusBufferGeometry","torusKnotBufferGeometry","tubeBufferGeometry","wireframeGeometry","parametricGeometry","tetrahedronGeometry","octahedronGeometry","icosahedronGeometry","dodecahedronGeometry","polyhedronGeometry","tubeGeometry","torusKnotGeometry","torusGeometry","sphereGeometry","ringGeometry","planeGeometry","latheGeometry","shapeGeometry","extrudeGeometry","edgesGeometry","coneGeometry","cylinderGeometry","circleGeometry","boxGeometry","material","shadowMaterial","spriteMaterial","rawShaderMaterial","shaderMaterial","pointsMaterial","meshPhysicalMaterial","meshStandardMaterial","meshPhongMaterial","meshToonMaterial","meshNormalMaterial","meshLambertMaterial","meshDepthMaterial","meshDistanceMaterial","meshBasicMaterial","meshMatcapMaterial","lineDashedMaterial","lineBasicMaterial","light","spotLightShadow","spotLight","pointLight","rectAreaLight","hemisphereLight","directionalLightShadow","directionalLight","ambientLight","lightShadow","ambientLightProbe","hemisphereLightProbe","lightProbe","texture","videoTexture","dataTexture","dataTexture3D","compressedTexture","cubeTexture","canvasTexture","depthTexture","textureLoader","group","catmullRomCurve3","points","raycaster","cameraHelper","camera","perspectiveCamera","orthographicCamera","cubeCamera","arrayCamera","webGLRenderer"].map((e=>t.defineComponent({inheritAttrs:!1,name:e,setup:(r,n)=>()=>t.h(e,n.attrs,n.slots?.default?.()||[])}))).reduce(((e,t)=>(e[t.name]=t,e)),{}),Lunchbox:U},W=e=>t.defineComponent({inheritAttrs:!1,name:e,render(){return t.h(e,this.$attrs,this.$slots?.default?.()||[])}}),q=({app:e,...t})=>{Object.keys(t).forEach((r=>{e.component(r,W(r)),z[r]=t[r]}))};function _(e){if(!e.type)return null;const t=e.type[0].toUpperCase()+e.type.slice(1),r=t.replace(/Lunchbox$/,""),n=z[e.type]||a[t]||z[r]||a[r];if(!n)throw`${t} is not part of the THREE namespace! Did you forget to extend? import {extend} from 'lunchbox'; extend({app, YourComponent, ...})`;const o=(e.props.args??[]).map((t=>function({node:e,prop:t}){const r="string"==typeof t&&t.startsWith("$attachedArray"),n=function({node:e,prop:t}){return"string"==typeof t&&t.startsWith("$attachedArray")?e.attachedArray[t.replace("$attachedArray.","")]:"string"==typeof t&&t.startsWith("$attached")?e.attached[t.replace("$attached.","")]:t}({node:e,prop:t});return Array.isArray(n)&&r?n:[n]}({node:e,prop:t})));let i=[];o.forEach((e=>{i=i.concat(e)}));return new n(...i)}var X,Y=new Uint8Array(16);function J(){if(!X&&!(X="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||"undefined"!=typeof msCrypto&&"function"==typeof msCrypto.getRandomValues&&msCrypto.getRandomValues.bind(msCrypto)))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return X(Y)}var Q=/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;function Z(e){return"string"==typeof e&&Q.test(e)}for(var ee=[],te=0;te<256;++te)ee.push((te+256).toString(16).substr(1));function re(e,t,r){var n=(e=e||{}).random||(e.rng||J)();if(n[6]=15&n[6]|64,n[8]=63&n[8]|128,t){r=r||0;for(var o=0;o<16;++o)t[r+o]=n[o];return t}return function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=(ee[e[t+0]]+ee[e[t+1]]+ee[e[t+2]]+ee[e[t+3]]+"-"+ee[e[t+4]]+ee[e[t+5]]+"-"+ee[e[t+6]]+ee[e[t+7]]+"-"+ee[e[t+8]]+ee[e[t+9]]+"-"+ee[e[t+10]]+ee[e[t+11]]+ee[e[t+12]]+ee[e[t+13]]+ee[e[t+14]]+ee[e[t+15]]).toLowerCase();if(!Z(r))throw TypeError("Stringified UUID is invalid");return r}(n)}e.MiniDom=void 0,function(e){e.BaseNode=class{constructor(e={},t){this.parentNode=e?.parentNode??t??null,this.minidomType="MinidomBaseNode",this.uuid=e?.uuid??re()}uuid;parentNode;get nextSibling(){if(!this.parentNode)return null;const e=this.parentNode.children.findIndex((e=>e.uuid===this.uuid));return-1!==e&&e<this.parentNode.children.length-1?this.parentNode.children[e+1]:null}insertBefore(e,t){e.removeAsChildFromAnyParents(),e.parentNode=this;const r=this.children.findIndex((e=>e.uuid===t?.uuid));-1!==r?this.children.splice(r,0,e):this.children.push(e)}removeChild(e){const t=this.children.findIndex((t=>t?.uuid===e?.uuid));-1!==t&&this.children.splice(t,1)}children=[];addChild(e){return e&&(e.removeAsChildFromAnyParents(),e.parentNode=this,this.insertBefore(e,null)),this}getPath(){const e=[];let t=this;for(;t;)e.unshift(t),t=t.parentNode;return e}drop(){this.removeAsChildFromAnyParents(),this.parentNode=null}walk(e){const t=[this,...this.children],r=[];let n=!0;for(;t.length&&n;){const o=t.shift();if(o){if(r.includes(o))continue;r.push(o),t.push(...o.children.filter((e=>!r.includes(e)))),n=e(o)}else n=!1}}minidomType;removeAsChildFromAnyParents(){this.parentNode?.removeChild(this)}};class t extends e.BaseNode{constructor(e={},t){super(e,t),this.minidomType="RendererNode",this.eventListeners={},this.eventListenerRemoveFunctions={},this.name=e.name??"",this.metaType=e.metaType??"standardMeta",this.props=e.props??[],this.type=e.type??""}eventListeners;eventListenerRemoveFunctions;name;metaType;props;type;drop(){super.drop(),Object.keys(this.eventListenerRemoveFunctions).forEach((e=>{this.eventListenerRemoveFunctions[e].forEach((e=>e()))}))}}e.RendererBaseNode=t;class r extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.domElement=e.domElement??document.createElement("div")}domElement;isLunchboxRootNode=!0}e.RendererRootNode=r;class n extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.text=e.text??""}text}e.RendererCommentNode=n;class o extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.domElement=e.domElement??document.createElement("div")}domElement}e.RendererDomNode=o;class a extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.text=e.text??""}text}e.RendererTextNode=a;class i extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.attached=e.attached??[],this.attachedArray=e.attachedArray??{},this.instance=e.instance??null}attached;attachedArray;instance}e.RendererStandardNode=i}(e.MiniDom||(e.MiniDom={}));const ne=e=>{"number"==typeof e.app.config.globalProperties.lunchbox.frameId&&cancelAnimationFrame(e.app.config.globalProperties.lunchbox.frameId),e.app.config.globalProperties.lunchbox.frameId=requestAnimationFrame((()=>oe({app:e.app,renderer:e.renderer,scene:e.scene,camera:e.camera,updateSource:e.updateSource})))},oe=e=>{e.updateSource?e.app.config.globalProperties.lunchbox.watchStopHandle||(e.app.config.globalProperties.lunchbox.watchStopHandle=t.watch(e.updateSource,(()=>{ne(e)}),{deep:!0})):ne(e);const{app:r,renderer:n,scene:o,camera:a}=e;r.config.globalProperties.lunchbox.beforeRender.forEach((t=>{t?.(e)})),n&&o&&a&&(r.customRender?r.customRender(e):n.render(t.toRaw(o),t.toRaw(a))),r.config.globalProperties.lunchbox.afterRender.forEach((t=>{t?.(e)}))},ae=()=>({onBeforeRender:t.inject(v),offBeforeRender:t.inject(x)}),ie=(e,t=1/0)=>{ae().onBeforeRender?.(e,t)},se=e=>{ae().offBeforeRender?.(e)},ce=()=>{const e=t.inject(C);return()=>{void 0!==e&&cancelAnimationFrame(e)}},de=()=>{ce()?.()},le=()=>{const e=t.inject(A);return()=>e?.()},ue=()=>{le()?.()};function pe({node:e,key:t,interactables:r,value:o}){if((e=>["onClick","onContextMenu","onDoubleClick","onPointerUp","onPointerDown","onPointerOver","onPointerOut","onPointerEnter","onPointerLeave","onPointerMove","onWheel"].includes(e))(t))return O({node:e,key:t,interactables:r,value:o});const a=t.replace(/-/g,"."),i=me[a]||a;if(fe.includes(t)||fe.includes(i))return e;if(!c(e))return e;if("string"==typeof o&&o.startsWith("$attached")){const t=o.replace("$attached.","");o=n.get(e.attached,t,null)}const s=e.instance;if(!s)return e;let d;for(let e=0;e<he.length&&!d;e++){const t=[he[e],i].filter(Boolean).join(".");d=d=n.get(s,t)}if(d&&n.isNumber(o)&&d.setScalar)d.setScalar(o);else if(d&&d.set){const e=Array.isArray(o)?o:[o];s[i].set(...e)}else"function"==typeof d?d.bind(e.instance)(...o):void 0!==n.get(s,i,void 0)?n.set(s,i,""===o||o):console.log(`No property ${i} found on ${s}`);const l=s?.texture?.type||s?.type;if("string"==typeof l){const e=l.toLowerCase();switch(!0){case e.includes("material"):s.needsUpdate=!0;break;case e.includes("camera")&&s.updateProjectionMatrix:s.updateProjectionMatrix()}}return e}const me={x:"position.x",y:"position.y",z:"position.z"},he=["","parameters"],fe=["args","attach","attachArray","is.default","isDefault","key","onAdded","ref","src"],ye=["geometry","material"],be=(e,t,r,n)=>{const o={type:e,props:n};if(s(o)){return u(o)}const a=m(o);return ye.forEach((t=>{e.toLowerCase().endsWith(t)&&(a.props.attach=t)})),a},ge=(e,t,r)=>{if(!t)throw new Error("missing parent");if(t.insertBefore(e,r),"commentMeta"!==e.metaType&&"textMeta"!==e.metaType&&(s(e)&&(s(t)||d(t))&&t.domElement.appendChild(e.domElement),c(e))){let r=t.metaType;if("textMeta"===r||"commentMeta"===r){const e=t.getPath();for(let r=e.length-1;r>=0;r--)if("textMeta"!==e[r].metaType&&"commentMeta"!==e[r].metaType){t=e[r];break}}if(c(e)&&e.instance?.isObject3D&&c(t)&&t.instance?.isObject3D&&t.instance?.add?.(e.instance),e?.props?.attach&&c(t)&&t?.instance){e.type?.toLowerCase().endsWith("loader")&&e.props.src&&(e.props.attach||e.props.attachArray)?function(e,t){const r=e.instance;if(t.attached=t.attached||{},t.attachedArray=t.attachedArray||{},!e.props.attach)return;if("textureloader"===e.type?.toLowerCase()){const n=r.load(e.props.src);ve(e,t,e.props.attach,n)}else r.load(e.props.src,(r=>{ve(e,t,e.props.attach,r)}),null,(e=>{throw new Error(e)}))}(e,t):ve(e,t,e.props.attach)}e.props?.onAdded&&e.props.onAdded({instance:e.instance})}};function ve(e,t,r,n){const o=n??e.instance,a=t.instance;e.props.attach===r&&(t.attached={[r]:o,...t.attached||{}},a[r]=n??e.instance),e.props.attachArray===r&&(t.attachedArray[e.props.attachArray]||(t.attachedArray[e.props.attachArray]=[]),t.attachedArray[e.props.attachArray].push(o),a[r]=[a[r]])}const xe=e=>{if(!e)return;const t=[];e.walk((e=>(t.push(e),!0))),t.forEach((e=>{if(c(e)){e.instance?.removeFromParent?.();const t="scene"!==e.type&&e.instance?.dispose;t&&t.bind(e.instance)(),e.instance=null}e.drop()}))},Re=G,we=()=>G(),Pe=T,Ce=()=>T(),Ae=k;const Ee=()=>({setCustomRender:t.inject(y),clearCustomRender:t.inject(b)}),Ne=()=>t.inject(h),Le=()=>t.inject(f),Me=()=>t.inject(N),Se=()=>t.inject(j),Be=()=>t.inject(B);e.addEventListener=O,e.afterRenderKey=R,e.appCameraKey=S,e.appKey=N,e.appRenderersKey=L,e.appRootNodeKey=E,e.appSceneKey=M,e.beforeRenderKey=g,e.camera=Re,e.cancelUpdate=de,e.cancelUpdateSource=ue,e.clearCustomRender=()=>{Ee()?.clearCustomRender?.()},e.clearCustomRenderKey=b,e.createApp=r=>{const{nodeOps:n,interactables:o}=(()=>{const e=t.ref([]);return{nodeOps:{createElement:be,createText:e=>p({text:e}),createComment:e=>l({text:e}),insert:ge,nextSibling:e=>e.nextSibling||null,parentNode:e=>e.parentNode||null,patchProp(t,r,n,o){s(t)?"style"===r?Object.keys(o).forEach((e=>{t.domElement.style[e]=o[e]})):t.domElement.setAttribute(r,o):d(t)||r.startsWith("$")||pe({node:t,key:r,interactables:e,value:o})},remove:xe,setElementText(){},setText(){}},interactables:e}})(),a=t.createRenderer(n).createApp(r);a.provide(B,o),Object.keys(H).forEach((e=>{a?.component(e,H[e])})),a.provide(y,(e=>{a.setCustomRender(e)})),a.provide(b,(()=>{a.clearCustomRender()}));const i=[];a.provide(g,i),a.provide(v,((e,t=1/0)=>{t===1/0?i.push(e):i.splice(t,0,e)})),a.provide(x,(e=>{if(isFinite(e))i.splice(e,1);else{const t=i.findIndex((t=>t==e));-1!==t&&i.splice(t,1)}}));const c=[];a.provide(R,c),a.provide(w,((e,t=1/0)=>{t===1/0?c.push(e):c.splice(t,0,e)})),a.provide(P,(e=>{if(isFinite(e))c.splice(e,1);else{const t=c.findIndex((t=>t==e));-1!==t&&c.splice(t,1)}})),a.config.globalProperties.lunchbox=t.reactive({afterRender:c,beforeRender:i,camera:null,dpr:1,frameId:-1,renderer:null,scene:null,watchStopHandle:null}),a.provide(h,a.config.globalProperties.lunchbox),a.provide(f,(e=>{Object.keys(e).forEach((t=>{const r=t;a.config.globalProperties.lunchbox[r]=e[r]}))})),a.provide(C,a.config.globalProperties.lunchbox.frameId),a.provide(A,a.config.globalProperties.lunchbox.watchStopHandle);const{mount:u}=a;a.mount=(t,...r)=>{const n="string"==typeof t?document.querySelector(t):t,o=new e.MiniDom.RendererRootNode({domElement:n,isLunchboxRootNode:!0,name:"root",metaType:"rootMeta",type:"root",uuid:"LUNCHBOX_ROOT"});a.rootNode=o,a.provide(E,o);return u(o,...r)},a.extend=e=>(q({app:a,...e}),a);return a.provide(j,[]),a.setCustomRender=e=>{a&&(a.customRender=e)},a.clearCustomRender=()=>{a&&(a.customRender=null)},a.provide(N,a),a.provide(L,t.computed((()=>a.config.globalProperties.lunchbox.renderer))),a.provide(M,t.computed((()=>a.config.globalProperties.lunchbox.scene))),a.provide(S,t.computed((()=>a.config.globalProperties.lunchbox.camera))),a},e.createCommentNode=l,e.createDomNode=u,e.createNode=m,e.createTextNode=p,e.ensureRenderer=T,e.ensuredCamera=G,e.ensuredScene=k,e.extend=q,e.find=function(e){return e=t.isRef(e)?e.value:e,c(e)?e?.instance:i(e)?e?.$el?.instance:t.isVNode(e)?e.el?.instance:null},e.frameIdKey=C,e.globalsInjectionKey=h,e.instantiateThreeObject=_,e.isMinidomNode=function(e){return"RendererNode"===e?.minidomType},e.lunchboxInteractables=B,e.nestedPropertiesToCheck=he,e.offAfterRender=e=>{ae().offBeforeRender?.(e)},e.offAfterRenderKey=P,e.offBeforeRender=se,e.offBeforeRenderKey=x,e.onAfterRender=(e,t=1/0)=>{ae().onBeforeRender?.(e,t)},e.onAfterRenderKey=w,e.onBeforeRender=ie,e.onBeforeRenderKey=v,e.onStart=(e,t=1/0)=>{const r=Se();t===1/0?r?.push(e):r?.splice(t,0,e)},e.renderer=Pe,e.scene=Ae,e.setCustomRender=e=>{Ee()?.setCustomRender?.(e)},e.setCustomRenderKey=y,e.startCallbackKey=j,e.update=oe,e.updateGlobals=e=>{Le()?.(e)},e.updateGlobalsInjectionKey=f,e.updateObjectProp=pe,e.useAfterRender=()=>({onAfterRender:t.inject(v),offAfterRender:t.inject(x)}),e.useApp=Me,e.useBeforeRender=ae,e.useCamera=we,e.useCancelUpdate=ce,e.useCancelUpdateSource=le,e.useCustomRender=Ee,e.useGlobals=Ne,e.useLunchboxInteractables=Be,e.useRenderer=Ce,e.useRootNode=()=>t.inject(E),e.useScene=function(e){return t.watch(Ae,(t=>{t&&e(t.value)}),{immediate:!0})},e.useStartCallbacks=Se,e.useUpdateGlobals=Le,e.watchStopHandleKey=A,Object.defineProperty(e,"__esModule",{value:!0})}));
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("three"),require("lodash")):"function"==typeof define&&define.amd?define(["exports","vue","three","lodash"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Lunchbox={},e.vue,e.three,e.lodash)}(this,(function(e,t,r,n){"use strict";function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=o(r);const i=e=>e?.$el&&e?.$el?.hasOwnProperty?.("instance"),s=e=>"domMeta"===e?.metaType||e?.props?.["data-lunchbox"],c=e=>"standardMeta"===e?.metaType,d=e=>e.isLunchboxRootNode;function l(t={}){const r={text:t.text??""};return new e.MiniDom.RendererCommentNode({...r,...t,metaType:"commentMeta"})}function u(t={}){const r={domElement:document.createElement(t.type??"")};return new e.MiniDom.RendererDomNode({...r,...t,metaType:"domMeta"})}function p(t={}){const r={text:t.text??""};return new e.MiniDom.RendererTextNode({...t,...r,metaType:"textMeta"})}function m(t={},r={}){const n={attached:t.attached??[],attachedArray:t.attachedArray??{},instance:t.instance??null},o=new e.MiniDom.RendererStandardNode({...t,...n,metaType:"standardMeta"});return!o.type||d(o)||o.instance||(o.instance=E({...o,props:{...o.props,...r}})),o}function h({node:e,key:t,interactables:r,value:n}){return e.eventListeners[t]||(e.eventListeners[t]=[]),e.eventListenerRemoveFunctions[t]||(e.eventListenerRemoveFunctions[t]=[]),e.eventListeners[t].push(n),f.includes(t)&&e.instance&&!r.value.includes(e)&&(r.value.push(e),e.eventListenerRemoveFunctions[t].push((()=>{const t=r.value.indexOf(e);-1!==t&&r.value.splice(t,1)}))),e}const f=["onClick","onPointerUp","onPointerDown","onPointerOver","onPointerOut","onPointerEnter","onPointerLeave","onPointerMove"],y=(e,r,n,o,a)=>{if(!r?.domElement||!n||!e)return;const i=(o=o??window.innerWidth)/(a=a??window.innerHeight);if("perspectivecamera"===e.type?.toLowerCase()){const t=e;t.aspect=i,t.updateProjectionMatrix()}else if("orthographiccamera"===e.type?.toLowerCase()){const t=e,r=a/o;t.top=10*r,t.bottom=10*-r,t.right=10,t.left=-10,t.updateProjectionMatrix()}r.setSize(o,a),n&&e&&r.render(t.toRaw(n),t.toRaw(e))},b=(e,t,r,n,o)=>{const a=e.value?.domElement;if(!a)throw new Error("missing container");const i=()=>{if("container"===o){const e=(e=>{const t=getComputedStyle(e);return{width:e.clientWidth-parseFloat(t.paddingLeft)-parseFloat(t.paddingRight),height:e.clientHeight-parseFloat(t.paddingTop)-parseFloat(t.paddingBottom)}})(a);y(t,r,n,e.width,e.height)}else y(t,r,n)};i();let s=new ResizeObserver((()=>{i()}));return a&&s.observe(a),{dispose(){a&&s.unobserve(a)}}},g=t.defineComponent({name:"LunchboxScene",setup:(e,{slots:r})=>()=>t.createVNode(t.resolveComponent("scene"),null,{default:()=>[r.default?.()]})}),v=t.defineComponent({name:"LunchboxEventHandlers",setup(){const e=Le(),r=Pe(),n=t.ref({x:1/0,y:1/0}),o=t.ref(!1);let i=[];const s=new a.Raycaster(new a.Vector3,new a.Vector3(0,0,-1)),c=({element:e,eventKeys:t,intersection:r})=>{e&&t.forEach((t=>{e.eventListeners[t]&&e.eventListeners[t].forEach((e=>{e({intersection:r})}))}))};xe((e=>{if(!e?.domElement)return;const{domElement:t}=e;t.addEventListener("pointermove",(e=>{const o=(t.width??1)/r.dpr,a=(t.height??1)/r.dpr;n.value.x=e.offsetX/o*2-1,n.value.y=-e.offsetY/a*2+1})),t.addEventListener("pointerdown",(()=>o.value=!0)),t.addEventListener("pointerup",(()=>o.value=!1))}));const d=ge(),l=()=>{const t=d.value;if(!t)return;s.setFromCamera(n.value,t);const r=s.intersectObjects(e?.value.map((e=>e.instance))??[]);let o=[],a=[],l=[];o=i.map((e=>e.intersection)),r?.forEach((t=>{if(-1===i.findIndex((e=>e.intersection.object===t.object))){const r=e?.value.find((e=>e.instance?.uuid===t.object.uuid));r&&a.push({element:r,intersection:t})}else{const r=e?.value.find((e=>e.instance?.uuid===t.object.uuid));r&&l.push({element:r,intersection:t})}const r=o.findIndex((e=>e.object.uuid===t.object.uuid));-1!==r&&o.splice(r,1)}));const u=o.map((t=>({element:e?.value.find((e=>e.instance?.uuid===t.object.uuid)),intersection:t})));a.forEach((({element:e,intersection:t})=>{c({element:e,eventKeys:["onPointerEnter"],intersection:t})})),l.forEach((({element:e,intersection:t})=>{c({element:e,eventKeys:["onPointerOver","onPointerMove"],intersection:t})})),u.forEach((({element:e,intersection:t})=>{c({element:e,eventKeys:["onPointerLeave","onPointerOut"],intersection:t})})),i=[].concat(a,l)};ne(l);t.onBeforeUnmount((()=>oe(l)));const u=["onClick","onPointerDown","onPointerUp"];return t.watch(o,(e=>{l();const t=[];i.forEach((r=>{u.forEach((n=>{const o=r.element.uuid+n;!e||"onClick"!==n&&"onPointerDown"!==n?e||"onPointerUp"!==n||t.includes(o)||(r.element.eventListeners[n]?.forEach((e=>e({intersection:r.intersection}))),t.push(o)):t.includes(o)||(r.element.eventListeners[n]?.forEach((e=>e({intersection:r.intersection}))),t.push(o))}))}))})),()=>t.createVNode(t.resolveComponent("object3D"),null,null)}}),x=e=>({position:e,top:0,right:0,bottom:0,left:0,width:"100%",height:"100%",display:"block"}),R=t.defineComponent({name:"Lunchbox",props:{background:String,cameraArgs:Array,cameraLook:Array,cameraLookAt:Array,cameraPosition:Array,dpr:Number,ortho:Boolean,orthographic:Boolean,r3f:Boolean,rendererArguments:Object,rendererProperties:Object,sizePolicy:String,shadow:[Boolean,Object],transparent:Boolean,zoom:Number,updateSource:Object},setup(e,r){const n=t.ref();let o=e.dpr??-1;const i=t.ref(),s=t.ref(),c=t.ref(),d=t.ref(),l=Pe(),u=Ce(),p=Ae(),m=t.reactive({}),h=Ee();e.r3f&&a?.ColorManagement&&(a.ColorManagement.legacyMode=!1);const f=Le();t.onMounted((async()=>{if(!n.value&&!r.slots?.renderer?.()?.length)throw new Error("missing canvas");for(r.slots?.camera?.()?.length||(e.cameraPosition&&(m.position=e.cameraPosition),(e.cameraLook||e.cameraLookAt)&&(m.lookAt=e.cameraLook||e.cameraLookAt),void 0!==e.zoom&&(m.zoom=e.zoom)),d.value?.$el?.instance&&e.background&&(d.value.$el.instance.background=new a.Color(e.background)),-1===o&&(o=window.devicePixelRatio),u?.({dpr:o});!s.value?.$el?.instance&&!s.value?.component?.ctx.$el?.instance;)await new Promise((e=>requestAnimationFrame(e)));for(;!d.value?.$el?.instance&&!d.value?.component?.ctx.$el?.instance;)await new Promise((e=>requestAnimationFrame(e)));const t=s.value?.$el?.instance??s.value?.component?.ctx.$el?.instance;t.setPixelRatio(l.dpr);const f=d.value?.$el?.instance??d.value?.component?.ctx.$el?.instance,y=c.value?.$el?.instance??c.value?.component?.ctx.$el?.instance;if(!r.slots?.renderer?.()?.length){b(i,y,t,f,e.sizePolicy),e.r3f&&(t.outputEncoding=a.sRGBEncoding,t.toneMapping=a.ACESFilmicToneMapping);const r={shadow:e.shadow};r?.shadow&&(t.shadowMap.enabled=!0,"object"==typeof r.shadow&&(t.shadowMap.type=r.shadow.type))}if(!p)throw new Error("error creating app");p.config.globalProperties.lunchbox.camera=y,p.config.globalProperties.lunchbox.renderer=t,p.config.globalProperties.lunchbox.scene=f;for(let e of h??[])e({app:p,camera:y,renderer:t,scene:f});te({app:p,camera:y,renderer:t,scene:f,updateSource:e.updateSource})})),t.onBeforeUnmount((()=>{ie(),ce()}));const y="container"===e.sizePolicy?"static":"absolute",R="container"===e.sizePolicy?"static":"fixed",w=t.computed((()=>{const e=r.slots?.camera?.().find((e=>e.type?.name));return e||e}));return t.watch(w,(async(e,t)=>{e&&e?.props?.key!==t?.props?.key&&(c.value=e)}),{immediate:!0}),()=>t.createVNode(t.Fragment,null,[r.slots?.renderer?.()?.length?s.value=r.slots?.renderer?.()[0]:t.createVNode(t.Fragment,null,[t.createVNode("div",{class:"lunchbox-container",style:x(y),ref:i,"data-lunchbox":"true"},[t.createVNode("canvas",{ref:n,class:"lunchbox-canvas",style:x(R),"data-lunchbox":"true"},null)]),n.value?.domElement&&t.createVNode(t.resolveComponent("webGLRenderer"),t.mergeProps(e.rendererProperties??{},{ref:s,args:[{alpha:e.transparent,antialias:!0,canvas:n.value?.domElement,powerPreference:e.r3f?"high-performance":"default",...e.rendererArguments??{}}]}),null)]),r.slots?.scene?.()?.length?d.value=r.slots?.scene?.()[0]:t.createVNode(g,{ref:d},{default:()=>[r.slots?.default?.()]}),r.slots?.camera?.()?.length?c.value:e.ortho||e.orthographic?t.createVNode(t.resolveComponent("orthographicCamera"),t.mergeProps({ref:c,args:e.cameraArgs??[]},m),null):t.createVNode(t.resolveComponent("perspectiveCamera"),t.mergeProps({ref:c,args:e.cameraArgs??[e.r3f?75:45,.5625,1,1e3]},m),null),f?.value.length&&t.createVNode(v,null,null)])}}),w={},P={...["mesh","instancedMesh","scene","sprite","object3D","instancedBufferGeometry","bufferGeometry","boxBufferGeometry","circleBufferGeometry","coneBufferGeometry","cylinderBufferGeometry","dodecahedronBufferGeometry","extrudeBufferGeometry","icosahedronBufferGeometry","latheBufferGeometry","octahedronBufferGeometry","parametricBufferGeometry","planeBufferGeometry","polyhedronBufferGeometry","ringBufferGeometry","shapeBufferGeometry","sphereBufferGeometry","tetrahedronBufferGeometry","textBufferGeometry","torusBufferGeometry","torusKnotBufferGeometry","tubeBufferGeometry","wireframeGeometry","parametricGeometry","tetrahedronGeometry","octahedronGeometry","icosahedronGeometry","dodecahedronGeometry","polyhedronGeometry","tubeGeometry","torusKnotGeometry","torusGeometry","sphereGeometry","ringGeometry","planeGeometry","latheGeometry","shapeGeometry","extrudeGeometry","edgesGeometry","coneGeometry","cylinderGeometry","circleGeometry","boxGeometry","material","shadowMaterial","spriteMaterial","rawShaderMaterial","shaderMaterial","pointsMaterial","meshPhysicalMaterial","meshStandardMaterial","meshPhongMaterial","meshToonMaterial","meshNormalMaterial","meshLambertMaterial","meshDepthMaterial","meshDistanceMaterial","meshBasicMaterial","meshMatcapMaterial","lineDashedMaterial","lineBasicMaterial","light","spotLightShadow","spotLight","pointLight","rectAreaLight","hemisphereLight","directionalLightShadow","directionalLight","ambientLight","lightShadow","ambientLightProbe","hemisphereLightProbe","lightProbe","texture","videoTexture","dataTexture","dataTexture3D","compressedTexture","cubeTexture","canvasTexture","depthTexture","textureLoader","group","catmullRomCurve3","points","raycaster","cameraHelper","camera","perspectiveCamera","orthographicCamera","cubeCamera","arrayCamera","webGLRenderer"].map((e=>t.defineComponent({inheritAttrs:!1,name:e,setup:(r,n)=>()=>t.h(e,n.attrs,n.slots?.default?.()||[])}))).reduce(((e,t)=>(e[t.name]=t,e)),{}),Lunchbox:R},C=e=>t.defineComponent({inheritAttrs:!1,name:e,render(){return t.h(e,this.$attrs,this.$slots?.default?.()||[])}}),A=({app:e,...t})=>{Object.keys(t).forEach((r=>{e.component(r,C(r)),w[r]=t[r]}))};function E(e){if(!e.type)return null;const t=e.type[0].toUpperCase()+e.type.slice(1),r=t.replace(/Lunchbox$/,""),n=w[e.type]||a[t]||w[r]||a[r];if(!n)throw`${t} is not part of the THREE namespace! Did you forget to extend? import {extend} from 'lunchbox'; extend({app, YourComponent, ...})`;const o=(e.props.args??[]).map((t=>function({node:e,prop:t}){const r="string"==typeof t&&t.startsWith("$attachedArray"),n=function({node:e,prop:t}){return"string"==typeof t&&t.startsWith("$attachedArray")?e.attachedArray[t.replace("$attachedArray.","")]:"string"==typeof t&&t.startsWith("$attached")?e.attached[t.replace("$attached.","")]:t}({node:e,prop:t});return Array.isArray(n)&&r?n:[n]}({node:e,prop:t})));let i=[];o.forEach((e=>{i=i.concat(e)}));return new n(...i)}var L,N=new Uint8Array(16);function M(){if(!L&&!(L="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||"undefined"!=typeof msCrypto&&"function"==typeof msCrypto.getRandomValues&&msCrypto.getRandomValues.bind(msCrypto)))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return L(N)}var S=/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;function B(e){return"string"==typeof e&&S.test(e)}for(var j=[],G=0;G<256;++G)j.push((G+256).toString(16).substr(1));function T(e,t,r){var n=(e=e||{}).random||(e.rng||M)();if(n[6]=15&n[6]|64,n[8]=63&n[8]|128,t){r=r||0;for(var o=0;o<16;++o)t[r+o]=n[o];return t}return function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,r=(j[e[t+0]]+j[e[t+1]]+j[e[t+2]]+j[e[t+3]]+"-"+j[e[t+4]]+j[e[t+5]]+"-"+j[e[t+6]]+j[e[t+7]]+"-"+j[e[t+8]]+j[e[t+9]]+"-"+j[e[t+10]]+j[e[t+11]]+j[e[t+12]]+j[e[t+13]]+j[e[t+14]]+j[e[t+15]]).toLowerCase();if(!B(r))throw TypeError("Stringified UUID is invalid");return r}(n)}e.MiniDom=void 0,function(e){e.BaseNode=class{constructor(e={},t){this.parentNode=e?.parentNode??t??null,this.minidomType="MinidomBaseNode",this.uuid=e?.uuid??T()}uuid;parentNode;get nextSibling(){if(!this.parentNode)return null;const e=this.parentNode.children.findIndex((e=>e.uuid===this.uuid));return-1!==e&&e<this.parentNode.children.length-1?this.parentNode.children[e+1]:null}insertBefore(e,t){e.removeAsChildFromAnyParents(),e.parentNode=this;const r=this.children.findIndex((e=>e.uuid===t?.uuid));-1!==r?this.children.splice(r,0,e):this.children.push(e)}removeChild(e){const t=this.children.findIndex((t=>t?.uuid===e?.uuid));-1!==t&&this.children.splice(t,1)}children=[];addChild(e){return e&&(e.removeAsChildFromAnyParents(),e.parentNode=this,this.insertBefore(e,null)),this}getPath(){const e=[];let t=this;for(;t;)e.unshift(t),t=t.parentNode;return e}drop(){this.removeAsChildFromAnyParents(),this.parentNode=null}walk(e){const t=[this,...this.children],r=[];let n=!0;for(;t.length&&n;){const o=t.shift();if(o){if(r.includes(o))continue;r.push(o),t.push(...o.children.filter((e=>!r.includes(e)))),n=e(o)}else n=!1}}minidomType;removeAsChildFromAnyParents(){this.parentNode?.removeChild(this)}};class t extends e.BaseNode{constructor(e={},t){super(e,t),this.minidomType="RendererNode",this.eventListeners={},this.eventListenerRemoveFunctions={},this.name=e.name??"",this.metaType=e.metaType??"standardMeta",this.props=e.props??[],this.type=e.type??""}eventListeners;eventListenerRemoveFunctions;name;metaType;props;type;drop(){super.drop(),Object.keys(this.eventListenerRemoveFunctions).forEach((e=>{this.eventListenerRemoveFunctions[e].forEach((e=>e()))}))}}e.RendererBaseNode=t;class r extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.domElement=e.domElement??document.createElement("div")}domElement;isLunchboxRootNode=!0}e.RendererRootNode=r;class n extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.text=e.text??""}text}e.RendererCommentNode=n;class o extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.domElement=e.domElement??document.createElement("div")}domElement}e.RendererDomNode=o;class a extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.text=e.text??""}text}e.RendererTextNode=a;class i extends e.RendererBaseNode{constructor(e={},t){super(e,t),this.attached=e.attached??[],this.attachedArray=e.attachedArray??{},this.instance=e.instance??null}attached;attachedArray;instance}e.RendererStandardNode=i}(e.MiniDom||(e.MiniDom={}));const k=Symbol(),O=Symbol(),$=Symbol(),D=Symbol(),F=Symbol(),K=Symbol(),V=Symbol(),I=Symbol(),U=Symbol(),z=Symbol(),H=Symbol(),W=Symbol(),q=Symbol(),_=Symbol(),X=Symbol(),Y=Symbol(),J=Symbol(),Q=Symbol(),Z=Symbol(),ee=e=>{"number"==typeof e.app.config.globalProperties.lunchbox.frameId&&cancelAnimationFrame(e.app.config.globalProperties.lunchbox.frameId),e.app.config.globalProperties.lunchbox.frameId=requestAnimationFrame((()=>te({app:e.app,renderer:e.renderer,scene:e.scene,camera:e.camera,updateSource:e.updateSource})))},te=e=>{e.updateSource?e.app.config.globalProperties.lunchbox.watchStopHandle||(e.app.config.globalProperties.lunchbox.watchStopHandle=t.watch(e.updateSource,(()=>{ee(e)}),{deep:!0})):ee(e);const{app:r,renderer:n,scene:o}=e;r.config.globalProperties.lunchbox.beforeRender.forEach((t=>{t?.(e)})),n&&o&&e.app.config.globalProperties.lunchbox.camera&&(r.customRender?r.customRender(e):n.render(t.toRaw(o),e.app.config.globalProperties.lunchbox.camera)),r.config.globalProperties.lunchbox.afterRender.forEach((t=>{t?.(e)}))},re=()=>({onBeforeRender:t.inject(K),offBeforeRender:t.inject(V)}),ne=(e,t=1/0)=>{re().onBeforeRender?.(e,t)},oe=e=>{re().offBeforeRender?.(e)},ae=()=>{const e=t.inject(H);return()=>{void 0!==e&&cancelAnimationFrame(e)}},ie=()=>{ae()?.()},se=()=>{const e=t.inject(W);return()=>e?.()},ce=()=>{se()?.()};function de({node:e,key:t,interactables:r,value:o}){if((e=>["onClick","onContextMenu","onDoubleClick","onPointerUp","onPointerDown","onPointerOver","onPointerOut","onPointerEnter","onPointerLeave","onPointerMove","onWheel"].includes(e))(t))return h({node:e,key:t,interactables:r,value:o});const a=t.replace(/-/g,"."),i=le[a]||a;if(pe.includes(t)||pe.includes(i))return e;if(!c(e))return e;if("string"==typeof o&&o.startsWith("$attached")){const t=o.replace("$attached.","");o=n.get(e.attached,t,null)}const s=e.instance;if(!s)return e;let d;for(let e=0;e<ue.length&&!d;e++){const t=[ue[e],i].filter(Boolean).join(".");d=d=n.get(s,t)}if(d&&n.isNumber(o)&&d.setScalar)d.setScalar(o);else if(d&&d.set){const e=Array.isArray(o)?o:[o];s[i].set(...e)}else if("function"==typeof d)if("onbeforerender"===i.toLowerCase()||"onafterrender"===i.toLowerCase())s[i]=o;else{if(!Array.isArray(o))throw new Error('Arguments on a declarative method must be wrapped in an array.\nWorks:\n<example :methodCall="[256]" />\nDoesn\'t work:\n<example :methodCall="256" />');d.bind(e.instance)(...o)}else void 0!==n.get(s,i,void 0)?n.set(s,i,""===o||o):console.log(`No property ${i} found on ${s}`);const l=s?.texture?.type||s?.type;if("string"==typeof l){const e=l.toLowerCase();switch(!0){case e.includes("material"):s.needsUpdate=!0;break;case e.includes("camera")&&s.updateProjectionMatrix:s.updateProjectionMatrix()}}return e}const le={x:"position.x",y:"position.y",z:"position.z"},ue=["","parameters"],pe=["args","attach","attachArray","is.default","isDefault","key","onAdded","ref","src"],me=["geometry","material"],he=(e,t,r,n)=>{const o={type:e,props:n};if(s(o)){return u(o)}const a=m(o);return me.forEach((t=>{e.toLowerCase().endsWith(t)&&(a.props.attach=t)})),a},fe=(e,t,r)=>{if(!t)throw new Error("missing parent");if(t.insertBefore(e,r),"commentMeta"!==e.metaType&&"textMeta"!==e.metaType&&(s(e)&&(s(t)||d(t))&&t.domElement.appendChild(e.domElement),c(e))){let r=t.metaType;if("textMeta"===r||"commentMeta"===r){const e=t.getPath();for(let r=e.length-1;r>=0;r--)if("textMeta"!==e[r].metaType&&"commentMeta"!==e[r].metaType){t=e[r];break}}if(c(e)&&e.instance?.isObject3D&&c(t)&&t.instance?.isObject3D&&t.instance?.add?.(e.instance),e?.props?.attach&&c(t)&&t?.instance){e.type?.toLowerCase().endsWith("loader")&&e.props.src&&(e.props.attach||e.props.attachArray)?function(e,t){const r=e.instance;if(t.attached=t.attached||{},t.attachedArray=t.attachedArray||{},!e.props.attach)return;if("textureloader"===e.type?.toLowerCase()){const n=r.load(e.props.src);ye(e,t,e.props.attach,n)}else r.load(e.props.src,(r=>{ye(e,t,e.props.attach,r)}),null,(e=>{throw new Error(e)}))}(e,t):ye(e,t,e.props.attach)}e.props?.onAdded&&e.props.onAdded({instance:e.instance})}};function ye(e,t,r,n){const o=n??e.instance,a=t.instance;e.props.attach===r&&(t.attached={[r]:o,...t.attached||{}},a[r]=n??e.instance),e.props.attachArray===r&&(t.attachedArray[e.props.attachArray]||(t.attachedArray[e.props.attachArray]=[]),t.attachedArray[e.props.attachArray].push(o),a[r]=[a[r]])}const be=e=>{if(!e)return;const t=[];e.walk((e=>(t.push(e),!0))),t.forEach((e=>{if(c(e)){e.instance?.removeFromParent?.();const t="scene"!==e.type&&e.instance?.dispose;t&&t.bind(e.instance)(),e.instance=null}e.drop()}))},ge=()=>t.inject(J),ve=()=>t.inject(X),xe=e=>{const r=t.watch(ve(),(t=>{t&&(e(t),r())}),{immediate:!0})},Re=()=>t.inject(Y),we=()=>({setCustomRender:t.inject($),clearCustomRender:t.inject(D)}),Pe=()=>t.inject(k),Ce=()=>t.inject(O),Ae=()=>t.inject(_),Ee=()=>t.inject(Z),Le=()=>t.inject(Q);e.addEventListener=h,e.afterRenderKey=I,e.appCameraKey=J,e.appKey=_,e.appRenderersKey=X,e.appRootNodeKey=q,e.appSceneKey=Y,e.beforeRenderKey=F,e.cancelUpdate=ie,e.cancelUpdateSource=ce,e.clearCustomRender=()=>{we()?.clearCustomRender?.()},e.clearCustomRenderKey=D,e.createApp=r=>{const{nodeOps:n,interactables:o}=(()=>{const e=t.ref([]);return{nodeOps:{createElement:he,createText:e=>p({text:e}),createComment:e=>l({text:e}),insert:fe,nextSibling:e=>e.nextSibling||null,parentNode:e=>e.parentNode||null,patchProp(t,r,n,o){s(t)?"style"===r?Object.keys(o).forEach((e=>{t.domElement.style[e]=o[e]})):t.domElement.setAttribute(r,o):d(t)||r.startsWith("$")||de({node:t,key:r,interactables:e,value:o})},remove:be,setElementText(){},setText(){}},interactables:e}})(),a=t.createRenderer(n).createApp(r);a.provide(Q,o),Object.keys(P).forEach((e=>{a?.component(e,P[e])})),a.provide($,(e=>{a.setCustomRender(e)})),a.provide(D,(()=>{a.clearCustomRender()}));const i=[];a.provide(F,i),a.provide(K,((e,t=1/0)=>{t===1/0?i.push(e):i.splice(t,0,e)})),a.provide(V,(e=>{if(isFinite(e))i.splice(e,1);else{const t=i.findIndex((t=>t==e));-1!==t&&i.splice(t,1)}}));const c=[];a.provide(I,c),a.provide(U,((e,t=1/0)=>{t===1/0?c.push(e):c.splice(t,0,e)})),a.provide(z,(e=>{if(isFinite(e))c.splice(e,1);else{const t=c.findIndex((t=>t==e));-1!==t&&c.splice(t,1)}})),a.config.globalProperties.lunchbox=t.reactive({afterRender:c,beforeRender:i,camera:null,dpr:1,frameId:-1,renderer:null,scene:null,watchStopHandle:null}),a.provide(k,a.config.globalProperties.lunchbox),a.provide(O,(e=>{Object.keys(e).forEach((t=>{const r=t;a.config.globalProperties.lunchbox[r]=e[r]}))})),a.provide(H,a.config.globalProperties.lunchbox.frameId),a.provide(W,a.config.globalProperties.lunchbox.watchStopHandle);const{mount:u}=a;a.mount=(t,...r)=>{const n="string"==typeof t?document.querySelector(t):t,o=new e.MiniDom.RendererRootNode({domElement:n,isLunchboxRootNode:!0,name:"root",metaType:"rootMeta",type:"root",uuid:"LUNCHBOX_ROOT"});a.rootNode=o,a.provide(q,o);return u(o,...r)},a.extend=e=>(A({app:a,...e}),a);return a.provide(Z,[]),a.setCustomRender=e=>{a&&(a.customRender=e)},a.clearCustomRender=()=>{a&&(a.customRender=null)},a.provide(_,a),a.provide(X,t.computed((()=>a.config.globalProperties.lunchbox.renderer))),a.provide(Y,t.computed((()=>a.config.globalProperties.lunchbox.scene))),a.provide(J,t.computed((()=>a.config.globalProperties.lunchbox.camera))),a},e.createCommentNode=l,e.createDomNode=u,e.createNode=m,e.createTextNode=p,e.extend=A,e.find=function(e){return e=t.isRef(e)?e.value:e,c(e)?e?.instance:i(e)?e?.$el?.instance:t.isVNode(e)?e.el?.instance:null},e.frameIdKey=H,e.globalsInjectionKey=k,e.instantiateThreeObject=E,e.isMinidomNode=function(e){return"RendererNode"===e?.minidomType},e.lunchboxInteractables=Q,e.nestedPropertiesToCheck=ue,e.offAfterRender=e=>{re().offBeforeRender?.(e)},e.offAfterRenderKey=z,e.offBeforeRender=oe,e.offBeforeRenderKey=V,e.onAfterRender=(e,t=1/0)=>{re().onBeforeRender?.(e,t)},e.onAfterRenderKey=U,e.onBeforeRender=ne,e.onBeforeRenderKey=K,e.onCameraReady=e=>{const r=t.watch(ge(),(t=>{t&&(e(t),r())}),{immediate:!0})},e.onRendererReady=xe,e.onSceneReady=e=>{const r=t.watch(Re(),(t=>{t&&(e(t),r())}),{immediate:!0})},e.onStart=(e,t=1/0)=>{const r=Ee();t===1/0?r?.push(e):r?.splice(t,0,e)},e.setCustomRender=e=>{we()?.setCustomRender?.(e)},e.setCustomRenderKey=$,e.startCallbackKey=Z,e.update=te,e.updateGlobals=e=>{Ce()?.(e)},e.updateGlobalsInjectionKey=O,e.updateObjectProp=de,e.useAfterRender=()=>({onAfterRender:t.inject(K),offAfterRender:t.inject(V)}),e.useApp=Ae,e.useBeforeRender=re,e.useCamera=ge,e.useCancelUpdate=ae,e.useCancelUpdateSource=se,e.useCustomRender=we,e.useGlobals=Pe,e.useLunchboxInteractables=Le,e.useRenderer=ve,e.useScene=Re,e.useStartCallbacks=Ee,e.useUpdateGlobals=Ce,e.watchStopHandleKey=W,Object.defineProperty(e,"__esModule",{value:!0})}));
|