From: Matthias Schmidt Date: Wed, 18 Nov 2020 15:31:03 +0000 (+0100) Subject: Merge branch '5.3' X-Git-Tag: 5.4.0_Alpha_1~596 X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=caa4fad2a708f47c63495cc3930bb3132201a715;p=GitHub%2FWoltLab%2FWCF.git Merge branch '5.3' --- caa4fad2a708f47c63495cc3930bb3132201a715 diff --cc wcfsetup/install/files/js/WoltLabSuite/Core/Media/Upload.js index d78ea3700f,e8b1d0f098..86c4abdc41 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Media/Upload.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Media/Upload.js @@@ -6,296 -6,365 +6,296 @@@ * @license GNU Lesser General Public License * @module WoltLabSuite/Core/Media/Upload */ -define( - [ - 'Core', - 'DateUtil', - 'Dom/ChangeListener', - 'Dom/Traverse', - 'Dom/Util', - 'EventHandler', - 'Language', - 'Permission', - 'Upload', - 'User', - 'WoltLabSuite/Core/FileUtil' - ], - function( - Core, - DateUtil, - DomChangeListener, - DomTraverse, - DomUtil, - EventHandler, - Language, - Permission, - Upload, - User, - FileUtil - ) -{ - "use strict"; - - if (!COMPILER_TARGET_DEFAULT) { - var Fake = function() {}; - Fake.prototype = { - _createFileElement: function() {}, - _getParameters: function() {}, - _success: function() {}, - _uploadFiles: function() {}, - _createButton: function() {}, - _createFileElements: function() {}, - _failure: function() {}, - _insertButton: function() {}, - _progress: function() {}, - _removeButton: function() {}, - _upload: function() {} - }; - return Fake; - } - - /** - * @constructor - */ - function MediaUpload(buttonContainerId, targetId, options) { - options = options || {}; - - this._elementTagSize = 144; - if (options.elementTagSize) { - this._elementTagSize = options.elementTagSize; - } - - this._mediaManager = null; - if (options.mediaManager) { - this._mediaManager = options.mediaManager; - delete options.mediaManager; - } - this._categoryId = null; - - Upload.call(this, buttonContainerId, targetId, Core.extend({ - className: 'wcf\\data\\media\\MediaAction', - multiple: this._mediaManager ? true : false, - singleFileRequests: true - }, options)); - } - Core.inherit(MediaUpload, Upload, { - /** - * @see WoltLabSuite/Core/Upload#_createFileElement - */ - _createFileElement: function(file) { - var fileElement; - if (this._target.nodeName === 'OL' || this._target.nodeName === 'UL') { - fileElement = elCreate('li'); - } - else if (this._target.nodeName === 'TBODY') { - var firstTr = elByTag('TR', this._target)[0]; - var tableContainer = this._target.parentNode.parentNode; - if (tableContainer.style.getPropertyValue('display') === 'none') { - fileElement = firstTr; - - tableContainer.style.removeProperty('display'); - - elRemove(elById(elData(this._target, 'no-items-info'))); - } - else { - fileElement = firstTr.cloneNode(true); - - // regenerate id of table row - fileElement.removeAttribute('id'); - DomUtil.identify(fileElement); - } - - var cells = elByTag('TD', fileElement), cell; - for (var i = 0, length = cells.length; i < length; i++) { - cell = cells[i]; - - if (cell.classList.contains('columnMark')) { - elBySelAll('[data-object-id]', cell, elHide); - } - else if (cell.classList.contains('columnIcon')) { - elBySelAll('[data-object-id]', cell, elHide); - - elByClass('mediaEditButton', cell)[0].classList.add('jsMediaEditButton'); - elData(elByClass('jsDeleteButton', cell)[0], 'confirm-message-html', Language.get('wcf.media.delete.confirmMessage', { - title: file.name - })); - } - else if (cell.classList.contains('columnFilename')) { - // replace copied image with spinner - var image = elByTag('IMG', cell); - - if (!image.length) { - image = elByClass('icon48', cell); - } - - var spinner = elCreate('span'); - spinner.className = 'icon icon48 fa-spinner mediaThumbnail'; - - DomUtil.replaceElement(image[0], spinner); - - // replace title and uploading user - var ps = elBySelAll('.box48 > div > p', cell); - ps[0].textContent = file.name; - - var userLink = elByTag('A', ps[1])[0]; - if (!userLink) { - userLink = elCreate('a'); - elByTag('SMALL', ps[1])[0].appendChild(userLink); - } - - userLink.setAttribute('href', User.getLink()); - userLink.textContent = User.username; - } - else if (cell.classList.contains('columnUploadTime')) { - cell.innerHTML = ''; - cell.appendChild(DateUtil.getTimeElement(new Date())); - } - else if (cell.classList.contains('columnDigits')) { - cell.textContent = FileUtil.formatFilesize(file.size); - } - else { - // empty the other cells - cell.innerHTML = ''; - } - } - - DomUtil.prepend(fileElement, this._target); - - return fileElement; - } - else { - fileElement = elCreate('p'); - } - - var thumbnail = elCreate('div'); - thumbnail.className = 'mediaThumbnail'; - fileElement.appendChild(thumbnail); - - var fileIcon = elCreate('span'); - fileIcon.className = 'icon icon144 fa-spinner'; - thumbnail.appendChild(fileIcon); - - var mediaInformation = elCreate('div'); - mediaInformation.className = 'mediaInformation'; - fileElement.appendChild(mediaInformation); - - var p = elCreate('p'); - p.className = 'mediaTitle'; - p.textContent = file.name; - mediaInformation.appendChild(p); - - var progress = elCreate('progress'); - elAttr(progress, 'max', 100); - mediaInformation.appendChild(progress); - - DomUtil.prepend(fileElement, this._target); - - DomChangeListener.trigger(); - - return fileElement; - }, - - /** - * @see WoltLabSuite/Core/Upload#_getParameters - */ - _getParameters: function() { - var parameters = { - elementTagSize: this._elementTagSize - }; - if (this._mediaManager) { - parameters.imagesOnly = this._mediaManager.getOption('imagesOnly'); - - var categoryId = this._mediaManager.getCategoryId(); - if (categoryId) { - parameters.categoryID = categoryId; - } - } - - return Core.extend(MediaUpload._super.prototype._getParameters.call(this), parameters); - }, - - /** - * Replaces the default or copied file icon with the actual file icon. - * - * @param {HTMLElement} fileIcon file icon element - * @param {object} media media data - * @param {integer} size size of the file icon in pixels - */ - _replaceFileIcon: function(fileIcon, media, size) { - if (media.elementTag) { - fileIcon.outerHTML = media.elementTag; - } - else if (media.tinyThumbnailType) { - var img = elCreate('img'); - elAttr(img, 'src', media.tinyThumbnailLink); - elAttr(img, 'alt', ''); - img.style.setProperty('width', size + 'px'); - img.style.setProperty('height', size + 'px'); - - DomUtil.replaceElement(fileIcon, img); - } - else { - fileIcon.classList.remove('fa-spinner'); - - var fileIconName = FileUtil.getIconNameByFilename(media.filename); - if (fileIconName) { - fileIconName = '-' + fileIconName; - } - fileIcon.classList.add('fa-file' + fileIconName + '-o'); - } - }, - - /** - * @see WoltLabSuite/Core/Upload#_success - */ - _success: function(uploadId, data) { - var files = this._fileElements[uploadId]; - - for (var i = 0, length = files.length; i < length; i++) { - var file = files[i]; - var internalFileId = elData(file, 'internal-file-id'); - var media = data.returnValues.media[internalFileId]; - - if (file.tagName === 'TR') { - if (media) { - // update object id - var objectIdElements = elBySelAll('[data-object-id]', file); - for (var i = 0, length = objectIdElements.length; i < length; i++) { - elData(objectIdElements[i], 'object-id', ~~media.mediaID); - elShow(objectIdElements[i]); - } - - elByClass('columnMediaID', file)[0].textContent = media.mediaID; - - // update icon - var fileIcon = elByClass('fa-spinner', file)[0]; - this._replaceFileIcon(fileIcon, media, 48); - } - else { - var error = data.returnValues.errors[internalFileId]; - if (!error) { - error = { - errorType: 'uploadFailed', - filename: elData(file, 'filename') - }; - } - - var fileIcon = elByClass('fa-spinner', file)[0]; - fileIcon.classList.remove('fa-spinner'); - fileIcon.classList.add('fa-remove'); - fileIcon.classList.add('pointer'); - fileIcon.classList.add('jsTooltip'); - elAttr(fileIcon, 'title', Language.get('wcf.global.button.delete')); - fileIcon.addEventListener(WCF_CLICK_EVENT, function (event) { - elRemove(event.currentTarget.parentNode.parentNode.parentNode); - - EventHandler.fire('com.woltlab.wcf.media.upload', 'removedErroneousUploadRow'); - }); - - file.classList.add('uploadFailed'); - - var p = elBySelAll('.columnFilename .box48 > div > p', file)[1]; - - elInnerError(p, Language.get('wcf.media.upload.error.' + error.errorType, { - filename: error.filename - })); - - elRemove(p); - } - } - else { - elRemove(DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaInformation'), 'PROGRESS')); - - if (media) { - var fileIcon = DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaThumbnail'), 'SPAN'); - this._replaceFileIcon(fileIcon, media, 144); - - file.className = 'jsClipboardObject mediaFile'; - elData(file, 'object-id', media.mediaID); - - if (this._mediaManager) { - this._mediaManager.setupMediaElement(media, file); - this._mediaManager.addMedia(media, file); - } - } - else { - var error = data.returnValues.errors[internalFileId]; - if (!error) { - error = { - errorType: 'uploadFailed', - filename: elData(file, 'filename') - }; - } - - var fileIcon = DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaThumbnail'), 'SPAN'); - fileIcon.classList.remove('fa-spinner'); - fileIcon.classList.add('fa-remove'); - fileIcon.classList.add('pointer'); - - file.classList.add('uploadFailed'); - file.classList.add('jsTooltip'); - elAttr(file, 'title', Language.get('wcf.global.button.delete')); - file.addEventListener(WCF_CLICK_EVENT, function () { - elRemove(this); - }); - - var title = DomTraverse.childByClass(DomTraverse.childByClass(file, 'mediaInformation'), 'mediaTitle'); - title.innerText = Language.get('wcf.media.upload.error.' + error.errorType, { - filename: error.filename - }); - } - } - - DomChangeListener.trigger(); - } - - EventHandler.fire('com.woltlab.wcf.media.upload', 'success', { - files: files, - isMultiFileUpload: this._multiFileUploadIds.indexOf(uploadId) !== -1, - media: data.returnValues.media, - upload: this, - uploadId: uploadId - }); - }, - - /** - * @see WoltLabSuite/Core/Upload#_uploadFiles - */ - _uploadFiles: function(files, blob) { - return MediaUpload._super.prototype._uploadFiles.call(this, files, blob); - } - }); - - return MediaUpload; +define([ + 'Core', + 'DateUtil', + 'Dom/ChangeListener', + 'Dom/Traverse', + 'Dom/Util', + 'EventHandler', + 'Language', + 'Permission', + 'Upload', + 'User', + 'WoltLabSuite/Core/FileUtil' +], function (Core, DateUtil, DomChangeListener, DomTraverse, DomUtil, EventHandler, Language, Permission, Upload, User, FileUtil) { + "use strict"; + if (!COMPILER_TARGET_DEFAULT) { + var Fake = function () { }; + Fake.prototype = { + _createFileElement: function () { }, + _getParameters: function () { }, + _success: function () { }, + _uploadFiles: function () { }, + _createButton: function () { }, + _createFileElements: function () { }, + _failure: function () { }, + _insertButton: function () { }, + _progress: function () { }, + _removeButton: function () { }, + _upload: function () { } + }; + return Fake; + } + /** + * @constructor + */ + function MediaUpload(buttonContainerId, targetId, options) { + options = options || {}; + this._elementTagSize = 144; + if (options.elementTagSize) { + this._elementTagSize = options.elementTagSize; + } + this._mediaManager = null; + if (options.mediaManager) { + this._mediaManager = options.mediaManager; + delete options.mediaManager; + } + this._categoryId = null; + Upload.call(this, buttonContainerId, targetId, Core.extend({ + className: 'wcf\\data\\media\\MediaAction', + multiple: this._mediaManager ? true : false, + singleFileRequests: true + }, options)); + } + Core.inherit(MediaUpload, Upload, { + /** + * @see WoltLabSuite/Core/Upload#_createFileElement + */ + _createFileElement: function (file) { + var fileElement; + if (this._target.nodeName === 'OL' || this._target.nodeName === 'UL') { + fileElement = elCreate('li'); + } + else if (this._target.nodeName === 'TBODY') { + var firstTr = elByTag('TR', this._target)[0]; + var tableContainer = this._target.parentNode.parentNode; + if (tableContainer.style.getPropertyValue('display') === 'none') { + fileElement = firstTr; + tableContainer.style.removeProperty('display'); + elRemove(elById(elData(this._target, 'no-items-info'))); + } + else { + fileElement = firstTr.cloneNode(true); + // regenerate id of table row + fileElement.removeAttribute('id'); + DomUtil.identify(fileElement); + } + var cells = elByTag('TD', fileElement), cell; + for (var i = 0, length = cells.length; i < length; i++) { + cell = cells[i]; + if (cell.classList.contains('columnMark')) { + elBySelAll('[data-object-id]', cell, elHide); + } + else if (cell.classList.contains('columnIcon')) { + elBySelAll('[data-object-id]', cell, elHide); + elByClass('mediaEditButton', cell)[0].classList.add('jsMediaEditButton'); + elData(elByClass('jsDeleteButton', cell)[0], 'confirm-message-html', Language.get('wcf.media.delete.confirmMessage', { + title: file.name + })); + } + else if (cell.classList.contains('columnFilename')) { + // replace copied image with spinner + var image = elByTag('IMG', cell); + if (!image.length) { + image = elByClass('icon48', cell); + } + var spinner = elCreate('span'); + spinner.className = 'icon icon48 fa-spinner mediaThumbnail'; + DomUtil.replaceElement(image[0], spinner); + // replace title and uploading user + var ps = elBySelAll('.box48 > div > p', cell); + ps[0].textContent = file.name; + var userLink = elByTag('A', ps[1])[0]; + if (!userLink) { + userLink = elCreate('a'); + elByTag('SMALL', ps[1])[0].appendChild(userLink); + } + userLink.setAttribute('href', User.getLink()); + userLink.textContent = User.username; + } + else if (cell.classList.contains('columnUploadTime')) { + cell.innerHTML = ''; + cell.appendChild(DateUtil.getTimeElement(new Date())); + } + else if (cell.classList.contains('columnDigits')) { + cell.textContent = FileUtil.formatFilesize(file.size); + } + else { + // empty the other cells + cell.innerHTML = ''; + } + } + DomUtil.prepend(fileElement, this._target); + return fileElement; + } + else { + fileElement = elCreate('p'); + } + var thumbnail = elCreate('div'); + thumbnail.className = 'mediaThumbnail'; + fileElement.appendChild(thumbnail); + var fileIcon = elCreate('span'); + fileIcon.className = 'icon icon144 fa-spinner'; + thumbnail.appendChild(fileIcon); + var mediaInformation = elCreate('div'); + mediaInformation.className = 'mediaInformation'; + fileElement.appendChild(mediaInformation); + var p = elCreate('p'); + p.className = 'mediaTitle'; + p.textContent = file.name; + mediaInformation.appendChild(p); + var progress = elCreate('progress'); + elAttr(progress, 'max', 100); + mediaInformation.appendChild(progress); + DomUtil.prepend(fileElement, this._target); + DomChangeListener.trigger(); + return fileElement; + }, + /** + * @see WoltLabSuite/Core/Upload#_getParameters + */ + _getParameters: function () { + var parameters = { + elementTagSize: this._elementTagSize + }; + if (this._mediaManager) { + parameters.imagesOnly = this._mediaManager.getOption('imagesOnly'); + var categoryId = this._mediaManager.getCategoryId(); + if (categoryId) { + parameters.categoryID = categoryId; + } + } + return Core.extend(MediaUpload._super.prototype._getParameters.call(this), parameters); + }, + /** + * Replaces the default or copied file icon with the actual file icon. + * + * @param {HTMLElement} fileIcon file icon element + * @param {object} media media data + * @param {integer} size size of the file icon in pixels + */ + _replaceFileIcon: function (fileIcon, media, size) { + if (media.elementTag) { - fileIcon.parentElement.innerHTML = media.elementTag; ++ fileIcon.outerHTML = media.elementTag; + } + else if (media.tinyThumbnailType) { + var img = elCreate('img'); + elAttr(img, 'src', media.tinyThumbnailLink); + elAttr(img, 'alt', ''); + img.style.setProperty('width', size + 'px'); + img.style.setProperty('height', size + 'px'); + DomUtil.replaceElement(fileIcon, img); + } + else { + fileIcon.classList.remove('fa-spinner'); + var fileIconName = FileUtil.getIconNameByFilename(media.filename); + if (fileIconName) { + fileIconName = '-' + fileIconName; + } + fileIcon.classList.add('fa-file' + fileIconName + '-o'); + } + }, + /** + * @see WoltLabSuite/Core/Upload#_success + */ + _success: function (uploadId, data) { + var files = this._fileElements[uploadId]; + for (var i = 0, length = files.length; i < length; i++) { + var file = files[i]; + var internalFileId = elData(file, 'internal-file-id'); + var media = data.returnValues.media[internalFileId]; + if (file.tagName === 'TR') { + if (media) { + // update object id + var objectIdElements = elBySelAll('[data-object-id]', file); + for (var i = 0, length = objectIdElements.length; i < length; i++) { + elData(objectIdElements[i], 'object-id', ~~media.mediaID); + elShow(objectIdElements[i]); + } + elByClass('columnMediaID', file)[0].textContent = media.mediaID; + // update icon + var fileIcon = elByClass('fa-spinner', file)[0]; + this._replaceFileIcon(fileIcon, media, 48); + } + else { + var error = data.returnValues.errors[internalFileId]; + if (!error) { + error = { + errorType: 'uploadFailed', + filename: elData(file, 'filename') + }; + } + var fileIcon = elByClass('fa-spinner', file)[0]; + fileIcon.classList.remove('fa-spinner'); + fileIcon.classList.add('fa-remove'); + fileIcon.classList.add('pointer'); + fileIcon.classList.add('jsTooltip'); + elAttr(fileIcon, 'title', Language.get('wcf.global.button.delete')); + fileIcon.addEventListener('click', function (event) { + elRemove(event.currentTarget.parentNode.parentNode.parentNode); + EventHandler.fire('com.woltlab.wcf.media.upload', 'removedErroneousUploadRow'); + }); + file.classList.add('uploadFailed'); + var p = elBySelAll('.columnFilename .box48 > div > p', file)[1]; + elInnerError(p, Language.get('wcf.media.upload.error.' + error.errorType, { + filename: error.filename + })); + elRemove(p); + } + } + else { + elRemove(DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaInformation'), 'PROGRESS')); + if (media) { + var fileIcon = DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaThumbnail'), 'SPAN'); + this._replaceFileIcon(fileIcon, media, 144); + file.className = 'jsClipboardObject mediaFile'; + elData(file, 'object-id', media.mediaID); + if (this._mediaManager) { + this._mediaManager.setupMediaElement(media, file); + this._mediaManager.addMedia(media, file); + } + } + else { + var error = data.returnValues.errors[internalFileId]; + if (!error) { + error = { + errorType: 'uploadFailed', + filename: elData(file, 'filename') + }; + } + var fileIcon = DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaThumbnail'), 'SPAN'); + fileIcon.classList.remove('fa-spinner'); + fileIcon.classList.add('fa-remove'); + fileIcon.classList.add('pointer'); + file.classList.add('uploadFailed'); + file.classList.add('jsTooltip'); + elAttr(file, 'title', Language.get('wcf.global.button.delete')); + file.addEventListener('click', function () { + elRemove(this); + }); + var title = DomTraverse.childByClass(DomTraverse.childByClass(file, 'mediaInformation'), 'mediaTitle'); + title.innerText = Language.get('wcf.media.upload.error.' + error.errorType, { + filename: error.filename + }); + } + } + DomChangeListener.trigger(); + } + EventHandler.fire('com.woltlab.wcf.media.upload', 'success', { + files: files, + isMultiFileUpload: this._multiFileUploadIds.indexOf(uploadId) !== -1, + media: data.returnValues.media, + upload: this, + uploadId: uploadId + }); + }, + /** + * @see WoltLabSuite/Core/Upload#_uploadFiles + */ + _uploadFiles: function (files, blob) { + return MediaUpload._super.prototype._uploadFiles.call(this, files, blob); + } + }); + return MediaUpload; }); diff --cc wcfsetup/install/files/ts/WoltLabSuite/Core/Media/Upload.js index 99c73b17b4,0000000000..ab31ba09e6 mode 100644,000000..100644 --- a/wcfsetup/install/files/ts/WoltLabSuite/Core/Media/Upload.js +++ b/wcfsetup/install/files/ts/WoltLabSuite/Core/Media/Upload.js @@@ -1,370 -1,0 +1,370 @@@ +/** + * Uploads media files. + * + * @author Matthias Schmidt + * @copyright 2001-2019 WoltLab GmbH + * @license GNU Lesser General Public License + * @module WoltLabSuite/Core/Media/Upload + */ +define( + [ + 'Core', + 'DateUtil', + 'Dom/ChangeListener', + 'Dom/Traverse', + 'Dom/Util', + 'EventHandler', + 'Language', + 'Permission', + 'Upload', + 'User', + 'WoltLabSuite/Core/FileUtil' + ], + function( + Core, + DateUtil, + DomChangeListener, + DomTraverse, + DomUtil, + EventHandler, + Language, + Permission, + Upload, + User, + FileUtil + ) +{ + "use strict"; + + if (!COMPILER_TARGET_DEFAULT) { + var Fake = function() {}; + Fake.prototype = { + _createFileElement: function() {}, + _getParameters: function() {}, + _success: function() {}, + _uploadFiles: function() {}, + _createButton: function() {}, + _createFileElements: function() {}, + _failure: function() {}, + _insertButton: function() {}, + _progress: function() {}, + _removeButton: function() {}, + _upload: function() {} + }; + return Fake; + } + + /** + * @constructor + */ + function MediaUpload(buttonContainerId, targetId, options) { + options = options || {}; + + this._elementTagSize = 144; + if (options.elementTagSize) { + this._elementTagSize = options.elementTagSize; + } + + this._mediaManager = null; + if (options.mediaManager) { + this._mediaManager = options.mediaManager; + delete options.mediaManager; + } + this._categoryId = null; + + Upload.call(this, buttonContainerId, targetId, Core.extend({ + className: 'wcf\\data\\media\\MediaAction', + multiple: this._mediaManager ? true : false, + singleFileRequests: true + }, options)); + } + Core.inherit(MediaUpload, Upload, { + /** + * @see WoltLabSuite/Core/Upload#_createFileElement + */ + _createFileElement: function(file) { + var fileElement; + if (this._target.nodeName === 'OL' || this._target.nodeName === 'UL') { + fileElement = elCreate('li'); + } + else if (this._target.nodeName === 'TBODY') { + var firstTr = elByTag('TR', this._target)[0]; + var tableContainer = this._target.parentNode.parentNode; + if (tableContainer.style.getPropertyValue('display') === 'none') { + fileElement = firstTr; + + tableContainer.style.removeProperty('display'); + + elRemove(elById(elData(this._target, 'no-items-info'))); + } + else { + fileElement = firstTr.cloneNode(true); + + // regenerate id of table row + fileElement.removeAttribute('id'); + DomUtil.identify(fileElement); + } + + var cells = elByTag('TD', fileElement), cell; + for (var i = 0, length = cells.length; i < length; i++) { + cell = cells[i]; + + if (cell.classList.contains('columnMark')) { + elBySelAll('[data-object-id]', cell, elHide); + } + else if (cell.classList.contains('columnIcon')) { + elBySelAll('[data-object-id]', cell, elHide); + + elByClass('mediaEditButton', cell)[0].classList.add('jsMediaEditButton'); + elData(elByClass('jsDeleteButton', cell)[0], 'confirm-message-html', Language.get('wcf.media.delete.confirmMessage', { + title: file.name + })); + } + else if (cell.classList.contains('columnFilename')) { + // replace copied image with spinner + var image = elByTag('IMG', cell); + + if (!image.length) { + image = elByClass('icon48', cell); + } + + var spinner = elCreate('span'); + spinner.className = 'icon icon48 fa-spinner mediaThumbnail'; + + DomUtil.replaceElement(image[0], spinner); + + // replace title and uploading user + var ps = elBySelAll('.box48 > div > p', cell); + ps[0].textContent = file.name; + + var userLink = elByTag('A', ps[1])[0]; + if (!userLink) { + userLink = elCreate('a'); + elByTag('SMALL', ps[1])[0].appendChild(userLink); + } + + userLink.setAttribute('href', User.getLink()); + userLink.textContent = User.username; + } + else if (cell.classList.contains('columnUploadTime')) { + cell.innerHTML = ''; + cell.appendChild(DateUtil.getTimeElement(new Date())); + } + else if (cell.classList.contains('columnDigits')) { + cell.textContent = FileUtil.formatFilesize(file.size); + } + else { + // empty the other cells + cell.innerHTML = ''; + } + } + + DomUtil.prepend(fileElement, this._target); + + return fileElement; + } + else { + fileElement = elCreate('p'); + } + + var thumbnail = elCreate('div'); + thumbnail.className = 'mediaThumbnail'; + fileElement.appendChild(thumbnail); + + var fileIcon = elCreate('span'); + fileIcon.className = 'icon icon144 fa-spinner'; + thumbnail.appendChild(fileIcon); + + var mediaInformation = elCreate('div'); + mediaInformation.className = 'mediaInformation'; + fileElement.appendChild(mediaInformation); + + var p = elCreate('p'); + p.className = 'mediaTitle'; + p.textContent = file.name; + mediaInformation.appendChild(p); + + var progress = elCreate('progress'); + elAttr(progress, 'max', 100); + mediaInformation.appendChild(progress); + + DomUtil.prepend(fileElement, this._target); + + DomChangeListener.trigger(); + + return fileElement; + }, + + /** + * @see WoltLabSuite/Core/Upload#_getParameters + */ + _getParameters: function() { + var parameters = { + elementTagSize: this._elementTagSize + }; + if (this._mediaManager) { + parameters.imagesOnly = this._mediaManager.getOption('imagesOnly'); + + var categoryId = this._mediaManager.getCategoryId(); + if (categoryId) { + parameters.categoryID = categoryId; + } + } + + return Core.extend(MediaUpload._super.prototype._getParameters.call(this), parameters); + }, + + /** + * Replaces the default or copied file icon with the actual file icon. + * + * @param {HTMLElement} fileIcon file icon element + * @param {object} media media data + * @param {integer} size size of the file icon in pixels + */ + _replaceFileIcon: function(fileIcon, media, size) { + if (media.elementTag) { - fileIcon.parentElement.innerHTML = media.elementTag; ++ fileIcon.outerHTML = media.elementTag; + } + else if (media.tinyThumbnailType) { + var img = elCreate('img'); + elAttr(img, 'src', media.tinyThumbnailLink); + elAttr(img, 'alt', ''); + img.style.setProperty('width', size + 'px'); + img.style.setProperty('height', size + 'px'); + + DomUtil.replaceElement(fileIcon, img); + } + else { + fileIcon.classList.remove('fa-spinner'); + + var fileIconName = FileUtil.getIconNameByFilename(media.filename); + if (fileIconName) { + fileIconName = '-' + fileIconName; + } + fileIcon.classList.add('fa-file' + fileIconName + '-o'); + } + }, + + /** + * @see WoltLabSuite/Core/Upload#_success + */ + _success: function(uploadId, data) { + var files = this._fileElements[uploadId]; + + for (var i = 0, length = files.length; i < length; i++) { + var file = files[i]; + var internalFileId = elData(file, 'internal-file-id'); + var media = data.returnValues.media[internalFileId]; + + if (file.tagName === 'TR') { + if (media) { + // update object id + var objectIdElements = elBySelAll('[data-object-id]', file); + for (var i = 0, length = objectIdElements.length; i < length; i++) { + elData(objectIdElements[i], 'object-id', ~~media.mediaID); + elShow(objectIdElements[i]); + } + + elByClass('columnMediaID', file)[0].textContent = media.mediaID; + + // update icon + var fileIcon = elByClass('fa-spinner', file)[0]; + this._replaceFileIcon(fileIcon, media, 48); + } + else { + var error = data.returnValues.errors[internalFileId]; + if (!error) { + error = { + errorType: 'uploadFailed', + filename: elData(file, 'filename') + }; + } + + var fileIcon = elByClass('fa-spinner', file)[0]; + fileIcon.classList.remove('fa-spinner'); + fileIcon.classList.add('fa-remove'); + fileIcon.classList.add('pointer'); + fileIcon.classList.add('jsTooltip'); + elAttr(fileIcon, 'title', Language.get('wcf.global.button.delete')); + fileIcon.addEventListener('click', function (event) { + elRemove(event.currentTarget.parentNode.parentNode.parentNode); + + EventHandler.fire('com.woltlab.wcf.media.upload', 'removedErroneousUploadRow'); + }); + + file.classList.add('uploadFailed'); + + var p = elBySelAll('.columnFilename .box48 > div > p', file)[1]; + + elInnerError(p, Language.get('wcf.media.upload.error.' + error.errorType, { + filename: error.filename + })); + + elRemove(p); + } + } + else { + elRemove(DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaInformation'), 'PROGRESS')); + + if (media) { + var fileIcon = DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaThumbnail'), 'SPAN'); + this._replaceFileIcon(fileIcon, media, 144); + + file.className = 'jsClipboardObject mediaFile'; + elData(file, 'object-id', media.mediaID); + + if (this._mediaManager) { + this._mediaManager.setupMediaElement(media, file); + this._mediaManager.addMedia(media, file); + } + } + else { + var error = data.returnValues.errors[internalFileId]; + if (!error) { + error = { + errorType: 'uploadFailed', + filename: elData(file, 'filename') + }; + } + + var fileIcon = DomTraverse.childByTag(DomTraverse.childByClass(file, 'mediaThumbnail'), 'SPAN'); + fileIcon.classList.remove('fa-spinner'); + fileIcon.classList.add('fa-remove'); + fileIcon.classList.add('pointer'); + + file.classList.add('uploadFailed'); + file.classList.add('jsTooltip'); + elAttr(file, 'title', Language.get('wcf.global.button.delete')); + file.addEventListener('click', function () { + elRemove(this); + }); + + var title = DomTraverse.childByClass(DomTraverse.childByClass(file, 'mediaInformation'), 'mediaTitle'); + title.innerText = Language.get('wcf.media.upload.error.' + error.errorType, { + filename: error.filename + }); + } + } + + DomChangeListener.trigger(); + } + + EventHandler.fire('com.woltlab.wcf.media.upload', 'success', { + files: files, + isMultiFileUpload: this._multiFileUploadIds.indexOf(uploadId) !== -1, + media: data.returnValues.media, + upload: this, + uploadId: uploadId + }); + }, + + /** + * @see WoltLabSuite/Core/Upload#_uploadFiles + */ + _uploadFiles: function(files, blob) { + return MediaUpload._super.prototype._uploadFiles.call(this, files, blob); + } + }); + + return MediaUpload; +});