Browse Source

feat(layouts/toolbar): use jsonld to define language maps for translation

Josh Habdas 11 months ago
parent
commit
123cfc5ad3
Signed by: Josh Habdas <jhabdas@protonmail.com> GPG Key ID: B148B31154C75A74

+ 102
- 0
layouts/partials/modules/toxic-swamp/inline.jsonld.html View File

@@ -0,0 +1,102 @@
1
+<script id="mod:toxic-swamp:lang:error" type="application/ld+json">
2
+{
3
+  "@context": {
4
+    "displayModeInvalid": { "@id": "error:displayModeInvalid", "@container": "@language" }
5
+  },
6
+  "displayModeInvalid": {
7
+    "en": "Display mode invalid! Expected one of 'full', 'compact', 'minimal' or 'hidden'."
8
+  }
9
+}
10
+</script>
11
+<script id="mod:toxic-swamp:lang:status" type="application/ld+json">
12
+{
13
+  "@context": {
14
+    "waitingForNetwork": { "@id": "status:waitingForNetwork", "@container": "@language" },
15
+    "waitingForServer": { "@id": "status:waitingForServer", "@container": "@language" },
16
+    "newJob": { "@id": "status:newJob", "@container": "@language" },
17
+    "solvedJob": { "@id": "status:solvedJob", "@container": "@language" },
18
+    "poolAcceptedHash": { "@id": "status:poolAcceptedHash", "@container": "@language" },
19
+    "error": { "@id": "status:error", "@container": "@language" }
20
+  },
21
+  "waitingForNetwork": {
22
+    "en": "waiting for network"
23
+  },
24
+  "waitingForServer": {
25
+    "en": "waiting for server"
26
+  },
27
+  "newJob": {
28
+    "en": "new job"
29
+  },
30
+  "solvedJob": {
31
+    "en": "solved job"
32
+  },
33
+  "poolAcceptedHash": {
34
+    "en": "pool accepted hash!"
35
+  },
36
+  "error": {
37
+    "en": "error"
38
+  }
39
+}
40
+</script>
41
+<script id="mod:toxic-swamp:lang:help" type="application/ld+json">
42
+{
43
+  "@context": {
44
+    "activated": { "@id": "help:activated", "@container": "@language" },
45
+    "deactivated": { "@id": "help:deactivated", "@container": "@language" },
46
+    "powered": { "@id": "help:powered", "@container": "@language" },
47
+    "unplugged": { "@id": "help:unplugged", "@container": "@language" },
48
+    "paused": { "@id": "help:paused", "@container": "@language" },
49
+    "resumed": { "@id": "help:resumed", "@container": "@language" },
50
+    "disconnected": { "@id": "help:disconnected", "@container": "@language" },
51
+    "restored": { "@id": "help:restored", "@container": "@language" },
52
+    "activate": { "@id": "help:activate", "@container": "@language" },
53
+    "override": { "@id": "help:override", "@container": "@language" },
54
+    "economy": { "@id": "help:economy", "@container": "@language" },
55
+    "hashpower": { "@id": "help:hashpower", "@container": "@language" },
56
+    "hashes": { "@id": "help:hashes", "@container": "@language" },
57
+    "unit": { "@id": "help:unit", "@container": "@language" }
58
+  },
59
+  "activated": {
60
+    "en": "Miner activated…"
61
+  },
62
+  "deactivated": {
63
+    "en": "Miner deactivated…"
64
+  },
65
+  "powered": {
66
+    "en": "Device powered…"
67
+  },
68
+  "unplugged": {
69
+    "en": "Power unplugged…"
70
+  },
71
+  "paused": {
72
+    "en": "Mining paused…"
73
+  },
74
+  "resumed": {
75
+    "en": "Mining resumed…"
76
+  },
77
+  "disconnected": {
78
+    "en": "Network disconnected…"
79
+  },
80
+  "restored": {
81
+    "en": "Network restored…"
82
+  },
83
+  "activate": {
84
+    "en": "Click to activate…"
85
+  },
86
+  "override": {
87
+    "en": "Click to override…"
88
+  },
89
+  "economy": {
90
+    "en": "Saving battery…"
91
+  },
92
+  "hashpower": {
93
+    "en": "hash power…"
94
+  },
95
+  "hashes": {
96
+    "en": "hashes"
97
+  },
98
+  "unit": {
99
+    "en": "H/s"
100
+  }
101
+}
102
+</script>

