MDL-78428 tiny_media: Implemented delete embed thumbnail preview
This commit is contained in:
Stevani Andolo
@@ -1,3 +1,3 @@
|
||||
define("tiny_media/embed/embedthumbnailpreview",["exports","../selectors","core/str","../helpers"],(function(_exports,_selectors,_str,_helpers){var obj;function _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.EmbedThumbnailPreview=void 0,_selectors=(obj=_selectors)&&obj.__esModule?obj:{default:obj};_exports.EmbedThumbnailPreview=class{constructor(data){_defineProperty(this,"init",(mediaData=>{this.mediaData=mediaData,this.currentModal.uploadThumbnailModal.setTitle((0,_str.getString)("thumbnail","tiny_media")),(0,_helpers.sourceTypeChecked)({source:this.thumbnail,root:this.thumbnailModalRoot,fileNameSelector:_selectors.default.EMBED.elements.fileNameLabel}),this.setThumbnailSource()})),_defineProperty(this,"setThumbnailSource",(()=>{this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.elements.preview).src=this.thumbnail})),(0,_helpers.setPropertiesFromData)(this,data)}}}));
|
||||
define("tiny_media/embed/embedthumbnailpreview",["exports","../selectors","core/str","../helpers","core/notification"],(function(_exports,_selectors,_str,_helpers,_notification){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.EmbedThumbnailPreview=void 0,_selectors=_interopRequireDefault(_selectors),_notification=_interopRequireDefault(_notification);_exports.EmbedThumbnailPreview=class{constructor(data){_defineProperty(this,"init",(mediaData=>{this.mediaData=mediaData,this.currentModal.uploadThumbnailModal.setTitle((0,_str.getString)("thumbnail","tiny_media")),(0,_helpers.sourceTypeChecked)({source:this.thumbnail,root:this.thumbnailModalRoot,fileNameSelector:_selectors.default.EMBED.elements.fileNameLabel}),this.setThumbnailSource(),this.registerMediaThumbnailEventListeners()})),_defineProperty(this,"setThumbnailSource",(()=>{this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.elements.preview).src=this.thumbnail})),_defineProperty(this,"deleteMedia",(()=>{_notification.default.deleteCancelPromise((0,_str.getString)("deletemediathumbnail","tiny_media"),(0,_str.getString)("deletemediathumbnailwarning","tiny_media")).then((()=>{this.currentModal.uploadThumbnailModal.destroy()})).catch((error=>{window.console.log(error)}))})),_defineProperty(this,"registerMediaThumbnailEventListeners",(()=>{const deleteMedia=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.actions.deleteThumbnail);deleteMedia&&deleteMedia.addEventListener("click",(()=>{this.deleteMedia()}))})),(0,_helpers.setPropertiesFromData)(this,data)}}}));
|
||||
|
||||
//# sourceMappingURL=embedthumbnailpreview.min.js.map
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"file":"embedthumbnailpreview.min.js","sources":["../../src/embed/embedthumbnailpreview.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Tiny media plugin embed thumbnail preview class.\n *\n * This handles:\n * - Embed thumbnail preview.\n * - Delete thumbnail preview.\n * - Update the embed preview details with new thumbnail.\n *\n * @module tiny_media/embed/mediathumbnail\n * @copyright 2024 Stevani Andolo <[email protected]>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport Selectors from '../selectors';\nimport {getString} from 'core/str';\nimport {\n sourceTypeChecked,\n setPropertiesFromData,\n} from '../helpers';\n\nexport class EmbedThumbnailPreview {\n\n constructor(data) {\n setPropertiesFromData(this, data); // Creates dynamic properties based on \"data\" param.\n }\n\n /**\n * Init the media thumbnail preview.\n *\n * @param {object} mediaData Object of selected media data\n */\n init = (mediaData) => {\n this.mediaData = mediaData;\n this.currentModal.uploadThumbnailModal.setTitle(getString('thumbnail', 'tiny_media'));\n sourceTypeChecked({\n source: this.thumbnail,\n root: this.thumbnailModalRoot,\n fileNameSelector: Selectors.EMBED.elements.fileNameLabel,\n });\n this.setThumbnailSource();\n };\n\n /**\n * Sets media thumbnail source.\n */\n setThumbnailSource = () => {\n const preview = this.thumbnailModalRoot.querySelector(Selectors.EMBED.elements.preview);\n preview.src = this.thumbnail;\n };\n}\n"],"names":["constructor","data","mediaData","currentModal","uploadThumbnailModal","setTitle","source","this","thumbnail","root","thumbnailModalRoot","fileNameSelector","Selectors","EMBED","elements","fileNameLabel","setThumbnailSource","querySelector","preview","src"],"mappings":"6fAqCIA,YAAYC,mCASJC,iBACCA,UAAYA,eACZC,aAAaC,qBAAqBC,UAAS,kBAAU,YAAa,8CACrD,CACdC,OAAQC,KAAKC,UACbC,KAAMF,KAAKG,mBACXC,iBAAkBC,mBAAUC,MAAMC,SAASC,qBAE1CC,mEAMY,KACDT,KAAKG,mBAAmBO,cAAcL,mBAAUC,MAAMC,SAASI,SACvEC,IAAMZ,KAAKC,gDAxBGD,KAAMN"}
|
||||
{"version":3,"file":"embedthumbnailpreview.min.js","sources":["../../src/embed/embedthumbnailpreview.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Tiny media plugin embed thumbnail preview class.\n *\n * This handles:\n * - Embed thumbnail preview.\n * - Delete thumbnail preview.\n * - Update the embed preview details with new thumbnail.\n *\n * @module tiny_media/embed/mediathumbnail\n * @copyright 2024 Stevani Andolo <[email protected]>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport Selectors from '../selectors';\nimport {getString} from 'core/str';\nimport {\n sourceTypeChecked,\n setPropertiesFromData,\n} from '../helpers';\nimport Notification from 'core/notification';\n\nexport class EmbedThumbnailPreview {\n\n constructor(data) {\n setPropertiesFromData(this, data); // Creates dynamic properties based on \"data\" param.\n }\n\n /**\n * Init the media thumbnail preview.\n *\n * @param {object} mediaData Object of selected media data\n */\n init = (mediaData) => {\n this.mediaData = mediaData;\n this.currentModal.uploadThumbnailModal.setTitle(getString('thumbnail', 'tiny_media'));\n sourceTypeChecked({\n source: this.thumbnail,\n root: this.thumbnailModalRoot,\n fileNameSelector: Selectors.EMBED.elements.fileNameLabel,\n });\n this.setThumbnailSource();\n this.registerMediaThumbnailEventListeners();\n };\n\n /**\n * Sets media thumbnail source.\n */\n setThumbnailSource = () => {\n const preview = this.thumbnailModalRoot.querySelector(Selectors.EMBED.elements.preview);\n preview.src = this.thumbnail;\n };\n\n /**\n * Deletes the media after confirming with the user and loads the insert media page.\n */\n deleteMedia = () => {\n Notification.deleteCancelPromise(\n getString('deletemediathumbnail', 'tiny_media'),\n getString('deletemediathumbnailwarning', 'tiny_media'),\n ).then(() => {\n this.currentModal.uploadThumbnailModal.destroy();\n return;\n }).catch(error => {\n window.console.log(error);\n });\n };\n\n /**\n * Only registers event listeners for new loaded elements in mediaThumbnail.\n */\n registerMediaThumbnailEventListeners = () => {\n const deleteMedia = this.thumbnailModalRoot.querySelector(Selectors.EMBED.actions.deleteThumbnail);\n if (deleteMedia) {\n deleteMedia.addEventListener('click', () => {\n this.deleteMedia();\n });\n }\n };\n}\n"],"names":["constructor","data","mediaData","currentModal","uploadThumbnailModal","setTitle","source","this","thumbnail","root","thumbnailModalRoot","fileNameSelector","Selectors","EMBED","elements","fileNameLabel","setThumbnailSource","registerMediaThumbnailEventListeners","querySelector","preview","src","deleteCancelPromise","then","destroy","catch","error","window","console","log","deleteMedia","actions","deleteThumbnail","addEventListener"],"mappings":"6oBAsCIA,YAAYC,mCASJC,iBACCA,UAAYA,eACZC,aAAaC,qBAAqBC,UAAS,kBAAU,YAAa,8CACrD,CACdC,OAAQC,KAAKC,UACbC,KAAMF,KAAKG,mBACXC,iBAAkBC,mBAAUC,MAAMC,SAASC,qBAE1CC,0BACAC,qFAMY,KACDV,KAAKG,mBAAmBQ,cAAcN,mBAAUC,MAAMC,SAASK,SACvEC,IAAMb,KAAKC,iDAMT,2BACGa,qBACT,kBAAU,uBAAwB,eAClC,kBAAU,8BAA+B,eAC3CC,MAAK,UACEnB,aAAaC,qBAAqBmB,aAExCC,OAAMC,QACLC,OAAOC,QAAQC,IAAIH,0EAOY,WAC7BI,YAActB,KAAKG,mBAAmBQ,cAAcN,mBAAUC,MAAMiB,QAAQC,iBAC9EF,aACAA,YAAYG,iBAAiB,SAAS,UAC7BH,uDAlDStB,KAAMN"}
|
||||
@@ -1,3 +1,3 @@
|
||||
define("tiny_media/selectors",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0;return _exports.default={IMAGE:{actions:{submit:".tiny_image_urlentrysubmit",imageBrowser:".openimagebrowser",addUrl:".tiny_image_addurl",deleteImage:".tiny_image_deleteicon"},elements:{form:"form.tiny_image_form",alignSettings:".tiny_image_button",alt:".tiny_image_altentry",altWarning:".tiny_image_altwarning",height:".tiny_image_heightentry",width:".tiny_image_widthentry",url:".tiny_image_urlentry",urlWarning:".tiny_image_urlwarning",size:".tiny_image_size",presentation:".tiny_image_presentation",constrain:".tiny_image_constrain",customStyle:".tiny_image_customstyle",preview:".tiny_image_preview",previewBox:".tiny_image_preview_box",loaderIcon:".tiny_image_loader",loaderIconContainer:".tiny_image_loader_container",insertImage:".tiny_image_insert_image",modalFooter:".modal-footer",dropzoneContainer:".tiny_image_dropzone_container",fileInput:"#tiny_image_fileinput",fileNameLabel:".tiny_image_filename",sizeOriginal:".tiny_image_sizeoriginal",sizeCustom:".tiny_image_sizecustom",properties:".tiny_image_properties"},styles:{responsive:"img-fluid"}},EMBED:{actions:{mediaBrowser:".openmediabrowser",addUrl:".tiny_media_add_url",deleteMedia:".tiny_media_delete_icon",showSubtitleCaption:'[data-action="show-subtitle-caption"]',backToMediaDetails:'[data-action="back-to-media-details"]',uploadCustomThumbnail:".upload-custom-thumbnail"},elements:{source:".tiny_media_source",track:".tiny_media_track",posterSource:".tiny_media_poster_source",title:".tiny_media_title_entry",url:".tiny_media_source_url_entry",width:".tiny_media_width_entry",height:".tiny_media_height_entry",trackSource:".tiny_media_track_source",trackLabel:".tiny_media_track_label_entry",trackLang:".tiny_media_track_lang_entry",trackDefault:".tiny_media_track_default",mediaControl:".tiny_media_controls",mediaAutoplay:".tiny_media_autoplay",mediaMute:".tiny_media_mute",mediaLoop:".tiny_media_loop",bodyTemplate:".tiny_media_body_template",footerTemplate:".tiny_media_footer_template",dropzoneContainer:".tiny_media_dropzone_container",fromUrl:".tiny_media_from_url_entry",urlWarning:".tiny_media_url_warning",loaderIcon:".tiny_media_loader",loaderIconContainer:".tiny_media_loader_container",insertMedia:".tiny_media_insert_media",modalFooter:".modal-footer",fileNameLabel:".tiny_media_filename",preview:".tiny_media_preview",previewBox:".tiny_media_preview_box",previewClass:".tiny_media_preview_tag",videoTag:"#video-tag",audioTag:"#audio-tag",sizeOriginal:".tiny_media_sizeoriginal",sizeCustom:".tiny_media_sizecustom",properties:".tiny_media_properties",mediaDetailsBody:"#tiny-media-details-body",mediaDetailsFooter:"#media-details-footer",mediaSubtitleCaptionFooter:"#media-subtitle-caption-footer",mediaSubtitleCaptionBody:"#tiny-media-subtitle-caption-body",mediaMetadataTabPane:".tab-pane-media-metadata"},template:{body:{insertMediaBody:"tiny_media/embed/body/insert_media_body",mediaDetailsBody:"tiny_media/embed/body/media_details_body",mediaThumbnailBody:"tiny_media/embed/body/media_thumbnail_body"},footer:{insertMediaFooter:"tiny_media/embed/footer/insert_media_footer",mediaDetailsFooter:"tiny_media/embed/footer/media_details_footer",mediaThumbnailFooter:"tiny_media/embed/footer/media_thumbnail_footer"}},mediaSites:{youtube:"www.youtube.com"},mediaTypes:["audio","video","link"]},MEDIA_MIME_TYPES:{aac:"audio",avi:"video",midi:"audio",mid:"audio",mp3:"audio",mp4:"video",xmpeg3:"audio",mpeg3:"audio",xmpeg:"video",mpeg:"video",oga:"audio",ogg:"audio",ogv:"video",opus:"audio",ts:"video",wav:"audio",weba:"audio",webm:"video","3gp":"video","3g2":"video"}},_exports.default}));
|
||||
define("tiny_media/selectors",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0;return _exports.default={IMAGE:{actions:{submit:".tiny_image_urlentrysubmit",imageBrowser:".openimagebrowser",addUrl:".tiny_image_addurl",deleteImage:".tiny_image_deleteicon"},elements:{form:"form.tiny_image_form",alignSettings:".tiny_image_button",alt:".tiny_image_altentry",altWarning:".tiny_image_altwarning",height:".tiny_image_heightentry",width:".tiny_image_widthentry",url:".tiny_image_urlentry",urlWarning:".tiny_image_urlwarning",size:".tiny_image_size",presentation:".tiny_image_presentation",constrain:".tiny_image_constrain",customStyle:".tiny_image_customstyle",preview:".tiny_image_preview",previewBox:".tiny_image_preview_box",loaderIcon:".tiny_image_loader",loaderIconContainer:".tiny_image_loader_container",insertImage:".tiny_image_insert_image",modalFooter:".modal-footer",dropzoneContainer:".tiny_image_dropzone_container",fileInput:"#tiny_image_fileinput",fileNameLabel:".tiny_image_filename",sizeOriginal:".tiny_image_sizeoriginal",sizeCustom:".tiny_image_sizecustom",properties:".tiny_image_properties"},styles:{responsive:"img-fluid"}},EMBED:{actions:{mediaBrowser:".openmediabrowser",addUrl:".tiny_media_add_url",deleteMedia:".tiny_media_delete_icon",showSubtitleCaption:'[data-action="show-subtitle-caption"]',backToMediaDetails:'[data-action="back-to-media-details"]',uploadCustomThumbnail:".upload-custom-thumbnail",deleteThumbnail:".delete_tiny_thumbnail"},elements:{source:".tiny_media_source",track:".tiny_media_track",posterSource:".tiny_media_poster_source",title:".tiny_media_title_entry",url:".tiny_media_source_url_entry",width:".tiny_media_width_entry",height:".tiny_media_height_entry",trackSource:".tiny_media_track_source",trackLabel:".tiny_media_track_label_entry",trackLang:".tiny_media_track_lang_entry",trackDefault:".tiny_media_track_default",mediaControl:".tiny_media_controls",mediaAutoplay:".tiny_media_autoplay",mediaMute:".tiny_media_mute",mediaLoop:".tiny_media_loop",bodyTemplate:".tiny_media_body_template",footerTemplate:".tiny_media_footer_template",dropzoneContainer:".tiny_media_dropzone_container",fromUrl:".tiny_media_from_url_entry",urlWarning:".tiny_media_url_warning",loaderIcon:".tiny_media_loader",loaderIconContainer:".tiny_media_loader_container",insertMedia:".tiny_media_insert_media",modalFooter:".modal-footer",fileNameLabel:".tiny_media_filename",preview:".tiny_media_preview",previewBox:".tiny_media_preview_box",previewClass:".tiny_media_preview_tag",videoTag:"#video-tag",audioTag:"#audio-tag",sizeOriginal:".tiny_media_sizeoriginal",sizeCustom:".tiny_media_sizecustom",properties:".tiny_media_properties",mediaDetailsBody:"#tiny-media-details-body",mediaDetailsFooter:"#media-details-footer",mediaSubtitleCaptionFooter:"#media-subtitle-caption-footer",mediaSubtitleCaptionBody:"#tiny-media-subtitle-caption-body",mediaMetadataTabPane:".tab-pane-media-metadata"},template:{body:{insertMediaBody:"tiny_media/embed/body/insert_media_body",mediaDetailsBody:"tiny_media/embed/body/media_details_body",mediaThumbnailBody:"tiny_media/embed/body/media_thumbnail_body"},footer:{insertMediaFooter:"tiny_media/embed/footer/insert_media_footer",mediaDetailsFooter:"tiny_media/embed/footer/media_details_footer",mediaThumbnailFooter:"tiny_media/embed/footer/media_thumbnail_footer"}},mediaSites:{youtube:"www.youtube.com"},mediaTypes:["audio","video","link"]},MEDIA_MIME_TYPES:{aac:"audio",avi:"video",midi:"audio",mid:"audio",mp3:"audio",mp4:"video",xmpeg3:"audio",mpeg3:"audio",xmpeg:"video",mpeg:"video",oga:"audio",ogg:"audio",ogv:"video",opus:"audio",ts:"video",wav:"audio",weba:"audio",webm:"video","3gp":"video","3g2":"video"}},_exports.default}));
|
||||
|
||||
//# sourceMappingURL=selectors.min.js.map
|
||||
File diff suppressed because one or more lines are too long
@@ -32,6 +32,7 @@ import {
|
||||
sourceTypeChecked,
|
||||
setPropertiesFromData,
|
||||
} from '../helpers';
|
||||
import Notification from 'core/notification';
|
||||
|
||||
export class EmbedThumbnailPreview {
|
||||
|
||||
@@ -53,6 +54,7 @@ export class EmbedThumbnailPreview {
|
||||
fileNameSelector: Selectors.EMBED.elements.fileNameLabel,
|
||||
});
|
||||
this.setThumbnailSource();
|
||||
this.registerMediaThumbnailEventListeners();
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -62,4 +64,31 @@ export class EmbedThumbnailPreview {
|
||||
const preview = this.thumbnailModalRoot.querySelector(Selectors.EMBED.elements.preview);
|
||||
preview.src = this.thumbnail;
|
||||
};
|
||||
|
||||
/**
|
||||
* Deletes the media after confirming with the user and loads the insert media page.
|
||||
*/
|
||||
deleteMedia = () => {
|
||||
Notification.deleteCancelPromise(
|
||||
getString('deletemediathumbnail', 'tiny_media'),
|
||||
getString('deletemediathumbnailwarning', 'tiny_media'),
|
||||
).then(() => {
|
||||
this.currentModal.uploadThumbnailModal.destroy();
|
||||
return;
|
||||
}).catch(error => {
|
||||
window.console.log(error);
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Only registers event listeners for new loaded elements in mediaThumbnail.
|
||||
*/
|
||||
registerMediaThumbnailEventListeners = () => {
|
||||
const deleteMedia = this.thumbnailModalRoot.querySelector(Selectors.EMBED.actions.deleteThumbnail);
|
||||
if (deleteMedia) {
|
||||
deleteMedia.addEventListener('click', () => {
|
||||
this.deleteMedia();
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@@ -67,6 +67,7 @@ export default {
|
||||
showSubtitleCaption: '[data-action="show-subtitle-caption"]',
|
||||
backToMediaDetails: '[data-action="back-to-media-details"]',
|
||||
uploadCustomThumbnail: '.upload-custom-thumbnail',
|
||||
deleteThumbnail: '.delete_tiny_thumbnail',
|
||||
},
|
||||
elements: {
|
||||
source: '.tiny_media_source',
|
||||
|
||||
@@ -49,6 +49,8 @@ $string['default'] = 'Default';
|
||||
$string['deleteimage'] = 'Delete image';
|
||||
$string['deleteimagewarning'] = 'Are you sure you want to remove the image?';
|
||||
$string['deletemedia'] = 'Delete media';
|
||||
$string['deletemediathumbnail'] = 'Delete media thumbnail';
|
||||
$string['deletemediathumbnailwarning'] = 'Are you sure you want to remove the media thumbnail?';
|
||||
$string['deletemediawarning'] = 'Are you sure you want to remove the media?';
|
||||
$string['deleteselected'] = 'Delete selected files';
|
||||
$string['descriptions_help'] = 'Audio descriptions may be used to provide a narration which explains visual details not apparent from the audio alone.';
|
||||
|
||||
Reference in New Issue
Block a user