ace-rails-ap 4.1.3 → 4.4

data/vendor/assets/javascripts/ace/ext-rtl.js

@@ -0,0 +1,122 @@
+define("ace/ext/rtl",["require","exports","module","ace/editor","ace/config"], function(require, exports, module) {
+"use strict";
+
+var commands = [{
+    name: "leftToRight",
+    bindKey: { win: "Ctrl-Alt-Shift-L", mac: "Command-Alt-Shift-L" },
+    exec: function(editor) {
+        editor.session.$bidiHandler.setRtlDirection(editor, false);
+    },
+    readOnly: true
+}, {
+    name: "rightToLeft",
+    bindKey: { win: "Ctrl-Alt-Shift-R",  mac: "Command-Alt-Shift-R" },
+    exec: function(editor) {
+        editor.session.$bidiHandler.setRtlDirection(editor, true);
+    },
+    readOnly: true
+}];
+
+var Editor = require("../editor").Editor;
+require("../config").defineOptions(Editor.prototype, "editor", {
+    rtlText: {
+        set: function(val) {
+            if (val) {
+                this.on("change", onChange);
+                this.on("changeSelection", onChangeSelection);
+                this.renderer.on("afterRender", updateLineDirection);
+                this.commands.on("exec", onCommandEmitted);
+                this.commands.addCommands(commands);
+            } else {
+                this.off("change", onChange);
+                this.off("changeSelection", onChangeSelection);
+                this.renderer.off("afterRender", updateLineDirection);
+                this.commands.off("exec", onCommandEmitted);
+                this.commands.removeCommands(commands);
+                clearTextLayer(this.renderer);
+            }
+            this.renderer.updateFull();
+        }
+    },
+    rtl: {
+        set: function(val) {
+            this.session.$bidiHandler.$isRtl = val;
+            if (val) {
+                this.setOption("rtlText", false);
+                this.renderer.on("afterRender", updateLineDirection);
+                this.session.$bidiHandler.seenBidi = true;
+            } else {
+                this.renderer.off("afterRender", updateLineDirection);
+                clearTextLayer(this.renderer);
+            }
+            this.renderer.updateFull();
+        }
+    }
+});
+function onChangeSelection(e, editor) {
+    var lead = editor.getSelection().lead;
+    if (editor.session.$bidiHandler.isRtlLine(lead.row)) {
+        if (lead.column === 0) {
+            if (editor.session.$bidiHandler.isMoveLeftOperation && lead.row > 0) {
+                editor.getSelection().moveCursorTo(lead.row - 1, editor.session.getLine(lead.row - 1).length);
+            } else {
+                if (editor.getSelection().isEmpty())
+                    lead.column += 1;
+                else
+                    lead.setPosition(lead.row, lead.column + 1);
+            }
+        }
+    }
+}
+
+function onCommandEmitted(commadEvent) {
+    commadEvent.editor.session.$bidiHandler.isMoveLeftOperation = /gotoleft|selectleft|backspace|removewordleft/.test(commadEvent.command.name);
+}
+function onChange(delta, editor) {
+    var session = editor.session;
+    session.$bidiHandler.currentRow = null;
+    if (session.$bidiHandler.isRtlLine(delta.start.row) && delta.action === 'insert' && delta.lines.length > 1) {
+        for (var row = delta.start.row; row < delta.end.row; row++) {
+            if (session.getLine(row + 1).charAt(0) !== session.$bidiHandler.RLE)
+                session.doc.$lines[row + 1] = session.$bidiHandler.RLE + session.getLine(row + 1);
+        }
+    }
+}
+
+function updateLineDirection(e, renderer) {
+    var session = renderer.session;
+    var $bidiHandler = session.$bidiHandler;
+    var cells = renderer.$textLayer.$lines.cells;
+    var width = renderer.layerConfig.width - renderer.layerConfig.padding + "px";
+    cells.forEach(function(cell) {
+        var style = cell.element.style;
+        if ($bidiHandler && $bidiHandler.isRtlLine(cell.row)) {
+            style.direction = "rtl";
+            style.textAlign = "right";
+            style.width = width;
+        } else {
+            style.direction = "";
+            style.textAlign = "";
+            style.width = "";
+        }
+    });
+}
+
+function clearTextLayer(renderer) {
+    var lines = renderer.$textLayer.$lines;
+    lines.cells.forEach(clear);
+    lines.cellCache.forEach(clear);
+    function clear(cell) {
+        var style = cell.element.style;
+        style.direction = style.textAlign = style.width = "";
+    }
+}
+
+});                (function() {
+                    window.require(["ace/ext/rtl"], function(m) {
+                        if (typeof module == "object" && typeof exports == "object" && module) {
+                            module.exports = m;
+                        }
+                    });
+                })();
+            

data/vendor/assets/javascripts/ace/ext-searchbox.js

@@ -45,7 +45,6 @@ background-color: white;\
 color: black;\
 border: 1px solid #cbcbcb;\
 border-right: 0 none;\
-box-sizing: border-box!important;\
 outline: 0;\
 padding: 0;\
 font-size: inherit;\
@@ -54,6 +53,8 @@ line-height: inherit;\
 padding: 0 6px;\
 min-width: 17em;\
 vertical-align: top;\
