1 |
|
2 |
|
3 |
|
4 | import { GroupItem, ProgressBar, TextItem } from '@jupyterlab/statusbar';
|
5 | import { nullTranslator } from '@jupyterlab/translation';
|
6 | import { VDomModel, VDomRenderer } from '@jupyterlab/ui-components';
|
7 | import { ArrayExt } from '@lumino/algorithm';
|
8 | import React from 'react';
|
9 |
|
10 |
|
11 |
|
12 | const HALF_SPACING = 4;
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 | function FileUploadComponent(props) {
|
21 | const translator = props.translator || nullTranslator;
|
22 | const trans = translator.load('jupyterlab');
|
23 | return (React.createElement(GroupItem, { spacing: HALF_SPACING },
|
24 | React.createElement(TextItem, { source: trans.__('Uploading…') }),
|
25 | React.createElement(ProgressBar, { percentage: props.upload })));
|
26 | }
|
27 |
|
28 |
|
29 |
|
30 | const UPLOAD_COMPLETE_MESSAGE_MILLIS = 2000;
|
31 |
|
32 |
|
33 |
|
34 | export class FileUploadStatus extends VDomRenderer {
|
35 | |
36 |
|
37 |
|
38 | constructor(opts) {
|
39 | super(new FileUploadStatus.Model(opts.tracker.currentWidget && opts.tracker.currentWidget.model));
|
40 | this._onBrowserChange = (tracker, browser) => {
|
41 | if (browser === null) {
|
42 | this.model.browserModel = null;
|
43 | }
|
44 | else {
|
45 | this.model.browserModel = browser.model;
|
46 | }
|
47 | };
|
48 | this.translator = opts.translator || nullTranslator;
|
49 | this._trans = this.translator.load('jupyterlab');
|
50 | this._tracker = opts.tracker;
|
51 | this._tracker.currentChanged.connect(this._onBrowserChange);
|
52 | }
|
53 | |
54 |
|
55 |
|
56 | render() {
|
57 | const uploadPaths = this.model.items;
|
58 | if (uploadPaths.length > 0) {
|
59 | const item = this.model.items[0];
|
60 | if (item.complete) {
|
61 | return React.createElement(TextItem, { source: this._trans.__('Complete!') });
|
62 | }
|
63 | else {
|
64 | return (React.createElement(FileUploadComponent, { upload: this.model.items[0].progress, translator: this.translator }));
|
65 | }
|
66 | }
|
67 | else {
|
68 | return React.createElement(FileUploadComponent, { upload: 100, translator: this.translator });
|
69 | }
|
70 | }
|
71 | dispose() {
|
72 | super.dispose();
|
73 | this._tracker.currentChanged.disconnect(this._onBrowserChange);
|
74 | }
|
75 | }
|
76 |
|
77 |
|
78 |
|
79 | (function (FileUploadStatus) {
|
80 | |
81 |
|
82 |
|
83 | class Model extends VDomModel {
|
84 | |
85 |
|
86 |
|
87 | constructor(browserModel) {
|
88 | super();
|
89 | |
90 |
|
91 |
|
92 | this._uploadChanged = (browse, uploads) => {
|
93 | if (uploads.name === 'start') {
|
94 | this._items.push({
|
95 | path: uploads.newValue.path,
|
96 | progress: uploads.newValue.progress * 100,
|
97 | complete: false
|
98 | });
|
99 | }
|
100 | else if (uploads.name === 'update') {
|
101 | const idx = ArrayExt.findFirstIndex(this._items, val => val.path === uploads.oldValue.path);
|
102 | if (idx !== -1) {
|
103 | this._items[idx].progress = uploads.newValue.progress * 100;
|
104 | }
|
105 | }
|
106 | else if (uploads.name === 'finish') {
|
107 | const finishedItem = ArrayExt.findFirstValue(this._items, val => val.path === uploads.oldValue.path);
|
108 | if (finishedItem) {
|
109 | finishedItem.complete = true;
|
110 | setTimeout(() => {
|
111 | ArrayExt.removeFirstOf(this._items, finishedItem);
|
112 | this.stateChanged.emit(void 0);
|
113 | }, UPLOAD_COMPLETE_MESSAGE_MILLIS);
|
114 | }
|
115 | }
|
116 | else if (uploads.name === 'failure') {
|
117 | ArrayExt.removeFirstWhere(this._items, val => val.path === uploads.newValue.path);
|
118 | }
|
119 | this.stateChanged.emit(void 0);
|
120 | };
|
121 | this._items = [];
|
122 | this._browserModel = null;
|
123 | this.browserModel = browserModel;
|
124 | }
|
125 | |
126 |
|
127 |
|
128 | get items() {
|
129 | return this._items;
|
130 | }
|
131 | |
132 |
|
133 |
|
134 | get browserModel() {
|
135 | return this._browserModel;
|
136 | }
|
137 | set browserModel(browserModel) {
|
138 | const oldBrowserModel = this._browserModel;
|
139 | if (oldBrowserModel) {
|
140 | oldBrowserModel.uploadChanged.disconnect(this._uploadChanged);
|
141 | }
|
142 | this._browserModel = browserModel;
|
143 | this._items = [];
|
144 | if (this._browserModel !== null) {
|
145 | this._browserModel.uploadChanged.connect(this._uploadChanged);
|
146 | }
|
147 | this.stateChanged.emit(void 0);
|
148 | }
|
149 | }
|
150 | FileUploadStatus.Model = Model;
|
151 | })(FileUploadStatus || (FileUploadStatus = {}));
|
152 |
|
\ | No newline at end of file |