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 + -
显示快捷键?