📄 bs_wysiwygnew.class.js_
字号:
if (!moz) docHead += '<link rel=stylesheet href="/default.css" type="text/css" />\n';
var emptyDoc = '';
emptyDoc += '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">';
emptyDoc += '<html><head>' + docHead + '</head>';
emptyDoc += '<body>';
if ((this.dataType == 'whtml') && !this._inHtmlMode) {
emptyDoc += this._value;
} else {
emptyDoc += bs_filterForHtml(this._value);
}
emptyDoc += '</body></html>';
this.htmlDoc.write(emptyDoc);
}
/**
* some stuff that both drawAsToolbar() and drawInto() need, after the
* outrendering has been done.
* @access private
* @return void
*/
this._afterDrawStuff = function(isToolbar) {
//has to be here, after rendering.
switch (this.dataType) {
case 'whtml':
toolbarWysiwyg.drawInto('registerWysiwygButtons');
toolbarHtml.drawInto('registerHtmlButtons');
break;
case 'html':
toolbarHtml.drawInto('registerHtmlButtons');
break;
case 'xhtml':
case 'xml':
case 'text':
toolbarText.drawInto('registerTextButtons');
break;
}
try {
this.wysiwygDoc.execCommand("undo", false, null);
} catch (e) {
alert("This is not supported on your level of Mozilla. Please update.1");
}
if (this.dataType == 'whtml') {
this._tabset = new Bs_TabSet(this._objectName + '._tabset', 'tabset');
var tabWysiwygObj = new Object;
tabWysiwygObj.caption = 'Wysiwyg';
tabWysiwygObj.container = document.getElementById('registerWysiwygButtons');
tabWysiwygObj.onFocus = this._objectName + '.switchToWysiwygTab();';
this._tabset.addTab(tabWysiwygObj);
var tabHtmlObj = new Object;
tabHtmlObj.caption = 'HTML';
tabHtmlObj.container = document.getElementById('registerHtmlButtons');
tabHtmlObj.onFocus = this._objectName + '.switchToHtmlTab();';
this._tabset.addTab(tabHtmlObj);
this._tabset.draw();
}
this._initCodeSnippets();
if (!isToolbar) this._updateIframeSize();
window.setInterval(this._objectName + "._updateButtons()", 200);
this.outrendered = true;
return true;
}
/**
* sets the value (content).
* @access public
* @param string str
* @return bool
*/
this.setValue = function(str) {
this._value = str;
if (this.outrendered) {
//maybe not ready yet, if so we have to use a callback. more work :/
if ((this.dataType == 'text') || this._inHtmlMode) {
this.wysiwygElm.innerText = str;
} else {
this.wysiwygElm.innerHTML = str;
}
}
return true;
}
/**
* returns the value (content).
* todo: maybe we should re-read it. or add a setting telling if it should be done.
* @access public
* @return string
*/
this.getValue = function() {
//return this.wysiwygElm.innerHTML;
return this._value; //really?
}
/**
* if you want to use a file browser to load images from the server,
* set the url here. otherwise all a user can do is type in url's himself.
* @access public
* @param string url
* @return void
this.setImageSelector = function(url) {
this._imageSelectorUrl = url;
}
*/
/**
* opens the image selector (as popup).
* only does it if setImageSelector() has been used before.
* @access public (well it's used internally.)
* @return bool (true if it has been opened, false otherwise)
this.openImageSelector = function() {
if (typeof(this._imageSelectorUrl) == 'undefined') return false;
var url = this._imageSelectorUrl + '?callbackFunction=' + this._objectName + '.imageSelectorCallback';
var params = "dependent=yes,width=500,height=300,location=no,menubar=no,scrollbars=no,status=no,toolbar=no";
imgBrowserPopup = window.open(url, "Bs_ImageSelector", params);
return true;
}
*/
/**
* callback function for the image file browser.
* @param string url (the image url)
this.imageSelectorCallback = function(url) {
var img = this.toolbarDoc.document.getElementById('imgSource');
if (img) img.value = url;
}
*/
/**
* sets an array with code snippets.
*
* this all only makes sense if the html tab is used.
* call it before calling drawInto() or so.
*
* the structure of the given array looks like this:
* arr[section][name][property] = value
*
* example:
* arr = new Array;
* arr['site'] = new Array;
* arr['site']['webmasterEmail'] = new Array;
* arr['site']['webmasterEmail']['value'] = '<a href="webmaster@domain.com">Webmaster</a>';
* arr['site']['webmasterEmail']['description'] = 'The main webmaster email address as link.';
* arr['site']['webmasterEmail']['lastMod'] = '2002/12/31'; //just a text string, whatever
* arr['site']['webmasterEmail']['user'] = 'tom'; //user that last modified the snipped
*
* the "value" key is the only really needed one.
* an idea is to groupd snippets into "site", "page" and "user".
*
* if this method is not used, no snippets are available.
*
* @access public
* @param array arr (see above)
* @return void
*/
this.setCodeSnippets = function(arr) {
this._codeSnippets = arr;
}
/**
* inits the code snippets if setCodeSnippets() has been called before.
* @access private
* @return void
*/
this._initCodeSnippets = function() {
return; //deactivated
if (this._codeSnippets) {
//make snippet button visible:
this.toolbarDoc.document.getElementById('btnSnippets').style.display = '';
var formFieldSelect = new Bs_FormFieldSelect;
var snippetGroupSelect = this.toolbarDoc.document.getElementById('snippetGroupSelect');
formFieldSelect.init(snippetGroupSelect);
for (var group in this._codeSnippets) {
var opt = new Option(group, group, false, false);
snippetGroupSelect.options[snippetGroupSelect.length] = opt;
}
var snippetNameSelect = this.toolbarDoc.document.getElementById('snippetNameSelect');
formFieldSelect.init(snippetNameSelect);
for (var group in this._codeSnippets) { break; }
if (group) {
this._snippetUpdateNames(group);
}
}
}
/**
*
*/
this._snippetUpdateNames = function(groupName) {
var snippetNameSelect = this.toolbarDoc.document.getElementById('snippetNameSelect');
snippetNameSelect.prune();
for (var myName in this._codeSnippets[groupName]) {
var opt = new Option(myName, myName, false, false);
snippetNameSelect.options[snippetNameSelect.length] = opt;
}
}
/**
* @access public (used internally)
* @param string groupName
* @return void
*/
this.snippetSwitchGroup = function(groupName) {
this._snippetUpdateNames(groupName);
//also clean the code field:
var snippetHtmlEditor = this.toolbarDoc.document.getElementById('snippetHtmlEditor');
snippetHtmlEditor.innerText = '';
}
/**
* shows the snippet selector.
* @access public (used internally)
* @param string snippetName
* @return void
*/
this.snippetShow = function(snippetName) {
var groupName = this.toolbarDoc.document.getElementById('snippetGroupSelect').getValue();
var snippetHtmlEditor = this.toolbarDoc.document.getElementById('snippetHtmlEditor');
var snippetPropModified = this.toolbarDoc.document.getElementById('snippetPropModified');
var snippetPropUser = this.toolbarDoc.document.getElementById('snippetPropUser');
var snippetPropDescription = this.toolbarDoc.document.getElementById('snippetPropDescription');
var t = this._codeSnippets[groupName][snippetName];
var value = (t['value']) ? t['value'] : '';
var lastMod = (t['lastMod']) ? t['lastMod'] : '';
var user = (t['user']) ? t['user'] : '';
var description = (t['description']) ? t['description'] : '';
snippetHtmlEditor.innerText = value;
snippetPropModified.innerHTML = lastMod;
snippetPropUser.innerHTML = user;
snippetPropDescription.innerHTML = description;
}
/**
* inserts a special character.
* @access public
* @param string code (eg "€")
* @return void
* @status experimental (may be removed, and you'll have to use insertString() or so.)
*/
this.insertSpecialChar = function(code) {
var r = this.workingDoc.selection.createRange();
if (this._inHtmlMode) {
//does not help much to use the code. switching to wysiwyg converts it. hrm, should i care?
r.text = code;
} else {
r.pasteHTML(code);
}
}
/**
* inserts the string specified at the current cursor position.
* @access public
* @param string str
* @status experimental
* @return void
*/
this.insertString = function(str) {
var r = this.workingDoc.selection.createRange();
if (this._inHtmlMode) {
r.text = str;
} else {
r.pasteHTML(str);
}
}
//deprecated. will be removed shortly.
this.insertHtml = function(str) {
this._editorCursorPos.pasteHTML(str);
}
/*
this.insertText = function(str) {
this._editorCursorPos.pasteHTML(bs_filterForHtml(str));
}*/
/*
this.insertText = function(text) {
if (this._editorCursorPos) {
this._editorCursorPos.pasteHTML(text);
} else {
this.wysiwygElm.focus();
document.execCommand("InsertMarquee", false, 'dummy');
//have to use innerHTML, not getValue() here:
//var t = this.getValue();
if (this._inHtmlMode) {
var t = this.wysiwygElm.innerText;
} else {
var t = this.wysiwygElm.innerHTML;
}
t = t.replace(/<MARQUEE id=dummy><\/MARQUEE>/, text);
this.setValue(t);
}
} */
/**
* !!!!!!! DEPRECATED!!!!!!!!
*
* saves the cursor pos of the editable field "onBeforeDeactivate".
* this is needed so we can insert things at the right position.
* @access public (well it's used internally.)
* @return void
* @deprecated
*/
this.saveCursorPos = function() {
try {
this._editorCursorPos = document.selection.createRange().duplicate();
} catch (e) {
this._editorCursorPos = null;
}
}
/**
* fires when the edit area loses the focus.
* we have to update our internal value. and the hidden form field (since bs4.3).
* @access public (well it's used internally.)
* @return void
*/
this.fireOnBlur = function() {
//alert('here in fireOnBlur()');
if (this.wysiwygElm) { //only if ready!
if (this._inHtmlMode) {
this._value = this.wysiwygElm.innerText;
} else {
this._value = this.wysiwygElm.innerHTML;
}
if (typeof(this.formFieldName) != 'undefined') {
var fld = document.getElementById(this.formFieldName);
if (typeof(fld) != 'unknown') fld.value = this._value;
}
/*
if (this.style == 'toolbar') {
this.toggleToolbar(true);
}
*/
}
this.fireEvent('editEnd');
}
/**
*
*/
this.fireOnFocus = function() {
if (this.style == 'toolbar') {
this.toggleToolbar(false);
}
this.fireEvent('editStart');
}
/**
* fires onPaste on the contentEditable area.
* @access private
* @return void
* @since bs4.4
*/
this._fireEditareaOnPaste = function() {
//* 2 = allow paste of plain text, remove tags silently.
//* 3 = allow paste of plain text, remove tags, alert such a message.
//* 4 = if tags are pasted, ask the user if he wants to keep them or have them removed.
if (typeof(this.editareaOnPaste) == 'function') {
var status = this.editareaOnPaste();
if (typeof(status) == 'string') {
window.clipboardData.setData("Text", status);
event.returnValue = true;
} else {
event.returnValue = false;
}
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -