jyapayne/ace
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge remote-tracking branch 'remotes/origin/statusbar'

Browse source
This commit is contained in:
nightwing 2013-04-13 22:30:24 +04:00
commit 41e1f08dfe
6 changed files with 116 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

3
demo/demo_helper.js Normal file
View file

@ -0,0 +1,3 @@
ace.require("ace/lib/net").get(document.baseURI, function(t){
editor.setValue(t, 1);
})

2
demo/kitchen-sink/demo.js
View file

@ -458,7 +458,7 @@ event.addListener(container, "drop", function(e) {
var StatusBar = require("./statusbar").StatusBar; var StatusBar = require("ace/ext/statusbar").StatusBar;
new StatusBar(env.editor, cmdLine.container); new StatusBar(env.editor, cmdLine.container);

48
demo/kitchen-sink/statusbar.js
View file

@ -1,48 +0,0 @@
define(function(require, exports, module) {
"use strict";
/** simple statusbar **/
var dom = require("ace/lib/dom");
var lang = require("ace/lib/lang");
var StatusBar = function(editor, parentNode) {
this.element = dom.createElement("div");
this.element.style.cssText = "color: gray; position:absolute; right:0; border-left:1px solid";
parentNode.appendChild(this.element);
var statusUpdate = lang.delayedCall(function(){
this.updateStatus(editor)
}.bind(this));
editor.on("changeStatus", function() {
statusUpdate.schedule(100);
});
editor.on("changeSelection", function() {
statusUpdate.schedule(100);
});
};
(function(){
this.updateStatus = function(editor) {
var status = [];
function add(str, separator) {
str && status.push(str, separator || "|");
}
if (editor.$vimModeHandler)
add(editor.$vimModeHandler.getStatusText());
else if (editor.commands.recording)
add("REC");
var c = editor.selection.lead;
add(c.row + ":" + c.column, " ");
if (!editor.selection.isEmpty()) {
var r = editor.getSelectionRange();
add("(" + (r.end.row - r.start.row) + ":" +(r.end.column - r.start.column) + ")");
}
status.pop();
this.element.textContent = status.join("");
};
}).call(StatusBar.prototype);
exports.StatusBar = StatusBar;
});

6
demo/kitchen-sink/styles.css
View file

@ -41,4 +41,10 @@ body {
#controls td + td { #controls td + td {
text-align: left; text-align: left;
}
.ace_status-indicator {
color: gray;
position: absolute;
right: 0;
border-left: 1px solid;
} }

57
demo/statusbar.html Normal file
View file

@ -0,0 +1,57 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ACE Editor StatusBar Demo</title>
<style type="text/css" media="screen">
body {
overflow: hidden;
}
#editor {
margin: 0;
position: absolute;
top: 0;
bottom: 20px;
left: 0;
right: 0;
}
#statusBar {
margin: 0;
padding: 0;
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 20px;
background-color: rgb(245, 245, 245);
color: gray;
}
.ace_status-indicator {
color: gray;
position: absolute;
right: 0;
border-left: 1px solid;
}
</style>
</head>
<body>
<pre id="editor"></pre>
<div id="statusBar">ace rocks!</div>
<script src="../build/src-noconflict/ace.js"></script>
<script src="../build/src-noconflict/ext-statusbar.js"></script>
<script>
var editor = ace.edit("editor");
var StatusBar = ace.require('ace/ext/statusbar').StatusBar;
// create a simple selection status indicator
var statusBar = new StatusBar(editor, document.getElementById('statusBar'));
editor.setTheme("ace/theme/dawn");
editor.session.setMode("ace/mode/html");
</script>
<script src="./demo_helper.js"></script>
</body>
</html>

49
lib/ace/ext/statusbar.js Normal file
View file

@ -0,0 +1,49 @@
define(function(require, exports, module) {
"use strict";
/** simple statusbar **/
var dom = require("ace/lib/dom");
var lang = require("ace/lib/lang");
var StatusBar = function(editor, parentNode) {
this.element = dom.createElement("div");
this.element.className = "ace_status-indicator";
this.element.style.cssText = "display: inline-block;";
parentNode.appendChild(this.element);
var statusUpdate = lang.delayedCall(function(){
this.updateStatus(editor)
}.bind(this));
editor.on("changeStatus", function() {
statusUpdate.schedule(100);
});
editor.on("changeSelection", function() {
statusUpdate.schedule(100);
});
};
(function(){
this.updateStatus = function(editor) {
var status = [];
function add(str, separator) {
str && status.push(str, separator || "|");
}
if (editor.$vimModeHandler)
add(editor.$vimModeHandler.getStatusText());
else if (editor.commands.recording)
add("REC");
var c = editor.selection.lead;
add(c.row + ":" + c.column, " ");
if (!editor.selection.isEmpty()) {
var r = editor.getSelectionRange();
add("(" + (r.end.row - r.start.row) + ":" +(r.end.column - r.start.column) + ")");
}
status.pop();
this.element.textContent = status.join("");
};
}).call(StatusBar.prototype);
exports.StatusBar = StatusBar;
});