@twab/visualization 0.9.4 → 0.9.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.
Files changed (24) hide show
  1. package/dist/assets/asset-125afa63 +1 -0
  2. package/dist/visualization.umd.js +2393 -12577
  3. package/package.json +10 -12
  4. package/dist/css/26.90e920d4.css +0 -340
  5. package/dist/css/794.5b845685.css +0 -1
  6. package/dist/css/95.90e920d4.css +0 -340
  7. package/dist/demo.html +0 -1
  8. package/dist/visualization.common.913.js +0 -9642
  9. package/dist/visualization.common.913.js.map +0 -1
  10. package/dist/visualization.common.95.js +0 -3125
  11. package/dist/visualization.common.95.js.map +0 -1
  12. package/dist/visualization.common.js +0 -12637
  13. package/dist/visualization.common.js.map +0 -1
  14. package/dist/visualization.umd.26.js +0 -3125
  15. package/dist/visualization.umd.26.js.map +0 -1
  16. package/dist/visualization.umd.653.js +0 -9642
  17. package/dist/visualization.umd.653.js.map +0 -1
  18. package/dist/visualization.umd.js.map +0 -1
  19. package/dist/visualization.umd.min.116.js +0 -8
  20. package/dist/visualization.umd.min.116.js.map +0 -1
  21. package/dist/visualization.umd.min.794.js +0 -2
  22. package/dist/visualization.umd.min.794.js.map +0 -1
  23. package/dist/visualization.umd.min.js +0 -27
  24. package/dist/visualization.umd.min.js.map +0 -1
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@twab/visualization",
3
- "version": "0.9.4",
3
+ "version": "0.9.6",
4
4
  "main": "dist/visualization.umd.js",
5
5
  "files": [
6
6
  "dist"
7
7
  ],
8
8
  "scripts": {
9
9
  "serve": "vue-cli-service serve example/main.js",
10
- "build": "vue-cli-service build --target lib --name visualization src/index.js"
10
+ "build": "vue-cli-service build --target lib --name visualization --format umd src/index.js"
11
11
  },
