@scaleflex/widget-progress-panel 4.0.7 → 4.1.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/CHANGELOG.md +6322 -6310
- package/LICENSE +21 -21
- package/README.md +242 -242
- package/package.json +5 -5
- package/types/index.d.ts +16 -16
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2019 scaleflex
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2019 scaleflex
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,242 +1,242 @@
|
|
|
1
|
-
# `@scaleflex/widget-progress-panel`
|
|
2
|
-
|
|
3
|
-
[![Plugins][plugins-image]](#plugins)
|
|
4
|
-
[![Website][filerobot-image]][sfx-url]
|
|
5
|
-
[![Version][filerobot-version]][version-url]
|
|
6
|
-
[![Scaleflex team][made-by-image]][sfx-url]
|
|
7
|
-
[![License][license-image]][license-url]
|
|
8
|
-
[![CodeSandbox][codeSandbox-image]][codeSandbox-url]
|
|
9
|
-
|
|
10
|
-
<div align='center'>
|
|
11
|
-
<img title="Scaleflex Widget logo" alt="Scaleflex Widget logo" src="https://assets.scaleflex.com/Corporate+Branding/%5B2025%5D+ALL+LOGOS+%2B+ICONS/SCALEFLEX/VXP+logo/Horizontal+White/VXP+logo+WHITE.png?vh=663932" width="140"/>
|
|
12
|
-
</div>
|
|
13
|
-
|
|
14
|
-
A panel showing the progress of uploading, downloading, transforming with possibility to cancel/retry/show location in [Scaleflex Media Asset Widget](https://www.npmjs.com/package/@scaleflex/widget-core).
|
|
15
|
-
|
|
16
|
-
## Usage
|
|
17
|
-
|
|
18
|
-
### NPM
|
|
19
|
-
|
|
20
|
-
```bash
|
|
21
|
-
npm install --save @scaleflex/widget-progress-panel
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
### YARN
|
|
25
|
-
|
|
26
|
-
```bash
|
|
27
|
-
yarn add @scaleflex/widget-progress-panel
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
then
|
|
31
|
-
|
|
32
|
-
```js
|
|
33
|
-
import ProgressPanel from '@scaleflex/widget-progress-panel'
|
|
34
|
-
...
|
|
35
|
-
...
|
|
36
|
-
...
|
|
37
|
-
scaleflexWidget.use(ProgressPanel, propertiesObject)
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
### From CDN
|
|
41
|
-
|
|
42
|
-
The plugin from CDN is found inside `Scaleflex` global object `Scaleflex.ProgressPanel`
|
|
43
|
-
|
|
44
|
-
```js
|
|
45
|
-
const ProgressPanel = window.ScaleflexWidget.ProgressPanel
|
|
46
|
-
...
|
|
47
|
-
...
|
|
48
|
-
...
|
|
49
|
-
scaleflexWidget.use(ProgressPanel, propertiesObject)
|
|
50
|
-
```
|
|
51
|
-
|
|
52
|
-
> If you are using [`@scaleflex/widget-explorer`](../@scaleflex/widget-explorer/#scaleflexwidgetexplorer) plugin you don't need to manually import this plugin as it is being imported automatically there with its styles and the default id `ProgressPanel`.
|
|
53
|
-
|
|
54
|
-
### Plugin's styles
|
|
55
|
-
|
|
56
|
-
```js
|
|
57
|
-
import "@scaleflex/widget-core/dist/style.css";
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
or if you prefer the minified version
|
|
61
|
-
|
|
62
|
-
```js
|
|
63
|
-
import "@scaleflex/widget-core/dist/style.min.css";
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
> The plugin's css file should be imported after the [Core's css file](../@scaleflex/widget-core/#modules-styles) for having the styles shown correctly.
|
|
67
|
-
|
|
68
|
-
### Example
|
|
69
|
-
|
|
70
|
-
```js
|
|
71
|
-
const ScaleflexWidget = window.ScaleflexWidget;
|
|
72
|
-
const demoContainer = "scaleflex-tests-v5a";
|
|
73
|
-
const demoSecurityTemplateId = "......";
|
|
74
|
-
|
|
75
|
-
const widgetInstance = ScaleflexWidget.Core({
|
|
76
|
-
securityTemplateId: demoSecurityTemplateId,
|
|
77
|
-
container: demoContainer,
|
|
78
|
-
dev: false, // optional, default: false
|
|
79
|
-
});
|
|
80
|
-
|
|
81
|
-
const Explorer = ScaleflexWidget.Explorer;
|
|
82
|
-
const ProgressPanel = ScaleflexWidget.ProgressPanel
|
|
83
|
-
const XHRUpload = ScaleflexWidget.XHRUpload
|
|
84
|
-
|
|
85
|
-
widgetInstance
|
|
86
|
-
.use(Explorer, { target: "#scaleflex-widget", inline: true })
|
|
87
|
-
.use(ProgressPanel, {
|
|
88
|
-
target: '#scaleflex-widget-progress-panel',
|
|
89
|
-
});
|
|
90
|
-
.use(XHRUpload)
|
|
91
|
-
```
|
|
92
|
-
|
|
93
|
-
## Properties
|
|
94
|
-
|
|
95
|
-
### `target`
|
|
96
|
-
|
|
97
|
-
<u>Type:</u> `string`
|
|
98
|
-
|
|
99
|
-
<u>Default:</u> `undefined`
|
|
100
|
-
|
|
101
|
-
The selector (ID, Class) of an HTML element or an existed HTML element that would be used for displaying the plugin.
|
|
102
|
-
|
|
103
|
-
> **NOTE** If no target provided, it wll show inside [Explorer](../@scaleflex/widget-explorer).
|
|
104
|
-
|
|
105
|
-
### `locale`
|
|
106
|
-
|
|
107
|
-
<u>Type:</u> `object`.
|
|
108
|
-
|
|
109
|
-
<u>Default:</u>
|
|
110
|
-
|
|
111
|
-
```js
|
|
112
|
-
strings: {
|
|
113
|
-
progressPanelProcessingHeaderLabel: 'Processing',
|
|
114
|
-
progressPanelProcessedHeaderLabel: 'Processed',
|
|
115
|
-
progressPanelHeaderItemsText: {
|
|
116
|
-
0: 'item',
|
|
117
|
-
1: 'items'
|
|
118
|
-
},
|
|
119
|
-
progressPanelEtaLeftText: '%{time} left',
|
|
120
|
-
progressPanelActivityCompleteLabel: 'Uploaded',
|
|
121
|
-
progressPanelActivityErrorLabel: 'Uploading failed',
|
|
122
|
-
progressPanelActivityProgressLabel: 'Uploading',
|
|
123
|
-
progressPanelCompleteActionTitle: 'Show file location',
|
|
124
|
-
progressPanelVideoActivityCompleteActionTitle: 'Show link',
|
|
125
|
-
progressPanelErrorActionTitle: 'Retry',
|
|
126
|
-
progressPanelProgressActionTitle: 'Cancel',
|
|
127
|
-
progressPanelPauseActionTitle: 'Pause',
|
|
128
|
-
progressPanelResumeActionTitle: 'Resume',
|
|
129
|
-
progressPanelAssetProcessingTitle: 'Asset is being processed',
|
|
130
|
-
uploadDelayedHint: 'It takes few seconds to complete processing, after you can use your uploaded assets.',
|
|
131
|
-
progressPanelArchiveCompleteLabel: 'Completed archive',
|
|
132
|
-
progressPanelArchiveFailedLabel: 'Failed archive',
|
|
133
|
-
progressPanelPreparingArchiveLabel: 'Preparing archive',
|
|
134
|
-
progressPanelDownloadingArchiveLabel: 'Downloading archive',
|
|
135
|
-
progressPanelDownloadingActivityLabel: 'Downloading',
|
|
136
|
-
progressPanelDownloadingActivityErrorLabel: 'Downloading failed',
|
|
137
|
-
progressPanelDownloadingActivityCompleteLabel: 'Downloaded',
|
|
138
|
-
progressPanelTranscodeActivityLabel: 'Transcoding',
|
|
139
|
-
progressPanelTranscodedActivityLabel: 'Transcoded',
|
|
140
|
-
progressPanelTranscodeErrorActivityLabel: 'Transcoding failed',
|
|
141
|
-
progressPanelCompressActivityLabel: 'Compressing',
|
|
142
|
-
progressPanelCompressedActivityLabel: 'Compressed',
|
|
143
|
-
progressPanelCompressErrorActivityLabel: 'Compressing failed',
|
|
144
|
-
progressPanelConvertActivityLabel: 'Converting',
|
|
145
|
-
progressPanelConvertedActivityLabel: 'Converted',
|
|
146
|
-
progressPanelConvertErrorActivityLabel: 'Converting failed',
|
|
147
|
-
progressPanelPreparingCsvActivityLabel: 'Preparing CSV',
|
|
148
|
-
progressPanelProcessingCsvActivityLabel: 'Processing CSV',
|
|
149
|
-
progressPanelProcessingCsvActivityErrorLabel: 'Processing CSV failed',
|
|
150
|
-
progressPanelProcessedCsvActivityLabel: 'Processed CSV'
|
|
151
|
-
}
|
|
152
|
-
```
|
|
153
|
-
|
|
154
|
-
Customizing some of the translations or the language's strings and replace the default locale.
|
|
155
|
-
|
|
156
|
-
## Events
|
|
157
|
-
|
|
158
|
-
The progress panel plugin emits different events that you could subscribe to or add your handler to be called with the provided arguments passed while emitting/firing the event, the events are listed below with examples show the parameters for handler:
|
|
159
|
-
|
|
160
|
-
### `progressPanel-minimize`
|
|
161
|
-
|
|
162
|
-
Emitted when progress panel is minimized.
|
|
163
|
-
|
|
164
|
-
- `value`: minimize value true/false.
|
|
165
|
-
|
|
166
|
-
### `progressPanel-toggle`
|
|
167
|
-
|
|
168
|
-
Emitted when progress panel is opened/closed.
|
|
169
|
-
|
|
170
|
-
- `value`: toggle value true/false.
|
|
171
|
-
|
|
172
|
-
### `activities-reset`
|
|
173
|
-
|
|
174
|
-
Emitted when progress panel is closed.
|
|
175
|
-
|
|
176
|
-
### `activity-progress`
|
|
177
|
-
|
|
178
|
-
Emitted when activity is on progress.
|
|
179
|
-
|
|
180
|
-
`params: object`:
|
|
181
|
-
|
|
182
|
-
- `id`: activity id.
|
|
183
|
-
- `percentage`: activity progress percentage.
|
|
184
|
-
|
|
185
|
-
### `activity-update`
|
|
186
|
-
|
|
187
|
-
Emitted when activity is updated.
|
|
188
|
-
|
|
189
|
-
`params: object`:
|
|
190
|
-
|
|
191
|
-
- `id`: activity id.
|
|
192
|
-
- `progress`: activity progress details.
|
|
193
|
-
|
|
194
|
-
### `activity-action`
|
|
195
|
-
|
|
196
|
-
Emitted when activity action button is clicked.
|
|
197
|
-
|
|
198
|
-
`params: object`:
|
|
199
|
-
|
|
200
|
-
- `id`: activity id.
|
|
201
|
-
- `activity`: whole activity details.
|
|
202
|
-
- `activityActionType`: action type(locate, play, pause, embed).
|
|
203
|
-
|
|
204
|
-
### `activity-error`
|
|
205
|
-
|
|
206
|
-
Emitted when activity has an error.
|
|
207
|
-
|
|
208
|
-
`params: object`:
|
|
209
|
-
|
|
210
|
-
- `id`: activity id.
|
|
211
|
-
- `error`: error details.
|
|
212
|
-
|
|
213
|
-
### `activity-retry`
|
|
214
|
-
|
|
215
|
-
Emitted when activity is retried.
|
|
216
|
-
|
|
217
|
-
`params: object`:
|
|
218
|
-
|
|
219
|
-
- `id`: activity id.
|
|
220
|
-
|
|
221
|
-
### `activity-cancel`
|
|
222
|
-
|
|
223
|
-
Emitted when activity is cancelled.
|
|
224
|
-
|
|
225
|
-
`params: object`:
|
|
226
|
-
|
|
227
|
-
- `id`: activity id.
|
|
228
|
-
|
|
229
|
-
<!-- Variables -->
|
|
230
|
-
|
|
231
|
-
[npm-url]: https://www.npmjs.com/package/@scaleflex/widget-progress-panel
|
|
232
|
-
[license-url]: https://opensource.org/licenses/MIT
|
|
233
|
-
[sfx-url]: https://www.scaleflex.com/
|
|
234
|
-
[version-url]: https://www.npmjs.com/package/@scaleflex/widget-progress-panel
|
|
235
|
-
[codeSandbox-url]: https://codesandbox.io/p/sandbox/scalelfex-widget-v4-sandbox-dtp6l3?file=%2Fsrc%2Findex.js
|
|
236
|
-
[npm-image]: https://img.shields.io/npm/v/@telus/remark-config.svg?style=for-the-badge&logo=npm
|
|
237
|
-
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=for-the-badge
|
|
238
|
-
[made-by-image]: https://img.shields.io/badge/%3C%2F%3E%20with%20%E2%99%A5%20by-the%20Scaleflex%20team-6986fa.svg?style=for-the-badge
|
|
239
|
-
[plugins-image]: https://img.shields.io/static/v1?label=Scaleflex&message=Plugins&color=yellow&style=for-the-badge
|
|
240
|
-
[filerobot-image]: https://img.shields.io/static/v1?label=Scaleflex&message=website&color=orange&style=for-the-badge
|
|
241
|
-
[filerobot-version]: https://img.shields.io/npm/v/@scaleflex/widget-progress-panel?label=Version&style=for-the-badge&logo=npm
|
|
242
|
-
[codeSandbox-image]: https://img.shields.io/badge/CodeSandbox-black?style=for-the-badge&logo=CodeSandbox
|
|
1
|
+
# `@scaleflex/widget-progress-panel`
|
|
2
|
+
|
|
3
|
+
[![Plugins][plugins-image]](#plugins)
|
|
4
|
+
[![Website][filerobot-image]][sfx-url]
|
|
5
|
+
[![Version][filerobot-version]][version-url]
|
|
6
|
+
[![Scaleflex team][made-by-image]][sfx-url]
|
|
7
|
+
[![License][license-image]][license-url]
|
|
8
|
+
[![CodeSandbox][codeSandbox-image]][codeSandbox-url]
|
|
9
|
+
|
|
10
|
+
<div align='center'>
|
|
11
|
+
<img title="Scaleflex Widget logo" alt="Scaleflex Widget logo" src="https://assets.scaleflex.com/Corporate+Branding/%5B2025%5D+ALL+LOGOS+%2B+ICONS/SCALEFLEX/VXP+logo/Horizontal+White/VXP+logo+WHITE.png?vh=663932" width="140"/>
|
|
12
|
+
</div>
|
|
13
|
+
|
|
14
|
+
A panel showing the progress of uploading, downloading, transforming with possibility to cancel/retry/show location in [Scaleflex Media Asset Widget](https://www.npmjs.com/package/@scaleflex/widget-core).
|
|
15
|
+
|
|
16
|
+
## Usage
|
|
17
|
+
|
|
18
|
+
### NPM
|
|
19
|
+
|
|
20
|
+
```bash
|
|
21
|
+
npm install --save @scaleflex/widget-progress-panel
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
### YARN
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
yarn add @scaleflex/widget-progress-panel
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
then
|
|
31
|
+
|
|
32
|
+
```js
|
|
33
|
+
import ProgressPanel from '@scaleflex/widget-progress-panel'
|
|
34
|
+
...
|
|
35
|
+
...
|
|
36
|
+
...
|
|
37
|
+
scaleflexWidget.use(ProgressPanel, propertiesObject)
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
### From CDN
|
|
41
|
+
|
|
42
|
+
The plugin from CDN is found inside `Scaleflex` global object `Scaleflex.ProgressPanel`
|
|
43
|
+
|
|
44
|
+
```js
|
|
45
|
+
const ProgressPanel = window.ScaleflexWidget.ProgressPanel
|
|
46
|
+
...
|
|
47
|
+
...
|
|
48
|
+
...
|
|
49
|
+
scaleflexWidget.use(ProgressPanel, propertiesObject)
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
> If you are using [`@scaleflex/widget-explorer`](../@scaleflex/widget-explorer/#scaleflexwidgetexplorer) plugin you don't need to manually import this plugin as it is being imported automatically there with its styles and the default id `ProgressPanel`.
|
|
53
|
+
|
|
54
|
+
### Plugin's styles
|
|
55
|
+
|
|
56
|
+
```js
|
|
57
|
+
import "@scaleflex/widget-core/dist/style.css";
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
or if you prefer the minified version
|
|
61
|
+
|
|
62
|
+
```js
|
|
63
|
+
import "@scaleflex/widget-core/dist/style.min.css";
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
> The plugin's css file should be imported after the [Core's css file](../@scaleflex/widget-core/#modules-styles) for having the styles shown correctly.
|
|
67
|
+
|
|
68
|
+
### Example
|
|
69
|
+
|
|
70
|
+
```js
|
|
71
|
+
const ScaleflexWidget = window.ScaleflexWidget;
|
|
72
|
+
const demoContainer = "scaleflex-tests-v5a";
|
|
73
|
+
const demoSecurityTemplateId = "......";
|
|
74
|
+
|
|
75
|
+
const widgetInstance = ScaleflexWidget.Core({
|
|
76
|
+
securityTemplateId: demoSecurityTemplateId,
|
|
77
|
+
container: demoContainer,
|
|
78
|
+
dev: false, // optional, default: false
|
|
79
|
+
});
|
|
80
|
+
|
|
81
|
+
const Explorer = ScaleflexWidget.Explorer;
|
|
82
|
+
const ProgressPanel = ScaleflexWidget.ProgressPanel
|
|
83
|
+
const XHRUpload = ScaleflexWidget.XHRUpload
|
|
84
|
+
|
|
85
|
+
widgetInstance
|
|
86
|
+
.use(Explorer, { target: "#scaleflex-widget", inline: true })
|
|
87
|
+
.use(ProgressPanel, {
|
|
88
|
+
target: '#scaleflex-widget-progress-panel',
|
|
89
|
+
});
|
|
90
|
+
.use(XHRUpload)
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
## Properties
|
|
94
|
+
|
|
95
|
+
### `target`
|
|
96
|
+
|
|
97
|
+
<u>Type:</u> `string`
|
|
98
|
+
|
|
99
|
+
<u>Default:</u> `undefined`
|
|
100
|
+
|
|
101
|
+
The selector (ID, Class) of an HTML element or an existed HTML element that would be used for displaying the plugin.
|
|
102
|
+
|
|
103
|
+
> **NOTE** If no target provided, it wll show inside [Explorer](../@scaleflex/widget-explorer).
|
|
104
|
+
|
|
105
|
+
### `locale`
|
|
106
|
+
|
|
107
|
+
<u>Type:</u> `object`.
|
|
108
|
+
|
|
109
|
+
<u>Default:</u>
|
|
110
|
+
|
|
111
|
+
```js
|
|
112
|
+
strings: {
|
|
113
|
+
progressPanelProcessingHeaderLabel: 'Processing',
|
|
114
|
+
progressPanelProcessedHeaderLabel: 'Processed',
|
|
115
|
+
progressPanelHeaderItemsText: {
|
|
116
|
+
0: 'item',
|
|
117
|
+
1: 'items'
|
|
118
|
+
},
|
|
119
|
+
progressPanelEtaLeftText: '%{time} left',
|
|
120
|
+
progressPanelActivityCompleteLabel: 'Uploaded',
|
|
121
|
+
progressPanelActivityErrorLabel: 'Uploading failed',
|
|
122
|
+
progressPanelActivityProgressLabel: 'Uploading',
|
|
123
|
+
progressPanelCompleteActionTitle: 'Show file location',
|
|
124
|
+
progressPanelVideoActivityCompleteActionTitle: 'Show link',
|
|
125
|
+
progressPanelErrorActionTitle: 'Retry',
|
|
126
|
+
progressPanelProgressActionTitle: 'Cancel',
|
|
127
|
+
progressPanelPauseActionTitle: 'Pause',
|
|
128
|
+
progressPanelResumeActionTitle: 'Resume',
|
|
129
|
+
progressPanelAssetProcessingTitle: 'Asset is being processed',
|
|
130
|
+
uploadDelayedHint: 'It takes few seconds to complete processing, after you can use your uploaded assets.',
|
|
131
|
+
progressPanelArchiveCompleteLabel: 'Completed archive',
|
|
132
|
+
progressPanelArchiveFailedLabel: 'Failed archive',
|
|
133
|
+
progressPanelPreparingArchiveLabel: 'Preparing archive',
|
|
134
|
+
progressPanelDownloadingArchiveLabel: 'Downloading archive',
|
|
135
|
+
progressPanelDownloadingActivityLabel: 'Downloading',
|
|
136
|
+
progressPanelDownloadingActivityErrorLabel: 'Downloading failed',
|
|
137
|
+
progressPanelDownloadingActivityCompleteLabel: 'Downloaded',
|
|
138
|
+
progressPanelTranscodeActivityLabel: 'Transcoding',
|
|
139
|
+
progressPanelTranscodedActivityLabel: 'Transcoded',
|
|
140
|
+
progressPanelTranscodeErrorActivityLabel: 'Transcoding failed',
|
|
141
|
+
progressPanelCompressActivityLabel: 'Compressing',
|
|
142
|
+
progressPanelCompressedActivityLabel: 'Compressed',
|
|
143
|
+
progressPanelCompressErrorActivityLabel: 'Compressing failed',
|
|
144
|
+
progressPanelConvertActivityLabel: 'Converting',
|
|
145
|
+
progressPanelConvertedActivityLabel: 'Converted',
|
|
146
|
+
progressPanelConvertErrorActivityLabel: 'Converting failed',
|
|
147
|
+
progressPanelPreparingCsvActivityLabel: 'Preparing CSV',
|
|
148
|
+
progressPanelProcessingCsvActivityLabel: 'Processing CSV',
|
|
149
|
+
progressPanelProcessingCsvActivityErrorLabel: 'Processing CSV failed',
|
|
150
|
+
progressPanelProcessedCsvActivityLabel: 'Processed CSV'
|
|
151
|
+
}
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
Customizing some of the translations or the language's strings and replace the default locale.
|
|
155
|
+
|
|
156
|
+
## Events
|
|
157
|
+
|
|
158
|
+
The progress panel plugin emits different events that you could subscribe to or add your handler to be called with the provided arguments passed while emitting/firing the event, the events are listed below with examples show the parameters for handler:
|
|
159
|
+
|
|
160
|
+
### `progressPanel-minimize`
|
|
161
|
+
|
|
162
|
+
Emitted when progress panel is minimized.
|
|
163
|
+
|
|
164
|
+
- `value`: minimize value true/false.
|
|
165
|
+
|
|
166
|
+
### `progressPanel-toggle`
|
|
167
|
+
|
|
168
|
+
Emitted when progress panel is opened/closed.
|
|
169
|
+
|
|
170
|
+
- `value`: toggle value true/false.
|
|
171
|
+
|
|
172
|
+
### `activities-reset`
|
|
173
|
+
|
|
174
|
+
Emitted when progress panel is closed.
|
|
175
|
+
|
|
176
|
+
### `activity-progress`
|
|
177
|
+
|
|
178
|
+
Emitted when activity is on progress.
|
|
179
|
+
|
|
180
|
+
`params: object`:
|
|
181
|
+
|
|
182
|
+
- `id`: activity id.
|
|
183
|
+
- `percentage`: activity progress percentage.
|
|
184
|
+
|
|
185
|
+
### `activity-update`
|
|
186
|
+
|
|
187
|
+
Emitted when activity is updated.
|
|
188
|
+
|
|
189
|
+
`params: object`:
|
|
190
|
+
|
|
191
|
+
- `id`: activity id.
|
|
192
|
+
- `progress`: activity progress details.
|
|
193
|
+
|
|
194
|
+
### `activity-action`
|
|
195
|
+
|
|
196
|
+
Emitted when activity action button is clicked.
|
|
197
|
+
|
|
198
|
+
`params: object`:
|
|
199
|
+
|
|
200
|
+
- `id`: activity id.
|
|
201
|
+
- `activity`: whole activity details.
|
|
202
|
+
- `activityActionType`: action type(locate, play, pause, embed).
|
|
203
|
+
|
|
204
|
+
### `activity-error`
|
|
205
|
+
|
|
206
|
+
Emitted when activity has an error.
|
|
207
|
+
|
|
208
|
+
`params: object`:
|
|
209
|
+
|
|
210
|
+
- `id`: activity id.
|
|
211
|
+
- `error`: error details.
|
|
212
|
+
|
|
213
|
+
### `activity-retry`
|
|
214
|
+
|
|
215
|
+
Emitted when activity is retried.
|
|
216
|
+
|
|
217
|
+
`params: object`:
|
|
218
|
+
|
|
219
|
+
- `id`: activity id.
|
|
220
|
+
|
|
221
|
+
### `activity-cancel`
|
|
222
|
+
|
|
223
|
+
Emitted when activity is cancelled.
|
|
224
|
+
|
|
225
|
+
`params: object`:
|
|
226
|
+
|
|
227
|
+
- `id`: activity id.
|
|
228
|
+
|
|
229
|
+
<!-- Variables -->
|
|
230
|
+
|
|
231
|
+
[npm-url]: https://www.npmjs.com/package/@scaleflex/widget-progress-panel
|
|
232
|
+
[license-url]: https://opensource.org/licenses/MIT
|
|
233
|
+
[sfx-url]: https://www.scaleflex.com/
|
|
234
|
+
[version-url]: https://www.npmjs.com/package/@scaleflex/widget-progress-panel
|
|
235
|
+
[codeSandbox-url]: https://codesandbox.io/p/sandbox/scalelfex-widget-v4-sandbox-dtp6l3?file=%2Fsrc%2Findex.js
|
|
236
|
+
[npm-image]: https://img.shields.io/npm/v/@telus/remark-config.svg?style=for-the-badge&logo=npm
|
|
237
|
+
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=for-the-badge
|
|
238
|
+
[made-by-image]: https://img.shields.io/badge/%3C%2F%3E%20with%20%E2%99%A5%20by-the%20Scaleflex%20team-6986fa.svg?style=for-the-badge
|
|
239
|
+
[plugins-image]: https://img.shields.io/static/v1?label=Scaleflex&message=Plugins&color=yellow&style=for-the-badge
|
|
240
|
+
[filerobot-image]: https://img.shields.io/static/v1?label=Scaleflex&message=website&color=orange&style=for-the-badge
|
|
241
|
+
[filerobot-version]: https://img.shields.io/npm/v/@scaleflex/widget-progress-panel?label=Version&style=for-the-badge&logo=npm
|
|
242
|
+
[codeSandbox-image]: https://img.shields.io/badge/CodeSandbox-black?style=for-the-badge&logo=CodeSandbox
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@scaleflex/widget-progress-panel",
|
|
3
3
|
"description": "A progress panel for Scaleflex, handles upload, download, video transformation operation simultaneously",
|
|
4
|
-
"version": "4.0
|
|
4
|
+
"version": "4.1.0",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "lib/index.js",
|
|
7
7
|
"style": "dist/style.min.css",
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
"access": "public"
|
|
16
16
|
},
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"@scaleflex/widget-common": "^4.0
|
|
19
|
-
"@scaleflex/widget-informer": "^4.0
|
|
20
|
-
"@scaleflex/widget-utils": "^4.0
|
|
18
|
+
"@scaleflex/widget-common": "^4.1.0",
|
|
19
|
+
"@scaleflex/widget-informer": "^4.1.0",
|
|
20
|
+
"@scaleflex/widget-utils": "^4.1.0",
|
|
21
21
|
"lodash.throttle": "^4.1.1"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
@@ -29,5 +29,5 @@
|
|
|
29
29
|
"react": ">=19.0.0",
|
|
30
30
|
"react-dom": ">=19.0.0"
|
|
31
31
|
},
|
|
32
|
-
"gitHead": "
|
|
32
|
+
"gitHead": "471120d67066617a0d8824eae11b07d1f2259473"
|
|
33
33
|
}
|
package/types/index.d.ts
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import Filerobot = require("@scaleflex/widget-core");
|
|
2
|
-
import GeneratedLocale = require("./generatedLocale");
|
|
3
|
-
|
|
4
|
-
declare module ProgressPanel {
|
|
5
|
-
export type ProgressPanelLocale = GeneratedLocale;
|
|
6
|
-
|
|
7
|
-
export interface ProgressPanelOptions extends Filerobot.PluginOptions {
|
|
8
|
-
target?: Filerobot.PluginTarget;
|
|
9
|
-
locale?: ProgressPanelLocale;
|
|
10
|
-
strings?: string;
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
declare class ProgressPanel extends Filerobot.Plugin<ProgressPanel.ProgressPanelOptions> {}
|
|
15
|
-
|
|
16
|
-
export = ProgressPanel;
|
|
1
|
+
import Filerobot = require("@scaleflex/widget-core");
|
|
2
|
+
import GeneratedLocale = require("./generatedLocale");
|
|
3
|
+
|
|
4
|
+
declare module ProgressPanel {
|
|
5
|
+
export type ProgressPanelLocale = GeneratedLocale;
|
|
6
|
+
|
|
7
|
+
export interface ProgressPanelOptions extends Filerobot.PluginOptions {
|
|
8
|
+
target?: Filerobot.PluginTarget;
|
|
9
|
+
locale?: ProgressPanelLocale;
|
|
10
|
+
strings?: string;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
declare class ProgressPanel extends Filerobot.Plugin<ProgressPanel.ProgressPanelOptions> {}
|
|
15
|
+
|
|
16
|
+
export = ProgressPanel;
|