Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix search in code editor #884

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Fix search in code editor #884

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0fd18dc
Editor: Vendor dialog.css from CodeMirror to fix CodeMirror's search
cben Jun 4, 2023
80dba42
Editor: Configure CodeMirror search to keep search open, similar to b…
cben Jun 5, 2023
e2d4a65
Editor: increase viewportMargin to 500 so browser's search works right
cben Jun 5, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions build.sh
View file
Original file line number Diff line number Diff line change
@@ -226,15 +226,14 @@ if ! [ -f _site/assets/editor-codemirror.js ] || ! [ -f _site/assets/editor-elm.
editor/cm/addon/search/search.js \
editor/cm/addon/dialog/dialog.js \
editor/cm/lib/active-line.js \
editor/cm/addon/dialog/dialog.js \
editor/cm/keymap/sublime.js \
| uglifyjs -o _site/assets/editor-codemirror.js

# custom elements
cat editor/code-editor.js editor/column-divider.js | uglifyjs -o _site/assets/editor-custom-elements.js

# styles
cat editor/cm/lib/codemirror.css editor/editor.css > _site/assets/editor-styles.css
cat editor/cm/lib/codemirror.css editor/cm/addon/dialog/dialog.css editor/editor.css > _site/assets/editor-styles.css

# elm
(cd editor ; elm make src/Page/Editor.elm --optimize --output=elm.js)
32 changes: 32 additions & 0 deletions editor/cm/addon/dialog/dialog.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
.CodeMirror-dialog {
position: absolute;
left: 0; right: 0;
background: inherit;
z-index: 15;
padding: .1em .8em;
overflow: hidden;
color: inherit;
}

.CodeMirror-dialog-top {
border-bottom: 1px solid #eee;
top: 0;
}

.CodeMirror-dialog-bottom {
border-top: 1px solid #eee;
bottom: 0;
}

.CodeMirror-dialog input {
border: none;
outline: none;
background: transparent;
width: 20em;
color: inherit;
font-family: monospace;
}

.CodeMirror-dialog button {
font-size: 70%;
}
8 changes: 7 additions & 1 deletion editor/code-editor.js
View file
Original file line number Diff line number Diff line change
@@ -110,9 +110,15 @@
value: this._source,
tabSize: 2,
indentWithTabs: false,
// Increase off-screen lines CodeMirror puts in DOM, for browser's native search.
// Won't scale to huge files, hopefully fine for Elm examples.
viewportMargin: 500,
extraKeys: {
"Tab": handleTab,
"Shift-Tab": handleUntab,
// "findPersistent" behavior is closer to browser's native search than "find".
"Cmd-F": "findPersistent",
"Ctrl-F": "findPersistent",
"Cmd-S": function(cm) { sendSaveEvent(); },
"Ctrl-Enter": function(cm) { sendSaveEvent(); }
}
@@ -363,4 +369,4 @@

window.customElements.define('code-editor', CodeEditor);

})();
})();