cleanup demo
This commit is contained in:
parent
ae810194ac
commit
27db482e8e
3 changed files with 36 additions and 63 deletions
|
|
@ -156,9 +156,8 @@ exports.launch = function(env) {
|
||||||
// Use a more complex keymapping:
|
// Use a more complex keymapping:
|
||||||
// env.editor.setKeyboardHandler(vim);
|
// env.editor.setKeyboardHandler(vim);
|
||||||
|
|
||||||
var docEl = document.getElementById("doc");
|
bindDropdown("doc", function(value) {
|
||||||
function onDocChange() {
|
var doc = docs[value];
|
||||||
var doc = docs[docEl.value];
|
|
||||||
env.editor.setSession(doc);
|
env.editor.setSession(doc);
|
||||||
|
|
||||||
var mode = doc.getMode();
|
var mode = doc.getMode();
|
||||||
|
|
@ -185,56 +184,41 @@ exports.launch = function(env) {
|
||||||
}
|
}
|
||||||
|
|
||||||
env.editor.focus();
|
env.editor.focus();
|
||||||
|
});
|
||||||
|
|
||||||
|
bindDropdown("theme", function(value) {
|
||||||
|
env.editor.setTheme(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
bindCheckbox("select_style", function(checked) {
|
||||||
|
env.editor.setSelectionStyle(checked ? "line" : "text");
|
||||||
|
});
|
||||||
|
|
||||||
|
bindCheckbox("highlight_active", function(checked) {
|
||||||
|
env.editor.setHighlightActiveLine(checked);
|
||||||
|
});
|
||||||
|
|
||||||
|
bindCheckbox("show_hidden", function(checked) {
|
||||||
|
env.editor.setShowInvisibles(checked);
|
||||||
|
});
|
||||||
|
|
||||||
|
function bindCheckbox(id, callback) {
|
||||||
|
var el = document.getElementById(id);
|
||||||
|
var onCheck = function() {
|
||||||
|
callback(!!el.checked);
|
||||||
|
};
|
||||||
|
el.onclick = onCheck;
|
||||||
|
onCheck();
|
||||||
|
}
|
||||||
|
|
||||||
|
function bindDropdown(id, callback) {
|
||||||
|
var el = document.getElementById(id);
|
||||||
|
var onChange = function() {
|
||||||
|
callback(el.value);
|
||||||
|
};
|
||||||
|
el.onchange = onChange;
|
||||||
|
onChange();
|
||||||
}
|
}
|
||||||
docEl.onchange = onDocChange;
|
|
||||||
onDocChange();
|
|
||||||
|
|
||||||
|
|
||||||
var themeEl = document.getElementById("theme");
|
|
||||||
function setTheme() {
|
|
||||||
env.editor.setTheme(themeEl.value);
|
|
||||||
};
|
|
||||||
themeEl.onchange = setTheme;
|
|
||||||
setTheme();
|
|
||||||
|
|
||||||
|
|
||||||
var selectEl = document.getElementById("select_style");
|
|
||||||
function setSelectionStyle() {
|
|
||||||
if (selectEl.checked) {
|
|
||||||
env.editor.setSelectionStyle("line");
|
|
||||||
} else {
|
|
||||||
env.editor.setSelectionStyle("text");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
selectEl.onclick = setSelectionStyle;
|
|
||||||
setSelectionStyle();
|
|
||||||
|
|
||||||
|
|
||||||
var activeEl = document.getElementById("highlight_active");
|
|
||||||
function setHighlightActiveLine() {
|
|
||||||
env.editor.setHighlightActiveLine(!!activeEl.checked);
|
|
||||||
};
|
|
||||||
activeEl.onclick = setHighlightActiveLine;
|
|
||||||
setHighlightActiveLine();
|
|
||||||
|
|
||||||
|
|
||||||
var showHiddenEl = document.getElementById("show_hidden");
|
|
||||||
function setShowInvisibles() {
|
|
||||||
env.editor.setShowInvisibles(!!showHiddenEl.checked);
|
|
||||||
};
|
|
||||||
showHiddenEl.onclick = setShowInvisibles;
|
|
||||||
setShowInvisibles();
|
|
||||||
|
|
||||||
|
|
||||||
// for debugging
|
|
||||||
window.jump = function() {
|
|
||||||
var jump = document.getElementById("jump");
|
|
||||||
var cursor = env.editor.getCursorPosition();
|
|
||||||
var pos = env.editor.renderer.textToScreenCoordinates(cursor.row, cursor.column);
|
|
||||||
jump.style.left = pos.pageX + "px";
|
|
||||||
jump.style.top = pos.pageY + "px";
|
|
||||||
jump.style.display = "block";
|
|
||||||
};
|
|
||||||
|
|
||||||
function onResize() {
|
function onResize() {
|
||||||
container.style.width = (document.documentElement.clientWidth - 4) + "px";
|
container.style.width = (document.documentElement.clientWidth - 4) + "px";
|
||||||
|
|
|
||||||
|
|
@ -26,15 +26,6 @@ body {
|
||||||
height: 55px;
|
height: 55px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#jump {
|
|
||||||
position: absolute;
|
|
||||||
width: 10px;
|
|
||||||
height: 10px;
|
|
||||||
border: 1px solid red;
|
|
||||||
z-index: 10000;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#cockpitInput {
|
#cockpitInput {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
||||||
|
|
@ -9,8 +9,6 @@
|
||||||
<link rel="stylesheet" href="demo/styles.css" type="text/css" media="screen" charset="utf-8">
|
<link rel="stylesheet" href="demo/styles.css" type="text/css" media="screen" charset="utf-8">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="jump"></div>
|
|
||||||
|
|
||||||
<table id="controls">
|
<table id="controls">
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue