diff --git a/public/icons/format.svg b/public/icons/format.svg
new file mode 100644
index 0000000..f889346
--- /dev/null
+++ b/public/icons/format.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/components/App.vue b/src/components/App.vue
index 550bfab..f7d70d7 100644
--- a/src/components/App.vue
+++ b/src/components/App.vue
@@ -91,6 +91,10 @@
this.showLanguageSelector = false
this.$refs.editor.setLanguage(language)
},
+
+ formatCurrentBlock() {
+ this.$refs.editor.formatCurrentBlock()
+ },
},
}
@@ -119,6 +123,7 @@
:systemTheme="systemTheme"
@toggleTheme="toggleTheme"
@openLanguageSelector="openLanguageSelector"
+ @formatCurrentBlock="formatCurrentBlock"
class="status"
/>
diff --git a/src/components/Editor.vue b/src/components/Editor.vue
index bf7d6e6..b4f62a5 100644
--- a/src/components/Editor.vue
+++ b/src/components/Editor.vue
@@ -108,6 +108,11 @@
this.editor.focus()
},
+ formatCurrentBlock() {
+ this.editor.formatCurrentBlock()
+ this.editor.focus()
+ },
+
focus() {
this.editor.focus()
},
diff --git a/src/components/StatusBar.vue b/src/components/StatusBar.vue
index 7240da4..7172339 100644
--- a/src/components/StatusBar.vue
+++ b/src/components/StatusBar.vue
@@ -1,5 +1,6 @@
@@ -42,6 +48,14 @@
{{ languageName }}
(auto)
+
+
+
@@ -117,5 +131,19 @@
background-image: url("icons/light-mode.png")
&.system
background-image: url("icons/both-mode.png")
+
+ .format
+ padding-top: 0
+ padding-bottom: 0
+ .icon
+ display: block
+ width: 14px
+ height: 22px
+ +dark-mode
+ opacity: 0.9
+ background-size: 16px
+ background-repeat: no-repeat
+ background-position: center center
+ background-image: url("icons/format.svg")
diff --git a/src/editor/block/format-code.js b/src/editor/block/format-code.js
index d7711de..f2ea0f2 100644
--- a/src/editor/block/format-code.js
+++ b/src/editor/block/format-code.js
@@ -49,6 +49,7 @@ export const formatBlockContent = ({ state, dispatch }) => {
selection: EditorSelection.cursor(block.content.from + formattedContent.cursorOffset)
}, {
userEvent: "input",
+ scrollIntoView: true,
}))
return true;
}
diff --git a/src/editor/editor.js b/src/editor/editor.js
index f1d93b2..ea4fd92 100644
--- a/src/editor/editor.js
+++ b/src/editor/editor.js
@@ -9,6 +9,7 @@ import { customSetup } from "./setup.js"
import { heynoteLang } from "./lang-heynote/heynote.js"
import { noteBlockExtension, blockLineNumbers } from "./block/block.js"
import { changeCurrentBlockLanguage } from "./block/commands.js"
+import { formatBlockContent } from "./block/format-code.js"
import { heynoteKeymap, emacsKeymap } from "./keymap.js"
import { heynoteCopyPaste } from "./copy-paste"
import { languageDetection } from "./language-detection/autodetect.js"
@@ -131,6 +132,13 @@ export class HeynoteEditor {
effects: this.foldGutterCompartment.reconfigure(show ? [foldGutter()] : []),
})
}
+
+ formatCurrentBlock() {
+ formatBlockContent({
+ state: this.view.state,
+ dispatch: this.view.dispatch,
+ })
+ }
}
diff --git a/src/editor/languages.js b/src/editor/languages.js
index 4b1f255..1aae1b8 100644
--- a/src/editor/languages.js
+++ b/src/editor/languages.js
@@ -14,27 +14,28 @@ import { rustLanguage } from "@codemirror/lang-rust"
class Language {
- constructor(token, name, parser, highlightjs) {
+ constructor(token, name, parser, highlightjs, supportsFormat=false) {
this.token = token
this.name = name
this.parser = parser
this.highlightjs = highlightjs
+ this.supportsFormat = supportsFormat
}
}
export const LANGUAGES = [
new Language("text", "Plain Text", null, "plaintext"),
new Language("math", "Math", null, null),
- new Language("javascript", "JavaScript", javascriptLanguage.parser, "javascript"),
- new Language("json", "JSON", jsonLanguage.parser, "json"),
+ new Language("javascript", "JavaScript", javascriptLanguage.parser, "javascript", true),
+ new Language("json", "JSON", jsonLanguage.parser, "json", true),
new Language("python", "Python", pythonLanguage.parser, "python"),
- new Language("html", "HTML", htmlLanguage.parser, "html"),
+ new Language("html", "HTML", htmlLanguage.parser, "html", true),
new Language("sql", "SQL", StandardSQL.language.parser, "sql"),
- new Language("markdown", "Markdown", markdownLanguage.parser, "markdown"),
+ new Language("markdown", "Markdown", markdownLanguage.parser, "markdown", true),
new Language("java", "Java", javaLanguage.parser, "java"),
//new Language("lezer", "Lezer", lezerLanguage.parser, "lezer"),
new Language("php", "PHP", phpLanguage.parser, "php"),
- new Language("css", "CSS", cssLanguage.parser, "css"),
+ new Language("css", "CSS", cssLanguage.parser, "css", true),
new Language("xml", "XML", xmlLanguage.parser, "xml"),
new Language("cpp", "C++", cppLanguage.parser, "cpp"),
new Language("rust", "Rust", rustLanguage.parser, "rust"),