@3cr/viewer-browser 0.0.61 → 0.0.62

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.
Files changed (54) hide show
  1. package/components.d.ts +1 -0
  2. package/coverage/.tmp/coverage-100.json +1 -0
  3. package/coverage/.tmp/coverage-101.json +1 -0
  4. package/coverage/.tmp/coverage-102.json +1 -0
  5. package/coverage/.tmp/coverage-103.json +1 -0
  6. package/coverage/.tmp/coverage-104.json +1 -0
  7. package/coverage/.tmp/coverage-105.json +1 -0
  8. package/coverage/.tmp/coverage-106.json +1 -0
  9. package/coverage/.tmp/coverage-107.json +1 -0
  10. package/coverage/.tmp/coverage-108.json +1 -0
  11. package/coverage/.tmp/coverage-109.json +1 -0
  12. package/coverage/.tmp/coverage-110.json +1 -0
  13. package/coverage/.tmp/coverage-98.json +1 -0
  14. package/coverage/.tmp/coverage-99.json +1 -0
  15. package/dist/Viewer3CR.js +11 -11
  16. package/dist/Viewer3CR.mjs +5524 -5403
  17. package/dist/Viewer3CR.umd.js +11 -11
  18. package/package.json +2 -1
  19. package/src/components/modal/DemoPatientModal.vue +59 -0
  20. package/src/components/modal/MftpWebGL3DRModal.vue +56 -9
  21. package/src/components/modal/__tests__/mftp-webgl-3dr-modal.spec.ts +37 -1
  22. package/coverage/3cr-viewer-browser/index.html +0 -116
  23. package/coverage/3cr-viewer-browser/index.ts.html +0 -211
  24. package/coverage/3cr-viewer-browser/src/App.vue.html +0 -313
  25. package/coverage/3cr-viewer-browser/src/components/WebGL3DR.vue.html +0 -442
  26. package/coverage/3cr-viewer-browser/src/components/icons/index.html +0 -116
  27. package/coverage/3cr-viewer-browser/src/components/icons/liver.vue.html +0 -148
  28. package/coverage/3cr-viewer-browser/src/components/index.html +0 -116
  29. package/coverage/3cr-viewer-browser/src/components/loading/LoadingSpinner.vue.html +0 -556
  30. package/coverage/3cr-viewer-browser/src/components/loading/index.html +0 -116
  31. package/coverage/3cr-viewer-browser/src/components/modal/MftpWebGL3DRModal.vue.html +0 -4126
  32. package/coverage/3cr-viewer-browser/src/components/modal/index.html +0 -116
  33. package/coverage/3cr-viewer-browser/src/components/selectors/ValueSelector.vue.html +0 -331
  34. package/coverage/3cr-viewer-browser/src/components/selectors/index.html +0 -116
  35. package/coverage/3cr-viewer-browser/src/components/sliders/DoubleSliderSelector.vue.html +0 -445
  36. package/coverage/3cr-viewer-browser/src/components/sliders/VerticalSliderSelector.vue.html +0 -349
  37. package/coverage/3cr-viewer-browser/src/components/sliders/index.html +0 -131
  38. package/coverage/3cr-viewer-browser/src/helpers/index.html +0 -146
  39. package/coverage/3cr-viewer-browser/src/helpers/layoutOverlayStyle.ts.html +0 -406
  40. package/coverage/3cr-viewer-browser/src/helpers/modelHelper.ts.html +0 -412
  41. package/coverage/3cr-viewer-browser/src/helpers/utils.ts.html +0 -133
  42. package/coverage/3cr-viewer-browser/src/index.html +0 -131
  43. package/coverage/3cr-viewer-browser/src/main.ts.html +0 -124
  44. package/coverage/3cr-viewer-browser/src/plugins/index.html +0 -131
  45. package/coverage/3cr-viewer-browser/src/plugins/index.ts.html +0 -130
  46. package/coverage/3cr-viewer-browser/src/plugins/vuetify.ts.html +0 -220
  47. package/coverage/base.css +0 -224
  48. package/coverage/block-navigation.js +0 -87
  49. package/coverage/favicon.png +0 -0
  50. package/coverage/index.html +0 -251
  51. package/coverage/prettify.css +0 -1
  52. package/coverage/prettify.js +0 -2
  53. package/coverage/sort-arrow-sprite.png +0 -0
  54. package/coverage/sorter.js +0 -196
