belowjs 1.0.0-rc.2 → 1.0.0-rc.3
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/CHANGELOG.md +22 -0
- package/LICENSE +18 -15
- package/README.md +6 -4
- package/dist/belowjs.css +1 -1
- package/dist/belowjs.js +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,28 @@ All notable changes to BelowJS will be documented in this file.
|
|
|
5
5
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
6
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
7
|
|
|
8
|
+
## [1.0.0-rc.3] - 2025-08-14 - Release Candidate
|
|
9
|
+
|
|
10
|
+
### Fixed
|
|
11
|
+
- Loading spinner percentage now clamped to maximum 100%
|
|
12
|
+
- Loading spinner display issues in light mode
|
|
13
|
+
- Fixed wrecksploration.com reference to correct wrecksploration.au domain
|
|
14
|
+
|
|
15
|
+
### Improved
|
|
16
|
+
- Example documentation clarity and structure
|
|
17
|
+
|
|
18
|
+
## [1.0.0-rc.2] - 2025-08-12 - Release Candidate
|
|
19
|
+
|
|
20
|
+
### Fixed
|
|
21
|
+
- VR locomotion reset bug when switching models
|
|
22
|
+
|
|
23
|
+
### Added
|
|
24
|
+
- VR loading indicator for model changes
|
|
25
|
+
- Complete static documentation site
|
|
26
|
+
|
|
27
|
+
### Improved
|
|
28
|
+
- Audio system robustness
|
|
29
|
+
|
|
8
30
|
## [1.0.0-rc.1] - 2025-08-10 - Release Candidate
|
|
9
31
|
|
|
10
32
|
### Added
|
package/LICENSE
CHANGED
|
@@ -1,18 +1,3 @@
|
|
|
1
|
-
BelowJS - A modular 3D viewer library
|
|
2
|
-
Copyright (C) 2025 Patrick Morrison
|
|
3
|
-
|
|
4
|
-
This program is free software: you can redistribute it and/or modify
|
|
5
|
-
it under the terms of the GNU General Public License as published by
|
|
6
|
-
the Free Software Foundation, either version 3 of the License, or
|
|
7
|
-
(at your option) any later version.
|
|
8
|
-
|
|
9
|
-
This program is distributed in the hope that it will be useful,
|
|
10
|
-
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
11
|
-
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
12
|
-
GNU General Public License for more details.
|
|
13
|
-
|
|
14
|
-
You should have received a copy of the GNU General Public License
|
|
15
|
-
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
16
1
|
GNU GENERAL PUBLIC LICENSE
|
|
17
2
|
Version 3, 29 June 2007
|
|
18
3
|
|
|
@@ -687,3 +672,21 @@ may consider it more useful to permit linking proprietary applications with
|
|
|
687
672
|
the library. If this is what you want to do, use the GNU Lesser General
|
|
688
673
|
Public License instead of this License. But first, please read
|
|
689
674
|
<https://www.gnu.org/licenses/why-not-lgpl.html>.
|
|
675
|
+
|
|
676
|
+
--------------------------------------------------------------------------------
|
|
677
|
+
|
|
678
|
+
BelowJS - A modular 3D viewer library
|
|
679
|
+
Copyright (C) 2025 Patrick Morrison
|
|
680
|
+
|
|
681
|
+
This program is free software: you can redistribute it and/or modify
|
|
682
|
+
it under the terms of the GNU General Public License as published by
|
|
683
|
+
the Free Software Foundation, either version 3 of the License, or
|
|
684
|
+
(at your option) any later version.
|
|
685
|
+
|
|
686
|
+
This program is distributed in the hope that it will be useful,
|
|
687
|
+
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
688
|
+
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
689
|
+
GNU General Public License for more details.
|
|
690
|
+
|
|
691
|
+
You should have received a copy of the GNU General Public License
|
|
692
|
+
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
package/README.md
CHANGED
|
@@ -4,7 +4,9 @@
|
|
|
4
4
|
[](https://www.npmjs.com/package/belowjs)
|
|
5
5
|
[](https://www.gnu.org/licenses/gpl-3.0)
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
📖 **[Full Documentation & Examples at belowjs.com](https://belowjs.com)**
|
|
8
|
+
|
|
9
|
+
> **Note:** This is a pre-release version (`1.0.0-rc.2`). The API is stable, but please be aware that minor changes may occur before the final 1.0.0 release.
|
|
8
10
|
|
|
9
11
|
**Dive Shipwrecks in Virtual Reality**
|
|
10
12
|
|
|
@@ -57,11 +59,11 @@ This gives you a complete VR-ready 3D viewer with dive lighting, measurement too
|
|
|
57
59
|
{
|
|
58
60
|
"imports": {
|
|
59
61
|
"three": "https://cdn.jsdelivr.net/npm/three@0.179.1/+esm",
|
|
60
|
-
"belowjs": "https://cdn.jsdelivr.net/npm/belowjs@1.0.0-rc.
|
|
62
|
+
"belowjs": "https://cdn.jsdelivr.net/npm/belowjs@1.0.0-rc.2/dist/belowjs.js"
|
|
61
63
|
}
|
|
62
64
|
}
|
|
63
65
|
</script>
|
|
64
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/belowjs@1.0.0-rc.
|
|
66
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/belowjs@1.0.0-rc.2/dist/belowjs.css">
|
|
65
67
|
<style>
|
|
66
68
|
body, html { margin: 0; padding: 0; overflow: hidden; }
|
|
67
69
|
</style>
|
|
@@ -214,4 +216,4 @@ GPL-3.0-or-later — See [LICENSE](LICENSE) file.
|
|
|
214
216
|
|
|
215
217
|
Created by [Patrick Morrison](https://padmorrison.com).
|
|
216
218
|
|
|
217
|
-
Built for underwater archaeology. Models courtesy of [WreckSploration](https://wrecksploration.
|
|
219
|
+
Built for underwater archaeology. Models courtesy of [WreckSploration](https://wrecksploration.au).
|
package/dist/belowjs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--below-bg-color: #0a0a0a;--below-text-color: #e8e8e8;--below-accent-color: #64B5F6;--below-panel-bg: rgba(255, 255, 255, .08);--below-panel-border: rgba(255, 255, 255, .12);--below-panel-backdrop: blur(20px);--below-panel-shadow: 0 8px 32px rgba(0, 0, 0, .3), 0 2px 8px rgba(0, 0, 0, .2);--below-font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--below-bg-color);color:var(--below-text-color);font-family:var(--below-font-family)}.below-viewer-container{width:100%;height:100%;position:relative}.below-viewer-container canvas{display:block;width:100%;height:100%}.below-panel{background:var(--below-panel-bg);-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);border:1px solid var(--below-panel-border);border-radius:16px;box-shadow:var(--below-panel-shadow)}.model-selector{position:absolute;top:20px;right:20px;z-index:50;background:var(--below-panel-bg);-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);border:1px solid var(--below-panel-border);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:20px;min-width:220px;box-shadow:var(--below-panel-shadow);transition:all .3s ease}.model-selector:hover{transform:translateY(-2px);box-shadow:0 12px 40px #0006,0 4px 12px #0000004d}.model-selector__dropdown{background:linear-gradient(145deg,#ffffff14,#ffffff0a);color:var(--below-text-color);border:1px solid rgba(255,255,255,.1);padding:16px 20px;font-size:23px;font-weight:500;font-family:inherit;cursor:pointer;outline:none;transition:all .3s ease;min-width:100%;border-radius:12px;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:inset 0 1px 3px #0000001a}.model-selector__dropdown:focus{border-color:var(--below-accent-color);box-shadow:0 0 0 2px #64b5f633,inset 0 1px 3px #0000001a}.model-selector__dropdown:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.model-selector__dropdown:disabled{cursor:not-allowed;opacity:.5}.model-selector__dropdown option{background:#1a1a1a;color:var(--below-text-color);padding:12px;font-size:14px}.loading-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;display:none;flex-direction:column;align-items:center;gap:20px;text-align:center}.loading-spinner{position:relative;display:flex;align-items:center;justify-content:center}.spinner-circle{position:relative;width:64px;height:64px}.spinner-path{position:absolute;top:0;left:0;width:100%;height:100%;border:3px solid rgba(255,255,255,.15);border-top:3px solid #ffffff;border-radius:50%;animation:spinner-rotate 1.5s ease-in-out infinite}.spinner-percentage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);letter-spacing:-.5px}.loading-content{display:flex;flex-direction:column;gap:8px;align-items:center}.loading-model-name{font-size:18px;font-weight:500;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);letter-spacing:.3px}.loading-status{font-size:14px;font-weight:400;color:#ffffffd9;text-shadow:0 1px 2px rgba(0,0,0,.6)}@keyframes spinner-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.status{position:absolute;bottom:20px;right:20px;background:#000000b3;padding:10px 15px;border-radius:8px;font-size:12px;z-index:10}.fullscreen-button{position:absolute;bottom:90px;right:20px;width:36px;height:36px;border-radius:50%;background:var(--below-panel-bg);border:1px solid var(--below-panel-border);color:var(--below-text-color);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:120;-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);box-shadow:0 4px 16px #0003;-webkit-user-select:none;user-select:none;transition:transform .3s ease,box-shadow .3s ease}.fullscreen-button:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.fullscreen-button.light-theme{background:#000c!important;border:1px solid rgba(0,0,0,.2)!important;color:#fffffff2!important;box-shadow:0 2px 12px #00000040!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;top:20px!important;bottom:auto!important;right:20px!important}.fullscreen-button.light-theme:hover{background:#000000e6!important;border-color:#0000004d!important;color:#fff!important;transform:translateY(-2px) scale(1.02)!important;box-shadow:0 4px 20px #00000059!important}.fullscreen-button.no-measurement{bottom:20px!important}.info-panel{position:absolute;top:20px;left:20px;z-index:10;padding:20px 24px;max-width:340px;-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);background:var(--below-panel-bg);border:1px solid var(--below-panel-border);border-radius:16px;box-shadow:var(--below-panel-shadow);transition:all .3s ease}.info-panel:hover{transform:translateY(-1px);box-shadow:0 12px 40px #0006,0 4px 12px #0000004d}.info-panel__title{color:#fff;font-size:22px;font-weight:800;margin-bottom:12px;text-transform:uppercase;letter-spacing:1.2px;background:linear-gradient(135deg,#fff,#f5f5f5);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 8px rgba(255,255,255,.3))}.info-panel__controls{margin-top:8px;font-size:13px;line-height:1.5;color:#b0b0b0}.info-panel__controls strong{color:var(--below-text-color);font-weight:600}@media (max-width: 768px){.info-panel{top:10px;left:10px;padding:16px;max-width:280px}}.vr-button--glass,.vr-button-glass,[style*="position: absolute"][style*=bottom]{position:fixed!important;bottom:80px!important;left:50%!important;transform:translate(-50%)!important;z-index:100!important;padding:16px 32px!important;min-width:160px!important;height:56px!important;background:#ffffff1a!important;-webkit-backdrop-filter:blur(20px) saturate(140%)!important;backdrop-filter:blur(20px) saturate(140%)!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:16px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif!important;font-size:14px!important;font-weight:300!important;color:#fff!important;text-transform:uppercase!important;letter-spacing:.1em!important;white-space:nowrap!important;text-align:center!important;line-height:1.2!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;box-shadow:0 8px 32px #0000004d,0 2px 8px #4ec3ff0d,inset 0 1px #ffffff0d!important;cursor:pointer!important;transition:all .4s cubic-bezier(.4,0,.2,1)!important;outline:none!important;text-decoration:none!important;position:relative!important;overflow:hidden!important}.vr-button--glass:before,.vr-button-glass:before,.vr-button-available:before,[style*="position: absolute"][style*=bottom]:before{content:""!important;position:absolute!important;top:0!important;left:-100%!important;width:100%!important;height:100%!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),rgba(255,255,255,.3),rgba(255,255,255,.15),transparent)!important;animation:vrShimmerInviting 4s ease-in-out infinite!important;border-radius:16px!important;pointer-events:none!important}@keyframes vrShimmerInviting{0%,80%{left:-100%!important;opacity:0!important}85%{left:-50%!important;opacity:.5!important}90%{left:0!important;opacity:1!important}95%{left:50%!important;opacity:.5!important}to{left:100%!important;opacity:0!important}}.vr-button--glass:hover,.vr-button-glass:hover,.vr-button-available:hover{background:#ffffff26!important;border-color:#ffffff4d!important;transform:translate(-50%) translateY(-2px)!important;box-shadow:0 12px 40px #0006,0 4px 12px #4ec3ff1a,inset 0 1px #ffffff14!important}.vr-button--glass:hover:before,.vr-button-glass:hover:before,.vr-button-available:hover:before,[style*="position: absolute"][style*=bottom]:hover:before{animation:vrShimmer 1.5s ease-in-out infinite!important}.vr-button--glass:active,.vr-button-glass:active,.vr-button-available:active{transform:translate(-50%) translateY(-1px)!important;background:#fff3!important;box-shadow:0 6px 20px #0006,0 2px 6px #4ec3ff1a,inset 0 1px #ffffff1a!important;transition:all .1s ease!important}.vr-button-disabled,button.vr-button-disabled{background:#9ca3af1a!important;border:1px solid rgba(156,163,175,.3)!important;color:#9ca3af!important;cursor:not-allowed!important;opacity:.6!important;box-shadow:0 4px 16px #0003!important;pointer-events:none!important}.vr-button-disabled:before,button.vr-button-disabled:before{display:none!important}@keyframes vrShimmer{0%{left:-100%!important;opacity:0!important}50%{left:0!important;opacity:1!important}to{left:100%!important;opacity:0!important}}@media (max-width: 768px){.vr-button--glass,.vr-button-glass,[style*="position: absolute"][style*=bottom]{bottom:60px!important;padding:12px 24px!important;min-width:140px!important;height:48px!important;font-size:12px!important}.vr-icon{font-size:14px!important}.info-panel{display:none}}.vr-mode .info-panel{display:none!important}.vr-mode .model-selector{pointer-events:none;opacity:.5}.vr-controller{pointer-events:none}.vr-loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#000c;color:#fff;padding:20px;border-radius:10px;font-size:18px;z-index:1000}.vr-measurement-panel{position:fixed;top:20px;right:20px;background:#000c;color:#fff;padding:15px;border-radius:10px;border:2px solid #87cefa;z-index:100;font-family:monospace}.vr-reticle{position:fixed;top:50%;left:50%;width:4px;height:4px;background:#fffc;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:999}.vr-teleport-indicator{position:absolute;width:2px;height:2px;background:#0f0;border-radius:50%;pointer-events:none;opacity:.8}.vr-hand-model{pointer-events:none}.vr-spotlight-indicator{position:fixed;bottom:80px;left:50%;transform:translate(-50%);color:#fffc;font-size:14px;text-align:center;pointer-events:none;z-index:90}@supports (-webkit-appearance: none){.vr-button--glass,.vr-button-glass,[style*="position: absolute"][style*=bottom]{backdrop-filter:blur(20px) saturate(140%)!important;-webkit-backdrop-filter:blur(20px) saturate(140%)!important}}.mode-toggle-container{display:flex;flex-direction:column;gap:20px}.semantic-toggle{position:relative;width:180px;height:60px;margin:0 auto;background:#ffffff0f;border-radius:30px;border:1px solid rgba(255,255,255,.1);overflow:hidden}.semantic-toggle input{position:absolute;opacity:0;width:0;height:0}.toggle-option{position:absolute;top:0;width:90px;height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.toggle-option.left{left:0}.toggle-option.right{right:0}.toggle-icon{font-size:20px;margin-bottom:4px;transition:all .3s ease}.toggle-text{color:#888;transition:all .3s ease;font-size:12px}.toggle-slider-bg{position:absolute;top:4px;left:4px;width:82px;height:52px;background:linear-gradient(135deg,#4caf50,#388e3c);border-radius:26px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px #4caf5066,0 2px 8px #0003}.semantic-toggle input:checked+.toggle-slider-bg{transform:translate(90px);background:linear-gradient(135deg,#64b5f6,#42a5f5);box-shadow:0 4px 16px #64b5f666,0 2px 8px #0003}.semantic-toggle input:not(:checked)~.toggle-option.left .toggle-icon{color:#fff;filter:drop-shadow(0 0 8px rgba(255,255,255,.5))}.semantic-toggle input:not(:checked)~.toggle-option.left .toggle-text{color:#fff;font-weight:700}.semantic-toggle input:checked~.toggle-option.right .toggle-icon{color:#fff;filter:drop-shadow(0 0 8px rgba(255,255,255,.5))}.semantic-toggle input:checked~.toggle-option.right .toggle-text{color:#fff;font-weight:700}.semantic-toggle:hover .toggle-slider-bg{box-shadow:0 6px 20px #4caf5080,0 2px 12px #0000004d}.semantic-toggle input:checked:hover+.toggle-slider-bg{box-shadow:0 6px 20px #64b5f680,0 2px 12px #0000004d}.dive-mode-indicator{position:absolute;top:20px;right:20px;z-index:15;background:#64b5f61a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(100,181,246,.3);border-radius:12px;padding:8px 16px;font-size:12px;font-weight:600;color:#64b5f6;text-transform:uppercase;letter-spacing:.5px;opacity:0;transform:translateY(-10px);transition:all .3s ease}.dive-mode-indicator.active{opacity:1;transform:translateY(0)}.survey-mode-indicator{position:absolute;top:20px;right:20px;z-index:15;background:#4caf501a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(76,175,80,.3);border-radius:12px;padding:8px 16px;font-size:12px;font-weight:600;color:#4caf50;text-transform:uppercase;letter-spacing:.5px;opacity:0;transform:translateY(-10px);transition:all .3s ease}.survey-mode-indicator.active{opacity:1;transform:translateY(0)}.dive-control-panel{position:absolute;top:20px;right:20px;z-index:10;background:#ffffff14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:20px;min-width:220px;box-shadow:0 8px 32px #0000004d}.dive-control-title{color:#64b5f6;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;text-align:center;margin-bottom:8px}@keyframes diveTransition{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes surveyTransition{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.dive-mode-active .dive-control-panel{animation:diveTransition .3s ease-out}.survey-mode-active .dive-control-panel{animation:surveyTransition .3s ease-out}.measurement-panel{position:absolute;bottom:20px;right:20px;background:#ffffff0f;color:#ffffffe6;padding:12px 16px;border-radius:12px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-size:14px;font-weight:500;z-index:100;cursor:pointer;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .4s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;min-width:100px;text-align:center;box-shadow:0 2px 8px #00000026}.measurement-panel:hover{background:#ffffff1a;border-color:#fff3;color:#fff;transform:scale(1.02);box-shadow:0 4px 16px #0003}.measurement-panel .disabled{color:#fff6;border-color:#ffffff0d;background:#ffffff05}.measurement-panel .active{color:#4ade80;border-color:#4ade804d;background:#4ade801a;box-shadow:0 0 20px #4ade801a}.measurement-panel .measured{color:#60a5fa;border-color:#60a5fa4d;background:#60a5fa1a;box-shadow:0 0 20px #60a5fa1a}.measurement-panel.light-theme{background:#000c;color:#fffffff2;border:1px solid rgba(0,0,0,.2);box-shadow:0 2px 12px #00000040}.measurement-panel.light-theme:hover{background:#000000e6;border-color:#0000004d;color:#fff;transform:scale(1.02);box-shadow:0 4px 20px #00000059}.measurement-panel.light-theme.disabled{color:#ffffff80;border-color:#0000001a;background:#0009}.measurement-panel.light-theme.active{color:#10b981;border-color:#10b98166;background:#000000d9;box-shadow:0 0 24px #10b98133}.measurement-panel.light-theme.measured{color:#3b82f6;border-color:#3b82f666;background:#000000d9;box-shadow:0 0 24px #3b82f633}.vr-comfort-glyph{position:absolute;width:40px;height:40px;border-radius:50%;background:#0009;border:2px solid #666;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:20px;z-index:10000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:manipulation;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.vr-comfort-glyph:hover{transform:scale(1.1);background:#000c}.vr-comfort-glyph:focus{outline:3px solid #4ade80;outline-offset:2px}.vr-comfort-glyph.comfort-off{color:#666;border-color:#666;background:#0009;box-shadow:none}.vr-comfort-glyph.comfort-on{color:#4ade80;border-color:#4ade80;background:#4ade801a;box-shadow:0 0 20px #4ade804d}.vr-comfort-glyph.position-bottom-right{bottom:var(--vr-comfort-offset-y, 70px);right:var(--vr-comfort-offset-x, 20px)}.vr-comfort-glyph.position-bottom-left{bottom:var(--vr-comfort-offset-y, 70px);left:var(--vr-comfort-offset-x, 20px)}.vr-comfort-glyph.position-top-right{top:var(--vr-comfort-offset-y, 20px);right:var(--vr-comfort-offset-x, 260px)}.vr-comfort-glyph.position-top-left{top:var(--vr-comfort-offset-y, 20px);left:var(--vr-comfort-offset-x, 20px)}.vr-mode *{box-sizing:border-box!important}.vr-mode body{background:#000!important;color:#fff!important;margin:0!important;padding:0!important}.vr-mode,.vr-mode *{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif!important;line-height:1.5!important}.vr-mode input,.vr-mode select,.vr-mode button,.vr-mode textarea{font-size:18px!important;padding:12px 16px!important;border-radius:6px!important;border:2px solid #4a9eff!important;background:#101828f2!important;color:#fff!important;-webkit-backdrop-filter:blur(20px)!important;backdrop-filter:blur(20px)!important;transition:all .2s ease!important}.vr-mode input:focus,.vr-mode select:focus,.vr-mode button:focus,.vr-mode textarea:focus{outline:none!important;border-color:#60a5fa!important;box-shadow:0 0 0 3px #60a5fa4d!important;background:#101828!important}.vr-mode button:hover{background:#4a9eff33!important;border-color:#60a5fa!important}.vr-mode .vr-comfort-glyph{background:#000000e6!important;border-width:3px!important;-webkit-backdrop-filter:blur(15px)!important;backdrop-filter:blur(15px)!important;font-size:22px!important;width:44px!important;height:44px!important}.vr-mode .vr-comfort-glyph:hover{transform:scale(1.15)!important;background:#000000f2!important}.vr-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;padding:12px 20px;font-size:16px;font-weight:700;font-family:system-ui,-apple-system,sans-serif;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #0003;-webkit-user-select:none;user-select:none;touch-action:manipulation}.vr-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}.vr-button:focus{outline:3px solid #4ade80;outline-offset:2px}.vr-button:active{transform:translateY(0)}.vr-mode .vr-button{font-size:18px!important;padding:14px 24px!important;border-radius:10px!important}.vr-status{position:fixed;bottom:20px;right:20px;background:#000c;color:#fff;padding:8px 12px;border-radius:6px;font-size:14px;font-family:system-ui,-apple-system,sans-serif;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9999;transition:all .3s ease}.vr-status.vr-active{background:#4ade8033;border:2px solid #4ade80;color:#4ade80}.vr-mode .vr-status{font-size:16px!important;padding:10px 16px!important;border-radius:8px!important}.vr-panel{background:#101828f2;border:2px solid #374151;border-radius:12px;padding:20px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;font-family:system-ui,-apple-system,sans-serif;box-shadow:0 8px 32px #0006}.vr-mode .vr-panel{border-width:3px!important;padding:24px!important;border-radius:16px!important}.vr-panel h1,.vr-panel h2,.vr-panel h3{margin-top:0;color:#f9fafb}.vr-panel p{color:#d1d5db;line-height:1.6}@media (max-width: 768px){.vr-comfort-glyph{width:48px!important;height:48px!important;font-size:24px!important}.vr-comfort-glyph.position-bottom-right{bottom:var(--vr-comfort-offset-y-mobile, 80px);right:var(--vr-comfort-offset-x-mobile, 15px)}.vr-comfort-glyph.position-bottom-left{bottom:var(--vr-comfort-offset-y-mobile, 80px);left:var(--vr-comfort-offset-x-mobile, 15px)}.vr-button{font-size:18px!important;padding:14px 24px!important}.vr-status{font-size:16px!important;padding:10px 16px!important}.vr-panel{padding:16px!important;margin:10px!important}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.vr-comfort-glyph{border-width:2.5px}.vr-mode .vr-comfort-glyph{border-width:3.5px!important}.vr-button{box-shadow:0 6px 20px #00000040}}.vr-mode-active{--vr-css-loaded: true;opacity:.999}.vr-hidden{display:none!important}.vr-visible{display:block!important}.vr-flex{display:flex!important}.vr-center{align-items:center!important;justify-content:center!important}.vr-text-center{text-align:center!important}.vr-text-white{color:#fff!important}.vr-bg-dark{background:#000c!important}.vr-rounded{border-radius:8px!important}.vr-shadow{box-shadow:0 4px 15px #0003!important}
|
|
1
|
+
:root{--below-bg-color: #0a0a0a;--below-text-color: #e8e8e8;--below-accent-color: #64B5F6;--below-panel-bg: rgba(255, 255, 255, .08);--below-panel-border: rgba(255, 255, 255, .12);--below-panel-backdrop: blur(20px);--below-panel-shadow: 0 8px 32px rgba(0, 0, 0, .3), 0 2px 8px rgba(0, 0, 0, .2);--below-font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--below-bg-color);color:var(--below-text-color);font-family:var(--below-font-family)}.below-viewer-container{width:100%;height:100%;position:relative}.below-viewer-container canvas{display:block;width:100%;height:100%}.below-panel{background:var(--below-panel-bg);-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);border:1px solid var(--below-panel-border);border-radius:16px;box-shadow:var(--below-panel-shadow)}.model-selector{position:absolute;top:20px;right:20px;z-index:50;background:var(--below-panel-bg);-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);border:1px solid var(--below-panel-border);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:20px;min-width:220px;box-shadow:var(--below-panel-shadow);transition:all .3s ease}.model-selector:hover{transform:translateY(-2px);box-shadow:0 12px 40px #0006,0 4px 12px #0000004d}.model-selector__dropdown{background:linear-gradient(145deg,#ffffff14,#ffffff0a);color:var(--below-text-color);border:1px solid rgba(255,255,255,.1);padding:16px 20px;font-size:23px;font-weight:500;font-family:inherit;cursor:pointer;outline:none;transition:all .3s ease;min-width:100%;border-radius:12px;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:inset 0 1px 3px #0000001a}.model-selector__dropdown:focus{border-color:var(--below-accent-color);box-shadow:0 0 0 2px #64b5f633,inset 0 1px 3px #0000001a}.model-selector__dropdown:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.model-selector__dropdown:disabled{cursor:not-allowed;opacity:.5}.model-selector__dropdown option{background:#1a1a1a;color:var(--below-text-color);padding:12px;font-size:14px}.loading-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;display:none;flex-direction:column;align-items:center;gap:20px;text-align:center}.loading-spinner{position:relative;display:flex;align-items:center;justify-content:center}.spinner-circle{position:relative;width:64px;height:64px}.spinner-path{position:absolute;top:0;left:0;width:100%;height:100%;border:3px solid rgba(255,255,255,.15);border-top:3px solid #ffffff;border-radius:50%;animation:spinner-rotate 1.5s ease-in-out infinite}.spinner-percentage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);letter-spacing:-.5px}.loading-content{display:flex;flex-direction:column;gap:8px;align-items:center}.loading-model-name{font-size:18px;font-weight:500;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);letter-spacing:.3px}.loading-status{font-size:14px;font-weight:400;color:#ffffffd9;text-shadow:0 1px 2px rgba(0,0,0,.6)}@keyframes spinner-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-indicator.light-theme .loading-model-name{color:#1a1a1a!important;text-shadow:0 1px 2px rgba(255,255,255,.8)!important}.loading-indicator.light-theme .loading-status{color:#1a1a1acc!important;text-shadow:0 1px 2px rgba(255,255,255,.6)!important}.loading-indicator.light-theme .spinner-percentage{color:#1a1a1a!important;text-shadow:0 1px 2px rgba(255,255,255,.8)!important}.loading-indicator.light-theme .spinner-path{border-color:#1a1a1a26!important;border-top-color:#1a1a1a!important}.status{position:absolute;bottom:20px;right:20px;background:#000000b3;padding:10px 15px;border-radius:8px;font-size:12px;z-index:10}.fullscreen-button{position:absolute;bottom:90px;right:20px;width:36px;height:36px;border-radius:50%;background:var(--below-panel-bg);border:1px solid var(--below-panel-border);color:var(--below-text-color);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:120;-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);box-shadow:0 4px 16px #0003;-webkit-user-select:none;user-select:none;transition:transform .3s ease,box-shadow .3s ease}.fullscreen-button:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.fullscreen-button.light-theme{background:#000c!important;border:1px solid rgba(0,0,0,.2)!important;color:#fffffff2!important;box-shadow:0 2px 12px #00000040!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;top:20px!important;bottom:auto!important;right:20px!important}.fullscreen-button.light-theme:hover{background:#000000e6!important;border-color:#0000004d!important;color:#fff!important;transform:translateY(-2px) scale(1.02)!important;box-shadow:0 4px 20px #00000059!important}.fullscreen-button.no-measurement{bottom:20px!important}.info-panel{position:absolute;top:20px;left:20px;z-index:10;padding:20px 24px;max-width:340px;-webkit-backdrop-filter:var(--below-panel-backdrop);backdrop-filter:var(--below-panel-backdrop);background:var(--below-panel-bg);border:1px solid var(--below-panel-border);border-radius:16px;box-shadow:var(--below-panel-shadow);transition:all .3s ease}.info-panel:hover{transform:translateY(-1px);box-shadow:0 12px 40px #0006,0 4px 12px #0000004d}.info-panel__title{color:#fff;font-size:22px;font-weight:800;margin-bottom:12px;text-transform:uppercase;letter-spacing:1.2px;background:linear-gradient(135deg,#fff,#f5f5f5);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 8px rgba(255,255,255,.3))}.info-panel__controls{margin-top:8px;font-size:13px;line-height:1.5;color:#b0b0b0}.info-panel__controls strong{color:var(--below-text-color);font-weight:600}@media (max-width: 768px){.info-panel{top:10px;left:10px;padding:16px;max-width:280px}}.vr-button--glass,.vr-button-glass,[style*="position: absolute"][style*=bottom]{position:fixed!important;bottom:80px!important;left:50%!important;transform:translate(-50%)!important;z-index:100!important;padding:16px 32px!important;min-width:160px!important;height:56px!important;background:#ffffff1a!important;-webkit-backdrop-filter:blur(20px) saturate(140%)!important;backdrop-filter:blur(20px) saturate(140%)!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:16px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif!important;font-size:14px!important;font-weight:300!important;color:#fff!important;text-transform:uppercase!important;letter-spacing:.1em!important;white-space:nowrap!important;text-align:center!important;line-height:1.2!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;box-shadow:0 8px 32px #0000004d,0 2px 8px #4ec3ff0d,inset 0 1px #ffffff0d!important;cursor:pointer!important;transition:all .4s cubic-bezier(.4,0,.2,1)!important;outline:none!important;text-decoration:none!important;position:relative!important;overflow:hidden!important}.vr-button--glass:before,.vr-button-glass:before,.vr-button-available:before,[style*="position: absolute"][style*=bottom]:before{content:""!important;position:absolute!important;top:0!important;left:-100%!important;width:100%!important;height:100%!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),rgba(255,255,255,.3),rgba(255,255,255,.15),transparent)!important;animation:vrShimmerInviting 4s ease-in-out infinite!important;border-radius:16px!important;pointer-events:none!important}@keyframes vrShimmerInviting{0%,80%{left:-100%!important;opacity:0!important}85%{left:-50%!important;opacity:.5!important}90%{left:0!important;opacity:1!important}95%{left:50%!important;opacity:.5!important}to{left:100%!important;opacity:0!important}}.vr-button--glass:hover,.vr-button-glass:hover,.vr-button-available:hover{background:#ffffff26!important;border-color:#ffffff4d!important;transform:translate(-50%) translateY(-2px)!important;box-shadow:0 12px 40px #0006,0 4px 12px #4ec3ff1a,inset 0 1px #ffffff14!important}.vr-button--glass:hover:before,.vr-button-glass:hover:before,.vr-button-available:hover:before,[style*="position: absolute"][style*=bottom]:hover:before{animation:vrShimmer 1.5s ease-in-out infinite!important}.vr-button--glass:active,.vr-button-glass:active,.vr-button-available:active{transform:translate(-50%) translateY(-1px)!important;background:#fff3!important;box-shadow:0 6px 20px #0006,0 2px 6px #4ec3ff1a,inset 0 1px #ffffff1a!important;transition:all .1s ease!important}.vr-button-disabled,button.vr-button-disabled{background:#9ca3af1a!important;border:1px solid rgba(156,163,175,.3)!important;color:#9ca3af!important;cursor:not-allowed!important;opacity:.6!important;box-shadow:0 4px 16px #0003!important;pointer-events:none!important}.vr-button-disabled:before,button.vr-button-disabled:before{display:none!important}@keyframes vrShimmer{0%{left:-100%!important;opacity:0!important}50%{left:0!important;opacity:1!important}to{left:100%!important;opacity:0!important}}@media (max-width: 768px){.vr-button--glass,.vr-button-glass,[style*="position: absolute"][style*=bottom]{bottom:60px!important;padding:12px 24px!important;min-width:140px!important;height:48px!important;font-size:12px!important}.vr-icon{font-size:14px!important}.info-panel{display:none}}.vr-mode .info-panel{display:none!important}.vr-mode .model-selector{pointer-events:none;opacity:.5}.vr-controller{pointer-events:none}.vr-loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#000c;color:#fff;padding:20px;border-radius:10px;font-size:18px;z-index:1000}.vr-measurement-panel{position:fixed;top:20px;right:20px;background:#000c;color:#fff;padding:15px;border-radius:10px;border:2px solid #87cefa;z-index:100;font-family:monospace}.vr-reticle{position:fixed;top:50%;left:50%;width:4px;height:4px;background:#fffc;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:999}.vr-teleport-indicator{position:absolute;width:2px;height:2px;background:#0f0;border-radius:50%;pointer-events:none;opacity:.8}.vr-hand-model{pointer-events:none}.vr-spotlight-indicator{position:fixed;bottom:80px;left:50%;transform:translate(-50%);color:#fffc;font-size:14px;text-align:center;pointer-events:none;z-index:90}@supports (-webkit-appearance: none){.vr-button--glass,.vr-button-glass,[style*="position: absolute"][style*=bottom]{backdrop-filter:blur(20px) saturate(140%)!important;-webkit-backdrop-filter:blur(20px) saturate(140%)!important}}.mode-toggle-container{display:flex;flex-direction:column;gap:20px}.semantic-toggle{position:relative;width:180px;height:60px;margin:0 auto;background:#ffffff0f;border-radius:30px;border:1px solid rgba(255,255,255,.1);overflow:hidden}.semantic-toggle input{position:absolute;opacity:0;width:0;height:0}.toggle-option{position:absolute;top:0;width:90px;height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.toggle-option.left{left:0}.toggle-option.right{right:0}.toggle-icon{font-size:20px;margin-bottom:4px;transition:all .3s ease}.toggle-text{color:#888;transition:all .3s ease;font-size:12px}.toggle-slider-bg{position:absolute;top:4px;left:4px;width:82px;height:52px;background:linear-gradient(135deg,#4caf50,#388e3c);border-radius:26px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px #4caf5066,0 2px 8px #0003}.semantic-toggle input:checked+.toggle-slider-bg{transform:translate(90px);background:linear-gradient(135deg,#64b5f6,#42a5f5);box-shadow:0 4px 16px #64b5f666,0 2px 8px #0003}.semantic-toggle input:not(:checked)~.toggle-option.left .toggle-icon{color:#fff;filter:drop-shadow(0 0 8px rgba(255,255,255,.5))}.semantic-toggle input:not(:checked)~.toggle-option.left .toggle-text{color:#fff;font-weight:700}.semantic-toggle input:checked~.toggle-option.right .toggle-icon{color:#fff;filter:drop-shadow(0 0 8px rgba(255,255,255,.5))}.semantic-toggle input:checked~.toggle-option.right .toggle-text{color:#fff;font-weight:700}.semantic-toggle:hover .toggle-slider-bg{box-shadow:0 6px 20px #4caf5080,0 2px 12px #0000004d}.semantic-toggle input:checked:hover+.toggle-slider-bg{box-shadow:0 6px 20px #64b5f680,0 2px 12px #0000004d}.dive-mode-indicator{position:absolute;top:20px;right:20px;z-index:15;background:#64b5f61a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(100,181,246,.3);border-radius:12px;padding:8px 16px;font-size:12px;font-weight:600;color:#64b5f6;text-transform:uppercase;letter-spacing:.5px;opacity:0;transform:translateY(-10px);transition:all .3s ease}.dive-mode-indicator.active{opacity:1;transform:translateY(0)}.survey-mode-indicator{position:absolute;top:20px;right:20px;z-index:15;background:#4caf501a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(76,175,80,.3);border-radius:12px;padding:8px 16px;font-size:12px;font-weight:600;color:#4caf50;text-transform:uppercase;letter-spacing:.5px;opacity:0;transform:translateY(-10px);transition:all .3s ease}.survey-mode-indicator.active{opacity:1;transform:translateY(0)}.dive-control-panel{position:absolute;top:20px;right:20px;z-index:10;background:#ffffff14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:20px;min-width:220px;box-shadow:0 8px 32px #0000004d}.dive-control-title{color:#64b5f6;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;text-align:center;margin-bottom:8px}@keyframes diveTransition{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes surveyTransition{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.dive-mode-active .dive-control-panel{animation:diveTransition .3s ease-out}.survey-mode-active .dive-control-panel{animation:surveyTransition .3s ease-out}.measurement-panel{position:absolute;bottom:20px;right:20px;background:#ffffff0f;color:#ffffffe6;padding:12px 16px;border-radius:12px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-size:14px;font-weight:500;z-index:100;cursor:pointer;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .4s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;min-width:100px;text-align:center;box-shadow:0 2px 8px #00000026}.measurement-panel:hover{background:#ffffff1a;border-color:#fff3;color:#fff;transform:scale(1.02);box-shadow:0 4px 16px #0003}.measurement-panel .disabled{color:#fff6;border-color:#ffffff0d;background:#ffffff05}.measurement-panel .active{color:#4ade80;border-color:#4ade804d;background:#4ade801a;box-shadow:0 0 20px #4ade801a}.measurement-panel .measured{color:#60a5fa;border-color:#60a5fa4d;background:#60a5fa1a;box-shadow:0 0 20px #60a5fa1a}.measurement-panel.light-theme{background:#000c;color:#fffffff2;border:1px solid rgba(0,0,0,.2);box-shadow:0 2px 12px #00000040}.measurement-panel.light-theme:hover{background:#000000e6;border-color:#0000004d;color:#fff;transform:scale(1.02);box-shadow:0 4px 20px #00000059}.measurement-panel.light-theme.disabled{color:#ffffff80;border-color:#0000001a;background:#0009}.measurement-panel.light-theme.active{color:#10b981;border-color:#10b98166;background:#000000d9;box-shadow:0 0 24px #10b98133}.measurement-panel.light-theme.measured{color:#3b82f6;border-color:#3b82f666;background:#000000d9;box-shadow:0 0 24px #3b82f633}.vr-comfort-glyph{position:absolute;width:40px;height:40px;border-radius:50%;background:#0009;border:2px solid #666;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:20px;z-index:10000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:manipulation;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.vr-comfort-glyph:hover{transform:scale(1.1);background:#000c}.vr-comfort-glyph:focus{outline:3px solid #4ade80;outline-offset:2px}.vr-comfort-glyph.comfort-off{color:#666;border-color:#666;background:#0009;box-shadow:none}.vr-comfort-glyph.comfort-on{color:#4ade80;border-color:#4ade80;background:#4ade801a;box-shadow:0 0 20px #4ade804d}.vr-comfort-glyph.position-bottom-right{bottom:var(--vr-comfort-offset-y, 70px);right:var(--vr-comfort-offset-x, 20px)}.vr-comfort-glyph.position-bottom-left{bottom:var(--vr-comfort-offset-y, 70px);left:var(--vr-comfort-offset-x, 20px)}.vr-comfort-glyph.position-top-right{top:var(--vr-comfort-offset-y, 20px);right:var(--vr-comfort-offset-x, 260px)}.vr-comfort-glyph.position-top-left{top:var(--vr-comfort-offset-y, 20px);left:var(--vr-comfort-offset-x, 20px)}.vr-mode *{box-sizing:border-box!important}.vr-mode body{background:#000!important;color:#fff!important;margin:0!important;padding:0!important}.vr-mode,.vr-mode *{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif!important;line-height:1.5!important}.vr-mode input,.vr-mode select,.vr-mode button,.vr-mode textarea{font-size:18px!important;padding:12px 16px!important;border-radius:6px!important;border:2px solid #4a9eff!important;background:#101828f2!important;color:#fff!important;-webkit-backdrop-filter:blur(20px)!important;backdrop-filter:blur(20px)!important;transition:all .2s ease!important}.vr-mode input:focus,.vr-mode select:focus,.vr-mode button:focus,.vr-mode textarea:focus{outline:none!important;border-color:#60a5fa!important;box-shadow:0 0 0 3px #60a5fa4d!important;background:#101828!important}.vr-mode button:hover{background:#4a9eff33!important;border-color:#60a5fa!important}.vr-mode .vr-comfort-glyph{background:#000000e6!important;border-width:3px!important;-webkit-backdrop-filter:blur(15px)!important;backdrop-filter:blur(15px)!important;font-size:22px!important;width:44px!important;height:44px!important}.vr-mode .vr-comfort-glyph:hover{transform:scale(1.15)!important;background:#000000f2!important}.vr-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;padding:12px 20px;font-size:16px;font-weight:700;font-family:system-ui,-apple-system,sans-serif;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #0003;-webkit-user-select:none;user-select:none;touch-action:manipulation}.vr-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}.vr-button:focus{outline:3px solid #4ade80;outline-offset:2px}.vr-button:active{transform:translateY(0)}.vr-mode .vr-button{font-size:18px!important;padding:14px 24px!important;border-radius:10px!important}.vr-status{position:fixed;bottom:20px;right:20px;background:#000c;color:#fff;padding:8px 12px;border-radius:6px;font-size:14px;font-family:system-ui,-apple-system,sans-serif;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9999;transition:all .3s ease}.vr-status.vr-active{background:#4ade8033;border:2px solid #4ade80;color:#4ade80}.vr-mode .vr-status{font-size:16px!important;padding:10px 16px!important;border-radius:8px!important}.vr-panel{background:#101828f2;border:2px solid #374151;border-radius:12px;padding:20px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;font-family:system-ui,-apple-system,sans-serif;box-shadow:0 8px 32px #0006}.vr-mode .vr-panel{border-width:3px!important;padding:24px!important;border-radius:16px!important}.vr-panel h1,.vr-panel h2,.vr-panel h3{margin-top:0;color:#f9fafb}.vr-panel p{color:#d1d5db;line-height:1.6}@media (max-width: 768px){.vr-comfort-glyph{width:48px!important;height:48px!important;font-size:24px!important}.vr-comfort-glyph.position-bottom-right{bottom:var(--vr-comfort-offset-y-mobile, 80px);right:var(--vr-comfort-offset-x-mobile, 15px)}.vr-comfort-glyph.position-bottom-left{bottom:var(--vr-comfort-offset-y-mobile, 80px);left:var(--vr-comfort-offset-x-mobile, 15px)}.vr-button{font-size:18px!important;padding:14px 24px!important}.vr-status{font-size:16px!important;padding:10px 16px!important}.vr-panel{padding:16px!important;margin:10px!important}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.vr-comfort-glyph{border-width:2.5px}.vr-mode .vr-comfort-glyph{border-width:3.5px!important}.vr-button{box-shadow:0 6px 20px #00000040}}.vr-mode-active{--vr-css-loaded: true;opacity:.999}.vr-hidden{display:none!important}.vr-visible{display:block!important}.vr-flex{display:flex!important}.vr-center{align-items:center!important;justify-content:center!important}.vr-text-center{text-align:center!important}.vr-text-white{color:#fff!important}.vr-bg-dark{background:#000c!important}.vr-rounded{border-radius:8px!important}.vr-shadow{box-shadow:0 4px 15px #0003!important}
|
package/dist/belowjs.js
CHANGED
|
@@ -8181,7 +8181,7 @@ class Dn extends wt {
|
|
|
8181
8181
|
}
|
|
8182
8182
|
createLoadingIndicator() {
|
|
8183
8183
|
const e = document.createElement("div");
|
|
8184
|
-
e.className = "loading-indicator below-loading", e.style.display = "none", e.innerHTML = `
|
|
8184
|
+
e.className = "loading-indicator below-loading", this.config.measurementTheme === "light" && e.classList.add("light-theme"), e.style.display = "none", e.innerHTML = `
|
|
8185
8185
|
<div class="loading-spinner">
|
|
8186
8186
|
<div class="spinner-circle">
|
|
8187
8187
|
<div class="spinner-path"></div>
|
|
@@ -8353,7 +8353,7 @@ class Dn extends wt {
|
|
|
8353
8353
|
}
|
|
8354
8354
|
updateLoadingProgress({ progress: e }) {
|
|
8355
8355
|
if (e.lengthComputable && this.currentModelKey) {
|
|
8356
|
-
const t = Math.round(e.loaded / e.total * 100);
|
|
8356
|
+
const t = Math.min(100, Math.round(e.loaded / e.total * 100));
|
|
8357
8357
|
if (this.loadingPercentage = t, this.loadingMessage = "Loading model", this.ui.loading) {
|
|
8358
8358
|
const i = this.ui.loading.querySelector(".spinner-percentage"), s = this.ui.loading.querySelector(".loading-status"), o = this.ui.loading.querySelector(".spinner-path");
|
|
8359
8359
|
if (i && (i.textContent = `${t}%`), s && (s.textContent = "Loading model"), o) {
|
package/package.json
CHANGED