Current Path : C:/xampp/htdocs/moodle/mod/hvp/editor/scripts/ |
Current File : C:/xampp/htdocs/moodle/mod/hvp/editor/scripts/h5peditor-file.js |
/* global ns */ /** * Adds a file upload field to the form. * * @param {mixed} parent * @param {object} field * @param {mixed} params * @param {function} setValue * @returns {ns.File} */ ns.File = function (parent, field, params, setValue) { var self = this; // Initialize inheritance ns.FileUploader.call(self, field); this.parent = parent; this.field = field; this.params = params; this.setValue = setValue; this.library = parent.library + '/' + field.name; this.id = ns.getNextFieldId(field); if (params !== undefined) { this.copyright = params.copyright; } this.changes = []; this.passReadies = true; parent.ready(function () { self.passReadies = false; }); // Create remove file dialog this.confirmRemovalDialog = new H5P.ConfirmationDialog({ headerText: H5PEditor.t('core', 'removeFile'), dialogText: H5PEditor.t('core', 'confirmRemoval', {':type': 'file'}) }).appendTo(document.body); // Remove file on confirmation this.confirmRemovalDialog.on('confirmed', function () { delete self.params; self.setValue(self.field); self.addFile(); for (var i = 0; i < self.changes.length; i++) { self.changes[i](); } }); // When uploading starts self.on('upload', function () { // Insert throbber self.$file.html('<div class="h5peditor-uploading h5p-throbber">' + ns.t('core', 'uploading') + '</div>'); // Clear old error messages self.$errors.html(''); }); // Monitor upload progress self.on('uploadProgress', function (e) { self.$file.children().html(ns.t('core', 'uploading') + ' ' + Math.round(e.data * 100) + ' %'); }); // Handle upload complete self.on('uploadComplete', function (event) { var result = event.data; try { if (result.error) { throw result.error; } self.params = self.params || {}; self.params.path = result.data.path; self.params.mime = result.data.mime; self.params.copyright = self.copyright; // Make it possible for other widgets to process the result self.trigger('fileUploaded', result.data); self.setValue(self.field, self.params); for (var i = 0; i < self.changes.length; i++) { self.changes[i](self.params); } } catch (error) { self.$errors.append(ns.createError(error)); } self.addFile(); }); }; ns.File.prototype = Object.create(ns.FileUploader.prototype); ns.File.prototype.constructor = ns.File; /** * Append field to the given wrapper. * * @param {jQuery} $wrapper * @returns {undefined} */ ns.File.prototype.appendTo = function ($wrapper) { var self = this; var fileHtml = '<div class="file"></div>' + '<a class="h5p-copyright-button" href="#">' + ns.t('core', 'editCopyright') + '</a>' + '<div class="h5p-editor-dialog">' + '<a href="#" class="h5p-close" title="' + ns.t('core', 'close') + '"></a>' + '</div>'; var html = ns.createFieldMarkup(this.field, fileHtml, this.id); var $container = ns.$(html).appendTo($wrapper); this.$copyrightButton = $container.find('.h5p-copyright-button'); this.$file = $container.find('.file'); this.$errors = $container.find('.h5p-errors'); this.addFile(); var $dialog = $container.find('.h5p-editor-dialog'); $container.find('.h5p-copyright-button').add($dialog.find('.h5p-close')).click(function () { $dialog.toggleClass('h5p-open'); return false; }); ns.File.addCopyright(self, $dialog, function (field, value) { if (self.params !== undefined) { self.params.copyright = value; } self.copyright = value; }); }; /** * Help add copyright dialog to the given field * * @param {Object} field * @param {function} setCopyright */ ns.File.addCopyright = function (field, $dialog, setCopyright) { /** * Help find object in list with the given property value. * * @param {Object[]} list of objects to search through * @param {string} property to look for * @param {string} value to match property value against */ var find = function (list, property, value) { var properties = property.split('.'); for (var i = 0; i < list.length; i++) { var objProp = list[i]; for (var j = 0; j < properties.length; j++) { objProp = objProp[properties[j]]; } if (objProp === value) { return list[i]; } } }; // Re-map old licenses that have been moved if (field.copyright) { if (field.copyright.license === 'ODC PDDL') { field.copyright.license = 'PD'; field.copyright.version = 'CC0 1.0'; } else if (field.copyright.license === 'CC PDM') { field.copyright.license = 'PD'; field.copyright.version = 'CC PDM'; } } var group = new H5PEditor.widgets.group(field, H5PEditor.copyrightSemantics, field.copyright, setCopyright); // TODO: We'll have to do something here with metadataSemantics if we change the widgtets group.appendTo($dialog); group.expand(); group.$group.find('.title').remove(); field.children = [group]; // Locate license and version selectors var licenseField = find(group.children, 'field.name', 'license'); var versionField = find(group.children, 'field.name', 'version'); versionField.field.optional = true; // Avoid any error messages // Listen for changes to license licenseField.changes.push(function (value) { // Find versions for selected value var option = find(licenseField.field.options, 'value', value); var versions = option.versions; versionField.$select.prop('disabled', versions === undefined); if (versions === undefined) { // If no versions add default versions = [{ value: '-', label: '-' }]; } // Find default selected version var selected = (field.copyright.license === value && field.copyright.version ? field.copyright.version : versions[0].value); // Update versions selector versionField.$select.html(H5PEditor.Select.createOptionsHtml(versions, selected)).change(); }); // Trigger update straight away licenseField.changes[licenseField.changes.length - 1](field.copyright.license); }; /** * Creates thumbnail HTML and actions. * * @returns {Boolean} */ ns.File.prototype.addFile = function () { var that = this; if (this.params === undefined) { let html = '<a href="#" id="' + this.id + '" class="add"'; if (this.field.description !== undefined) { html += ' aria-describedby="' + ns.getDescriptionId(this.id) + '"'; } html += ' title="' + ns.t('core', 'addFile') + '">' + '<div class="h5peditor-field-file-upload-text">' + ns.t('core', 'add') + '</div>' + '</a>' this.$file.html(html).children('.add').click(function () { that.openFileSelector(); return false; }); this.$copyrightButton.addClass('hidden'); return; } var thumbnail; if (this.field.type === 'image') { thumbnail = {}; thumbnail.path = H5P.getPath(this.params.path, H5PEditor.contentId); thumbnail.height = 100; if (this.params.width !== undefined) { thumbnail.width = thumbnail.height * (this.params.width / this.params.height); } } else { thumbnail = ns.fileIcon; } var fileHtmlString = '<a href="#" id="' + this.id + '" title="' + ns.t('core', 'changeFile') + '" class="thumbnail"'; if (this.field.description !== undefined) { fileHtmlString += ' aria-describedby="' + ns.getDescriptionId(this.id) + '"'; } fileHtmlString += '><img ' + (thumbnail.width === undefined ? '' : ' width="' + thumbnail.width + '"') + 'height="' + thumbnail.height + '" '+ 'alt="' + (this.field.label === undefined ? '' : this.field.label) + '"/></a>' + '<a href="#" class="remove" title="' + ns.t('core', 'removeFile') + '"></a>'; this.$file.html(fileHtmlString).children(':eq(0)').click(function () { that.openFileSelector(); return false; }).children('img').attr('src', thumbnail.path).end().next().click(function () { that.confirmRemovalDialog.show(H5P.jQuery(this).offset().top); return false; }); that.$copyrightButton.removeClass('hidden'); }; /** * Validate this item */ ns.File.prototype.validate = function () { return true; }; /** * Remove this item. */ ns.File.prototype.remove = function () { // TODO: Check what happens when removed during upload. this.$file.parent().remove(); }; /** * Collect functions to execute once the tree is complete. * * @param {function} ready * @returns {undefined} */ ns.File.prototype.ready = function (ready) { if (this.passReadies) { this.parent.ready(ready); } else { ready(); } }; // Tell the editor what widget we are. ns.widgets.file = ns.File;