hippohtmlarea.js

来自「Hippo CMS是一个以信息为中心的开源内容管理系统。Hippo CMS目标是」· JavaScript 代码 · 共 583 行 · 第 1/2 页

JS
583
字号
		 config.height = "200px";
		 config.width = "600px";
		 /*
		 config.pageStyle = "@import url(/cforms/resources/htmlarea/hippohtmlarea.css);";
		 */

		 config.pageStyle = "body { background-color:#FFFFee;font-family:verdana,arial,helvetica,sans-serif; font-size: 0.8em; color:#000000; padding:0px; }"+
		 "a {color:#003399;} a:link { color:#003399; text-decoration:none ;font-weight:bold;} a:active { color:#CC0000; text-decoration:none } a:visited { color:#003399; text-decoration:none } a:hover { color:#FF6600; text-decoration:underline }";

 		config.toolbar = [
		  ["bold","italic","underline","separator","insertorderedlist", "insertunorderedlist","createlink","inserttable","separator","copy", "cut", "space", "pastespecial","undo", "redo"],
		];

  editor.registerPlugin("Expander");
  editor.registerPlugin("HTMLAreaFocus");
  editor.registerPlugin("Floater");
  editor.registerPlugin("EnterParagraphs");
  editor.registerPlugin("ContextMenu");
  editor.generate();

}


function DisableParagraphs(editor) {
	this.editor = editor;

	// Activate only if we're talking to Gecko
	if (HTMLArea.is_gecko)
		this.onKeyPress = this.__onKeyPress;
};

DisableParagraphs._pluginInfo = {
	name          : "DisableParagraphs",
	version       : "1.0",
	developer     : "Jeroen Reijn",
	developer_url : "http://www.hippo.nl/",
 license       : "Apache 2.0"
};

// Called when a key is pressed in the editor
DisableParagraphs.prototype.onKeyPress = function(ev) {
	// If they've hit enter and shift is up, take it

	 if (ev.keyCode == 13)
	 {
 	  HTMLArea._stopEvent(ev);
	 }
		return false;
};

// Handles the pressing of an unshifted enter for Gecko
DisableParagraphs.prototype.__onKeyPress = function(ev) {
	 if (ev.keyCode == 13)
	 {
 	  HTMLArea._stopEvent(ev);
	 }
		return false;
};


function Expander(editor, extra, delay) {
   // Default to 50 extra pixels in height and 90 milliseconds timeout
   var e = parseInt(extra);
   var d = parseInt(delay);
   this._extra = (((e < 50) || isNaN(e)) ? 50 : e);
   this._delay = (((d < 90) || isNaN(d)) ? 90 : d);
   this._editor = editor;
};

Expander._pluginInfo = {
         name          : "Expander",
         version       : "1.0",
         developer     : "Pier Fumagalli",
         developer_url : "http://www.apache.org/~pier/",
         license       : "Apache 2.0",
         description   : "Forces HTMLArea to expand and contract depending on its contents"
};

Expander.prototype.onGenerate = function () {
   this.arrangeSize();
}

Expander.prototype.onKeyPress = function (event) {

   // We arrange the size after a timeout to give time to
   // the browser to process the keypress event fully.
   var inst = this;
   setTimeout(function () { inst.arrangeSize() }, this._delay);

   //DEBUG
   //setTimeout(function () { notify.value = inst._editor._iframe.contentWindow.document.body.innerHTML; }, 100);
}

Expander.prototype.arrangeSize = function (param) {
   var h = (HTMLArea.is_ie ? h = this._editor._doc.body.scrollHeight: h = this._editor._doc.body.offsetHeight);
   this._editor._iframe.style.height = h + this._extra;
}

function HTMLAreaFocus(editor) {
   this._editor = editor;
   this._focused = true;
   this._timeout = null;
}

HTMLAreaFocus._pluginInfo = {
         name          : "HTMLAreaFocus",
         version       : "1.0",
         developer     : "Pier Fumagalli",
         developer_url : "http://www.apache.org/~pier/",
         license       : "Apache 2.0",
         description   : "Generates focusing events into other plugins"
};

