add a way for disabling AutoScrollEditorIntoView
This commit is contained in:
parent
bd6dda68f0
commit
c6ba1957aa
3 changed files with 26 additions and 9 deletions
|
|
@ -88,6 +88,7 @@ require("ace/commands/default_commands").commands.push({
|
||||||
exec: function(editor) {
|
exec: function(editor) {
|
||||||
dom.toggleCssClass(document.body, "fullScreen")
|
dom.toggleCssClass(document.body, "fullScreen")
|
||||||
dom.toggleCssClass(editor.container, "fullScreen")
|
dom.toggleCssClass(editor.container, "fullScreen")
|
||||||
|
editor.setAutoScrollEditorIntoView()
|
||||||
editor.resize()
|
editor.resize()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -2110,29 +2110,37 @@ var Editor = function(renderer, session) {
|
||||||
this.renderer.destroy();
|
this.renderer.destroy();
|
||||||
};
|
};
|
||||||
|
|
||||||
this.setAutoScrollEditorIntoView = function() {
|
/**
|
||||||
var self = this;
|
* Enables automatic scrolling of the cursor into view when editor itself is inside scrollable element
|
||||||
|
* @param {Boolean} enable default true
|
||||||
|
**/
|
||||||
|
this.setAutoScrollEditorIntoView = function(enable) {
|
||||||
|
if (enable === true)
|
||||||
|
return;
|
||||||
var rect;
|
var rect;
|
||||||
|
var self = this;
|
||||||
var shouldScroll = false;
|
var shouldScroll = false;
|
||||||
var scrollAnchor = dom.createElement("div");
|
if (!this.$scrollAnchor)
|
||||||
|
this.$scrollAnchor = document.createElement("div");
|
||||||
|
var scrollAnchor = this.$scrollAnchor;
|
||||||
scrollAnchor.style.cssText = "position:absolute";
|
scrollAnchor.style.cssText = "position:absolute";
|
||||||
this.container.insertBefore(scrollAnchor, this.container.firstChild);
|
this.container.insertBefore(scrollAnchor, this.container.firstChild);
|
||||||
this.on("changeSelection", function() {
|
var onChangeSelection = this.on("changeSelection", function() {
|
||||||
shouldScroll = true;
|
shouldScroll = true;
|
||||||
});
|
});
|
||||||
// needed to not trigger sync reflow
|
// needed to not trigger sync reflow
|
||||||
this.renderer.on("beforeRender", function() {
|
var onBeforeRender = this.renderer.on("beforeRender", function() {
|
||||||
if (shouldScroll)
|
if (shouldScroll)
|
||||||
rect = self.renderer.container.getBoundingClientRect()
|
rect = self.renderer.container.getBoundingClientRect();
|
||||||
});
|
});
|
||||||
this.renderer.on("afterRender", function() {
|
var onAfterRender = this.renderer.on("afterRender", function() {
|
||||||
if (shouldScroll && rect && self.isFocused()) {
|
if (shouldScroll && rect && self.isFocused()) {
|
||||||
var renderer = self.renderer;
|
var renderer = self.renderer;
|
||||||
var pos = renderer.$cursorLayer.$pixelPos;
|
var pos = renderer.$cursorLayer.$pixelPos;
|
||||||
var config = renderer.layerConfig;
|
var config = renderer.layerConfig;
|
||||||
var top = pos.top - config.offset;
|
var top = pos.top - config.offset;
|
||||||
if (pos.top >= 0 && top + rect.top < 0) {
|
if (pos.top >= 0 && top + rect.top < 0) {
|
||||||
shouldScroll = true
|
shouldScroll = true;
|
||||||
} else if (pos.top < config.height &&
|
} else if (pos.top < config.height &&
|
||||||
pos.top + rect.top + config.lineHeight > window.innerHeight) {
|
pos.top + rect.top + config.lineHeight > window.innerHeight) {
|
||||||
shouldScroll = false;
|
shouldScroll = false;
|
||||||
|
|
@ -2144,11 +2152,18 @@ var Editor = function(renderer, session) {
|
||||||
scrollAnchor.style.left = pos.left + "px";
|
scrollAnchor.style.left = pos.left + "px";
|
||||||
scrollAnchor.style.height = config.lineHeight + "px";
|
scrollAnchor.style.height = config.lineHeight + "px";
|
||||||
scrollAnchor.scrollIntoView(shouldScroll);
|
scrollAnchor.scrollIntoView(shouldScroll);
|
||||||
|
|
||||||
}
|
}
|
||||||
shouldScroll = rect = null;
|
shouldScroll = rect = null;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
this.setAutoScrollEditorIntoView = function(enable) {
|
||||||
|
if (enable === false)
|
||||||
|
return;
|
||||||
|
delete this.setAutoScrollEditorIntoView;
|
||||||
|
this.removeEventListener("changeSelection", onChangeSelection);
|
||||||
|
this.renderer.removeEventListener("afterRender", onAfterRender);
|
||||||
|
this.renderer.removeEventListener("beforeRender", onBeforeRender);
|
||||||
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
}).call(Editor.prototype);
|
}).call(Editor.prototype);
|
||||||
|
|
|
||||||
|
|
@ -106,6 +106,7 @@ EventEmitter.addEventListener = function(eventName, callback, capturing) {
|
||||||
|
|
||||||
if (listeners.indexOf(callback) == -1)
|
if (listeners.indexOf(callback) == -1)
|
||||||
listeners[capturing ? "unshift" : "push"](callback);
|
listeners[capturing ? "unshift" : "push"](callback);
|
||||||
|
return callback;
|
||||||
};
|
};
|
||||||
|
|
||||||
EventEmitter.removeListener =
|
EventEmitter.removeListener =
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue