Built for Code
-
ACE is a embeddable code editor written in JavaScript.
- It matches and extends the features, usability and performance of existing
- native editors such as Sublime, Vim or TextMate. It can be easily embedded
+
ACE is an embeddable code editor written in JavaScript.
+ It matches the features and performance of native
+ editors such as Sublime, Vim and TextMate. It can be easily embedded
in any web page and JavaScript application. ACE is maintained as the
primary editor for Cloud9 IDE
and is the successor of the Mozilla Skywriter (Bespin) project.
-
Using ACE
-
Want ACE on your own site or web app? Check out our embedding
- guide to get started right away!
-
Features
+
+
/**
+ * In fact, you're looking at ACE right now.
+ *
+ * We are currently showing off the JavaScript mode. ACE has support for 45
+ * language modes and 24 color themes!
+ */
+
+var resultString = "Hello, ACE! The result of your math is: ";
+function add(x, y) {
+ var result = x + y;
+ return resultString + result;
+}
+
+var addResult = add(3, 2);
+console.log(addResult);
+
+
Put this on your own site
+
Looking for a more full-featured demo? The kitchen sink
+ demonstrates all ACE features.
+
ACE Features
- Syntax highlighting
- Auto indentation and outdent
@@ -80,10 +98,6 @@
- Displays hidden characters
- Highlight selected word
-
Take ACE for a spin!
-
The kitchen sink demo
- allows you to test all ACE features. You can check out the code for the
- demo on GitHub.
Getting the code
ACE is a community project. We actively encourage and support
contributions! The ACE source code is hosted on GitHub
@@ -127,8 +141,10 @@
<style type="text/css" media="screen">
#editor {
position: absolute;
- width: 500px;
- height: 400px;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
}
</style>
</head>
@@ -159,15 +175,14 @@
Nearly Everything you Want to do with ACE
-
This is a collection of common operations developers perform on ACE.
- In all of these cases ACE has been invoked exactly
+ In all of these cases ACE has been invoked exactly
as shown on the embedding guide.
Setting Themes
To change the theme, configure the editor to use the theme using its module name. The theme file will be loaded on demand:
editor.setTheme("ace/theme/twilight");
- Setting Other Language Modes
+ Setting the Programming Language Mode
By default, the editor supports plain text mode. All other language modes are available as separate modules. Modes are also loaded on demand like this:
<script src="src/mode-javascript.js" type="text/javascript" charset="utf-8">
@@ -321,7 +336,7 @@ editor.replace('bar');
exec: function(editor) {
//...
}
-});
+});
API Reference
@@ -332,32 +347,97 @@ editor.replace('bar');
ACE is used all over the web in all kinds of production applications. Here is
just a small sampling: