diff --git a/package-lock.json b/package-lock.json index d1fa9db6..718a01b0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9193,6 +9193,7 @@ } }, "packages/serial": { + "name": "@strudel.cycles/serial", "version": "0.0.6", "license": "GPL-3.0-or-later" }, diff --git a/repl/package-lock.json b/repl/package-lock.json index 8574c551..fbc6293a 100644 --- a/repl/package-lock.json +++ b/repl/package-lock.json @@ -12,12 +12,10 @@ "@testing-library/jest-dom": "^5.16.3", "@testing-library/react": "^12.1.4", "@testing-library/user-event": "^13.5.0", - "codemirror": "^5.65.2", "codemirror6-themes": "^0.1.2", "events": "^3.3.0", "gh-pages": "^3.2.3", "react": "^17.0.2", - "react-codemirror2": "^7.2.1", "react-codemirror6": "^1.1.0", "react-dom": "^17.0.2", "react-hook-inview": "^4.4.1", @@ -7813,11 +7811,6 @@ "node": ">= 4.0" } }, - "node_modules/codemirror": { - "version": "5.65.2", - "resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.65.2.tgz", - "integrity": "sha512-SZM4Zq7XEC8Fhroqe3LxbEEX1zUPWH1wMr5zxiBuiUF64iYOUH/JI88v4tBag8MiBS8B8gRv8O1pPXGYXQ4ErA==" - }, "node_modules/codemirror6-themes": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/codemirror6-themes/-/codemirror6-themes-0.1.2.tgz", @@ -16701,15 +16694,6 @@ "node": ">=14" } }, - "node_modules/react-codemirror2": { - "version": "7.2.1", - "resolved": "https://registry.npmjs.org/react-codemirror2/-/react-codemirror2-7.2.1.tgz", - "integrity": "sha512-t7YFmz1AXdlImgHXA9Ja0T6AWuopilub24jRaQdPVbzUJVNKIYuy3uCFZYa7CE5S3UW6SrSa5nAqVQvtzRF9gw==", - "peerDependencies": { - "codemirror": "5.x", - "react": ">=15.5 <=16.x" - } - }, "node_modules/react-codemirror6": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/react-codemirror6/-/react-codemirror6-1.1.0.tgz", @@ -25905,11 +25889,6 @@ "q": "^1.1.2" } }, - "codemirror": { - "version": "5.65.2", - "resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.65.2.tgz", - "integrity": "sha512-SZM4Zq7XEC8Fhroqe3LxbEEX1zUPWH1wMr5zxiBuiUF64iYOUH/JI88v4tBag8MiBS8B8gRv8O1pPXGYXQ4ErA==" - }, "codemirror6-themes": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/codemirror6-themes/-/codemirror6-themes-0.1.2.tgz", @@ -32213,12 +32192,6 @@ "whatwg-fetch": "^3.6.2" } }, - "react-codemirror2": { - "version": "7.2.1", - "resolved": "https://registry.npmjs.org/react-codemirror2/-/react-codemirror2-7.2.1.tgz", - "integrity": "sha512-t7YFmz1AXdlImgHXA9Ja0T6AWuopilub24jRaQdPVbzUJVNKIYuy3uCFZYa7CE5S3UW6SrSa5nAqVQvtzRF9gw==", - "requires": {} - }, "react-codemirror6": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/react-codemirror6/-/react-codemirror6-1.1.0.tgz", diff --git a/repl/package.json b/repl/package.json index eccac897..eceed51b 100644 --- a/repl/package.json +++ b/repl/package.json @@ -8,12 +8,10 @@ "@testing-library/jest-dom": "^5.16.3", "@testing-library/react": "^12.1.4", "@testing-library/user-event": "^13.5.0", - "codemirror": "^5.65.2", "codemirror6-themes": "^0.1.2", "events": "^3.3.0", "gh-pages": "^3.2.3", "react": "^17.0.2", - "react-codemirror2": "^7.2.1", "react-codemirror6": "^1.1.0", "react-dom": "^17.0.2", "react-hook-inview": "^4.4.1", diff --git a/repl/src/CodeMirror.jsx b/repl/src/CodeMirror.jsx deleted file mode 100644 index a659e3ee..00000000 --- a/repl/src/CodeMirror.jsx +++ /dev/null @@ -1,121 +0,0 @@ -import React from 'react'; -import { Controlled as CodeMirror2 } from 'react-codemirror2'; -import 'codemirror/mode/javascript/javascript'; -import 'codemirror/mode/pegjs/pegjs'; -// import 'codemirror/theme/material.css'; -import 'codemirror/lib/codemirror.css'; -import 'codemirror/theme/material.css'; - -export default function CodeMirror({ value, onChange, onCursor, options, editorDidMount }) { - options = options || { - mode: 'javascript', - theme: 'material', - lineNumbers: true, - styleSelectedText: true, - cursorBlinkRate: 500, - }; - return ( - onCursor?.(editor, data)} - /> - ); -} - -export const markEvent = (editor) => (time, event) => { - const locs = event.context.locations; - if (!locs || !editor) { - return; - } - const col = event.context?.color || '#FFCA28'; - // mark active event - const marks = locs.map(({ start, end }) => - editor.getDoc().markText( - { line: start.line - 1, ch: start.column }, - { line: end.line - 1, ch: end.column }, - //{ css: 'background-color: #FFCA28; color: black' } // background-color is now used by parent marking - { css: 'outline: 1px solid ' + col + '; box-sizing:border-box' }, - //{ css: `background-color: ${col};border-radius:5px` }, - ), - ); - //Tone.Transport.schedule(() => { // problem: this can be cleared by scheduler... - setTimeout(() => { - marks.forEach((mark) => mark.clear()); - // }, '+' + event.duration.valueOf() * 0.5); - }, event.duration.valueOf() /* * 0.9 */ * 1000); -}; - -let parenMark; -export const markParens = (editor, data) => { - const v = editor.getDoc().getValue(); - const marked = getCurrentParenArea(v, data); - parenMark?.clear(); - parenMark = editor.getDoc().markText(...marked, { css: 'background-color: #00007720' }); // -}; - -// returns { line, ch } from absolute character offset -export function offsetToPosition(offset, code) { - const lines = code.split('\n'); - let line = 0; - let ch = 0; - for (let i = 0; i < offset; i++) { - if (ch === lines[line].length) { - line++; - ch = 0; - } else { - ch++; - } - } - return { line, ch }; -} - -// returns absolute character offset from { line, ch } -export function positionToOffset(position, code) { - const lines = code.split('\n'); - let offset = 0; - for (let i = 0; i < position.line; i++) { - offset += lines[i].length + 1; - } - offset += position.ch; - return offset; -} - -// given code and caret position, the functions returns the indices of the parens we are in -export function getCurrentParenArea(code, caretPosition) { - const caret = positionToOffset(caretPosition, code); - let open, i, begin, end; - // walk left - i = caret; - open = 0; - while (i > 0) { - if (code[i - 1] === '(') { - open--; - } else if (code[i - 1] === ')') { - open++; - } - if (open === -1) { - break; - } - i--; - } - begin = i; - // walk right - i = caret; - open = 0; - while (i < code.length) { - if (code[i] === '(') { - open--; - } else if (code[i] === ')') { - open++; - } - if (open === 1) { - break; - } - i++; - } - end = i; - return [begin, end].map((o) => offsetToPosition(o, code)); -} diff --git a/repl/src/tutorial/style.css b/repl/src/tutorial/style.css index 589ee893..e7a3d9ed 100644 --- a/repl/src/tutorial/style.css +++ b/repl/src/tutorial/style.css @@ -2,12 +2,6 @@ @tailwind components; @tailwind utilities; -.react-codemirror2, -.CodeMirror { - width: 100% !important; - height: inherit !important; -} - .cm-editor { background-color: transparent !important; }