From 136f816d9f4a34409c0776c52c2d3e218f0414bd Mon Sep 17 00:00:00 2001 From: Steve Breker Date: Fri, 11 Dec 2020 00:20:51 +0000 Subject: [PATCH] Replace Flash upload with Uppy, refs #13319 This commit removes the YAHOO.widget.Uploader SFW Flash library. The mulitupload window now uses Uppy.io to achieve equivalent functionality. - Uppy UI strings will be available for translation in Weblate. - Uppy will respect AtoM's file size limits. - Includes bulk title update screen. --- COPYRIGHT | 6 + .../actions/showAudioComponent.class.php | 4 +- .../actions/showVideoComponent.class.php | 4 +- .../actions/uploadAction.class.php | 37 +- .../digitalobject/templates/_showAudio.php | 2 +- .../digitalobject/templates/_showVideo.php | 2 +- .../actions/multiFileUpdateAction.class.php | 122 + .../actions/multiFileUploadAction.class.php | 18 +- .../modules/informationobject/config/view.yml | 9 + .../templates/multiFileUpdateSuccess.php | 65 + .../templates/multiFileUploadSuccess.php | 99 +- js/multiFileUpload.js | 713 +- .../DigitalObjectTitleUpdateForm.class.php | 74 + lib/model/QubitDigitalObject.php | 26 + .../css/less/scaffolding.less | 14 + vendor/uppy/uppy-bundle.css | 2528 +++ vendor/uppy/uppy-bundle.js | 14053 ++++++++++++++++ vendor/uppy/uppy-custom.js | 20 + 18 files changed, 17353 insertions(+), 443 deletions(-) create mode 100644 apps/qubit/modules/informationobject/actions/multiFileUpdateAction.class.php create mode 100644 apps/qubit/modules/informationobject/templates/multiFileUpdateSuccess.php create mode 100644 lib/form/DigitalObjectTitleUpdateForm.class.php create mode 100644 vendor/uppy/uppy-bundle.css create mode 100644 vendor/uppy/uppy-bundle.js create mode 100644 vendor/uppy/uppy-custom.js diff --git a/COPYRIGHT b/COPYRIGHT index e5a71afc99..7f1474e22e 100644 --- a/COPYRIGHT +++ b/COPYRIGHT @@ -214,3 +214,9 @@ Parsedown Extra Url: https://github.com/erusev/parsedown-extra Copyright: Emanuil Rusev, erusev.com License: MIT + +Uppy +---- +Url: https://github.com/transloadit/uppy +Copyright: 2019 Transloadit (https://transloadit.com) +License: MIT diff --git a/apps/qubit/modules/digitalobject/actions/showAudioComponent.class.php b/apps/qubit/modules/digitalobject/actions/showAudioComponent.class.php index 7b114bd078..e9173bd45c 100644 --- a/apps/qubit/modules/digitalobject/actions/showAudioComponent.class.php +++ b/apps/qubit/modules/digitalobject/actions/showAudioComponent.class.php @@ -46,7 +46,7 @@ public function execute($request) // Set up display of video in mediaelement if ($this->representation) { - $this->showFlashPlayer = true; + $this->showMediaPlayer = true; $this->response->addJavaScript('/vendor/mediaelement/mediaelement-and-player.min.js', 'last'); $this->response->addJavaScript('mediaelement', 'last'); @@ -54,7 +54,7 @@ public function execute($request) } else { - $this->showFlashPlayer = false; + $this->showMediaPlayer = false; $this->representation = QubitDigitalObject::getGenericRepresentation($this->resource->mimeType, $this->usageType); } diff --git a/apps/qubit/modules/digitalobject/actions/showVideoComponent.class.php b/apps/qubit/modules/digitalobject/actions/showVideoComponent.class.php index 089a4173de..1035870a0f 100644 --- a/apps/qubit/modules/digitalobject/actions/showVideoComponent.class.php +++ b/apps/qubit/modules/digitalobject/actions/showVideoComponent.class.php @@ -52,7 +52,7 @@ public function execute($request) // If this is a reference movie, get the thumbnail representation for the // place holder image - $this->showFlashPlayer = true; + $this->showMediaPlayer = true; if (QubitTerm::REFERENCE_ID == $this->usageType) { $this->thumbnail = $this->resource->getRepresentationByUsage(QubitTerm::THUMBNAIL_ID); @@ -66,7 +66,7 @@ public function execute($request) // If representation is not a valid digital object, return a generic icon else { - $this->showFlashPlayer = false; + $this->showMediaPlayer = false; $this->representation = QubitDigitalObject::getGenericRepresentation($this->resource->mimeType, $this->usageType); } } diff --git a/apps/qubit/modules/digitalobject/actions/uploadAction.class.php b/apps/qubit/modules/digitalobject/actions/uploadAction.class.php index 2ed5d06765..7b90b4856d 100644 --- a/apps/qubit/modules/digitalobject/actions/uploadAction.class.php +++ b/apps/qubit/modules/digitalobject/actions/uploadAction.class.php @@ -28,7 +28,7 @@ public function execute($request) $uploadFiles = array(); $warning = null; - $this->object = QubitObject::getById($request->objectId); + $this->object = QubitObject::getBySlug($request->parentSlug); if (!isset($this->object)) { @@ -91,45 +91,10 @@ public function execute($request) $tmpFileName = basename($tmpFilePath); $tmpFileMimeType = QubitDigitalObject::deriveMimeType($tmpFileName); - // Thumbnail name and path - $thumbName = pathinfo('THUMB'. $tmpFileName, PATHINFO_FILENAME) .".jpg"; - $thumbPath = dirname($tmpFilePath) ."/". $thumbName; - - if ($canThumbnail = QubitDigitalObject::canThumbnailMimeType($tmpFileMimeType) || QubitDigitalObject::isVideoFile($tmpFilePath)) - { - if (QubitDigitalObject::isImageFile($tmpFilePath) || 'application/pdf' == $tmpFileMimeType) - { - $resizedObject = QubitDigitalObject::resizeImage($tmpFilePath, 150, 150); - } - else if (QubitDigitalObject::isVideoFile($tmpFilePath)) - { - $resizedObject = QubitDigitalObject::createThumbnailFromVideo($tmpFilePath, 150, 150); - } - - if (0 < strlen($resizedObject)) - { - file_put_contents($thumbPath, $resizedObject); - chmod($thumbPath, 0644); - } - - // Show a warning message if object couldn't be thumbnailed when it is - // supposed to be possible - if (!file_exists($thumbPath) && 0 >= filesize($thumbPath)) - { - $warning = $this->context->i18n->__('File %1% could not be thumbnailed', array('%1%' => $file['name'])); - } - } - else - { - $thumbName = '../../images/'.QubitDigitalObject::getGenericIconPath($tmpFileMimeType, QubitTerm::THUMBNAIL_ID); - } - $uploadFiles = array( - 'canThumbnail' => $canThumbnail, 'name' => $file['name'], 'md5sum' => md5_file($tmpFilePath), 'size' => hr_filesize($file['size']), - 'thumb' => $thumbName, 'tmpName' => $tmpFileName, 'warning' => $warning); diff --git a/apps/qubit/modules/digitalobject/templates/_showAudio.php b/apps/qubit/modules/digitalobject/templates/_showAudio.php index 9be06afeb7..356590f569 100644 --- a/apps/qubit/modules/digitalobject/templates/_showAudio.php +++ b/apps/qubit/modules/digitalobject/templates/_showAudio.php @@ -2,7 +2,7 @@ - +
diff --git a/apps/qubit/modules/digitalobject/templates/_showVideo.php b/apps/qubit/modules/digitalobject/templates/_showVideo.php index d4f04811d7..c0369e9873 100644 --- a/apps/qubit/modules/digitalobject/templates/_showVideo.php +++ b/apps/qubit/modules/digitalobject/templates/_showVideo.php @@ -10,7 +10,7 @@ - +
diff --git a/apps/qubit/modules/informationobject/actions/multiFileUpdateAction.class.php b/apps/qubit/modules/informationobject/actions/multiFileUpdateAction.class.php new file mode 100644 index 0000000000..0df88dbf9f --- /dev/null +++ b/apps/qubit/modules/informationobject/actions/multiFileUpdateAction.class.php @@ -0,0 +1,122 @@ +. + */ + +class InformationObjectMultiFileUpdateAction extends sfAction +{ + protected $informationObjectList = array(); + protected $informationObjectOrignalTitles = array(); + + public function execute($request) + { + $this->resource = $this->getRoute()->resource; + + // Check user authorization + if (!QubitAcl::check($this->resource, 'update')) + { + QubitAcl::forwardUnauthorized(); + } + + // Check that object exists and that it is not the root + if (!isset($this->resource) || !isset($this->resource->parent)) + { + $this->forward404(); + } + + if (isset($request->items)) + { + if (false === $this->items = explode(",", $request->items)) + { + $this->forward404(); + } + + foreach ($this->items as $slug) + { + if (null !== $io = QubitInformationObject::getBySlug($slug)) + { + if (!QubitAcl::check($io, 'update')) + { + continue; + } + + // Child IOs should not be root and should be direct descendants of resource. + if (!isset($io->parent) || $io->parentId !== $this->resource->id) + { + continue; + } + + $this->informationObjectList[$slug] = $io; + $this->informationObjectOrignalTitles[$slug] = $io->title; + } + else + { + continue; + } + } + } + + $this->digitalObjectTitleForm = new DigitalObjectTitleUpdateForm(array(), + array('informationObjects' => $this->informationObjectList)); + + // Handle POST data (form submit) + if ($request->isMethod('post')) + { + $this->digitalObjectTitleForm->bind($request->titles); + + if ($this->digitalObjectTitleForm->isValid()) + { + $this->updateDigitalObjectTitles(); + $this->redirect(array($this->resource, 'module' => 'informationobject')); + } + } + + $this->populateDigitalObjectTitleForm(); + } + + /** + * Populate the ui_label form with database values (localized) + */ + protected function populateDigitalObjectTitleForm() + { + foreach ($this->digitalObjectTitleForm->getInformationObjects() as $io) + { + $this->digitalObjectTitleForm->setDefault($io->id, $io->getTitle(array('cultureFallback' => true))); + } + } + + /** + * Update ui_label db values with form values (localized) + * + * @return $this + */ + protected function updateDigitalObjectTitles() + { + foreach ($this->digitalObjectTitleForm->getInformationObjects() as $informationObject) + { + if (null !== $title = $this->digitalObjectTitleForm->getValue($informationObject->id)) + { + // Test if title changed. + if ($this->informationObjectOrignalTitles[$informationObject->id] !== $title) + { + $informationObject->title = $title; + $informationObject->save(); + } + } + } + } +} diff --git a/apps/qubit/modules/informationobject/actions/multiFileUploadAction.class.php b/apps/qubit/modules/informationobject/actions/multiFileUploadAction.class.php index 7de89ef0d2..ecc9750b4c 100644 --- a/apps/qubit/modules/informationobject/actions/multiFileUploadAction.class.php +++ b/apps/qubit/modules/informationobject/actions/multiFileUploadAction.class.php @@ -43,16 +43,11 @@ public function execute($request) QubitAcl::forwardToSecureAction(); } - // Add javascript libraries - $this->response->addJavaScript('/vendor/yui/logger/logger', 'last'); - $this->response->addJavaScript('/vendor/yui/uploader/uploader-min', 'last'); - $this->response->addJavaScript('multiFileUpload', 'last'); - // Get max upload size limits - $this->maxUploadSize = QubitDigitalObject::getMaxUploadSize(); + $this->maxFileSize = QubitDigitalObject::getMaxUploadSize(); + $this->maxPostSize = QubitDigitalObject::getMaxPostSize(); // Paths for uploader javascript - $this->uploadSwfPath = "{$this->request->getRelativeUrlRoot()}/vendor/yui/uploader/assets/uploader.swf"; $this->uploadResponsePath = "{$this->context->routing->generate(null, array('module' => 'digitalobject', 'action' => 'upload'))}?".http_build_query(array(session_name() => session_id())); $this->uploadTmpDir = "{$this->request->getRelativeUrlRoot()}/uploads/tmp"; @@ -90,6 +85,7 @@ public function processForm() // Upload files $i = 0; + $informationObjectSlugList = array(); foreach ($this->form->getValue('files') as $file) { @@ -131,19 +127,15 @@ public function processForm() $digitalObject->save(); } - $thumbnailIsGeneric = (bool) strstr($file['thumb'], 'generic-icons'); + $informationObjectSlugList[] = $informationObject->slug; // Clean up temp files if (file_exists("$tmpPath/$file[tmpName]")) { unlink("$tmpPath/$file[tmpName]"); } - if (!$thumbnailIsGeneric && file_exists("$tmpPath/$file[thumb]")) - { - unlink("$tmpPath/$file[thumb]"); - } } - $this->redirect(array($this->resource, 'module' => 'informationobject')); + $this->redirect(array($this->resource, 'module' => 'informationobject', 'action' => 'multiFileUpdate', 'items' => implode(",", $informationObjectSlugList))); } } diff --git a/apps/qubit/modules/informationobject/config/view.yml b/apps/qubit/modules/informationobject/config/view.yml index b25a265119..b4dd986e3a 100644 --- a/apps/qubit/modules/informationobject/config/view.yml +++ b/apps/qubit/modules/informationobject/config/view.yml @@ -16,7 +16,11 @@ physicalObjects: /plugins/sfDrupalPlugin/vendor/drupal/misc/tableheader: multiFileUploadSuccess: + stylesheets: + /vendor/uppy/uppy-bundle.css: javascripts: + /vendor/uppy/uppy-bundle.js: + multiFileUpload: /plugins/sfDrupalPlugin/vendor/drupal/misc/collapse: /plugins/sfDrupalPlugin/vendor/drupal/misc/form: description: @@ -26,6 +30,11 @@ storageLocationsSuccess: stylesheets: print-reports: { media: screen, position: last } +multiFileUpdateSuccess: + javascripts: + /plugins/sfDrupalPlugin/vendor/drupal/misc/collapse: + /plugins/sfDrupalPlugin/vendor/drupal/misc/form: + renameSuccess: javascripts: /plugins/sfDrupalPlugin/vendor/drupal/misc/collapse: diff --git a/apps/qubit/modules/informationobject/templates/multiFileUpdateSuccess.php b/apps/qubit/modules/informationobject/templates/multiFileUpdateSuccess.php new file mode 100644 index 0000000000..3839424db3 --- /dev/null +++ b/apps/qubit/modules/informationobject/templates/multiFileUpdateSuccess.php @@ -0,0 +1,65 @@ + + + +

+ + +

+ + + + + renderGlobalErrors() ?> + renderFormTag(url_for(array($resource, 'module' => 'informationobject', 'action' => 'multiFileUpdate', 'items' => $sf_request->items)), array('method' => 'post', 'id' => 'bulk-title-update-form')) ?> + renderHiddenFields() ?> + +
+ + + + + + + + + + getInformationObjects() as $io): ?> + + + + + + +
+ digitalObjectsRelatedByobjectId as $do): ?> + getRepresentationByUsage(QubitTerm::THUMBNAIL_ID)) + && QubitAcl::check($io, 'readThumbnail') + ): ?> + getFullPath(), array('alt' => __($do->getDigitalObjectAltText() ?: 'Original %1% not accessible', array('%1%' => sfConfig::get('app_ui_label_digitalobject'))))) ?> + + mediaTypeId), array('alt' => __($do->getDigitalObjectAltText() ?: 'Original %1% not accessible', array('%1%' => sfConfig::get('app_ui_label_digitalobject'))))) ?> + + + + getCulture() != $io->getSourceCulture() && !strlen($io->title)): ?> +
+ id]->getValue(), $io) ?> +
+ + + id] + ->label(__('Title')) ?> + digitalObjectsRelatedByobjectId[0]->name) ?> + levelOfDescription)) ?> +
+
+ +
+
    +
    • +
+
+ + + diff --git a/apps/qubit/modules/informationobject/templates/multiFileUploadSuccess.php b/apps/qubit/modules/informationobject/templates/multiFileUploadSuccess.php index 0378c25658..c9e3b1b79e 100644 --- a/apps/qubit/modules/informationobject/templates/multiFileUploadSuccess.php +++ b/apps/qubit/modules/informationobject/templates/multiFileUploadSuccess.php @@ -22,18 +22,6 @@ - -
@@ -45,14 +33,14 @@
  • 'informationobject')) ?>
- +
renderGlobalErrors() ?> - renderFormTag(url_for(array($resource, 'module' => 'informationobject', 'action' => 'multiFileUpload')), array('id' => 'multiFileUploadForm', 'style' => 'display: none')) ?> + renderFormTag(url_for(array($resource, 'module' => 'informationobject', 'action' => 'multiFileUpload')), array('id' => 'multiFileUploadForm', 'style' => 'inline')) ?> renderHiddenFields() ?> @@ -62,6 +50,12 @@ +
+

+

+

+
+ title ->help(__('The "%dd%" placeholder will be replaced with a incremental number (e.g. \'image 01\', \'image 02\')')) ->label(__('Title')) @@ -71,7 +65,7 @@ ->label(__('Level of description')) ->renderRow() ?> -
+

@@ -79,13 +73,10 @@
-
- +
-
- @@ -93,7 +84,7 @@
  • 'informationobject'), array('class' => 'c-btn')) ?>
    • -
    • +
