Merge pull request #1272 from ajaxorg/virtual_renderer

fix #1266: Scroller is collapsed when ace initialized with empty value

api/edit_session.html

@@ -35,8 +35,6 @@
               </li>
               <li id="dropdown_EditSession.event.changeWrapMode" data-id="EditSession.event.changeWrapMode" class="memberLink"><a href="#EditSession.event.changeWrapMode" class="" title="EditSession.event.changeWrapMode (event)" data-id="EditSession.event.changeWrapMode">changeWrapMode</a>
               </li>
-              <li id="dropdown_EditSession.event.loadMode" data-id="EditSession.event.loadMode" class="memberLink"><a href="#EditSession.event.loadMode" class="" title="EditSession.event.loadMode (event)" data-id="EditSession.event.loadMode">loadMode</a>
-              </li>
               <li id="dropdown_EditSession.event.tokenizerUpdate" data-id="EditSession.event.tokenizerUpdate" class="memberLink"><a href="#EditSession.event.tokenizerUpdate" class="" title="EditSession.event.tokenizerUpdate (event)" data-id="EditSession.event.tokenizerUpdate">tokenizerUpdate</a>
               </li>
             </ul>
@@ -619,31 +617,6 @@
         </div>
       </div>
     </article>
-    <article id="EditSession.event.loadMode" data-title="EditSession.event.loadMode (event)" class="article">
-      <div class="section method">
-        <div class="memberContent">
-          <div class="title"><i id="EditSession.event.loadMode" class="methodToggle methodClicker inactive icon-caret-right"></i>
-            <ul class="signatures">
-              <li class="signature">
-                <ul>
-                  <li class="signature-call"><span class="eventObjName">EditSession</span><span class="eventListenerStart">.on("</span><span id="EditSession.event.loadMode" class="member-name eventMember methodClicker">loadMode</span><span class="eventListenerClose">", </span><span class="eventFunctionOpen">function(</span><span class="eventFunctionClose">))</span></li>
-                </ul>
-                <ul class="metaInfo">
-                </ul>
-              </li>
-            </ul>
-          </div>
-          <div class="sideToggler">
-            <div id="ellipsis_EditSession.event.loadMode" class="ellipsis_description"><p>Emitted when the mode is loaded.</p>
-
-            </div>
-            <div class="description"><p>Emitted when the mode is loaded.</p>
-
-            </div>
-          </div>
-        </div>
-      </div>
-    </article>
     <article id="EditSession.event.tokenizerUpdate" data-title="EditSession.event.tokenizerUpdate (event)" class="article">
       <div class="section method">
         <div class="memberContent">

lib/ace/ace.js

@@ -91,7 +91,7 @@ exports.edit = function(el) {
     var env = {
         document: doc,
         editor: editor,
-        onResize: editor.resize.bind(editor)
+        onResize: editor.resize.bind(editor, null)
     };
     event.addListener(window, "resize", env.onResize);
     editor.on("destroy", function() {

lib/ace/edit_session.js

@@ -96,12 +96,6 @@ var config = require("./config");
  * @param {Object} e An object containing one property, `"data"`, that contains information about the changing rows
  *
  **/
-/** 
- * Emitted when the mode is loaded.
- *
- * @event loadMode
- *
- **/
 /** 
  * Emitted when the current mode changes.
  *

lib/ace/lib/lang.js

@@ -144,9 +144,34 @@ exports.getMatchOffsets = function(string, regExp) {
 
 /* deprecated */
 exports.deferredCall = function(fcn) {
-    if (typeof console != "undefined" && console.error)
+
-        console.error("Deprecated: use lang.delayedCall")
+    var timer = null;
-    return exports.delayedCall(fcn);
+    var callback = function() {
+        timer = null;
+        fcn();
+    };
+
+    var deferred = function(timeout) {
+        deferred.cancel();
+        timer = setTimeout(callback, timeout || 0);
+        return deferred;
+    };
+
+    deferred.schedule = deferred;
+
+    deferred.call = function() {
+        this.cancel();
+        fcn();
+        return deferred;
+    };
+
+    deferred.cancel = function() {
+        clearTimeout(timer);
+        timer = null;
+        return deferred;
+    };
+
+    return deferred;
 };
 
 

lib/ace/virtual_renderer.js

@@ -48,8 +48,6 @@ var editorCss = require("./requirejs/text!./css/editor.css");
 dom.importCssString(editorCss, "ace_editor");
 
 /**
- * 
- *
  * The class that is responsible for drawing everything you see on the screen!
  * @class VirtualRenderer
  **/
@@ -59,9 +57,6 @@ dom.importCssString(editorCss, "ace_editor");
  * @param {DOMElement} container The root element of the editor
  * @param {String} theme The starting theme
  *
- * 
- *
- * 
  * @constructor
  **/
 
@@ -262,12 +257,10 @@ var VirtualRenderer = function(container, theme) {
     *
     **/
     this.updateFull = function(force) {
-        if (force){
+        if (force)
             this.$renderChanges(this.CHANGE_FULL, true);
-        }
+        else
-        else {
             this.$loop.schedule(this.CHANGE_FULL);
-        }
     };
 
     /**
@@ -288,7 +281,7 @@ var VirtualRenderer = function(container, theme) {
     *
     **/
     this.onResize = function(force, gutterWidth, width, height) {
-        var changes = this.CHANGE_SIZE;
+        var changes = 0;
         var size = this.$size;
 
         if (this.resizing > 2)
@@ -302,6 +295,7 @@ var VirtualRenderer = function(container, theme) {
 
         if (height && (force || size.height != height)) {
             size.height = height;
+            changes = this.CHANGE_SIZE;
 
             size.scrollerHeight = this.scroller.clientHeight;
             if (!size.scrollerHeight) {
@@ -321,6 +315,7 @@ var VirtualRenderer = function(container, theme) {
             width = dom.getInnerWidth(this.container);
 
         if (width && (force || this.resizing > 1 || size.width != width)) {
+            changes = this.CHANGE_SIZE;
             size.width = width;
 
             var gutterWidth = this.$showGutter ? this.$gutter.offsetWidth : 0;
@@ -355,7 +350,6 @@ var VirtualRenderer = function(container, theme) {
     };
 
     /**
-    * 
     * Adjusts the wrap limit, which is the number of characters that can fit within the width of the edit area on screen.
     **/
     this.adjustWrapLimit = function() {
@@ -740,6 +734,9 @@ var VirtualRenderer = function(container, theme) {
     };
 
     this.$computeLayerConfig = function() {
+        if (!this.$size.scrollerHeight)
+            return this.onResize(true);
+
         var session = this.session;
 
         var offset = this.scrollTop % this.lineHeight;