amass/md
1
0
Fork 0
mirror of https://github.com/doocs/md.git synced 2024-11-24 19:10:34 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat:remove css from html

Browse Source
This commit is contained in:
majianquan 2020-02-15 21:44:42 +08:00
parent 849cfb9d16
commit 6ebee5b7f3
6 changed files with 221 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
public/index.html
View File

@ -41,21 +41,10 @@
<link rel="apple-touch-icon-precomposed" href="assets/images/favicon.png"> <link rel="apple-touch-icon-precomposed" href="assets/images/favicon.png">
<link rel="stylesheet" href="assets/css/loading.css"> <link rel="stylesheet" href="assets/css/loading.css">
<link rel="stylesheet" href="libs/css/index.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"> <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/style-mirror.css">
<link rel="stylesheet" href="libs/css/animate.css"> <link rel="stylesheet" href="libs/css/animate.css">
<link rel="stylesheet" href="assets/css/app.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> </head>
<body> <body>
@ -64,15 +53,8 @@
</div> </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/prettify.min.js"></script>
<script src="libs/scripts/jquery.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> <script>
window.console window.console
&& window.console.log && window.console.log

7
src/components/CodemirrorEditor.vue
View File

@ -123,7 +123,8 @@
<script> <script>
import CodeMirror from 'codemirror/lib/codemirror' 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/edit/matchbrackets'
import 'codemirror/addon/selection/active-line' import 'codemirror/addon/selection/active-line'
@ -134,6 +135,7 @@ import '../scripts/format.js'
import axios from 'axios' import axios from 'axios'
import WxRenderer from '../scripts/renderers/wx-renderer' import WxRenderer from '../scripts/renderers/wx-renderer'
import marked from 'marked' import marked from 'marked'
import markdown from 'markdown'
import { import {
setColorWithCustomTemplate, setColorWithCustomTemplate,
setColor, setColor,
@ -145,6 +147,7 @@ import DEFAULT_CONTENT from '../scripts/default-content'
import DEFAULT_CSS_CONTENT from '../scripts/themes/default-theme-css' import DEFAULT_CSS_CONTENT from '../scripts/themes/default-theme-css'
require('codemirror/mode/javascript/javascript') require('codemirror/mode/javascript/javascript')
import '../scripts/closebrackets'
export default { export default {
data () { data () {
let d = { let d = {
@ -496,9 +499,7 @@ export default {
}, },
// 左右栏同步滚动 // 左右栏同步滚动
leftAndRightScroll() { leftAndRightScroll() {
console.log($)
$('div.CodeMirror-scroll, #preview').on('scroll', function callback () { $('div.CodeMirror-scroll, #preview').on('scroll', function callback () {
console.log(object)
clearTimeout(this.timeout) clearTimeout(this.timeout)
let source = $(this) let source = $(this)

1
src/main.js
View File

@ -8,6 +8,7 @@ import './element'
import 'codemirror/lib/codemirror.css'; import 'codemirror/lib/codemirror.css';
import "codemirror/theme/ambiance.css"; import "codemirror/theme/ambiance.css";
import "codemirror/addon/hint/show-hint.css"; import "codemirror/addon/hint/show-hint.css";
import "codemirror/theme/xq-light.css";
Vue.use(ElementUI) Vue.use(ElementUI)
Vue.config.productionTip = false Vue.config.productionTip = false

214
src/scripts/closebrackets.js Normal file
View 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
src/scripts/format.js
View File

@ -1,3 +1,4 @@
import CodeMirror from "codemirror/lib/codemirror";
(function () { (function () {
CodeMirror.extendMode('css', { CodeMirror.extendMode('css', {
commentStart: '/*', commentStart: '/*',

1
src/scripts/util.js
View File

@ -1,5 +1,6 @@
import default_theme from "./themes/default-theme"; import default_theme from "./themes/default-theme";
// 设置自定义颜色 // 设置自定义颜色
export function setColorWithTemplate (template) { export function setColorWithTemplate (template) {
return function (color) { return function (color) {