MDL-82943 editor_tiny: Embed styling uplift
This commit is contained in:
Stevani Andolo
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
-1
@@ -1,3 +1,3 @@
|
||||
define("tiny_media/embed/embedthumbnailpreview",["exports","../selectors","core/str","../helpers","core/notification","./embedpreview","./embedhelpers","./embedhandler","../common"],(function(_exports,_selectors,_str,_helpers,_notification,_embedpreview,_embedhelpers,_embedhandler,_common){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",_common.component)),(0,_helpers.sourceTypeChecked)({source:this.media.poster,root:this.thumbnailModalRoot,fileNameSelector:_selectors.default.EMBED.elements.fileNameLabel}),this.setThumbnailSource(),this.registerMediaThumbnailEventListeners()})),_defineProperty(this,"setThumbnailSource",(()=>{const thumbnailPreview=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.elements.thumbnailPreview);thumbnailPreview.src=this.media.poster,thumbnailPreview.addEventListener("error",(async()=>{this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.elements.urlWarning).innerHTML=await(0,_str.getString)("imageurlrequired",_common.component),(0,_helpers.showElements)(_selectors.default.EMBED.elements.urlWarning,this.thumbnailModalRoot),(0,_helpers.stopMediaLoading)(this.thumbnailModalRoot,_selectors.default.EMBED.type),new _embedhandler.EmbedHandler(this).resetUploadForm(!1)})),thumbnailPreview.addEventListener("load",(()=>{this.mediaData.media.poster=this.media.poster,this.media=this.mediaData.media,(0,_helpers.stopMediaLoading)(this.thumbnailModalRoot,_selectors.default.EMBED.type)}))})),_defineProperty(this,"deleteMedia",(()=>{_notification.default.deleteCancelPromise((0,_str.getString)("deletemediathumbnail",_common.component),(0,_str.getString)("deletemediathumbnailwarning",_common.component)).then((()=>{new _embedhandler.EmbedHandler(this).resetUploadForm(!1)})).catch((error=>{window.console.log(error)}))})),_defineProperty(this,"loadPreviewMediaThumbnail",(async()=>{new _embedhandler.EmbedHandler(this).loadMediaDetails(new _embedpreview.EmbedPreview(this),await(0,_embedhelpers.mediaDetailsTemplateContext)(this)).then((()=>{this.currentModal.uploadThumbnailModal.destroy();const currentModal=this.currentModal.insertMediaModal;this.currentModal=currentModal.insertMediaModal,delete this.mediaData})).catch((error=>{window.console.log(error)}))})),_defineProperty(this,"registerMediaThumbnailEventListeners",(()=>{const deleteMedia=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.actions.deleteThumbnail);deleteMedia&&deleteMedia.addEventListener("click",(e=>{e.preventDefault(),this.deleteMedia()}));const setPoster=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.actions.setPoster);setPoster&&setPoster.addEventListener("click",(()=>{this.loadPreviewMediaThumbnail()}))})),(0,_helpers.setPropertiesFromData)(this,data)}}}));
|
||||
define("tiny_media/embed/embedthumbnailpreview",["exports","../selectors","core/str","../helpers","core/notification","./embedpreview","./embedhelpers","./embedhandler","../common"],(function(_exports,_selectors,_str,_helpers,_notification,_embedpreview,_embedhelpers,_embedhandler,_common){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",_common.component)),(0,_helpers.sourceTypeChecked)({source:this.media.poster,root:this.thumbnailModalRoot,fileNameSelector:_selectors.default.EMBED.elements.fileNameLabel}),this.setThumbnailSource(),this.registerMediaThumbnailEventListeners()})),_defineProperty(this,"setThumbnailSource",(()=>{const thumbnailPreview=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.elements.thumbnailPreview);thumbnailPreview.src=this.media.poster,thumbnailPreview.addEventListener("error",(async()=>{this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.elements.urlWarning).innerHTML=await(0,_str.getString)("imageurlrequired",_common.component),(0,_helpers.showElements)(_selectors.default.EMBED.elements.urlWarning,this.thumbnailModalRoot),(0,_helpers.stopMediaLoading)(this.thumbnailModalRoot,_selectors.default.EMBED.type),new _embedhandler.EmbedHandler(this).resetUploadForm(!1)})),thumbnailPreview.addEventListener("load",(()=>{this.mediaData.media.poster=this.media.poster,this.media=this.mediaData.media,(0,_helpers.stopMediaLoading)(this.thumbnailModalRoot,_selectors.default.EMBED.type)}))})),_defineProperty(this,"deleteMedia",(()=>{_notification.default.deleteCancelPromise((0,_str.getString)("deletemediathumbnail",_common.component),(0,_str.getString)("deletemediathumbnailwarning",_common.component)).then((()=>{new _embedhandler.EmbedHandler(this).resetUploadForm(!1)})).catch((()=>{}))})),_defineProperty(this,"loadPreviewMediaThumbnail",(async()=>{new _embedhandler.EmbedHandler(this).loadMediaDetails(new _embedpreview.EmbedPreview(this),await(0,_embedhelpers.mediaDetailsTemplateContext)(this)).then((()=>{this.currentModal.uploadThumbnailModal.destroy();const currentModal=this.currentModal.insertMediaModal;this.currentModal=currentModal.insertMediaModal,delete this.mediaData})).catch((error=>{window.console.log(error)}))})),_defineProperty(this,"registerMediaThumbnailEventListeners",(()=>{const deleteMedia=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.actions.deleteThumbnail);deleteMedia&&deleteMedia.addEventListener("click",(e=>{e.preventDefault(),this.deleteMedia()}));const setPoster=this.thumbnailModalRoot.querySelector(_selectors.default.EMBED.actions.setPoster);setPoster&&setPoster.addEventListener("click",(()=>{this.loadPreviewMediaThumbnail()}))})),(0,_helpers.setPropertiesFromData)(this,data)}}}));
|
||||
|
||||
//# sourceMappingURL=embedthumbnailpreview.min.js.map
|
||||
+1
-1
File diff suppressed because one or more lines are too long
@@ -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",originalSizeToggle:".image-original-size-toggle",customSizeToggle:".image-custom-size-toggle",properties:".tiny_image_properties",bodyTemplate:".tiny_image_body_template",footerTemplate:".tiny_image_footer_template"},styles:{responsive:"img-fluid"},template:{body:{insertImageBody:"tiny_media/image/body/insert_image_modal_insert_body",insertImageDetailsBody:"tiny_media/image/body/insert_image_modal_details_body"},footer:{insertImageFooter:"tiny_media/image/footer/insert_image_modal_insert_footer",insertImageDetailsFooter:"tiny_media/image/footer/insert_image_modal_details_footer"}},type:"IMAGE"},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",deleteCustomThumbnail:".delete-custom-thumbnail",deleteThumbnail:".delete_tiny_thumbnail",setPoster:'[data-action="set-poster"]',mediaLinkAsAudio:".link_as_audio",mediaLinkAsVideo:".link_as_video",cancelMediaDetails:'[data-action="cancel"]'},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",previewBox:".tiny_media_preview_box",sizeOriginal:".tiny_media_sizeoriginal",sizeCustom:".tiny_media_sizecustom",properties:".tiny_media_properties",mediaDetailsBody:"#tiny-media-details-body",mediaSubtitleCaptionBody:"#tiny-media-subtitle-caption-body",mediaMetadataTabPane:".tab-pane-media-metadata",videoThumbnail:".video-thumbnail",mediaSizeProperties:".media-size-properties",thumbnailPreview:".tiny_media_thumbnail_preview",mediaPreviewContainer:"#media-filter-preview-container"},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"}},type:"EMBED",externalMediaProvider:"external-media-provider"}},_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",originalSizeToggle:".image-original-size-toggle",customSizeToggle:".image-custom-size-toggle",properties:".tiny_image_properties",bodyTemplate:".tiny_image_body_template",footerTemplate:".tiny_image_footer_template"},styles:{responsive:"img-fluid"},template:{body:{insertImageBody:"tiny_media/image/body/insert_image_modal_insert_body",insertImageDetailsBody:"tiny_media/image/body/insert_image_modal_details_body"},footer:{insertImageFooter:"tiny_media/image/footer/insert_image_modal_insert_footer",insertImageDetailsFooter:"tiny_media/image/footer/insert_image_modal_details_footer"}},type:"IMAGE"},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",deleteCustomThumbnail:".delete-custom-thumbnail",deleteThumbnail:".delete_tiny_thumbnail",setPoster:'[data-action="set-poster"]',mediaLinkAsAudio:".link_as_audio",mediaLinkAsVideo:".link_as_video",cancelMediaDetails:'[data-action="cancel"]'},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",previewBox:".tiny_media_preview_box",originalSizeToggle:".media-original-size-toggle",customSizeToggle:".media-custom-size-toggle",properties:".tiny_media_properties",mediaDetailsBody:"#tiny-media-details-body",mediaSubtitleCaptionBody:"#tiny-media-subtitle-caption-body",mediaMetadataTabPane:".tab-pane-media-metadata",videoThumbnail:".video-thumbnail",mediaSizeProperties:".media-size-properties",thumbnailPreview:".tiny_media_thumbnail_preview",mediaPreviewContainer:"#media-filter-preview-container"},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"}},type:"EMBED",externalMediaProvider:"external-media-provider"}},_exports.default}));
|
||||
|
||||
//# sourceMappingURL=selectors.min.js.map
|
||||
File diff suppressed because one or more lines are too long
@@ -275,17 +275,19 @@ export class EmbedPreview extends MediaBase {
|
||||
*/
|
||||
registerMediaDetailsEventListeners = async() => {
|
||||
// Handle the original size when selected.
|
||||
const sizeOriginalEle = this.root.querySelector(Selectors.EMBED.elements.sizeOriginal);
|
||||
if (sizeOriginalEle) {
|
||||
sizeOriginalEle.addEventListener('change', () => {
|
||||
const originalSize = this.root.querySelector(Selectors.EMBED.elements.originalSizeToggle);
|
||||
if (originalSize) {
|
||||
originalSize.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
this.sizeChecked('original');
|
||||
});
|
||||
}
|
||||
|
||||
// Handle the custom size when selected.
|
||||
const sizeCustomEle = this.root.querySelector(Selectors.EMBED.elements.sizeCustom);
|
||||
if (sizeCustomEle) {
|
||||
sizeCustomEle.addEventListener('change', () => {
|
||||
const customSize = this.root.querySelector(Selectors.EMBED.elements.customSizeToggle);
|
||||
if (customSize) {
|
||||
customSize.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
this.sizeChecked('custom');
|
||||
});
|
||||
}
|
||||
|
||||
@@ -100,8 +100,9 @@ export class EmbedThumbnailPreview {
|
||||
).then(() => {
|
||||
(new EmbedHandler(this)).resetUploadForm(false);
|
||||
return;
|
||||
}).catch(error => {
|
||||
window.console.log(error);
|
||||
}).catch(() => {
|
||||
// User cancelled the delete action.
|
||||
return;
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
@@ -114,8 +114,8 @@ export default {
|
||||
modalFooter: '.modal-footer',
|
||||
fileNameLabel: '.tiny_media_filename',
|
||||
previewBox: '.tiny_media_preview_box',
|
||||
sizeOriginal: '.tiny_media_sizeoriginal',
|
||||
sizeCustom: '.tiny_media_sizecustom',
|
||||
originalSizeToggle: '.media-original-size-toggle',
|
||||
customSizeToggle: '.media-custom-size-toggle',
|
||||
properties: '.tiny_media_properties',
|
||||
mediaDetailsBody: '#tiny-media-details-body',
|
||||
mediaSubtitleCaptionBody: '#tiny-media-subtitle-caption-body',
|
||||
|
||||
@@ -94,6 +94,8 @@ $string['mediamanagerbuttontitle'] = 'Media manager';
|
||||
$string['mediamanagerproperties'] = 'Media manager';
|
||||
$string['medianotavailable'] = 'Media is not available';
|
||||
$string['medianotavailabledesc'] = 'Error loading the following media url: {$a}';
|
||||
$string['mediasize'] = 'Media size';
|
||||
$string['mediatitle'] = 'Title';
|
||||
$string['mediaurlrequired'] = 'An audio/video must have a valid URL.';
|
||||
$string['metadata'] = 'Metadata';
|
||||
$string['metadata_help'] = 'Metadata tracks, for use from a script, may be used only if the player supports metadata.';
|
||||
@@ -105,6 +107,7 @@ $string['next'] = 'Next';
|
||||
$string['nofilepicker'] = 'Paste a link to an audio/video file in the field below or<br>click the Browse Repositories button.';
|
||||
$string['nofilepickerrepository'] = 'Paste an {$a} link in the field below.';
|
||||
$string['onlymediafiles'] = 'Accepts only media files';
|
||||
$string['playbacksettings'] = 'Playback settings';
|
||||
$string['pluginname'] = 'Insert media';
|
||||
$string['presentation'] = 'Decorative image';
|
||||
$string['presentationoraltrequired'] = 'An image must have a description, unless it is marked as decorative only.';
|
||||
|
||||
@@ -97,10 +97,6 @@ iframe.mm_iframe {
|
||||
}
|
||||
}
|
||||
|
||||
.subtitle-caption {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.upload-custom-thumbnail,
|
||||
.delete-custom-thumbnail {
|
||||
width: 100%;
|
||||
|
||||
+114
-100
@@ -43,24 +43,17 @@
|
||||
<div id="tiny-media-details-body" class="d-none">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-7 p-0">
|
||||
<div class="tiny_media_preview_box border rounded">
|
||||
<button class="btn btn-secondary rounded-circle tiny_media_delete_icon" tabindex="0" title="{{#str}} deletemedia, tiny_media {{/str}}">
|
||||
<i class="fa fa-trash-o"></i>
|
||||
</button>
|
||||
<div id="media-filter-preview-container" class="w-100 text-center"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tiny_media_properties_col col-lg-5 tiny_media_source tiny_media_poster_source">
|
||||
<div class="mb-2">
|
||||
<div>
|
||||
<label for="{{elementid}}_tiny_media_title_entry">{{#str}} entertitle, tiny_media {{/str}}</label>
|
||||
<div class="input-group-append">
|
||||
<label class="fw-bold" for="{{elementid}}_tiny_media_title_entry">{{#str}} entertitle, tiny_media {{/str}}</label>
|
||||
<div class="input-group-append mt-2">
|
||||
<input
|
||||
class="tiny_media_title_entry form-control"
|
||||
type="text"
|
||||
id="{{elementid}}_tiny_media_title_entry"
|
||||
size="32"
|
||||
placeholder="{{#str}} mediatitle, tiny_media {{/str}}"
|
||||
{{#media.title}}value="{{media.title}}"{{/media.title}}
|
||||
>
|
||||
</div>
|
||||
@@ -84,112 +77,133 @@
|
||||
{{/media.poster}}
|
||||
</div>
|
||||
{{/isVideo}}
|
||||
<hr>
|
||||
</div>
|
||||
{{#showControl}}
|
||||
<div class="mt-4">
|
||||
<div class="input-group-append">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_controls"
|
||||
id="vadvancedsettings_media-controls-toggle"
|
||||
{{#isNewFileOrLinkUpload}}checked{{/isNewFileOrLinkUpload}}
|
||||
{{#media.controls}}checked{{/media.controls}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-controls-toggle">
|
||||
{{#str}} controls, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-group-append">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_autoplay"
|
||||
id="vadvancedsettings_media-autoplay-toggle"
|
||||
{{#media.autoplay}}checked{{/media.autoplay}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-autoplay-toggle">
|
||||
{{#str}} autoplay, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-group-append">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_mute"
|
||||
id="vadvancedsettings_media-mute-toggle"
|
||||
{{#media.muted}}checked{{/media.muted}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-mute-toggle">
|
||||
{{#str}} mute, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-group-append">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_loop"
|
||||
id="vadvancedsettings_media-loop-toggle"
|
||||
{{#media.loop}}checked{{/media.loop}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-loop-toggle">
|
||||
{{#str}} loop, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#isVideo}}
|
||||
<div class="media-size-properties">
|
||||
<hr>
|
||||
<div>
|
||||
<input type="radio" class="tiny_media_sizeoriginal form-check-input" id="{{elementid}}_tiny_media_sizeoriginal" name="radioOptions">
|
||||
<label class="form-check-label" for="{{elementid}}_tiny_media_sizeoriginal">{{#str}} sizeoriginal, tiny_media {{/str}}</label>
|
||||
<div class="fw-bold">{{#str}} mediasize, tiny_media {{/str}}</div>
|
||||
<div class="mt-2 mb-1">
|
||||
<div class="btn-group" role="group" aria-label="{{#str}} mediasize, tiny_media{{/str}}">
|
||||
<button class="btn btn-outline-primary media-original-size-toggle">{{#str}} sizeoriginal, tiny_media {{/str}}</button>
|
||||
<button class="btn btn-outline-primary media-custom-size-toggle">{{#str}} sizecustom, tiny_media {{/str}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<input type="radio" class="tiny_media_sizecustom form-check-input" id="{{elementid}}_tiny_media_sizecustom" name="radioOptions">
|
||||
<label class="form-check-label" for="{{elementid}}_tiny_media_sizecustom">{{#str}} sizecustom, tiny_media {{/str}}</label>
|
||||
{{#isLink}}
|
||||
{{#linkcustomsizehelpicon}}
|
||||
{{> core/help_icon }}
|
||||
{{/linkcustomsizehelpicon}}
|
||||
{{/isLink}}
|
||||
{{^isLink}}
|
||||
{{#customsizehelpicon}}
|
||||
{{> core/help_icon }}
|
||||
{{/customsizehelpicon}}
|
||||
{{/isLink}}
|
||||
</div>
|
||||
<div class="form-check mt-2 tiny_media_properties">
|
||||
<div class="mt-2 tiny_media_properties">
|
||||
<div class="d-flex justify-content-start">
|
||||
<div class="me-2">
|
||||
<div class="mb-0">
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
class="tiny_media_width_entry form-control me-1 input-mini"
|
||||
id="{{elementid}}_tiny_media_width_entry"
|
||||
value="{{media.width}}"
|
||||
placeholder="1200"
|
||||
>
|
||||
<label for="{{elementid}}_tiny_media_width_entry" class="ms-1">{{#str}} width, tiny_media {{/str}}</label>
|
||||
<div class="flex-item me-2 col-5">
|
||||
<div>
|
||||
<label for="{{elementid}}_tiny_media_width_entry">{{#str}} width, tiny_media {{/str}}</label>
|
||||
<div class="d-flex align-items-start">
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
class="tiny_media_width_entry form-control input-mini me-1 w-100"
|
||||
id="{{elementid}}_tiny_media_width_entry"
|
||||
value="{{media.width}}"
|
||||
>
|
||||
<span class="mt-1">px</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="me-1 mt-2">X</div>
|
||||
<div class="me-1">
|
||||
<div class="mb-0">
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
placeholder="800"
|
||||
class="tiny_media_height_entry form-control ms-1 input-mini"
|
||||
id="{{elementid}}_tiny_media_height_entry"
|
||||
value="{{media.height}}"
|
||||
>
|
||||
<label for="{{elementid}}_tiny_media_height_entry" class="ms-1">{{#str}} height, tiny_media {{/str}}</label>
|
||||
<div class="flex-item me-1 col-5">
|
||||
<div>
|
||||
<label for="{{elementid}}_tiny_media_height_entry">{{#str}} height, tiny_media {{/str}}</label>
|
||||
<div class="d-flex align-items-start">
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
class="tiny_media_height_entry form-control input-mini me-1 w-100"
|
||||
id="{{elementid}}_tiny_media_height_entry"
|
||||
value="{{media.height}}"
|
||||
>
|
||||
<span class="mt-1">px</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tiny_image_customhelpicon flex-item ms-1">
|
||||
{{#isLink}}
|
||||
{{#linkcustomsizehelpicon}}
|
||||
{{> core/help_icon }}
|
||||
{{/linkcustomsizehelpicon}}
|
||||
{{/isLink}}
|
||||
{{^isLink}}
|
||||
{{#customsizehelpicon}}
|
||||
{{> core/help_icon }}
|
||||
{{/customsizehelpicon}}
|
||||
{{/isLink}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
{{/isVideo}}
|
||||
<div class="fw-bold">{{#str}} playbacksettings, tiny_media {{/str}}</div>
|
||||
<div class="row mt-1">
|
||||
<div class="col-6">
|
||||
<div class="input-group-append">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_controls"
|
||||
id="vadvancedsettings_media-controls-toggle"
|
||||
{{#isNewFileOrLinkUpload}}checked{{/isNewFileOrLinkUpload}}
|
||||
{{#media.controls}}checked{{/media.controls}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-controls-toggle">
|
||||
{{#str}} controls, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-group-append mt-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_autoplay"
|
||||
id="vadvancedsettings_media-autoplay-toggle"
|
||||
{{#media.autoplay}}checked{{/media.autoplay}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-autoplay-toggle">
|
||||
{{#str}} autoplay, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="input-group-append">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_mute"
|
||||
id="vadvancedsettings_media-mute-toggle"
|
||||
{{#media.muted}}checked{{/media.muted}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-mute-toggle">
|
||||
{{#str}} mute, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-group-append mt-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input tiny_media_loop"
|
||||
id="vadvancedsettings_media-loop-toggle"
|
||||
{{#media.loop}}checked{{/media.loop}}
|
||||
>
|
||||
<label class="form-check-label" for="vadvancedsettings_media-loop-toggle">
|
||||
{{#str}} loop, tiny_media {{/str}}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{^isLink}}
|
||||
<hr>
|
||||
<a data-action="show-subtitle-caption" href="#">{{#str}} subtitlesandcaptions, tiny_media {{/str}}</a>
|
||||
{{/isLink}}
|
||||
{{/showControl}}
|
||||
</div>
|
||||
<div class="col-lg-7 p-0">
|
||||
<div class="tiny_media_preview_box border rounded">
|
||||
<button class="btn btn-secondary rounded-circle tiny_media_delete_icon" tabindex="0" title="{{#str}} deletemedia, tiny_media {{/str}}">
|
||||
<i class="fa fa-trash-o"></i>
|
||||
</button>
|
||||
<div id="media-filter-preview-container" class="w-100 text-center"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
-3
@@ -30,9 +30,6 @@
|
||||
</div>
|
||||
<div class="col-md-6 text-end mt-2 mt-md-0 p-0">
|
||||
<button type="button" class="btn btn-secondary d-none" data-action="back-to-media-details">{{#str}} back, tiny_media {{/str}}</button>
|
||||
{{^isLink}}
|
||||
<a class="subtitle-caption me-2" data-action="show-subtitle-caption" href="#">{{#str}} subtitlesandcaptions, tiny_media {{/str}}</a>
|
||||
{{/isLink}}
|
||||
<button type="button" class="btn btn-secondary" data-action="cancel">{{#str}} cancel, moodle {{/str}}</button>
|
||||
<button class="tiny_media_submit btn btn-primary" data-action="save">{{#str}} saveimage, tiny_media {{/str}}</button>
|
||||
</div>
|
||||
|
||||
@@ -29,7 +29,7 @@ Feature: Use the TinyMCE editor to upload a media file
|
||||
And the field "Muted" in the "Media details" "dialogue" matches value "0"
|
||||
And the field "Loop" in the "Media details" "dialogue" matches value "0"
|
||||
And <originalsizeverify>
|
||||
And <customsizeverify1>
|
||||
And <originalsizeverify1>
|
||||
And I click on "Delete media" "button" in the "Media details" "dialogue"
|
||||
And "Delete media" "dialogue" should exist
|
||||
And I click on "Delete" "button" in the "Delete media" "dialogue"
|
||||
@@ -61,17 +61,17 @@ Feature: Use the TinyMCE editor to upload a media file
|
||||
And the field "Autoplay" in the "Media details" "dialogue" matches value "1"
|
||||
And the field "Muted" in the "Media details" "dialogue" matches value "1"
|
||||
And the field "Loop" in the "Media details" "dialogue" matches value "1"
|
||||
And <customsizeverify1>
|
||||
And <customsizeverify2>
|
||||
And <customsizeverify3>
|
||||
And I click on "Subtitles and captions" "link" in the "Media details" "dialogue"
|
||||
And the field "Subtitle track URL" in the "Media details" "dialogue" does not match value ""
|
||||
And the field "Language" in the "Media details" "dialogue" matches value "<subtitlelang>"
|
||||
And the field "Label" in the "Media details" "dialogue" matches value "<subtitletitle>"
|
||||
|
||||
Examples:
|
||||
| mediatype | fixturefile | fixturetitle | newfixturetitle | subtitlefile | subtitletitle | subtitlelangcode | subtitlelang | thumbnailaction | originalsizeverify | customsizeverify1 | customsizeverify2 | customsizeverify3 | customsizestep | customsizeaction |
|
||||
| video | moodle-logo.mp4 | moodle-logo | Moodle LMS Logo | subtitle-sample.vtt | Subtitle sample for video | he | Hebrew | should exist | the field "Original size" in the "Media details" "dialogue" matches value "1" | the field "Custom size" in the "Media details" "dialogue" matches value "0" | the field "Custom size" in the "Media details" "dialogue" matches value "1" | the field "Width" in the "Media details" "dialogue" matches value "300" | I click on "Custom size" "radio" in the "Media details" "dialogue" | I set the field "Width" in the "Media details" "dialogue" to "300" |
|
||||
| audio | audio-sample.mp3 | audio-sample | Sample Audio File | subtitle-sample.vtt | Subtitle sample for audio | fr | French | should not exist | "Original size" "field" should not exist in the "Media details" "dialogue" | "Custom size" "field" should not exist in the "Media details" "dialogue" | "Custom size" "field" should not exist in the "Media details" "dialogue" | "Width" "field" should not exist in the "Media details" "dialogue" | "Original size" "field" should not exist in the "Media details" "dialogue" | "Custom size" "field" should not exist in the "Media details" "dialogue" |
|
||||
| mediatype | fixturefile | fixturetitle | newfixturetitle | subtitlefile | subtitletitle | subtitlelangcode | subtitlelang | thumbnailaction | originalsizeverify | originalsizeverify1 | customsizestep | customsizeaction | customsizeverify1 | customsizeverify2 |
|
||||
| video | moodle-logo.mp4 | moodle-logo | Moodle LMS Logo | subtitle-sample.vtt | Subtitle sample for video | he | Hebrew | should exist | I should not see "Width" in the "Media details" "dialogue" | I should not see "Height" in the "Media details" "dialogue" | I click on "Custom" "button" in the "Media details" "dialogue" | I set the field "Width" in the "Media details" "dialogue" to "300" | I should see "Width" in the "Media details" "dialogue" | the field "Width" in the "Media details" "dialogue" matches value "300" |
|
||||
| audio | audio-sample.mp3 | audio-sample | Sample Audio File | subtitle-sample.vtt | Subtitle sample for audio | fr | French | should not exist | I should not see "Width" in the "Media details" "dialogue" | I should not see "Height" in the "Media details" "dialogue" | "Custom" "button" should not exist in the "Media details" "dialogue" | "Width" "field" should not exist in the "Media details" "dialogue" | I should not see "Width" in the "Media details" "dialogue" | "Custom" "button" should not exist in the "Media details" "dialogue" |
|
||||
|
||||
@_file_upload
|
||||
Scenario: Add custom thumbnail to a video in TinyMCE editor
|
||||
|
||||
Reference in New Issue
Block a user