From 206a6362b16ce4fdef2f0208b1eea334ce3af557 Mon Sep 17 00:00:00 2001 From: Leon van Kammen Date: Mon, 6 Jan 2025 15:57:27 +0100 Subject: [PATCH] update codemirror + added position args --- .../root/opt/codemirror/codemirror | 12 +- .../root/opt/codemirror/codemirror.js | 112 ++++++++++-------- 2 files changed, 67 insertions(+), 57 deletions(-) diff --git a/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror b/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror index 3c80ac4..5a304ca 100755 --- a/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror +++ b/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror @@ -1,8 +1,8 @@ #!/bin/sh -test -n "$1" || { echo "usage: codemirror "; exit 0; } - -me="$(dirname $(readlink -f $0))" -file="$(readlink -f "$1")" - -$me/codemirror.js "$file" +test -n "$1" || { echo "usage: codemirror "; exit 0; } + +me="$(dirname $(readlink -f $0))" +file="$(readlink -f "$1")" + +$me/codemirror.js "$file" $2 $3 $4 echo "press ctrl-Q to exit editor" diff --git a/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror.js b/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror.js index cc86580..7aba7ce 100755 --- a/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror.js +++ b/buildroot-v86/board/v86/rootfs_overlay/root/opt/codemirror/codemirror.js @@ -1,6 +1,6 @@ #!/bin/js - if( args[1] == undefined ) return "usage: codemirror " +let keymap = "default" // "vim" if( AFRAME.components.codemirror ) delete AFRAME.components.codemirror AFRAME.registerComponent('codemirror', { @@ -9,6 +9,7 @@ AFRAME.registerComponent('codemirror', { term: { type:"selector", default: "[isoterminal]" }, width: { type:"number", default:700}, height: { type:"number", default:500}, + keymap: { type:"string", default:"default"} }, init: function () { @@ -40,34 +41,34 @@ AFRAME.registerComponent('codemirror', { css: (me) => `.CodeMirror{ width: ${me.com.data.width}px !important; height: ${me.com.data.height-30}px !important; - } - .cm-s-shadowfox .CodeMirror-cursor { + } + .cm-s-shadowfox .CodeMirror-cursor { border-left: 10px solid #a5f !important; visibility: visible !important; - } - .codemirror *{ - font-size: 14px; - font-family: "Cousine",Liberation Mono,DejaVu Sans Mono,Courier New,monospace; - font-weight:500 !important; - letter-spacing: 0 !important; - text-shadow: 0px 0px 10px #F075; - } + } + .codemirror *{ + font-size: 14px; + font-family: "Cousine",Liberation Mono,DejaVu Sans Mono,Courier New,monospace; + font-weight:500 !important; + letter-spacing: 0 !important; + text-shadow: 0px 0px 10px #F075; + } - .wb-body:has(> .codemirror){ - overflow:hidden; - } + .wb-body:has(> .codemirror){ + overflow:hidden; + } - .CodeMirror { - margin-top:18px; - } - .cm-s-shadowfox.CodeMirror { - background:transparent !important; - } - ` + .CodeMirror { + margin-top:18px; + } + .cm-s-shadowfox.CodeMirror { + background:transparent !important; + } + ` }, createEditor: function(value){ - this.el.setAttribute("window", `title: codemirror; uid: ${this.el.dom.id}; attach: #overlay; dom: #${this.el.dom.id}; width: ${this.data.width}px; height: ${this.data.height}px; class: no-full, no-resize`) + this.el.setAttribute("window", `title: codemirror; uid: ${this.el.dom.id}; attach: #overlay; dom: #${this.el.dom.id}; width: ${this.data.width}px; height: ${this.data.height}px; class: no-full, no-max, no-resize`) this.editor = CodeMirror( this.el.dom, { value, mode: this.data.file.match(/\.js$/) ? "text/javascript" : @@ -80,6 +81,7 @@ AFRAME.registerComponent('codemirror', { lineNumbers: true, styleActiveLine: true, matchBrackets: true, + keyMap: this.data.keymap, Tab: "indentMore", defaultTab: function(cm) { if (cm.somethingSelected()) cm.indentSelection("add"); @@ -92,15 +94,17 @@ AFRAME.registerComponent('codemirror', { this.el.emit('close',true) // window.js will react accordingly } }) - this.editor.updateFile = AFRAME.utils.throttle( (file,str) => { - this.updateFile(file,str) - }, 1500) + this.editor.updateFile = (file,str) => { + clearTimeout( this.editor.updateFile.tid) + setTimeout( (file,str) => { + this.updateFile(file,str) + },500, file,str) + } this.editor.on('change', (instance,changeObj) => { this.editor.updateFile( this.data.file, instance.getValue() ) }) - this - .handleFocus() + this.handleFocus() setTimeout( () => { this.el.setAttribute("html-as-texture-in-xr", `domid: #${this.el.dom.id}`) // only show aframe-html in xr @@ -137,15 +141,15 @@ AFRAME.registerComponent('codemirror', { DOMready: function(e){ this.isoterminal.worker.read_file(this.data.file) - .then( this.isoterminal.convert.Uint8ArrayToString ) - .then( (str) => { - console.log("creating editor: "+this.data.file) - this.createEditor( str ) - }) - .catch( (e) => { - console.log("error opening "+this.data.file+", creating new one") - this.createEditor("") - }) + .then( this.isoterminal.convert.Uint8ArrayToString ) + .then( (str) => { + console.log("creating editor: "+this.data.file) + this.createEditor( str ) + }) + .catch( (e) => { + console.log("error opening "+this.data.file+", creating new one") + this.createEditor("") + }) }, }, @@ -198,33 +202,39 @@ This is a help file which describes the application. It will be rendered thru troika text, and will contain headers based on non-punctualized lines separated by linebreaks, in above's case "\nHelloworld application\n" will qualify as header. - ` +` } }); AFRAME.utils.require({ - codemirrorjs: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.1/codemirror.js", - codemirrorcss: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/codemirror.css", - cmtheme: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/theme/shadowfox.css" + codemirrorjs: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.1/codemirror.js", + codemirrorcss: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/codemirror.css", + cmtheme: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/theme/shadowfox.css" }) -.then( () => AFRAME.utils.require({ +.then( () => { + + let extras = { cmxml: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/xml/xml.js", cmjavascript: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/javascript/javascript.js", cmcss: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/css/css.js", cmlua: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/lua/lua.js", cmpython: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/python/python.js", cmmarkdown: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/markdown/markdown.js", - highlight: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/htmlmixed/htmlmixed.js", - }) -) -.then( () => { - let el = document.createElement("a-entity") - el.setAttribute("codemirror", `file: ${args[1]}`) - document.querySelector("a-scene").appendChild(el) + highlight: "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/mode/htmlmixed/htmlmixed.js" + } + if( keymap == "vim" ) extras.cmvim = "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.35.0/keymap/vim.js"; + return AFRAME.utils.require(extras) +}) +.then( () => { + let el = document.createElement("a-entity") + el.setAttribute("codemirror", `file: ${args[1]}`) + if( args.length == 5 ){ + el.setAttribute("position",`${args[2]} ${args[3]} ${args[4]}`) + } + document.querySelector("a-scene").appendChild(el) }) - -return "" // empty stdout(put) -// for shellscript-equivalent see bin/codemirror + +return "" // empty stdout(put)