package/coverage/3cr-viewer-browser/src/components/loading/LoadingSpinner.vue.html DELETED
@@ -1,556 +0,0 @@
1
-
2
- <!doctype html>
3
- <html lang="en">
4
-
5
- <head>
6
- <title>Code coverage report for 3cr-viewer-browser/src/components/loading/LoadingSpinner.vue</title>
7
- <meta charset="utf-8" />
8
- <link rel="stylesheet" href="../../../../prettify.css" />
9
- <link rel="stylesheet" href="../../../../base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="../../../../favicon.png" />
11
- <meta name="viewport" content="width=device-width, initial-scale=1" />
12
- <style type='text/css'>
13
- .coverage-summary .sorter {
14
- background-image: url(../../../../sort-arrow-sprite.png);
15
- }
16
- </style>
17
- </head>
18
-
19
- <body>
20
- <div class='wrapper'>
21
- <div class='pad1'>
22
- <h1><a href="../../../../index.html">All files</a> / <a href="index.html">3cr-viewer-browser/src/components/loading</a> LoadingSpinner.vue</h1>
23
- <div class='clearfix'>
24
-
25
- <div class='fl pad1y space-right2'>
26
- <span class="strong">100% </span>
27
- <span class="quiet">Statements</span>
28
- <span class='fraction'>157/157</span>
29
- </div>
30
-
31
-
32
- <div class='fl pad1y space-right2'>
33
- <span class="strong">100% </span>
34
- <span class="quiet">Branches</span>
35
- <span class='fraction'>0/0</span>
36
- </div>
37
-
38
-
39
- <div class='fl pad1y space-right2'>
40
- <span class="strong">100% </span>
41
- <span class="quiet">Functions</span>
42
- <span class='fraction'>0/0</span>
43
- </div>
44
-
45
-
46
- <div class='fl pad1y space-right2'>
47
- <span class="strong">100% </span>
48
- <span class="quiet">Lines</span>
49
- <span class='fraction'>157/157</span>
50
- </div>
51
-
52
-
53
- </div>
54
- <p class="quiet">
55
- Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
- </p>
57
- <template id="filterTemplate">
58
- <div class="quiet">
59
- Filter:
60
- <input type="search" id="fileSearch">
61
- </div>
62
- </template>
63
- </div>
64
- <div class='status-line high'></div>
65
- <pre><table class="coverage">
66
- <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
- <a name='L2'></a><a href='#L2'>2</a>
68
- <a name='L3'></a><a href='#L3'>3</a>
69
- <a name='L4'></a><a href='#L4'>4</a>
70
- <a name='L5'></a><a href='#L5'>5</a>
71
- <a name='L6'></a><a href='#L6'>6</a>
72
- <a name='L7'></a><a href='#L7'>7</a>
73
- <a name='L8'></a><a href='#L8'>8</a>
74
- <a name='L9'></a><a href='#L9'>9</a>
75
- <a name='L10'></a><a href='#L10'>10</a>
76
- <a name='L11'></a><a href='#L11'>11</a>
77
- <a name='L12'></a><a href='#L12'>12</a>
78
- <a name='L13'></a><a href='#L13'>13</a>
79
- <a name='L14'></a><a href='#L14'>14</a>
80
- <a name='L15'></a><a href='#L15'>15</a>
81
- <a name='L16'></a><a href='#L16'>16</a>
82
- <a name='L17'></a><a href='#L17'>17</a>
83
- <a name='L18'></a><a href='#L18'>18</a>
84
- <a name='L19'></a><a href='#L19'>19</a>
85
- <a name='L20'></a><a href='#L20'>20</a>
86
- <a name='L21'></a><a href='#L21'>21</a>
87
- <a name='L22'></a><a href='#L22'>22</a>
88
- <a name='L23'></a><a href='#L23'>23</a>
89
- <a name='L24'></a><a href='#L24'>24</a>
90
- <a name='L25'></a><a href='#L25'>25</a>
91
- <a name='L26'></a><a href='#L26'>26</a>
92
- <a name='L27'></a><a href='#L27'>27</a>
93
- <a name='L28'></a><a href='#L28'>28</a>
94
- <a name='L29'></a><a href='#L29'>29</a>
95
- <a name='L30'></a><a href='#L30'>30</a>
96
- <a name='L31'></a><a href='#L31'>31</a>
97
- <a name='L32'></a><a href='#L32'>32</a>
98
- <a name='L33'></a><a href='#L33'>33</a>
99
- <a name='L34'></a><a href='#L34'>34</a>
100
- <a name='L35'></a><a href='#L35'>35</a>
101
- <a name='L36'></a><a href='#L36'>36</a>
102
- <a name='L37'></a><a href='#L37'>37</a>
103
- <a name='L38'></a><a href='#L38'>38</a>
104
- <a name='L39'></a><a href='#L39'>39</a>
105
- <a name='L40'></a><a href='#L40'>40</a>
106
- <a name='L41'></a><a href='#L41'>41</a>
107
- <a name='L42'></a><a href='#L42'>42</a>
108
- <a name='L43'></a><a href='#L43'>43</a>
109
- <a name='L44'></a><a href='#L44'>44</a>
110
- <a name='L45'></a><a href='#L45'>45</a>
111
- <a name='L46'></a><a href='#L46'>46</a>
112
- <a name='L47'></a><a href='#L47'>47</a>
113
- <a name='L48'></a><a href='#L48'>48</a>
114
- <a name='L49'></a><a href='#L49'>49</a>
115
- <a name='L50'></a><a href='#L50'>50</a>
116
- <a name='L51'></a><a href='#L51'>51</a>
117
- <a name='L52'></a><a href='#L52'>52</a>
118
- <a name='L53'></a><a href='#L53'>53</a>
119
- <a name='L54'></a><a href='#L54'>54</a>
120
- <a name='L55'></a><a href='#L55'>55</a>
121
- <a name='L56'></a><a href='#L56'>56</a>
122
- <a name='L57'></a><a href='#L57'>57</a>
123
- <a name='L58'></a><a href='#L58'>58</a>
124
- <a name='L59'></a><a href='#L59'>59</a>
125
- <a name='L60'></a><a href='#L60'>60</a>
126
- <a name='L61'></a><a href='#L61'>61</a>
127
- <a name='L62'></a><a href='#L62'>62</a>
128
- <a name='L63'></a><a href='#L63'>63</a>
129
- <a name='L64'></a><a href='#L64'>64</a>
130
- <a name='L65'></a><a href='#L65'>65</a>
131
- <a name='L66'></a><a href='#L66'>66</a>
132
- <a name='L67'></a><a href='#L67'>67</a>
133
- <a name='L68'></a><a href='#L68'>68</a>
134
- <a name='L69'></a><a href='#L69'>69</a>
135
- <a name='L70'></a><a href='#L70'>70</a>
136
- <a name='L71'></a><a href='#L71'>71</a>
137
- <a name='L72'></a><a href='#L72'>72</a>
138
- <a name='L73'></a><a href='#L73'>73</a>
139
- <a name='L74'></a><a href='#L74'>74</a>
140
- <a name='L75'></a><a href='#L75'>75</a>
141
- <a name='L76'></a><a href='#L76'>76</a>
142
- <a name='L77'></a><a href='#L77'>77</a>
143
- <a name='L78'></a><a href='#L78'>78</a>
144
- <a name='L79'></a><a href='#L79'>79</a>
145
- <a name='L80'></a><a href='#L80'>80</a>
146
- <a name='L81'></a><a href='#L81'>81</a>
147
- <a name='L82'></a><a href='#L82'>82</a>
148
- <a name='L83'></a><a href='#L83'>83</a>
149
- <a name='L84'></a><a href='#L84'>84</a>
150
- <a name='L85'></a><a href='#L85'>85</a>
151
- <a name='L86'></a><a href='#L86'>86</a>
152
- <a name='L87'></a><a href='#L87'>87</a>
153
- <a name='L88'></a><a href='#L88'>88</a>
154
- <a name='L89'></a><a href='#L89'>89</a>
155
- <a name='L90'></a><a href='#L90'>90</a>
156
- <a name='L91'></a><a href='#L91'>91</a>
157
- <a name='L92'></a><a href='#L92'>92</a>
158
- <a name='L93'></a><a href='#L93'>93</a>
159
- <a name='L94'></a><a href='#L94'>94</a>
160
- <a name='L95'></a><a href='#L95'>95</a>
161
- <a name='L96'></a><a href='#L96'>96</a>
162
- <a name='L97'></a><a href='#L97'>97</a>
163
- <a name='L98'></a><a href='#L98'>98</a>
164
- <a name='L99'></a><a href='#L99'>99</a>
165
- <a name='L100'></a><a href='#L100'>100</a>
166
- <a name='L101'></a><a href='#L101'>101</a>
167
- <a name='L102'></a><a href='#L102'>102</a>
168
- <a name='L103'></a><a href='#L103'>103</a>
169
- <a name='L104'></a><a href='#L104'>104</a>
170
- <a name='L105'></a><a href='#L105'>105</a>
171
- <a name='L106'></a><a href='#L106'>106</a>
172
- <a name='L107'></a><a href='#L107'>107</a>
173
- <a name='L108'></a><a href='#L108'>108</a>
174
- <a name='L109'></a><a href='#L109'>109</a>
175
- <a name='L110'></a><a href='#L110'>110</a>
176
- <a name='L111'></a><a href='#L111'>111</a>
177
- <a name='L112'></a><a href='#L112'>112</a>
178
- <a name='L113'></a><a href='#L113'>113</a>
179
- <a name='L114'></a><a href='#L114'>114</a>
180
- <a name='L115'></a><a href='#L115'>115</a>
181
- <a name='L116'></a><a href='#L116'>116</a>
182
- <a name='L117'></a><a href='#L117'>117</a>
183
- <a name='L118'></a><a href='#L118'>118</a>
184
- <a name='L119'></a><a href='#L119'>119</a>
185
- <a name='L120'></a><a href='#L120'>120</a>
186
- <a name='L121'></a><a href='#L121'>121</a>
187
- <a name='L122'></a><a href='#L122'>122</a>
188
- <a name='L123'></a><a href='#L123'>123</a>
189
- <a name='L124'></a><a href='#L124'>124</a>
190
- <a name='L125'></a><a href='#L125'>125</a>
191
- <a name='L126'></a><a href='#L126'>126</a>
192
- <a name='L127'></a><a href='#L127'>127</a>
193
- <a name='L128'></a><a href='#L128'>128</a>
194
- <a name='L129'></a><a href='#L129'>129</a>
195
- <a name='L130'></a><a href='#L130'>130</a>
196
- <a name='L131'></a><a href='#L131'>131</a>
197
- <a name='L132'></a><a href='#L132'>132</a>
198
- <a name='L133'></a><a href='#L133'>133</a>
199
- <a name='L134'></a><a href='#L134'>134</a>
200
- <a name='L135'></a><a href='#L135'>135</a>
201
- <a name='L136'></a><a href='#L136'>136</a>
202
- <a name='L137'></a><a href='#L137'>137</a>
203
- <a name='L138'></a><a href='#L138'>138</a>
204
- <a name='L139'></a><a href='#L139'>139</a>
205
- <a name='L140'></a><a href='#L140'>140</a>
206
- <a name='L141'></a><a href='#L141'>141</a>
207
- <a name='L142'></a><a href='#L142'>142</a>
208
- <a name='L143'></a><a href='#L143'>143</a>
209
- <a name='L144'></a><a href='#L144'>144</a>
210
- <a name='L145'></a><a href='#L145'>145</a>
211
- <a name='L146'></a><a href='#L146'>146</a>
212
- <a name='L147'></a><a href='#L147'>147</a>
213
- <a name='L148'></a><a href='#L148'>148</a>
214
- <a name='L149'></a><a href='#L149'>149</a>
215
- <a name='L150'></a><a href='#L150'>150</a>
216
- <a name='L151'></a><a href='#L151'>151</a>
217
- <a name='L152'></a><a href='#L152'>152</a>
218
- <a name='L153'></a><a href='#L153'>153</a>
219
- <a name='L154'></a><a href='#L154'>154</a>
220
- <a name='L155'></a><a href='#L155'>155</a>
221
- <a name='L156'></a><a href='#L156'>156</a>
222
- <a name='L157'></a><a href='#L157'>157</a>
223
- <a name='L158'></a><a href='#L158'>158</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
224
- <span class="cline-any cline-yes">1x</span>
225
- <span class="cline-any cline-yes">1x</span>
226
- <span class="cline-any cline-yes">1x</span>
227
- <span class="cline-any cline-yes">1x</span>
228
- <span class="cline-any cline-yes">1x</span>
229
- <span class="cline-any cline-yes">1x</span>
230
- <span class="cline-any cline-yes">1x</span>
231
- <span class="cline-any cline-yes">1x</span>
232
- <span class="cline-any cline-yes">1x</span>
233
- <span class="cline-any cline-yes">1x</span>
234
- <span class="cline-any cline-yes">1x</span>
235
- <span class="cline-any cline-yes">1x</span>
236
- <span class="cline-any cline-yes">1x</span>
237
- <span class="cline-any cline-yes">1x</span>
238
- <span class="cline-any cline-yes">1x</span>
239
- <span class="cline-any cline-yes">1x</span>
240
- <span class="cline-any cline-yes">1x</span>
241
- <span class="cline-any cline-yes">1x</span>
242
- <span class="cline-any cline-yes">1x</span>
243
- <span class="cline-any cline-yes">1x</span>
244
- <span class="cline-any cline-yes">1x</span>
245
- <span class="cline-any cline-yes">1x</span>
246
- <span class="cline-any cline-yes">1x</span>
247
- <span class="cline-any cline-yes">1x</span>
248
- <span class="cline-any cline-yes">1x</span>
249
- <span class="cline-any cline-yes">1x</span>
250
- <span class="cline-any cline-yes">1x</span>
251
- <span class="cline-any cline-yes">1x</span>
252
- <span class="cline-any cline-yes">1x</span>
253
- <span class="cline-any cline-yes">1x</span>
254
- <span class="cline-any cline-yes">1x</span>
255
- <span class="cline-any cline-yes">1x</span>
256
- <span class="cline-any cline-yes">1x</span>
257
- <span class="cline-any cline-yes">1x</span>
258
- <span class="cline-any cline-yes">1x</span>
259
- <span class="cline-any cline-yes">1x</span>
260
- <span class="cline-any cline-yes">1x</span>
261
- <span class="cline-any cline-yes">1x</span>
262
- <span class="cline-any cline-yes">1x</span>
263
- <span class="cline-any cline-yes">1x</span>
264
- <span class="cline-any cline-yes">1x</span>
265
- <span class="cline-any cline-yes">1x</span>
266
- <span class="cline-any cline-yes">1x</span>
267
- <span class="cline-any cline-yes">1x</span>
268
- <span class="cline-any cline-yes">1x</span>
269
- <span class="cline-any cline-yes">1x</span>
270
- <span class="cline-any cline-yes">1x</span>
271
- <span class="cline-any cline-yes">1x</span>
272
- <span class="cline-any cline-yes">1x</span>
273
- <span class="cline-any cline-yes">1x</span>
274
- <span class="cline-any cline-yes">1x</span>
275
- <span class="cline-any cline-yes">1x</span>
276
- <span class="cline-any cline-yes">1x</span>
277
- <span class="cline-any cline-yes">1x</span>
278
- <span class="cline-any cline-yes">1x</span>
279
- <span class="cline-any cline-yes">1x</span>
280
- <span class="cline-any cline-yes">1x</span>
281
- <span class="cline-any cline-yes">1x</span>
282
- <span class="cline-any cline-yes">1x</span>
283
- <span class="cline-any cline-yes">1x</span>
284
- <span class="cline-any cline-yes">1x</span>
285
- <span class="cline-any cline-yes">1x</span>
286
- <span class="cline-any cline-yes">1x</span>
287
- <span class="cline-any cline-yes">1x</span>
288
- <span class="cline-any cline-yes">1x</span>
289
- <span class="cline-any cline-yes">1x</span>
290
- <span class="cline-any cline-yes">1x</span>
291
- <span class="cline-any cline-yes">1x</span>
292
- <span class="cline-any cline-yes">1x</span>
293
- <span class="cline-any cline-yes">1x</span>
294
- <span class="cline-any cline-yes">1x</span>
295
- <span class="cline-any cline-yes">1x</span>
296
- <span class="cline-any cline-yes">1x</span>
297
- <span class="cline-any cline-yes">1x</span>
298
- <span class="cline-any cline-yes">1x</span>
299
- <span class="cline-any cline-yes">1x</span>
300
- <span class="cline-any cline-yes">1x</span>
301
- <span class="cline-any cline-yes">1x</span>
302
- <span class="cline-any cline-yes">1x</span>
303
- <span class="cline-any cline-yes">1x</span>
304
- <span class="cline-any cline-yes">1x</span>
305
- <span class="cline-any cline-yes">1x</span>
306
- <span class="cline-any cline-yes">1x</span>
307
- <span class="cline-any cline-yes">1x</span>
308
- <span class="cline-any cline-yes">1x</span>
309
- <span class="cline-any cline-yes">1x</span>
310
- <span class="cline-any cline-yes">1x</span>
311
- <span class="cline-any cline-yes">1x</span>
312
- <span class="cline-any cline-yes">1x</span>
313
- <span class="cline-any cline-yes">1x</span>
314
- <span class="cline-any cline-yes">1x</span>
315
- <span class="cline-any cline-yes">1x</span>
316
- <span class="cline-any cline-yes">1x</span>
317
- <span class="cline-any cline-yes">1x</span>
318
- <span class="cline-any cline-yes">1x</span>
319
- <span class="cline-any cline-yes">1x</span>
320
- <span class="cline-any cline-yes">1x</span>
321
- <span class="cline-any cline-yes">1x</span>
322
- <span class="cline-any cline-yes">1x</span>
323
- <span class="cline-any cline-yes">1x</span>
324
- <span class="cline-any cline-yes">1x</span>
325
- <span class="cline-any cline-yes">1x</span>
326
- <span class="cline-any cline-yes">1x</span>
327
- <span class="cline-any cline-yes">1x</span>
328
- <span class="cline-any cline-yes">1x</span>
329
- <span class="cline-any cline-yes">1x</span>
330
- <span class="cline-any cline-yes">1x</span>
331
- <span class="cline-any cline-yes">1x</span>
332
- <span class="cline-any cline-yes">1x</span>
333
- <span class="cline-any cline-yes">1x</span>
334
- <span class="cline-any cline-yes">1x</span>
335
- <span class="cline-any cline-yes">1x</span>
336
- <span class="cline-any cline-yes">1x</span>
337
- <span class="cline-any cline-yes">1x</span>
338
- <span class="cline-any cline-yes">1x</span>
339
- <span class="cline-any cline-yes">1x</span>
340
- <span class="cline-any cline-yes">1x</span>
341
- <span class="cline-any cline-yes">1x</span>
342
- <span class="cline-any cline-yes">1x</span>
343
- <span class="cline-any cline-yes">1x</span>
344
- <span class="cline-any cline-yes">1x</span>
345
- <span class="cline-any cline-yes">1x</span>
346
- <span class="cline-any cline-yes">1x</span>
347
- <span class="cline-any cline-yes">1x</span>
348
- <span class="cline-any cline-yes">1x</span>
349
- <span class="cline-any cline-yes">1x</span>
350
- <span class="cline-any cline-yes">1x</span>
351
- <span class="cline-any cline-yes">1x</span>
352
- <span class="cline-any cline-yes">1x</span>
353
- <span class="cline-any cline-yes">1x</span>
354
- <span class="cline-any cline-yes">1x</span>
355
- <span class="cline-any cline-yes">1x</span>
356
- <span class="cline-any cline-yes">1x</span>
357
- <span class="cline-any cline-yes">1x</span>
358
- <span class="cline-any cline-yes">1x</span>
359
- <span class="cline-any cline-yes">1x</span>
360
- <span class="cline-any cline-yes">1x</span>
361
- <span class="cline-any cline-yes">1x</span>
362
- <span class="cline-any cline-yes">1x</span>
363
- <span class="cline-any cline-yes">1x</span>
364
- <span class="cline-any cline-yes">1x</span>
365
- <span class="cline-any cline-yes">1x</span>
366
- <span class="cline-any cline-yes">1x</span>
367
- <span class="cline-any cline-yes">1x</span>
368
- <span class="cline-any cline-yes">1x</span>
369
- <span class="cline-any cline-yes">1x</span>
370
- <span class="cline-any cline-yes">1x</span>
371
- <span class="cline-any cline-yes">1x</span>
372
- <span class="cline-any cline-yes">1x</span>
373
- <span class="cline-any cline-yes">1x</span>
374
- <span class="cline-any cline-yes">1x</span>
375
- <span class="cline-any cline-yes">1x</span>
376
- <span class="cline-any cline-yes">1x</span>
377
- <span class="cline-any cline-yes">1x</span>
378
- <span class="cline-any cline-yes">1x</span>
379
- <span class="cline-any cline-yes">1x</span>
380
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">&lt;script setup lang="ts"&gt;
381
- import {ref} from "vue";
382
- &nbsp;
383
- const text = ref&lt;string&gt;('Loading Online Viewer')
384
- &nbsp;
385
- &lt;/script&gt;
386
- &nbsp;
387
- &lt;template&gt;
388
- &lt;div style="height: 80vh"&gt;
389
- &lt;div id="spinner"&gt;
390
- &lt;div class="content"&gt;
391
- &lt;div class="circle"&gt;&lt;/div&gt;
392
- &lt;div class="circle"&gt;&lt;/div&gt;
393
- &lt;div class="circle"&gt;&lt;/div&gt;
394
- &lt;div class="circle"&gt;&lt;/div&gt;
395
- &lt;/div&gt;
396
- &lt;/div&gt;
397
- &lt;div class="mx-auto text-center white--text text-h3" v-html="text"&gt;&lt;/div&gt;
398
- &lt;/div&gt;
399
- &lt;/template&gt;
400
- &nbsp;
401
- &lt;style&gt;
402
- :root {
403
- --sp: 2.5s; /* change speed */
404
- }
405
- &nbsp;
406
- #spinner {
407
- margin: 0;
408
- padding: 0;
409
- width: 100%;
410
- height: 100%;
411
- overflow: hidden;
412
- display: flex;
413
- align-items: center;
414
- justify-content: center;
415
- }
416
- &nbsp;
417
- .content {
418
- width: 50vmin;
419
- height: 50vmin;
420
- position: relative;
421
- display: flex;
422
- align-items: center;
423
- justify-content: center;
424
- transform: scale(0.65);
425
- animation: spin-all calc(var(--sp) * 2) linear 1s infinite;
426
- }
427
- &nbsp;
428
- .circle {
429
- --in: 80%;
430
- --ar: #8799a4;
431
- --dt: #ffffff;
432
- --shadow: drop-shadow(0vmin 0vmin 0.5vmin rgba(0, 0, 0, 0.35)) drop-shadow(0vmin 1vmin 0.5vmin rgba(0, 0, 0, 0.09));
433
- --cross: linear-gradient(0deg, #fff0 calc(50% - 2px), #000 calc(50% - 1px) calc(50% + 1px), #fff0 calc(50% + 2px)),
434
- linear-gradient(90deg, #fff0 calc(50% - 2px), #000 calc(50% - 1px) calc(50% + 1px), #fff0 calc(50% + 2px));
435
- border: 6vmin solid var(--ar);
436
- width: var(--in);
437
- height: var(--in);
438
- border-radius: 100%;
439
- position: absolute;
440
- box-sizing: border-box;
441
- border-top-color: #fff0;
442
- border-left-color: #fff0;
443
- top: 15vmin;
444
- right: -10vmin;
445
- animation: spin-bot var(--sp) ease 0s infinite;
446
- background-image: var(--cross), radial-gradient(var(--dt) 5.5vmin, #fff0 calc(5.5vmin + 1px));
447
- background-repeat: no-repeat;
448
- background-size: 3vmin 1vmin, 1vmin 3vmin, 100% 100%;
449
- background-position: center center;
450
- filter: var(--shadow);
451
- }
452
- &nbsp;
453
- .circle:nth-child(2) {
454
- --in: 60%;
455
- top: -2vmin;
456
- animation: spin-top var(--sp) ease 0s infinite;
457
- transform: rotate(-45deg);
458
- background-image: var(--cross), radial-gradient(var(--dt) 1.25vmin, #fff0 calc(1.25vmin + 1px));
459
- right: -4vmin;
460
- filter: hue-rotate(10deg) var(--shadow);
461
- background-size: 1.4vmin 1vmin, 1vmin 1.4vmin, 100% 100%;
462
- }
463
- &nbsp;
464
- .circle:nth-child(3) {
465
- --in: 100%;
466
- top: -5vmin;
467
- left: -13vmin;
468
- transform: rotate(175deg);
469
- animation: spin-left var(--sp) ease calc(var(--sp) / 4) infinite;
470
- background-image: var(--cross), radial-gradient(var(--dt) 9vmin, #fff0 calc(9vmin + 1px));
471
- filter: hue-rotate(20deg) var(--shadow);
472
- background-size: 5vmin 1vmin, 1vmin 5vmin, 100% 100%;
473
- }
474
- &nbsp;
475
- .circle:nth-child(4) {
476
- --in: 60%;
477
- top: 35vmin;
478
- left: -6vmin;
479
- transform: rotate(-280deg);
480
- animation: spin-last var(--sp) ease calc(calc(calc(var(--sp) / 4) + var(--sp)) * -1) infinite;
481
- background-image: var(--cross), radial-gradient(var(--dt) 2.5vmin, #fff0 calc(2.5vmin + 1px));
482
- filter: hue-rotate(30deg) var(--shadow);
483
- background-size: 2vmin 1vmin, 1vmin 2vmin, 100% 100%;
484
- }
485
- &nbsp;
486
- @keyframes spin-all {
487
- 0% {
488
- transform: rotate(0deg) scale(0.65);
489
- }
490
- 100% {
491
- transform: rotate(360deg) scale(0.65);
492
- }
493
- }
494
- &nbsp;
495
- @keyframes spin-top {
496
- 0% {
497
- transform: rotate(-45deg);
498
- }
499
- 100% {
500
- transform: rotate(315deg);
501
- }
502
- }
503
- &nbsp;
504
- @keyframes spin-bot {
505
- 0%,
506
- 35% {
507
- transform: rotate(0deg);
508
- }
509
- 80%,
510
- 100% {
511
- transform: rotate(-360deg);
512
- }
513
- }
514
- &nbsp;
515
- @keyframes spin-left {
516
- 0%,
517
- 35% {
518
- transform: rotate(175deg);
519
- }
520
- 80%,
521
- 100% {
522
- transform: rotate(535deg);
523
- }
524
- }
525
- &nbsp;
526
- @keyframes spin-last {
527
- 0%,
528
- 10% {
529
- transform: rotate(-280deg);
530
- }
531
- 90%,
532
- 100% {
533
- transform: rotate(-640deg);
534
- }
535
- }
536
- &lt;/style&gt;
537
- &nbsp;</pre></td></tr></table></pre>
538
-
539
- <div class='push'></div><!-- for sticky footer -->
540
- </div><!-- /wrapper -->
541
- <div class='footer quiet pad2 space-top1 center small'>
542
- Code coverage generated by
543
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
544
- at 2024-04-09T22:46:57.006Z
545
- </div>
546
- <script src="../../../../prettify.js"></script>
547
- <script>
548
- window.onload = function () {
549
- prettyPrint();
550
- };
551
- </script>
552
- <script src="../../../../sorter.js"></script>
553
- <script src="../../../../block-navigation.js"></script>
554
- </body>
555
- </html>
556
-