autoLoadMode -> loadScript; chain to avoid flicker on load
This commit is contained in:
parent
786cde781d
commit
d767ad7a8c
|
@ -57,8 +57,6 @@
|
|||
<script src="vendor/codemirror/addon/hint/show-hint.js"></script>
|
||||
<script src="vendor/codemirror/addon/hint/css-hint.js"></script>
|
||||
|
||||
<script src="vendor/codemirror/addon/mode/loadmode.js"></script>
|
||||
|
||||
<script src="vendor/codemirror/keymap/sublime.js"></script>
|
||||
<script src="vendor/codemirror/keymap/emacs.js"></script>
|
||||
<script src="vendor/codemirror/keymap/vim.js"></script>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
/* global CodeMirror prefs */
|
||||
/* global CodeMirror prefs loadScript */
|
||||
|
||||
'use strict';
|
||||
|
||||
|
@ -100,16 +100,16 @@
|
|||
});
|
||||
}
|
||||
|
||||
CodeMirror.modeURL = '/vendor/codemirror/mode/%N/%N.js';
|
||||
|
||||
const MODE = {
|
||||
stylus: 'stylus',
|
||||
uso: 'css'
|
||||
};
|
||||
|
||||
CodeMirror.defineExtension('setPreprocessor', function (preprocessor) {
|
||||
this.setOption('mode', MODE[preprocessor] || 'css');
|
||||
CodeMirror.autoLoadMode(this, MODE[preprocessor] || 'css');
|
||||
const mode = MODE[preprocessor] || 'css';
|
||||
return loadScript(mode !== 'css' && `/vendor/codemirror/mode/${mode}/${mode}.js`).then(() => {
|
||||
this.setOption('mode', mode);
|
||||
});
|
||||
});
|
||||
|
||||
CodeMirror.defineExtension('isBlank', function () {
|
||||
|
|
|
@ -44,21 +44,22 @@ function createSourceEditor(style) {
|
|||
|
||||
const cm = CodeMirror.fromTextArea($('#sections textarea'));
|
||||
cm.startOperation();
|
||||
updateMeta().then(() => {
|
||||
cm.setValue(style.sourceCode);
|
||||
cm.clearHistory();
|
||||
cm.markClean();
|
||||
editors.push(cm);
|
||||
updateMeta();
|
||||
cm.endOperation();
|
||||
|
||||
initHooks();
|
||||
initAppliesToLineWidget();
|
||||
|
||||
initLint();
|
||||
initLinterSwitch();
|
||||
|
||||
// focus must be the last action, otherwise the style is duplicated on saving
|
||||
cm.focus();
|
||||
});
|
||||
|
||||
initLint();
|
||||
initLinterSwitch();
|
||||
|
||||
function initAppliesToLineWidget() {
|
||||
const PREF_NAME = 'editor.appliesToLineWidget';
|
||||
|
@ -183,10 +184,10 @@ ${section}
|
|||
$('#enabled').checked = style.enabled;
|
||||
$('#url').href = style.url;
|
||||
const {usercssData: {preprocessor} = {}} = style;
|
||||
cm.setPreprocessor(preprocessor);
|
||||
// beautify only works with regular CSS
|
||||
$('#beautify').disabled = cm.getOption('mode') !== 'css';
|
||||
updateTitle();
|
||||
return cm.setPreprocessor(preprocessor);
|
||||
}
|
||||
|
||||
function updateTitle() {
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
<script src="/js/localization.js"></script>
|
||||
<script src="/content/apply.js"></script>
|
||||
<script src="/vendor/node-semver/semver.js"></script>
|
||||
<script src="js/script-loader.js"></script>
|
||||
|
||||
<script src="/msgbox/msgbox.js"></script>
|
||||
<link rel="stylesheet" href="/msgbox/msgbox.css"></script>
|
||||
|
@ -47,7 +48,6 @@
|
|||
<link rel="stylesheet" href="/vendor/codemirror/addon/hint/show-hint.css" />
|
||||
<script src="/vendor/codemirror/addon/hint/show-hint.js"></script>
|
||||
<script src="/vendor/codemirror/addon/hint/css-hint.js"></script>
|
||||
<script src="/vendor/codemirror/addon/mode/loadmode.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
|
|
64
vendor/codemirror/addon/mode/loadmode.js
vendored
64
vendor/codemirror/addon/mode/loadmode.js
vendored
|
@ -1,64 +0,0 @@
|
|||
// CodeMirror, copyright (c) by Marijn Haverbeke and others
|
||||
// Distributed under an MIT license: http://codemirror.net/LICENSE
|
||||
|
||||
(function(mod) {
|
||||
if (typeof exports == "object" && typeof module == "object") // CommonJS
|
||||
mod(require("../../lib/codemirror"), "cjs");
|
||||
else if (typeof define == "function" && define.amd) // AMD
|
||||
define(["../../lib/codemirror"], function(CM) { mod(CM, "amd"); });
|
||||
else // Plain browser env
|
||||
mod(CodeMirror, "plain");
|
||||
})(function(CodeMirror, env) {
|
||||
if (!CodeMirror.modeURL) CodeMirror.modeURL = "../mode/%N/%N.js";
|
||||
|
||||
var loading = {};
|
||||
function splitCallback(cont, n) {
|
||||
var countDown = n;
|
||||
return function() { if (--countDown == 0) cont(); };
|
||||
}
|
||||
function ensureDeps(mode, cont) {
|
||||
var deps = CodeMirror.modes[mode].dependencies;
|
||||
if (!deps) return cont();
|
||||
var missing = [];
|
||||
for (var i = 0; i < deps.length; ++i) {
|
||||
if (!CodeMirror.modes.hasOwnProperty(deps[i]))
|
||||
missing.push(deps[i]);
|
||||
}
|
||||
if (!missing.length) return cont();
|
||||
var split = splitCallback(cont, missing.length);
|
||||
for (var i = 0; i < missing.length; ++i)
|
||||
CodeMirror.requireMode(missing[i], split);
|
||||
}
|
||||
|
||||
CodeMirror.requireMode = function(mode, cont) {
|
||||
if (typeof mode != "string") mode = mode.name;
|
||||
if (CodeMirror.modes.hasOwnProperty(mode)) return ensureDeps(mode, cont);
|
||||
if (loading.hasOwnProperty(mode)) return loading[mode].push(cont);
|
||||
|
||||
var file = CodeMirror.modeURL.replace(/%N/g, mode);
|
||||
if (env == "plain") {
|
||||
var script = document.createElement("script");
|
||||
script.src = file;
|
||||
var others = document.getElementsByTagName("script")[0];
|
||||
var list = loading[mode] = [cont];
|
||||
CodeMirror.on(script, "load", function() {
|
||||
ensureDeps(mode, function() {
|
||||
for (var i = 0; i < list.length; ++i) list[i]();
|
||||
});
|
||||
});
|
||||
others.parentNode.insertBefore(script, others);
|
||||
} else if (env == "cjs") {
|
||||
require(file);
|
||||
cont();
|
||||
} else if (env == "amd") {
|
||||
requirejs([file], cont);
|
||||
}
|
||||
};
|
||||
|
||||
CodeMirror.autoLoadMode = function(instance, mode) {
|
||||
if (!CodeMirror.modes.hasOwnProperty(mode))
|
||||
CodeMirror.requireMode(mode, function() {
|
||||
instance.setOption("mode", instance.getOption("mode"));
|
||||
});
|
||||
};
|
||||
});
|
Loading…
Reference in New Issue
Block a user