viveworker 0.7.0-beta.3 → 0.7.0
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/package.json +1 -1
- package/scripts/viveworker-bridge.mjs +363 -111
- package/web/app.css +97 -4
- package/web/app.js +80 -46
- package/web/i18n.js +20 -8
- package/web/index.html +84 -0
- package/web/sw.js +2 -2
package/web/index.html
CHANGED
|
@@ -8,9 +8,93 @@
|
|
|
8
8
|
<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png">
|
|
9
9
|
<link rel="icon" type="image/png" sizes="192x192" href="/icons/viveworker-icon-192.png">
|
|
10
10
|
<link rel="stylesheet" href="/app.css">
|
|
11
|
+
<style>
|
|
12
|
+
.boot-splash {
|
|
13
|
+
position: fixed;
|
|
14
|
+
inset: 0;
|
|
15
|
+
z-index: 9999;
|
|
16
|
+
display: grid;
|
|
17
|
+
place-items: center;
|
|
18
|
+
padding: max(1.2rem, env(safe-area-inset-top)) 1rem max(1.2rem, env(safe-area-inset-bottom));
|
|
19
|
+
color: #f5fbff;
|
|
20
|
+
background:
|
|
21
|
+
radial-gradient(circle at 50% 18%, rgba(47, 143, 103, 0.22), transparent 30%),
|
|
22
|
+
radial-gradient(circle at 78% 78%, rgba(79, 131, 216, 0.14), transparent 28%),
|
|
23
|
+
linear-gradient(180deg, #081015 0%, #091015 100%);
|
|
24
|
+
transition: opacity 220ms ease, visibility 220ms ease;
|
|
25
|
+
}
|
|
26
|
+
.boot-splash__card {
|
|
27
|
+
width: min(20rem, 82vw);
|
|
28
|
+
display: grid;
|
|
29
|
+
justify-items: center;
|
|
30
|
+
gap: 0.9rem;
|
|
31
|
+
text-align: center;
|
|
32
|
+
}
|
|
33
|
+
.boot-splash__logo {
|
|
34
|
+
width: clamp(5.4rem, 28vw, 7rem);
|
|
35
|
+
height: clamp(5.4rem, 28vw, 7rem);
|
|
36
|
+
border-radius: 28%;
|
|
37
|
+
background:
|
|
38
|
+
radial-gradient(circle at 76% 24%, rgba(125, 211, 252, 0.22), transparent 30%),
|
|
39
|
+
linear-gradient(180deg, rgba(23, 52, 72, 0.96), rgba(9, 17, 23, 0.96));
|
|
40
|
+
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
|
|
41
|
+
}
|
|
42
|
+
.boot-splash__title {
|
|
43
|
+
margin: 0.25rem 0 0;
|
|
44
|
+
font-family: "Avenir Next", "SF Pro Rounded", "SF Pro Text", "Helvetica Neue", sans-serif;
|
|
45
|
+
font-size: clamp(1.65rem, 8vw, 2.4rem);
|
|
46
|
+
line-height: 1;
|
|
47
|
+
letter-spacing: -0.04em;
|
|
48
|
+
}
|
|
49
|
+
.boot-splash__status {
|
|
50
|
+
margin: 0;
|
|
51
|
+
color: rgba(205, 220, 231, 0.72);
|
|
52
|
+
font-family: "Avenir Next", "SF Pro Rounded", "SF Pro Text", "Helvetica Neue", sans-serif;
|
|
53
|
+
font-size: 0.9rem;
|
|
54
|
+
letter-spacing: 0.02em;
|
|
55
|
+
}
|
|
56
|
+
.boot-splash__dots {
|
|
57
|
+
display: inline-grid;
|
|
58
|
+
grid-auto-flow: column;
|
|
59
|
+
gap: 0.34rem;
|
|
60
|
+
margin-top: 0.15rem;
|
|
61
|
+
}
|
|
62
|
+
.boot-splash__dots span {
|
|
63
|
+
width: 0.42rem;
|
|
64
|
+
height: 0.42rem;
|
|
65
|
+
border-radius: 999px;
|
|
66
|
+
background: rgba(142, 215, 255, 0.88);
|
|
67
|
+
animation: viveworker-boot-dot 980ms ease-in-out infinite;
|
|
68
|
+
}
|
|
69
|
+
.boot-splash__dots span:nth-child(2) { animation-delay: 140ms; }
|
|
70
|
+
.boot-splash__dots span:nth-child(3) { animation-delay: 280ms; }
|
|
71
|
+
.viveworker-ready .boot-splash {
|
|
72
|
+
opacity: 0;
|
|
73
|
+
visibility: hidden;
|
|
74
|
+
}
|
|
75
|
+
@keyframes viveworker-boot-dot {
|
|
76
|
+
0%, 80%, 100% { transform: translateY(0); opacity: 0.42; }
|
|
77
|
+
40% { transform: translateY(-0.28rem); opacity: 1; }
|
|
78
|
+
}
|
|
79
|
+
@media (prefers-reduced-motion: reduce) {
|
|
80
|
+
.boot-splash,
|
|
81
|
+
.boot-splash__dots span {
|
|
82
|
+
transition: none;
|
|
83
|
+
animation: none;
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
</style>
|
|
11
87
|
<title>viveworker</title>
|
|
12
88
|
</head>
|
|
13
89
|
<body>
|
|
90
|
+
<div id="boot-splash" class="boot-splash" role="status" aria-live="polite" aria-label="viveworker is starting">
|
|
91
|
+
<div class="boot-splash__card">
|
|
92
|
+
<img class="boot-splash__logo" src="/icons/viveworker-v-pulse.svg" alt="" width="112" height="112" decoding="async">
|
|
93
|
+
<h1 class="boot-splash__title">viveworker</h1>
|
|
94
|
+
<p class="boot-splash__status">Starting</p>
|
|
95
|
+
<span class="boot-splash__dots" aria-hidden="true"><span></span><span></span><span></span></span>
|
|
96
|
+
</div>
|
|
97
|
+
</div>
|
|
14
98
|
<div id="app"></div>
|
|
15
99
|
<script type="module" src="/app.js"></script>
|
|
16
100
|
</body>
|
package/web/sw.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
const CACHE_NAME = "viveworker-
|
|
1
|
+
const CACHE_NAME = "viveworker-v66";
|
|
2
2
|
const NOTIFICATION_INTENT_CACHE = "viveworker-notification-intent-v1";
|
|
3
3
|
const NOTIFICATION_INTENT_PATH = "/__viveworker_notification_intent__";
|
|
4
|
-
const APP_ASSETS = ["/app.css", "/app.js", "/i18n.js"];
|
|
4
|
+
const APP_ASSETS = ["/app.css", "/app.js", "/i18n.js", "/icons/viveworker-v-pulse.svg"];
|
|
5
5
|
const APP_ROUTES = new Set(["/", "/app", "/app/"]);
|
|
6
6
|
const CACHED_PATHS = new Set(APP_ASSETS);
|
|
7
7
|
|