+min-height: 1.8em;\
+box-sizing: content-box;\
 }\
 .ace_searchbtn {\
 border: 1px solid #cbcbcb;\
@@ -66,7 +67,6 @@ border-left: 1px solid #dcdcdc;\
 cursor: pointer;\
 margin: 0;\
 position: relative;\
-box-sizing: content-box!important;\
 color: #666;\
 }\
 .ace_searchbtn:last-child {\
@@ -162,39 +162,38 @@ var MAX_COUNT = 999;
 
 dom.importCssString(searchboxCss, "ace_searchbox");
 
-var html = '<div class="ace_search right">\
-    <span action="hide" class="ace_searchbtn_close"></span>\
-    <div class="ace_search_form">\
-        <input class="ace_search_field" placeholder="Search for" spellcheck="false"></input>\
-        <span action="findPrev" class="ace_searchbtn prev"></span>\
-        <span action="findNext" class="ace_searchbtn next"></span>\
-        <span action="findAll" class="ace_searchbtn" title="Alt-Enter">All</span>\
-    </div>\
-    <div class="ace_replace_form">\
-        <input class="ace_search_field" placeholder="Replace with" spellcheck="false"></input>\
-        <span action="replaceAndFindNext" class="ace_searchbtn">Replace</span>\
-        <span action="replaceAll" class="ace_searchbtn">All</span>\
-    </div>\
-    <div class="ace_search_options">\
-        <span action="toggleReplace" class="ace_button" title="Toggel Replace mode"\
-            style="float:left;margin-top:-2px;padding:0 5px;">+</span>\
-        <span class="ace_search_counter"></span>\
-        <span action="toggleRegexpMode" class="ace_button" title="RegExp Search">.*</span>\
-        <span action="toggleCaseSensitive" class="ace_button" title="CaseSensitive Search">Aa</span>\
-        <span action="toggleWholeWords" class="ace_button" title="Whole Word Search">\\b</span>\
-        <span action="searchInSelection" class="ace_button" title="Search In Selection">S</span>\
-    </div>\
-</div>'.replace(/> +/g, ">");
-
 var SearchBox = function(editor, range, showReplaceForm) {
     var div = dom.createElement("div");
-    div.innerHTML = html;
+    dom.buildDom(["div", {class:"ace_search right"},
+        ["span", {action: "hide", class: "ace_searchbtn_close"}],
+        ["div", {class: "ace_search_form"},
+            ["input", {class: "ace_search_field", placeholder: "Search for", spellcheck: "false"}],
+            ["span", {action: "findPrev", class: "ace_searchbtn prev"}, "\u200b"],
+            ["span", {action: "findNext", class: "ace_searchbtn next"}, "\u200b"],
+            ["span", {action: "findAll", class: "ace_searchbtn", title: "Alt-Enter"}, "All"]
+        ],
+        ["div", {class: "ace_replace_form"},
+            ["input", {class: "ace_search_field", placeholder: "Replace with", spellcheck: "false"}],
+            ["span", {action: "replaceAndFindNext", class: "ace_searchbtn"}, "Replace"],
+            ["span", {action: "replaceAll", class: "ace_searchbtn"}, "All"]
+        ],
+        ["div", {class: "ace_search_options"},
+            ["span", {action: "toggleReplace", class: "ace_button", title: "Toggle Replace mode",
+                style: "float:left;margin-top:-2px;padding:0 5px;"}, "+"],
+            ["span", {class: "ace_search_counter"}],
+            ["span", {action: "toggleRegexpMode", class: "ace_button", title: "RegExp Search"}, ".*"],
+            ["span", {action: "toggleCaseSensitive", class: "ace_button", title: "CaseSensitive Search"}, "Aa"],
+            ["span", {action: "toggleWholeWords", class: "ace_button", title: "Whole Word Search"}, "\\b"],
+            ["span", {action: "searchInSelection", class: "ace_button", title: "Search In Selection"}, "S"]
+        ]
+    ], div);
     this.element = div.firstChild;
     
     this.setSession = this.setSession.bind(this);
 
     this.$init();
     this.setEditor(editor);
+    dom.importCssString(searchboxCss, "ace_searchbox", editor.container);
 };
 
 (function() {
@@ -205,10 +204,9 @@ var SearchBox = function(editor, range, showReplaceForm) {
     };
     
     this.setSession = function(e) {
-        debugger
         this.searchRange = null;
         this.$syncOptions(true);
-    }
+    };
 
     this.$initElements = function(sb) {
         this.searchBox = sb.querySelector(".ace_search_form");
@@ -287,6 +285,8 @@ var SearchBox = function(editor, range, showReplaceForm) {
             sb.searchInput.focus();
         },
         "Ctrl-H|Command-Option-F": function(sb) {
+            if (sb.editor.getReadOnly())
+                return;
             sb.replaceOption.checked = true;
             sb.$syncOptions();
             sb.replaceInput.focus();
@@ -364,7 +364,7 @@ var SearchBox = function(editor, range, showReplaceForm) {
             this.editor.session.removeMarker(this.searchRangeMarker);
             this.searchRangeMarker = null;
         }
-    }
+    };
 
     this.$syncOptions = function(preventScroll) {
         dom.setCssClass(this.replaceOption, "checked", this.searchRange);
@@ -373,13 +373,15 @@ var SearchBox = function(editor, range, showReplaceForm) {
         dom.setCssClass(this.regExpOption, "checked", this.regExpOption.checked);
         dom.setCssClass(this.wholeWordOption, "checked", this.wholeWordOption.checked);
         dom.setCssClass(this.caseSensitiveOption, "checked", this.caseSensitiveOption.checked);
-        this.replaceBox.style.display = this.replaceOption.checked ? "" : "none";
+        var readOnly = this.editor.getReadOnly();
+        this.replaceOption.style.display = readOnly ? "none" : "";
+        this.replaceBox.style.display = this.replaceOption.checked && !readOnly ? "" : "none";
         this.find(false, false, preventScroll);
     };
 
     this.highlight = function(re) {
         this.editor.session.highlight(re || this.editor.$search.$options.re);
-        this.editor.renderer.updateBackMarkers()
+        this.editor.renderer.updateBackMarkers();
     };
     this.find = function(skipCurrent, backwards, preventScroll) {
         var range = this.editor.find(this.searchInput.value, {
@@ -402,7 +404,7 @@ var SearchBox = function(editor, range, showReplaceForm) {
         var editor = this.editor;
         var regex = editor.$search.$options.re;
         var all = 0;
-        var before = 0
+        var before = 0;
         if (regex) {
             var value = this.searchRange
                 ? editor.session.getTextRange(this.searchRange)
@@ -420,7 +422,7 @@ var SearchBox = function(editor, range, showReplaceForm) {
                 if (last <= offset)
                     before++;
                 if (all > MAX_COUNT)
-                    break
+                    break;
                 if (!m[0]) {
                     regex.lastIndex = last += 1;
                     if (last >= value.length)
@@ -455,7 +457,7 @@ var SearchBox = function(editor, range, showReplaceForm) {
     this.replaceAndFindNext = function() {
         if (!this.editor.getReadOnly()) {
             this.editor.replace(this.replaceInput.value);
-            this.findNext()
+            this.findNext();
         }
     };
     this.replaceAll = function() {
@@ -465,7 +467,7 @@ var SearchBox = function(editor, range, showReplaceForm) {
 
     this.hide = function() {
         this.active = false;
-        this.setSearchRange(null)
+        this.setSearchRange(null);
         this.editor.off("changeSession", this.setSession);
         
         this.element.style.display = "none";
@@ -492,7 +494,7 @@ var SearchBox = function(editor, range, showReplaceForm) {
     this.isFocused = function() {
         var el = document.activeElement;
         return el == this.searchInput || el == this.replaceInput;
-    }
+    };
 }).call(SearchBox.prototype);
 
 exports.SearchBox = SearchBox;
@@ -502,8 +504,11 @@ exports.Search = function(editor, isReplace) {
     sb.show(editor.session.getTextRange(), isReplace);
 };
 
-});
-                (function() {
-                    window.require(["ace/ext/searchbox"], function() {});
+});                (function() {
+                    window.require(["ace/ext/searchbox"], function(m) {
+                        if (typeof module == "object" && typeof exports == "object" && module) {
+                            module.exports = m;
+                        }
+                    });
                 })();
             

data/vendor/assets/javascripts/ace/ext-settings_menu.js

@@ -1,55 +1,120 @@
-define("ace/ext/menu_tools/element_generator",["require","exports","module"], function(require, exports, module) {
+define("ace/ext/menu_tools/overlay_page",["require","exports","module","ace/lib/dom"], function(require, exports, module) {
 'use strict';
-module.exports.createOption = function createOption (obj) {
-    var attribute;
-    var el = document.createElement('option');
-    for(attribute in obj) {
-        if(obj.hasOwnProperty(attribute)) {
-            if(attribute === 'selected') {
-                el.setAttribute(attribute, obj[attribute]);
-            } else {
-                el[attribute] = obj[attribute];
-            }
+var dom = require("../../lib/dom");
+var cssText = "#ace_settingsmenu, #kbshortcutmenu {\
+background-color: #F7F7F7;\
+color: black;\
+box-shadow: -5px 4px 5px rgba(126, 126, 126, 0.55);\
+padding: 1em 0.5em 2em 1em;\
+overflow: auto;\
+position: absolute;\
+margin: 0;\
+bottom: 0;\
+right: 0;\
+top: 0;\
+z-index: 9991;\
+cursor: default;\
+}\
+.ace_dark #ace_settingsmenu, .ace_dark #kbshortcutmenu {\
+box-shadow: -20px 10px 25px rgba(126, 126, 126, 0.25);\
+background-color: rgba(255, 255, 255, 0.6);\
+color: black;\
+}\
+.ace_optionsMenuEntry:hover {\
+background-color: rgba(100, 100, 100, 0.1);\
+transition: all 0.3s\
+}\
+.ace_closeButton {\
+background: rgba(245, 146, 146, 0.5);\
+border: 1px solid #F48A8A;\
+border-radius: 50%;\
+padding: 7px;\
+position: absolute;\
+right: -8px;\
+top: -8px;\
+z-index: 100000;\
+}\
+.ace_closeButton{\
+background: rgba(245, 146, 146, 0.9);\
+}\
+.ace_optionsMenuKey {\
+color: darkslateblue;\
+font-weight: bold;\
+}\
+.ace_optionsMenuCommand {\
+color: darkcyan;\
+font-weight: normal;\
+}\
+.ace_optionsMenuEntry input, .ace_optionsMenuEntry button {\
+vertical-align: middle;\
+}\
+.ace_optionsMenuEntry button[ace_selected_button=true] {\
+background: #e7e7e7;\
+box-shadow: 1px 0px 2px 0px #adadad inset;\
+border-color: #adadad;\
+}\
+.ace_optionsMenuEntry button {\
+background: white;\
+border: 1px solid lightgray;\
+margin: 0px;\
+}\
+.ace_optionsMenuEntry button:hover{\
+background: #f0f0f0;\
+}";
+dom.importCssString(cssText);
+
+module.exports.overlayPage = function overlayPage(editor, contentElement, callback) {
+    var closer = document.createElement('div');
+    var ignoreFocusOut = false;
+
+    function documentEscListener(e) {
+        if (e.keyCode === 27) {
+            close();
         }
     }
-    return el;
-};
-module.exports.createCheckbox = function createCheckbox (id, checked, clss) {
-    var el = document.createElement('input');
-    el.setAttribute('type', 'checkbox');
-    el.setAttribute('id', id);
-    el.setAttribute('name', id);
-    el.setAttribute('value', checked);
-    el.setAttribute('class', clss);
-    if(checked) {
-        el.setAttribute('checked', 'checked');
+
+    function close() {
+        if (!closer) return;
+        document.removeEventListener('keydown', documentEscListener);
+        closer.parentNode.removeChild(closer);
+        if (editor) {
+            editor.focus();
+        }
+        closer = null;
+        callback && callback();
     }
-    return el;
-};
-module.exports.createInput = function createInput (id, value, clss) {
-    var el = document.createElement('input');
-    el.setAttribute('type', 'text');
-    el.setAttribute('id', id);
-    el.setAttribute('name', id);
-    el.setAttribute('value', value);
-    el.setAttribute('class', clss);
-    return el;
-};
-module.exports.createLabel = function createLabel (text, labelFor) {
-    var el = document.createElement('label');
-    el.setAttribute('for', labelFor);
-    el.textContent = text;
-    return el;
-};
-module.exports.createSelection = function createSelection (id, values, clss) {
-    var el = document.createElement('select');
-    el.setAttribute('id', id);
-    el.setAttribute('name', id);
-    el.setAttribute('class', clss);
-    values.forEach(function(item) {
-        el.appendChild(module.exports.createOption(item));
+    function setIgnoreFocusOut(ignore) {
+        ignoreFocusOut = ignore;
+        if (ignore) {
+            closer.style.pointerEvents = "none";
+            contentElement.style.pointerEvents = "auto";
+        }
+    }
+
+    closer.style.cssText = 'margin: 0; padding: 0; ' +
+        'position: fixed; top:0; bottom:0; left:0; right:0;' +
+        'z-index: 9990; ' +
+        (editor ? 'background-color: rgba(0, 0, 0, 0.3);' : '');
+    closer.addEventListener('click', function(e) {
+        if (!ignoreFocusOut) {
+            close();
+        }
+    });
+    document.addEventListener('keydown', documentEscListener);
+
+    contentElement.addEventListener('click', function (e) {
+        e.stopPropagation();
     });
-    return el;
+
+    closer.appendChild(contentElement);
+    document.body.appendChild(closer);
+    if (editor) {
+        editor.blur();
+    }
+    return {
+        close: close,
+        setIgnoreFocusOut: setIgnoreFocusOut
+    };
 };
 
 });
@@ -95,12 +160,15 @@ var supportedModes = {
     ABC:         ["abc"],
     ActionScript:["as"],
     ADA:         ["ada|adb"],
+    Alda:        ["alda"],
     Apache_Conf: ["^htaccess|^htgroups|^htpasswd|^conf|htaccess|htgroups|htpasswd"],
+    Apex:        ["apex|cls|trigger|tgr"],
+    AQL:         ["aql"],
     AsciiDoc:    ["asciidoc|adoc"],
+    ASL:         ["dsl|asl"],
     Assembly_x86:["asm|a"],
     AutoHotKey:  ["ahk"],
     BatchFile:   ["bat|cmd"],
-    Bro:         ["bro"],
     C_Cpp:       ["cpp|c|cc|cxx|h|hh|hpp|ino"],
     C9Search:    ["c9search_results"],
     Cirru:       ["cirru|cr"],
@@ -108,7 +176,11 @@ var supportedModes = {
     Cobol:       ["CBL|COB"],
     coffee:      ["coffee|cf|cson|^Cakefile"],
     ColdFusion:  ["cfm"],
+    Crystal:     ["cr"],
     CSharp:      ["cs"],
+    Csound_Document: ["csd"],
+    Csound_Orchestra: ["orc"],
+    Csound_Score: ["sco"],
     CSS:         ["css"],
     Curly:       ["curly"],
     D:           ["d|di"],
@@ -117,8 +189,7 @@ var supportedModes = {
     Dockerfile:  ["^Dockerfile"],
     Dot:         ["dot"],
     Drools:      ["drl"],
-    Dummy:       ["dummy"],
-    DummySyntax: ["dummy"],
+    Edifact:     ["edi"],
     Eiffel:      ["e|ge"],
     EJS:         ["ejs"],
     Elixir:      ["ex|exs"],
@@ -126,6 +197,8 @@ var supportedModes = {
     Erlang:      ["erl|hrl"],
     Forth:       ["frt|fs|ldr|fth|4th"],
     Fortran:     ["f|f90"],
+    FSharp:      ["fsi|fs|ml|mli|fsx|fsscript"],
+    FSL:         ["fsl"],
     FTL:         ["ftl"],
     Gcode:       ["gcode"],
     Gherkin:     ["feature"],
@@ -138,10 +211,10 @@ var supportedModes = {
     HAML:        ["haml"],
     Handlebars:  ["hbs|handlebars|tpl|mustache"],
     Haskell:     ["hs"],
-    Haskell_Cabal:     ["cabal"],
+    Haskell_Cabal: ["cabal"],
     haXe:        ["hx"],
     Hjson:       ["hjson"],
-    HTML:        ["html|htm|xhtml"],
+    HTML:        ["html|htm|xhtml|vue|we|wpy"],
     HTML_Elixir: ["eex|html.eex"],
     HTML_Ruby:   ["erb|rhtml|html.erb"],
     INI:         ["ini|conf|cfg|prefs"],
@@ -151,8 +224,10 @@ var supportedModes = {
     Java:        ["java"],
     JavaScript:  ["js|jsm|jsx"],
     JSON:        ["json"],
+    JSON5:       ["json5"],
     JSONiq:      ["jq"],
     JSP:         ["jsp"],
+    JSSM:        ["jssm|jssm_state"],
     JSX:         ["jsx"],
     Julia:       ["jl"],
     Kotlin:      ["kt|kts"],
@@ -171,38 +246,50 @@ var supportedModes = {
     Mask:        ["mask"],
     MATLAB:      ["matlab"],
     Maze:        ["mz"],
+    MediaWiki:   ["wiki|mediawiki"],
     MEL:         ["mel"],
+    MIXAL:       ["mixal"],
     MUSHCode:    ["mc|mush"],
     MySQL:       ["mysql"],
+    Nginx:       ["nginx|conf"],
+    Nim:         ["nim"],
     Nix:         ["nix"],
     NSIS:        ["nsi|nsh"],
+    Nunjucks:    ["nunjucks|nunjs|nj|njk"],
     ObjectiveC:  ["m|mm"],
     OCaml:       ["ml|mli"],
     Pascal:      ["pas|p"],
     Perl:        ["pl|pm"],
+    Perl6:       ["p6|pl6|pm6"],
     pgSQL:       ["pgsql"],
-    PHP:         ["php|phtml|shtml|php3|php4|php5|phps|phpt|aw|ctp|module"],
+    PHP:         ["php|inc|phtml|shtml|php3|php4|php5|phps|phpt|aw|ctp|module"],
+    PHP_Laravel_blade: ["blade.php"],
     Pig:         ["pig"],
     Powershell:  ["ps1"],
     Praat:       ["praat|praatscript|psc|proc"],
+    Prisma:      ["prisma"],
     Prolog:      ["plg|prolog"],
     Properties:  ["properties"],
     Protobuf:    ["proto"],
+    Puppet:      ["epp|pp"],
     Python:      ["py"],
+    QML:         ["qml"],
     R:           ["r"],
     Razor:       ["cshtml|asp"],
     RDoc:        ["Rd"],
+    Red:         ["red|reds"],
     RHTML:       ["Rhtml"],
     RST:         ["rst"],
     Ruby:        ["rb|ru|gemspec|rake|^Guardfile|^Rakefile|^Gemfile"],
     Rust:        ["rs"],
     SASS:        ["sass"],
     SCAD:        ["scad"],
-    Scala:       ["scala"],
+    Scala:       ["scala|sbt"],
     Scheme:      ["scm|sm|rkt|oak|scheme"],
     SCSS:        ["scss"],
     SH:          ["sh|bash|^.bashrc"],
     SJS:         ["sjs"],
+    Slim:        ["slim|skim"],
     Smarty:      ["smarty|tpl"],
     snippets:    ["snippets"],
     Soy_Template:["soy"],
@@ -213,22 +300,25 @@ var supportedModes = {
     SVG:         ["svg"],
     Swift:       ["swift"],
     Tcl:         ["tcl"],
+    Terraform:   ["tf", "tfvars", "terragrunt"],
     Tex:         ["tex"],
     Text:        ["txt"],
     Textile:     ["textile"],
     Toml:        ["toml"],
     TSX:         ["tsx"],
-    Twig:        ["twig|swig"],
+    Twig:        ["latte|twig|swig"],
     Typescript:  ["ts|typescript|str"],
     Vala:        ["vala"],
     VBScript:    ["vbs|vb"],
     Velocity:    ["vm"],
     Verilog:     ["v|vh|sv|svh"],
     VHDL:        ["vhd|vhdl"],
+    Visualforce: ["vfp|component|page"],
     Wollok:      ["wlk|wpgm|wtest"],
     XML:         ["xml|rdf|rss|wsdl|xslt|atom|mathml|mml|xul|xbl|xaml"],
     XQuery:      ["xq"],
     YAML:        ["yaml|yml"],
+    Zeek:        ["zeek|bro"],
     Django:      ["html"]
 };
 
@@ -237,10 +327,16 @@ var nameOverrides = {
     CSharp: "C#",
     golang: "Go",
     C_Cpp: "C and C++",
+    Csound_Document: "Csound Document",
+    Csound_Orchestra: "Csound",
+    Csound_Score: "Csound Score",
     coffee: "CoffeeScript",
     HTML_Ruby: "HTML (Ruby)",
     HTML_Elixir: "HTML (Elixir)",
-    FTL: "FreeMarker"
+    FTL: "FreeMarker",
+    PHP_Laravel_blade: "PHP (Blade Template)",
+    Perl6: "Perl 6",
+    AutoHotKey: "AutoHotkey / AutoIt"
 };
 var modesByName = {};
 for (var name in supportedModes) {
@@ -260,9 +356,8 @@ module.exports = {
 
 });
 
-define("ace/ext/themelist",["require","exports","module","ace/lib/fixoldbrowsers"], function(require, exports, module) {
+define("ace/ext/themelist",["require","exports","module"], function(require, exports, module) {
 "use strict";
-require("ace/lib/fixoldbrowsers");
 
 var themeData = [
     ["Chrome"         ],
@@ -276,13 +371,14 @@ var themeData = [
     ["Solarized Light"],
     ["TextMate"       ],
     ["Tomorrow"       ],
-    ["XCode"          ],
+    ["Xcode"          ],
     ["Kuroir"],
     ["KatzenMilch"],
     ["SQL Server"           ,"sqlserver"               , "light"],
     ["Ambiance"             ,"ambiance"                ,  "dark"],
     ["Chaos"                ,"chaos"                   ,  "dark"],
     ["Clouds Midnight"      ,"clouds_midnight"         ,  "dark"],
+    ["Dracula"              ,""                        ,  "dark"],
     ["Cobalt"               ,"cobalt"                  ,  "dark"],
     ["Gruvbox"              ,"gruvbox"                 ,  "dark"],
     ["Green on Black"       ,"gob"                     ,  "dark"],
@@ -292,6 +388,7 @@ var themeData = [
     ["Merbivore Soft"       ,"merbivore_soft"          ,  "dark"],
     ["Mono Industrial"      ,"mono_industrial"         ,  "dark"],
     ["Monokai"              ,"monokai"                 ,  "dark"],
+    ["Nord Dark"            ,"nord_dark"               ,  "dark"],
     ["Pastel on dark"       ,"pastel_on_dark"          ,  "dark"],
     ["Solarized Dark"       ,"solarized_dark"          ,  "dark"],
     ["Terminal"             ,"terminal"                ,  "dark"],
@@ -319,345 +416,399 @@ exports.themes = themeData.map(function(data) {
 
 });
 
-define("ace/ext/menu_tools/add_editor_menu_options",["require","exports","module","ace/ext/modelist","ace/ext/themelist"], function(require, exports, module) {
-'use strict';
-module.exports.addEditorMenuOptions = function addEditorMenuOptions (editor) {
-    var modelist = require('../modelist');
-    var themelist = require('../themelist');
-    editor.menuOptions = {
-        setNewLineMode: [{
-            textContent: "unix",
-            value: "unix"
-        }, {
-            textContent: "windows",
-            value: "windows"
-        }, {
-            textContent: "auto",
-            value: "auto"
-        }],
-        setTheme: [],
-        setMode: [],
-        setKeyboardHandler: [{
-            textContent: "ace",
-            value: ""
-        }, {
-            textContent: "vim",
-            value: "ace/keyboard/vim"
-        }, {
-            textContent: "emacs",
-            value: "ace/keyboard/emacs"
-        }, {
-            textContent: "textarea",
-            value: "ace/keyboard/textarea"
-        }, {
-            textContent: "sublime",
-            value: "ace/keyboard/sublime"
-        }]
-    };
+define("ace/ext/options",["require","exports","module","ace/ext/menu_tools/overlay_page","ace/lib/dom","ace/lib/oop","ace/config","ace/lib/event_emitter","ace/ext/modelist","ace/ext/themelist"], function(require, exports, module) {
+"use strict";
 
-    editor.menuOptions.setTheme = themelist.themes.map(function(theme) {
-        return {
-            textContent: theme.caption,
-            value: theme.theme
-        };
-    });
+require("./menu_tools/overlay_page");
 
-    editor.menuOptions.setMode = modelist.modes.map(function(mode) {
-        return {
-            textContent: mode.name,
-            value: mode.mode
-        };
-    });
-};
+var dom = require("../lib/dom");
+var oop = require("../lib/oop");
+var config = require("../config");
+var EventEmitter = require("../lib/event_emitter").EventEmitter;
+var buildDom = dom.buildDom;
 
+var modelist = require("./modelist");
+var themelist = require("./themelist");
 
+var themes = { Bright: [], Dark: [] };
+themelist.themes.forEach(function(x) {
+    themes[x.isDark ? "Dark" : "Bright"].push({ caption: x.caption, value: x.theme });
 });
 
-define("ace/ext/menu_tools/get_set_functions",["require","exports","module"], function(require, exports, module) {
-'use strict';
-module.exports.getSetFunctions = function getSetFunctions (editor) {
-    var out = [];
-    var my = {
-        'editor' : editor,
-        'session' : editor.session,
-        'renderer' : editor.renderer
-    };
-    var opts = [];
-    var skip = [
-        'setOption',
-        'setUndoManager',
-        'setDocument',
-        'setValue',
-        'setBreakpoints',
-        'setScrollTop',
-        'setScrollLeft',
-        'setSelectionStyle',
-        'setWrapLimitRange'
-    ];
-    ['renderer', 'session', 'editor'].forEach(function(esra) {
-        var esr = my[esra];
-        var clss = esra;
-        for(var fn in esr) {
-            if(skip.indexOf(fn) === -1) {
-                if(/^set/.test(fn) && opts.indexOf(fn) === -1) {
-                    opts.push(fn);
-                    out.push({
-                        'functionName' : fn,
-                        'parentObj' : esr,
-                        'parentName' : clss
-                    });
-                }
-            }
-        }
-    });
-    return out;
-};
-
+var modes = modelist.modes.map(function(x){ 
+    return { caption: x.caption, value: x.mode }; 
 });
 
-define("ace/ext/menu_tools/generate_settings_menu",["require","exports","module","ace/ext/menu_tools/element_generator","ace/ext/menu_tools/add_editor_menu_options","ace/ext/menu_tools/get_set_functions","ace/ace"], function(require, exports, module) {
-'use strict';
-var egen = require('./element_generator');
-var addEditorMenuOptions = require('./add_editor_menu_options').addEditorMenuOptions;
-var getSetFunctions = require('./get_set_functions').getSetFunctions;
-module.exports.generateSettingsMenu = function generateSettingsMenu (editor) {
-    var elements = [];
-    function cleanupElementsList() {
-        elements.sort(function(a, b) {
-            var x = a.getAttribute('contains');
-            var y = b.getAttribute('contains');
-            return x.localeCompare(y);
-        });
-    }
-    function wrapElements() {
-        var topmenu = document.createElement('div');
-        topmenu.setAttribute('id', 'ace_settingsmenu');
-        elements.forEach(function(element) {
-            topmenu.appendChild(element);
-        });
-        
-        var el = topmenu.appendChild(document.createElement('div'));
-        var version = require("../../ace").version;
-        el.style.padding = "1em";
-        el.textContent = "Ace version " + version;
-        
-        return topmenu;
-    }
-    function createNewEntry(obj, clss, item, val) {
-        var el;
-        var div = document.createElement('div');
-        div.setAttribute('contains', item);
-        div.setAttribute('class', 'ace_optionsMenuEntry');
-        div.setAttribute('style', 'clear: both;');
-
-        div.appendChild(egen.createLabel(
-            item.replace(/^set/, '').replace(/([A-Z])/g, ' $1').trim(),
-            item
-        ));
-
-        if (Array.isArray(val)) {
-            el = egen.createSelection(item, val, clss);
-            el.addEventListener('change', function(e) {
-                try{
-                    editor.menuOptions[e.target.id].forEach(function(x) {
-                        if(x.textContent !== e.target.textContent) {
-                            delete x.selected;
-                        }
-                    });
-                    obj[e.target.id](e.target.value);
-                } catch (err) {
-                    throw new Error(err);
-                }
-            });
-        } else if(typeof val === 'boolean') {
-            el = egen.createCheckbox(item, val, clss);
-            el.addEventListener('change', function(e) {
-                try{
-                    obj[e.target.id](!!e.target.checked);
-                } catch (err) {
-                    throw new Error(err);
-                }
-            });
-        } else {
-            el = egen.createInput(item, val, clss);
-            el.addEventListener('change', function(e) {
-                try{
-                    if(e.target.value === 'true') {
-                        obj[e.target.id](true);
-                    } else if(e.target.value === 'false') {
-                        obj[e.target.id](false);
-                    } else {
-                        obj[e.target.id](e.target.value);
-                    }
-                } catch (err) {
-                    throw new Error(err);
-                }
-            });
+
+var optionGroups = {
+    Main: {
+        Mode: {
+            path: "mode",
+            type: "select",
+            items: modes
+        },
+        Theme: {
+            path: "theme",
+            type: "select",
+            items: themes
+        },
+        "Keybinding": {
+            type: "buttonBar",
+            path: "keyboardHandler",
+            items: [
+                { caption : "Ace", value : null },
+                { caption : "Vim", value : "ace/keyboard/vim" },
+                { caption : "Emacs", value : "ace/keyboard/emacs" },
+                { caption : "Sublime", value : "ace/keyboard/sublime" },
+                { caption : "VSCode", value : "ace/keyboard/vscode" }
+            ]
+        },
+        "Font Size": {
+            path: "fontSize",
+            type: "number",
+            defaultValue: 12,
+            defaults: [
+                {caption: "12px", value: 12},
+                {caption: "24px", value: 24}
+            ]
+        },
+        "Soft Wrap": {
+            type: "buttonBar",
+            path: "wrap",
+            items: [
+               { caption : "Off",  value : "off" },
+               { caption : "View", value : "free" },
+               { caption : "margin", value : "printMargin" },
+               { caption : "40",   value : "40" }
+            ]
+        },
+        "Cursor Style": {
+            path: "cursorStyle",
+            items: [
+               { caption : "Ace",    value : "ace" },
+               { caption : "Slim",   value : "slim" },
+               { caption : "Smooth", value : "smooth" },
+               { caption : "Smooth And Slim", value : "smooth slim" },
+               { caption : "Wide",   value : "wide" }
+            ]
+        },
+        "Folding": {
+            path: "foldStyle",
+            items: [
+                { caption : "Manual", value : "manual" },
+                { caption : "Mark begin", value : "markbegin" },
+                { caption : "Mark begin and end", value : "markbeginend" }
+            ]
+        },
+        "Soft Tabs": [{
+            path: "useSoftTabs"
+        }, {
+            ariaLabel: "Tab Size",
+            path: "tabSize",
+            type: "number",
+            values: [2, 3, 4, 8, 16]
+        }],
+        "Overscroll": {
+            type: "buttonBar",
+            path: "scrollPastEnd",
+            items: [
+               { caption : "None",  value : 0 },
+               { caption : "Half",   value : 0.5 },
+               { caption : "Full",   value : 1 }
+            ]
         }
-        el.style.cssText = 'float:right;';
-        div.appendChild(el);
-        return div;
-    }
-    function makeDropdown(item, esr, clss, fn) {
-        var val = editor.menuOptions[item];
-        var currentVal = esr[fn]();
-        if (typeof currentVal == 'object')
-            currentVal = currentVal.$id;
-        val.forEach(function(valuex) {
-            if (valuex.value === currentVal)
-                valuex.selected = 'selected';
-        });
-        return createNewEntry(esr, clss, item, val);
-    }
-    function handleSet(setObj) {
-        var item = setObj.functionName;
-        var esr = setObj.parentObj;
-        var clss = setObj.parentName;
-        var val;
-        var fn = item.replace(/^set/, 'get');
-        if(editor.menuOptions[item] !== undefined) {
-            elements.push(makeDropdown(item, esr, clss, fn));
-        } else if(typeof esr[fn] === 'function') {
-            try {
-                val = esr[fn]();
-                if(typeof val === 'object') {
-                    val = val.$id;
-                }
-                elements.push(
-                    createNewEntry(esr, clss, item, val)
-                );
-            } catch (e) {
-            }
+    },
+    More: {
+        "Atomic soft tabs": {
+            path: "navigateWithinSoftTabs"
+        },
+        "Enable Behaviours": {
+            path: "behavioursEnabled"
+        },
+        "Wrap with quotes": {
+            path: "wrapBehavioursEnabled"
+        },
+        "Enable Auto Indent": {
+            path: "enableAutoIndent"
+        },
+        "Full Line Selection": {
+            type: "checkbox",
+            values: "text|line",
+            path: "selectionStyle"
+        },
+        "Highlight Active Line": {
+            path: "highlightActiveLine"
+        },
+        "Show Invisibles": {
+            path: "showInvisibles"
+        },
+        "Show Indent Guides": {
+            path: "displayIndentGuides"
+        },
+        "Persistent HScrollbar": {
+            path: "hScrollBarAlwaysVisible"
+        },
+        "Persistent VScrollbar": {
+            path: "vScrollBarAlwaysVisible"
+        },
+        "Animate scrolling": {
+            path: "animatedScroll"
+        },
+        "Show Gutter": {
+            path: "showGutter"
+        },
+        "Show Line Numbers": {
+            path: "showLineNumbers"
+        },
+        "Relative Line Numbers": {
+            path: "relativeLineNumbers"
+        },
+        "Fixed Gutter Width": {
+            path: "fixedWidthGutter"
+        },
+        "Show Print Margin": [{
+            path: "showPrintMargin"
+        }, {
+            ariaLabel: "Print Margin",
+            type: "number",
+            path: "printMarginColumn"
+        }],
+        "Indented Soft Wrap": {
+            path: "indentedSoftWrap"
+        },
+        "Highlight selected word": {
+            path: "highlightSelectedWord"
+        },
+        "Fade Fold Widgets": {
+            path: "fadeFoldWidgets"
+        },
+        "Use textarea for IME": {
+            path: "useTextareaForIME"
+        },
+        "Merge Undo Deltas": {
+            path: "mergeUndoDeltas",
+            items: [
+               { caption : "Always",  value : "always" },
+               { caption : "Never",   value : "false" },
+               { caption : "Timed",   value : "true" }
+            ]
+        },
+        "Elastic Tabstops": {
+            path: "useElasticTabstops"
+        },
+        "Incremental Search": {
+            path: "useIncrementalSearch"
+        },
+        "Read-only": {
+            path: "readOnly"
+        },
+        "Copy without selection": {
+            path: "copyWithEmptySelection"
+        },
+        "Live Autocompletion": {
+            path: "enableLiveAutocompletion"
         }
     }
-    addEditorMenuOptions(editor);
-    getSetFunctions(editor).forEach(function(setObj) {
-        handleSet(setObj);
-    });
-    cleanupElementsList();
-    return wrapElements();
 };
 
-});
 
-define("ace/ext/menu_tools/overlay_page",["require","exports","module","ace/lib/dom"], function(require, exports, module) {
-'use strict';
-var dom = require("../../lib/dom");
-var cssText = "#ace_settingsmenu, #kbshortcutmenu {\
-background-color: #F7F7F7;\
-color: black;\
-box-shadow: -5px 4px 5px rgba(126, 126, 126, 0.55);\
-padding: 1em 0.5em 2em 1em;\
-overflow: auto;\
-position: absolute;\
-margin: 0;\
-bottom: 0;\
-right: 0;\
-top: 0;\
-z-index: 9991;\
-cursor: default;\
-}\
-.ace_dark #ace_settingsmenu, .ace_dark #kbshortcutmenu {\
-box-shadow: -20px 10px 25px rgba(126, 126, 126, 0.25);\
-background-color: rgba(255, 255, 255, 0.6);\
-color: black;\
-}\
-.ace_optionsMenuEntry:hover {\
-background-color: rgba(100, 100, 100, 0.1);\
--webkit-transition: all 0.5s;\
-transition: all 0.3s\
-}\
-.ace_closeButton {\
-background: rgba(245, 146, 146, 0.5);\
-border: 1px solid #F48A8A;\
-border-radius: 50%;\
-padding: 7px;\
-position: absolute;\
-right: -8px;\
-top: -8px;\
-z-index: 1000;\
-}\
-.ace_closeButton{\
-background: rgba(245, 146, 146, 0.9);\
-}\
-.ace_optionsMenuKey {\
-color: darkslateblue;\
-font-weight: bold;\
-}\
-.ace_optionsMenuCommand {\
-color: darkcyan;\
-font-weight: normal;\
-}";
-dom.importCssString(cssText);
-module.exports.overlayPage = function overlayPage(editor, contentElement, top, right, bottom, left) {
-    top = top ? 'top: ' + top + ';' : '';
-    bottom = bottom ? 'bottom: ' + bottom + ';' : '';
-    right = right ? 'right: ' + right + ';' : '';
-    left = left ? 'left: ' + left + ';' : '';
-
-    var closer = document.createElement('div');
-    var contentContainer = document.createElement('div');
+var OptionPanel = function(editor, element) {
+    this.editor = editor;
+    this.container = element || document.createElement("div");
+    this.groups = [];
+    this.options = {};
+};
 
-    function documentEscListener(e) {
-        if (e.keyCode === 27) {
-            closer.click();
+(function() {
+    
+    oop.implement(this, EventEmitter);
+    
+    this.add = function(config) {
+        if (config.Main)
+            oop.mixin(optionGroups.Main, config.Main);
+        if (config.More)
+            oop.mixin(optionGroups.More, config.More);
+    };
+    
+    this.render = function() {
+        this.container.innerHTML = "";
+        buildDom(["table", {role: "presentation", id: "controls"}, 
+            this.renderOptionGroup(optionGroups.Main),
+            ["tr", null, ["td", {colspan: 2},
+                ["table", {role: "presentation", id: "more-controls"}, 
+                    this.renderOptionGroup(optionGroups.More)
+                ]
+            ]],
+            ["tr", null, ["td", {colspan: 2}, "version " + config.version]]
+        ], this.container);
+    };
+    
+    this.renderOptionGroup = function(group) {
+        return Object.keys(group).map(function(key, i) {
+            var item = group[key];
+            if (!item.position)
+                item.position = i / 10000;
+            if (!item.label)
+                item.label = key;
+            return item;
+        }).sort(function(a, b) {
+            return a.position - b.position;
+        }).map(function(item) {
+            return this.renderOption(item.label, item);
+        }, this);
+    };
+    
+    this.renderOptionControl = function(key, option) {
+        var self = this;
+        if (Array.isArray(option)) {
+            return option.map(function(x) {
+                return self.renderOptionControl(key, x);
+            });
         }
-    }
-
-    closer.style.cssText = 'margin: 0; padding: 0; ' +
-        'position: fixed; top:0; bottom:0; left:0; right:0;' +
-        'z-index: 9990; ' +
-        'background-color: rgba(0, 0, 0, 0.3);';
-    closer.addEventListener('click', function() {
-        document.removeEventListener('keydown', documentEscListener);
-        closer.parentNode.removeChild(closer);
-        editor.focus();
-        closer = null;
-    });
-    document.addEventListener('keydown', documentEscListener);
-
-    contentContainer.style.cssText = top + right + bottom + left;
-    contentContainer.addEventListener('click', function(e) {
-        e.stopPropagation();
-    });
-
-    var wrapper = dom.createElement("div");
-    wrapper.style.position = "relative";
+        var control;
+        
+        var value = self.getOption(option);
+        
+        if (option.values && option.type != "checkbox") {
+            if (typeof option.values == "string")
+                option.values = option.values.split("|");
+            option.items = option.values.map(function(v) {
+                return { value: v, name: v };
+            });
+        }
+        
+        if (option.type == "buttonBar") {
+            control = ["div", {role: "group", "aria-labelledby": option.path + "-label"}, option.items.map(function(item) {
+                return ["button", { 
+                    value: item.value, 
+                    ace_selected_button: value == item.value, 
+                    'aria-pressed': value == item.value, 
+                    onclick: function() {
+                        self.setOption(option, item.value);
+                        var nodes = this.parentNode.querySelectorAll("[ace_selected_button]");
+                        for (var i = 0; i < nodes.length; i++) {
+                            nodes[i].removeAttribute("ace_selected_button");
+                            nodes[i].setAttribute("aria-pressed", false);
+                        }
+                        this.setAttribute("ace_selected_button", true);
+                        this.setAttribute("aria-pressed", true);
+                    } 
+                }, item.desc || item.caption || item.name];
+            })];
+        } else if (option.type == "number") {
+            control = ["input", {type: "number", value: value || option.defaultValue, style:"width:3em", oninput: function() {
+                self.setOption(option, parseInt(this.value));
+            }}];
+            if (option.ariaLabel) {
+                control[1]["aria-label"] = option.ariaLabel;
+            } else {
+                control[1].id = key;
+            }
+            if (option.defaults) {
+                control = [control, option.defaults.map(function(item) {
+                    return ["button", {onclick: function() {
+                        var input = this.parentNode.firstChild;
+                        input.value = item.value;
+                        input.oninput();
+                    }}, item.caption];
+                })];
+            }
+        } else if (option.items) {
+            var buildItems = function(items) {
+                return items.map(function(item) {
+                    return ["option", { value: item.value || item.name }, item.desc || item.caption || item.name];
+                });
+            };
+            
+            var items = Array.isArray(option.items) 
+                ? buildItems(option.items)
+                : Object.keys(option.items).map(function(key) {
+                    return ["optgroup", {"label": key}, buildItems(option.items[key])];
+                });
+            control = ["select", { id: key, value: value, onchange: function() {
+                self.setOption(option, this.value);
+            } }, items];
+        } else {
+            if (typeof option.values == "string")
+                option.values = option.values.split("|");
+            if (option.values) value = value == option.values[1];
+            control = ["input", { type: "checkbox", id: key, checked: value || null, onchange: function() {
+                var value = this.checked;
+                if (option.values) value = option.values[value ? 1 : 0];
+                self.setOption(option, value);
+            }}];
+            if (option.type == "checkedNumber") {
+                control = [control, []];
+            }
+        }
+        return control;
+    };
     
-    var closeButton = dom.createElement("div");
-    closeButton.className = "ace_closeButton";
-    closeButton.addEventListener('click', function() {
-        closer.click();
-    });
+    this.renderOption = function(key, option) {
+        if (option.path && !option.onchange && !this.editor.$options[option.path])
+            return;
+        var path = Array.isArray(option) ? option[0].path : option.path;
+        this.options[path] = option;
+        var safeKey = "-" + path;
+        var safeId = path + "-label";
+        var control = this.renderOptionControl(safeKey, option);
+        return ["tr", {class: "ace_optionsMenuEntry"}, ["td",
+            ["label", {for: safeKey, id: safeId}, key]
+        ], ["td", control]];
+    };
     
-    wrapper.appendChild(closeButton);
-    contentContainer.appendChild(wrapper);
+    this.setOption = function(option, value) {
+        if (typeof option == "string")
+            option = this.options[option];
+        if (value == "false") value = false;
+        if (value == "true") value = true;
+        if (value == "null") value = null;
+        if (value == "undefined") value = undefined;
+        if (typeof value == "string" && parseFloat(value).toString() == value)
+            value = parseFloat(value);
+        if (option.onchange)
+            option.onchange(value);
+        else if (option.path)
+            this.editor.setOption(option.path, value);
+        this._signal("setOption", {name: option.path, value: value});
+    };
     
-    contentContainer.appendChild(contentElement);
-    closer.appendChild(contentContainer);
-    document.body.appendChild(closer);
-    editor.blur();
-};
+    this.getOption = function(option) {
+        if (option.getValue)
+            return option.getValue();
+        return this.editor.getOption(option.path);
+    };
+    
+}).call(OptionPanel.prototype);
+
+exports.OptionPanel = OptionPanel;
 
 });
 
-define("ace/ext/settings_menu",["require","exports","module","ace/ext/menu_tools/generate_settings_menu","ace/ext/menu_tools/overlay_page","ace/editor"], function(require, exports, module) {
+define("ace/ext/settings_menu",["require","exports","module","ace/ext/options","ace/ext/menu_tools/overlay_page","ace/editor"], function(require, exports, module) {
 "use strict";
-var generateSettingsMenu = require('./menu_tools/generate_settings_menu').generateSettingsMenu;
+var OptionPanel = require("./options").OptionPanel;
 var overlayPage = require('./menu_tools/overlay_page').overlayPage;
 function showSettingsMenu(editor) {
-    var sm = document.getElementById('ace_settingsmenu');
-    if (!sm)    
-        overlayPage(editor, generateSettingsMenu(editor), '0', '0', '0');
+    if (!document.getElementById('ace_settingsmenu')) {
+        var options = new OptionPanel(editor);
+        options.render();
+        options.container.id = "ace_settingsmenu";
+        overlayPage(editor, options.container);
+        options.container.querySelector("select,input,button,checkbox").focus();
+    }
 }
-module.exports.init = function(editor) {
-    var Editor = require("ace/editor").Editor;
+module.exports.init = function() {
+    var Editor = require("../editor").Editor;
     Editor.prototype.showSettingsMenu = function() {
         showSettingsMenu(this);
     };
 };
-});
-                (function() {
-                    window.require(["ace/ext/settings_menu"], function() {});
+});                (function() {
+                    window.require(["ace/ext/settings_menu"], function(m) {
+                        if (typeof module == "object" && typeof exports == "object" && module) {
+                            module.exports = m;
+                        }
+                    });
                 })();