зеркало из https://github.com/mozilla/ace.git
Add link to Ace Bookmarklet Builder and add some notes on how to use the bookmarklet
This commit is contained in:
Родитель
e4d1d3fedc
Коммит
c23c5713e1
|
@ -22,6 +22,8 @@ Take Ace for a spin!
|
|||
|
||||
Check out the Ace live [demo](http://ajaxorg.github.com/ace/build/editor.html) or get a [Cloud9 IDE account](http://run.cloud9ide.com) to experience Ace while editing one of your own GitHub projects.
|
||||
|
||||
If you want, you can use Ace as a textarea replacement thanks to the [Ace Bookmarklet][http://ajaxorg.github.com/ace/build/textarea/editor.html].
|
||||
|
||||
History
|
||||
-------
|
||||
|
||||
|
@ -49,19 +51,19 @@ The easiest version is simply:
|
|||
var editor = ace.edit("editor");
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
To change the theme simply include the Theme's JavaScript file
|
||||
|
||||
<script src="src/theme-twilight.js" type="text/javascript" charset="utf-8"></script>
|
||||
|
||||
|
||||
and configure the editor to use the theme:
|
||||
|
||||
editor.setTheme("ace/theme/twilight");
|
||||
|
||||
|
||||
By default the editor only supports plain text mode. However all other language modes are available as separate modules. After including the mode's Javascript file
|
||||
|
||||
<script src="src/mode-javascript.js" type="text/javascript" charset="utf-8"></script>
|
||||
|
||||
|
||||
the mode can be used like this:
|
||||
|
||||
var JavaScriptMode = require("ace/mode/javascript").Mode;
|
||||
|
|
|
@ -7,6 +7,25 @@
|
|||
</head>
|
||||
<body>
|
||||
|
||||
<h1>Ace Bookmarklet Builder</h1>
|
||||
|
||||
<p>
|
||||
WARNING: Currently, this is only fully supported in non IE browsers.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
How to use it:
|
||||
<ul>
|
||||
<li>Select the options below as you want them to be by default.</li>
|
||||
<li>Enter the "SourceUrl" where you placed the source data which you find under build/textarea/src (you can also leave the default to server the scripts from GitHub).</li>
|
||||
<li>Click the "Build Link" button to generate your custom Ace Bookmarklet.</li>
|
||||
<li>Drag the generated link to your toolbar or store it somewhere else.</li>
|
||||
<li>Go to a page with an textarea element and click the bookmarklet - wait a little bit till the files are loaded.</li>
|
||||
<li>Click 3 times on the textarea you want to replace - Ace will replace it.</li>
|
||||
<li>To change settings, just click the red icon in the bottom right corner.</li>
|
||||
</ul>
|
||||
</p>
|
||||
|
||||
<textarea id="textarea" style="width:300px; height:300px">
|
||||
function foo() {
|
||||
var bar = true;
|
||||
|
@ -14,7 +33,7 @@
|
|||
</textarea><br>
|
||||
SourceUrl: <input id="srcURL" value="http://ajaxorg.github.com/ace/build/textarea/src/"></input>
|
||||
|
||||
<button id="buBuild">Build link</button> <br> <a href="#"></a>
|
||||
<button id="buBuild">Build Link</button> <br> <a href="#"></a>
|
||||
|
||||
<script>
|
||||
function inject() {
|
||||
|
@ -52,13 +71,11 @@ function inject() {
|
|||
};
|
||||
|
||||
load.scripts = {};
|
||||
|
||||
window.__ace_shadowed_load__ = load;
|
||||
|
||||
load('ace-uncompressed.js', 'text!ace/css/editor.css', function() {
|
||||
load('ace.js', 'text!ace/css/editor.css', function() {
|
||||
var ace = window.__ace_shadowed__;
|
||||
var Event = ace.require('pilot/event');
|
||||
ace.options.mode = "javascript";
|
||||
var areas = document.getElementsByTagName("textarea");
|
||||
for (var i = 0; i < areas.length; i++) {
|
||||
Event.addListener(areas[i], "click", function(e) {
|
||||
|
|
Загрузка…
Ссылка в новой задаче