| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- // 缩进 菜单插件
- (function (E, $) {
- // 用 createMenu 方法创建菜单
- E.createMenu(function (check) {
- // 定义菜单id,不要和其他菜单id重复。编辑器自带的所有菜单id,可通过『参数配置-自定义菜单』一节查看
- var menuId = 'indent';
- // check将检查菜单配置(『参数配置-自定义菜单』一节描述)中是否该菜单id,如果没有,则忽略下面的代码。
- if (!check(menuId)) {
- return;
- }
- // this 指向 editor 对象自身
- var editor = this;
- // 创建 menu 对象
- var menu = new E.Menu({
- editor: editor, // 编辑器对象
- id: menuId, // 菜单id
- title: '缩进', // 菜单标题
- // 正常状态和选中装下的dom对象,样式需要自定义
- $domNormal: $('<a href="#" tabindex="-1"><i class="wangeditor-menu-img-indent-left"></i></a>'),
- $domSelected: $('<a href="#" tabindex="-1" class="selected"><i class="wangeditor-menu-img-indent-left"></i></a>')
- });
- // 菜单正常状态下,点击将触发该事件
- menu.clickEvent = function (e) {
- var elem = editor.getRangeElem();
- var p = editor.getSelfOrParentByName(elem, 'p');
- var $p;
- if (!p) {
- // 未找到 p 元素,则忽略
- return e.preventDefault();
- }
- $p = $(p);
- // 使用自定义命令
- function commandFn() {
- $p.css('text-indent', '2em');
- }
- editor.customCommand(e, commandFn);
- };
- // 菜单选中状态下,点击将触发该事件
- menu.clickEventSelected = function (e) {
- var elem = editor.getRangeElem();
- var p = editor.getSelfOrParentByName(elem, 'p');
- var $p;
- if (!p) {
- // 未找到 p 元素,则忽略
- return e.preventDefault();
- }
- $p = $(p);
- // 使用自定义命令
- function commandFn() {
- $p.css('text-indent', '0');
- }
- editor.customCommand(e, commandFn);
- };
- // 根据当前选区,自定义更新菜单的选中状态或者正常状态
- menu.updateSelectedEvent = function () {
- // 获取当前选区所在的父元素
- var elem = editor.getRangeElem();
- var p = editor.getSelfOrParentByName(elem, 'p');
- var $p;
- var indent;
- if (!p) {
- // 未找到 p 元素,则标记为未处于选中状态
- return false;
- }
- $p = $(p);
- indent = $p.css('text-indent');
- if (!indent || indent === '0px') {
- // 得到的p,text-indent 属性是 0,则标记为未处于选中状态
- return false;
- }
- // 找到 p 元素,并且 text-indent 不是 0,则标记为选中状态
- return true;
- };
- // 增加到editor对象中
- editor.menus[menuId] = menu;
- });
- })(window.wangEditor, window.jQuery);
|