12
12
  "dependencies": {
13
13
  "@fortawesome/fontawesome-svg-core": "^6.4.2",
@@ -15,7 +15,6 @@
15
15
  "@fortawesome/vue-fontawesome": "^2.0.10",
16
16
  "axios": "^1.5.1",
17
17
  "core-js": "^3.8.3",
18
- "file-loader": "^6.2.0",
19
18
  "i18next": "^23.6.0",
20
19
  "i18next-browser-languagedetector": "^7.1.0",
21
20
  "i18next-vue": "^1.1.0",
@@ -27,23 +26,25 @@
27
26
  "devDependencies": {
28
27
  "@babel/core": "^7.12.16",
29
28
  "@babel/eslint-parser": "^7.12.16",
29
+ "@babel/plugin-transform-runtime": "^7.23.7",
30
+ "@rollup/plugin-babel": "^6.0.4",
30
31
  "@vue/cli-plugin-babel": "~5.0.0",
31
32
  "@vue/cli-plugin-eslint": "~5.0.0",
32
33
  "@vue/cli-service": "~5.0.0",
34
+ "bili": "^5.0.5",
33
35
  "deepmerge": "^4.3.1",
34
36
  "eslint": "^7.32.0",
35
37
  "eslint-plugin-vue": "^8.0.3",
38
+ "rollup": "^2.79.1",
39
+ "rollup-plugin-css-only": "^4.5.2",
40
+ "rollup-plugin-svg": "^2.0.0",
41
+ "rollup-plugin-vue2": "^0.8.1",
36
42
  "sass": "~1.32",
37
43
  "sass-loader": "^13.3.2",
38
- "url-loader": "^4.1.1",
39
44
  "vue-global-events": "^1.2.1",
45
+ "vue-loader": "^15.11.1",
40
46
  "vue-template-compiler": "^2.6.14"
41
47
  },
42
- "babel": {
43
- "presets": [
44
- "@babel/preset-env"
45
- ]
46
- },
47
48
  "eslintConfig": {
48
49
  "root": true,
49
50
  "env": {
@@ -53,9 +54,6 @@
53
54
  "plugin:vue/essential",
54
55
  "eslint:recommended"
55
56
  ],
56
- "parserOptions": {
57
- "parser": "@babel/eslint-parser"
58
- },
59
57
  "rules": {
60
58
  "vue/multi-word-component-names": "off"
61
59
  }
package/dist/css/26.90e920d4.css DELETED
@@ -1,340 +0,0 @@
1
-
2
- .frame-container > div[data-v-20a23fbe] {
3
- max-height: 100%;
4
- }
5
- .frame-container[data-v-20a23fbe] {
6
- background-color: black;
7
- display: flex;
8
- justify-content: center;
9
- }
10
- .frame-content[data-v-20a23fbe],
11
- .dummy-frame[data-v-20a23fbe] {
12
- display: flex;
13
- align-items: center;
14
- justify-content: center;
15
- }
16
- .frame-content video[data-v-20a23fbe] {
17
- flex-grow: 1;
18
- -o-object-fit: fill;
19
- object-fit: fill;
20
- z-index: 0;
21
- }
22
- .overlay[data-v-20a23fbe] {
23
- width: 100%;
24
- height: 100%;
25
- z-index: 5;
26
- position: absolute;
27
- top: 0;
28
- left: 0;
29
- border: 4px solid transparent;
30
- }
31
- .active .overlay[data-v-20a23fbe] {
32
- border-color: var(--visualization-primary);
33
- }
34
- .between-time .overlay[data-v-20a23fbe] {
35
- border-top-color: var(--visualization-secondary);
36
- }
37
- .between-time.active .overlay[data-v-20a23fbe] {
38
- border-color: var(--visualization-secondary);
39
- }
40
- .initial-time .overlay[data-v-20a23fbe] {
41
- border-top-color: var(--visualization-start);
42
- }
43
- .initial-time.active .overlay[data-v-20a23fbe] {
44
- border-color: var(--visualization-start);
45
- }
46
- .end-time .overlay[data-v-20a23fbe] {
47
- border-top-color: var(--visualization-end);
48
- }
49
- .end-time.active .overlay[data-v-20a23fbe] {
50
- border-color: var(--visualization-end);
51
- }
52
- .initial-time.end-time .overlay[data-v-20a23fbe] {
53
- border-top-color: var(--visualization-start);
54
- border-bottom-color: var(--visualization-end);
55
- }
56
- .initial-time.end-time.active .overlay[data-v-20a23fbe] {
57
- border-top-color: var(--visualization-start);
58
- border-left-color: var(--visualization-start);
59
- border-bottom-color: var(--visualization-end);
60
- border-right-color: var(--visualization-end);
61
- }
62
-
63
-
64
- #progress[data-v-7fe6f244] {
65
- position: relative;
66
- cursor: pointer;
67
- width: 80%;
68
- height: 15px;
69
- background-color: #dfdfdf;
70
- margin: 5px auto;
71
- border-radius: 6px;
72
- }
73
- .progressBar[data-v-7fe6f244] {
74
- display: absolute;
75
- height: 15px;
76
- position: absolute;
77
- top: 0;
78
- left: 0;
79
- background-color: var(--visualization-secondary);
80
- z-index: 2;
81
- width: 50%;
82
- border-radius: inherit;
83
- }
84
- .progressBar[data-v-7fe6f244]::after {
85
- content: '';
86
- width: 17px;
87
- height: 17px;
88
- position: absolute;
89
- top: -1px;
90
- right: -8.5px;
91
- border-radius: 50%;
92
- background-color: var(--visualization-primary);
93
- z-index: 3;
94
- }
95
- .progressLabel[data-v-7fe6f244] {
96
- z-index: 4;
97
- margin: 0 auto;
98
- font-weight: bold;
99
- line-height: 17px;
100
- font-size: 14px;
101
- text-shadow: -1px 0 #dfdfdf, 0 1px #dfdfdf, 1px 0 #dfdfdf, 0 -1px #dfdfdf;
102
-
103
- -webkit-user-select: none;
104
-
105
- -moz-user-select: none;
106
-
107
- user-select: none;
108
- }
109
-
110
-
111
- dialog[data-v-9f47e4d0] {
112
- max-width: 60vw;
113
- /* padding: 12px; */
114
- border: none;
115
- background: white;
116
- border-radius: 6px;
117
- box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
118
- 0 1px 5px 0 rgba(0, 0, 0, 0.12);
119
- position: fixed;
120
- top: 50%;
121
- left: 50%;
122
- transform: translateY(-50%) translateX(-50%);
123
- }
124
-
125
- .visualization-row {
126
- display: flex;
127
- flex-wrap: wrap;
128
- flex: 1 1 auto;
129
- }
130
- .visualization-col {
131
- flex-basis: 0;
132
- flex-grow: 1;
133
- max-width: 100%;
134
- padding: 12px;
135
- }
136
- .visualization-divider {
137
- display: block;
138
- flex: 1 1 100%;
139
- height: 0px;
140
- max-height: 0px;
141
- opacity: 1;
142
- transition: inherit;
143
- border-style: solid;
144
- border-width: thin 0 0 0;
145
- border-color: rgba(0, 0, 0, 0.12);
146
- margin: 0;
147
- }
148
- .visualization-divider.vertical {
149
- align-self: stretch;
150
- border-width: 0 thin 0 0;
151
- display: inline-flex;
152
- height: inherit;
153
- margin-left: -1px;
154
- max-height: 100%;
155
- max-width: 0px;
156
- vertical-align: text-bottom;
157
- width: 0px;
158
- }
159
- .visualization-card {
160
- flex-basis: 0;
161
- flex-grow: 1;
162
- max-width: 100%;
163
- padding: 12px;
164
- width: 100%;
165
- transition-property: box-shadow, opacity;
166
- overflow-wrap: break-word;
167
- /*box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
168
- 0 1px 5px 0 rgba(0, 0, 0, 0.12);*/
169
- }
170
- .visualization-justify-center {
171
- justify-content: center;
172
- }
173
- .visualization-align-center {
174
- align-items: center;
175
- }
176
- #visualization-container {
177
- max-width: 100% !important;
178
- margin: 0 auto !important;
179
- height: 100%;
180
- border-bottom: none;
181
- }
182
- #visualization-container > .card {
183
- border-radius: 0 !important;
184
- font-size: 12px;
185
- width: 100%;
186
- box-shadow: none;
187
- height: 100%;
188
- }
189
- #command-bar,
190
- #info-bar {
191
- background-color: #f5f5f5;
192
- box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
193
- 0 1px 5px 0 rgba(0, 0, 0, 0.12);
194
- }
195
- #command-bar button {
196
- width: 42px;
197
- height: 36px;
198
- border: none;
199
- background: none;
200
- }
201
- #command-bar button:hover {
202
- cursor: pointer;
203
- background: rgba(0, 0, 0, 0.12);
204
- }
205
- #command-bar svg {
206
- font-size: 16px;
207
- }
208
- #command-bar {
209
- padding: 0 !important;
210
- }
211
- #info-bar {
212
- padding: 4px;
213
- font-size: 14px;
214
- position: relative;
215
- }
216
- .settings-container {
217
- position: absolute;
218
- right: 14px;
219
- top: 50%;
220
- transform: translateY(-50%);
221
- }
222
- .settings-container > * {
223
- margin: 0 2px;
224
- cursor: pointer;
225
- }
226
- #info-bar svg {
227
- font-size: 16px;
228
- }
229
- #info-bar .divider {
230
- margin: 0 8px;
231
- }
232
- svg:focus {
233
- border: none;
234
- }
235
- .visualization-card {
236
- border-left: 8px solid #eee;
237
- }
238
- .active-tab {
239
- border-left: 8px solid var(--visualization-primary) !important;
240
- border-image-slice: 1;
241
- }
242
- [id^='frame-'] {
243
- padding: 1px;
244
- display: flex;
245
- flex-flow: column;
246
- }
247
- .tooltip {
248
- display: block !important;
249
- z-index: 10000;
250
- }
251
- .tooltip .tooltip-inner {
252
- background: var(--visualization-primary);
253
- color: white;
254
- border-radius: 16px;
255
- padding: 5px 10px 4px;
256
- }
257
- .tooltip .tooltip-arrow {
258
- width: 0;
259
- height: 0;
260
- border-style: solid;
261
- position: absolute;
262
- margin: 5px;
263
- border-color: var(--visualization-primary);
264
- z-index: 1;
265
- }
266
- .tooltip[x-placement^='top'] {
267
- margin-bottom: 5px;
268
- }
269
- .tooltip[x-placement^='top'] .tooltip-arrow {
270
- border-width: 5px 5px 0 5px;
271
- border-left-color: transparent !important;
272
- border-right-color: transparent !important;
273
- border-bottom-color: transparent !important;
274
- bottom: -5px;
275
- left: calc(50% - 5px);
276
- margin-top: 0;
277
- margin-bottom: 0;
278
- }
279
- .tooltip[x-placement^='bottom'] {
280
- margin-top: 5px;
281
- }
282
- .tooltip[x-placement^='bottom'] .tooltip-arrow {
283
- border-width: 0 5px 5px 5px;
284
- border-left-color: transparent !important;
285
- border-right-color: transparent !important;
286
- border-top-color: transparent !important;
287
- top: -5px;
288
- left: calc(50% - 5px);
289
- margin-top: 0;
290
- margin-bottom: 0;
291
- }
292
- .tooltip[x-placement^='right'] {
293
- margin-left: 5px;
294
- }
295
- .tooltip[x-placement^='right'] .tooltip-arrow {
296
- border-width: 5px 5px 5px 0;
297
- border-left-color: transparent !important;
298
- border-top-color: transparent !important;
299
- border-bottom-color: transparent !important;
300
- left: -5px;
301
- top: calc(50% - 5px);
302
- margin-left: 0;
303
- margin-right: 0;
304
- }
305
- .tooltip[x-placement^='left'] {
306
- margin-right: 5px;
307
- }
308
- .tooltip[x-placement^='left'] .tooltip-arrow {
309
- border-width: 5px 0 5px 5px;
310
- border-top-color: transparent !important;
311
- border-right-color: transparent !important;
312
- border-bottom-color: transparent !important;
313
- right: -5px;
314
- top: calc(50% - 5px);
315
- margin-left: 0;
316
- margin-right: 0;
317
- }
318
- .tooltip.popover .popover-inner {
319
- background: #f9f9f9;
320
- color: black;
321
- padding: 24px;
322
- border-radius: 5px;
323
- box-shadow: 0 5px 30px rgba(black, 0.1);
324
- }
325
- .tooltip.popover .popover-arrow {
326
- border-color: #f9f9f9;
327
- }
328
- .tooltip[aria-hidden='true'] {
329
- visibility: hidden;
330
- opacity: 0;
331
- transition: opacity 0.15s, visibility 0.15s;
332
- }
333
- .tooltip[aria-hidden='false'] {
334
- visibility: visible;
335
- opacity: 1;
336
- transition: opacity 0.15s;
337
- }
338
-
339
-
340
-
package/dist/css/794.5b845685.css DELETED
@@ -1 +0,0 @@
1
- .frame-container>div[data-v-20a23fbe]{max-height:100%}.frame-container[data-v-20a23fbe]{background-color:#000;display:flex;justify-content:center}.dummy-frame[data-v-20a23fbe],.frame-content[data-v-20a23fbe]{display:flex;align-items:center;justify-content:center}.frame-content video[data-v-20a23fbe]{flex-grow:1;-o-object-fit:fill;object-fit:fill;z-index:0}.overlay[data-v-20a23fbe]{width:100%;height:100%;z-index:5;position:absolute;top:0;left:0;border:4px solid transparent}.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-primary)}.between-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-secondary)}.between-time.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-secondary)}.initial-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-start)}.initial-time.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-start)}.end-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-end)}.end-time.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-end)}.initial-time.end-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-start);border-bottom-color:var(--visualization-end)}.initial-time.end-time.active .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-start);border-left-color:var(--visualization-start);border-bottom-color:var(--visualization-end);border-right-color:var(--visualization-end)}#progress[data-v-7fe6f244]{position:relative;cursor:pointer;width:80%;height:15px;background-color:#dfdfdf;margin:5px auto;border-radius:6px}.progressBar[data-v-7fe6f244]{display:absolute;height:15px;position:absolute;top:0;left:0;background-color:var(--visualization-secondary);z-index:2;width:50%;border-radius:inherit}.progressBar[data-v-7fe6f244]:after{content:"";width:17px;height:17px;position:absolute;top:-1px;right:-8.5px;border-radius:50%;background-color:var(--visualization-primary);z-index:3}.progressLabel[data-v-7fe6f244]{z-index:4;margin:0 auto;font-weight:700;line-height:17px;font-size:14px;text-shadow:-1px 0 #dfdfdf,0 1px #dfdfdf,1px 0 #dfdfdf,0 -1px #dfdfdf;-webkit-user-select:none;-moz-user-select:none;user-select:none}dialog[data-v-9f47e4d0]{max-width:60vw;border:none;background:#fff;border-radius:6px;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%)}.visualization-row{display:flex;flex-wrap:wrap;flex:1 1 auto}.visualization-col{flex-basis:0;flex-grow:1;max-width:100%;padding:12px}.visualization-divider{display:block;flex:1 1 100%;height:0;max-height:0;opacity:1;transition:inherit;border-style:solid;border-width:thin 0 0 0;border-color:rgba(0,0,0,.12);margin:0}.visualization-divider.vertical{align-self:stretch;border-width:0 thin 0 0;display:inline-flex;height:inherit;margin-left:-1px;max-height:100%;max-width:0;vertical-align:text-bottom;width:0}.visualization-card{flex-basis:0;flex-grow:1;max-width:100%;padding:12px;width:100%;transition-property:box-shadow,opacity;overflow-wrap:break-word}.visualization-justify-center{justify-content:center}.visualization-align-center{align-items:center}#visualization-container{max-width:100%!important;margin:0 auto!important;height:100%;border-bottom:none}#visualization-container>.card{border-radius:0!important;font-size:12px;width:100%;box-shadow:none;height:100%}#command-bar,#info-bar{background-color:#f5f5f5;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}#command-bar button{width:42px;height:36px;border:none;background:none}#command-bar button:hover{cursor:pointer;background:rgba(0,0,0,.12)}#command-bar svg{font-size:16px}#command-bar{padding:0!important}#info-bar{padding:4px;font-size:14px;position:relative}.settings-container{position:absolute;right:14px;top:50%;transform:translateY(-50%)}.settings-container>*{margin:0 2px;cursor:pointer}#info-bar svg{font-size:16px}#info-bar .divider{margin:0 8px}svg:focus{border:none}.visualization-card{border-left:8px solid #eee}.active-tab{border-left:8px solid var(--visualization-primary)!important;border-image-slice:1}[id^=frame-]{padding:1px;display:flex;flex-flow:column}.tooltip{display:block!important;z-index:10000}.tooltip .tooltip-inner{background:var(--visualization-primary);color:#fff;border-radius:16px;padding:5px 10px 4px}.tooltip .tooltip-arrow{width:0;height:0;border-style:solid;position:absolute;margin:5px;border-color:var(--visualization-primary);z-index:1}.tooltip[x-placement^=top]{margin-bottom:5px}.tooltip[x-placement^=top] .tooltip-arrow{border-width:5px 5px 0 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;bottom:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=bottom]{margin-top:5px}.tooltip[x-placement^=bottom] .tooltip-arrow{border-width:0 5px 5px 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important;top:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=right]{margin-left:5px}.tooltip[x-placement^=right] .tooltip-arrow{border-width:5px 5px 5px 0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important;left:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip[x-placement^=left]{margin-right:5px}.tooltip[x-placement^=left] .tooltip-arrow{border-width:5px 0 5px 5px;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;right:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip.popover .popover-inner{background:#f9f9f9;color:#000;padding:24px;border-radius:5px;box-shadow:0 5px 30px rgba(black,.1)}.tooltip.popover .popover-arrow{border-color:#f9f9f9}.tooltip[aria-hidden=true]{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s}.tooltip[aria-hidden=false]{visibility:visible;opacity:1;transition:opacity .15s}