diff --git a/kbase-extension/static/kbase/css/kbaseNarrative.css b/kbase-extension/static/kbase/css/kbaseNarrative.css index efef627db6..6aea2b269e 100644 --- a/kbase-extension/static/kbase/css/kbaseNarrative.css +++ b/kbase-extension/static/kbase/css/kbaseNarrative.css @@ -17,7 +17,7 @@ margin: 2em 4.5em; } -.text-button { +.btn__text { background: #FFFFFF; box-sizing: border-box; border-radius: 4px; @@ -35,26 +35,26 @@ height: 34px; } -.text-button:hover { +.btn__text:hover { color: #36618E; border: 1px solid #ECF2F7; background-color: #ECF2F7; cursor: pointer; } -.text-button:focus { +.btn__text:focus { color: #36618E; border: 1px solid #E3EBF3; background-color: #E3EBF3; } -.text-button:active { +.btn__text:active { color: #36618E; border: 1px solid #D9E4EF; background-color: #D9E4EF; } -.text-button:disabled { +.btn__text:disabled { color: #929292; border: 1px solid #FAFAFA; background-color: #FAFAFA; @@ -64,6 +64,55 @@ margin: 6px; } +.dz-file { + width:100%; + border: 1px solid #EEEEEE; + margin: 2px 0px; + padding: 5px 0px; + font-family: Oxygen, Arial, sans-serif; + font-style: normal; + font-size: 16px; +} + +.dz-file__row { + display: flex; + align-items: center; +} + +.dz-file__name { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + line-height: 20px; +} + +.dz-file__msg { + overflow: hidden; + text-overflow: ellipsis; + font-size: 14px; +} + +.dz-file__msg__success { + display:none; + color: #4BAF4F; +} + +.dz-file__progress__bar { + margin-bottom: inherit; + margin-left: 5px; +} + +.dz-file__icon { + margin: 0 2px 0 2px; + display: none; + font-weight: bold; + align-items: center; +} + +.dz-file__icon__success { + color: #4BAF4F; +} + #kb-data-staging-table_wrapper { margin-top: 44px; } diff --git a/kbase-extension/static/kbase/js/widgets/narrative_core/upload/fileUploadWidget.js b/kbase-extension/static/kbase/js/widgets/narrative_core/upload/fileUploadWidget.js index 6e7d591961..f7a7edf7e8 100644 --- a/kbase-extension/static/kbase/js/widgets/narrative_core/upload/fileUploadWidget.js +++ b/kbase-extension/static/kbase/js/widgets/narrative_core/upload/fileUploadWidget.js @@ -85,20 +85,23 @@ define([ $dropzoneElem.find('#global-info').css({'display': 'inline'}); $dropzoneElem.find('#upload-message').text(this.makeUploadMessage()); + // If there is a button already in the area, it has to be removed, + // and appened to the new document when additional errored files are added. + if ($dropzoneElem.find('#clear-all-btn').length){ + this.deleteClearAllButton(); + $dropzoneElem.append(this.makeClearAllButton()); + } + }) .on('success', (file, serverResponse) => { + var $successElem = $(file.previewElement); + $successElem.find('#upload_progress_and_cancel').hide(); + $successElem.find('#dz_file_row_1').css({"display": "flex", "align-items": "center"}); + $successElem.find('#success_icon').css('display', 'flex'); + $successElem.find('#success_message').css('display', 'inline'); $dropzoneElem.find('#upload-message').text(this.makeUploadMessage()); - file.previewElement.querySelector('#status-message').textContent = 'Completed'; - file.previewElement.querySelector('.progress').style.display = 'none'; - file.previewElement.querySelector('#status-message').style.display = 'inline'; - $(file.previewElement.querySelector('.fa-ban')).removeClass('fa-ban').addClass('fa-check'); - $(file.previewElement.querySelector('.btn-danger')).removeClass('btn-danger').addClass('btn-success'); - if (this.dropzone.getQueuedFiles().length === 0 && - this.dropzone.getUploadingFiles().length === 0) { - $($dropzoneElem.find('#total-progress')).fadeOut(1000, function() { - $($dropzoneElem.find('#total-progress .progress-bar')).css({'width': '0%'}); - }); - } + + this.removeProgressBar($dropzoneElem); $(file.previewElement).fadeOut(1000, function() { $(file.previewElement.querySelector('.btn')).trigger('click'); }); @@ -124,22 +127,23 @@ define([ $dropzoneElem.find('#global-info').css({'display': 'none'}); $($dropzoneElem.find('#total-progress .progress-bar')).css({'width': '0%'}); }) - .on('error', (err) => { + .on('error', (erroredFile) => { + var $errorElem = $(erroredFile.previewElement); + $errorElem.find('#upload_progress_and_cancel').hide(); + $errorElem.find('#dz_file_row_1').css({"display": "flex", "align-items": "center"}); + $errorElem.css('color', '#DF0002'); + $errorElem.find('#error_icon').css('display', 'flex'); + + this.removeProgressBar($dropzoneElem); let errorText = 'unable to upload file!'; - if (err && err.xhr && err.xhr.responseText) { - errorText = err.xhr.responseText; + if (erroredFile && erroredFile.xhr && erroredFile.xhr.responseText) { + errorText = erroredFile.xhr.responseText; } - $dropzoneElem.find('.error.text-danger').text('Error: ' + errorText); + $dropzoneElem.find('#error_message').text('Error: ' + errorText); // Check to see if there already a button in the dropzone area if (!$dropzoneElem.find('#clear-all-btn').length){ $dropzoneElem.append(this.makeClearAllButton()); - - } else { - // If there is a button already in the area, it has to be removed, - // and appened to the new document when additional errored files are added. - this.deleteClearAllButton(); - $dropzoneElem.append(this.makeClearAllButton()); } }); }, @@ -147,7 +151,7 @@ define([ makeClearAllButton: function() { var $clearAllBtn = $(' + + + +
+
+ Error + +
+
+ Completed + +
-
-
- +
+
+
+
Successfully moved to stagin area!
\ No newline at end of file diff --git a/src/config.json b/src/config.json index f9268f2ab8..57119633c1 100644 --- a/src/config.json +++ b/src/config.json @@ -103,7 +103,7 @@ "google_ad_conversion": "kR9OCLas4JgBEOy2pucC" }, "comm_wait_timeout": 600000, - "config": "narrative-refactor", + "config": "dev", "data_panel": { "initial_sort_limit": 10000, "max_name_length": 33, @@ -379,7 +379,7 @@ "upload": { "timeout": 0, "parallel_uploads": 10, - "max_file_size": 20480, + "max_file_size": 1, "globus_upload_url": "https://app.globus.org/file-manager?destination_id=c3c0a65f-5827-4834-b6c9-388b0b19953a" }, "use_local_widgets": true,