From a1f79bb2e2ca0944960cce9ec99cf60a43f84d1e Mon Sep 17 00:00:00 2001
From: nightwing <amirjanyan@gmail.com>
Date: Thu, 31 May 2012 23:40:11 +0400
Subject: [PATCH] update readme and demo

---
 Makefile.dryice.js        |  12 +--
 Readme.md                 |  62 +++++----------
 demo/kitchen-sink/demo.js | 154 +++++++++++++++++++-------------------
 index.html                |   2 +-
 kitchen-sink.html         |  18 +++--
 5 files changed, 113 insertions(+), 135 deletions(-)

diff --git a/Makefile.dryice.js b/Makefile.dryice.js
index 39fd5b2a..547c5b1a 100755
--- a/Makefile.dryice.js
+++ b/Makefile.dryice.js
@@ -176,14 +176,10 @@ function demo() {
     }
     var changeComments = function(data) {
             return (data
-                .replace("DEVEL-->", "")
-                .replace("<!--DEVEL", "")
-                .replace("PACKAGE-->", "")
-                .replace("<!--PACKAGE", "")
-                .replace("DEVEL*/", "")
-                .replace("/*DEVEL", "")
-                .replace("PACKAGE*/", "")
-                .replace("/*PACKAGE", "")
+                .replace(/<!\-\-DEVEL[\d\D]*?DEVEL\-\->/g, "")
+                .replace(/PACKAGE\-\->|<!\-\-PACKAGE/g, "")
+                .replace(/\/\*DEVEL[\d\D]*?DEVEL\*\//g, "")
+                .replace(/PACKAGE\*\/|\/\*PACKAGE/g, "")
                 .replace("%version%", version)
                 .replace("%commit%", ref)
             );
diff --git a/Readme.md b/Readme.md
index 68edb3d0..f6378ad2 100644
--- a/Readme.md
+++ b/Readme.md
@@ -10,7 +10,7 @@ Features
 * Automatic indent and outdent
 * An optional command line
 * Handles huge documents (100,000 lines and more are no problem)
-* Fully customizable key bindings including VI and Emacs modes
+* Fully customizable key bindings including VIM and Emacs modes
 * Themes (TextMate themes can be imported)
 * Search and replace with regular expressions
 * Highlight matching parentheses
@@ -18,20 +18,16 @@ Features
 * Displays hidden characters
 * Drag and drop text using the mouse
 * Line wrapping
-* Unstructured / user code folding
-* Live syntax checker (currently JavaScript/CoffeeScript)
+* Code folding
+* Multiple selections
+* Live syntax checker (currently JavaScript/CoffeeScript/Css/XQuery)
 
 Take Ace for a spin!
 --------------------
 
-Check out the Ace live [demo](http://ajaxorg.github.com/ace/) or get a [Cloud9 IDE account](http://run.cloud9ide.com) to experience Ace while editing one of your own GitHub projects.
+Check out the Ace live [demo](http://ajaxorg.github.com/ace-builds/kitchen-sink.html) or get a [Cloud9 IDE account](http://c9.io) 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
--------
-
-Previously known as “Bespin” and “Skywriter” it’s now known as Ace (Ajax.org Cloud9 Editor)! Bespin and Ace started as two independent projects, both aiming to build a no-compromise code editor component for the web. Bespin started as part of Mozilla Labs and was based on the canvas tag, while Ace is the Editor component of the Cloud9 IDE and is using the DOM for rendering. After the release of Ace at JSConf.eu 2010 in Berlin the Skywriter team decided to merge Ace with a simplified version of Skywriter's plugin system and some of Skywriter's extensibility points. All these changes have been merged back to Ace. Both Ajax.org and Mozilla are actively developing and maintaining Ace.
+If you want, you can use Ace as a textarea replacement thanks to the [Ace Bookmarklet](http://ajaxorg.github.com/ace-builds/textarea/editor.html).
 
 Getting the code
 ----------------
@@ -40,14 +36,13 @@ Ace is a community project. We actively encourage and support contributions. The
 
 ```bash
     git clone git://github.com/ajaxorg/ace.git
-    cd ace
-    git submodule update --init --recursive
 ```
 
 Embedding Ace
 -------------
 
-Ace can be easily embedded into any existing web page. The Ace git repository ships with a pre-packaged version of Ace inside of the `build` directory. The same packaged files are also available as a separate [download](https://github.com/ajaxorg/ace/downloads). Simply copy the contents of the `src` subdirectory somewhere into your project and take a look at the included demos of how to use Ace.
+Ace can be easily embedded into any existing web page. You can either use one of pre-packaged versions of [ace](https://github.com/ajaxorg/ace-builds/) (just copy one of `src*` subdirectories somewhere into your project), or use requireJS to load contents of [lib/ace](https://github.com/ajaxorg/ace/tree/master/lib/ace) as `ace`
+
 
 The easiest version is simply:
 
@@ -55,9 +50,7 @@ The easiest version is simply:
     <div id="editor">some text</div>
     <script src="src/ace.js" type="text/javascript" charset="utf-8"></script>
     <script>
-    window.onload = function() {
         var editor = ace.edit("editor");
-    };
     </script>
 ```
 
@@ -96,10 +89,14 @@ Then the mode can be used like this:
     editor.getSession().setMode(new JavaScriptMode());
 ```
 
+and take a look at the one of [included](https://github.com/ajaxorg/ace-builds/blob/master/editor.html) [demos](https://github.com/ajaxorg/ace/blob/master/demo/kitchen-sink/demo.js) of how to use Ace.
+
 Documentation
 -------------
 
-You find a lot more sample code in the [demo app](https://github.com/ajaxorg/ace/blob/master/demo/demo.js).
+You can find api documentation at [http://ajaxorg.github.com/ace/api/index.html](http://ajaxorg.github.com/ace/api/index.html).
+
+And a lot more sample code in the [demo app](https://github.com/ajaxorg/ace/blob/master/demo/kitchen-sink/demo.js).
 
 There is also some documentation on the [wiki page](https://github.com/ajaxorg/ace/wiki).
 
@@ -126,42 +123,17 @@ The editor can then be opened at http://localhost:8888/index.html.
 Package Ace
 -----------
 
-To package Ace we use the dryice build tool developed by the Mozilla Skywriter team. Before you can build you need to make sure that the submodules are up to date.
+To package Ace we use the dryice build tool developed by the Mozilla Skywriter team. Make sure you at latest version of dryice
 
 ```bash
-    git submodule update --init --recursive
-```
-
-Make sure you at least version 0.3.0 of dryice
-
-```bash
-    npm install dryice
-```
-
-Afterwards Ace can be built by calling
-
-```bash
-    ./Makefile.dryice.js normal
-```
-
-The packaged Ace will be put in the 'build' folder.
-
-To build the bookmarklet version execute
-
-```bash
-    ./Makefile.dryice.js bm
+    npm install
+    node ./Makefile.dryice.js ;; -m to minify, -nc to use namespaced requre, -target ./path/to/build/dir
 ```
 
 Running the Unit Tests
 ----------------------
 
-The Ace unit tests run on node.js. Before the first run a couple of node modules have to be installed. The easiest way to do this is by using the node package manager (npm). In the Ace base directory simply call
-
-```bash
-    npm link .
-```
-
-To run the tests call:
+The Ace unit tests can run on node.js. Assuming you have already done `npm install`, just call:
 
 ```bash
     node lib/ace/test/all.js
diff --git a/demo/kitchen-sink/demo.js b/demo/kitchen-sink/demo.js
index 845d7804..405a89bb 100644
--- a/demo/kitchen-sink/demo.js
+++ b/demo/kitchen-sink/demo.js
@@ -66,7 +66,7 @@ if (location.protocol == "file:")
     EditSession.prototype.$useWorker = false;
 
 /************** modes ***********************/
-var modesByName;
+var modes = [];
 function getModeFromPath(path) {
     var mode = modesByName.text;
     for (var i = 0; i < modes.length; i++) {
@@ -82,57 +82,60 @@ var Mode = function(name, desc, extensions) {
     this.name = name;
     this.desc = desc;
     this.mode = "ace/mode/" + name;
-    this.extRe = new RegExp("^.*\\.(" + extensions.join("|") + ")$", "g");
+    this.extRe = new RegExp("^.*\\.(" + extensions + ")$", "g");
 };
 
 Mode.prototype.supportsFile = function(filename) {
     return filename.match(this.extRe);
 };
 
-var modes = [
-    new Mode("c_cpp", "C/C++", ["c", "cpp", "cxx", "h", "hpp"]),
-    new Mode("clojure", "Clojure", ["clj"]),
-    new Mode("coffee", "CoffeeScript", ["coffee"]),
-    new Mode("coldfusion", "ColdFusion", ["cfm"]),
-    new Mode("csharp", "C#", ["cs"]),
-    new Mode("css", "CSS", ["css"]),
-    new Mode("golang", "Go", ["go"]),
-    new Mode("groovy", "Groovy", ["groovy"]),
-    new Mode("haxe", "haXe", ["hx"]),
-    new Mode("html", "HTML", ["html", "htm"]),
-    new Mode("java", "Java", ["java"]),
-    new Mode("diff", "Diff", ["diff", "patch"]),
-    new Mode("javascript", "JavaScript", ["js"]),
-    new Mode("json", "JSON", ["json"]),
-    new Mode("latex", "LaTeX", ["tex"]),
-    new Mode("less", "LESS", ["less"]),
-    new Mode("lua", "Lua", ["lua"]),
-    new Mode("liquid", "Liquid", ["liquid"]),
-    new Mode("markdown", "Markdown", ["md", "markdown"]),
-    new Mode("ocaml", "OCaml", ["ml", "mli"]),
-    new Mode("scad", "OpenSCAD", ["scad"]),
-    new Mode("perl", "Perl", ["pl", "pm"]),
-    new Mode("pgsql", "pgSQL", ["pgsql", "sql"]),
-    new Mode("php", "PHP", ["php"]),
-    new Mode("powershell", "Powershell", ["ps1"]),
-    new Mode("python", "Python", ["py"]),
-    new Mode("scala", "Scala", ["scala"]),
-    new Mode("scss", "SCSS", ["scss"]),
-    new Mode("ruby", "Ruby", ["rb"]),
-    new Mode("sql", "SQL", ["sql"]),
-    new Mode("svg", "SVG", ["svg"]),
-    new Mode("text", "Text", ["txt"]),
-    new Mode("textile", "Textile", ["textile"]),
-    new Mode("xml", "XML", ["xml"]),
-    new Mode("sh", "SH", ["sh"]),
-    new Mode("xquery", "XQuery", ["xq"]),
-    new Mode("yaml", "YAML", ["yaml"])
-];
+var modesByName = {
+    coffee:     ["CoffeeScript" , "coffee|^Cakefile"],
+    coldfusion: ["ColdFusion"   , "cfm"],
+    csharp:     ["C#"           , "cs"],
+    css:        ["CSS"          , "css"],
+    diff:       ["Diff"         , "diff|patch"],
+    golang:     ["Go"           , "go"],
+    groovy:     ["Groovy"       , "groovy"],
+    haxe:       ["haXe"         , "hx"],
+    html:       ["HTML"         , "htm|html|xhtml"],
+    c_cpp:      ["C/C++"        , "c|cc|cpp|cxx|h|hh|hpp"],
+    clojure:    ["Clojure"      , "clj"],
+    java:       ["Java"         , "java"],
+    javascript: ["JavaScript"   , "js"],
+    json:       ["JSON"         , "json"],
+    latex:      ["LaTeX"        , "latex|tex|ltx|bib"],
+    less:       ["LESS"         , "less"],
+    liquid:     ["Liquid"       , "liquid"],
+    lua:        ["Lua"          , "lua"],
+    markdown:   ["Markdown"     , "md|markdown"],
+    ocaml:      ["OCaml"        , "ml|mli"],
+    perl:       ["Perl"         , "pl|pm"],
+    pgsql:      ["pgSQL"        , "pgsql"],
+    php:        ["PHP"          , "php|phtml"],
+    powershell: ["Powershell"   , "ps1"],
+    python:     ["Python"       , "py"],
+    ruby:       ["Ruby"         , "ru|gemspec|rake|rb"],
+    scad:       ["OpenSCAD"     , "scad"],
+    scala:      ["Scala"        , "scala"],
+    scss:       ["SCSS"         , "scss|sass"],
+    sh:         ["SH"           , "sh|bash|bat"],
+    sql:        ["SQL"          , "sql"],
+    svg:        ["SVG"          , "svg"],
+    text:       ["Text"         , "txt"],
+    textile:    ["Textile"      , "textile"],
+    xml:        ["XML"          , "xml|rdf|rss|wsdl|xslt|atom|mathml|mml|xul|xbl"],
+    xquery:     ["XQuery"       , "xq"],
+    yaml:       ["YAML"         , "yaml"]
+};
+
+for (var name in modesByName) {
+    var mode = modesByName[name];
+    mode = new Mode(name, mode[0], mode[1])
+    modesByName[name] = mode;
+    modes.push(mode);
+}
 
-modesByName = {};
-modes.forEach(function(m) {
-    modesByName[m.name] = m;
-});
 
 /*********** demo documents ***************************/
 var fileCache = {};
@@ -259,18 +262,6 @@ window.env = env;
 window.editor = window.ace = env.editor;
 env.editor.setAnimatedScroll(true);
 
-var consoleHight = 20;
-function onResize() {
-    var left = env.split.$container.offsetLeft;
-    var width = document.documentElement.clientWidth - left;
-    container.style.width = width + "px";
-    container.style.height = document.documentElement.clientHeight - consoleHight + "px";
-    env.split.resize();
-
-    consoleEl.style.width = width + "px";
-    cmdLine.resize()
-}
-
 var consoleEl = dom.createElement("div");
 container.parentNode.appendChild(consoleEl);
 consoleEl.style.position="fixed"
@@ -331,9 +322,6 @@ cmdLine.commands.bindKeys({
 
 cmdLine.commands.removeCommands(["find", "goToLine", "findAll", "replace", "replaceAll"])
 
-window.onresize = onResize;
-onResize();
-
 /**
  * This demonstrates how you can define commands and bind shortcuts to them.
  */
@@ -368,6 +356,22 @@ var keybindings = {
 
 
 
+/*********** manage layout ***************************/
+var consoleHight = 20;
+function onResize() {
+    var left = env.split.$container.offsetLeft;
+    var width = document.documentElement.clientWidth - left;
+    container.style.width = width + "px";
+    container.style.height = document.documentElement.clientHeight - consoleHight + "px";
+    env.split.resize();
+
+    consoleEl.style.width = width + "px";
+    cmdLine.resize()
+}
+
+window.onresize = onResize;
+onResize();
+
 /*********** options pane ***************************/
 var docEl = document.getElementById("doc");
 var modeEl = document.getElementById("mode");
@@ -654,24 +658,22 @@ event.addListener(container, "drop", function(e) {
     var file;
     try {
         file = e.dataTransfer.files[0];
+        if (window.FileReader) {
+            var reader = new FileReader();
+            reader.onload = function() {
+                var mode = getModeFromPath(file.name);
+
+                env.editor.session.doc.setValue(reader.result);
+                modeEl.value = mode.name;
+                env.editor.session.setMode(mode.mode);
+                env.editor.session.modeName = mode.name;
+            };
+            reader.readAsText(file);
+        }
+        return event.preventDefault(e);
     } catch(err) {
-        return event.stopEvent();
+        return event.stopEvent(e);
     }
-
-    if (window.FileReader) {
-        var reader = new FileReader();
-        reader.onload = function() {
-            var mode = getModeFromPath(file.name);
-
-            env.editor.session.doc.setValue(reader.result);
-            modeEl.value = mode.name;
-            env.editor.session.setMode(mode.mode);
-            env.editor.session.modeName = mode.name;
-        };
-        reader.readAsText(file);
-    }
-
-    return event.preventDefault(e);
 });
 
 // add multiple cursor support to editor
diff --git a/index.html b/index.html
index d69b2af8..34abb971 100644
--- a/index.html
+++ b/index.html
@@ -110,7 +110,7 @@
  
                     <h2>Take Ace for a spin!</h2> 
                     <div class="divider"></div> 
-<p>Check out the <a href="build/kitchen-sink.html">Ace live demo</a> or get a <a href="http://c9.io">Cloud9 IDE account</a> to experience Ace while editing one of your own GitHub projects.</p> 
+<p>Check out the <a href="http://ajaxorg.github.com/ace-builds/kitchen-sink.html">Ace live demo</a> or get a <a href="http://c9.io">Cloud9 IDE account</a> to experience Ace while editing one of your own GitHub projects.</p> 
  
                     <h2>History</h2> 
                     <div class="divider"></div> 
diff --git a/kitchen-sink.html b/kitchen-sink.html
index 46765b38..55b43635 100644
--- a/kitchen-sink.html
+++ b/kitchen-sink.html
@@ -13,9 +13,19 @@
       commit  %commit%
 
     -->
+
+    <!--DEVEL-->
+      <link rel="stylesheet" href="demo/kitchen-sink/styles.css" type="text/css" media="screen" charset="utf-8">
+    <!--DEVEL-->
+
+    <!--PACKAGE
+      <link rel="stylesheet" href="kitchen-sink/styles.css" type="text/css" media="screen" charset="utf-8">
+    PACKAGE-->
 </head>
 <body>
-  <img id="logo" src="demo/kitchen-sink/logo.png">
+  <a href="http://ajaxorg.github.com/ace/" >
+    <img id="logo" src="demo/kitchen-sink/logo.png">
+  </a> 
   <table id="controls">
     <tr>
       <td>
@@ -216,8 +226,7 @@
 </div>
   <div id="editor"></div>
 
-<!-- DEVEL-->
-  <link rel="stylesheet" href="demo/kitchen-sink/styles.css" type="text/css" media="screen" charset="utf-8">
+<!--DEVEL-->
   <script type="text/javascript">
       var require = {
           baseUrl: window.location.protocol + "//" + window.location.host + window.location.pathname.split("/").slice(0, -1).join("/"),
@@ -228,10 +237,9 @@
   </script>
   <script src="demo/kitchen-sink/require.js" data-main="demo/kitchen-sink/demo" type="text/javascript"></script>
 
-<!--DEVEL -->
+<!--DEVEL-->
 
 <!--PACKAGE
-  <link rel="stylesheet" href="kitchen-sink/styles.css" type="text/css" media="screen" charset="utf-8">
   <script src="src/ace.js" data-ace-base="src" type="text/javascript" charset="utf-8"></script>
   <script src="src/keybinding-vim.js"></script>
   <script src="src/keybinding-emacs.js"></script>