L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-84217 editor_tiny: Added 'img-fluid' class to dropped image files

Browse Source
This commit is contained in:
Stevani Andolo
2025-08-05 14:06:40 +08:00
parent 20bb0b2429
commit 066c3582aa
3 changed files with 10 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/lib/editor/tiny/plugins/media/amd/build/commands.min.js
Vendored
+2 -2
View File
@@ -1,10 +1,10 @@
define("tiny_media/commands",["exports","core/str","./common","./image","./embed","./manager","editor_tiny/utils"],(function(_exports,_str,_common,_image,_embed,_manager,_utils){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}
define("tiny_media/commands",["exports","core/str","./common","./image","./embed","./manager","editor_tiny/utils","./selectors"],(function(_exports,_str,_common,_image,_embed,_manager,_utils,_selectors){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}
/**
* Tiny Media commands.
*
* @module tiny_media/commands
* @copyright 2022 Huong Nguyen <huongnv13@gmail.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.getSetup=void 0,_image=_interopRequireDefault(_image),_embed=_interopRequireDefault(_embed),_manager=_interopRequireDefault(_manager);const isImage=node=>"img"===node.nodeName.toLowerCase(),isVideo=node=>"video"===node.nodeName.toLowerCase()||"audio"===node.nodeName.toLowerCase();_exports.getSetup=async()=>{const[imageButtonText,mediaButtonText,mediaManagerButtonText]=await(0,_str.getStrings)(["imagebuttontitle","mediabuttontitle","mediamanagerbuttontitle"].map((key=>({key:key,component:_common.component})))),[mediaManagerButtonImage]=await Promise.all([(0,_utils.getButtonImage)("filemanager",_common.component)]);return editor=>{((editor,imageButtonText)=>{const handleImageAction=()=>{new _image.default(editor).displayDialogue()};editor.ui.registry.addToggleButton(_common.imageButtonName,{icon:"image",tooltip:imageButtonText,onAction:handleImageAction,onSetup:api=>editor.selection.selectorChangedWithUnbind("img:not([data-mce-object]):not([data-mce-placeholder]),figure.image",api.setActive).unbind}),editor.ui.registry.addMenuItem(_common.imageButtonName,{icon:"image",text:imageButtonText,onAction:handleImageAction}),editor.ui.registry.addContextToolbar(_common.imageButtonName,{predicate:isImage,items:_common.imageButtonName,position:"node",scope:"node"}),editor.ui.registry.addContextMenu(_common.imageButtonName,{update:isImage})})(editor,imageButtonText),((editor,videoButtonText)=>{const handleEmbedAction=()=>{new _embed.default(editor).displayDialogue()};editor.ui.registry.addToggleButton(_common.videoButtonName,{icon:"embed",tooltip:videoButtonText,onAction:handleEmbedAction,onSetup:api=>editor.selection.selectorChangedWithUnbind("video:not([data-mce-object]):not([data-mce-placeholder]),audio:not([data-mce-object]):not([data-mce-placeholder]),a:not([data-mce-object]):not([data-mce-placeholder])[class=external-media-provider]",api.setActive).unbind}),editor.ui.registry.addMenuItem(_common.videoButtonName,{icon:"embed",text:videoButtonText,onAction:handleEmbedAction}),editor.ui.registry.addContextMenu(_common.videoButtonName,{update:isVideo}),editor.ui.registry.addContextToolbar(_common.videoButtonName,{predicate:isVideo,items:_common.videoButtonName,position:"node",scope:"node"})})(editor,mediaButtonText),((editor,mediaManagerButtonText,mediaManagerButtonImage)=>{const handleMediaManager=()=>{new _manager.default(editor).displayDialogue()};editor.ui.registry.addIcon("filemanager",mediaManagerButtonImage.html),editor.ui.registry.addButton(_common.mediaManagerButtonName,{icon:"filemanager",tooltip:mediaManagerButtonText,onAction:()=>{handleMediaManager()}}),editor.ui.registry.addMenuItem(_common.mediaManagerButtonName,{icon:"filemanager",text:mediaManagerButtonText,onAction:()=>{handleMediaManager()}})})(editor,mediaManagerButtonText,mediaManagerButtonImage)}}}));
*/Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.getSetup=void 0,_image=_interopRequireDefault(_image),_embed=_interopRequireDefault(_embed),_manager=_interopRequireDefault(_manager),_selectors=_interopRequireDefault(_selectors);const isImage=node=>"img"===node.nodeName.toLowerCase(),isVideo=node=>"video"===node.nodeName.toLowerCase()||"audio"===node.nodeName.toLowerCase();_exports.getSetup=async()=>{const[imageButtonText,mediaButtonText,mediaManagerButtonText]=await(0,_str.getStrings)(["imagebuttontitle","mediabuttontitle","mediamanagerbuttontitle"].map((key=>({key:key,component:_common.component})))),[mediaManagerButtonImage]=await Promise.all([(0,_utils.getButtonImage)("filemanager",_common.component)]);return editor=>{((editor,imageButtonText)=>{const handleImageAction=()=>{new _image.default(editor).displayDialogue()};editor.ui.registry.addToggleButton(_common.imageButtonName,{icon:"image",tooltip:imageButtonText,onAction:handleImageAction,onSetup:api=>editor.selection.selectorChangedWithUnbind("img:not([data-mce-object]):not([data-mce-placeholder]),figure.image",api.setActive).unbind}),editor.ui.registry.addMenuItem(_common.imageButtonName,{icon:"image",text:imageButtonText,onAction:handleImageAction}),editor.ui.registry.addContextToolbar(_common.imageButtonName,{predicate:isImage,items:_common.imageButtonName,position:"node",scope:"node"}),editor.ui.registry.addContextMenu(_common.imageButtonName,{update:isImage}),editor.on("SetContent",(function(){editor.getBody().querySelectorAll("img:not(.".concat(_selectors.default.IMAGE.styles.responsive,")")).forEach((img=>img.classList.add("".concat(_selectors.default.IMAGE.styles.responsive))))}))})(editor,imageButtonText),((editor,videoButtonText)=>{const handleEmbedAction=()=>{new _embed.default(editor).displayDialogue()};editor.ui.registry.addToggleButton(_common.videoButtonName,{icon:"embed",tooltip:videoButtonText,onAction:handleEmbedAction,onSetup:api=>editor.selection.selectorChangedWithUnbind("video:not([data-mce-object]):not([data-mce-placeholder]),audio:not([data-mce-object]):not([data-mce-placeholder]),a:not([data-mce-object]):not([data-mce-placeholder])[class=external-media-provider]",api.setActive).unbind}),editor.ui.registry.addMenuItem(_common.videoButtonName,{icon:"embed",text:videoButtonText,onAction:handleEmbedAction}),editor.ui.registry.addContextMenu(_common.videoButtonName,{update:isVideo}),editor.ui.registry.addContextToolbar(_common.videoButtonName,{predicate:isVideo,items:_common.videoButtonName,position:"node",scope:"node"})})(editor,mediaButtonText),((editor,mediaManagerButtonText,mediaManagerButtonImage)=>{const handleMediaManager=()=>{new _manager.default(editor).displayDialogue()};editor.ui.registry.addIcon("filemanager",mediaManagerButtonImage.html),editor.ui.registry.addButton(_common.mediaManagerButtonName,{icon:"filemanager",tooltip:mediaManagerButtonText,onAction:()=>{handleMediaManager()}}),editor.ui.registry.addMenuItem(_common.mediaManagerButtonName,{icon:"filemanager",text:mediaManagerButtonText,onAction:()=>{handleMediaManager()}})})(editor,mediaManagerButtonText,mediaManagerButtonImage)}}}));
//# sourceMappingURL=commands.min.js.map
public/lib/editor/tiny/plugins/media/amd/build/commands.min.js.map
+1 -1
View File
File diff suppressed because one or more lines are too long
public/lib/editor/tiny/plugins/media/amd/src/commands.js
+7
View File
@@ -32,6 +32,7 @@ import MediaImage from './image';
import MediaEmbed from './embed';
import MediaManager from './manager';
import {getButtonImage} from 'editor_tiny/utils';
import Selectors from './selectors';
const isImage = (node) => node.nodeName.toLowerCase() === 'img';
const isVideo = (node) => node.nodeName.toLowerCase() === 'video' || node.nodeName.toLowerCase() === 'audio';
@@ -73,6 +74,12 @@ const registerImageCommand = (editor, imageButtonText) => {
editor.ui.registry.addContextMenu(imageButtonName, {
update: isImage,
});
// Let's check for image file at dragged and dropped and add img-fluid class if it does't have it yet.
editor.on('SetContent', function() {
const imgs = editor.getBody().querySelectorAll(`img:not(.${Selectors.IMAGE.styles.responsive})`);
imgs.forEach(img => img.classList.add(`${Selectors.IMAGE.styles.responsive}`));
});
};
const registerEmbedCommand = (editor, videoButtonText) => {