HTMLAreaFocus.prototype.onGenerate = function () {
   var document = this._editor._iframe.contentWindow.document;
   var textarea = this._editor._textArea;
   var toolbar = this._editor._toolbar;
   var instance = this;

   // The "blurrer" function gets executed on a specific (short) timeout
   // so that events from focusing (from other elements) are processed
   // before the actual "blurring" happens. This is to allow switching from
   // the iframe to the toolbar without triggering focus/blur events
   var blurrer = function (event) {
     instance._timeout = setTimeout(function () {
         if ((instance._focused) && (instance._timeout != null)) {
           instance._timeout = null;
           instance._focused = false;
           for (var i in instance._editor.plugins) {
             var plugin = instance._editor.plugins[i].instance;
             if (typeof plugin.onBlur == "function") plugin.onBlur(event);
           }
         }
       }, 50);
   };

   // The "focuser" function will be called and will either cancel the timeout
   // set up by a blurring event of a related blur from another event or actually
   // trigger the real focusing function.
   var focuser = function(event) {
     if (instance._timeout != null) {
       clearTimeout(instance._timeout);
       instance._timeout = null;
     } else if (!instance._focused) {
       instance._focused = true;
       for (var i in instance._editor.plugins) {
         var plugin = instance._editor.plugins[i].instance;
         if (typeof plugin.onFocus == "function") plugin.onFocus(event);
       }
     }
   };

   if (HTMLArea.is_ie) {
     HTMLArea._addEvent(toolbar, "focusout", blurrer);
     HTMLArea._addEvent(document, "focusout", blurrer);
     HTMLArea._addEvent(textarea, "focusout", blurrer);
     HTMLArea._addEvent(toolbar, "focusin", focuser);
     HTMLArea._addEvent(document, "focusin", focuser);
     HTMLArea._addEvent(textarea, "focusin", focuser);
   } else {
     HTMLArea._addEvent(toolbar, "blur", blurrer);
     HTMLArea._addEvent(document, "blur", blurrer);
     HTMLArea._addEvent(textarea, "blur", blurrer);
     HTMLArea._addEvent(toolbar, "focus", focuser);
     HTMLArea._addEvent(document, "focus", focuser);
     HTMLArea._addEvent(textarea, "focus", focuser);
   }
}

function Floater(editor) {
   this._editor = editor;
   this._editor.config.statusBar = false;
   this._editor.config.sizeIncludesToolbar = false;
   this._event = false;
};

Floater._pluginInfo = {
         name          : "Floater",
         version       : "1.0",
         developer     : "Pier Fumagalli",
         developer_url : "http://www.apache.org/~pier/",
         license       : "Apache 2.0",
         description   : "Forces HTMLArea toolbar and statusbar to float"
};

Floater.prototype.onGenerate = function () {
   var ifrm = this._editor._iframe;
   var area = this._editor._htmlArea;
   var tbar = this._editor._toolbar;


   // Set up absolute positioning and after a timeout
   // (so that the browser can recalculate positions in
   // the new absolute layout) we set the top of the bar.
   tbar.style.position = "absolute";

   //alert();
   setTimeout(function () {

							// Hide and show to make sure that IE displays correctly
       /*if (HTMLArea.is_ie) {*/
       	tbar.style.display = "none";
       	tbar.style.display = "block";
       /*}*/

       //alert("oT: " + tbar.offsetTop + ", oH: "  + tbar.offsetHeight);
       tbar.style.left = "" + (640 - tbar.clientWidth - 12) + "px";
       tbar.style.top = "" + (tbar.offsetTop - tbar.offsetHeight ) + "px";


       // Hide and show to make sure that IE displays correctly
       if (HTMLArea.is_ie) {
       	tbar.style.display = "none";
       	tbar.style.display = "block";
       }
     }, 200);
}

Floater.prototype.onFocus = function () {
   this._editor._toolbar.style.display = "block";
}

Floater.prototype.onBlur = function () {
   this._editor._toolbar.style.display = "none";
}

function Floater2(editor) {
   this._editor = editor;
   this._editor.config.statusBar = false;
   this._editor.config.sizeIncludesToolbar = false;
   this._event = false;
};

Floater2._pluginInfo = {
         name          : "Floater",
         version       : "1.0",
         developer     : "Pier Fumagalli",
         developer_url : "http://www.apache.org/~pier/",
         license       : "Apache 2.0",
         description   : "Forces HTMLArea toolbar and statusbar to float"
};

Floater2.prototype.onGenerate = function () {
   var ifrm = this._editor._iframe;
   var area = this._editor._htmlArea;
   var tbar = this._editor._toolbar;

   tbar.style.display = "none";
   tbar.style.display = "block";

   setTimeout(function () {
     tbar.style.top = "" + (tbar.offsetTop - tbar.offsetHeight ) + "px";
   }, 200);

   if (HTMLArea.is_ie) {
     tbar.style.display = "none";
     tbar.style.display = "block";
   }

   // Set up absolute positioning and after a timeout
   // (so that the browser can recalculate positions in
   // the new absolute layout) we set the top of the bar.
   /*
   tbar.style.position = "absolute";

   setTimeout(function () {

   tbar.style.display = "none";
   tbar.style.display = "block";

   alert("oT: " + tbar.offsetTop + ", oH: "  + tbar.offsetHeight);
   tbar.style.left = "" + (640 - tbar.clientWidth - 12) + "px";
   tbar.style.top = "" + (tbar.offsetTop - tbar.offsetHeight ) + "px";


     // Hide and show to make sure that IE displays correctly
     if (HTMLArea.is_ie) {
       tbar.style.display = "none";
       tbar.style.display = "block";
     }
   }, 200);
   */
}

Floater2.prototype.onFocus = function () {
   this._editor._toolbar.style.display = "block";
}

Floater2.prototype.onBlur = function () {
   this._editor._toolbar.style.display = "none";
}

⌨️ 快捷键说明

复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?