IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

code-editor: minor refactor

Browse Source
This commit is contained in:
Alexander Zobnin 2017-08-07 22:14:32 +03:00
parent bf8171fd63
commit 928fedaad7
1 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
public/app/core/components/code_editor/code_editor.ts
View File

@ -1,6 +1,5 @@
///<reference path="../../../headers/common.d.ts" /> ///<reference path="../../../headers/common.d.ts" />
// import angular from 'angular';
import coreModule from 'app/core/core_module'; import coreModule from 'app/core/core_module';
import ace from 'ace'; import ace from 'ace';
@ -16,30 +15,33 @@ function fixModuleUrl(moduleType, name) {
ace.config.setModuleUrl(aceModeName, ACE_SRC_BASE + componentName); ace.config.setModuleUrl(aceModeName, ACE_SRC_BASE + componentName);
} }
fixModuleUrl("theme", "solarized_dark");
fixModuleUrl("ext", "language_tools"); fixModuleUrl("ext", "language_tools");
let editorTemplate = `<div></div>`; let editorTemplate = `<div></div>`;
function link(scope, elem, attrs) { function link(scope, elem, attrs) {
// Options
let langMode = attrs.mode || 'text';
let theme = "solarized_dark";
let aceElem = elem.get(0); let aceElem = elem.get(0);
let codeEditor = ace.edit(aceElem); let codeEditor = ace.edit(aceElem);
let editorSession = codeEditor.getSession(); let editorSession = codeEditor.getSession();
codeEditor.setTheme("ace/theme/solarized_dark");
codeEditor.setHighlightActiveLine(false); codeEditor.setHighlightActiveLine(false);
codeEditor.setShowPrintMargin(false); codeEditor.setShowPrintMargin(false);
// disable depreacation warning // disable depreacation warning
codeEditor.$blockScrolling = Infinity; codeEditor.$blockScrolling = Infinity;
setLangMode(); codeEditor.setAutoScrollEditorIntoView(true);
setThemeMode(theme);
setLangMode(langMode);
codeEditor.setValue(scope.content); codeEditor.setValue(scope.content);
codeEditor.clearSelection(); codeEditor.clearSelection();
elem.addClass("gf-code-editor"); elem.addClass("gf-code-editor");
let textarea = elem.find("textarea"); let textarea = elem.find("textarea");
textarea.addClass('gf-form-input width-25'); textarea.addClass('gf-form-input');
textarea.attr("rows", "4");
editorSession.on('change', (e) => { editorSession.on('change', (e) => {
scope.$apply(() => { scope.$apply(() => {
@ -48,8 +50,7 @@ function link(scope, elem, attrs) {
}); });
}); });
function setLangMode() { function setLangMode(lang) {
let lang = attrs.mode || 'text';
let aceModeName = `ace/mode/${lang}`; let aceModeName = `ace/mode/${lang}`;
fixModuleUrl("mode", lang); fixModuleUrl("mode", lang);
fixModuleUrl("snippets", lang); fixModuleUrl("snippets", lang);
@ -62,6 +63,12 @@ function link(scope, elem, attrs) {
}); });
}); });
} }
function setThemeMode(theme) {
fixModuleUrl("theme", theme);
let aceThemeName = `ace/theme/${theme}`;
codeEditor.setTheme(aceThemeName);
}
} }
export function codeEditorDirective() { export function codeEditorDirective() {