mirror of
https://github.com/nsnail/FreeSql.git
synced 2025-06-19 20:38:16 +08:00
website 新增md编辑器
This commit is contained in:
@ -0,0 +1,237 @@
|
||||
/*!
|
||||
* Code block dialog plugin for Editor.md
|
||||
*
|
||||
* @file code-block-dialog.js
|
||||
* @author pandao
|
||||
* @version 1.2.0
|
||||
* @updateTime 2015-03-07
|
||||
* {@link https://github.com/pandao/editor.md}
|
||||
* @license MIT
|
||||
*/
|
||||
|
||||
(function() {
|
||||
|
||||
var factory = function (exports) {
|
||||
var cmEditor;
|
||||
var pluginName = "code-block-dialog";
|
||||
|
||||
// for CodeBlock dialog select
|
||||
var codeLanguages = exports.codeLanguages = {
|
||||
asp : ["ASP", "vbscript"],
|
||||
actionscript : ["ActionScript(3.0)/Flash/Flex", "clike"],
|
||||
bash : ["Bash/Bat", "shell"],
|
||||
css : ["CSS", "css"],
|
||||
c : ["C", "clike"],
|
||||
cpp : ["C++", "clike"],
|
||||
csharp : ["C#", "clike"],
|
||||
coffeescript : ["CoffeeScript", "coffeescript"],
|
||||
d : ["D", "d"],
|
||||
dart : ["Dart", "dart"],
|
||||
delphi : ["Delphi/Pascal", "pascal"],
|
||||
erlang : ["Erlang", "erlang"],
|
||||
go : ["Golang", "go"],
|
||||
groovy : ["Groovy", "groovy"],
|
||||
html : ["HTML", "text/html"],
|
||||
java : ["Java", "clike"],
|
||||
json : ["JSON", "text/json"],
|
||||
javascript : ["Javascript", "javascript"],
|
||||
lua : ["Lua", "lua"],
|
||||
less : ["LESS", "css"],
|
||||
markdown : ["Markdown", "gfm"],
|
||||
"objective-c" : ["Objective-C", "clike"],
|
||||
php : ["PHP", "php"],
|
||||
perl : ["Perl", "perl"],
|
||||
python : ["Python", "python"],
|
||||
r : ["R", "r"],
|
||||
rst : ["reStructedText", "rst"],
|
||||
ruby : ["Ruby", "ruby"],
|
||||
sql : ["SQL", "sql"],
|
||||
sass : ["SASS/SCSS", "sass"],
|
||||
shell : ["Shell", "shell"],
|
||||
scala : ["Scala", "clike"],
|
||||
swift : ["Swift", "clike"],
|
||||
vb : ["VB/VBScript", "vb"],
|
||||
xml : ["XML", "text/xml"],
|
||||
yaml : ["YAML", "yaml"]
|
||||
};
|
||||
|
||||
exports.fn.codeBlockDialog = function() {
|
||||
|
||||
var _this = this;
|
||||
var cm = this.cm;
|
||||
var lang = this.lang;
|
||||
var editor = this.editor;
|
||||
var settings = this.settings;
|
||||
var cursor = cm.getCursor();
|
||||
var selection = cm.getSelection();
|
||||
var classPrefix = this.classPrefix;
|
||||
var dialogName = classPrefix + pluginName, dialog;
|
||||
var dialogLang = lang.dialog.codeBlock;
|
||||
|
||||
cm.focus();
|
||||
|
||||
if (editor.find("." + dialogName).length > 0)
|
||||
{
|
||||
dialog = editor.find("." + dialogName);
|
||||
dialog.find("option:first").attr("selected", "selected");
|
||||
dialog.find("textarea").val(selection);
|
||||
|
||||
this.dialogShowMask(dialog);
|
||||
this.dialogLockScreen();
|
||||
dialog.show();
|
||||
}
|
||||
else
|
||||
{
|
||||
var dialogHTML = "<div class=\"" + classPrefix + "code-toolbar\">" +
|
||||
dialogLang.selectLabel + "<select><option selected=\"selected\" value=\"\">" + dialogLang.selectDefaultText + "</option></select>" +
|
||||
"</div>" +
|
||||
"<textarea placeholder=\"coding now....\" style=\"display:none;\">" + selection + "</textarea>";
|
||||
|
||||
dialog = this.createDialog({
|
||||
name : dialogName,
|
||||
title : dialogLang.title,
|
||||
width : 780,
|
||||
height : 565,
|
||||
mask : settings.dialogShowMask,
|
||||
drag : settings.dialogDraggable,
|
||||
content : dialogHTML,
|
||||
lockScreen : settings.dialogLockScreen,
|
||||
maskStyle : {
|
||||
opacity : settings.dialogMaskOpacity,
|
||||
backgroundColor : settings.dialogMaskBgColor
|
||||
},
|
||||
buttons : {
|
||||
enter : [lang.buttons.enter, function() {
|
||||
var codeTexts = this.find("textarea").val();
|
||||
var langName = this.find("select").val();
|
||||
|
||||
if (langName === "")
|
||||
{
|
||||
alert(lang.dialog.codeBlock.unselectedLanguageAlert);
|
||||
return false;
|
||||
}
|
||||
|
||||
if (codeTexts === "")
|
||||
{
|
||||
alert(lang.dialog.codeBlock.codeEmptyAlert);
|
||||
return false;
|
||||
}
|
||||
|
||||
langName = (langName === "other") ? "" : langName;
|
||||
|
||||
cm.replaceSelection(["```" + langName, codeTexts, "```"].join("\n"));
|
||||
|
||||
if (langName === "") {
|
||||
cm.setCursor(cursor.line, cursor.ch + 3);
|
||||
}
|
||||
|
||||
this.hide().lockScreen(false).hideMask();
|
||||
|
||||
return false;
|
||||
}],
|
||||
cancel : [lang.buttons.cancel, function() {
|
||||
this.hide().lockScreen(false).hideMask();
|
||||
|
||||
return false;
|
||||
}]
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var langSelect = dialog.find("select");
|
||||
|
||||
if (langSelect.find("option").length === 1)
|
||||
{
|
||||
for (var key in codeLanguages)
|
||||
{
|
||||
var codeLang = codeLanguages[key];
|
||||
langSelect.append("<option value=\"" + key + "\" mode=\"" + codeLang[1] + "\">" + codeLang[0] + "</option>");
|
||||
}
|
||||
|
||||
langSelect.append("<option value=\"other\">" + dialogLang.otherLanguage + "</option>");
|
||||
}
|
||||
|
||||
var mode = langSelect.find("option:selected").attr("mode");
|
||||
|
||||
var cmConfig = {
|
||||
mode : (mode) ? mode : "text/html",
|
||||
theme : settings.theme,
|
||||
tabSize : 4,
|
||||
autofocus : true,
|
||||
autoCloseTags : true,
|
||||
indentUnit : 4,
|
||||
lineNumbers : true,
|
||||
lineWrapping : true,
|
||||
extraKeys : {"Ctrl-Q": function(cm){ cm.foldCode(cm.getCursor()); }},
|
||||
foldGutter : true,
|
||||
gutters : ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
|
||||
matchBrackets : true,
|
||||
indentWithTabs : true,
|
||||
styleActiveLine : true,
|
||||
styleSelectedText : true,
|
||||
autoCloseBrackets : true,
|
||||
showTrailingSpace : true,
|
||||
highlightSelectionMatches : true
|
||||
};
|
||||
|
||||
var textarea = dialog.find("textarea");
|
||||
var cmObj = dialog.find(".CodeMirror");
|
||||
|
||||
if (dialog.find(".CodeMirror").length < 1)
|
||||
{
|
||||
cmEditor = exports.$CodeMirror.fromTextArea(textarea[0], cmConfig);
|
||||
cmObj = dialog.find(".CodeMirror");
|
||||
|
||||
cmObj.css({
|
||||
"float" : "none",
|
||||
margin : "8px 0",
|
||||
border : "1px solid #ddd",
|
||||
fontSize : settings.fontSize,
|
||||
width : "100%",
|
||||
height : "390px"
|
||||
});
|
||||
|
||||
cmEditor.on("change", function(cm) {
|
||||
textarea.val(cm.getValue());
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
cmEditor.setValue(cm.getSelection());
|
||||
}
|
||||
|
||||
langSelect.change(function(){
|
||||
var _mode = $(this).find("option:selected").attr("mode");
|
||||
cmEditor.setOption("mode", _mode);
|
||||
});
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
// CommonJS/Node.js
|
||||
if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
|
||||
{
|
||||
module.exports = factory;
|
||||
}
|
||||
else if (typeof define === "function") // AMD/CMD/Sea.js
|
||||
{
|
||||
if (define.amd) { // for Require.js
|
||||
|
||||
define(["editormd"], function(editormd) {
|
||||
factory(editormd);
|
||||
});
|
||||
|
||||
} else { // for Sea.js
|
||||
define(function(require) {
|
||||
var editormd = require("./../../editormd");
|
||||
factory(editormd);
|
||||
});
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
factory(window.editormd);
|
||||
}
|
||||
|
||||
})();
|
Reference in New Issue
Block a user