PseudocodeEditor / editor

The codemirror 6 editor for CIE spec Pseudocode
https://editor.pseudonaja.app
21 stars 2 forks source link

Code Linting #2

Open hugomarfani opened 2 years ago

hugomarfani commented 2 years ago

Add Code Lining

Expected Behaviour

DECLARE num1 AS STRINGOFTEXT STRINGOFTEXT should be underlined to show that this is not a correct datatype

Actual Behavior

Not yet implemented

Coding-Cactus commented 2 years ago

Will be useful → https://github.com/codemirror/lint

Coding-Cactus commented 2 years ago

An example of linting cm6 https://codemirror.net/6/screenreaderdemo/

const {EditorState, EditorView, basicSetup} = CM["@codemirror/basic-setup"];
const {html} = CM["@codemirror/lang-html"];
const {linter} = CM["@codemirror/lint"];

const replace = ["cardamom", "hummingbird", "granfalloon", "galleass", "capybara", "lemur", "topology"];

function lintFoo(view) {
  let words = /\b(foo|bar|baz|quux)\b/g, m, doc = view.state.doc.toString();
  let diagnostics = [];
  while (m = words.exec(doc)) {
    diagnostics.push({
      from: m.index, to: m.index + m[0].length,
      severity: "warning",
      message: `The word "${m[0]}" is deprecated.`,
      actions: [{name: "fix", apply(view, from, to) {
        view.dispatch({changes: {from, to, insert: replace[Math.floor(Math.random() * replace.length)]}});
      }}]
    });
  }
  return diagnostics
}
(window ).view = new EditorView({
  state: EditorState.create({
    doc: `<!doctype html>
<body>
  <p>This is the editable example document.</p>
  <p>The linter highlights words like foo, bar, and baz.</p>
</body>
`,
    extensions: [basicSetup, html(), linter(lintFoo)]
  }),
  parent: document.querySelector("#editor")
});
Coding-Cactus commented 2 years ago

🛑 (On hold until the interpreter is implemented)

Coding-Cactus commented 1 year ago

:green_circle: back in action

Coding-Cactus commented 1 year ago

:red_circle: nvm