@@ -104,42 +95,48 @@ - id'; +Qubit.multiFileUpload.slug = '$resource->slug'; Qubit.multiFileUpload.thumbWidth = 150; -Qubit.multiFileUpload.i18nUploading = '{$sf_context->i18n->__('Uploading...')}'; -Qubit.multiFileUpload.i18nLoadingPreview = '{$sf_context->i18n->__('Loading preview...')}'; -Qubit.multiFileUpload.i18nWaiting = '{$sf_context->i18n->__('Waiting...')}'; -Qubit.multiFileUpload.i18nUploadError = '{$sf_context->i18n->__('Upload error, retry?')}'; +Qubit.multiFileUpload.i18nMaxFileSizeMessage = '{$sf_context->i18n->__('Maximum file size: ')}'; +Qubit.multiFileUpload.i18nMaxPostSizeMessage = '{$sf_context->i18n->__('Maximum total upload size: ')}'; +Qubit.multiFileUpload.i18nMaxSizeNote = '{$sf_context->i18n->__('%{maxFileSizeMessage}; %{maxPostSizeMessage}')}'; +Qubit.multiFileUpload.i18nRetry = '{$sf_context->i18n->__('Retry')}'; Qubit.multiFileUpload.i18nInfoObjectTitle = '{$sf_context->i18n->__('Title')}'; -Qubit.multiFileUpload.i18nFilename = '{$sf_context->i18n->__('Filename')}'; -Qubit.multiFileUpload.i18nFilesize = '{$sf_context->i18n->__('Filesize')}'; -Qubit.multiFileUpload.i18nDelete = '{$sf_context->i18n->__('Delete')}'; +Qubit.multiFileUpload.i18nSave = '{$sf_context->i18n->__('Save')}'; +Qubit.multiFileUpload.i18nAddMoreFiles = '{$sf_context->i18n->__('Add more files')}'; +Qubit.multiFileUpload.i18nAddMore = '{$sf_context->i18n->__('Add more')}'; +Qubit.multiFileUpload.i18nAddingMoreFiles = '{$sf_context->i18n->__('Adding more files')}'; +Qubit.multiFileUpload.i18nSomeFilesFailedError = '{$sf_context->i18n->__('Some files failed to upload. Press the \\\'Import\\\' button to continue importing anyways, or press \\\'Retry\\\' to re-attempt upload.')}'; +Qubit.multiFileUpload.i18nRetrySuccess = '{$sf_context->i18n->__('Files successfully uploaded! Press the \\\'Import\\\' button to complete importing these files.')}'; +Qubit.multiFileUpload.i18nFileSelected = '{$sf_context->i18n->__('%{smart_count} file selected')}'; +Qubit.multiFileUpload.i18nFilesSelected = '{$sf_context->i18n->__('%{smart_count} files selected')}'; +Qubit.multiFileUpload.i18nUploading = '{$sf_context->i18n->__('Uploading')}'; +Qubit.multiFileUpload.i18nComplete = '{$sf_context->i18n->__('Complete')}'; +Qubit.multiFileUpload.i18nUploadFailed = '{$sf_context->i18n->__('Upload failed')}'; +Qubit.multiFileUpload.i18nRemoveFile = '{$sf_context->i18n->__('Remove file')}'; +Qubit.multiFileUpload.i18nDropFile = '{$sf_context->i18n->__('Drop files here, paste or %{browse}')}'; +Qubit.multiFileUpload.i18nFileUploadedOfTotal = '{$sf_context->i18n->__('%{complete} of %{smart_count} file uploaded')}'; +Qubit.multiFileUpload.i18nFilesUploadedOfTotal = '{$sf_context->i18n->__('%{complete} of %{smart_count} files uploaded')}'; +Qubit.multiFileUpload.i18nDataUploadedOfTotal = '{$sf_context->i18n->__('%{complete} of %{total}')}'; +Qubit.multiFileUpload.i18nTimeLeft = '{$sf_context->i18n->__('%{time} left')}'; Qubit.multiFileUpload.i18nCancel = '{$sf_context->i18n->__('Cancel')}'; -Qubit.multiFileUpload.i18nStart = '{$sf_context->i18n->__('Start')}'; -Qubit.multiFileUpload.i18nDuplicateFile = '{$sf_context->i18n->__('Warning: duplicate of %1%')}'; -Qubit.multiFileUpload.i18nOversizedFile = '{$sf_context->i18n->__('This file couldn\\\'t be uploaded because of file size upload limits')}'; - +Qubit.multiFileUpload.i18nEdit = '{$sf_context->i18n->__('Edit')}'; +Qubit.multiFileUpload.i18nBack = '{$sf_context->i18n->__('Back')}'; +Qubit.multiFileUpload.i18nEditing = '{$sf_context->i18n->__('Editing %{file}')}'; +Qubit.multiFileUpload.i18nUploadingFile = '{$sf_context->i18n->__('Uploading %{smart_count} file')}'; +Qubit.multiFileUpload.i18nUploadingFiles = '{$sf_context->i18n->__('Uploading %{smart_count} files')}'; +Qubit.multiFileUpload.i18nImporting = '{$sf_context->i18n->__('Importing digital objects - please wait...')}'; +Qubit.multiFileUpload.i18nFailedToUpload = '{$sf_context->i18n->__('Failed to upload %{file}')}'; +Qubit.multiFileUpload.i18nSizeError = '{$sf_context->i18n->__('Skipping file %{fileName} because file size %{fileSize} is larger than file size limit of %{maxSize} MB')}'; +Qubit.multiFileUpload.i18nNoFilesError = '{$sf_context->i18n->__('Please add a file to begin uploading.')}'; +Qubit.multiFileUpload.i18nNoSuccessfulFilesError = '{$sf_context->i18n->__('Files not uploaded successfully. Please retry.')}'; +Qubit.multiFileUpload.i18nPostSizeError = '{$sf_context->i18n->__('Upload limit of %{maxPostSize} MB reached. Unable to add additional files.')}'; content ) ?> diff --git a/js/multiFileUpload.js b/js/multiFileUpload.js index 75dde91ebd..11fdc9635a 100644 --- a/js/multiFileUpload.js +++ b/js/multiFileUpload.js @@ -1,351 +1,390 @@ -(function ($) +(function ($) { + + "use strict"; + + Qubit.multiFileUpload = Qubit.multiFileUpload || {}; + + function MultiFileUpload (element) { - Qubit.multiFileUpload = Qubit.multiFileUpload || {}; - - Drupal.behaviors.multiFileUpload = { - attach: function (context) - { - // Enable uploader - var uploader = new YAHOO.widget.Uploader('uploaderOverlay'); - - // Put swf object over "Select files" button - var uiLayer = YAHOO.util.Dom.getRegion('selectLink'); - var overlay = $('#uploaderOverlay'); - overlay.width(uiLayer.right - uiLayer.left); - overlay.height(uiLayer.bottom - uiLayer.top); - - function parseHtmlId(id) - { - var yuiId = id.match(/([0-9]+)$/).shift(); - - if (null != yuiId && !isNaN(parseInt(yuiId))) - { - return yuiId; + this.uppy = new Uppy.Core({ + debug: false, + id: 'uppy-atom', + autoProceed: false, + restrictions: { + minNumberOfFiles: 1 + }, + onBeforeFileAdded: (currentFile, files) => this.onBeforeFileAddedChecks(currentFile, files), + }); + + this.nextImageNum = 1; + this.uploadItems = []; + this.result = ""; + + this.$element = $(element); + this.$submitButton = this.$element.find('input[type="submit"]'); + this.$cancelButton = this.$element.find('a[title="Cancel"]'); + this.$retryButton = $('') + .attr('type','hidden') + .text(Qubit.multiFileUpload.i18nRetry) + .appendTo('.actions'); + + this.init(); + this.listen(); + }; + + + MultiFileUpload.prototype = { + + init: function() + { + this.$retryButton.hide(); + + let noteText = Qubit.multiFileUpload.i18nMaxSizeNote + .replace('%{maxFileSizeMessage}', Qubit.multiFileUpload.i18nMaxFileSizeMessage + Qubit.multiFileUpload.maxFileSize / 1024 / 1024 + "MB") + .replace('%{maxPostSizeMessage}', Qubit.multiFileUpload.i18nMaxPostSizeMessage + Qubit.multiFileUpload.maxPostSize / 1024 / 1024 + "MB"); + + this.uppy + .use(Uppy.Dashboard, { + id: 'dashboard-atom', + inline: true, + target: '.uppy-dashboard', + width: '100%', + height: '400px', + hideUploadButton: true, + replaceTargetContent: true, + showProgressDetails: true, + hideCancelButton: true, + hideAfterFinish: true, + hideRetryButton: true, + note: noteText, + doneButtonHandler: null, + browserBackButtonClose: false, + fileManagerSelectionType: 'files', + proudlyDisplayPoweredByUppy: false, + closeModalOnClickOutside: false, + hideDoneButton: true, + locale: { + strings: { + done: Qubit.multiFileUpload.i18nSave, + // 'Add more' hover text. + addMoreFiles: Qubit.multiFileUpload.i18nAddMoreFiles, + // 'Add more' button label. + addMore: Qubit.multiFileUpload.i18nAddMore, + addingMoreFiles: Qubit.multiFileUpload.i18nAddingMoreFiles, + xFilesSelected: { + 0: Qubit.multiFileUpload.i18nFileSelected, + 1: Qubit.multiFileUpload.i18nFilesSelected + }, + // Upload status strings. + uploading: Qubit.multiFileUpload.i18nUploading, + complete: Qubit.multiFileUpload.i18nComplete, + uploadFailed: Qubit.multiFileUpload.i18nUploadFailed, + // Remove file hover text. + removeFile: Qubit.multiFileUpload.i18nRemoveFile, + // Main 'drop here' message. + dropPaste: Qubit.multiFileUpload.i18nDropFile, + filesUploadedOfTotal: { + 0: Qubit.multiFileUpload.i18nFileUploadedOfTotal, + 1: Qubit.multiFileUpload.i18nFilesUploadedOfTotal + }, + dataUploadedOfTotal: Qubit.multiFileUpload.i18nDataUploadedOfTotal, + // When `showProgressDetails` is set, shows an estimation of how long the upload will take to complete. + xTimeLeft: Qubit.multiFileUpload.i18nTimeLeft, + uploadingXFiles: { + 0: Qubit.multiFileUpload.i18nUploadingFile, + 1: Qubit.multiFileUpload.i18nUploadingFiles + }, + // Label cancel button. + cancel: Qubit.multiFileUpload.i18nCancel, + // Edit file hover text. + edit: Qubit.multiFileUpload.i18nEdit, + // Save changes button. + saveChanges: Qubit.multiFileUpload.i18nSave, + // Leave 'Add more' dialog. + back: Qubit.multiFileUpload.i18nBack, + // Edit Title dialog message. + editing: Qubit.multiFileUpload.i18nEditing, + failedToUpload: Qubit.multiFileUpload.i18nFailedToUpload, } - }; + }, + thumbnailWidth: Qubit.multiFileUpload.thumbWidth, + trigger: '#pick-files', + // Enable editing of field with id 'title' label: 'Title' + metaFields: [ + { id: 'title', name: Qubit.multiFileUpload.i18nInfoObjectTitle }, + ], + }) + .use(Uppy.XHRUpload, { + endpoint: Qubit.multiFileUpload.uploadResponsePath, + formData: true, + method: 'post', + limit: 10, + fieldName: 'Filedata', + parentSlug: Qubit.multiFileUpload.slug, + }) + .on('upload-success', $.proxy(this.onUploadSuccess, this)) + .on('complete', $.proxy(this.onComplete, this)) + .on('file-added', $.proxy(this.onFileAdded, this)) + .on('cancel-all', $.proxy(this.onCancelAll, this)); + }, + + listen: function () + { + // Intercept AtoM's Submit button. + this.$submitButton.on('click', $.proxy(this.onSubmitButton, this)); + this.$retryButton.on('click', $.proxy(this.onRetryButton, this)); + }, + + // Retry is available if some/all DO's do not successfully upload. + onRetryButton: function () + { + this.uppy.retryAll().then((result) => { + if (this.uppy.getState().error === null && result.successful.length > 0 && result.failed.length === 0) { + this.$retryButton.hide(); + this.showAlert(Qubit.multiFileUpload.i18nRetrySuccess, 'alert-info'); + } + }) + }, + + // Checks if ANY uploads were successful. + checkUploadSuccessful: function () + { + const uploaded = (element) => element.progress.uploadComplete === true; + var completed = this.uppy.getFiles().some(uploaded); + + return completed; + }, + + // Import button logic. + onSubmitButton: function () + { + this.clearAlerts(); + + // Ensure they are not on Uppy's 'add more' page. Do not allow uppy.upload() to + // be called while 'add more' is open. + if ($(".uppy-DashboardContent-back").length) { + $(".uppy-DashboardContent-back").click(); + } + + // Ensure that some files have been added for upload. + if (this.uppy.getFiles().length == 0) { + this.showAlert(Qubit.multiFileUpload.i18nNoFilesError, 'alert-info'); + + return false; + } + + if (this.uppy.getState().error) { + if (this.checkUploadSuccessful() === true) { + this.$submitButton.attr('disabled', 'disabled'); + this.$cancelButton.removeAttr("href").attr('disabled', 'disabled'); + this.showAlert(Qubit.multiFileUpload.i18nImporting, 'alert-info'); + // Post any successful uploads. + $('#multiFileUploadForm').submit(); + } + else { + // In error state with zero successful uploads. Prevent POST. + this.showAlert(Qubit.multiFileUpload.i18nNoSuccessfulFilesError, 'alert-error'); - function replacePlaceHolder(templateStr, index) - { - var fileName = null; - index = String(index); + return false; + } + } + else { + // Upload to AtoM - wait on promise until all complete. + this.uppy.upload().then((result) => { + if (result.failed.length > 0) { + (this.checkUploadSuccessful() === true) ? + this.showAlert(Qubit.multiFileUpload.i18nSomeFilesFailedError, 'alert-error') : + this.showAlert(Qubit.multiFileUpload.i18nNoSuccessfulFilesError, 'alert-error'); + + this.$retryButton.show(); + } + else { + this.$submitButton.attr('disabled', 'disabled'); + this.$cancelButton.removeAttr("href").attr('disabled', 'disabled'); + this.showAlert(Qubit.multiFileUpload.i18nImporting, 'alert-info'); + // Post to multiFileUpload. + $('#multiFileUploadForm').submit(); + } + }) + } + + return false; + }, + + // Push a record of successful file upload into array uploadItems. + // These will be added to this array in order of when they completed uploading. + // This info is needed to build the hidden form elements once all files + // have completed uploading to AtoM. + onUploadSuccess: function (file, response) + { + this.uploadItems.push({file, response}); + }, + + // onComplete runs when all uploads are complete - even if there were errors. + // Adds the form elements in the same order as result.successful so that + // they are imported into AtoM: Image 01, Image 02, etc. + onComplete: function (result) + { + // Iterates over successfully uploaded items. + var uploadItems = this.uploadItems; + + $.each(result.successful, function(key, file) { + // Get the corresponding upload response. + var fileResponse = uploadItems.find(x => x.file.id === file.id).response; + + // Add hidden form elements for each successfully uploaded file. + $('
' + + '
' + + '
' + + '' + + '' + + '' + + '' + + '' + + '' + + '
' + + '
' + + '
') + .appendTo("#uploads"); + }); + }, + + onBeforeFileAddedChecks: function (currentFile, files) + { + // Ensure currentFile is not larger that AtoM's max file upload size. + if (currentFile.data.size > Qubit.multiFileUpload.maxFileSize) { + let fileName = currentFile.data.name; + let maxSize = Qubit.multiFileUpload.maxFileSize / 1024 / 1024; + let fileSize = (currentFile.data.size / 1024 / 1024).toFixed(2); + let sizeErrorText = Qubit.multiFileUpload.i18nSizeError + .replace('%{fileName}', fileName) + .replace('%{fileSize}', fileSize) + .replace('%{maxSize}', maxSize); + + // Add console mssg and alert error. + this.uppy.log(sizeErrorText); + this.showAlert(sizeErrorText, 'alert-info'); + + // Press the Uppy back button after the error to return to the Dashboard. + if ($(".uppy-DashboardContent-back").length) { + $(".uppy-DashboardContent-back").click(); + } - var matches = templateStr.match(/\%(d+)\%/); + return false; + } - if (null != matches && 0 < matches[1].length) - { - while (matches[1].length > index.length) - { - index = '0' + index; - } + // Watch total size of upload and ensure it's not larger than AtoM's POST size config. + if ((this.getTotalFileSize(files) + currentFile.data.size) > Qubit.multiFileUpload.maxPostSize) { + let maxPostSize = Qubit.multiFileUpload.maxPostSize / 1024 / 1024; + let postSizeErrorText = Qubit.multiFileUpload.i18nPostSizeError + .replace('%{maxPostSize}', maxPostSize); - var fileName = templateStr.replace('%' + matches[1] + '%', index); - } + this.clearAlerts(); - if (null == fileName || templateStr == fileName) - { - fileName = templateStr + ' ' + index; - } + // Add console mssg and alert error. + this.uppy.log(postSizeErrorText); + this.showAlert(postSizeErrorText, 'alert-info'); - return fileName; - } + // Press the Uppy back button after the error to return to the Dashboard. + if ($(".uppy-DashboardContent-back").length) { + $(".uppy-DashboardContent-back").click(); + } - // Update all title values for all uploads - // It is not based on internal yui swfuploader fileID - function renumerateUploads() - { - var title = $('input#title').val(); + return false; + } + }, + + getTotalFileSize: function (files) + { + let totalFileSize = 0; + + if (!files) { + files = this.uppy.getFiles(); + } + + for (var key in files) { + totalFileSize = totalFileSize + files[key].size; + } + + return totalFileSize; + }, + + // Set parentSlug and template-based title when files are added to the Dashboard. + onFileAdded: function (file) + { + this.uppy.setFileMeta(file.id, { + parentSlug: Qubit.multiFileUpload.slug, + title: this.replacePlaceHolder($('input#title').val(), this.nextImageNum++) + }); + }, + + reset: function () + { + this.uploadItems = []; + this.nextImageNum = 1; + }, + + // User pressed cancel - reset upload state. + onCancelAll: function () + { + // Delete all file upload hidden form items. + uploads = document.getElementById("uploads"); + while (uploads.firstChild) { + uploads.removeChild(uploads.lastChild); + } - $('div.multiFileUploadItem:has(input.md5sum)').each(function (i) - { - // Calculate new value - var newValue = replacePlaceHolder(title, i + 1); + // Reset internal vars. + this.reset(); + }, + + // Show an AtoM style alert message. + showAlert: function (message, type) { + if (!type) { + type = 'alert-info'; + } + + var $alert = $('
'); + $alert.append(''); + $alert.append(message).prependTo($('#uploaderContainer')); + + return $alert; + }, + + clearAlerts: function () { + $("div#uploaderContainer > div").remove( ".alert" ); + }, + + // Build title from Title field template. + replacePlaceHolder: function (templateStr, index) + { + var fileName = null; + index = String(index); + var matches = templateStr.match(/\%(d+)\%/); + + if (null != matches && 0 < matches[1].length) { + while (matches[1].length > index.length) { + index = '0' + index; + } - // Replace title value - $(this).find('input[type=text]').val(newValue); - }); - } + var fileName = templateStr.replace('%' + matches[1] + '%', index); + } - function highlightRepeatedFiles() - { - var uploads = $('div.multiFileUploadItem:has(input.md5sum)'); - var memMd5 = Array(); - - uploads.each(function() - { - var md5sum = $(this).find('input.md5sum').val(); - - if (-1 < $.inArray(md5sum, memMd5)) - { - var fileName = $('div.multiFileUploadItem:has(input.md5sum[value=' + md5sum + ']):first div.multiFileUploadInfoFilename span.value').text(); - - $(this) - .addClass('multiFileUploadWarning') - .find('div.messages').remove() - .end().prepend('
' + Qubit.multiFileUpload.i18nDuplicateFile.replace('%1%', '"' + fileName + '"') + '
'); - } - else - { - $(this) - .removeClass('multiFileUploadWarning') - .find('div.messages').remove(); - - memMd5[memMd5.length] = md5sum; - } - }); - } + if (null == fileName || templateStr == fileName) { + fileName = templateStr + ' ' + index; + } - $.on('keyup', 'input#title', renumerateUploads); - - $.on('click', 'a.uploadActionRetry, a.uploadActionStart', function() - { - var fileId = parseHtmlId($(this).closest('.multiFileUploadItem').attr('id')); - - // Upload it - uploader.upload('file' + fileId, Qubit.multiFileUpload.uploadResponsePath, 'POST', { objectId: Qubit.multiFileUpload.objectId }); - - return false; - }); - - $.on('click', 'a.uploadActionDelete', function() - { - var fileId = parseHtmlId($(this).closest('.multiFileUploadItem').attr('id')); - - // Hide block - $('div#upload-file' + fileId).slideUp('normal', function() - { - // Remove it - $(this).remove(); - - renumerateUploads(); - highlightRepeatedFiles(); - }); - - return false; - }); - - $.on('click', 'a.uploadActionCancel', function() - { - var fileId = parseHtmlId($(this).closest('.multiFileUploadItem').attr('id')); - var uploadLayer = $('div#upload-file' + fileId); - - // Hide block - uploadLayer.slideUp('normal', function() - { - // Remove it - $(this).remove(); - - // Cancel upload - uploader.cancel('file' + fileId); - - // Remove file from the queue - uploader.removeFile('file' + fileId); - }); - - return false; - }); - - uploader.addListener('contentReady', function () - { - // Allows multiple file selection in "Browse" dialog. - uploader.setAllowMultipleFiles(true); - uploader.setAllowLogging(true); - }); - - uploader.addListener('fileSelect', function (event) - { - if ('fileList' in event && event.fileList != null) - { - // Make space for a thumbnail and progress bar - for (var i in event.fileList) - { - var file = event.fileList[i]; - - // Create an upload block for each upload - var uploadItem = $('
') - // Insert element in uploads layer - .appendTo('#uploads'); - - if (-1 < Qubit.multiFileUpload.maxUploadSize && file.size > Qubit.multiFileUpload.maxUploadSize) - { - uploadItem - // Add warning class - .addClass('multiFileUploadWarning') - - // Set error message - .html('

' + file.name + '
' + Qubit.multiFileUpload.i18nOversizedFile + '

'); - - // Remove file from uploader queue - uploader.removeFile(file.id); - } - else - { - // Render thumbnail box and progress bar - $(uploadItem) - .html('
' + - '
' + Qubit.multiFileUpload.i18nWaiting + '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '
' + - '' + Qubit.multiFileUpload.i18nFilename + ':' + - '' + file.name + '' + - '
' + - '
' + - '' + Qubit.multiFileUpload.i18nFilesize + ':' + - '' + file.size + ' bytes' + - '
' + - '
' + - '' + Qubit.multiFileUpload.i18nStart + '' + - '' + - '' + - '
' + - '
'); - } - } - - // Preventing simultaneous uploads - uploader.setSimUploadLimit(1); - - // Start upload! - uploader.uploadAll(Qubit.multiFileUpload.uploadResponsePath, 'POST', { objectId: Qubit.multiFileUpload.objectId }); - } - }); - - uploader.addListener('uploadStart', function(event) - { - var uploadLayer = $('#upload-' + event.id); - - $('div.uploadStatus', uploadLayer) - .html('' + Qubit.multiFileUpload.i18nUploading + ''); - - // Show cancel button - $('a.uploadActionCancel', uploadLayer).show(); - - // Hide start button - $('a.uploadActionStart', uploadLayer).hide(); - }); - - uploader.addListener('uploadProgress', function (event) - { - var thumbnailLayer = $('#thumbnail-' + event.id); - var statusLayer = $('div.uploadStatus', thumbnailLayer); - - var progress = Math.round(Qubit.multiFileUpload.thumbWidth * (event.bytesLoaded / event.bytesTotal)); - var progressBar = '
'; - - // Update progress bar - $('div.progressBar', thumbnailLayer).html(progressBar); - - // Update status message - if (event.bytesLoaded != event.bytesTotal) - { - $('span', statusLayer).text(Qubit.multiFileUpload.i18nUploading + ' ' + Math.round(event.bytesLoaded / event.bytesTotal * 100) + '%'); - } - else - { - $('span', statusLayer).text(Qubit.multiFileUpload.i18nLoadingPreview); - } - }); - - uploader.addListener('uploadComplete', function (event) - { - var thumbnailLayer = $('#thumbnail-' + event.id); - var infoLayer = thumbnailLayer.next(); - - var progressBar = '
'; - - // Update progress bar - $('div.progressBar', thumbnailLayer).html(progressBar); - - // Remove cancel button - $('a.uploadActionCancel', infoLayer).hide(); - - // Show delete button - $('a.uploadActionDelete', infoLayer).show(); - }); - - uploader.addListener('uploadCompleteData', function (event) - { - // Parse server response for each upload - var upload = JSON.parse(event.data); - - // Remove this file from the upload queue - uploader.removeFile(event.id); - - // Layers for current upload - var thumbnailLayer = $('#thumbnail-' + event.id); - - if ('error' in upload) - { - var uploadDiv = $('#upload-' + event.id); - - // Add error message - uploadDiv.prepend('
' + upload.error + '
'); - - // Remove thumbnail box - thumbnailLayer.remove(); - - return; - } - - thumbnailLayer - // Render img tag - .html('') - - // Give thumbnail div a minimum height to prevent text from wrapping to next line - .attr('style', function(i) { - return $(this).attr('style') + '; min-length; 100px;'; }); - - // Get the file index from the id passed by YUI - var fileId = parseHtmlId(event.id); - - // Render final upload - $('
' + - '' + - '' + - '' + - '' + - '' + - '' + - '' + - '' + - '
') - .prependTo(thumbnailLayer.next()); - - renumerateUploads(); - highlightRepeatedFiles(); - }); - - uploader.addListener('uploadError', function(event) - { - log(event); - - var thumbnailLayer = $('#thumbnail-' + event.id); - - // Add error message to progress bar - $('div.uploadStatus', thumbnailLayer) - .html('' + Qubit.multiFileUpload.i18nUploadError + '') - - // Remove cancel button - thumbnailLayer.find('a.uploadActionCancel').remove(); - }); - - uploader.addListener('rollOver', function () - { - $('#selectLink').addClass('hover'); - }); - - uploader.addListener('rollOut', function () - { - $('#selectLink').removeClass('hover'); - }); - - // uploader.addListener('cancel', function () { }); - // uploader.addListener('click', function () { }); - // uploader.addListener('mouseDown', function () { }); - // uploader.addListener('mouseUp', function () { }); - } + return fileName; } - })(jQuery); + }; + + $(function () + { + var $node = $('.multiFileUpload'); + + if (0 < $node.length) + { + new MultiFileUpload($node.get(0)); + } + }); + +})(window.jQuery); diff --git a/lib/form/DigitalObjectTitleUpdateForm.class.php b/lib/form/DigitalObjectTitleUpdateForm.class.php new file mode 100644 index 0000000000..20a4d87ed8 --- /dev/null +++ b/lib/form/DigitalObjectTitleUpdateForm.class.php @@ -0,0 +1,74 @@ +. + */ + +/** + * Settings module - generic form definition + * + * @package AccesstoMemory + * @subpackage Information Object + * @author Steve Breker + */ +class DigitalObjectTitleUpdateForm extends sfForm +{ + public function configure() + { + // Build widgets and validators + foreach($this->getInformationObjects() as $informationObject) + { + $widgets[$informationObject->id] = new sfWidgetFormInput(); + $validators[$informationObject->id] = new sfValidatorString(); + } + + // Set them + $this->setWidgets($widgets); + $this->setValidators($validators); + + // Set decorator + $decorator = new QubitWidgetFormSchemaFormatterList($this->widgetSchema); + $this->widgetSchema->addFormFormatter('list', $decorator); + $this->widgetSchema->setFormFormatterName('list'); + + // Set wrapper text + $this->widgetSchema->setNameFormat('titles[%s]'); + } + + public function setScope($scope) + { + $this->setOption('scope', $scope); + + return $this; + } + + public function getScope() + { + return $this->getOption('scope'); + } + + public function setInformationObjects(array $objects) + { + $this->setOption('informationObjects', $objects); + + return $this; + } + + public function getInformationObjects() + { + return $this->getOption('informationObjects'); + } +} diff --git a/lib/model/QubitDigitalObject.php b/lib/model/QubitDigitalObject.php index 51ecb03ca8..adea5953c3 100644 --- a/lib/model/QubitDigitalObject.php +++ b/lib/model/QubitDigitalObject.php @@ -2330,6 +2330,21 @@ public function createCompoundChildren($connection = null) return $this; } + /** + * Test various php settings that affect POST size and report the + * most limiting one. + * + * @return integer max POST file size in bytes + */ + public static function getMaxPostSize() + { + $settings = array(); + $settings[] = self::returnBytes(ini_get('post_max_size')); + $settings[] = self::returnBytes(ini_get('memory_limit')); + + return QubitDigitalObject::getMin($settings); + } + /** * Test various php settings that affect file upload size and report the * most limiting one. @@ -2343,6 +2358,17 @@ public static function getMaxUploadSize() $settings[] = self::returnBytes(ini_get('upload_max_filesize')); $settings[] = self::returnBytes(ini_get('memory_limit')); + return QubitDigitalObject::getMin($settings); + } + + /** + * Given array, detect min value and return it. Return -1 if array is empty. + * most limiting one. + * + * @return integer max upload file size in bytes + */ + public static function getMin($settings) + { foreach ($settings as $index => $value) { if ($value == 0) diff --git a/plugins/arDominionPlugin/css/less/scaffolding.less b/plugins/arDominionPlugin/css/less/scaffolding.less index 97f62a8bd7..b5bf676a61 100644 --- a/plugins/arDominionPlugin/css/less/scaffolding.less +++ b/plugins/arDominionPlugin/css/less/scaffolding.less @@ -1243,6 +1243,20 @@ section .vcard:last-child > .field:last-child > div { } } +// Digital object bulk title update page results + +.thumbnail-container { + left: 0; + right: 0; + height: 250px; + width: 250px; + + img { + max-width: 100%; + max-height: 100%; + } +} + // Horizontal space that takes the sort dropdown or a search bar in a browser .header-options { diff --git a/vendor/uppy/uppy-bundle.css b/vendor/uppy/uppy-bundle.css new file mode 100644 index 0000000000..8cde007173 --- /dev/null +++ b/vendor/uppy/uppy-bundle.css @@ -0,0 +1,2528 @@ +/** +* General Uppy styles that apply to everything inside the .uppy-Root container +*/ +.uppy-Root { + box-sizing: border-box; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-align: left; + position: relative; + color: #333; } + +.uppy-Root *, .uppy-Root *:before, .uppy-Root *:after { + box-sizing: inherit; } + +.uppy-Root [hidden] { + display: none; } + +.uppy-u-reset { + -webkit-appearance: none; + line-height: 1; + padding: 0; + margin: 0; + border: 0; + color: inherit; + -webkit-backface-visibility: visible; + backface-visibility: visible; + background: none; + border: medium none currentColor; + border-collapse: separate; + border-image: none; + border-radius: 0; + border-spacing: 0; + box-shadow: none; + clear: none; + cursor: auto; + display: inline; + empty-cells: show; + float: none; + font-family: inherit; + font-size: inherit; + font-style: normal; + font-variant: normal; + font-weight: normal; + font-stretch: normal; + -webkit-hyphens: none; + -ms-hyphens: none; + hyphens: none; + left: auto; + letter-spacing: normal; + list-style: none; + margin: 0; + max-height: none; + max-width: none; + min-height: 0; + min-width: 0; + opacity: 1; + outline: medium none invert; + overflow: visible; + overflow-x: visible; + overflow-y: visible; + text-align: left; + text-decoration: none; + text-indent: 0; + text-shadow: none; + text-transform: none; + top: auto; + transform: none; + transform-origin: 50% 50% 0; + transform-style: flat; + transition: none 0s ease 0s; + unicode-bidi: normal; + vertical-align: baseline; + visibility: visible; + white-space: normal; + z-index: auto; } + +.uppy-c-textInput { + border: 1px solid #ddd; + border-radius: 4px; + font-size: 14px; + line-height: 1.5; + padding: 6px 8px; + background-color: #fff; } + .uppy-size--md .uppy-c-textInput { + padding: 8px 10px; } + .uppy-c-textInput:focus { + border-color: rgba(34, 117, 215, 0.6); + outline: none; + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.15); } + [data-uppy-theme="dark"] .uppy-c-textInput { + background-color: #333; + border-color: #333; + color: #eaeaea; } + [data-uppy-theme="dark"] .uppy-c-textInput:focus { + border-color: #525252; + box-shadow: none; } + +.uppy-c-icon { + max-width: 100%; + max-height: 100%; + fill: currentColor; + display: inline-block; + overflow: hidden; } + +.uppy-c-btn { + display: inline-block; + text-align: center; + white-space: nowrap; + vertical-align: middle; + font-family: inherit; + font-size: 16px; + line-height: 1; + font-weight: 500; + transition-property: background-color, color; + transition-duration: 0.3s; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } + +.uppy-c-btn:not(:disabled):not(.disabled) { + cursor: pointer; } + +.uppy-c-btn::-moz-focus-inner { + border: 0; } + +.uppy-c-btn-primary { + font-size: 14px; + padding: 10px 18px; + border-radius: 4px; + background-color: #2275d7; + color: #fff; } + .uppy-c-btn-primary:hover { + background-color: #1b5dab; } + .uppy-c-btn-primary:focus { + outline: none; + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.4); } + .uppy-size--md .uppy-c-btn-primary { + padding: 13px 22px; } + [data-uppy-theme="dark"] .uppy-c-btn-primary { + color: #eaeaea; } + [data-uppy-theme="dark"] .uppy-c-btn-primary:focus { + outline: none; } + [data-uppy-theme="dark"] .uppy-c-btn-primary::-moz-focus-inner { + border: 0; } + [data-uppy-theme="dark"] .uppy-c-btn-primary:focus { + box-shadow: 0 0 0 2px rgba(170, 225, 255, 0.85); } + +.uppy-c-btn-link { + font-size: 14px; + line-height: 1; + padding: 10px 15px; + border-radius: 4px; + background-color: transparent; + color: #525252; } + .uppy-c-btn-link:hover { + color: #333; } + .uppy-c-btn-link:focus { + outline: none; + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.25); } + .uppy-size--md .uppy-c-btn-link { + padding: 13px 18px; } + [data-uppy-theme="dark"] .uppy-c-btn-link { + color: #eaeaea; } + [data-uppy-theme="dark"] .uppy-c-btn-link:focus { + outline: none; } + [data-uppy-theme="dark"] .uppy-c-btn-link::-moz-focus-inner { + border: 0; } + [data-uppy-theme="dark"] .uppy-c-btn-link:focus { + box-shadow: 0 0 0 2px rgba(170, 225, 255, 0.85); } + [data-uppy-theme="dark"] .uppy-c-btn-link:hover { + color: #939393; } + +.uppy-c-btn--small { + font-size: 0.9em; + padding: 7px 16px; + border-radius: 2px; } + .uppy-size--md .uppy-c-btn--small { + padding: 8px 10px; + border-radius: 2px; } +.uppy-Informer { + position: absolute; + bottom: 60px; + left: 0; + right: 0; + text-align: center; + opacity: 1; + transform: none; + transition: all 250ms ease-in; + z-index: 1005; } + +.uppy-Informer[aria-hidden=true] { + opacity: 0; + transform: translateY(350%); + transition: all 300ms ease-in; + z-index: -1000; } + +.uppy-Informer p { + display: inline-block; + margin: 0; + padding: 0; + font-size: 12px; + line-height: 1.4; + font-weight: 400; + padding: 6px 15px; + background-color: #757575; + color: #fff; + border-radius: 18px; + max-width: 90%; } + .uppy-size--md .uppy-Informer p { + font-size: 14px; + line-height: 1.3; + max-width: 500px; + padding: 10px 20px; } + [data-uppy-theme="dark"] .uppy-Informer p { + background-color: #333; } + +.uppy-Informer span { + line-height: 12px; + width: 13px; + height: 13px; + display: inline-block; + vertical-align: middle; + color: #525252; + background-color: #fff; + border-radius: 50%; + position: relative; + top: -1px; + left: 3px; + font-size: 10px; + margin-left: -1px; } + +.uppy-Informer span:hover { + cursor: help; } + +.uppy-Informer span:after { + line-height: 1.3; + word-wrap: break-word; } + +/* ------------------------------------------------------------------- + Microtip + + Modern, lightweight css-only tooltips + Just 1kb minified and gzipped + + @author Ghosh + @package Microtip + +---------------------------------------------------------------------- + 1. Base Styles + 2. Direction Modifiers + 3. Position Modifiers +--------------------------------------------------------------------*/ +/* ------------------------------------------------ + [1] Base Styles +-------------------------------------------------*/ +.uppy-Root [aria-label][role~="tooltip"] { + /* no important */ + position: relative; } + +.uppy-Root [aria-label][role~="tooltip"]::before, +.uppy-Root [aria-label][role~="tooltip"]::after { + /* no important */ + transform: translate3d(0, 0, 0); + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + will-change: transform; + opacity: 0; + pointer-events: none; + transition: all var(--microtip-transition-duration, 0.18s) var(--microtip-transition-easing, ease-in-out) var(--microtip-transition-delay, 0s); + position: absolute; + box-sizing: border-box; + z-index: 10; + transform-origin: top; } + +.uppy-Root [aria-label][role~="tooltip"]::before { + /* no important */ + background-size: 100% auto !important; + content: ""; } + +.uppy-Root [aria-label][role~="tooltip"]::after { + /* no important */ + background: rgba(17, 17, 17, 0.9); + border-radius: 4px; + color: #ffffff; + content: attr(aria-label); + font-size: var(--microtip-font-size, 13px); + font-weight: var(--microtip-font-weight, normal); + text-transform: var(--microtip-text-transform, none); + padding: .5em 1em; + white-space: nowrap; + box-sizing: content-box; } + +.uppy-Root [aria-label][role~="tooltip"]:hover::before, +.uppy-Root [aria-label][role~="tooltip"]:hover::after, +.uppy-Root [aria-label][role~="tooltip"]:focus::before, +.uppy-Root [aria-label][role~="tooltip"]:focus::after { + /* no important */ + opacity: 1; + pointer-events: auto; } + +/* ------------------------------------------------ + [2] Position Modifiers +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position|="top"]::before { + /* no important */ + background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%280%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat; + height: 6px; + width: 18px; + margin-bottom: 5px; } + +.uppy-Root [role~="tooltip"][data-microtip-position|="top"]::after { + /* no important */ + margin-bottom: 11px; } + +.uppy-Root [role~="tooltip"][data-microtip-position|="top"]::before { + /* no important */ + transform: translate3d(-50%, 0, 0); + bottom: 100%; + left: 50%; } + +.uppy-Root [role~="tooltip"][data-microtip-position|="top"]:hover::before { + /* no important */ + transform: translate3d(-50%, -5px, 0); } + +.uppy-Root [role~="tooltip"][data-microtip-position|="top"]::after { + /* no important */ + transform: translate3d(-50%, 0, 0); + bottom: 100%; + left: 50%; } + +.uppy-Root [role~="tooltip"][data-microtip-position="top"]:hover::after { + /* no important */ + transform: translate3d(-50%, -5px, 0); } + +/* ------------------------------------------------ + [2.1] Top Left +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position="top-left"]::after { + /* no important */ + transform: translate3d(calc(-100% + 16px), 0, 0); + bottom: 100%; } + +.uppy-Root [role~="tooltip"][data-microtip-position="top-left"]:hover::after { + /* no important */ + transform: translate3d(calc(-100% + 16px), -5px, 0); } + +/* ------------------------------------------------ + [2.2] Top Right +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position="top-right"]::after { + /* no important */ + transform: translate3d(calc(0% + -16px), 0, 0); + bottom: 100%; } + +.uppy-Root [role~="tooltip"][data-microtip-position="top-right"]:hover::after { + /* no important */ + transform: translate3d(calc(0% + -16px), -5px, 0); } + +/* ------------------------------------------------ + [2.3] Bottom +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position|="bottom"]::before { + /* no important */ + background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28180%2018%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat; + height: 6px; + width: 18px; + margin-top: 5px; + margin-bottom: 0; } + +.uppy-Root [role~="tooltip"][data-microtip-position|="bottom"]::after { + /* no important */ + margin-top: 11px; } + +.uppy-Root [role~="tooltip"][data-microtip-position|="bottom"]::before { + /* no important */ + transform: translate3d(-50%, -10px, 0); + bottom: auto; + left: 50%; + top: 100%; } + +.uppy-Root [role~="tooltip"][data-microtip-position|="bottom"]:hover::before { + /* no important */ + transform: translate3d(-50%, 0, 0); } + +.uppy-Root [role~="tooltip"][data-microtip-position|="bottom"]::after { + /* no important */ + transform: translate3d(-50%, -10px, 0); + top: 100%; + left: 50%; } + +.uppy-Root [role~="tooltip"][data-microtip-position="bottom"]:hover::after { + /* no important */ + transform: translate3d(-50%, 0, 0); } + +/* ------------------------------------------------ + [2.4] Bottom Left +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position="bottom-left"]::after { + /* no important */ + transform: translate3d(calc(-100% + 16px), -10px, 0); + top: 100%; } + +.uppy-Root [role~="tooltip"][data-microtip-position="bottom-left"]:hover::after { + /* no important */ + transform: translate3d(calc(-100% + 16px), 0, 0); } + +/* ------------------------------------------------ + [2.5] Bottom Right +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position="bottom-right"]::after { + /* no important */ + transform: translate3d(calc(0% + -16px), -10px, 0); + top: 100%; } + +.uppy-Root [role~="tooltip"][data-microtip-position="bottom-right"]:hover::after { + /* no important */ + transform: translate3d(calc(0% + -16px), 0, 0); } + +/* ------------------------------------------------ + [2.6] Left +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position="left"]::before, +.uppy-Root [role~="tooltip"][data-microtip-position="left"]::after { + /* no important */ + bottom: auto; + left: auto; + right: 100%; + top: 50%; + transform: translate3d(10px, -50%, 0); } + +.uppy-Root [role~="tooltip"][data-microtip-position="left"]::before { + /* no important */ + background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28-90%2018%2018%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat; + height: 18px; + width: 6px; + margin-right: 5px; + margin-bottom: 0; } + +.uppy-Root [role~="tooltip"][data-microtip-position="left"]::after { + /* no important */ + margin-right: 11px; } + +.uppy-Root [role~="tooltip"][data-microtip-position="left"]:hover::before, +.uppy-Root [role~="tooltip"][data-microtip-position="left"]:hover::after { + /* no important */ + transform: translate3d(0, -50%, 0); } + +/* ------------------------------------------------ + [2.7] Right +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-position="right"]::before, +.uppy-Root [role~="tooltip"][data-microtip-position="right"]::after { + /* no important */ + bottom: auto; + left: 100%; + top: 50%; + transform: translate3d(-10px, -50%, 0); } + +.uppy-Root [role~="tooltip"][data-microtip-position="right"]::before { + /* no important */ + background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%2890%206%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat; + height: 18px; + width: 6px; + margin-bottom: 0; + margin-left: 5px; } + +.uppy-Root [role~="tooltip"][data-microtip-position="right"]::after { + /* no important */ + margin-left: 11px; } + +.uppy-Root [role~="tooltip"][data-microtip-position="right"]:hover::before, +.uppy-Root [role~="tooltip"][data-microtip-position="right"]:hover::after { + /* no important */ + transform: translate3d(0, -50%, 0); } + +/* ------------------------------------------------ + [3] Size +-------------------------------------------------*/ +.uppy-Root [role~="tooltip"][data-microtip-size="small"]::after { + /* no important */ + white-space: initial; + width: 80px; } + +.uppy-Root [role~="tooltip"][data-microtip-size="medium"]::after { + /* no important */ + white-space: initial; + width: 150px; } + +.uppy-Root [role~="tooltip"][data-microtip-size="large"]::after { + /* no important */ + white-space: initial; + width: 260px; } + +.uppy-StatusBar { + display: -ms-flexbox; + display: flex; + position: relative; + height: 40px; + line-height: 40px; + font-size: 12px; + font-weight: 400; + color: #fff; + background-color: #fff; + z-index: 1001; + transition: height .2s; } + [data-uppy-theme="dark"] .uppy-StatusBar { + background-color: #1f1f1f; } + +.uppy-size--md .uppy-StatusBar { + height: 46px; } + +.uppy-StatusBar:before { + content: ''; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + width: 100%; + height: 2px; + background-color: #eaeaea; } + [data-uppy-theme="dark"] .uppy-StatusBar:before { + background-color: #757575; } + +.uppy-StatusBar[aria-hidden=true] { + overflow-y: hidden; + height: 0; } + +.uppy-StatusBar.is-complete .uppy-StatusBar-progress { + background-color: #1bb240; } + +.uppy-StatusBar.is-error .uppy-StatusBar-progress { + background-color: #e32437; } + +.uppy-StatusBar.is-complete .uppy-StatusBar-statusIndicator { + color: #1bb240; } + +.uppy-StatusBar.is-error .uppy-StatusBar-statusIndicator { + color: #e32437; } + +.uppy-StatusBar:not([aria-hidden=true]).is-waiting { + background-color: #fff; + height: 65px; + border-top: 1px solid #eaeaea; } + [data-uppy-theme="dark"] .uppy-StatusBar:not([aria-hidden=true]).is-waiting { + background-color: #1f1f1f; + border-top: 1px solid #333; } + +.uppy-StatusBar-progress { + background-color: #2275d7; + height: 2px; + position: absolute; + z-index: 1001; + transition: background-color, width .3s ease-out; } + .uppy-StatusBar-progress.is-indeterminate { + background-size: 64px 64px; + background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.3) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.3) 75%, transparent 75%, transparent); + animation: uppy-StatusBar-ProgressStripes 1s linear infinite; } + +@keyframes uppy-StatusBar-ProgressStripes { + from { + background-position: 0 0; } + to { + background-position: 64px 0; } } + +.uppy-StatusBar.is-preprocessing .uppy-StatusBar-progress, +.uppy-StatusBar.is-postprocessing .uppy-StatusBar-progress { + background-color: #f6a623; } + +.uppy-StatusBar.is-waiting .uppy-StatusBar-progress { + display: none; } + +.uppy-StatusBar-content { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + position: relative; + z-index: 1002; + padding-left: 10px; + white-space: nowrap; + text-overflow: ellipsis; + color: #333; + height: 100%; } + .uppy-size--md .uppy-StatusBar-content { + padding-left: 15px; } + [data-uppy-theme="dark"] .uppy-StatusBar-content { + color: #eaeaea; } + +.uppy-StatusBar-status { + line-height: 1.4; + font-weight: normal; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: center; + justify-content: center; + padding-right: 0.3em; } + +.uppy-Root:not(.uppy-size--md) .uppy-StatusBar-additionalInfo { + display: none; } + +.uppy-StatusBar-statusPrimary { + font-weight: 500; + line-height: 1; } + [data-uppy-theme="dark"] .uppy-StatusBar-statusPrimary { + color: #eaeaea; } + +.uppy-StatusBar-statusSecondary { + margin-top: 1px; + font-size: 11px; + line-height: 1.2; + display: inline-block; + color: #757575; + white-space: nowrap; } + [data-uppy-theme="dark"] .uppy-StatusBar-statusSecondary { + color: #bbb; } + +.uppy-StatusBar-statusSecondaryHint { + display: inline-block; + vertical-align: middle; + margin-right: 5px; + line-height: 1; } + .uppy-size--md .uppy-StatusBar-statusSecondaryHint { + margin-right: 8px; } + +.uppy-StatusBar-statusIndicator { + position: relative; + top: 1px; + color: #525252; + margin-right: 7px; } + .uppy-StatusBar-statusIndicator svg { + vertical-align: text-bottom; } + +.uppy-StatusBar-actions { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + position: absolute; + top: 0; + bottom: 0; + right: 10px; + z-index: 1004; } + +.uppy-StatusBar.is-waiting .uppy-StatusBar-actions { + width: 100%; + position: static; + padding: 0 15px; + background-color: #fafafa; } + [data-uppy-theme="dark"] .uppy-StatusBar.is-waiting .uppy-StatusBar-actions { + background-color: #1f1f1f; } + +.uppy-StatusBar-actionCircleBtn { + line-height: 1; + cursor: pointer; + margin: 3px; + opacity: 0.9; } + .uppy-StatusBar-actionCircleBtn:focus { + outline: none; } + .uppy-StatusBar-actionCircleBtn::-moz-focus-inner { + border: 0; } + .uppy-StatusBar-actionCircleBtn:focus { + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.5); } + [data-uppy-theme="dark"] .uppy-StatusBar-actionCircleBtn:focus { + outline: none; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionCircleBtn::-moz-focus-inner { + border: 0; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionCircleBtn:focus { + box-shadow: 0 0 0 2px rgba(170, 225, 255, 0.85); } + .uppy-StatusBar-actionCircleBtn:hover { + opacity: 1; } + .uppy-StatusBar-actionCircleBtn:focus { + border-radius: 50%; } + +.uppy-StatusBar-actionCircleBtn svg { + vertical-align: bottom; } + +.uppy-StatusBar-actionBtn { + display: inline-block; + vertical-align: middle; + font-size: 10px; + line-height: inherit; + color: #2275d7; } + .uppy-size--md .uppy-StatusBar-actionBtn { + font-size: 11px; } + +.uppy-StatusBar-actionBtn--retry { + height: 16px; + border-radius: 8px; + margin-right: 6px; + background-color: #ff4b23; + line-height: 1; + color: #fff; + padding: 1px 6px 3px 18px; + position: relative; } + .uppy-StatusBar-actionBtn--retry:focus { + outline: none; } + .uppy-StatusBar-actionBtn--retry::-moz-focus-inner { + border: 0; } + .uppy-StatusBar-actionBtn--retry:focus { + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.5); } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--retry:focus { + outline: none; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--retry::-moz-focus-inner { + border: 0; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--retry:focus { + box-shadow: 0 0 0 2px rgba(170, 225, 255, 0.85); } + .uppy-StatusBar-actionBtn--retry:hover { + background-color: #f92d00; } + .uppy-StatusBar-actionBtn--retry svg { + position: absolute; + top: 3px; + left: 6px; } + +.uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload { + font-size: 14px; + width: 100%; + padding: 15px 10px; + color: #fff; + background-color: #1bb240; + line-height: 1; } + .uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload:hover { + background-color: #189c38; } + [data-uppy-theme="dark"] .uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload { + background-color: #1c8b37; } + [data-uppy-theme="dark"] .uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload:hover { + background-color: #18762f; } + +.uppy-size--md .uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload { + padding: 13px 22px; + width: auto; } + +.uppy-StatusBar:not(.is-waiting) .uppy-StatusBar-actionBtn--upload { + background-color: transparent; + color: #2275d7; } + +.uppy-StatusBar-actionBtn--uploadNewlyAdded { + padding-right: 3px; + padding-left: 3px; + padding-bottom: 1px; + border-radius: 3px; } + .uppy-StatusBar-actionBtn--uploadNewlyAdded:focus { + outline: none; } + .uppy-StatusBar-actionBtn--uploadNewlyAdded::-moz-focus-inner { + border: 0; } + .uppy-StatusBar-actionBtn--uploadNewlyAdded:focus { + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.5); } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--uploadNewlyAdded:focus { + outline: none; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--uploadNewlyAdded::-moz-focus-inner { + border: 0; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--uploadNewlyAdded:focus { + box-shadow: 0 0 0 2px rgba(170, 225, 255, 0.85); } + +.uppy-StatusBar-actionBtn--done { + line-height: 1; + border-radius: 3px; + padding: 7px 8px; } + .uppy-StatusBar-actionBtn--done:focus { + outline: none; } + .uppy-StatusBar-actionBtn--done::-moz-focus-inner { + border: 0; } + .uppy-StatusBar-actionBtn--done:hover { + color: #1b5dab; } + .uppy-StatusBar-actionBtn--done:focus { + background-color: #eceef2; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--done:focus { + background-color: #333; } + [data-uppy-theme="dark"] .uppy-StatusBar-actionBtn--done { + color: #02baf2; } + +.uppy-size--md .uppy-StatusBar-actionBtn--done { + font-size: 14px; } + +.uppy-StatusBar-details { + line-height: 12px; + width: 13px; + height: 13px; + display: inline-block; + vertical-align: middle; + color: #fff; + background-color: #939393; + border-radius: 50%; + position: relative; + top: 0; + left: 2px; + font-size: 10px; + font-weight: 600; + text-align: center; + cursor: help; } + +.uppy-StatusBar-details:after { + line-height: 1.3; + word-wrap: break-word; } + +.uppy-StatusBar-spinner { + animation-name: uppy-StatusBar-spinnerAnimation; + animation-duration: 1s; + animation-iteration-count: infinite; + animation-timing-function: linear; + margin-right: 10px; + fill: #2275d7; } + +.uppy-StatusBar.is-preprocessing .uppy-StatusBar-spinner, +.uppy-StatusBar.is-postprocessing .uppy-StatusBar-spinner { + fill: #f6a623; } + +@keyframes uppy-StatusBar-spinnerAnimation { + 0% { + transform: rotate(0deg); } + 100% { + transform: rotate(360deg); } } + +.uppy-ProviderBrowser-viewType--grid ul.uppy-ProviderBrowser-list { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: row; + flex-direction: row; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -ms-flex-pack: justify; + justify-content: space-between; + -ms-flex-align: start; + align-items: flex-start; + padding: 6px; } + .uppy-ProviderBrowser-viewType--grid ul.uppy-ProviderBrowser-list::after { + content: ''; + -ms-flex: auto; + flex: auto; } + +.uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem { + width: 50%; + position: relative; + margin: 0; } + .uppy-size--md .uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem { + width: 33.3333%; } + .uppy-size--lg .uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem { + width: 25%; } + .uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem::before { + content: ''; + padding-top: 100%; + display: block; } + +.uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--selected img, .uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--selected svg { + opacity: 0.85; } + +.uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--disabled { + opacity: 0.5; } + +.uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--noPreview .uppy-ProviderBrowserItem-inner { + background-color: rgba(147, 147, 147, 0.2); } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--noPreview .uppy-ProviderBrowserItem-inner { + background-color: rgba(234, 234, 234, 0.2); } + +.uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--noPreview svg { + fill: rgba(0, 0, 0, 0.7); + width: 30%; + height: 30%; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-viewType--grid li.uppy-ProviderBrowserItem--noPreview svg { + fill: rgba(255, 255, 255, 0.8); } + +.uppy-ProviderBrowser-viewType--grid button.uppy-ProviderBrowserItem-inner { + border-radius: 4px; + overflow: hidden; + position: absolute; + top: 7px; + left: 7px; + right: 7px; + bottom: 7px; + text-align: center; + width: calc(100% - 14px); + height: calc(100% - 14px); } + .uppy-ProviderBrowser-viewType--grid button.uppy-ProviderBrowserItem-inner:focus { + outline: none; + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.9); } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-viewType--grid button.uppy-ProviderBrowserItem-inner { + box-shadow: 0 0 0 3px rgba(170, 225, 255, 0.7); } + .uppy-ProviderBrowser-viewType--grid button.uppy-ProviderBrowserItem-inner img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 4px; } + +.uppy-ProviderBrowser-viewType--grid .uppy-ProviderBrowserItem-fakeCheckbox { + position: absolute; + top: 16px; + right: 16px; + width: 26px; + height: 26px; + background-color: #2275d7; + border-radius: 50%; + z-index: 1002; + opacity: 0; } + .uppy-ProviderBrowser-viewType--grid .uppy-ProviderBrowserItem-fakeCheckbox:after { + width: 12px; + height: 7px; + left: 7px; + top: 8px; } + +.uppy-ProviderBrowser-viewType--grid .uppy-ProviderBrowserItem-fakeCheckbox--is-checked { + opacity: 1; } + +.uppy-ProviderBrowser-viewType--list { + background-color: #fff; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-viewType--list { + background-color: #1f1f1f; } + .uppy-ProviderBrowser-viewType--list li.uppy-ProviderBrowserItem { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 7px 15px; + margin: 0; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-viewType--list li.uppy-ProviderBrowserItem { + color: #eaeaea; } + .uppy-ProviderBrowser-viewType--list li.uppy-ProviderBrowserItem--disabled { + opacity: 0.6; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox { + margin-right: 15px; + height: 17px; + width: 17px; + border-radius: 3px; + background-color: #fff; + border: 1px solid #cfcfcf; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox:focus { + border: 1px solid #2275d7; + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.25); + outline: none; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox::after { + opacity: 0; + height: 5px; + width: 9px; + left: 3px; + top: 4px; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox:focus { + border-color: rgba(2, 186, 242, 0.7); + box-shadow: 0 0 0 3px rgba(2, 186, 242, 0.2); } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox--is-checked { + background-color: #2275d7; + border-color: #2275d7; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox--is-checked::after { + opacity: 1; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-inner { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + padding: 2px; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-inner:focus { + outline: none; + text-decoration: underline; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-inner img, .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-inner svg { + margin-right: 8px; + max-width: 20px; + max-height: 20px; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-inner span { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem--disabled .uppy-ProviderBrowserItem-inner { + cursor: default; } + .uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-iconWrap { + width: 20px; + margin-right: 7px; } + +.uppy-ProviderBrowserItem-fakeCheckbox { + position: relative; + cursor: pointer; + -ms-flex-negative: 0; + flex-shrink: 0; } + .uppy-ProviderBrowserItem-fakeCheckbox:disabled { + cursor: default; } + .uppy-ProviderBrowserItem-fakeCheckbox::after { + content: ''; + position: absolute; + cursor: pointer; + border-left: 2px solid #eaeaea; + border-bottom: 2px solid #eaeaea; + transform: rotate(-45deg); } + .uppy-ProviderBrowserItem-fakeCheckbox:disabled::after { + cursor: default; } + [data-uppy-theme="dark"] .uppy-ProviderBrowserItem-fakeCheckbox { + background-color: #1f1f1f; + border-color: #939393; } + +[data-uppy-theme="dark"] .uppy-ProviderBrowserItem-fakeCheckbox--is-checked { + background-color: #333; } + +.uppy-SearchProvider { + width: 100%; + height: 100%; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-align: center; + align-items: center; + -ms-flex: 1; + flex: 1; } + [data-uppy-theme="dark"] .uppy-SearchProvider { + background-color: #1f1f1f; } + +.uppy-SearchProvider-input { + width: 90%; + max-width: 650px; + margin-bottom: 15px; } + .uppy-size--md .uppy-SearchProvider-input { + margin-bottom: 20px; } + +.uppy-SearchProvider-searchButton { + padding: 13px 25px; } + .uppy-size--md .uppy-SearchProvider-searchButton { + padding: 13px 30px; } + +.uppy-DashboardContent-panelBody { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -ms-flex: 1; + flex: 1; } + [data-uppy-theme="dark"] .uppy-DashboardContent-panelBody { + background-color: #1f1f1f; } + +.uppy-Provider-auth, +.uppy-Provider-error, +.uppy-Provider-loading, +.uppy-Provider-empty { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-flow: column wrap; + flex-flow: column wrap; + -ms-flex: 1; + flex: 1; + color: #939393; } + +.uppy-Provider-empty { + color: #939393; } + +.uppy-Provider-authIcon svg { + width: 100px; + height: 75px; + margin-bottom: 15px; } + +.uppy-Provider-authTitle { + font-size: 17px; + line-height: 1.4; + font-weight: 400; + margin-bottom: 30px; + padding: 0 15px; + max-width: 500px; + text-align: center; + color: #757575; } + .uppy-size--md .uppy-Provider-authTitle { + font-size: 20px; } + [data-uppy-theme="dark"] .uppy-Provider-authTitle { + color: #cfcfcf; } + +.uppy-Provider-breadcrumbs { + -ms-flex: 1; + flex: 1; + color: #525252; + font-size: 12px; + margin-bottom: 10px; + text-align: left; } + .uppy-size--md .uppy-Provider-breadcrumbs { + margin-bottom: 0; } + [data-uppy-theme="dark"] .uppy-Provider-breadcrumbs { + color: #eaeaea; } + +.uppy-Provider-breadcrumbsIcon { + display: inline-block; + color: #525252; + vertical-align: middle; + margin-right: 4px; + line-height: 1; } + +.uppy-Provider-breadcrumbsIcon svg { + width: 13px; + height: 13px; + fill: #525252; } + +.uppy-Provider-breadcrumbs button { + display: inline-block; + line-height: inherit; + padding: 4px; + border-radius: 3px; } + .uppy-Provider-breadcrumbs button:focus { + outline: none; } + .uppy-Provider-breadcrumbs button::-moz-focus-inner { + border: 0; } + .uppy-Provider-breadcrumbs button:hover { + color: #1b5dab; } + .uppy-Provider-breadcrumbs button:focus { + background-color: #eceef2; } + [data-uppy-theme="dark"] .uppy-Provider-breadcrumbs button:focus { + background-color: #333; } + .uppy-Provider-breadcrumbs button:hover { + text-decoration: underline; + cursor: pointer; } + [data-uppy-theme="dark"] .uppy-Provider-breadcrumbs button { + color: #eaeaea; } + +.uppy-ProviderBrowser { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex: 1; + flex: 1; + font-size: 14px; + font-weight: 400; + height: 100%; } + +.uppy-ProviderBrowser-user { + margin: 0 8px 0 0; + font-weight: 500; + color: #333; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-user { + color: #eaeaea; } + +.uppy-ProviderBrowser-user:after { + content: '\00B7'; + position: relative; + left: 4px; + color: #939393; + font-weight: normal; } + +.uppy-ProviderBrowser-header { + z-index: 1001; + border-bottom: 1px solid #eaeaea; + position: relative; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-header { + border-bottom: 1px solid #333; } + +.uppy-ProviderBrowser-headerBar { + padding: 7px 15px; + background-color: #fafafa; + z-index: 1001; + color: #757575; + line-height: 1.4; + font-size: 12px; } + .uppy-size--md .uppy-ProviderBrowser-headerBar { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-headerBar { + background-color: #1f1f1f; } + +.uppy-ProviderBrowser-headerBar--simple { + text-align: center; + display: block; + -ms-flex-pack: center; + justify-content: center; } + +.uppy-ProviderBrowser-headerBar--simple .uppy-Provider-breadcrumbsWrap { + -ms-flex: none; + flex: none; + display: inline-block; + vertical-align: middle; } + +.uppy-ProviderBrowser-search { + width: 100%; + background-color: #fff; + position: relative; + height: 30px; + margin-top: 10px; + margin-bottom: 5px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-search { + background-color: #1f1f1f; } + +.uppy-ProviderBrowser-searchIcon { + position: absolute; + width: 12px; + height: 12px; + left: 16px; + z-index: 1002; + color: #bbb; } + +.uppy-ProviderBrowser-searchInput { + width: 100%; + height: 30px; + background-color: transparent; + outline: 0; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 12px; + line-height: 1.4; + border: 0; + margin: 0 8px; + padding-left: 27px; + z-index: 1001; + border-radius: 4px; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-searchInput { + background-color: #1f1f1f; + color: #eaeaea; } + +.uppy-ProviderBrowser-searchInput:focus { + outline: 0; + background-color: #f4f4f4; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-searchInput:focus { + background-color: #333; } + +.uppy-ProviderBrowser-searchClose { + position: absolute; + width: 22px; + height: 22px; + padding: 6px; + right: 12px; + top: 4px; + z-index: 1002; + color: #939393; + cursor: pointer; } + .uppy-ProviderBrowser-searchClose:hover { + color: #757575; } + +.uppy-ProviderBrowser-searchClose svg { + vertical-align: text-top; } + +.uppy-ProviderBrowser-searchInput:-ms-input-placeholder { + color: #939393; + opacity: 1; } + +.uppy-ProviderBrowser-searchInput::placeholder { + color: #939393; + opacity: 1; } + +.uppy-ProviderBrowser-userLogout { + cursor: pointer; + line-height: inherit; + color: #2275d7; + padding: 4px; + border-radius: 3px; } + .uppy-ProviderBrowser-userLogout:focus { + outline: none; } + .uppy-ProviderBrowser-userLogout::-moz-focus-inner { + border: 0; } + .uppy-ProviderBrowser-userLogout:hover { + color: #1b5dab; } + .uppy-ProviderBrowser-userLogout:focus { + background-color: #eceef2; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-userLogout:focus { + background-color: #333; } + .uppy-ProviderBrowser-userLogout:hover { + text-decoration: underline; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-userLogout { + color: #eaeaea; } + +.uppy-ProviderBrowser-body { + -ms-flex: 1; + flex: 1; + position: relative; } + +.uppy-ProviderBrowser-list { + -ms-flex: 1; + flex: 1; + position: relative; + display: block; + width: 100%; + height: 100%; + background-color: #fff; + border-spacing: 0; + overflow-x: hidden; + overflow-y: auto; + -webkit-overflow-scrolling: touch; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + list-style: none; + margin: 0; + padding: 0; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-list { + background-color: #1f1f1f; } + .uppy-ProviderBrowser-list:focus { + outline: none; } + +.uppy-ProviderBrowserItem-inner { + cursor: pointer; + font-weight: 500; + font-size: 13px; } + +.uppy-ProviderBrowser-footer { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + background-color: #fff; + height: 65px; + border-top: 1px solid #eaeaea; + padding: 0 15px; } + .uppy-ProviderBrowser-footer button { + margin-right: 8px; } + [data-uppy-theme="dark"] .uppy-ProviderBrowser-footer { + background-color: #1f1f1f; + border-top: 1px solid #333; } + +.uppy-Dashboard-Item-previewInnerWrap { + width: 100%; + height: 100%; + overflow: hidden; + position: relative; + display: -ms-flexbox; + display: flex; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-align: center; + align-items: center; + -ms-flex-direction: column; + flex-direction: column; + box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4); + border-radius: 3px; } + .uppy-size--md .uppy-Dashboard-Item-previewInnerWrap { + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); } + +.uppy-Dashboard-Item-previewInnerWrap:after { + content: ''; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.65); + display: none; + z-index: 1001; } + +.uppy-Dashboard-Item-previewLink { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + z-index: 1002; } + .uppy-Dashboard-Item-previewLink:focus { + box-shadow: inset 0 0 0 3px #76abe9; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-previewLink:focus { + box-shadow: inset 0 0 0 3px #016c8d; } + +.uppy-Dashboard-Item-preview img.uppy-Dashboard-Item-previewImg { + width: 100%; + height: 100%; + object-fit: cover; + transform: translateZ(0); + border-radius: 3px; } + +.uppy-Dashboard-Item-progress { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + z-index: 1002; + color: #fff; + text-align: center; + width: 120px; + transition: all .35 ease; } + +.uppy-Dashboard-Item-progressIndicator { + display: inline-block; + width: 38px; + height: 38px; + opacity: 0.9; } + .uppy-size--md .uppy-Dashboard-Item-progressIndicator { + width: 55px; + height: 55px; } + +button.uppy-Dashboard-Item-progressIndicator { + cursor: pointer; } + button.uppy-Dashboard-Item-progressIndicator:focus { + outline: none; } + button.uppy-Dashboard-Item-progressIndicator::-moz-focus-inner { + border: 0; } + button.uppy-Dashboard-Item-progressIndicator:focus .uppy-Dashboard-Item-progressIcon--bg, + button.uppy-Dashboard-Item-progressIndicator:focus .uppy-Dashboard-Item-progressIcon--retry { + fill: #76abe9; } + +.uppy-Dashboard-Item-progressIcon--circle { + width: 100%; + height: 100%; } + +.uppy-Dashboard-Item-progressIcon--bg { + stroke: rgba(255, 255, 255, 0.4); } + +.uppy-Dashboard-Item-progressIcon--progress { + stroke: #fff; + transition: stroke-dashoffset .5s ease-out; } + +.uppy-Dashboard-Item-progressIcon--play { + stroke: #fff; + fill: #fff; + transition: all 0.2s; } + +.uppy-Dashboard-Item-progressIcon--cancel { + fill: #fff; + transition: all 0.2s; } + +.uppy-Dashboard-Item-progressIcon--pause { + stroke: #fff; + fill: #fff; + transition: all 0.2s; } + +.uppy-Dashboard-Item-progressIcon--check { + fill: #fff; + transition: all 0.2s; } + +.uppy-Dashboard-Item-progressIcon--retry { + fill: #fff; } + +.uppy-Dashboard-Item.is-complete .uppy-Dashboard-Item-progress { + transform: initial; + top: -9px; + right: -8px; + left: initial; + width: auto; } + +.uppy-Dashboard-Item.is-error .uppy-Dashboard-Item-progressIndicator { + width: 18px; + height: 18px; } + .uppy-size--md .uppy-Dashboard-Item.is-error .uppy-Dashboard-Item-progressIndicator { + width: 28px; + height: 28px; } + +.uppy-Dashboard-Item.is-complete .uppy-Dashboard-Item-progressIndicator { + width: 18px; + height: 18px; + opacity: 1; } + .uppy-size--md .uppy-Dashboard-Item.is-complete .uppy-Dashboard-Item-progressIndicator { + width: 22px; + height: 22px; } + +.uppy-Dashboard-Item.is-processing .uppy-Dashboard-Item-progress { + opacity: 0; } + +.uppy-Dashboard-Item-fileInfo { + padding-right: 5px; } + +.uppy-Dashboard-Item-name { + font-size: 12px; + line-height: 1.3; + font-weight: 500; + margin-bottom: 4px; + word-break: break-all; + word-wrap: anywhere; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-name { + color: #eaeaea; } + +.uppy-Dashboard-Item-status { + font-size: 11px; + line-height: 1.3; + font-weight: normal; + color: #757575; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-status { + color: #bbb; } + +.uppy-Dashboard-Item-statusSize { + display: inline-block; + vertical-align: bottom; + text-transform: uppercase; } + +.uppy-Dashboard-Item-sourceIcon { + display: none; + vertical-align: bottom; + color: #bbb; } + .uppy-Dashboard-Item-sourceIcon:not(:first-child) { + position: relative; + margin-left: 14px; } + .uppy-Dashboard-Item-sourceIcon svg, + .uppy-Dashboard-Item-sourceIcon svg * { + max-width: 100%; + max-height: 100%; + display: inline-block; + vertical-align: text-bottom; + overflow: hidden; + fill: currentColor; + width: 11px; + height: 12px; } + +.uppy-Dashboard-Item-action { + cursor: pointer; + color: #939393; } + .uppy-Dashboard-Item-action:focus { + outline: none; } + .uppy-Dashboard-Item-action::-moz-focus-inner { + border: 0; } + .uppy-Dashboard-Item-action:focus { + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.5); } + .uppy-Dashboard-Item-action:hover { + opacity: 1; + color: #1f1f1f; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action { + color: #cfcfcf; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action:focus { + outline: none; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action::-moz-focus-inner { + border: 0; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action:focus { + box-shadow: 0 0 0 2px rgba(170, 225, 255, 0.85); } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action:hover { + color: #eaeaea; } + +.uppy-Dashboard-Item-action--remove { + color: #1f1f1f; + opacity: 0.95; } + .uppy-Dashboard-Item-action--remove:hover { + opacity: 1; + color: #000; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action--remove { + color: #525252; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item-action--remove:hover { + color: #333; } + +.uppy-Dashboard:not(.uppy-size--md) .uppy-Dashboard-Item-actionWrapper { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; } + +.uppy-Dashboard:not(.uppy-size--md) .uppy-Dashboard-Item-action { + width: 22px; + height: 22px; + padding: 3px; + margin-left: 3px; } + .uppy-Dashboard:not(.uppy-size--md) .uppy-Dashboard-Item-action:focus { + border-radius: 3px; } + +.uppy-size--md .uppy-Dashboard-Item-action--copyLink, +.uppy-size--md .uppy-Dashboard-Item-action--edit { + width: 16px; + height: 16px; + padding: 0; } + .uppy-size--md .uppy-Dashboard-Item-action--copyLink:focus, + .uppy-size--md .uppy-Dashboard-Item-action--edit:focus { + border-radius: 3px; } + +.uppy-size--md .uppy-Dashboard-Item-action--remove { + z-index: 1002; + position: absolute; + top: -8px; + right: -8px; + width: 18px; + height: 18px; + padding: 0; } + .uppy-size--md .uppy-Dashboard-Item-action--remove:focus { + border-radius: 50%; } + +.uppy-Dashboard-Item { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + border-bottom: 1px solid #eaeaea; + padding: 10px; + padding-right: 0; } + [data-uppy-theme="dark"] .uppy-Dashboard-Item { + border-bottom: 1px solid #333; } + .uppy-size--md .uppy-Dashboard-Item { + position: relative; + display: block; + float: left; + margin: 5px 15px; + padding: 0; + /* When changing width: also update `itemsPerRow` values in `src/components/Dashboard.js`. */ + width: calc(33.333% - 15px - 15px); + height: 215px; + border-bottom: 0; } + .uppy-size--lg .uppy-Dashboard-Item { + margin: 5px 15px; + /* When changing width: also update `itemsPerRow` values in `src/components/Dashboard.js`. */ + width: calc(25% - 15px - 15px); + height: 190px; } + .uppy-size--xl .uppy-Dashboard-Item { + /* When changing width: also update `itemsPerRow` values in `src/components/Dashboard.js`. */ + width: calc(20% - 15px - 15px); + height: 210px; } + +.uppy-Dashboard-Item-preview { + position: relative; } + .uppy-Dashboard:not(.uppy-size--md) .uppy-Dashboard-Item-preview { + -ms-flex-negative: 0; + flex-shrink: 0; + -ms-flex-positive: 0; + flex-grow: 0; + width: 50px; + height: 50px; } + .uppy-size--md .uppy-Dashboard-Item-preview { + width: 100%; + height: 140px; } + .uppy-size--lg .uppy-Dashboard-Item-preview { + height: 120px; } + .uppy-size--xl .uppy-Dashboard-Item-preview { + height: 140px; } + +.uppy-Dashboard-Item-fileInfoAndButtons { + -ms-flex-positive: 1; + flex-grow: 1; + padding-right: 8px; + padding-left: 12px; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; } + .uppy-size--md .uppy-Dashboard-Item-fileInfoAndButtons { + -ms-flex-align: start; + align-items: flex-start; + width: 100%; + padding: 0; + padding-top: 9px; } + +.uppy-Dashboard-Item-fileInfo { + -ms-flex-positive: 1; + flex-grow: 1; + -ms-flex-negative: 1; + flex-shrink: 1; } + +.uppy-Dashboard-Item-actionWrapper { + -ms-flex-positive: 0; + flex-grow: 0; + -ms-flex-negative: 0; + flex-shrink: 0; } + +.uppy-Dashboard-Item.is-inprogress .uppy-Dashboard-Item-previewInnerWrap:after, +.uppy-Dashboard-Item.is-error .uppy-Dashboard-Item-previewInnerWrap:after { + display: block; } + +.uppy-Dashboard-Item.is-inprogress:not(.is-resumable) .uppy-Dashboard-Item-action--remove { + display: none; } + +.uppy-Dashboard-Item-errorDetails { + line-height: 12px; + width: 12px; + height: 12px; + display: inline-block; + vertical-align: middle; + color: #fff; + background-color: #939393; + border-radius: 50%; + position: relative; + top: -1px; + left: 6px; + font-size: 8px; + font-weight: 600; + text-align: center; + cursor: help; } + +.uppy-Dashboard-Item-errorDetails:after { + line-height: 1.3; + word-wrap: break-word; } + +.uppy-Dashboard-FileCard { + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 1005; + box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, 0.1); + background-color: #fff; + border-radius: 5px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; } + .uppy-Dashboard-FileCard .uppy-DashboardContent-bar { + border-top-left-radius: 5px; + border-top-right-radius: 5px; } + .uppy-Dashboard-FileCard .uppy-Dashboard-FileCard-actions { + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; } + +.uppy-Dashboard-FileCard-inner { + height: 100%; + -ms-flex-positive: 1; + flex-grow: 1; + -ms-flex-negative: 1; + flex-shrink: 1; + min-height: 0; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; } + +.uppy-Dashboard-FileCard-preview { + height: 60%; + -ms-flex-positive: 0; + flex-grow: 0; + -ms-flex-negative: 1; + flex-shrink: 1; + min-height: 0; + border-bottom: 1px solid #eaeaea; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + position: relative; } + [data-uppy-theme="dark"] .uppy-Dashboard-FileCard-preview { + background-color: #333; + border-bottom: 0; } + +.uppy-Dashboard-FileCard-preview img.uppy-Dashboard-Item-previewImg { + max-width: 90%; + max-height: 90%; + object-fit: cover; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + border-radius: 3px; + box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.15); } + +.uppy-Dashboard-FileCard-edit { + position: absolute; + top: 10px; + right: 10px; + font-size: 13px; + background-color: rgba(0, 0, 0, 0.5); + color: #fff; + padding: 7px 15px; + border-radius: 50px; } + .uppy-Dashboard-FileCard-edit:focus { + outline: none; } + .uppy-Dashboard-FileCard-edit::-moz-focus-inner { + border: 0; } + .uppy-Dashboard-FileCard-edit:focus { + box-shadow: 0 0 0 3px rgba(34, 117, 215, 0.5); } + .uppy-Dashboard-FileCard-edit:hover { + background-color: rgba(0, 0, 0, 0.8); } + +.uppy-Dashboard-FileCard-info { + height: 40%; + -ms-flex-positive: 0; + flex-grow: 0; + -ms-flex-negative: 0; + flex-shrink: 0; + padding: 30px 20px 20px 20px; + overflow-y: auto; + -webkit-overflow-scrolling: touch; } + [data-uppy-theme="dark"] .uppy-Dashboard-FileCard-info { + background-color: #1f1f1f; } + +.uppy-Dashboard-FileCard-fieldset { + font-size: 0; + border: 0; + padding: 0; + max-width: 640px; + margin: auto; + margin-bottom: 12px; } + +.uppy-Dashboard-FileCard-label { + display: inline-block; + vertical-align: middle; + width: 22%; + font-size: 12px; + color: #525252; } + .uppy-size--md .uppy-Dashboard-FileCard-label { + font-size: 14px; } + [data-uppy-theme="dark"] .uppy-Dashboard-FileCard-label { + color: #eaeaea; } + +.uppy-Dashboard-FileCard-input { + display: inline-block; + vertical-align: middle; + width: 78%; } + +.uppy-Dashboard-FileCard-actions { + height: 55px; + -ms-flex-negative: 0; + flex-shrink: 0; + -ms-flex-positive: 0; + flex-grow: 0; + border-top: 1px solid #eaeaea; + padding: 0 15px; + background-color: #fafafa; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; } + .uppy-size--md .uppy-Dashboard-FileCard-actions { + height: 65px; } + [data-uppy-theme="dark"] .uppy-Dashboard-FileCard-actions { + border-top: 1px solid #333; + background-color: #1f1f1f; } + +.uppy-Dashboard-FileCard-actionsBtn { + margin-right: 10px; } + +.uppy-transition-slideDownUp-enter { + opacity: 0.01; + transform: translate3d(0, -105%, 0); + transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out; } + +.uppy-transition-slideDownUp-enter.uppy-transition-slideDownUp-enter-active { + opacity: 1; + transform: translate3d(0, 0, 0); } + +.uppy-transition-slideDownUp-leave { + opacity: 1; + transform: translate3d(0, 0, 0); + transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out; } + +.uppy-transition-slideDownUp-leave.uppy-transition-slideDownUp-leave-active { + opacity: 0.01; + transform: translate3d(0, -105%, 0); } + +@keyframes uppy-Dashboard-fadeIn { + from { + opacity: 0; } + to { + opacity: 1; } } + +@keyframes uppy-Dashboard-fadeOut { + from { + opacity: 1; } + to { + opacity: 0; } } + +@keyframes uppy-Dashboard-slideDownAndFadeIn { + from { + transform: translate3d(-50%, -70%, 0); + opacity: 0; } + to { + transform: translate3d(-50%, -50%, 0); + opacity: 1; } } + +@keyframes uppy-Dashboard-slideDownAndFadeIn--small { + from { + transform: translate3d(0, -20%, 0); + opacity: 0; } + to { + transform: translate3d(0, 0, 0); + opacity: 1; } } + +@keyframes uppy-Dashboard-slideUpFadeOut { + from { + transform: translate3d(-50%, -50%, 0); + opacity: 1; } + to { + transform: translate3d(-50%, -70%, 0); + opacity: 0; } } + +@keyframes uppy-Dashboard-slideUpFadeOut--small { + from { + transform: translate3d(0, 0, 0); + opacity: 1; } + to { + transform: translate3d(0, -20%, 0); + opacity: 0; } } + +.uppy-Dashboard--modal { + z-index: 1001; } + +.uppy-Dashboard--modal[aria-hidden=true] { + display: none; } + +.uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose > .uppy-Dashboard-inner { + animation: uppy-Dashboard-slideDownAndFadeIn--small 0.3s cubic-bezier(0, 0, 0.2, 1); } + @media only screen and (min-width: 820px) { + .uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose > .uppy-Dashboard-inner { + animation: uppy-Dashboard-slideDownAndFadeIn 0.3s cubic-bezier(0, 0, 0.2, 1); } } + +.uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose > .uppy-Dashboard-overlay { + animation: uppy-Dashboard-fadeIn 0.3s cubic-bezier(0, 0, 0.2, 1); } + +.uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose.uppy-Dashboard--isClosing > .uppy-Dashboard-inner { + animation: uppy-Dashboard-slideUpFadeOut--small 0.3s cubic-bezier(0, 0, 0.2, 1); } + @media only screen and (min-width: 820px) { + .uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose.uppy-Dashboard--isClosing > .uppy-Dashboard-inner { + animation: uppy-Dashboard-slideUpFadeOut 0.3s cubic-bezier(0, 0, 0.2, 1); } } + +.uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose.uppy-Dashboard--isClosing > .uppy-Dashboard-overlay { + animation: uppy-Dashboard-fadeOut 0.3s cubic-bezier(0, 0, 0.2, 1); } + +.uppy-Dashboard-isFixed { + overflow: hidden; + height: 100vh; } + +.uppy-Dashboard--modal .uppy-Dashboard-overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.5); + z-index: 1001; } + +.uppy-Dashboard-inner { + position: relative; + background-color: #fafafa; + max-width: 100%; + max-height: 100%; + outline: none; + border: 1px solid #eaeaea; + border-radius: 5px; } + .uppy-size--md .uppy-Dashboard-inner { + min-height: auto; } + @media only screen and (min-width: 820px) { + .uppy-Dashboard-inner { + width: 750px; + height: 550px; } } + .uppy-Dashboard--modal .uppy-Dashboard-inner { + z-index: 1002; } + [data-uppy-theme="dark"] .uppy-Dashboard-inner { + background-color: #1f1f1f; } + +.uppy-Dashboard-innerWrap { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + overflow: hidden; + position: relative; + border-radius: 5px; + opacity: 0; } + +.uppy-Dashboard--isInnerWrapVisible .uppy-Dashboard-innerWrap { + opacity: 1; } + +.uppy-Dashboard--modal .uppy-Dashboard-inner { + position: fixed; + top: 35px; + left: 15px; + right: 15px; + bottom: 15px; + border: none; } + @media only screen and (min-width: 820px) { + .uppy-Dashboard--modal .uppy-Dashboard-inner { + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + box-shadow: 0 5px 15px 4px rgba(0, 0, 0, 0.15); } } + +.uppy-Dashboard-close { + display: block; + position: absolute; + top: -33px; + right: -2px; + cursor: pointer; + color: rgba(255, 255, 255, 0.9); + font-size: 27px; + z-index: 1005; } + .uppy-Dashboard-close:focus { + outline: none; } + .uppy-Dashboard-close::-moz-focus-inner { + border: 0; } + .uppy-Dashboard-close:focus { + color: #8cb8ed; } + @media only screen and (min-width: 820px) { + .uppy-Dashboard-close { + font-size: 35px; + top: -10px; + right: -35px; } } + +.uppy-Dashboard-AddFiles { + display: -ms-flexbox; + display: flex; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-align: center; + align-items: center; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + position: relative; + text-align: center; } + [data-uppy-drag-drop-supported="true"] .uppy-Dashboard-AddFiles { + margin: 7px; + height: calc(100% - 14px); + border-radius: 3px; + border: 1px dashed #dfdfdf; } + .uppy-Dashboard-AddFilesPanel .uppy-Dashboard-AddFiles { + border: none; + height: calc(100% - 14px - 40px); } + .uppy-Dashboard--modal .uppy-Dashboard-AddFiles { + border-color: #cfcfcf; } + [data-uppy-theme="dark"] .uppy-Dashboard-AddFiles { + border-color: #757575; } + +.uppy-Dashboard-AddFiles-info { + padding-top: 15px; + padding-bottom: 15px; + margin-top: auto; + display: none; } + .uppy-size--height-md .uppy-Dashboard-AddFiles-info { + display: block; } + .uppy-size--md .uppy-Dashboard-AddFiles-info { + position: absolute; + bottom: 25px; + left: 0; + right: 0; + padding-top: 30px; + padding-bottom: 0; } + [data-uppy-num-acquirers="0"] .uppy-Dashboard-AddFiles-info { + margin-top: 0; } + +.uppy-Dashboard-browse { + cursor: pointer; + color: rgba(34, 117, 215, 0.9); } + .uppy-Dashboard-browse:focus { + outline: none; } + .uppy-Dashboard-browse::-moz-focus-inner { + border: 0; } + .uppy-Dashboard-browse:hover, .uppy-Dashboard-browse:focus { + border-bottom: 1px solid #2275d7; } + [data-uppy-theme="dark"] .uppy-Dashboard-browse { + color: rgba(2, 186, 242, 0.9); } + [data-uppy-theme="dark"] .uppy-Dashboard-browse:hover, + [data-uppy-theme="dark"] .uppy-Dashboard-browse:focus { + border-bottom: 1px solid #02baf2; } + +.uppy-Dashboard-browseBtn { + display: block; + font-size: 14px; + font-weight: 500; + margin-top: 8px; + margin-bottom: 5px; + width: 100%; } + .uppy-size--md .uppy-Dashboard-browseBtn { + font-size: 15px; + width: auto; + margin: auto; + margin-top: 15px; + margin-bottom: 15px; + padding: 13px 44px; } + +.uppy-Dashboard-AddFiles-list { + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex: 1; + flex: 1; + overflow-y: auto; + -webkit-overflow-scrolling: touch; + margin-top: 2px; + padding: 2px 0; + width: 100%; } + .uppy-size--md .uppy-Dashboard-AddFiles-list { + -ms-flex-direction: row; + flex-direction: row; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -ms-flex-pack: center; + justify-content: center; + max-width: 600px; + overflow-y: visible; + margin-top: 15px; + padding-top: 0; + -ms-flex: none; + flex: none; } + +.uppy-DashboardTab { + width: 100%; + text-align: center; + border-bottom: 1px solid #eaeaea; } + [data-uppy-theme="dark"] .uppy-DashboardTab { + border-bottom: 1px solid #333; } + .uppy-size--md .uppy-DashboardTab { + display: inline-block; + width: initial; + margin-bottom: 10px; + border-bottom: none; } + +.uppy-DashboardTab-btn { + width: 100%; + height: 100%; + cursor: pointer; + border: 0; + background-color: transparent; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + color: #525252; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: row; + flex-direction: row; + -ms-flex-align: center; + align-items: center; + padding: 12px 15px; + line-height: 1; + text-align: center; } + .uppy-DashboardTab-btn:focus { + outline: none; } + .uppy-DashboardTab-btn::-moz-focus-inner { + border: 0; } + .uppy-size--md .uppy-DashboardTab-btn { + width: 86px; + margin-right: 1px; + -ms-flex-direction: column; + flex-direction: column; + padding: 10px 3px; + border-radius: 5px; } + [data-uppy-theme="dark"] .uppy-DashboardTab-btn { + color: #eaeaea; } + +.uppy-DashboardTab-btn::-moz-focus-inner { + border: 0; } + +.uppy-DashboardTab-btn:hover { + background-color: #f1f3f6; } + [data-uppy-theme="dark"] .uppy-DashboardTab-btn:hover { + background-color: #333; } + +.uppy-DashboardTab-btn:active, +.uppy-DashboardTab-btn:focus { + background-color: #eceef2; } + [data-uppy-theme="dark"] .uppy-DashboardTab-btn:active, [data-uppy-theme="dark"] + .uppy-DashboardTab-btn:focus { + background-color: #525252; } + +.uppy-DashboardTab-btn svg { + max-width: 100%; + max-height: 100%; + display: inline-block; + vertical-align: text-top; + overflow: hidden; + transition: transform ease-in-out .15s; + margin-right: 10px; } + .uppy-size--md .uppy-DashboardTab-btn svg { + margin-right: 0; } + +.uppy-DashboardTab-name { + font-size: 14px; + font-weight: 500; } + .uppy-size--md .uppy-DashboardTab-name { + font-size: 11px; + line-height: 15px; + margin-top: 8px; + margin-bottom: 0; } + +.uppy-DashboardTab svg { + width: 23px; + height: 23px; + vertical-align: middle; } + .uppy-size--md .uppy-DashboardTab svg { + width: 30px; + height: 30px; } + +.uppy-Dashboard-input { + width: 0.1px; + height: 0.1px; + opacity: 0; + overflow: hidden; + position: absolute; + z-index: -1; } + +.uppy-DashboardContent-bar { + -ms-flex-negative: 0; + flex-shrink: 0; + height: 40px; + width: 100%; + padding: 0 10px; + z-index: 1004; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: justify; + justify-content: space-between; + position: relative; + border-bottom: 1px solid #eaeaea; + background-color: #fafafa; } + .uppy-size--md .uppy-DashboardContent-bar { + height: 50px; + padding: 0 15px; } + [data-uppy-theme="dark"] .uppy-DashboardContent-bar { + background-color: #1f1f1f; + border-bottom: 1px solid #333; } + +.uppy-DashboardContent-title { + position: absolute; + top: 0; + left: 0; + right: 0; + text-align: center; + font-size: 12px; + line-height: 40px; + font-weight: 500; + width: 100%; + max-width: 170px; + text-overflow: ellipsis; + white-space: nowrap; + overflow-x: hidden; + margin: auto; } + .uppy-size--md .uppy-DashboardContent-title { + font-size: 14px; + line-height: 50px; + max-width: 300px; } + [data-uppy-theme="dark"] .uppy-DashboardContent-title { + color: #eaeaea; } + +.uppy-DashboardContent-back { + background: none; + -webkit-appearance: none; + font-family: inherit; + font-size: inherit; + line-height: 1; + padding: 0; + margin: 0; + border: 0; + color: inherit; + border-radius: 3px; + font-size: 12px; + font-weight: 400; + cursor: pointer; + color: #2275d7; + padding: 7px 6px; + margin-left: -6px; } + .uppy-DashboardContent-back:focus { + outline: none; } + .uppy-DashboardContent-back::-moz-focus-inner { + border: 0; } + .uppy-DashboardContent-back:hover { + color: #1b5dab; } + .uppy-DashboardContent-back:focus { + background-color: #eceef2; } + [data-uppy-theme="dark"] .uppy-DashboardContent-back:focus { + background-color: #333; } + .uppy-size--md .uppy-DashboardContent-back { + font-size: 14px; } + [data-uppy-theme="dark"] .uppy-DashboardContent-back { + color: #02baf2; } + +.uppy-DashboardContent-addMore { + background: none; + -webkit-appearance: none; + font-family: inherit; + font-size: inherit; + line-height: 1; + padding: 0; + margin: 0; + border: 0; + color: inherit; + border-radius: 3px; + font-weight: 500; + cursor: pointer; + color: #2275d7; + width: 29px; + height: 29px; + padding: 7px 8px; + margin-right: -5px; } + .uppy-DashboardContent-addMore:focus { + outline: none; } + .uppy-DashboardContent-addMore::-moz-focus-inner { + border: 0; } + .uppy-DashboardContent-addMore:hover { + color: #1b5dab; } + .uppy-DashboardContent-addMore:focus { + background-color: #eceef2; } + [data-uppy-theme="dark"] .uppy-DashboardContent-addMore:focus { + background-color: #333; } + .uppy-size--md .uppy-DashboardContent-addMore { + font-size: 14px; + width: auto; + height: auto; + margin-right: -8px; } + [data-uppy-theme="dark"] .uppy-DashboardContent-addMore { + color: #02baf2; } + +.uppy-DashboardContent-addMore svg { + vertical-align: baseline; + margin-right: 4px; } + .uppy-size--md .uppy-DashboardContent-addMore svg { + width: 11px; + height: 11px; } + +.uppy-DashboardContent-addMoreCaption { + display: none; } + .uppy-size--md .uppy-DashboardContent-addMoreCaption { + display: inline; } + +.uppy-DashboardContent-panel { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background-color: whitesmoke; + overflow: hidden; + z-index: 1005; + border-radius: 5px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; + -ms-flex: 1; + flex: 1; } + +.uppy-Dashboard-AddFilesPanel { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: #fafafa; + background: linear-gradient(0deg, #fafafa 35%, rgba(250, 250, 250, 0.85) 100%); + box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.15); + overflow: hidden; + z-index: 1005; + border-radius: 5px; + display: -ms-flexbox; + display: flex; + -ms-flex-direction: column; + flex-direction: column; } + [data-uppy-theme="dark"] .uppy-Dashboard-AddFilesPanel { + background-color: #333; + background: linear-gradient(0deg, #1f1f1f 35%, rgba(31, 31, 31, 0.85) 100%); } + +.uppy-Dashboard--isAddFilesPanelVisible .uppy-Dashboard-files { + filter: blur(2px); } + +.uppy-Dashboard-progress { + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 12%; } + +.uppy-Dashboard-progressBarContainer.is-active { + z-index: 1004; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; } + +.uppy-Dashboard-filesContainer { + position: relative; + overflow-y: hidden; + margin: 0; + -ms-flex: 1; + flex: 1; } + .uppy-Dashboard-filesContainer:after { + content: ''; + display: table; + clear: both; } + +.uppy-Dashboard-files { + margin: 0; + padding: 0 0 10px 0; + overflow-y: auto; + -webkit-overflow-scrolling: touch; + -ms-flex: 1; + flex: 1; } + .uppy-size--md .uppy-Dashboard-files { + padding-top: 10px; } + +.uppy-Dashboard-dropFilesHereHint { + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + visibility: hidden; + position: absolute; + top: 7px; + right: 7px; + bottom: 7px; + left: 7px; + padding-top: 90px; + border: 1px dashed #2275d7; + border-radius: 3px; + z-index: 2000; + text-align: center; + background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 1v1C11.85 2 2 11.85 2 24s9.85 22 22 22 22-9.85 22-22S36.15 2 24 2V1zm0 0V0c13.254 0 24 10.746 24 24S37.254 48 24 48 0 37.254 0 24 10.746 0 24 0v1zm7.707 19.293a.999.999 0 1 1-1.414 1.414L25 16.414V34a1 1 0 1 1-2 0V16.414l-5.293 5.293a.999.999 0 1 1-1.414-1.414l7-7a.999.999 0 0 1 1.414 0l7 7z' fill='%232275D7' fill-rule='nonzero'/%3E%3C/svg%3E"); + background-position: 50% 50%; + background-repeat: no-repeat; + color: #757575; + font-size: 16px; } + [data-uppy-theme="dark"] .uppy-Dashboard-dropFilesHereHint { + color: #bbb; + border-color: #02baf2; + background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 1v1C11.85 2 2 11.85 2 24s9.85 22 22 22 22-9.85 22-22S36.15 2 24 2V1zm0 0V0c13.254 0 24 10.746 24 24S37.254 48 24 48 0 37.254 0 24 10.746 0 24 0v1zm7.707 19.293a.999.999 0 1 1-1.414 1.414L25 16.414V34a1 1 0 1 1-2 0V16.414l-5.293 5.293a.999.999 0 1 1-1.414-1.414l7-7a.999.999 0 0 1 1.414 0l7 7z' fill='%2302BAF2' fill-rule='nonzero'/%3E%3C/svg%3E"); } + +.uppy-Dashboard.uppy-Dashboard--isDraggingOver .uppy-Dashboard-dropFilesHereHint { + visibility: visible; } + +.uppy-Dashboard.uppy-Dashboard--isDraggingOver .uppy-DashboardContent-bar, +.uppy-Dashboard.uppy-Dashboard--isDraggingOver .uppy-Dashboard-files, +.uppy-Dashboard.uppy-Dashboard--isDraggingOver .uppy-Dashboard-progressindicators { + opacity: 0.15; } + +.uppy-Dashboard.uppy-Dashboard--isDraggingOver .uppy-Dashboard-AddFiles { + opacity: 0.03; } + +.uppy-Dashboard-dropFilesIcon { + display: none; + margin-bottom: 15px; } + .uppy-size--md.uppy-size--height-md .uppy-Dashboard-dropFilesIcon { + display: block; } + +.uppy-Dashboard-AddFiles-title { + font-size: 17px; + line-height: 1.35; + font-weight: 500; + color: #000; + margin-top: 15px; + margin-bottom: 5px; + text-align: left; + padding: 0 15px; + width: 100%; } + .uppy-size--md .uppy-Dashboard-AddFiles-title { + font-size: 25px; + margin-top: 5px; + font-weight: 400; + text-align: center; + max-width: 480px; } + [data-uppy-num-acquirers="0"] .uppy-Dashboard-AddFiles-title { + text-align: center; } + [data-uppy-theme="dark"] .uppy-Dashboard-AddFiles-title { + color: #eaeaea; } + .uppy-Dashboard-AddFiles-title button { + font-weight: 500; } + .uppy-size--md .uppy-Dashboard-AddFiles-title button { + font-weight: 400; } + +.uppy-Dashboard-note { + font-size: 14px; + line-height: 1.25; + text-align: center; + color: #757575; + max-width: 350px; + margin: auto; + padding: 0 15px; } + .uppy-size--md .uppy-Dashboard-note { + font-size: 15px; + line-height: 1.35; + max-width: 600px; } + [data-uppy-theme="dark"] .uppy-Dashboard-note { + color: #cfcfcf; } + +a.uppy-Dashboard-poweredBy { + display: inline-block; + text-align: center; + font-size: 11px; + color: #939393; + text-decoration: none; + margin-top: 8px; } + +.uppy-Dashboard-poweredByIcon { + stroke: #939393; + fill: none; + margin-left: 1px; + margin-right: 1px; + position: relative; + top: 1px; + opacity: 0.9; + vertical-align: text-top; } + +.uppy-Dashboard-Item-previewIcon { + width: 25px; + height: 25px; + z-index: 100; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } + .uppy-size--md .uppy-Dashboard-Item-previewIcon { + width: 38px; + height: 38px; } + .uppy-Dashboard-Item-previewIcon svg { + width: 100%; + height: 100%; } + +.uppy-Dashboard-Item-previewIconWrap { + height: 76px; + max-height: 75%; + position: relative; } + +.uppy-Dashboard-Item-previewIconBg { + width: 100%; + height: 100%; + filter: drop-shadow(rgba(0, 0, 0, 0.1) 0px 1px 1px); } + +.uppy-Dashboard-upload { + position: relative; + width: 50px; + height: 50px; } + .uppy-size--md .uppy-Dashboard-upload { + width: 60px; + height: 60px; } + +.uppy-Dashboard-upload .uppy-c-icon { + position: relative; + top: 1px; + width: 50%; } + +.uppy-Dashboard-uploadCount { + position: absolute; + top: -12px; + right: -12px; + background-color: #1bb240; + color: #fff; + border-radius: 50%; + width: 16px; + height: 16px; + line-height: 16px; + font-size: 8px; } + .uppy-size--md .uppy-Dashboard-uploadCount { + width: 18px; + height: 18px; + line-height: 18px; + font-size: 9px; } diff --git a/vendor/uppy/uppy-bundle.js b/vendor/uppy/uppy-bundle.js new file mode 100644 index 0000000000..49b5b5ea97 --- /dev/null +++ b/vendor/uppy/uppy-bundle.js @@ -0,0 +1,14053 @@ +(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i= 10 || num % 1 === 0) { + // Do not show decimals when the number is two-digit, or if the number has no + // decimal component. + return (neg ? '-' : '') + num.toFixed(0) + ' ' + unit + } else { + return (neg ? '-' : '') + num.toFixed(1) + ' ' + unit + } +} + +},{}],2:[function(require,module,exports){ +'use strict'; + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +function _wrapNativeSuper(Class) { var _cache = typeof Map === "function" ? new Map() : undefined; _wrapNativeSuper = function _wrapNativeSuper(Class) { if (Class === null || !_isNativeFunction(Class)) return Class; if (typeof Class !== "function") { throw new TypeError("Super expression must either be null or a function"); } if (typeof _cache !== "undefined") { if (_cache.has(Class)) return _cache.get(Class); _cache.set(Class, Wrapper); } function Wrapper() { return _construct(Class, arguments, _getPrototypeOf(this).constructor); } Wrapper.prototype = Object.create(Class.prototype, { constructor: { value: Wrapper, enumerable: false, writable: true, configurable: true } }); return _setPrototypeOf(Wrapper, Class); }; return _wrapNativeSuper(Class); } + +function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct; } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); } + +function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +function _isNativeFunction(fn) { return Function.toString.call(fn).indexOf("[native code]") !== -1; } + +function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } + +function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } + +var AuthError = /*#__PURE__*/function (_Error) { + _inheritsLoose(AuthError, _Error); + + function AuthError() { + var _this; + + _this = _Error.call(this, 'Authorization required') || this; + _this.name = 'AuthError'; + _this.isAuthError = true; + return _this; + } + + return AuthError; +}( /*#__PURE__*/_wrapNativeSuper(Error)); + +module.exports = AuthError; +},{}],3:[function(require,module,exports){ +'use strict'; + +function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +var RequestClient = require('./RequestClient'); + +var tokenStorage = require('./tokenStorage'); + +var _getName = function _getName(id) { + return id.split('-').map(function (s) { + return s.charAt(0).toUpperCase() + s.slice(1); + }).join(' '); +}; + +module.exports = /*#__PURE__*/function (_RequestClient) { + _inheritsLoose(Provider, _RequestClient); + + function Provider(uppy, opts) { + var _this; + + _this = _RequestClient.call(this, uppy, opts) || this; + _this.provider = opts.provider; + _this.id = _this.provider; + _this.name = _this.opts.name || _getName(_this.id); + _this.pluginId = _this.opts.pluginId; + _this.tokenKey = "companion-" + _this.pluginId + "-auth-token"; + return _this; + } + + var _proto = Provider.prototype; + + _proto.headers = function headers() { + return Promise.all([_RequestClient.prototype.headers.call(this), this.getAuthToken()]).then(function (_ref) { + var headers = _ref[0], + token = _ref[1]; + return _extends({}, headers, { + 'uppy-auth-token': token + }); + }); + }; + + _proto.onReceiveResponse = function onReceiveResponse(response) { + response = _RequestClient.prototype.onReceiveResponse.call(this, response); + var plugin = this.uppy.getPlugin(this.pluginId); + var oldAuthenticated = plugin.getPluginState().authenticated; + var authenticated = oldAuthenticated ? response.status !== 401 : response.status < 400; + plugin.setPluginState({ + authenticated: authenticated + }); + return response; + } // @todo(i.olarewaju) consider whether or not this method should be exposed + ; + + _proto.setAuthToken = function setAuthToken(token) { + return this.uppy.getPlugin(this.pluginId).storage.setItem(this.tokenKey, token); + }; + + _proto.getAuthToken = function getAuthToken() { + return this.uppy.getPlugin(this.pluginId).storage.getItem(this.tokenKey); + }; + + _proto.authUrl = function authUrl() { + return this.hostname + "/" + this.id + "/connect"; + }; + + _proto.fileUrl = function fileUrl(id) { + return this.hostname + "/" + this.id + "/get/" + id; + }; + + _proto.list = function list(directory) { + return this.get(this.id + "/list/" + (directory || '')); + }; + + _proto.logout = function logout() { + var _this2 = this; + + return this.get(this.id + "/logout").then(function (response) { + return Promise.all([response, _this2.uppy.getPlugin(_this2.pluginId).storage.removeItem(_this2.tokenKey)]); + }).then(function (_ref2) { + var response = _ref2[0]; + return response; + }); + }; + + Provider.initPlugin = function initPlugin(plugin, opts, defaultOpts) { + plugin.type = 'acquirer'; + plugin.files = []; + + if (defaultOpts) { + plugin.opts = _extends({}, defaultOpts, opts); + } + + if (opts.serverUrl || opts.serverPattern) { + throw new Error('`serverUrl` and `serverPattern` have been renamed to `companionUrl` and `companionAllowedHosts` respectively in the 0.30.5 release. Please consult the docs (for example, https://uppy.io/docs/instagram/ for the Instagram plugin) and use the updated options.`'); + } + + if (opts.companionAllowedHosts) { + var pattern = opts.companionAllowedHosts; // validate companionAllowedHosts param + + if (typeof pattern !== 'string' && !Array.isArray(pattern) && !(pattern instanceof RegExp)) { + throw new TypeError(plugin.id + ": the option \"companionAllowedHosts\" must be one of string, Array, RegExp"); + } + + plugin.opts.companionAllowedHosts = pattern; + } else { + // does not start with https:// + if (/^(?!https?:\/\/).*$/i.test(opts.companionUrl)) { + plugin.opts.companionAllowedHosts = "https://" + opts.companionUrl.replace(/^\/\//, ''); + } else { + plugin.opts.companionAllowedHosts = opts.companionUrl; + } + } + + plugin.storage = plugin.opts.storage || tokenStorage; + }; + + return Provider; +}(RequestClient); +},{"./RequestClient":4,"./tokenStorage":8}],4:[function(require,module,exports){ +'use strict'; + +var _class, _temp; + +function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } + +function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } + +function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } + +var AuthError = require('./AuthError'); + +var fetchWithNetworkError = require('@uppy/utils/lib/fetchWithNetworkError'); // Remove the trailing slash so we can always safely append /xyz. + + +function stripSlash(url) { + return url.replace(/\/$/, ''); +} + +module.exports = (_temp = _class = /*#__PURE__*/function () { + function RequestClient(uppy, opts) { + this.uppy = uppy; + this.opts = opts; + this.onReceiveResponse = this.onReceiveResponse.bind(this); + this.allowedHeaders = ['accept', 'content-type', 'uppy-auth-token']; + this.preflightDone = false; + } + + var _proto = RequestClient.prototype; + + _proto.headers = function headers() { + var userHeaders = this.opts.companionHeaders || this.opts.serverHeaders || {}; + return Promise.resolve(_extends({}, this.defaultHeaders, userHeaders)); + }; + + _proto._getPostResponseFunc = function _getPostResponseFunc(skip) { + var _this = this; + + return function (response) { + if (!skip) { + return _this.onReceiveResponse(response); + } + + return response; + }; + }; + + _proto.onReceiveResponse = function onReceiveResponse(response) { + var state = this.uppy.getState(); + var companion = state.companion || {}; + var host = this.opts.companionUrl; + var headers = response.headers; // Store the self-identified domain name for the Companion instance we just hit. + + if (headers.has('i-am') && headers.get('i-am') !== companion[host]) { + var _extends2; + + this.uppy.setState({ + companion: _extends({}, companion, (_extends2 = {}, _extends2[host] = headers.get('i-am'), _extends2)) + }); + } + + return response; + }; + + _proto._getUrl = function _getUrl(url) { + if (/^(https?:|)\/\//.test(url)) { + return url; + } + + return this.hostname + "/" + url; + }; + + _proto._json = function _json(res) { + if (res.status === 401) { + throw new AuthError(); + } + + if (res.status < 200 || res.status > 300) { + var errMsg = "Failed request with status: " + res.status + ". " + res.statusText; + return res.json().then(function (errData) { + errMsg = errData.message ? errMsg + " message: " + errData.message : errMsg; + errMsg = errData.requestId ? errMsg + " request-Id: " + errData.requestId : errMsg; + throw new Error(errMsg); + }).catch(function () { + throw new Error(errMsg); + }); + } + + return res.json(); + }; + + _proto.preflight = function preflight(path) { + var _this2 = this; + + if (this.preflightDone) { + return Promise.resolve(this.allowedHeaders.slice()); + } + + return fetch(this._getUrl(path), { + method: 'OPTIONS' + }).then(function (response) { + if (response.headers.has('access-control-allow-headers')) { + _this2.allowedHeaders = response.headers.get('access-control-allow-headers').split(',').map(function (headerName) { + return headerName.trim().toLowerCase(); + }); + } + + _this2.preflightDone = true; + return _this2.allowedHeaders.slice(); + }).catch(function (err) { + _this2.uppy.log("[CompanionClient] unable to make preflight request " + err, 'warning'); + + _this2.preflightDone = true; + return _this2.allowedHeaders.slice(); + }); + }; + + _proto.preflightAndHeaders = function preflightAndHeaders(path) { + var _this3 = this; + + return Promise.all([this.preflight(path), this.headers()]).then(function (_ref) { + var allowedHeaders = _ref[0], + headers = _ref[1]; + // filter to keep only allowed Headers + Object.keys(headers).forEach(function (header) { + if (allowedHeaders.indexOf(header.toLowerCase()) === -1) { + _this3.uppy.log("[CompanionClient] excluding unallowed header " + header); + + delete headers[header]; + } + }); + return headers; + }); + }; + + _proto.get = function get(path, skipPostResponse) { + var _this4 = this; + + return this.preflightAndHeaders(path).then(function (headers) { + return fetchWithNetworkError(_this4._getUrl(path), { + method: 'get', + headers: headers, + credentials: 'same-origin' + }); + }).then(this._getPostResponseFunc(skipPostResponse)).then(function (res) { + return _this4._json(res); + }).catch(function (err) { + err = err.isAuthError ? err : new Error("Could not get " + _this4._getUrl(path) + ". " + err); + return Promise.reject(err); + }); + }; + + _proto.post = function post(path, data, skipPostResponse) { + var _this5 = this; + + return this.preflightAndHeaders(path).then(function (headers) { + return fetchWithNetworkError(_this5._getUrl(path), { + method: 'post', + headers: headers, + credentials: 'same-origin', + body: JSON.stringify(data) + }); + }).then(this._getPostResponseFunc(skipPostResponse)).then(function (res) { + return _this5._json(res); + }).catch(function (err) { + err = err.isAuthError ? err : new Error("Could not post " + _this5._getUrl(path) + ". " + err); + return Promise.reject(err); + }); + }; + + _proto.delete = function _delete(path, data, skipPostResponse) { + var _this6 = this; + + return this.preflightAndHeaders(path).then(function (headers) { + return fetchWithNetworkError(_this6.hostname + "/" + path, { + method: 'delete', + headers: headers, + credentials: 'same-origin', + body: data ? JSON.stringify(data) : null + }); + }).then(this._getPostResponseFunc(skipPostResponse)).then(function (res) { + return _this6._json(res); + }).catch(function (err) { + err = err.isAuthError ? err : new Error("Could not delete " + _this6._getUrl(path) + ". " + err); + return Promise.reject(err); + }); + }; + + _createClass(RequestClient, [{ + key: "hostname", + get: function get() { + var _this$uppy$getState = this.uppy.getState(), + companion = _this$uppy$getState.companion; + + var host = this.opts.companionUrl; + return stripSlash(companion && companion[host] ? companion[host] : host); + } + }, { + key: "defaultHeaders", + get: function get() { + return { + Accept: 'application/json', + 'Content-Type': 'application/json', + 'Uppy-Versions': "@uppy/companion-client=" + RequestClient.VERSION + }; + } + }]); + + return RequestClient; +}(), _class.VERSION = "1.6.1", _temp); +},{"./AuthError":2,"@uppy/utils/lib/fetchWithNetworkError":50}],5:[function(require,module,exports){ +'use strict'; + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +var RequestClient = require('./RequestClient'); + +var _getName = function _getName(id) { + return id.split('-').map(function (s) { + return s.charAt(0).toUpperCase() + s.slice(1); + }).join(' '); +}; + +module.exports = /*#__PURE__*/function (_RequestClient) { + _inheritsLoose(SearchProvider, _RequestClient); + + function SearchProvider(uppy, opts) { + var _this; + + _this = _RequestClient.call(this, uppy, opts) || this; + _this.provider = opts.provider; + _this.id = _this.provider; + _this.name = _this.opts.name || _getName(_this.id); + _this.pluginId = _this.opts.pluginId; + return _this; + } + + var _proto = SearchProvider.prototype; + + _proto.fileUrl = function fileUrl(id) { + return this.hostname + "/search/" + this.id + "/get/" + id; + }; + + _proto.search = function search(text, queries) { + queries = queries ? "&" + queries : ''; + return this.get("search/" + this.id + "/list?q=" + encodeURIComponent(text) + queries); + }; + + return SearchProvider; +}(RequestClient); +},{"./RequestClient":4}],6:[function(require,module,exports){ +var ee = require('namespace-emitter'); + +module.exports = /*#__PURE__*/function () { + function UppySocket(opts) { + this.opts = opts; + this._queued = []; + this.isOpen = false; + this.emitter = ee(); + this._handleMessage = this._handleMessage.bind(this); + this.close = this.close.bind(this); + this.emit = this.emit.bind(this); + this.on = this.on.bind(this); + this.once = this.once.bind(this); + this.send = this.send.bind(this); + + if (!opts || opts.autoOpen !== false) { + this.open(); + } + } + + var _proto = UppySocket.prototype; + + _proto.open = function open() { + var _this = this; + + this.socket = new WebSocket(this.opts.target); + + this.socket.onopen = function (e) { + _this.isOpen = true; + + while (_this._queued.length > 0 && _this.isOpen) { + var first = _this._queued[0]; + + _this.send(first.action, first.payload); + + _this._queued = _this._queued.slice(1); + } + }; + + this.socket.onclose = function (e) { + _this.isOpen = false; + }; + + this.socket.onmessage = this._handleMessage; + }; + + _proto.close = function close() { + if (this.socket) { + this.socket.close(); + } + }; + + _proto.send = function send(action, payload) { + // attach uuid + if (!this.isOpen) { + this._queued.push({ + action: action, + payload: payload + }); + + return; + } + + this.socket.send(JSON.stringify({ + action: action, + payload: payload + })); + }; + + _proto.on = function on(action, handler) { + this.emitter.on(action, handler); + }; + + _proto.emit = function emit(action, payload) { + this.emitter.emit(action, payload); + }; + + _proto.once = function once(action, handler) { + this.emitter.once(action, handler); + }; + + _proto._handleMessage = function _handleMessage(e) { + try { + var message = JSON.parse(e.data); + this.emit(message.action, message.payload); + } catch (err) { + console.log(err); + } + }; + + return UppySocket; +}(); +},{"namespace-emitter":91}],7:[function(require,module,exports){ +'use strict'; +/** + * Manages communications with Companion + */ + +var RequestClient = require('./RequestClient'); + +var Provider = require('./Provider'); + +var SearchProvider = require('./SearchProvider'); + +var Socket = require('./Socket'); + +module.exports = { + RequestClient: RequestClient, + Provider: Provider, + SearchProvider: SearchProvider, + Socket: Socket +}; +},{"./Provider":3,"./RequestClient":4,"./SearchProvider":5,"./Socket":6}],8:[function(require,module,exports){ +'use strict'; +/** + * This module serves as an Async wrapper for LocalStorage + */ + +module.exports.setItem = function (key, value) { + return new Promise(function (resolve) { + localStorage.setItem(key, value); + resolve(); + }); +}; + +module.exports.getItem = function (key) { + return Promise.resolve(localStorage.getItem(key)); +}; + +module.exports.removeItem = function (key) { + return new Promise(function (resolve) { + localStorage.removeItem(key); + resolve(); + }); +}; +},{}],9:[function(require,module,exports){ +function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } + +var preact = require('preact'); + +var findDOMElement = require('@uppy/utils/lib/findDOMElement'); +/** + * Defer a frequent call to the microtask queue. + */ + + +function debounce(fn) { + var calling = null; + var latestArgs = null; + return function () { + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + latestArgs = args; + + if (!calling) { + calling = Promise.resolve().then(function () { + calling = null; // At this point `args` may be different from the most + // recent state, if multiple calls happened since this task + // was queued. So we use the `latestArgs`, which definitely + // is the most recent call. + + return fn.apply(void 0, latestArgs); + }); + } + + return calling; + }; +} +/** + * Boilerplate that all Plugins share - and should not be used + * directly. It also shows which methods final plugins should implement/override, + * this deciding on structure. + * + * @param {object} main Uppy core object + * @param {object} object with plugin options + * @returns {Array|string} files or success/fail message + */ + + +module.exports = /*#__PURE__*/function () { + function Plugin(uppy, opts) { + this.uppy = uppy; + this.opts = opts || {}; + this.update = this.update.bind(this); + this.mount = this.mount.bind(this); + this.install = this.install.bind(this); + this.uninstall = this.uninstall.bind(this); + } + + var _proto = Plugin.prototype; + + _proto.getPluginState = function getPluginState() { + var _this$uppy$getState = this.uppy.getState(), + plugins = _this$uppy$getState.plugins; + + return plugins[this.id] || {}; + }; + + _proto.setPluginState = function setPluginState(update) { + var _extends2; + + var _this$uppy$getState2 = this.uppy.getState(), + plugins = _this$uppy$getState2.plugins; + + this.uppy.setState({ + plugins: _extends({}, plugins, (_extends2 = {}, _extends2[this.id] = _extends({}, plugins[this.id], update), _extends2)) + }); + }; + + _proto.setOptions = function setOptions(newOpts) { + this.opts = _extends({}, this.opts, newOpts); + this.setPluginState(); // so that UI re-renders with new options + }; + + _proto.update = function update(state) { + if (typeof this.el === 'undefined') { + return; + } + + if (this._updateUI) { + this._updateUI(state); + } + } // Called after every state update, after everything's mounted. Debounced. + ; + + _proto.afterUpdate = function afterUpdate() {} + /** + * Called when plugin is mounted, whether in DOM or into another plugin. + * Needed because sometimes plugins are mounted separately/after `install`, + * so this.el and this.parent might not be available in `install`. + * This is the case with @uppy/react plugins, for example. + */ + ; + + _proto.onMount = function onMount() {} + /** + * Check if supplied `target` is a DOM element or an `object`. + * If it’s an object — target is a plugin, and we search `plugins` + * for a plugin with same name and return its target. + * + * @param {string|object} target + * + */ + ; + + _proto.mount = function mount(target, plugin) { + var _this = this; + + var callerPluginName = plugin.id; + var targetElement = findDOMElement(target); + + if (targetElement) { + this.isTargetDOMEl = true; // API for plugins that require a synchronous rerender. + + this.rerender = function (state) { + // plugin could be removed, but this.rerender is debounced below, + // so it could still be called even after uppy.removePlugin or uppy.close + // hence the check + if (!_this.uppy.getPlugin(_this.id)) return; + _this.el = preact.render(_this.render(state), targetElement, _this.el); + + _this.afterUpdate(); + }; + + this._updateUI = debounce(this.rerender); + this.uppy.log("Installing " + callerPluginName + " to a DOM element '" + target + "'"); // clear everything inside the target container + + if (this.opts.replaceTargetContent) { + targetElement.innerHTML = ''; + } + + this.el = preact.render(this.render(this.uppy.getState()), targetElement); + this.onMount(); + return this.el; + } + + var targetPlugin; + + if (typeof target === 'object' && target instanceof Plugin) { + // Targeting a plugin *instance* + targetPlugin = target; + } else if (typeof target === 'function') { + // Targeting a plugin type + var Target = target; // Find the target plugin instance. + + this.uppy.iteratePlugins(function (plugin) { + if (plugin instanceof Target) { + targetPlugin = plugin; + return false; + } + }); + } + + if (targetPlugin) { + this.uppy.log("Installing " + callerPluginName + " to " + targetPlugin.id); + this.parent = targetPlugin; + this.el = targetPlugin.addTarget(plugin); + this.onMount(); + return this.el; + } + + this.uppy.log("Not installing " + callerPluginName); + var message = "Invalid target option given to " + callerPluginName + "."; + + if (typeof target === 'function') { + message += ' The given target is not a Plugin class. ' + 'Please check that you\'re not specifying a React Component instead of a plugin. ' + 'If you are using @uppy/* packages directly, make sure you have only 1 version of @uppy/core installed: ' + 'run `npm ls @uppy/core` on the command line and verify that all the versions match and are deduped correctly.'; + } else { + message += 'If you meant to target an HTML element, please make sure that the element exists. ' + 'Check that the