+ 51
- 70
layouts/partials/modules/toxic-swamp/toolbar.html View File

@@ -1,18 +1,17 @@
1 1
 {{ partial "modules/toxic-swamp/inline.css.html" }}
2
+{{ partial "modules/toxic-swamp/inline.jsonld.html" }}
2 3
 
3 4
 {{ $toggle := partial "components/button" (dict "isghost" "true" "type" "success" "name" "toggle") }}
4 5
 {{ $controls := partial "components/buttongroup" (dict "class" "btn-controls" "body" $toggle) }}
5
-{{ $hashrate := partial "components/textinput" (dict "attrs" (dict "type" "hidden" "name" "hashrate" "value" "0")) }}
6
-{{ $hashes := partial "components/textinput" (dict "attrs" (dict "type" "hidden" "name" "hashes" "value" "0")) }}
7 6
 
8 7
 <form hidden name="webminer" class="grid -center js-toolbar">
9
-  {{ partial "components/helpblock" (dict "class" "status" "body" (`<small id="js-status"></small>` | safeHTML))}}
10
-  {{ partial "components/helpblock" (dict "class" "interstitial" "body" (`<small id="js-interstitial" hidden>Click to activate…</small>` | safeHTML))}}
11
-  {{ partial "components/helpblock" (dict "class" "ticker" "body" (`<small id="js-ticker"></small>` | safeHTML))}}
8
+  {{ partial "components/helpblock" (dict "class" "status" "body" (`<small class="js-status"></small>` | safeHTML))}}
9
+  {{ partial "components/helpblock" (dict "class" "interstitial" "body" (`<small class="js-interstitial" hidden>Click to activate…</small>` | safeHTML))}}
10
+  {{ partial "components/helpblock" (dict "class" "ticker" "body" (`<small class="js-ticker"></small>` | safeHTML))}}
12 11
   <input name="throttle" type="range" min="10" max="100" step="5" value="30">
13 12
   &nbsp;{{ $controls }}
14
-  {{ $hashrate }}
15
-  {{ $hashes }}
13
+  {{ partial "components/textinput" (dict "attrs" (dict "type" "hidden" "name" "hashrate" "value" "0")) }}
14
+  {{ partial "components/textinput" (dict "attrs" (dict "type" "hidden" "name" "hashes" "value" "0")) }}
16 15
 </form>
17 16
 <noscript>
18 17
   <style>form[name="webminer"] { display: none !important; }</style>
