triiiceratops 0.12.4 → 0.12.6
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/{ArrowCounterClockwise-Bcse6skq.js → ArrowCounterClockwise-BkrSndVO.js} +1 -1
- package/dist/Check-CB_Zdp64.js +423 -0
- package/dist/{X-BsrpnzCK.js → X-B3XldraD.js} +3 -3
- package/dist/components/DemoHeader.svelte +5 -548
- package/dist/components/SettingsMenu.svelte +523 -0
- package/dist/components/SettingsMenu.svelte.d.ts +6 -0
- package/dist/components/Toolbar.svelte +13 -2
- package/dist/components/TriiiceratopsViewer.svelte +37 -11
- package/dist/{image_filters_reset-Dw23NgOZ.js → image_filters_reset-jtpS22ff.js} +1 -1
- package/dist/paraglide/messages/_index.d.ts +4 -0
- package/dist/paraglide/messages/_index.js +4 -0
- package/dist/paraglide/messages/demo_title.d.ts +4 -0
- package/dist/paraglide/messages/demo_title.js +34 -0
- package/dist/paraglide/messages/settings_paged_view_offset.d.ts +4 -0
- package/dist/paraglide/messages/settings_paged_view_offset.js +33 -0
- package/dist/paraglide/messages/settings_thumbnail_height.d.ts +4 -0
- package/dist/paraglide/messages/settings_thumbnail_height.js +34 -0
- package/dist/paraglide/messages/settings_toggle_show_viewing_mode.js +3 -2
- package/dist/paraglide/messages/settings_view_configuration.d.ts +4 -0
- package/dist/paraglide/messages/settings_view_configuration.js +34 -0
- package/dist/plugins/annotation-editor.js +493 -623
- package/dist/plugins/image-manipulation.js +3 -3
- package/dist/state/viewer.svelte.js +5 -1
- package/dist/triiiceratops-bundle.js +1787 -1711
- package/dist/triiiceratops-element.iife.js +15 -15
- package/dist/triiiceratops.css +1 -1
- package/dist/types/config.d.ts +5 -0
- package/package.json +1 -1
- package/dist/annotation_tool_point-Do_1lOD_.js +0 -290
|
@@ -0,0 +1,523 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { m } from '../state/i18n.svelte';
|
|
3
|
+
import Check from 'phosphor-svelte/lib/Check';
|
|
4
|
+
import Copy from 'phosphor-svelte/lib/Copy';
|
|
5
|
+
|
|
6
|
+
let { config = $bindable(), class: className = '' } = $props();
|
|
7
|
+
|
|
8
|
+
let copied = $state(false);
|
|
9
|
+
|
|
10
|
+
function copyConfig() {
|
|
11
|
+
navigator.clipboard.writeText(JSON.stringify(config, null, 2));
|
|
12
|
+
copied = true;
|
|
13
|
+
setTimeout(() => {
|
|
14
|
+
copied = false;
|
|
15
|
+
}, 2000);
|
|
16
|
+
}
|
|
17
|
+
</script>
|
|
18
|
+
|
|
19
|
+
<ul class={className}>
|
|
20
|
+
<li class="menu-title px-4 py-2">
|
|
21
|
+
{m.settings_category_general()}
|
|
22
|
+
</li>
|
|
23
|
+
<li>
|
|
24
|
+
<label class="label cursor-pointer py-1">
|
|
25
|
+
<span class="label-text">{m.settings_transparent_background()}</span
|
|
26
|
+
>
|
|
27
|
+
<input
|
|
28
|
+
type="checkbox"
|
|
29
|
+
class="toggle toggle-sm"
|
|
30
|
+
bind:checked={config.transparentBackground}
|
|
31
|
+
/>
|
|
32
|
+
</label>
|
|
33
|
+
</li>
|
|
34
|
+
<li>
|
|
35
|
+
<label class="label cursor-pointer py-1">
|
|
36
|
+
<span class="label-text">{m.settings_toggle_canvas_nav()}</span>
|
|
37
|
+
<input
|
|
38
|
+
type="checkbox"
|
|
39
|
+
class="toggle toggle-sm"
|
|
40
|
+
bind:checked={config.showCanvasNav}
|
|
41
|
+
/>
|
|
42
|
+
</label>
|
|
43
|
+
</li>
|
|
44
|
+
<li>
|
|
45
|
+
<label class="label cursor-pointer py-1">
|
|
46
|
+
<span class="label-text">{m.settings_toggle_zoom_controls()}</span>
|
|
47
|
+
<input
|
|
48
|
+
type="checkbox"
|
|
49
|
+
class="toggle toggle-sm"
|
|
50
|
+
bind:checked={config.showZoomControls}
|
|
51
|
+
/>
|
|
52
|
+
</label>
|
|
53
|
+
</li>
|
|
54
|
+
|
|
55
|
+
<div class="divider my-1"></div>
|
|
56
|
+
|
|
57
|
+
<li class="menu-title px-4 py-2">
|
|
58
|
+
{m.settings_category_configuration()}
|
|
59
|
+
</li>
|
|
60
|
+
|
|
61
|
+
<li>
|
|
62
|
+
<details>
|
|
63
|
+
<summary>{m.settings_submenu_toolbar()}</summary>
|
|
64
|
+
<ul>
|
|
65
|
+
<li>
|
|
66
|
+
<label class="label cursor-pointer py-1">
|
|
67
|
+
<span class="label-text"
|
|
68
|
+
>{m.settings_toggle_show_toggle()}</span
|
|
69
|
+
>
|
|
70
|
+
<input
|
|
71
|
+
type="checkbox"
|
|
72
|
+
class="toggle toggle-sm"
|
|
73
|
+
checked={config.showToggle !== false}
|
|
74
|
+
onchange={(e) => {
|
|
75
|
+
config.showToggle = e.currentTarget.checked;
|
|
76
|
+
}}
|
|
77
|
+
/>
|
|
78
|
+
</label>
|
|
79
|
+
</li>
|
|
80
|
+
<li>
|
|
81
|
+
<label class="label cursor-pointer py-1">
|
|
82
|
+
<span class="label-text"
|
|
83
|
+
>{m.settings_toolbar_open()}</span
|
|
84
|
+
>
|
|
85
|
+
<input
|
|
86
|
+
type="checkbox"
|
|
87
|
+
class="toggle toggle-sm"
|
|
88
|
+
bind:checked={config.toolbarOpen}
|
|
89
|
+
/>
|
|
90
|
+
</label>
|
|
91
|
+
</li>
|
|
92
|
+
<li>
|
|
93
|
+
<label class="label cursor-pointer py-1">
|
|
94
|
+
<span class="label-text"
|
|
95
|
+
>{m.settings_toolbar_position()}</span
|
|
96
|
+
>
|
|
97
|
+
<select
|
|
98
|
+
class="select select-bordered select-xs w-24"
|
|
99
|
+
value={config.toolbarPosition ?? 'left'}
|
|
100
|
+
onchange={(e) => {
|
|
101
|
+
config.toolbarPosition = (
|
|
102
|
+
e.currentTarget as HTMLSelectElement
|
|
103
|
+
).value as 'left' | 'right' | 'top';
|
|
104
|
+
}}
|
|
105
|
+
>
|
|
106
|
+
<option value="left"
|
|
107
|
+
>{m.settings_position_left()}</option
|
|
108
|
+
>
|
|
109
|
+
<option value="right"
|
|
110
|
+
>{m.settings_position_right()}</option
|
|
111
|
+
>
|
|
112
|
+
<option value="top"
|
|
113
|
+
>{m.settings_position_top()}</option
|
|
114
|
+
>
|
|
115
|
+
</select>
|
|
116
|
+
</label>
|
|
117
|
+
</li>
|
|
118
|
+
<div class="divider my-1"></div>
|
|
119
|
+
<li>
|
|
120
|
+
<label class="label cursor-pointer py-1">
|
|
121
|
+
<span class="label-text"
|
|
122
|
+
>{m.settings_toggle_show_search()}</span
|
|
123
|
+
>
|
|
124
|
+
<input
|
|
125
|
+
type="checkbox"
|
|
126
|
+
class="checkbox checkbox-xs"
|
|
127
|
+
checked={config.toolbar?.showSearch ?? true}
|
|
128
|
+
onchange={(e) => {
|
|
129
|
+
if (!config.toolbar) config.toolbar = {};
|
|
130
|
+
config.toolbar.showSearch =
|
|
131
|
+
e.currentTarget.checked;
|
|
132
|
+
}}
|
|
133
|
+
/>
|
|
134
|
+
</label>
|
|
135
|
+
</li>
|
|
136
|
+
<li>
|
|
137
|
+
<label class="label cursor-pointer py-1">
|
|
138
|
+
<span class="label-text"
|
|
139
|
+
>{m.settings_toggle_show_gallery()}</span
|
|
140
|
+
>
|
|
141
|
+
<input
|
|
142
|
+
type="checkbox"
|
|
143
|
+
class="checkbox checkbox-xs"
|
|
144
|
+
checked={config.toolbar?.showGallery ?? true}
|
|
145
|
+
onchange={(e) => {
|
|
146
|
+
if (!config.toolbar) config.toolbar = {};
|
|
147
|
+
config.toolbar.showGallery =
|
|
148
|
+
e.currentTarget.checked;
|
|
149
|
+
}}
|
|
150
|
+
/>
|
|
151
|
+
</label>
|
|
152
|
+
</li>
|
|
153
|
+
<li>
|
|
154
|
+
<label class="label cursor-pointer py-1">
|
|
155
|
+
<span class="label-text"
|
|
156
|
+
>{m.settings_toggle_show_annotations()}</span
|
|
157
|
+
>
|
|
158
|
+
<input
|
|
159
|
+
type="checkbox"
|
|
160
|
+
class="checkbox checkbox-xs"
|
|
161
|
+
checked={config.toolbar?.showAnnotations ?? true}
|
|
162
|
+
onchange={(e) => {
|
|
163
|
+
if (!config.toolbar) config.toolbar = {};
|
|
164
|
+
config.toolbar.showAnnotations =
|
|
165
|
+
e.currentTarget.checked;
|
|
166
|
+
}}
|
|
167
|
+
/>
|
|
168
|
+
</label>
|
|
169
|
+
</li>
|
|
170
|
+
<li>
|
|
171
|
+
<label class="label cursor-pointer py-1">
|
|
172
|
+
<span class="label-text"
|
|
173
|
+
>{m.settings_toggle_show_fullscreen()}</span
|
|
174
|
+
>
|
|
175
|
+
<input
|
|
176
|
+
type="checkbox"
|
|
177
|
+
class="checkbox checkbox-xs"
|
|
178
|
+
checked={config.toolbar?.showFullscreen ?? true}
|
|
179
|
+
onchange={(e) => {
|
|
180
|
+
if (!config.toolbar) config.toolbar = {};
|
|
181
|
+
config.toolbar.showFullscreen =
|
|
182
|
+
e.currentTarget.checked;
|
|
183
|
+
}}
|
|
184
|
+
/>
|
|
185
|
+
</label>
|
|
186
|
+
</li>
|
|
187
|
+
<li>
|
|
188
|
+
<label class="label cursor-pointer py-1">
|
|
189
|
+
<span class="label-text"
|
|
190
|
+
>{m.settings_toggle_show_info()}</span
|
|
191
|
+
>
|
|
192
|
+
<input
|
|
193
|
+
type="checkbox"
|
|
194
|
+
class="checkbox checkbox-xs"
|
|
195
|
+
checked={config.toolbar?.showInfo ?? true}
|
|
196
|
+
onchange={(e) => {
|
|
197
|
+
if (!config.toolbar) config.toolbar = {};
|
|
198
|
+
config.toolbar.showInfo =
|
|
199
|
+
e.currentTarget.checked;
|
|
200
|
+
}}
|
|
201
|
+
/>
|
|
202
|
+
</label>
|
|
203
|
+
</li>
|
|
204
|
+
<li>
|
|
205
|
+
<label class="label cursor-pointer py-1">
|
|
206
|
+
<span class="label-text"
|
|
207
|
+
>{m.settings_toggle_show_viewing_mode()}</span
|
|
208
|
+
>
|
|
209
|
+
<input
|
|
210
|
+
type="checkbox"
|
|
211
|
+
class="checkbox checkbox-xs"
|
|
212
|
+
checked={config.toolbar?.showViewingMode ?? true}
|
|
213
|
+
onchange={(e) => {
|
|
214
|
+
if (!config.toolbar) config.toolbar = {};
|
|
215
|
+
config.toolbar.showViewingMode =
|
|
216
|
+
e.currentTarget.checked;
|
|
217
|
+
}}
|
|
218
|
+
/>
|
|
219
|
+
</label>
|
|
220
|
+
</li>
|
|
221
|
+
<li>
|
|
222
|
+
<label class="label cursor-pointer py-1">
|
|
223
|
+
<span class="label-text">{m.viewing_mode_label()}</span>
|
|
224
|
+
<select
|
|
225
|
+
class="select select-bordered select-xs"
|
|
226
|
+
value={config.viewingMode ?? 'individuals'}
|
|
227
|
+
onchange={(e) => {
|
|
228
|
+
config.viewingMode = (
|
|
229
|
+
e.currentTarget as HTMLSelectElement
|
|
230
|
+
).value as 'individuals' | 'paged';
|
|
231
|
+
}}
|
|
232
|
+
>
|
|
233
|
+
<option value="individuals"
|
|
234
|
+
>{m.viewing_mode_individuals()}</option
|
|
235
|
+
>
|
|
236
|
+
<option value="paged"
|
|
237
|
+
>{m.viewing_mode_paged()}</option
|
|
238
|
+
>
|
|
239
|
+
</select>
|
|
240
|
+
</label>
|
|
241
|
+
</li>
|
|
242
|
+
<li>
|
|
243
|
+
<label class="label cursor-pointer py-1">
|
|
244
|
+
<span class="label-text"
|
|
245
|
+
>{m.settings_paged_view_offset()}</span
|
|
246
|
+
>
|
|
247
|
+
<input
|
|
248
|
+
type="checkbox"
|
|
249
|
+
class="checkbox checkbox-xs"
|
|
250
|
+
checked={config.pagedViewOffset ?? true}
|
|
251
|
+
onchange={(e) => {
|
|
252
|
+
config.pagedViewOffset =
|
|
253
|
+
e.currentTarget.checked;
|
|
254
|
+
}}
|
|
255
|
+
/>
|
|
256
|
+
</label>
|
|
257
|
+
</li>
|
|
258
|
+
</ul>
|
|
259
|
+
</details>
|
|
260
|
+
</li>
|
|
261
|
+
|
|
262
|
+
<li>
|
|
263
|
+
<details>
|
|
264
|
+
<summary>{m.settings_submenu_gallery()}</summary>
|
|
265
|
+
<ul>
|
|
266
|
+
<li>
|
|
267
|
+
<label class="label cursor-pointer py-1">
|
|
268
|
+
<span class="label-text"
|
|
269
|
+
>{m.settings_toggle_open()}</span
|
|
270
|
+
>
|
|
271
|
+
<input
|
|
272
|
+
type="checkbox"
|
|
273
|
+
class="toggle toggle-xs"
|
|
274
|
+
checked={config.gallery?.open ?? false}
|
|
275
|
+
onchange={(e) => {
|
|
276
|
+
if (!config.gallery) config.gallery = {};
|
|
277
|
+
config.gallery.open = e.currentTarget.checked;
|
|
278
|
+
}}
|
|
279
|
+
/>
|
|
280
|
+
</label>
|
|
281
|
+
</li>
|
|
282
|
+
<li>
|
|
283
|
+
<label class="label cursor-pointer py-1">
|
|
284
|
+
<span class="label-text"
|
|
285
|
+
>{m.settings_toggle_draggable()}</span
|
|
286
|
+
>
|
|
287
|
+
<input
|
|
288
|
+
type="checkbox"
|
|
289
|
+
class="checkbox checkbox-xs"
|
|
290
|
+
checked={config.gallery?.draggable ?? true}
|
|
291
|
+
onchange={(e) => {
|
|
292
|
+
if (!config.gallery) config.gallery = {};
|
|
293
|
+
config.gallery.draggable =
|
|
294
|
+
e.currentTarget.checked;
|
|
295
|
+
}}
|
|
296
|
+
/>
|
|
297
|
+
</label>
|
|
298
|
+
</li>
|
|
299
|
+
<li>
|
|
300
|
+
<label class="label cursor-pointer py-1">
|
|
301
|
+
<span class="label-text"
|
|
302
|
+
>{m.settings_toggle_close_button()}</span
|
|
303
|
+
>
|
|
304
|
+
<input
|
|
305
|
+
type="checkbox"
|
|
306
|
+
class="checkbox checkbox-xs"
|
|
307
|
+
checked={config.gallery?.showCloseButton ?? true}
|
|
308
|
+
onchange={(e) => {
|
|
309
|
+
if (!config.gallery) config.gallery = {};
|
|
310
|
+
config.gallery.showCloseButton =
|
|
311
|
+
e.currentTarget.checked;
|
|
312
|
+
}}
|
|
313
|
+
/>
|
|
314
|
+
</label>
|
|
315
|
+
</li>
|
|
316
|
+
<li>
|
|
317
|
+
<label class="label cursor-pointer py-1 gap-2">
|
|
318
|
+
<span class="label-text"
|
|
319
|
+
>{m.settings_select_dock_position()}</span
|
|
320
|
+
>
|
|
321
|
+
<select
|
|
322
|
+
class="select select-bordered select-xs w-24"
|
|
323
|
+
value={config.gallery?.dockPosition ?? 'bottom'}
|
|
324
|
+
onchange={(e) => {
|
|
325
|
+
if (!config.gallery) config.gallery = {};
|
|
326
|
+
config.gallery.dockPosition = (
|
|
327
|
+
e.currentTarget as HTMLSelectElement
|
|
328
|
+
).value;
|
|
329
|
+
}}
|
|
330
|
+
onclick={(e) => e.stopPropagation()}
|
|
331
|
+
>
|
|
332
|
+
<option value="bottom"
|
|
333
|
+
>{m.settings_position_bottom()}</option
|
|
334
|
+
>
|
|
335
|
+
<option value="top"
|
|
336
|
+
>{m.settings_position_top()}</option
|
|
337
|
+
>
|
|
338
|
+
<option value="left"
|
|
339
|
+
>{m.settings_position_left()}</option
|
|
340
|
+
>
|
|
341
|
+
<option value="right"
|
|
342
|
+
>{m.settings_position_right()}</option
|
|
343
|
+
>
|
|
344
|
+
<option value="none"
|
|
345
|
+
>{m.settings_position_floating()}</option
|
|
346
|
+
>
|
|
347
|
+
</select>
|
|
348
|
+
</label>
|
|
349
|
+
</li>
|
|
350
|
+
<li>
|
|
351
|
+
<label class="label cursor-pointer py-1 gap-2">
|
|
352
|
+
<span class="label-text"
|
|
353
|
+
>{m.settings_thumbnail_height()}</span
|
|
354
|
+
>
|
|
355
|
+
<input
|
|
356
|
+
type="range"
|
|
357
|
+
min="50"
|
|
358
|
+
max="300"
|
|
359
|
+
value={config.gallery?.fixedHeight ?? 120}
|
|
360
|
+
class="range range-xs range-primary w-24"
|
|
361
|
+
oninput={(e) => {
|
|
362
|
+
if (!config.gallery) config.gallery = {};
|
|
363
|
+
config.gallery.fixedHeight = parseInt(
|
|
364
|
+
e.currentTarget.value,
|
|
365
|
+
);
|
|
366
|
+
}}
|
|
367
|
+
/>
|
|
368
|
+
<span class="text-xs opacity-50 w-8 text-right"
|
|
369
|
+
>{config.gallery?.fixedHeight ?? 120}px</span
|
|
370
|
+
>
|
|
371
|
+
</label>
|
|
372
|
+
</li>
|
|
373
|
+
</ul>
|
|
374
|
+
</details>
|
|
375
|
+
</li>
|
|
376
|
+
|
|
377
|
+
<li>
|
|
378
|
+
<details>
|
|
379
|
+
<summary>{m.settings_submenu_search()}</summary>
|
|
380
|
+
<ul>
|
|
381
|
+
<li>
|
|
382
|
+
<label class="label cursor-pointer py-1">
|
|
383
|
+
<span class="label-text"
|
|
384
|
+
>{m.settings_toggle_open()}</span
|
|
385
|
+
>
|
|
386
|
+
<input
|
|
387
|
+
type="checkbox"
|
|
388
|
+
class="toggle toggle-xs"
|
|
389
|
+
checked={config.search?.open ?? false}
|
|
390
|
+
onchange={(e) => {
|
|
391
|
+
if (!config.search) config.search = {};
|
|
392
|
+
config.search.open = e.currentTarget.checked;
|
|
393
|
+
}}
|
|
394
|
+
/>
|
|
395
|
+
</label>
|
|
396
|
+
</li>
|
|
397
|
+
<li>
|
|
398
|
+
<label class="label cursor-pointer py-1">
|
|
399
|
+
<span class="label-text"
|
|
400
|
+
>{m.settings_toggle_close_button()}</span
|
|
401
|
+
>
|
|
402
|
+
<input
|
|
403
|
+
type="checkbox"
|
|
404
|
+
class="checkbox checkbox-xs"
|
|
405
|
+
checked={config.search?.showCloseButton ?? true}
|
|
406
|
+
onchange={(e) => {
|
|
407
|
+
if (!config.search) config.search = {};
|
|
408
|
+
config.search.showCloseButton =
|
|
409
|
+
e.currentTarget.checked;
|
|
410
|
+
}}
|
|
411
|
+
/>
|
|
412
|
+
</label>
|
|
413
|
+
</li>
|
|
414
|
+
<li>
|
|
415
|
+
<label class="label cursor-pointer py-1 gap-2">
|
|
416
|
+
<span class="label-text"
|
|
417
|
+
>{m.settings_select_dock_position()}</span
|
|
418
|
+
>
|
|
419
|
+
<select
|
|
420
|
+
class="select select-bordered select-xs w-24"
|
|
421
|
+
value={config.search?.position ?? 'right'}
|
|
422
|
+
onchange={(e) => {
|
|
423
|
+
if (!config.search) config.search = {};
|
|
424
|
+
config.search.position = (
|
|
425
|
+
e.currentTarget as HTMLSelectElement
|
|
426
|
+
).value;
|
|
427
|
+
}}
|
|
428
|
+
onclick={(e) => e.stopPropagation()}
|
|
429
|
+
>
|
|
430
|
+
<option value="right"
|
|
431
|
+
>{m.settings_position_right()}</option
|
|
432
|
+
>
|
|
433
|
+
<option value="left"
|
|
434
|
+
>{m.settings_position_left()}</option
|
|
435
|
+
>
|
|
436
|
+
</select>
|
|
437
|
+
</label>
|
|
438
|
+
</li>
|
|
439
|
+
<li>
|
|
440
|
+
<label class="label cursor-pointer py-1 gap-2">
|
|
441
|
+
<span class="label-text"
|
|
442
|
+
>{m.settings_panel_width()}</span
|
|
443
|
+
>
|
|
444
|
+
<input
|
|
445
|
+
type="range"
|
|
446
|
+
min="200"
|
|
447
|
+
max="800"
|
|
448
|
+
value={parseInt(config.search?.width ?? '320')}
|
|
449
|
+
class="range range-xs range-primary w-32"
|
|
450
|
+
oninput={(e) => {
|
|
451
|
+
if (!config.search) config.search = {};
|
|
452
|
+
config.search.width = `${e.currentTarget.value}px`;
|
|
453
|
+
}}
|
|
454
|
+
/>
|
|
455
|
+
<span class="text-xs opacity-50 w-8 text-right"
|
|
456
|
+
>{config.search?.width ?? '320px'}</span
|
|
457
|
+
>
|
|
458
|
+
</label>
|
|
459
|
+
</li>
|
|
460
|
+
</ul>
|
|
461
|
+
</details>
|
|
462
|
+
</li>
|
|
463
|
+
|
|
464
|
+
<li>
|
|
465
|
+
<details>
|
|
466
|
+
<summary>{m.settings_submenu_annotations()}</summary>
|
|
467
|
+
<ul>
|
|
468
|
+
<li>
|
|
469
|
+
<label class="label cursor-pointer py-1">
|
|
470
|
+
<span class="label-text"
|
|
471
|
+
>{m.settings_toggle_panel_open()}</span
|
|
472
|
+
>
|
|
473
|
+
<input
|
|
474
|
+
type="checkbox"
|
|
475
|
+
class="toggle toggle-xs"
|
|
476
|
+
checked={config.annotations?.open ?? false}
|
|
477
|
+
onchange={(e) => {
|
|
478
|
+
if (!config.annotations)
|
|
479
|
+
config.annotations = {};
|
|
480
|
+
config.annotations.open =
|
|
481
|
+
e.currentTarget.checked;
|
|
482
|
+
}}
|
|
483
|
+
/>
|
|
484
|
+
</label>
|
|
485
|
+
</li>
|
|
486
|
+
<li>
|
|
487
|
+
<label class="label cursor-pointer py-1">
|
|
488
|
+
<span class="label-text"
|
|
489
|
+
>{m.settings_toggle_visible_by_default()}</span
|
|
490
|
+
>
|
|
491
|
+
<input
|
|
492
|
+
type="checkbox"
|
|
493
|
+
class="checkbox checkbox-xs"
|
|
494
|
+
checked={config.annotations?.visible ?? true}
|
|
495
|
+
onchange={(e) => {
|
|
496
|
+
if (!config.annotations)
|
|
497
|
+
config.annotations = {};
|
|
498
|
+
config.annotations.visible =
|
|
499
|
+
e.currentTarget.checked;
|
|
500
|
+
}}
|
|
501
|
+
/>
|
|
502
|
+
</label>
|
|
503
|
+
</li>
|
|
504
|
+
</ul>
|
|
505
|
+
</details>
|
|
506
|
+
</li>
|
|
507
|
+
<div class="divider my-1"></div>
|
|
508
|
+
<li>
|
|
509
|
+
<button
|
|
510
|
+
class="btn btn-sm btn-ghost w-full justify-start gap-2"
|
|
511
|
+
class:text-success={copied}
|
|
512
|
+
onclick={copyConfig}
|
|
513
|
+
>
|
|
514
|
+
{#if copied}
|
|
515
|
+
<Check size={16} />
|
|
516
|
+
{m.copied()}
|
|
517
|
+
{:else}
|
|
518
|
+
<Copy size={16} />
|
|
519
|
+
{m.copy_config()}
|
|
520
|
+
{/if}
|
|
521
|
+
</button>
|
|
522
|
+
</li>
|
|
523
|
+
</ul>
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
import List from 'phosphor-svelte/lib/List';
|
|
10
10
|
import BookOpen from 'phosphor-svelte/lib/BookOpen';
|
|
11
11
|
import Scroll from 'phosphor-svelte/lib/Scroll';
|
|
12
|
+
import Check from 'phosphor-svelte/lib/Check';
|
|
12
13
|
import X from 'phosphor-svelte/lib/X';
|
|
13
14
|
import { VIEWER_STATE_KEY, type ViewerState } from '../state/viewer.svelte';
|
|
14
15
|
import { m, language } from '../state/i18n.svelte';
|
|
@@ -220,7 +221,12 @@
|
|
|
220
221
|
viewerState.setViewingMode('individuals')}
|
|
221
222
|
>
|
|
222
223
|
<Scroll size={16} />
|
|
223
|
-
|
|
224
|
+
<span class="flex-1"
|
|
225
|
+
>{m.viewing_mode_individuals()}</span
|
|
226
|
+
>
|
|
227
|
+
{#if viewerState.viewingMode === 'individuals'}
|
|
228
|
+
<Check size={16} weight="bold" />
|
|
229
|
+
{/if}
|
|
224
230
|
</button>
|
|
225
231
|
</li>
|
|
226
232
|
<li>
|
|
@@ -232,7 +238,12 @@
|
|
|
232
238
|
viewerState.setViewingMode('paged')}
|
|
233
239
|
>
|
|
234
240
|
<BookOpen size={16} />
|
|
235
|
-
|
|
241
|
+
<span class="flex-1"
|
|
242
|
+
>{m.viewing_mode_paged()}</span
|
|
243
|
+
>
|
|
244
|
+
{#if viewerState.viewingMode === 'paged'}
|
|
245
|
+
<Check size={16} weight="bold" />
|
|
246
|
+
{/if}
|
|
236
247
|
</button>
|
|
237
248
|
</li>
|
|
238
249
|
{#if viewerState.viewingMode === 'paged'}
|
|
@@ -232,8 +232,17 @@
|
|
|
232
232
|
|
|
233
233
|
const canvas = canvases[currentCanvasIndex];
|
|
234
234
|
|
|
235
|
-
//
|
|
236
|
-
|
|
235
|
+
// Helper to get images from a canvas, with v3 fallback
|
|
236
|
+
// v2 uses getImages(), v3 uses getContent() for painting annotations
|
|
237
|
+
const getCanvasImages = (c: any): any[] => {
|
|
238
|
+
let imgs = c.getImages?.() || [];
|
|
239
|
+
if ((!imgs || !imgs.length) && c.getContent) {
|
|
240
|
+
imgs = c.getContent();
|
|
241
|
+
}
|
|
242
|
+
return imgs || [];
|
|
243
|
+
};
|
|
244
|
+
|
|
245
|
+
let images = getCanvasImages(canvas);
|
|
237
246
|
if (internalViewerState.viewingMode === 'paged') {
|
|
238
247
|
// Single pages at the start: pagedOffset (default 0, shifted = 1)
|
|
239
248
|
const singlePages = internalViewerState.pagedOffset;
|
|
@@ -242,17 +251,12 @@
|
|
|
242
251
|
const nextIndex = currentCanvasIndex + 1;
|
|
243
252
|
if (nextIndex < canvases.length) {
|
|
244
253
|
const nextCanvas = canvases[nextIndex];
|
|
245
|
-
const nextImages = nextCanvas
|
|
254
|
+
const nextImages = getCanvasImages(nextCanvas);
|
|
246
255
|
images = images.concat(nextImages);
|
|
247
256
|
}
|
|
248
257
|
}
|
|
249
258
|
}
|
|
250
259
|
|
|
251
|
-
// Fallback for IIIF v3: iterate content if images is empty
|
|
252
|
-
if ((!images || !images.length) && canvas.getContent) {
|
|
253
|
-
images = canvas.getContent();
|
|
254
|
-
}
|
|
255
|
-
|
|
256
260
|
if (!images || !images.length) {
|
|
257
261
|
// Check for raw v3 items
|
|
258
262
|
if (canvas.__jsonld && canvas.__jsonld.items) {
|
|
@@ -330,6 +334,30 @@
|
|
|
330
334
|
}
|
|
331
335
|
|
|
332
336
|
if (services.length > 0) {
|
|
337
|
+
// Matches IIIF Image API profile URIs with http or https scheme
|
|
338
|
+
const iiifImageApiPattern = /^https?:\/\/iiif\.io\/api\/image\//;
|
|
339
|
+
|
|
340
|
+
// IIIF allows profile as a string, array, or containing objects
|
|
341
|
+
// Shorthand levels (level0, level1, level2) are valid per spec
|
|
342
|
+
const isIiifImageProfile = (p: unknown): boolean => {
|
|
343
|
+
if (typeof p === 'string') {
|
|
344
|
+
return (
|
|
345
|
+
iiifImageApiPattern.test(p) ||
|
|
346
|
+
p === 'level0' ||
|
|
347
|
+
p === 'level1' ||
|
|
348
|
+
p === 'level2'
|
|
349
|
+
);
|
|
350
|
+
}
|
|
351
|
+
if (Array.isArray(p)) {
|
|
352
|
+
return p.some(
|
|
353
|
+
(item) =>
|
|
354
|
+
typeof item === 'string' &&
|
|
355
|
+
isIiifImageProfile(item),
|
|
356
|
+
);
|
|
357
|
+
}
|
|
358
|
+
return false;
|
|
359
|
+
};
|
|
360
|
+
|
|
333
361
|
// Find a valid image service
|
|
334
362
|
const service = services.find((s: any) => {
|
|
335
363
|
const type = s.getType
|
|
@@ -340,9 +368,7 @@
|
|
|
340
368
|
type === 'ImageService1' ||
|
|
341
369
|
type === 'ImageService2' ||
|
|
342
370
|
type === 'ImageService3' ||
|
|
343
|
-
(
|
|
344
|
-
profile.includes('http://iiif.io/api/image')) ||
|
|
345
|
-
(typeof profile === 'string' && profile === 'level0')
|
|
371
|
+
isIiifImageProfile(profile)
|
|
346
372
|
);
|
|
347
373
|
});
|
|
348
374
|
|
|
@@ -126,6 +126,10 @@ export * from "./viewing_mode_individuals.js";
|
|
|
126
126
|
export * from "./viewing_mode_paged.js";
|
|
127
127
|
export * from "./viewing_mode_shift_pairing.js";
|
|
128
128
|
export * from "./settings_toggle_show_viewing_mode.js";
|
|
129
|
+
export * from "./demo_title.js";
|
|
130
|
+
export * from "./settings_view_configuration.js";
|
|
131
|
+
export * from "./settings_paged_view_offset.js";
|
|
132
|
+
export * from "./settings_thumbnail_height.js";
|
|
129
133
|
export * from "./toggle_two_page_mode.js";
|
|
130
134
|
export * from "./toggle_single_page_mode.js";
|
|
131
135
|
export * from "./show_mode_toggle.js";
|
|
@@ -128,6 +128,10 @@ export * from './viewing_mode_individuals.js'
|
|
|
128
128
|
export * from './viewing_mode_paged.js'
|
|
129
129
|
export * from './viewing_mode_shift_pairing.js'
|
|
130
130
|
export * from './settings_toggle_show_viewing_mode.js'
|
|
131
|
+
export * from './demo_title.js'
|
|
132
|
+
export * from './settings_view_configuration.js'
|
|
133
|
+
export * from './settings_paged_view_offset.js'
|
|
134
|
+
export * from './settings_thumbnail_height.js'
|
|
131
135
|
export * from './toggle_two_page_mode.js'
|
|
132
136
|
export * from './toggle_single_page_mode.js'
|
|
133
137
|
export * from './show_mode_toggle.js'
|