mirror of
https://github.com/doocs/md.git
synced 2024-11-24 19:10:34 +08:00
feat:remove css from html
This commit is contained in:
parent
849cfb9d16
commit
6ebee5b7f3
@ -41,21 +41,10 @@
|
||||
<link rel="apple-touch-icon-precomposed" href="assets/images/favicon.png">
|
||||
<link rel="stylesheet" href="assets/css/loading.css">
|
||||
<link rel="stylesheet" href="libs/css/index.css">
|
||||
|
||||
<link rel="stylesheet" href="libs/css/xq-light.min.css">
|
||||
<link rel="stylesheet" href="libs/css/code-themes/github-v2.min.css">
|
||||
|
||||
<!-- codemirror -->
|
||||
<!-- <link rel="stylesheet" href="libs/css/codemirror.min.css"> -->
|
||||
<!-- <link rel="stylesheet" href="libs/css/show-hint.css"> -->
|
||||
<link rel="stylesheet" href="libs/css/style-mirror.css">
|
||||
|
||||
<link rel="stylesheet" href="libs/css/animate.css">
|
||||
<link rel="stylesheet" href="assets/css/app.css">
|
||||
|
||||
<!-- 默认CSS/JS -->
|
||||
<script src="assets/scripts/themes/default-theme-css.js"></script>
|
||||
<script src="assets/scripts/default-content.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -64,15 +53,8 @@
|
||||
</div>
|
||||
|
||||
|
||||
<!-- codemirror -->
|
||||
<script src="libs/scripts/codemirror/codemirror.min.js"></script>
|
||||
|
||||
<script src="libs/scripts/markdown.min.js"></script>
|
||||
<script src="libs/scripts/prettify.min.js"></script>
|
||||
<script src="libs/scripts/jquery.min.js"></script>
|
||||
<script src="libs/scripts/closebrackets.js"></script>
|
||||
<!-- <script src="assets/scripts/sync-scroll.js"></script> -->
|
||||
|
||||
<script>
|
||||
window.console
|
||||
&& window.console.log
|
||||
|
@ -123,7 +123,8 @@
|
||||
<script>
|
||||
import CodeMirror from 'codemirror/lib/codemirror'
|
||||
|
||||
import 'codemirror/mode/css/css.js'
|
||||
import 'codemirror/mode/css/css'
|
||||
import 'codemirror/mode/markdown/markdown'
|
||||
import 'codemirror/addon/edit/matchbrackets'
|
||||
import 'codemirror/addon/selection/active-line'
|
||||
|
||||
@ -134,6 +135,7 @@ import '../scripts/format.js'
|
||||
import axios from 'axios'
|
||||
import WxRenderer from '../scripts/renderers/wx-renderer'
|
||||
import marked from 'marked'
|
||||
import markdown from 'markdown'
|
||||
import {
|
||||
setColorWithCustomTemplate,
|
||||
setColor,
|
||||
@ -145,6 +147,7 @@ import DEFAULT_CONTENT from '../scripts/default-content'
|
||||
import DEFAULT_CSS_CONTENT from '../scripts/themes/default-theme-css'
|
||||
|
||||
require('codemirror/mode/javascript/javascript')
|
||||
import '../scripts/closebrackets'
|
||||
export default {
|
||||
data () {
|
||||
let d = {
|
||||
@ -496,9 +499,7 @@ export default {
|
||||
},
|
||||
// 左右栏同步滚动
|
||||
leftAndRightScroll() {
|
||||
console.log($)
|
||||
$('div.CodeMirror-scroll, #preview').on('scroll', function callback () {
|
||||
console.log(object)
|
||||
clearTimeout(this.timeout)
|
||||
|
||||
let source = $(this)
|
||||
|
@ -8,6 +8,7 @@ import './element'
|
||||
import 'codemirror/lib/codemirror.css';
|
||||
import "codemirror/theme/ambiance.css";
|
||||
import "codemirror/addon/hint/show-hint.css";
|
||||
import "codemirror/theme/xq-light.css";
|
||||
Vue.use(ElementUI)
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
214
src/scripts/closebrackets.js
Normal file
214
src/scripts/closebrackets.js
Normal file
@ -0,0 +1,214 @@
|
||||
// CodeMirror, copyright (c) by Marijn Haverbeke and others
|
||||
// Distributed under an MIT license: https://codemirror.net/LICENSE
|
||||
import CodeMirror from "codemirror/lib/codemirror";
|
||||
(function(CodeMirror) {
|
||||
var defaults = {
|
||||
pairs: "()[]{}''\"\"",
|
||||
closeBefore: ")]}'\":;>",
|
||||
triples: "",
|
||||
explode: "[]{}"
|
||||
};
|
||||
|
||||
var Pos = CodeMirror.Pos;
|
||||
|
||||
CodeMirror.defineOption("autoCloseBrackets", false, function(cm, val, old) {
|
||||
if (old && old != CodeMirror.Init) {
|
||||
cm.removeKeyMap(keyMap);
|
||||
cm.state.closeBrackets = null;
|
||||
}
|
||||
if (val) {
|
||||
ensureBound(getOption(val, "pairs"));
|
||||
cm.state.closeBrackets = val;
|
||||
cm.addKeyMap(keyMap);
|
||||
}
|
||||
});
|
||||
|
||||
function getOption(conf, name) {
|
||||
if (name == "pairs" && typeof conf == "string") return conf;
|
||||
if (typeof conf == "object" && conf[name] != null) return conf[name];
|
||||
return defaults[name];
|
||||
}
|
||||
|
||||
var keyMap = { Backspace: handleBackspace, Enter: handleEnter };
|
||||
function ensureBound(chars) {
|
||||
for (var i = 0; i < chars.length; i++) {
|
||||
var ch = chars.charAt(i),
|
||||
key = "'" + ch + "'";
|
||||
if (!keyMap[key]) keyMap[key] = handler(ch);
|
||||
}
|
||||
}
|
||||
ensureBound(defaults.pairs + "`");
|
||||
|
||||
function handler(ch) {
|
||||
return function(cm) {
|
||||
return handleChar(cm, ch);
|
||||
};
|
||||
}
|
||||
|
||||
function getConfig(cm) {
|
||||
var deflt = cm.state.closeBrackets;
|
||||
if (!deflt || deflt.override) return deflt;
|
||||
var mode = cm.getModeAt(cm.getCursor());
|
||||
return mode.closeBrackets || deflt;
|
||||
}
|
||||
|
||||
function handleBackspace(cm) {
|
||||
var conf = getConfig(cm);
|
||||
if (!conf || cm.getOption("disableInput")) return CodeMirror.Pass;
|
||||
|
||||
var pairs = getOption(conf, "pairs");
|
||||
var ranges = cm.listSelections();
|
||||
for (var i = 0; i < ranges.length; i++) {
|
||||
if (!ranges[i].empty()) return CodeMirror.Pass;
|
||||
var around = charsAround(cm, ranges[i].head);
|
||||
if (!around || pairs.indexOf(around) % 2 != 0) return CodeMirror.Pass;
|
||||
}
|
||||
for (var i = ranges.length - 1; i >= 0; i--) {
|
||||
var cur = ranges[i].head;
|
||||
cm.replaceRange(
|
||||
"",
|
||||
Pos(cur.line, cur.ch - 1),
|
||||
Pos(cur.line, cur.ch + 1),
|
||||
"+delete"
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function handleEnter(cm) {
|
||||
var conf = getConfig(cm);
|
||||
var explode = conf && getOption(conf, "explode");
|
||||
if (!explode || cm.getOption("disableInput")) return CodeMirror.Pass;
|
||||
|
||||
var ranges = cm.listSelections();
|
||||
for (var i = 0; i < ranges.length; i++) {
|
||||
if (!ranges[i].empty()) return CodeMirror.Pass;
|
||||
var around = charsAround(cm, ranges[i].head);
|
||||
if (!around || explode.indexOf(around) % 2 != 0) return CodeMirror.Pass;
|
||||
}
|
||||
cm.operation(function() {
|
||||
var linesep = cm.lineSeparator() || "\n";
|
||||
cm.replaceSelection(linesep + linesep, null);
|
||||
cm.execCommand("goCharLeft");
|
||||
ranges = cm.listSelections();
|
||||
for (var i = 0; i < ranges.length; i++) {
|
||||
var line = ranges[i].head.line;
|
||||
cm.indentLine(line, null, true);
|
||||
cm.indentLine(line + 1, null, true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function contractSelection(sel) {
|
||||
var inverted = CodeMirror.cmpPos(sel.anchor, sel.head) > 0;
|
||||
return {
|
||||
anchor: new Pos(sel.anchor.line, sel.anchor.ch + (inverted ? -1 : 1)),
|
||||
head: new Pos(sel.head.line, sel.head.ch + (inverted ? 1 : -1))
|
||||
};
|
||||
}
|
||||
|
||||
function handleChar(cm, ch) {
|
||||
var conf = getConfig(cm);
|
||||
if (!conf || cm.getOption("disableInput")) return CodeMirror.Pass;
|
||||
|
||||
var pairs = getOption(conf, "pairs");
|
||||
var pos = pairs.indexOf(ch);
|
||||
if (pos == -1) return CodeMirror.Pass;
|
||||
|
||||
var closeBefore = getOption(conf, "closeBefore");
|
||||
|
||||
var triples = getOption(conf, "triples");
|
||||
|
||||
var identical = pairs.charAt(pos + 1) == ch;
|
||||
var ranges = cm.listSelections();
|
||||
var opening = pos % 2 == 0;
|
||||
|
||||
var type;
|
||||
for (var i = 0; i < ranges.length; i++) {
|
||||
var range = ranges[i],
|
||||
cur = range.head,
|
||||
curType;
|
||||
var next = cm.getRange(cur, Pos(cur.line, cur.ch + 1));
|
||||
if (opening && !range.empty()) {
|
||||
curType = "surround";
|
||||
} else if ((identical || !opening) && next == ch) {
|
||||
if (identical && stringStartsAfter(cm, cur)) curType = "both";
|
||||
else if (
|
||||
triples.indexOf(ch) >= 0 &&
|
||||
cm.getRange(cur, Pos(cur.line, cur.ch + 3)) == ch + ch + ch
|
||||
)
|
||||
curType = "skipThree";
|
||||
else curType = "skip";
|
||||
} else if (
|
||||
identical &&
|
||||
cur.ch > 1 &&
|
||||
triples.indexOf(ch) >= 0 &&
|
||||
cm.getRange(Pos(cur.line, cur.ch - 2), cur) == ch + ch
|
||||
) {
|
||||
if (
|
||||
cur.ch > 2 &&
|
||||
/\bstring/.test(cm.getTokenTypeAt(Pos(cur.line, cur.ch - 2)))
|
||||
)
|
||||
return CodeMirror.Pass;
|
||||
curType = "addFour";
|
||||
} else if (identical) {
|
||||
var prev =
|
||||
cur.ch == 0 ? " " : cm.getRange(Pos(cur.line, cur.ch - 1), cur);
|
||||
if (
|
||||
!CodeMirror.isWordChar(next) &&
|
||||
prev != ch &&
|
||||
!CodeMirror.isWordChar(prev)
|
||||
)
|
||||
curType = "both";
|
||||
else return CodeMirror.Pass;
|
||||
} else if (
|
||||
opening &&
|
||||
(next.length === 0 || /\s/.test(next) || closeBefore.indexOf(next) > -1)
|
||||
) {
|
||||
curType = "both";
|
||||
} else {
|
||||
return CodeMirror.Pass;
|
||||
}
|
||||
if (!type) type = curType;
|
||||
else if (type != curType) return CodeMirror.Pass;
|
||||
}
|
||||
|
||||
var left = pos % 2 ? pairs.charAt(pos - 1) : ch;
|
||||
var right = pos % 2 ? ch : pairs.charAt(pos + 1);
|
||||
cm.operation(function() {
|
||||
if (type == "skip") {
|
||||
cm.execCommand("goCharRight");
|
||||
} else if (type == "skipThree") {
|
||||
for (var i = 0; i < 3; i++) cm.execCommand("goCharRight");
|
||||
} else if (type == "surround") {
|
||||
var sels = cm.getSelections();
|
||||
for (var i = 0; i < sels.length; i++) sels[i] = left + sels[i] + right;
|
||||
cm.replaceSelections(sels, "around");
|
||||
sels = cm.listSelections().slice();
|
||||
for (var i = 0; i < sels.length; i++)
|
||||
sels[i] = contractSelection(sels[i]);
|
||||
cm.setSelections(sels);
|
||||
} else if (type == "both") {
|
||||
cm.replaceSelection(left + right, null);
|
||||
cm.triggerElectric(left + right);
|
||||
cm.execCommand("goCharLeft");
|
||||
} else if (type == "addFour") {
|
||||
cm.replaceSelection(left + left + left + left, "before");
|
||||
cm.execCommand("goCharRight");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function charsAround(cm, pos) {
|
||||
var str = cm.getRange(Pos(pos.line, pos.ch - 1), Pos(pos.line, pos.ch + 1));
|
||||
return str.length == 2 ? str : null;
|
||||
}
|
||||
|
||||
function stringStartsAfter(cm, pos) {
|
||||
var token = cm.getTokenAt(Pos(pos.line, pos.ch + 1));
|
||||
return (
|
||||
/\bstring/.test(token.type) &&
|
||||
token.start == pos.ch &&
|
||||
(pos.ch == 0 || !/\bstring/.test(cm.getTokenTypeAt(pos)))
|
||||
);
|
||||
}
|
||||
})(CodeMirror);
|
@ -1,3 +1,4 @@
|
||||
import CodeMirror from "codemirror/lib/codemirror";
|
||||
(function () {
|
||||
CodeMirror.extendMode('css', {
|
||||
commentStart: '/*',
|
||||
|
@ -1,5 +1,6 @@
|
||||
import default_theme from "./themes/default-theme";
|
||||
|
||||
|
||||
// 设置自定义颜色
|
||||
export function setColorWithTemplate (template) {
|
||||
return function (color) {
|
||||
|
Loading…
Reference in New Issue
Block a user