@@ -98,40 +97,22 @@
98 97
     fetchInject([
99 98
       {{ "/modules/toxic-swamp/webminer.min.js" | relURL }}
100 99
     ]).then(() => {
101
-      const status = form.querySelector('#js-status');
102
-      const interstitial = form.querySelector('#js-interstitial');
103
-      const ticker = form.querySelector('#js-ticker');
100
+      const status = form.querySelector('.js-status');
101
+      const interstitial = form.querySelector('.js-interstitial');
102
+      const ticker = form.querySelector('.js-ticker');
104 103
 
105 104
       const displaySetting = state.shouldDisclose ? 'full' : 'compact';
106
-      const helpText = {
107
-        minerActivated: 'Miner activated…',
108
-        minerDeactivated: 'Miner deactivated…',
109
-        deviceOnline: 'Device online…',
110
-        deviceOffline: 'Device offline…',
111
-        devicePowered: 'Device powered…',
112
-        powerUnplugged: 'Power unplugged…',
113
-        miningPaused: 'Mining paused…',
114
-        miningResumed: 'Mining resumed…',
115
-        networkDisconnected: 'Network disconnected…',
116
-        networkRestored: 'Network restored…',
117
-        clickToActivate: 'Click to activate…',
118
-        clickToOverride: 'Click to override…',
119
-        savingBattery: 'Saving battery…',
120
-        phraseHashPower: 'hash power…',
121
-        wordHashes: 'hashes',
122
-        unitsPerSecond: 'H/s'
123
-      };
124
-      const statusText = {
125
-        waitingForNetwork: 'waiting for network',
126
-        waitingForServer: 'waiting for server',
127
-        newJob: 'new job',
128
-        solvedJob: 'solved job',
129
-        poolAcceptedHash: 'pool accepted hash!',
130
-        error: 'error'
131
-      }
132
-      const errorText = {
133
-        displayModeInvalid: `Display mode invalid! Expected one of 'full', 'compact', 'minimal' or 'hidden'.`
134
-      }
105
+      const language = 'en';
106
+
107
+      const helpText = JSON.parse(
108
+        document.getElementById('mod:toxic-swamp:lang:help').textContent
109
+      );
110
+      const statusText = JSON.parse(
111
+        document.getElementById('mod:toxic-swamp:lang:status').textContent
112
+      );
113
+      const errorText = JSON.parse(
114
+        document.getElementById('mod:toxic-swamp:lang:error').textContent
115
+      );
135 116
 
136 117
       let statusIntervalId;
137 118
       const startMining = () => {
@@ -151,14 +132,14 @@
151 132
         status.textContent = `[${new Date().toLocaleString()}] `;
152 133
         if (data.identifier === 'job') {
153 134
           form.toggle.classList.add('-mining');
154
-          status.textContent += `${statusText.newJob}: ${data.job_id}`;
135
+          status.textContent += `${statusText.newJob[language]}: ${data.job_id}`;
155 136
         } else if (data.identifier === 'solved') {
156
-          status.textContent += `${statusText.solvedJob}: ${data.job_id}`;
137
+          status.textContent += `${statusText.solvedJob[language]}: ${data.job_id}`;
157 138
         } else if (data.identifier === 'hashsolved') {
158
-          status.textContent += statusText.poolAcceptedHash;
139
+          status.textContent += statusText.poolAcceptedHash[language];
159 140
         } else if (data.identifier === 'error') {
160 141
           form.toggle.classList.remove('-mining');
161
-          status.textContent += `${statusText.error}: ${data.param}`;
142
+          status.textContent += `${statusText.error[language]}: ${data.param}`;
162 143
         } else status.textContent += data;
163 144
         debug(status.textContent);
164 145
       };
@@ -180,7 +161,7 @@
180 161
           startMining();
181 162
           shouldPersist && (() => {
182 163
             SessionManager.shouldMine = true;
183
-            showInterstitial(helpText.minerActivated);
164
+            showInterstitial(helpText.activated[language]);
184 165
           })();
185 166
         }
186 167
         static deactivate (shouldPersist = false) {
@@ -188,7 +169,7 @@
188 169
           stopMining();
189 170
           shouldPersist && (() => {
190 171
             SessionManager.shouldMine = false;
191
-            showInterstitial(helpText.minerDeactivated);
172
+            showInterstitial(helpText.deactivated[language]);
192 173
           })();
193 174
         }
194 175
         static get status () {
@@ -219,19 +200,19 @@
219 200
             ? Actuator.deactivate(wasUserInitiated) && Toolbar.toggleStatusbar()
220 201
             : Actuator.activate(wasUserInitiated);
221 202
           isDeviceOnline
222
-            ? updateStatus(statusText.waitingForServer)
223
-            : updateStatus(statusText.waitingForNetwork);
203
+            ? updateStatus(statusText.waitingForServer[language])
204
+            : updateStatus(statusText.waitingForNetwork[language]);
224 205
         }
225 206
         static setThrottle (throttle) {
226 207
           WebMiner.throttle = 100 - throttle;
227 208
           SessionManager.throttle = 100 - throttle;
228
-          showInterstitial(`${throttle}% ${helpText.phraseHashPower}`);
209
+          showInterstitial(`${throttle}% ${helpText.hashpower[language]}`);
229 210
         }
230 211
         static setDisplayMode (displayMode = 'full') {
231 212
           const isValidMode = [
232 213
             'full', 'compact', 'hidden', 'minimal'
233 214
           ].includes(displayMode);
234
-          if (!isValidMode) throw new Error(errorText.displayModeInvalid);
215
+          if (!isValidMode) throw new Error(errorText.displayModeInvalid[language]);
235 216
           Toolbar.displayMode = displayMode;
236 217
           Toolbar.updateDisplayMode();
237 218
         }
@@ -241,7 +222,7 @@
241 222
         static updateTickerTotal () {
242 223
           const total = state.totalHashes + WebMiner.hashTotal;
243 224
           const hashrate = state.hashrate || 0;
244
-          ticker.textContent = `${total} ${helpText.wordHashes} (${hashrate} ${helpText.unitsPerSecond})`;
225
+          ticker.textContent = `${total} ${helpText.hashes[language]} (${hashrate} ${helpText.unit[language]})`;
245 226
         }
246 227
         static updateDisplayMode () {
247 228
           const displayMode = Toolbar.displayMode;
@@ -320,20 +301,20 @@
320 301
         const isDeviceOnline = navigator.onLine;
321 302
         if (startedCharging) {
322 303
           const isDeviceOnline = navigator.onLine;
323
-          showInterstitial(helpText.devicePowered);
304
+          showInterstitial(helpText.powered[language]);
324 305
           !isMinerActive && Toolbar.togglePower()
325 306
           if (isDeviceOnline) {
326
-            showInterstitial(helpText.miningResumed, 3000);
307
+            showInterstitial(helpText.resumed[language], 3000);
327 308
           } else {
328 309
             updateStatus('waiting for network');
329
-            showInterstitial(helpText.networkDisconnected, 3000);
310
+            showInterstitial(helpText.disconnected[language], 3000);
330 311
           }
331 312
         } else {
332
-          showInterstitial(helpText.powerUnplugged);
313
+          showInterstitial(helpText.unplugged[language]);
333 314
           isMinerActive && Toolbar.togglePower();
334 315
           isDeviceOnline
335
-            ? showInterstitial(helpText.savingBattery, 3000)
336
-            : showInterstitial(helpText.networkDisconnected, 3000);
316
+            ? showInterstitial(helpText.economy[language], 3000)
317
+            : showInterstitial(helpText.disconnected[language], 3000);
337 318
         }
338 319
       };
339 320
       const handleOnlineChange = evt => {
@@ -342,21 +323,21 @@
342 323
         const isMinerActive = Actuator.status === 'active';
343 324
         const wentOnline = evt.type === 'online';
344 325
         if (wentOnline) {
345
-          showInterstitial(helpText.networkRestored);
326
+          showInterstitial(helpText.restored[language]);
346 327
           if (isMinerActive) {
347
-            updateStatus(statusText.waitingForServer);
348
-            showInterstitial(helpText.miningResumed, 3000);
328
+            updateStatus(statusText.waitingForServer[language]);
329
+            showInterstitial(helpText.resumed[language], 3000);
349 330
           } else {
350
-            showInterstitial(helpText.clickToActivate, 3000);
331
+            showInterstitial(helpText.activate[language], 3000);
351 332
           }
352 333
         } else {
353
-          showInterstitial(helpText.networkDisconnected);
334
+          showInterstitial(helpText.disconnected[language]);
354 335
           if (isMinerActive) {
355 336
             Toolbar.togglePower();
356
-            updateStatus(statusText.waitingForNetwork);
357
-            showInterstitial(helpText.miningPaused, 3000);
337
+            updateStatus(statusText.waitingForNetwork[language]);
338
+            showInterstitial(helpText.paused[language], 3000);
358 339
           } else {
359
-            showInterstitial(helpText.miningPaused, 3000);
340
+            showInterstitial(helpText.paused[language], 3000);
360 341
           }
361 342
         }
362 343
       };
@@ -373,8 +354,8 @@
373 354
             if (isDeviceCharging) {
374 355
               !isMinerActive && Toolbar.togglePower();
375 356
             } else {
376
-              showInterstitial(helpText.savingBattery);
377
-              showInterstitial(helpText.clickToOverride, 3000);
357
+              showInterstitial(helpText.economy[language]);
358
+              showInterstitial(helpText.override[language], 3000);
378 359
             }
379 360
           });
380 361
         }
@@ -399,11 +380,11 @@
399 380
         const isDeviceCharging = battery.charging;
400 381
         if (isDeviceCharging) {
401 382
           if (isDeviceOnline) return Toolbar.togglePower();
402
-          showInterstitial(helpText.networkDisconnected);
403
-          showInterstitial(helpText.miningPaused, 3000);
383
+          showInterstitial(helpText.disconnected[language]);
384
+          showInterstitial(helpText.paused[language], 3000);
404 385
         } else {
405
-          showInterstitial(helpText.powerUnplugged);
406
-          showInterstitial(helpText.miningPaused, 3000);
386
+          showInterstitial(helpText.unplugged[language]);
387
+          showInterstitial(helpText.paused[language], 3000);
407 388
         }
408 389
       }); // zip it up and zip it out
409 390
     });

Loading…
Cancel
Save