JAVASCRIPT   8

edit.js

Guest on 25th July 2021 04:13:45 PM

  1.  
  2. function _iframeDoc(iframe) {
  3.         iframe = _get(iframe);
  4.         return iframe.contentDocument || iframe.contentWindow.document;
  5. }
  6.  
  7. var html, _direction = '';
  8. if ((html = document.getElementsByTagName('html'))) {
  9.         _direction = html[0].dir;
  10. }
  11.  
  12. function _getInitHtml(themesPath, bodyClass, cssPath, cssData) {
  13.         var arr = [
  14.                 (_direction === '' ? '<html>' : '<html dir="' + _direction + '">'),
  15.                 '<head><meta charset="utf-8" /><title></title>',
  16.                 '<style>',
  17.                 'html {margin:0;padding:0;}',
  18.                 'body {margin:0;padding:5px;}',
  19.                 'body, td {font:12px/1.5 "sans serif",tahoma,verdana,helvetica;}',
  20.                 'body, p, div {word-wrap: break-word;}',
  21.                 'p {margin:5px 0;}',
  22.                 'table {border-collapse:collapse;}',
  23.                 'img {border:0;}',
  24.                 'noscript {display:none;}',
  25.                 'table.ke-zeroborder td {border:1px dotted #AAA;}',
  26.                 'img.ke-flash {',
  27.                 '       border:1px solid #AAA;',
  28.                 '       background-image:url(' + themesPath + 'common/flash.gif);',
  29.                 '       background-position:center center;',
  30.                 '       background-repeat:no-repeat;',
  31.                 '       width:100px;',
  32.                 '       height:100px;',
  33.                 '}',
  34.                 'img.ke-rm {',
  35.                 '       border:1px solid #AAA;',
  36.                 '       background-image:url(' + themesPath + 'common/rm.gif);',
  37.                 '       background-position:center center;',
  38.                 '       background-repeat:no-repeat;',
  39.                 '       width:100px;',
  40.                 '       height:100px;',
  41.                 '}',
  42.                 'img.ke-media {',
  43.                 '       border:1px solid #AAA;',
  44.                 '       background-image:url(' + themesPath + 'common/media.gif);',
  45.                 '       background-position:center center;',
  46.                 '       background-repeat:no-repeat;',
  47.                 '       width:100px;',
  48.                 '       height:100px;',
  49.                 '}',
  50.                 'img.ke-anchor {',
  51.                 '       border:1px dashed #666;',
  52.                 '       width:16px;',
  53.                 '       height:16px;',
  54.                 '}',
  55.                 '.ke-script, .ke-noscript, .ke-display-none {',
  56.                 '       display:none;',
  57.                 '       font-size:0;',
  58.                 '       width:0;',
  59.                 '       height:0;',
  60.                 '}',
  61.                 '.ke-pagebreak {',
  62.                 '       border:1px dotted #AAA;',
  63.                 '       font-size:0;',
  64.                 '       height:2px;',
  65.                 '}',
  66.                 '</style>'
  67.         ];
  68.         if (!_isArray(cssPath)) {
  69.                 cssPath = [cssPath];
  70.         }
  71.         _each(cssPath, function(i, path) {
  72.                 if (path) {
  73.                         arr.push('<link href="' + path + '" rel="stylesheet" />');
  74.                 }
  75.         });
  76.         if (cssData) {
  77.                 arr.push('<style>' + cssData + '</style>');
  78.         }
  79.         arr.push('</head><body ' + (bodyClass ? 'class="' + bodyClass + '"' : '') + '></body></html>');
  80.         return arr.join('\n');
  81. }
  82.  
  83. function _elementVal(knode, val) {
  84.         if (knode.hasVal()) {
  85.                 if (val === undefined) {
  86.                         var html = knode.val();
  87.                         // 去除内容为空的pæ ‡ç­¾
  88. ¸// https://github.com/kindsoft/kindeditor/pull/52
  89. om/kindsoft/kindeditor/pull/52
  90.                         html = html.replace(, '');
  91.                         return html;
  92.                 }
  93.                 re, '');
  94.                         return html;
  95.                 }
  96.                 return knode.val(val);
  97. // create KEdit class
  98. val);
  99. }
  100.  
  101. // create KEdit class
  102. function KEdit(options) {
  103.         this.init(options);
  104. }
  105. _extend(KEdit, KWidget, {
  106.         init : function(options) {
  107.                 var self = this;
  108.                 KEdit.parent.init.call(self, options);
  109.  
  110.                 self.srcElement = K(options.srcElement);
  111.                 self.div.addClass('ke-edit');
  112.                 self.designMode = _undef(options.designMode, true);
  113.                 self.beforeGetHtml = options.beforeGetHtml;
  114.                 self.beforeSetHtml = options.beforeSetHtml;
  115.                 self.afterSetHtml = options.afterSetHtml;
  116.  
  117.                 var themesPath = _undef(options.themesPath, ''),
  118.                         bodyClass = options.bodyClass,
  119.                         cssPath = options.cssPath,
  120.                         cssData = options.cssData,
  121.                         isDocumentDomain = location.protocol != 'res:' && location.host.replace(,
  122.                         s, '') !== document.domain,
  123.                         srcScript = ('document.open();' +
  124.                                 (isDocumentDomain ? 'document.domain="' + document.domain + '";' : '') +
  125.                                 'document.close();'),
  126.                         iframeSrc = _IE ? ' src="javascript:void(function(){' + encodeURIComponent(srcScript) + '}())"' : '';
  127.                 self.iframe = K('<iframe class="ke-edit-iframe"0"idefocus="true" frameborder="0"' + iframeSrc + '></iframe>').css('width', '100%');
  128.                 self.textarea = K('<textarea class="ke-edit-textarea" hidefocus="true"></textarea>').css('width', '100%');
  129.                 self.tabIndex = isNaN(parseInt(options.tabIndex, 10)) ? self.srcElement.attr('tabindex') : parseInt(options.tabIndex, 10);
  130.                 self.iframe.attr('tabindex', self.tabIndex);
  131.                 self.textarea.attr('tabindex', self.tabIndex);
  132.  
  133.                 if (self.width) {
  134.                         self.setWidth(self.width);
  135.                 }
  136.                 if (self.height) {
  137.                         self.setHeight(self.height);
  138.                 }
  139.                 if (self.designMode) {
  140.                         self.textarea.hide();
  141.                 } else {
  142.                         self.iframe.hide();
  143.                 }
  144.                 function ready() {
  145.                         var doc = _iframeDoc(self.iframe);
  146.                         doc.open();
  147.                         if (isDocumentDomain) {
  148.                                 doc.domain = document.domain;
  149.                         }
  150.                         doc.write(_getInitHtml(themesPath, bodyClass, cssPath, cssData));
  151.                         doc.close();
  152.                         self.win = self.iframe[0].contentWindow;
  153.                         self.doc = d// add events
  154.  = _cmd(doc);
  155.                         // add events
  156.                         self.afterChange(function(e) {
  157. // [WEBKIT] select an image after click the image
  158. an image after click the image
  159.                         if (_WEBKIT) {
  160.                                 K(doc).click(function(e) {
  161.                                         if (K(e.target).name === 'img') {
  162.                                                 cmd.selection(true);
  163.                                                 cmd.range.selectNode(e.target);
  164.                                                 cmd.select();
  165.                                         }
  166. // Fix bug: https://github.com/kindsoft/kindeditor/issues/53
  167. /kindsoft/kindeditor/issues/53
  168.                                 self._mousedownHandler = function() {
  169.                                         var newRange = cmd.range.cloneRange();
  170.                                         newRange.shrink();
  171.                                         if (newRange.isControl()) {
  172.                                                 self.blur();
  173.                                         }
  174.                                 };
  175.                                 K(document).mousedow// [IE] bug: clear iframe when press backspase key
  176. frame when press backspase key
  177.                                 K(doc).keydown(function(e) {
  178.                                         if (e.which == 8) {
  179.                                                 cmd.selection();
  180.                                                 var rng = cmd.range;
  181.                                                 if (rng.isControl()) {
  182.                                                         rng.collapse(true);
  183.                                                         K(rng.startContainer.childNodes[rng.startOffset]).remove();
  184.                                                         e.preventDefault();
  185.                                                 }
  186.                                         }
  187.                                 });
  188.                         }
  189.                         self.cmd = cmd;
  190.                         self.html(_elementVal(self.srcElement));
  191.                         if (_IE) {
  192.                                 doc.body.disabled = true;
  193.                                 doc.body.contentEditable = true;
  194.                                 doc.body.removeAttribute('disabled');
  195.                         } else {
  196.                                 doc.designMode = 'on';
  197.                         }
  198.                         if (options.afterCreate) {
  199.                                 options.afterCreate.call(self);
  200.                         }
  201.                 }
  202.                 if (isDocumentDomain) {
  203.                         self.iframe.bind('load', function(e) {
  204.                                 self.iframe.unbind('load');
  205.                                 if (_IE) {
  206.                                         ready();
  207.                                 } else {
  208.                                         setTimeout(ready, 0);
  209.                                 }
  210.                         });
  211.                 }
  212.                 self.div.append(self.iframe);
  213.                 self.div.append(self.textarea);
  214.                 self.srcElement.hide();
  215.                 !isDocumentDomain && ready();
  216.         },
  217.         setWidth : function(val) {
  218.                 var self = this;
  219.                 val = _addUnit(val);
  220.                 self.width = val;
  221.                 self.div.css('width', val);
  222.                 return self;
  223.         },
  224.         setHeight : function(val) {
  225.                 var self = this;
  226.                 val = _addUnit(val);
  227.                 self.height = val;
  228.                 self.div.css('height', val);
  229.                 sel// æ ¡æ­£IE6å’ŒIE7çš„textarea高度
  230.  ¡æ­£IE6å’ŒIE7çš„textarea高度
  231.                 if ((_IE && _V < 8) || _QUIRKS) {
  232.                         val = _addUnit(_removeUnit(val) - 2);
  233.                 }
  234.                 self.textarea.css('height', val);
  235.                 return self;
  236.         },
  237.         remove : // remove events
  238. r self = this, doc = self.doc;
  239.                 // remove events
  240.                 K(doc.body).unbind();
  241.                 K(doc).unbind();
  242.                 K(self.win).unbind();
  243.                 if (self._mousedownHandler) {
  244.                         K(document).u// remove elements
  245. self._mousedownHandler);
  246.                 }
  247.                 // remove elements
  248.                 _elementVal(self.srcE// doc.write('');
  249. ));
  250.                 self.srcElement.show();
  251.                 // doc.write('');
  252.                 self.iframe.unbind();
  253.                 self.textarea.unbind();
  254.                 KEdit.parent.remove.call(self);
  255.         },
  256.         html : function(va// design mode
  257. var self = this, doc = self.doc;
  258.                 // design mode
  259.                 // get
  260. f.designMode) {
  261.                         var body = doc.body;
  262.                         // get
  263.                         if (val === undefined) {
  264.                                 if (isFull) {
  265.                                         val = '<!doctype html><html>' + body.parentNode.innerHTML + '</html>';
  266.                                 } else {
  267.                                         val = body.innerHTML;
  268.                                 }
  269.                                 if (self.beforeGetHtml// bugfix: Firefox自动生成一个bræ ‡ç­¾
  270.  
  271.                                 // bugfix: Firefox自动生成一个bræ ‡ç­¾
  272.                                 i// set
  273. KO && val == '<br />') {
  274.                                         val = '';
  275.                                 }
  276.                                 return val;
  277.                         }
  278.                         //// IE9 Bugfix: https://github.com/kindsoft/kindeditor/issues/62
  279. al);
  280.                         }
  281.                         // IE9 Bugfix: https://github.com/kindsoft/kindeditor/issues/62
  282.                         if (_IE && _V >= 9) {
  283.                                 val = val.replace(self.afterSetHtml) {
  284.                                 self.af, '$1$2');
  285.                         }
  286.                         K(body).html(val);
  287.                         // source mode
  288. etHtml) {
  289.                                 self.afterSetHtml();
  290.                         }
  291.                         return self;
  292.                 }
  293.                 // source mode
  294.                 if (val === undefined) {
  295.                         return self.textarea.val();
  296.                 }
  297.                 self.textarea.val(val);
  298.                 return self;
  299.         },
  300.         design : function(bool) {
  301.                 var self = this, val;
  302.                 if (bool === undefined ? !self.designMode : bool) {
  303.                         if (!self.designMode) {
  304.                                 val = self.html();
  305.                                 self.designMode = true;
  306.                                 self.html(val);
  307.                                 self.textarea.hide();
  308.                                 self.iframe.show();
  309.                         }
  310.                 } else {
  311.                         if (self.designMode) {
  312.                                 val = self.html();
  313.                                 self.designMode = false;
  314.                                 self.html(val);
  315.                                 self.iframe.hide();
  316.                                 self.textarea.show();
  317.                         }
  318.                 }
  319.                 return self.focus();
  320.         },
  321.         focus : function() {
  322.                 var self = this;
  323.                 self.designMode ? self.win.focus() : self.textarea[0].focus();
  324.                 return self;
  325.         },
  326.         blur : function() {
  327.                 var self = this;
  328.                 if (_IE) {
  329.                         var input = K('<input type="text" style="float:left;width:0;height:0;padding:0;margin:0;border:0;" value="" />', self.div);
  330.                         self.div.append(input);
  331.                         input[0].focus();
  332.                         input.remove();
  333.                 } else {
  334.                         self.designMode ? self.win.blur() : self.textarea[0].blur();
  335.                 }
  336.                 return self;
  337.         },
  338.         afterChange : function(fn) {
  339.                 var self = this, doc = self.doc, body = doc.body;
  340.                 K(doc).keyup(function(e) {
  341.                         if (!e.ctrlKey && !e.altKey && _CHANGE_KEY_MAP[e.which]) {
  342.                                 fn(e);
  343.                         }
  344.                 });
  345.                 K(doc).mouseup(fn).contextmenu(fn);
  346.                 K(self.win).blur(fn);
  347.                 function timeoutHandler(e) {
  348.                         setTimeout(function() {
  349.                                 fn(e);
  350.                         }, 1);
  351.                 }
  352.                 K(body).bind('paste', timeoutHandler);
  353.                 K(body).bind('cut', timeoutHandler);
  354.                 return self;
  355.         }
  356. });
  357.  
  358. function _edit(options) {
  359.         return new KEdi

Raw Paste

').css('width', '100%'); self.tabIndex = isNaN(parseInt(options.tabIndex, 10)) ? self.srcElement.attr('tabindex') : parseInt(options.tabIndex, 10); self.iframe.attr('tabindex', self.tabIndex); self.textarea.attr('tabindex', self.tabIndex); if (self.width) { self.setWidth(self.width); } if (self.height) { self.setHeight(self.height); } if (self.designMode) { self.textarea.hide(); } else { self.iframe.hide(); } function ready() { var doc = _iframeDoc(self.iframe); doc.open(); if (isDocumentDomain) { doc.domain = document.domain; } doc.write(_getInitHtml(themesPath, bodyClass, cssPath, cssData)); doc.close(); self.win = self.iframe[0].contentWindow; self.doc = doc; var cmd = _cmd(doc); // add events self.afterChange(function(e) { cmd.selection(); }); // [WEBKIT] select an image after click the image if (_WEBKIT) { K(doc).click(function(e) { if (K(e.target).name === 'img') { cmd.selection(true); cmd.range.selectNode(e.target); cmd.select(); } }); } if (_IE) { // Fix bug: https://github.com/kindsoft/kindeditor/issues/53 self._mousedownHandler = function() { var newRange = cmd.range.cloneRange(); newRange.shrink(); if (newRange.isControl()) { self.blur(); } }; K(document).mousedown(self._mousedownHandler); // [IE] bug: clear iframe when press backspase key K(doc).keydown(function(e) { if (e.which == 8) { cmd.selection(); var rng = cmd.range; if (rng.isControl()) { rng.collapse(true); K(rng.startContainer.childNodes[rng.startOffset]).remove(); e.preventDefault(); } } }); } self.cmd = cmd; self.html(_elementVal(self.srcElement)); if (_IE) { doc.body.disabled = true; doc.body.contentEditable = true; doc.body.removeAttribute('disabled'); } else { doc.designMode = 'on'; } if (options.afterCreate) { options.afterCreate.call(self); } } if (isDocumentDomain) { self.iframe.bind('load', function(e) { self.iframe.unbind('load'); if (_IE) { ready(); } else { setTimeout(ready, 0); } }); } self.div.append(self.iframe); self.div.append(self.textarea); self.srcElement.hide(); !isDocumentDomain && ready(); }, setWidth : function(val) { var self = this; val = _addUnit(val); self.width = val; self.div.css('width', val); return self; }, setHeight : function(val) { var self = this; val = _addUnit(val); self.height = val; self.div.css('height', val); self.iframe.css('height', val); // æ ¡æ­£IE6å’ŒIE7çš„textarea高度 if ((_IE && _V < 8) || _QUIRKS) { val = _addUnit(_removeUnit(val) - 2); } self.textarea.css('height', val); return self; }, remove : function() { var self = this, doc = self.doc; // remove events K(doc.body).unbind(); K(doc).unbind(); K(self.win).unbind(); if (self._mousedownHandler) { K(document).unbind('mousedown', self._mousedownHandler); } // remove elements _elementVal(self.srcElement, self.html()); self.srcElement.show(); // doc.write(''); self.iframe.unbind(); self.textarea.unbind(); KEdit.parent.remove.call(self); }, html : function(val, isFull) { var self = this, doc = self.doc; // design mode if (self.designMode) { var body = doc.body; // get if (val === undefined) { if (isFull) { val = '' + body.parentNode.innerHTML + ' '; } else { val = body.innerHTML; } if (self.beforeGetHtml) { val = self.beforeGetHtml(val); } // bugfix: Firefox自动生成一个bræ ‡ç­¾ if (_GECKO && val == '
') { val = ''; } return val; } // set if (self.beforeSetHtml) { val = self.beforeSetHtml(val); } // IE9 Bugfix: https://github.com/kindsoft/kindeditor/issues/62 if (_IE && _V >= 9) { val = val.replace(/(<.*?checked=")checked(".*>)/ig, '$1$2'); } K(body).html(val); if (self.afterSetHtml) { self.afterSetHtml(); } return self; } // source mode if (val === undefined) { return self.textarea.val(); } self.textarea.val(val); return self; }, design : function(bool) { var self = this, val; if (bool === undefined ? !self.designMode : bool) { if (!self.designMode) { val = self.html(); self.designMode = true; self.html(val); self.textarea.hide(); self.iframe.show(); } } else { if (self.designMode) { val = self.html(); self.designMode = false; self.html(val); self.iframe.hide(); self.textarea.show(); } } return self.focus(); }, focus : function() { var self = this; self.designMode ? self.win.focus() : self.textarea[0].focus(); return self; }, blur : function() { var self = this; if (_IE) { var input = K('', self.div); self.div.append(input); input[0].focus(); input.remove(); } else { self.designMode ? self.win.blur() : self.textarea[0].blur(); } return self; }, afterChange : function(fn) { var self = this, doc = self.doc, body = doc.body; K(doc).keyup(function(e) { if (!e.ctrlKey && !e.altKey && _CHANGE_KEY_MAP[e.which]) { fn(e); } }); K(doc).mouseup(fn).contextmenu(fn); K(self.win).blur(fn); function timeoutHandler(e) { setTimeout(function() { fn(e); }, 1); } K(body).bind('paste', timeoutHandler); K(body).bind('cut', timeoutHandler); return self; } }); function _edit(options) { return new KEdit(options); } K.EditClass = KEdit; K.edit = _edit; K.iframeDoc = _iframeDoc;

Login or Register to edit or fork this paste. It's free.