Improve performance in the editor
We stop setting viewportMargin and instead use the default value.
We also add support for the inbuilt search support within codemirror.
This is because with the removal of viewportMargin you cannot use
the browsers search to search for the code.
In my view i think this is a good trade off as you'll still be able to
search using the codemirror searching support whilst improving performance for large documents.
In GWTUI we didn't set viewportMargin.
Bug: Issue 14845
Change-Id: I84f12168c4784cf40ca102f025b7805b44bc9d9a
diff --git a/gr-editor/codemirror-element.css b/gr-editor/codemirror-element.css
index 0a328b7..97787c7 100644
--- a/gr-editor/codemirror-element.css
+++ b/gr-editor/codemirror-element.css
@@ -4,7 +4,6 @@
}
.CodeMirror {
font-family: 'Roboto Mono', 'SF Mono', 'Lucida Console', Monaco, monospace;
- height: auto;
/* CodeMirror has a default z-index of 4. Set to 0 to avoid collisions with fixed header. */
z-index: 0;
}
diff --git a/gr-editor/codemirror-element.html b/gr-editor/codemirror-element.html
index 8f51915..54aacd8 100644
--- a/gr-editor/codemirror-element.html
+++ b/gr-editor/codemirror-element.html
@@ -37,7 +37,10 @@
<link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/theme/vibrant-ink.css">
<link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/theme/xq-dark.css">
<link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/theme/xq-light.css">
+ <link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/addon/dialog/dialog.css">
<link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/addon/fold/foldgutter.css">
+ <link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/addon/scroll/simplescrollbars.css">
+ <link rel="stylesheet" type="css" href="../node_modules/codemirror-minified/addon/search/matchesonscrollbar.css">
<link rel="stylesheet" type="css" href="./codemirror-element.css" />
<div id="wrapper"></div>
@@ -46,12 +49,20 @@
</dom-module>
<script src="../node_modules/codemirror-minified/lib/codemirror.js"></script>
+<script src="../node_modules/codemirror-minified/addon/dialog/dialog.js"></script>
<script src="../node_modules/codemirror-minified/addon/display/rulers.js"></script>
<script src="../node_modules/codemirror-minified/addon/edit/closebrackets.js"></script>
<script src="../node_modules/codemirror-minified/addon/edit/closetag.js"></script>
<script src="../node_modules/codemirror-minified/addon/edit/matchbrackets.js"></script>
<script src="../node_modules/codemirror-minified/addon/edit/matchtags.js"></script>
<script src="../node_modules/codemirror-minified/addon/edit/trailingspace.js"></script>
+<script src="../node_modules/codemirror-minified/addon/scroll/annotatescrollbar.js"></script>
+<script src="../node_modules/codemirror-minified/addon/scroll/simplescrollbars.js"></script>
+<script src="../node_modules/codemirror-minified/addon/search/matchesonscrollbar.js"></script>
+<script src="../node_modules/codemirror-minified/addon/search/jump-to-line.js"></script>
+<script src="../node_modules/codemirror-minified/addon/search/matchesonscrollbar.js"></script>
+<script src="../node_modules/codemirror-minified/addon/search/searchcursor.js"></script>
+<script src="../node_modules/codemirror-minified/addon/search/search.js"></script>
<script src="../node_modules/codemirror-minified/addon/mode/simple.js"></script>
<script src="../node_modules/codemirror-minified/addon/mode/multiplex.js"></script>
<script src="../node_modules/codemirror-minified/mode/meta.js"></script>
diff --git a/gr-editor/codemirror-element.js b/gr-editor/codemirror-element.js
index ff6785d..05a879f 100644
--- a/gr-editor/codemirror-element.js
+++ b/gr-editor/codemirror-element.js
@@ -65,6 +65,7 @@
this.async(() => {
this._nativeMirror.refresh();
this._nativeMirror.focus();
+ this._nativeMirror.setSize(null, window.screen.height);
if (this.lineNum) {
// We have to take away one from the line number,
// ... because CodeMirror's line count is zero-based.
diff --git a/gr-editor/gr-editor.js b/gr-editor/gr-editor.js
index caf00d0..1052df5 100644
--- a/gr-editor/gr-editor.js
+++ b/gr-editor/gr-editor.js
@@ -187,7 +187,9 @@
* @returns {Object}
*/
getCodeMirrorParams(type, value, prefs) {
- const params = {value, viewportMargin: Infinity};
+ const params = {value};
+
+ params.scrollbarStyle = 'overlay';
if (prefs) {
// TODO: Add gerrit's customizations from java codemirror to javascript
