.env

@@ -1,2 +0,0 @@
-git remote | grep codeberg || git remote add codeberg git@codeberg.org:xrsh/xrsh-com.git
-git remote | grep c-frame  || git remote add c-frame git@github.com:c-frame/xrsh-com.git

.forgejo/workflows/mirror_to_github.yaml

@@ -13,7 +13,7 @@ jobs:
       - run: "echo \"${{ secrets.SSHKEY_APPS }}\" > ~/.ssh/id_rsa" 
       - run: ssh-keyscan github.com >> ~/.ssh/known_hosts   # see https://gist.github.com/vikpe/34454d69fe03a9617f2b009cc3ba200b
       - run: chmod 600 -R ~/.ssh
-      - run: git remote add github git@github.com:c-frame/xrsh-com.git
+      - run: git remote add github git@github.com:coderofsalvation/xrsh-apps 
       - run: git push github main
       # *todo* trigger deploy at website
       #- run: git clone git@github.com:coderofsalvation/xrsh xrsh.github # now push empty commit to deploy website

.gitignore

@@ -1,3 +0,0 @@
-com/isoterminal/mnt/hook.d
-com/isoterminal/mnt/console*
-com/isoterminal/mnt/dev/*

README.awk

@@ -1,41 +0,0 @@
-#!/usr/bin/env -S awk -f
-# a no-nonsense source-to-markdown generator which scans for:
-#
-# /**
-#  * # foo
-#  *
-#  * this is markdown $(cat bar.md)
-#  */
-#
-#  var foo; //  comment with 2 leading spaces is markdown too $(date)
-#
-# easily refactorable to hash-based languages (py/bash/perl/lua e.g.) 
-# by changing the regexes
-#
-
-BEGIN{
-  # printf README.md until '# Component List'
-  system("grep -B9999 '# Component List' README.md")
-  print ""
-}
-
-/\$\(/                   { cmd=$0; 
-                           gsub(/^.*\$\(/,"",cmd); 
-                           gsub(/\).*/,"",cmd);
-                           cmd | getline stdout; close(cmd);
-                           sub(/\$\(.*\)/,stdout);
-                         } 
-/\/\*\*/                 { doc=1; sub(/^.*\/\*/,""); }
-doc && /\*\//            { doc=0;
-                           sub(/[[:space:]]*\*\/.*/,"");
-                           sub(/^[[:space:]]*\*[[:space:]]?/,"");
-                           print
-                         }
-doc && /^[[:space:]]*\*/ { sub(/^[[:space:]]*\*[[:space:]]?/,""); 
-                           print 
-                         }
-#!doc && /\/\/  /         { sub(".*//  ",""); 
-#                           sub("# ","\n# ");
-#                           sub("> ","\n> ");
-#                           print
-#                         }

README.md

@@ -1,175 +1,13 @@
 # XRshell apps & components
 
-<img src='https://codeberg.org/xrsh/xrsh/media/branch/main/xrsh.svg' width="25%"/>
+<img src='https://github.com/coderofsalvation/xrshell/raw/main/src/assets/logo.svg' width="25%"/>
 
-This is a library of useful AFRAME components used in [XRSH](https://xrsh.isvery.ninja) [or in any AFRAME app].<br>
-Characteristics:
-
-* selfcontained 
-* auto-loading of dependencies (via [AFRAME.utils.require()](com/require.js) see this [example](com/example/helloworld.js))
+This is a library of useful AFRAME components which can be used in any AFRAME app, which are higher-level than usual (and used in [XRSH](https://coderofsalvation.github.io/xrsh):
 
 # Usage
 
 ```html
-<script src="https://codeberg.org/xrsh/xrsh-com/com/require.js"/>
-<script src="https://codeberg.org/xrsh/xrsh-com/com/example/helloworld.js"/>
+<script src="https://coderofsalvation.github.io/xrsh/src/com/example/helloworld.js"/>
 
 <a-entity helloworld="foo:1" class="cubes" name="box">  
 ```
-
-See component list below
-
-> this README.md is generated by running `echo "$(./README.awk com/*.js)" > README.md`
-
-## Credits
-
-This project is partially funded through [NGI0 Entrust](https://nlnet.nl/entrust), a fund established by [NLnet](https://nlnet.nl) with financial support from the European Commission's [Next Generation Internet](https://ngi.eu) program. Learn more at the [NLnet project page](https://nlnet.nl/project/xrsh).
-
-[<img src="https://nlnet.nl/logo/banner.png" alt="NLnet foundation logo" width="20%" />](https://nlnet.nl)
-[<img src="https://nlnet.nl/image/logos/NGI0_tag.svg" alt="NGI Zero Logo" width="20%" />](https://nlnet.nl/entrust)
-
-# Component List
-
-
-## [data_events](com/data_events.js)
-
-allows components to react to data changes 
-
-```html 
- <script>
-   AFRAME.registerComponent('mycom',{
-     init: function(){ this.data.foo = 1 }, 
-     event: {
-       foo:   (e) => alert("I was updated!")
-     }
-   })
- </script>
-
- <a-entity mycom data_events/>
-```
-
-
-
-## [html-as-texture-in-xr](com/html-as-texture-in-xr.js)
-
-shows domid **only** in immersive mode 
-(wrapper around [aframe-htmlmesh](https://ada.is/aframe-htmlmesh/)
-
-It also sets class 'XR' to the (HTML) body-element in immersive mode.
-This allows CSS (in [dom component](com/dom.js)) to visually update accordingly.
-
-> depends on [AFRAME.utils.require](com/require.js)
-
-```html 
- <style type="text/css">
-   .XR #foo { color:red; }
- </style>
-
- <a-entity html-as-texture-in-xr="domid: #foo">
-   <b id="foo">hello</b>
- </a-entitiy>
-```
-
-| property     | type               |
-|--------------|--------------------|
-| `domid`      | `string`           |
-
-| event        | target     | info                                 |
-|--------------|------------|--------------------------------------|
-| `3D`         | a-scene    | fired when going into immersive mode |
-| `2D`         | a-scene    | fired when leaving immersive mode    |
-
-
-
-## [isoterminal](com/isoterminal.js)
-
-Renders a windowed terminal in both (non)immersive mode.
-It displays an interactive javascript console or boots into 
-a Linux ISO image (via WASM).
-
-```html 
-  <a-entity isoterminal="iso: xrsh.iso" position="0 1.6 -0.3"></a-entity>
-```
-
-> depends on [AFRAME.utils.require](com/require.js)
-
-| property         | type      | default                | info |
-|------------------|-----------|------------------------|------|
-| `iso`            | `string`  | https`//forgejo.isvery.ninja/assets/xrsh-buildroot/main/xrsh.iso" | |
-| `overlayfs`      | `string`  | *WORK-IN-PROGRESS* | |
-| `width`          | `number`  |  800   ||
-| `height`         | `number`  |  600   ||
-| `depth`          | `number`  |  0.03  ||
-| `lineHeight`     | `number`  |  18    ||
-| `prompt`         | `boolean` |  true  | boot straight into ISO or give user choice |
-| `padding`        | `number`` |  18    | |
-| `maximized`      | `boolean` | false  | |
-| `minimized`      | `boolean` | false  | |
-| `muteUntilPrompt`| `boolean` | true   | mute stdout until a prompt is detected in ISO |
-| `HUD`            | `boolean` | false  | link to camera movement |
-| `transparent`    | `boolean` | false  | heavy, needs good gpu |
-| `memory`         | `number`  | 60     | VM memory (in MB) [NOTE` quest or smartphone webworker might crash > 40mb ] |
-| `bufferLatency`  | `number`  | 1      | in ms` bufferlatency from webworker to term (batch-update every char to texture) |
-| `debug`          | `boolean` | false  | |
-| `emulator`       | `string`  | fbterm | terminal emulator |
-
-> for more info see [xrsh.isvery.ninja](https://xrsh.isvery.ninja)
-
-Component design:
-```
-                  css/html template                                                                                
-                                                                                                                    
-                    ┌─────────┐   ┌────────────┐                  exit-AR                                
-           ┌───────►│ com/dom ┼──►│ com/window ├───────────────── exit-VR  ◄─┐                           
-           │        └─────────┘   └───────────┬┘                             │                           
-           │                                  │                              │                           
-┌──────────┴────────┐                         │   ┌───────────┐    ┌─────────────────────────────┐
-│  com/isoterminal  ├────────────────────────────►│com/term.js│    │com/html-as-texture-in-XR.js │
-└────────┬─┬────────┘                         │   └──┬─────┬▲─┘    └─────────────────────────────┘
-         │ │        ┌────────┐             ┌──▼──────▼──────┐                     ││        │                       
-         │ └───────►│ plane  ├─────►text───┼►div#isoterminal│◄────────────────── enter-VR   │                       
-         │          └────────┘             └────────────────┘                    enter-AR ◄─┘                       
-         │                                   │                                                     
-         │                                   │                                                                   
-         │                             ISOTerminal.js                                                                   
-         │                ┌───────────────────────────┐           
-         │                │ com/isoterminal/worker.js ├            
-         │                └──────────────┌────────────┤            
-         │                     │         │ v86.js     │            
-         │                     │         │ feat/*.js  │            
-         │                     │         │ libv86.js  │            
-         │                     │         └────────────┘            
-         │                     │         
-         └─────────────────────┘    
-                                                                                                                    
-NOTE: For convenience reasons, events are forwarded between com/isoterminal.js, worker.js and ISOTerminal
-      Instead of a melting pot of different functionnames, events are flowing through everything (ISOTerminal.emit())
-```       
-
-
-## [pastedrop](com/pastedrop.js)
-
-detects user copy/paste and file dragdrop action
-and clipboard functions
-
-```html 
-  <a-entity pastedrop/>
-```
-
-| event        | target | info                                                                                               |
-|--------------|--------|------------------------------------------|
-| `pasteFile`  | self   | always translates input to a File object |
-
-
-## [require](com/require('').js)
-
-automatically requires dependencies 
-
-```javascript
-await AFRAME.utils.require( this.dependencies )               (*) autoload missing components
-await AFRAME.utils.require( this.el.getAttributeNames() )     (*) autoload missing components
-await AFRAME.utils.require({foo: "https://foo.com/aframe/components/foo.js"},this)
-await AFRAME.utils.require(["./app/foo.js","foo.css"],this)
-```
-
-> (*) = prefixes baseURL AFRAME.utils.require.baseURL ('./com/' e.g.)

com.refactor/aframe-inspector.js

@@ -0,0 +1,75 @@
+AFRAME.registerComponent('aframe-inspector', {
+  schema: { 
+    foo: { type:"string"}
+  },
+
+  init: function () { 
+    document.querySelector('a-scene').setAttribute("inspector","url: https://cdn.jsdelivr.net/gh/aframevr/aframe-inspector@master/dist/aframe-inspector.min.js")
+  },
+
+  requires:{ },
+
+  events:{
+
+    // component events
+    ready:         function(e){ },
+
+    launcher:      function(e){ 
+      $('[inspector]').components.inspector.openInspector()
+    },
+
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "inspector",
+    "name": "AFRAME inspector",
+    "icons": [
+      {
+        "src": "https://css.gg/list-tree.svg",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "use CTRL+ALT+i to launch inspector",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application 
+
+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.
+    `
+  }
+
+});
+

com.refactor/isoterminal.js

@@ -0,0 +1,182 @@
+AFRAME.registerComponent('isoterminal', {
+  schema: {
+    cols: { type: 'number', default: 120 },
+    rows: { type: 'number', default: 50 },
+    transparent: { type:'boolean', default:false } // need good gpu
+  },
+
+  init: function(){
+    this.el.object3D.visible = false
+  },
+
+  requires:{
+    html:        "https://unpkg.com/aframe-htmlmesh@2.1.0/build/aframe-html.js",  // html to AFRAME
+    winboxjs:    "https://unpkg.com/winbox@0.2.82/dist/winbox.bundle.min.js",     // deadsimple windows: https://nextapps-de.github.io/winbox
+    winboxcss:   "https://unpkg.com/winbox@0.2.82/dist/css/winbox.min.css",       //
+    xtermcss:    "https://unpkg.com/xterm@3.12.0/dist/xterm.css",
+    xtermjs:     "https://unpkg.com/xterm@3.12.0/dist/xterm.js",
+    axterm:      "https://unpkg.com/aframe-xterm-component/aframe-xterm-component.js"
+  },
+
+  dom: {
+    scale:   3,
+    events:  ['click','keydown'],
+    html:    (me) => `<div></div>`,
+
+    css:     (me) => `.isoterminal{
+                overflow:hidden;
+              }`
+  },
+
+  createTerminal: function(){
+    this.el.object3D.visible = true
+
+    const term = this.term = new Terminal({
+      allowTransparency: this.data.transparent,
+      cursorBlink: true,
+      disableStdin: false,
+      rows: this.data.rows,
+      cols: this.data.cols,
+      fontSize: 16
+    })
+
+    term.open(this.el.dom)
+    this.canvas = this.el.dom.querySelector('.xterm-text-layer')
+    this.canvas.id = 'terminal-' + (terminalInstance++)
+    this.canvasContext = this.canvas.getContext('2d')
+
+    this.cursorCanvas = this.el.dom.querySelector('.xterm-cursor-layer')
+
+    //this.el.setAttribute('material', `transparent: ${this.data.transparent?'true':'false'}; src: #${this.canvas.id}` )
+
+    term.on('refresh', () => {
+      console.log("refresh")
+    })
+
+    term.on('data', (data) => {
+      this.el.emit('xterm-data', data)
+    })
+
+    this.el.addEventListener('click', () => {
+      term.focus()
+    })
+
+    const message = 'Hello from \x1B[1;3;31mWebVR\x1B[0m !\r\n$ '
+    term.write(message)
+  },
+
+  events:{
+
+    // combined AFRAME+DOM reactive events
+    click:   function(e){ }, //
+    keydown: function(e){ }, //
+
+    // reactive events for this.data updates
+    myvalue: function(e){ this.el.dom.querySelector('b').innerText = this.data.myvalue },
+
+    ready: function( ){
+      this.el.dom.style.display = 'none'
+    },
+
+    launcher:  function(){
+      this.el.dom.style.display = ''
+      this.createTerminal()
+
+      new WinBox( this.manifest.iso + ' ' + this.manifest.name, {
+        width: window.innerWidth*0.8, 
+        height: window.innerHeight*0.8,
+        x:"center",
+        y:"center",
+        id:  this.el.uid, // important hint for html-mesh
+        root: document.querySelector("#overlay"),
+        mount: this.el.dom,
+        onclose: () => {
+          if( !confirm('do you want to kill this virtual machine and all its processes?') ) return true
+          this.el.dom.style.display = 'none'
+          return false
+        }
+      });
+
+    },
+
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "iso": "linux-x64-4.15.iso",
+    "short_name": "ISOTerm",
+    "name": "terminal",
+    "icons": [
+      {
+        "src": "https://css.gg/terminal.svg",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Hello world information",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application
+
+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.registerComponent('xterm-shell', {
+  dependencies: ['xterm'],
+  init: function() {
+    const message = 'Run \x1B[1;3;31m\'node server.js\'\x1B[0m to open a shell\r\n'
+    const xterm = this.el.components['xterm']
+
+    xterm.write(message)
+
+    const socket = new WebSocket('ws://localhost:8080/')
+
+    // Listen on data, write it to the terminal
+    socket.onmessage = ({data}) => {
+      xterm.write(data)
+    }
+
+    socket.onclose = () => {
+      xterm.write('\r\nConnection closed.\r\n')
+    }
+
+    // Listen on user input, send it to the connection
+    this.el.addEventListener('xterm-data', ({detail}) => {
+      socket.send(detail)
+    })
+  }
+})

com.refactor/load.js

@@ -0,0 +1,111 @@
+AFRAME.registerComponent('load', {
+  schema: { 
+    foo: { type:"string"}
+  },
+
+  init: function () {
+    this.el.object3D.visible = false
+
+    //this.el.innerHTML = ` `
+  },
+
+  requires:{
+    // somecomponent:        "https://unpkg.com/some-aframe-component/mycom.min.js"
+  },
+
+  events:{
+
+    // component events
+    somecomponent: function( ){ console.log("component requirement mounted") },
+    ready:         function(e){ console.log("requires are loaded") },
+
+    launcher:      function(e){ 
+      this.filedialog( (data) => {
+        if( data.match(/<html/) && confirm('reload new XR shell environment?') ){
+          return document.write(data)
+        }
+        if( data.match(/<a-/) ){
+          let el = document.createElement('a-entity')
+          el.innerHTML = data
+          AFRAME.scenes[0].appendChild(el)
+        }
+      })
+    },
+
+
+  },
+
+  filedialog: function(onDone){
+    if( !this.fileEl ){
+      let el = this.fileEl = document.createElement('input')
+      el.type = "file"
+      el.addEventListener('change', (e) =>{
+        var file = e.target.files[0];
+        if (!file) {
+          return;
+        }
+        var reader = new FileReader();
+        reader.onload = function(e) {
+          var contents = e.target.result;
+          onDone(contents)
+        };
+        reader.readAsText(file);
+      })
+      document.body.appendChild(el)
+    }
+    this.fileEl.click()
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "Hello world",
+    "name": "Hello world",
+    "icons": [
+      {
+        "src": "https://css.gg/arrow-up-r.svg",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Hello world information",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application 
+
+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.
+    `
+  }
+
+});
+

com.refactor/manual.js

@@ -0,0 +1,130 @@
+AFRAME.registerComponent('manual', {
+  schema: { 
+    foo: { type:"string"}
+  },
+
+  init: function () {  
+    // requires are loaded
+    this.el.addEventListener('ready', () => this.el.dom.style.display = 'none' )
+  },
+
+  requires:{
+    html:        "https://unpkg.com/aframe-htmlmesh@2.1.0/build/aframe-html.js",     // html to AFRAME
+    winboxjs:    "https://unpkg.com/winbox@0.2.82/dist/winbox.bundle.min.js",        // deadsimple windows: https://nextapps-de.github.io/winbox
+    winboxcss:   "https://unpkg.com/winbox@0.2.82/dist/css/winbox.min.css",          // deadsimple windows: https://nextapps-de.github.io/winbox
+  },
+
+  dom: {
+    scale:   3,
+    events:  ['click','keydown'],
+    html:    (me) => `<div>
+
+                  <h1>Welcome to XRSHell</h1>
+                  <br>
+                  <!-- <img src="https://i.imgur.com/BW22wrb.png"/> -->
+                  <br><br>
+                  The <b>xrsh</b> (xrshell) brings the <a href="https://en.wikipedia.org/wiki/Free_and_open-source_software" target="_blank">FOSS</a>- and <a href="https://en.wikipedia.org/wiki/Linux" target="_blank">Linux</a>-soul to <a href="https://en.wikipedia.org/wiki/WebXR" target="_blank">WebXR</a>, promoting the use of (interactive text) terminal and user-provided operating systems inside WebXR.
+                  <br><br>Technically, <b>xrsh</b> is a bundle of freshly created re-usable FOSS WebXR components.<br>These provide a common filesystem interface for interacting with WebXR, offering the well-known linux/unix toolchain including a commandline to invoke, store, edit and run WebXR utilities - regardless of their implementation.
+                  <br><br>Think of it as termux for the VR/AR headset browser, which can be used to e.g. livecode (using terminal auto-completion!) for XR component (registries).                
+
+                  <br>
+                  <ul>
+                    <li><a href="https://forgejo.isvery.ninja/xrsh" target="_blank">source xrsh</a></li>
+                    <li><a href="https://forgejo.isvery.ninja/xrsh-apps" target="_blank">source xrsh apps</a></li>
+                    <li><a href="https://forgejo.isvery.ninja/xrsh-media" target="_blank">roadmap meeting recordings</a></li>
+                  </ul>
+
+                      </div>`,
+    css:     (me) => `.manual > div { padding:11px }`
+  },
+
+  events:{
+
+    // component events
+    html:     function( ){ console.log("html-mesh requirement mounted") },
+
+    // combined AFRAME+DOM reactive events
+    click:   function(e){ }, // 
+    keydown: function(e){ }, // 
+
+    // reactive events for this.data updates 
+    myvalue: function(e){ this.el.dom.querySelector('b').innerText = this.data.myvalue },
+
+    launcher:  function(){
+      new WinBox( this.manifest.name, { 
+        width: '70%',
+        height: '70%',
+        x:"center",
+        y:"center",
+        id:  this.el.uid, // important hint for html-mesh  
+        root: document.querySelector("#overlay"),
+        mount: this.el.dom,
+        onclose: () => { this.el.dom.style.display = 'none'; return false; }
+      });
+      this.el.dom.style.display = ''
+      this.el.setAttribute("xrf", document.location.search || "https://coderofsalvation.github.io/xrsh-media/assets/background.glb")
+      // navigate with: AFRAME.XRF.navigator.to("https://xrfragment.org/index.glb")
+    },
+
+    DOMready: function( ){ 
+      this.el.dom.style.display = 'none'
+      console.log("this.el.dom has been added to DOM")
+      this.data.myvalue = 1
+      setInterval( () => this.data.myvalue++, 100 )
+    }
+
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "XRSH Manual",
+    "name": "XRSH Manual",
+    "icons": [
+      {
+        "src": "https://css.gg/coffee.svg",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Hello world information",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application 
+
+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.
+    `
+  }
+
+});
+

com.refactor/vconsole.js

@@ -0,0 +1,95 @@
+AFRAME.registerComponent('vconsole', {
+  schema: { 
+    foo: { type:"string"}
+  },
+
+  init: function () {  
+      //AFRAME.XRF.navigator.to("https://coderofsalvation.github.io/xrsh-media/assets/background.glb")
+    document.head.innerHTML += `
+      <style type="text/css">
+        .vc-mask   { display: none !important }
+        .vc-switch { display: none !important }
+        .vc-panel  {
+          right:unset !important;
+          width:100%;
+          max-width:600px;
+          z-index:100 !important;
+        }
+      </style>
+    `
+  },
+
+  requires:{
+    vconsole:        "https://unpkg.com/vconsole@latest/dist/vconsole.min.js"
+  },
+
+  events:{
+
+    // requires are loaded
+    ready: function(e){
+      this.vConsole = new window.VConsole() 
+      document.querySelector('.vc-mask').remove()
+      document.querySelector('.vc-switch').remove()
+    },
+
+    launcher: function(){
+      if( !this.vConsole ) return 
+      let panel = document.querySelector('.vc-panel') 
+      if( panel.style.display == 'none' ) this.vConsole.show()
+      else this.vConsole.hide()
+    },
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "Hello world",
+    "name": "Hello world",
+    "icons": [
+      {
+        "src": "https://css.gg/border-bottom.svg",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Hello world information",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application 
+
+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.
+    `
+  }
+
+});
+

com/data2event.js

@@ -1,5 +1,5 @@
-/**
- * ## [data_events](com/data_events.js)
+/*
+ * ## data_events
  *
  * allows components to react to data changes 
  *
@@ -18,33 +18,29 @@
  *
  */
 
-if( !AFRAME.components.data2event ){
+AFRAME.registerComponent('data2event',{
 
-  AFRAME.registerComponent('data2event',{
-
-    init: function(){
-      setTimeout( () => {
-        for( let i in this.el.components ){
-          let com = this.el.components[i]
-          if( typeof com.data == 'object' ){
-            com.data = this.reactify( this.el, com.data)
-          }
+  init: function(){
+    setTimeout( () => {
+      for( let i in this.el.components ){
+        let com = this.el.components[i]
+        if( typeof com.data == 'object' ){
+          com.data = this.reactify( this.el, com.data)
         }
-      },50)
-    },
+      }
+    },50)
+  },
 
-    reactify: function(el,data){
-      return new Proxy(data, {
-        get(me,k,v)  { 
-          return me[k]
-        },
-        set(me,k,v){
-          me[k] = v
-          el.emit(k,{el,k,v})
-        }
-      })
-    },
+  reactify: function(el,data){
+    return new Proxy(data, {
+      get(me,k,v)  { 
+        return me[k]
+      },
+      set(me,k,v){
+        me[k] = v
+        el.emit(k,{el,k,v})
+      }
+    })
+  },
 
-  })
-
-}
+})

com/dom.js

@@ -1,5 +1,5 @@
 /*
- * ## [dom](com/dom.js)
+ * ## dom
  *
  * instances reactive DOM component from AFRAME component's `dom` metadata 
  *
@@ -32,99 +32,105 @@
  * | `DOMready`   | self   | fired when dom component (`this.dom`) is created                                                   |
  */
 
-if( !AFRAME.components.dom ){
+AFRAME.registerComponent('dom',{
 
-  AFRAME.registerComponent('dom',{
-
-    init: function(){
-      Object.values(this.el.components)
-      .map( (c) => {
-        if( c.dom && c.attrName != "dom"){ 
-          this.dom = c.dom
-          this.com = c
-        }
-      })
-      if( !this.dom || !this.com){
-        return console.warn('dom.js did not find a .dom object inside component')
+  init: function(){
+    Object.values(this.el.components)
+    .map( (c) => {
+      if( c.dom && c.attrName != "dom"){ 
+        this.dom = c.dom
+        this.com = c
       }
+    })
+    if( !this.dom || !this.com){
+      return console.warn('dom.js did not find a .dom object inside component')
+    }
 
-      this
-      .ensureOverlay()
-      .addCSS()
-      .createReactiveDOMElement()
-      .assignUniqueID()
-      .scaleDOMvsXR()
-      .triggerKeyboardForInputs()
+    this
+    .ensureOverlay()
+    .addCSS()
+    .createReactiveDOMElement()
+    .assignUniqueID()
+    .scaleDOMvsXR()
+    .triggerKeyboardForInputs()
+    .stubRequestAnimationFrame()
 
-      document.querySelector('#overlay').appendChild(this.el.dom)
-      this.el.emit('DOMready',{el: this.el.dom})
-    },
+    document.querySelector('#overlay').appendChild(this.el.dom)
+    this.el.emit('DOMready',{el: this.el.dom})
+  },
 
-    ensureOverlay: function(){
-      // ensure overlay
-      let overlay = document.querySelector('#overlay')
-      if( !overlay ){
-        overlay = document.createElement('div')
-        overlay.id = "overlay"
-        overlay.setAttribute('style','position:fixed;top:0px;left:0px;right:0px;bottom:0px')
-        document.body.appendChild(overlay)
-        //  sceneEl.setAttribute("webxr","overlayElement:#overlay")
+  ensureOverlay: function(){
+    // ensure overlay
+    let overlay = document.querySelector('#overlay')
+    if( !overlay ){
+      overlay = document.createElement('div')
+      overlay.id = "overlay"
+      overlay.setAttribute('style','position:fixed;top:0px;left:0px;right:0px;bottom:0px')
+      document.body.appendChild(overlay)
+      //  sceneEl.setAttribute("webxr","overlayElement:#overlay")
+    }
+    return this
+  },
+
+  reactify: function(el,data){
+    return new Proxy(data, {
+      get(me,k,v)  { 
+        return me[k]
+      },
+      set(me,k,v){
+        me[k] = v
+        el.emit(k,{el,k,v})
       }
-      return this
-    },
+    })
+  },
 
-    reactify: function(el,data){
-      return new Proxy(data, {
-        get(me,k,v)  { 
-          return me[k]
-        },
-        set(me,k,v){
-          me[k] = v
-          el.emit(k,{el,k,v})
-        }
-      })
-    },
+  // creates el.dom  (the 2D DOM object)
+  createReactiveDOMElement: function(){
+    this.el.dom = document.createElement('div')
+    this.el.dom.innerHTML = this.dom.html(this)
+    this.el.dom.className = this.dom.attrName 
+    this.com.data = this.reactify( this.el, this.com.data )
+    if( this.dom.events ) this.dom.events.map( (e) => this.el.dom.addEventListener(e, (ev) => this.el.emit(e,ev) ) )
+    this.el.dom = this.el.dom.children[0]
+    return this
+  },
 
-    // creates el.dom  (the 2D DOM object)
-    createReactiveDOMElement: function(){
-      this.el.dom = document.createElement('div')
-      this.el.dom.innerHTML = this.dom.html(this)
-      this.el.dom.className = this.dom.attrName 
-      this.com.data = this.reactify( this.el, this.com.data )
-      if( this.dom.events ) this.dom.events.map( (e) => this.el.dom.addEventListener(e, (ev) => this.el.emit(e,ev) ) )
-      this.el.dom = this.el.dom.children[0]
-      return this
-    },
+  assignUniqueID: function(){
+    // assign unique app id so it's easy to reference (by html-mesh component e.g.)
+    if( !this.el.uid ) this.el.uid = this.el.dom.id = '_'+String(Math.random()).substr(10)
+    return this
+  },
 
-    assignUniqueID: function(){
-      // assign unique app id so it's easy to reference (by html-mesh component e.g.)
-      if( !this.el.uid ) this.el.uid = this.el.dom.id = '_'+String(Math.random()).substr(10)
-      return this
-    },
+  addCSS: function(){
+    if( this.dom.css && !document.head.querySelector(`style#${this.com.attrName}`) ){
+      document.head.innerHTML += `<style id="${this.com.attrName}">${this.dom.css(this)}</style>`
+    }
+    return this
+  },
 
-    addCSS: function(){
-      if( this.dom.css && !document.head.querySelector(`style#${this.com.attrName}`) ){
-        document.head.innerHTML += `<style id="${this.com.attrName}">${this.dom.css(this)}</style>`
+  scaleDOMvsXR: function(){
+    if( this.dom.scale ) this.el.setAttribute('scale',`${this.dom.scale} ${this.dom.scale} ${this.dom.scale}`)
+    return this
+  },
+
+  triggerKeyboardForInputs: function(){
+    // https://developer.oculus.com/documentation/web/webxr-keyboard ;
+    [...this.el.dom.querySelectorAll('[type=text]')].map( (input) => {
+      let triggerKeyboard = function(){
+        this.focus()
+        console.log("focus")
       }
-      return this
-    },
+      input.addEventListener('click', triggerKeyboard )
+    })
+    return this
+  },
 
-    scaleDOMvsXR: function(){
-      if( this.dom.scale ) this.el.setAttribute('scale',`${this.dom.scale} ${this.dom.scale} ${this.dom.scale}`)
-      return this
-    },
+  stubRequestAnimationFrame: function(){
+    // stub, because WebXR with overrule this (it will not call the callback as expected in immersive mode)
+    const requestAnimationFrame = window.requestAnimationFrame
+    window.requestAnimationFrame = (cb) => {
+      setTimeout( cb, 25 )
+    }
+  }
 
-    triggerKeyboardForInputs: function(){
-      // https://developer.oculus.com/documentation/web/webxr-keyboard ;
-      [...this.el.dom.querySelectorAll('[type=text]')].map( (input) => {
-        let triggerKeyboard = function(){
-          this.focus()
-          console.log("focus")
-        }
-        input.addEventListener('click', triggerKeyboard )
-      })
-      return this
-    },
-
-  })
-}
+})

com/example/helloworld-htmlform.js

@@ -57,7 +57,9 @@ AFRAME.registerComponent('helloworld-htmlform', {
       const instance = this.el.cloneNode(false)
       this.el.sceneEl.appendChild( instance )
       instance.setAttribute("dom",      "")
-      instance.setAttribute("show-texture-in-xr", "")  // only show aframe-html in xr 
+      instance.setAttribute("xd",       "")  // allows flipping between DOM/WebGL when toggling XD-button
+      instance.setAttribute("visible",  AFRAME.utils.XD() == '3D' ? 'true' : 'false' )
+      instance.setAttribute("position", AFRAME.utils.XD.getPositionInFrontOfCamera(0.5) )
       instance.setAttribute("grabbable","")
       instance.object3D.quaternion.copy( AFRAME.scenes[0].camera.quaternion ) // face towards camera
 
@@ -73,11 +75,7 @@ AFRAME.registerComponent('helloworld-htmlform', {
           root: document.querySelector("#overlay"),
           mount: instance.dom,
           onclose: () => { instance.dom.style.display = 'none'; return false; },
-          oncreate: () => {
-            instance.setAttribute("position", AFRAME.utils.XD.getPositionInFrontOfCamera(0.5) )
-            instance.setAttribute("html",`html:#${instance.uid}; cursor:#cursor`)
-            instance.setAttribute("show-texture-in-xr","") // only show aframe-html texture in xr mode
-          }
+          oncreate: () => instance.setAttribute("html",`html:#${instance.uid}; cursor:#cursor`)
         });
         instance.dom.style.display = AFRAME.utils.XD() == '3D' ? 'none' : '' // show/hide
 

com/example/helloworld-iframe.js

@@ -87,9 +87,7 @@ AFRAME.registerComponent('helloworld-iframe', {
           onclose: () => { instance.dom.style.display = 'none'; return false; },
           oncreate: () => {
             com.data.url = URL
-            instance.setAttribute("position", AFRAME.utils.XD.getPositionInFrontOfCamera(0.5) )
             instance.setAttribute("html",`html:#${instance.uid}; cursor:#cursor`)
-            instance.setAttribute("show-texture-in-xr","") // only show aframe-html texture in xr mode
           }
         });
         instance.dom.style.display = ''

com/example/helloworld-window.js

@@ -5,7 +5,7 @@ AFRAME.registerComponent('helloworld-window', {
 
   requires:     {
     dom:         "./com/dom.js",                                                  // interpret .dom object
-    xrtexture:   "./com/html-as-texture-in-xr.js",                                // allow switching between 3D/3D 
+    xd:          "./com/dom.js",                                                  // allow switching between 2D/3D 
     html:        "https://unpkg.com/aframe-htmlmesh@2.1.0/build/aframe-html.js",  // html to AFRAME
     winboxjs:    "https://unpkg.com/winbox@0.2.82/dist/winbox.bundle.min.js",     // deadsimple windows: https://nextapps-de.github.io/winbox
     winboxcss:   "https://unpkg.com/winbox@0.2.82/dist/css/winbox.min.css",       // 
@@ -39,7 +39,10 @@ AFRAME.registerComponent('helloworld-window', {
       // instance this component
       const instance = this.el.cloneNode(false)
       this.el.sceneEl.appendChild( instance )
-      instance.setAttribute("dom",             "")
+      instance.setAttribute("dom",      "")
+      instance.setAttribute("xd",       "")  // allows flipping between DOM/WebGL when toggling XD-button
+      instance.setAttribute("visible",  AFRAME.utils.XD() == '3D' ? 'true' : 'false' )
+      instance.setAttribute("position", AFRAME.utils.XD.getPositionInFrontOfCamera(0.5) )
       instance.setAttribute("grabbable","")
       instance.object3D.quaternion.copy( AFRAME.scenes[0].camera.quaternion ) // face towards camera
 
@@ -56,9 +59,7 @@ AFRAME.registerComponent('helloworld-window', {
           root: document.querySelector("#overlay"),
           mount: instance.dom,
           onclose: () => { instance.dom.style.display = 'none'; return false; },
-          oncreate: () => {
-            instance.setAttribute("show-texture-in-xr",`domid: #${instance.uid}`) // only show aframe-html texture in xr mode
-          }
+          oncreate: () => instance.setAttribute("html",`html:#${instance.uid}; cursor:#cursor`)
         });
         instance.dom.style.display = '' // show
 

com/html-as-texture-in-xr.js

@@ -1,161 +0,0 @@
-/**
- * ## [html-as-texture-in-xr](com/html-as-texture-in-xr.js)
- *
- * shows domid **only** in immersive mode 
- * (wrapper around [aframe-htmlmesh](https://ada.is/aframe-htmlmesh/)
- *
- * It also sets class 'XR' to the (HTML) body-element in immersive mode.
- * This allows CSS (in [dom component](com/dom.js)) to visually update accordingly.
- *
- * > depends on [AFRAME.utils.require](com/require.js)
- *
- * ```html 
- *  <style type="text/css">
- *    .XR #foo { color:red; }
- *  </style>
- *
- *  <a-entity html-as-texture-in-xr="domid: #foo">
- *    <b id="foo">hello</b>
- *  </a-entitiy>
- * ```
- *
- * | property     | type               |
- * |--------------|--------------------|
- * | `domid`      | `string`           |
- *
- * | event        | target     | info                                 |
- * |--------------|------------|--------------------------------------|
- * | `3D`         | a-scene    | fired when going into immersive mode |
- * | `2D`         | a-scene    | fired when leaving immersive mode    |
- *
- */
-
-if( !AFRAME.components['html-as-texture-in-xr'] ){
-
-  AFRAME.registerComponent('html-as-texture-in-xr', {
-    schema: {
-      domid: { type:"string"},
-      faceuser: { type: "boolean", default: false}
-    },
-
-    dependencies:{
-      html:        "https://unpkg.com/aframe-htmlmesh@2.1.0/build/aframe-html.js",  // html to AFRAME
-      //html:          "https://coderofsalvation.github.io/aframe-htmlmesh/build/aframe-html.js"
-      //html:          "com/aframe-html.js"
-    },
-
-    init: async function () { 
-      let el = document.querySelector(this.data.domid)
-      if( ! el ){
-        return console.error("html-as-texture-in-xr: cannot get dom element "+this.data.dom.id)
-      }
-      let s = await AFRAME.utils.require(this.dependencies)
-      this.el.setAttribute("html",`html: ${this.data.domid}; cursor:#cursor; xrlayer: true`)
-      this.el.setAttribute("visible",  AFRAME.utils.XD() == '3D' ? 'true' : 'false' )
-      if( this.data.faceuser ){
-        this.el.setAttribute("position", AFRAME.utils.XD.getPositionInFrontOfCamera(0.4) )
-      }
-    },
-
-    manifest: { // HTML5 manifest to identify app to xrsh
-      "short_name": "show-texture-in-xr",
-      "name": "2D/3D switcher",
-      "icons": [],
-      "id": "/?source=pwa",
-      "start_url": "/?source=pwa",
-      "background_color": "#3367D6",
-      "display": "standalone",
-      "scope": "/",
-      "theme_color": "#3367D6",
-      "category":"system",
-      "shortcuts": [
-        {
-          "name": "What is the latest news?",
-          "cli":{
-            "usage":  "helloworld <type> [options]",
-            "example": "helloworld news",
-            "args":{
-              "--latest": {type:"string"}
-            }
-          },
-          "short_name": "Today",
-          "description": "View weather information for today",
-          "url": "/today?source=pwa",
-          "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
-        }
-      ],
-      "description": "use ESC-key to toggle between 2D / 3D",
-      "screenshots": [
-        {
-          "src": "/images/screenshot1.png",
-          "type": "image/png",
-          "sizes": "540x720",
-          "form_factor": "narrow"
-        }
-      ],
-      "help":`
-  Helloworld application
-
-      `
-    }
-
-  });
-
-  AFRAME.utils.XD = function(){
-    return document.body.classList.contains('XR') ? '3D' : '2D'
-  }
-
-  AFRAME.utils.XD.toggle = function(state){
-      state = state != undefined ? state : state || !document.body.className.match(/XR/)
-      document.body.classList[ state ? 'add' : 'remove'](['XR'])
-      AFRAME.scenes[0].emit( state ? '3D' : '2D')
-    }
-
-  AFRAME.utils.XD.getPositionInFrontOfCamera = function(distance){
-    const camera = AFRAME.scenes[0].camera;
-    let pos = new THREE.Vector3()
-    let direction = new THREE.Vector3();
-    // Get camera's forward direction (without rotation)
-    camera.getWorldDirection(direction);
-    camera.getWorldPosition(pos)
-    direction.normalize();
-    // Scale the direction by 1 meter
-    if( !distance ) distance = 1.5
-    direction.multiplyScalar(distance);
-    // Add the camera's position to the scaled direction to get the target point
-    pos.add(direction);
-    return pos
-  }
-
-  AFRAME.registerSystem('html-as-texture-in-xr',{
-
-    init: function(){
-      this.sceneEl.addEventListener('enter-vr',() => AFRAME.utils.XD.toggle(true) )
-      this.sceneEl.addEventListener('exit-vr', () => AFRAME.utils.XD.toggle(false) )
-      this.sceneEl.addEventListener('2D', () => this.showElements(false) )
-      this.sceneEl.addEventListener('3D', () => this.showElements(true) )
-
-      document.head.innerHTML += `<style type="text/css">
-        .XR #toggle_overlay{
-          background: transparent;
-          color: #3aacff;
-        }
-
-        /*
-        .XR #overlay{
-          visibility: hidden;
-        }
-        */
-      </style>`
-
-    },
-
-    showElements: function(state){
-      let els = [...document.querySelectorAll('[html-as-texture-in-xr]')]
-      els     = els.filter( (el) => el != this.el ? el : null ) // filter out self
-      els.map( (el) => el.setAttribute("visible", state ? true : false  ) )
-    }
-
-  })
-
-}

com/isoterminal.js

@@ -1,502 +1,479 @@
-/** 
- * ## [isoterminal](com/isoterminal.js)
- *
- * Renders a windowed terminal in both (non)immersive mode.
- * It displays an interactive javascript console or boots into 
- * a Linux ISO image (via WASM).
- *
- * ```html 
- *   <a-entity isoterminal="iso: xrsh.iso" position="0 1.6 -0.3"></a-entity>
- * ```
- *
- * > depends on [AFRAME.utils.require](com/require.js)
- *
- * | property         | type      | default                | info |
- * |------------------|-----------|------------------------|------|
- * | `iso`            | `string`  | https`//forgejo.isvery.ninja/assets/xrsh-buildroot/main/xrsh.iso" | |
- * | `overlayfs`      | `string`  | *WORK-IN-PROGRESS* | |
- * | `width`          | `number`  |  800   ||
- * | `height`         | `number`  |  600   ||
- * | `depth`          | `number`  |  0.03  ||
- * | `lineHeight`     | `number`  |  18    ||
- * | `prompt`         | `boolean` |  true  | boot straight into ISO or give user choice |
- * | `padding`        | `number`` |  18    | |
- * | `maximized`      | `boolean` | false  | |
- * | `minimized`      | `boolean` | false  | |
- * | `muteUntilPrompt`| `boolean` | true   | mute stdout until a prompt is detected in ISO |
- * | `HUD`            | `boolean` | false  | link to camera movement |
- * | `transparent`    | `boolean` | false  | heavy, needs good gpu |
- * | `memory`         | `number`  | 60     | VM memory (in MB) [NOTE` quest or smartphone webworker might crash > 40mb ] |
- * | `bufferLatency`  | `number`  | 1      | in ms` bufferlatency from webworker to term (batch-update every char to texture) |
- * | `debug`          | `boolean` | false  | |
- * | `emulator`       | `string`  | fbterm | terminal emulator |
- *
- * > for more info see [xrsh.isvery.ninja](https://xrsh.isvery.ninja)
- *
- * Component design:
- * ```
- *                   css/html template                                                                                
- *                                                                                                                     
- *                     ┌─────────┐   ┌────────────┐                  exit-AR                                
- *            ┌───────►│ com/dom ┼──►│ com/window ├───────────────── exit-VR  ◄─┐                           
- *            │        └─────────┘   └───────────┬┘                             │                           
- *            │                                  │                              │                           
- * ┌──────────┴────────┐                         │   ┌───────────┐    ┌─────────────────────────────┐
- * │  com/isoterminal  ├────────────────────────────►│com/term.js│    │com/html-as-texture-in-XR.js │
- * └────────┬─┬────────┘                         │   └──┬─────┬▲─┘    └─────────────────────────────┘
- *          │ │        ┌────────┐             ┌──▼──────▼──────┐                     ││        │                       
- *          │ └───────►│ plane  ├─────►text───┼►div#isoterminal│◄────────────────── enter-VR   │                       
- *          │          └────────┘             └────────────────┘                    enter-AR ◄─┘                       
- *          │                                   │                                                     
- *          │                                   │                                                                   
- *          │                             ISOTerminal.js                                                                   
- *          │                ┌───────────────────────────┐           
- *          │                │ com/isoterminal/worker.js ├            
- *          │                └──────────────┌────────────┤            
- *          │                     │         │ v86.js     │            
- *          │                     │         │ feat/*.js  │            
- *          │                     │         │ libv86.js  │            
- *          │                     │         └────────────┘            
- *          │                     │         
- *          └─────────────────────┘    
- *                                                                                                                     
- * NOTE: For convenience reasons, events are forwarded between com/isoterminal.js, worker.js and ISOTerminal
- *       Instead of a melting pot of different functionnames, events are flowing through everything (ISOTerminal.emit())
- * ```       
- */ 
+AFRAME.registerComponent('isoterminal', {
+  schema: {
+    iso:    { type:"string", "default":"com/isoterminal/xrsh.iso" },
+    cols:   { type: 'number',"default": 120 },
+    rows:   { type: 'number',"default": 30 },
+    padding:{ type: 'number',"default": 18 },
+    transparent: { type:'boolean', "default":false } // need good gpu
+  },
 
-if( typeof AFRAME != 'undefined '){
+  init: function(){
+    this.el.object3D.visible = false
+  },
 
-  AFRAME.registerComponent('isoterminal', {
-    schema: {
-      iso:            { type:"string", "default":"https://forgejo.isvery.ninja/assets/xrsh-buildroot/main/xrsh.iso" },
-      overlayfs:      { type:"string"},
-      width:          { type: 'number',"default": 800 },
-      height:         { type: 'number',"default": 600 },
-      depth:          { type: 'number',"default": 0.03 },
-      lineHeight:     { type: 'number',"default": 18 },
-      prompt:         { type: 'boolean', "default": true },  // boot straight into ISO or give user choice
-      padding:        { type: 'number',"default": 18 },
-      maximized:      { type: 'boolean',"default":false},
-      minimized:      { type: 'boolean',"default":false},
-      muteUntilPrompt:{ type: 'boolean',"default":true},     // mute stdout until a prompt is detected in ISO
-      HUD:            { type: 'boolean',"default":false},    // link to camera movement 
-      transparent:    { type:'boolean', "default":false },   // need good gpu
-      memory:         { type: 'number',  "default":60  },    // VM memory (in MB) [NOTE: quest or smartphone might crash > 40mb ]
-      bufferLatency:  { type: 'number', "default":1  },      // in ms: bufferlatency from webworker to xterm (batch-update every char to texture)
-      debug:          { type: 'boolean', "default":false },
-      emulator:       { type: 'string', "default": "fbterm" }// terminal emulator
-    },
+  requires:{
+    'window':    "com/window.js",
+    xtermjs:     "https://unpkg.com/@xterm/xterm@5.5.0/lib/xterm.js",
+    xtermcss:    "https://unpkg.com/@xterm/xterm@5.5.0/css/xterm.css",
+    v86:         "com/isoterminal/libv86.js"
+    //axterm:      "https://unpkg.com/aframe-xterm-component/aframe-xterm-component.js"
+  },
 
-    init: function(){
-      this.el.object3D.visible = false
-      if( window.innerWidth < this.data.width ){
-        this.data.maximized = true
-      }
+  dom: {
+    scale:   0.7,
+    events:  ['click','keydown'],
+    html:    (me) => `<div class="isoterminal"></div>`,
 
-      this.calculateDimension()
-      this.initHud()
-      this.setupPasteDrop()
+    css:     (me) => `.isoterminal{
+                        padding: ${me.com.data.padding}px;
+                        width:100%;
+                        height:100%;
+                      }
+                      .isoterminal *{
+                         white-space: pre;
+                         font-size: 14px;
+                         font-family: Liberation Mono,DejaVu Sans Mono,Courier New,monospace;
+                         font-weight:700;
+                         display:inline;
+                         overflow: hidden;
+                      }
 
-      fetch(this.data.iso,{method: 'HEAD'})
-      .then( (res) => {
-        if( res.status != 200 ) throw 'not found'
-      })
-      .catch( (e) => {
-        console.warn(this.data.iso+" could not be loaded, loading fallback ISO URL:")
-        console.warn(this.schema.iso.default)
-        this.data.iso = this.schema.iso.default
-      })
-      .finally( () => this.initTerminal(true) )
-    },
+                      .isoterminal style{ display:none }
 
-    requires:{
-      com:           "com/dom.js",
-      window:        "com/window.js",
-      pastedrop:     "com/pastedrop.js",
-      v86:           "com/isoterminal/libv86.js",
-      // allow xrsh to selfcontain scene + itself
-      xhook:         "com/lib/xhook.min.js",
-      selfcontain:   "com/selfcontainer.js",
-      // html to texture
-      htmlinxr:      "com/html-as-texture-in-xr.js",
-      // isoterminal global features
-      PromiseWorker: "com/isoterminal/PromiseWorker.js",
-      ISOTerminal:   "com/isoterminal/ISOTerminal.js",
-      localforage:   "com/isoterminal/localforage.js",
-    },
+                      .wb-body:has(> .isoterminal){ 
+                        background: #000c; 
+                        overflow:hidden;
+                      }
 
-    dom: {
-      scale: 0.66,
-      events:  ['click','keydown'],
-      html:    (me) => `<div class="isoterminal">
-                          <input type="file" id="pastedrop" style="position:absolute; left:-9999px;opacity:0"></input>
-                          <div id="term" tabindex="0"></div>
-                        </div>`,
+                      .isoterminal div{ display:block; }
+                      .isoterminal span{ display: inline }
 
-      css:     (me) => `
+                      @keyframes fade {
+                          from { opacity: 1.0; }
+                          50% { opacity: 0.5; }
+                          to { opacity: 1.0; }
+                      }                                                                                                                                                                                                                                  
 
-                        .isoterminal{
-                          padding: ${me.com.data.padding}px;
-                          width:100%;
-                          height:99%;
-                          resize: both;
-                          overflow: hidden;
-                        }
-                        @font-face {
-                          font-family: 'Cousine';
-                          font-style: normal;
-                          font-weight: 400;
-                          src: url(./com/isoterminal/assets/Cousine.ttf) format('truetype');
-                        }
-                        @font-face {
-                          font-family: 'Cousine';
-                          font-style: normal;
-                          font-weight: 700;
-                          src: url(./com/isoterminal/assets/CousineBold.ttf) format('truetype');
-                        }
+                      @-webkit-keyframes fade {
+                          from { opacity: 1.0; }
+                          50% { opacity: 0.5; }
+                          to { opacity: 1.0; }
+                      }
 
-                        .isoterminal *{
-                            outline:none;
-                            box-shadow:none;
-                        }
+                      .blink {
+                        animation:fade 1000ms infinite;
+                        -webkit-animation:fade 1000ms infinite;
+                      }
+                      `
+  },
 
-                        .term {
-                            font-family: 'Cousine';
-                            line-height: ${me.com.data.lineHeight}px;
-                            font-weight: normal;
-                            font-variant-ligatures: none;
-                            color: #f0f0f0;
-                            overflow: hidden;
-                            white-space: nowrap;
-                        }
+  toUint8Array: function(str) {
+    // Create a new Uint8Array with the same length as the input string
+    const uint8Array = new Uint8Array(str.length);
+    
+    // Iterate over the string and populate the Uint8Array
+    for (let i = 0; i < str.length; i++) {
+        uint8Array[i] = str.charCodeAt(i);
+    }
+    return uint8Array;
+  },
 
-                        .term_content a {
-                            color: inherit;
-                            text-decoration: underline;
-                            color:#2AFF;
-                        }
-                        
-                        .term_content a span{
-                            text-shadow: 0px 0px 10px #F07A;
-                        }
-
-                        .term_content a:hover {
-                            color: inherit;
-                            text-decoration: underline;
-                            animation:fade 1000ms infinite;
-                            -webkit-animation:fade 1000ms infinite;
-                        }
-
-                        .term_cursor {
-                            color: #000000;
-                            background: #70f;
-                            animation:fade 1000ms infinite; 
-                            -webkit-animation:fade 1000ms infinite;
-                        }
-
-                        .term_char_size {
-                            display: inline-block;
-                            visibility: hidden;
-                            position: absolute;
-                            top: 0px;
-                            left: -1000px;
-                            padding: 0px;
-                        }
-
-                        .term_textarea {
-                            position: absolute;
-                            top: 0px;
-                            left: 0px;
-                            width: 0px;
-                            height: 0px;
-                            padding: 0px;
-                            border: 0px;
-                            margin: 0px;
-                            opacity: 0;
-                            resize: none;
-                        }
-
-                        .term_scrollbar { background: transparent url(images/bg-scrollbar-track-y.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; height: 100%; }
-                        .term_track { background: transparent url(images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:13px; position: relative; padding: 0 1px; }
-                        .term_thumb { background: transparent url(images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 25px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: -5px; }
-                        .term_thumb .term_end { background: transparent url(images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 25px; }
-                        .noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }
-
-                        .isoterminal style{ display:none }
-
-                        blink{ 
-                          border:none;
-                          padding:none;
-                        }
-
-                        #overlay .winbox:has(> .isoterminal){ 
-                          background:transparent;
-                          box-shadow:none;
-                        }
-
-                        .XR .cursor {
-                          animation:none;
-                          -webkit-animation:none;
-                        }
-
-                        .wb-body:has(> .isoterminal){ 
-                          background: #000C;
-                          overflow:hidden;
-                        }
-
-                        .XR .wb-body:has(> .isoterminal){ 
-                          background: transparent;
-                        }
-
-                        .XR .isoterminal{
-                          background: #000;
-                        }
-                        .isoterminal *{
-                          font-size: 14px;
-                          font-family: "Cousine",Liberation Mono,DejaVu Sans Mono,Courier New,monospace;
-                          font-weight:500 !important;
-                          text-shadow: 0px 0px 10px #F075;
-                        }
-
-                        @keyframes fade {
-                            from { opacity: 1.0; }
-                            50% { opacity: 0.5; }
-                            to { opacity: 1.0; }
-                        }                                                                                                                                                                                                                                  
-
-                        @-webkit-keyframes fade {
-                            from { opacity: 1.0; }
-                            50% { opacity: 0.5; }
-                            to { opacity: 1.0; }
-                        }
-
-                        .blink{
-                          animation:fade 1000ms infinite;
-                          -webkit-animation:fade 1000ms infinite;
-                        }
-
-                        `
-    },
-
-    initTerminal: async function(singleton){
-
-      // why not latest xterm or v3.12 with builtin-canvas support?
-      // first versions used 1.5.4, a typescript rewrite which:
-      // * acts weird with oculus browser keyboard (does not repaint properly after typing)
-      // * does not use canvas anymore [which would be ideal for THREE.js texture]
-      // * does not allow switching between dom/canvas
-      // * only allows a standalone WebGL addon (conflicts with THREE)
-      // * heavily dependent on requestAnimationFrame (conflicts with THREE)
-      // * typescript-rewrite results in ~300k lib (instead of 96k)
-      // * v3.12 had slightly better performance but still very heavy
-      //
-      await AFRAME.utils.require(this.requires)
-
-      let features = { // ISOTerminal plugins
-        boot:          "com/isoterminal/feat/boot.js",
-        javascript:    "com/isoterminal/feat/javascript.js",
-        jsconsole:     "com/isoterminal/feat/jsconsole.js",
-        indexhtml:     "com/isoterminal/feat/index.html.js",
-        indexjs:       "com/isoterminal/feat/index.js.js",
-        autorestore:   "com/isoterminal/feat/autorestore.js",
-        pastedropFeat: "com/isoterminal/feat/pastedrop.js",
-        httpfs:        "com/isoterminal/feat/httpfs.js",
-      }
-      if( this.data.emulator == 'fbterm' ){
-        features['fbtermjs'] = "com/isoterminal/term.js"
-        features['fbterm']   = "com/isoterminal/feat/term.js"
-      }
-      await AFRAME.utils.require(features)
-
-      this.el.setAttribute("selfcontainer","")
-
-      // *DISABLED* instance this component 
-      // rason: we only need one term for now (more = too cpu heavy)
-      let instance 
-      if( singleton ){
-        instance = this.el
-      }else{
-        if( this.instance ){
-          const el = document.querySelector('.isoterminal')
-          return console.warn('TODO: allow multiple terminals for future beefy devices(see v86 examples)')
+  runISO: function(dom,instance){
+    //var term = new Terminal()
+    //term.open(dom)
+    //term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')``
+    if( typeof Terminal == undefined ) throw 'xterm terminal not loaded'
+    // monkeypatch Xterm (which V86 initializes) so we can add our own constructor args 
+    window._Terminal = window.Terminal 
+    window.Terminal = function(opts){
+      const term = new window._Terminal({ ...opts,
+        cursorBlink:true,
+        onSelectionChange: function(e){
+          debugger
         }
-        instance = this.instance = this.el.cloneNode(false)
-        this.el.sceneEl.appendChild( instance )
+      })
+
+      term.onSelectionChange( () => {
+        document.execCommand('copy')
+        term.select(0, 0, 0)
+        instance.setStatus('copied to clipboard')
+      })
+      return term
+    }
+
+    instance.setStatus = (msg) => {
+      const w = instance.winbox
+      w.titleBak = w.titleBak || w.title
+      instance.winbox.setTitle( `${w.titleBak} [${msg}]` )
+    }
+
+    var emulator = window.emulator = dom.emulator = new V86({
+      wasm_path:        "com/isoterminal/v86.wasm",
+      memory_size:      32 * 1024 * 1024,
+      vga_memory_size:  2 * 1024 * 1024,
+      serial_container_xtermjs: dom,
+      //screen_container: dom, //this.canvas.parentElement,
+      bios: {
+        url: "com/isoterminal/bios/seabios.bin",
+      },
+      vga_bios: {
+        url: "com/isoterminal/bios/vgabios.bin",
+      },
+      network_relay_url: "wss://relay.widgetry.org/",
+      cdrom: {
+        url: this.data.iso,
+      },
+      cmdline: "rw root=host9p rootfstype=9p rootflags=trans=virtio,cache=loose modules=virtio_pci tsc=reliable init_on_free=on",
+      bzimage:{
+        url: "com/isoterminal/images/buildroot-bzimage.bin"
+      },
+      //bzimage_initrd_from_filesystem: true,
+      //filesystem: {
+      //          baseurl: "com/isoterminal/v86/images/alpine-rootfs-flat",
+      //          basefs:  "com/isoterminal/v86/images/alpine-fs.json",
+      //      },
+      //screen_dummy: true,
+      //disable_jit: false,
+      filesystem: {},
+      autostart: true,
+    });
+
+    const loading = [
+      'loading quantum bits and bytes',
+      'preparing quantum flux capacitors',
+      'crunching peanuts and chakras',
+      'preparing parallel universe',
+      'loading quantum state fluctuations',
+      'preparing godmode',
+      'loading cat pawns and cuteness',
+      'beaming up scotty',
+      'still faster than Windows update',
+      'loading a microlinux',
+      'figuring out meaning of life',
+      'Aligning your chakras now',
+      'Breathing in good vibes',
+      'Finding inner peace soon',
+      'Centering your Zen energy',
+      'Awakening third eye powers',
+      'Tuning into the universe',
+      'Balancing your cosmic karma',
+      'Stretching time and space',
+      'Recharging your soul battery',
+      'Transcending earthly limits'
+    ]
+
+    let motd = "\n\r"
+    motd += "  " + ' ____  _____________  _________ ___ ___   ' + "\n\r"
+    motd += "  " + ' \\   \\/  /\\______   \\/   _____//   |   \\  ' + "\n\r"  
+    motd += "  " + '  \\     /  |       _/\\_____  \\/    ~    \\ ' + "\n\r"
+    motd += " " + '   /     \\  |    |   \\/        \\    Y    / ' + "\n\r"
+    motd += " " + '  /___/\\  \\ |____|_  /_______  /\\___|_  /  ' + "\n\r"
+    motd += " " + '        \\_/        \\/        \\/       \\/   ' + "\n\r"
+    motd += "                                                                 \n\r"
+    motd += `${loading[ Math.floor(Math.random()*1000) % loading.length-1 ]}, please wait..\n\r\n\r`
+    motd += "\033[0m" 
+
+    const files = [
+      "com/isoterminal/mnt/js",
+      "com/isoterminal/mnt/jsh",
+      "com/isoterminal/mnt/confirm",
+      "com/isoterminal/mnt/prompt",
+      "com/isoterminal/mnt/alert",
+      "com/isoterminal/mnt/hook",
+      "com/isoterminal/mnt/xrsh",
+      "com/isoterminal/mnt/profile",
+      "com/isoterminal/mnt/profile.xrsh",
+      "com/isoterminal/mnt/profile.js",
+      "com/isoterminal/mnt/motd",
+      "com/isoterminal/mnt/v86pipe"
+    ]
+
+    const redirectConsole = (handler) => {
+       const log = console.log;
+       const dir = console.dir;
+       const err = console.error;
+       const warn = console.warn;
+       console.log = (...args)=>{
+           const textArg = args[0];
+           handler(textArg+'\n');
+           log.apply(log, args);
+       };
+       console.error = (...args)=>{
+           const textArg = args[0].message?args[0].message:args[0];
+           handler( textArg+'\n', '\x1b[31merror\x1b[0m');
+           err.apply(log, args);
+       };
+       console.dir = (...args)=>{
+           const textArg = args[0].message?args[0].message:args[0];
+           handler( JSON.stringify(textArg,null,2)+'\n');
+           dir.apply(log, args);
+       };
+       console.warn = (...args)=>{
+           const textArg = args[0].message?args[0].message:args[0];
+           handler(textArg+'\n','\x1b[38;5;208mwarn\x1b[0m');
+           err.apply(log, args);
+       };
+    }
+
+    emulator.bus.register("emulator-started", async () => {
+      emulator.serial_adapter.term.element.querySelector('.xterm-viewport').style.background = 'transparent'
+      emulator.serial_adapter.term.clear()
+      emulator.serial_adapter.term.write(motd)
+
+      emulator.create_file("motd", this.toUint8Array(motd) )
+      emulator.create_file("js", this.toUint8Array(`#!/bin/sh
+        cat /mnt/motd 
+        cat > /dev/null 
+      `))
+
+      redirectConsole( (str,prefix) => {
+        if( emulator.log_to_tty ){
+          prefix = prefix ? prefix+' ' : ' '
+          str.trim().split("\n").map( (line) => {
+            emulator.serial_adapter.term.write( '\r\x1b[38;5;165m/dev/browser: \x1b[0m'+prefix+line+'\n' )
+          })
+          emulator.serial_adapter.term.write( '\r' )
+        }
+        emulator.create_file( "console", this.toUint8Array( str ) )
+      })
+
+      let p = files.map( (f) => fetch(f) )
+      Promise.all(p)
+      .then( (files) => {
+        files.map( (f) => {
+          f.arrayBuffer().then( (buf) => {
+            emulator.create_file( f.url.replace(/.*mnt\//,''), new Uint8Array(buf) )
+          })
+        })
+      })
+
+      //emulator.serial0_send('chmod +x /mnt/js')
+      //emulator.serial0_send()
+      let line = ''
+      let ready = false
+      emulator.add_listener("serial0-output-byte", async (byte) => {
+          var chr = String.fromCharCode(byte);
+          if(chr < " " && chr !== "\n" && chr !== "\t" || chr > "~")
+          {
+              return;
+          }
+
+          if(chr === "\n")
+          {
+              var new_line = line;
+              line = "";
+          }
+          else if(chr >= " " && chr <= "~")
+          {
+              line += chr;
+          }
+
+          //if(!ran_command && line.endsWith("~% "))
+          //{
+          //    ran_command = true;
+          //    emulator.serial0_send("chmod +x /mnt/test-i386\n");
+          //    emulator.serial0_send("/mnt/test-i386 > /mnt/result\n");
+          //    emulator.serial0_send("echo test fini''shed\n");
+          //}
+          //console.dir({line,new_line})
+          if( !ready && line.match(/^(\/ #|~%)/) ){
+            instance.dom.classList.remove('blink')
+            // set environment
+            let env = ['export BROWSER=1']
+            for ( let i in document.location ){
+              if( typeof document.location[i] == 'string' )
+                env.push( 'export '+String(i).toUpperCase()+'="'+document.location[i]+'"')
+            }
+            env.map( (e) => emulator.serial0_send(`echo '${e}' >> /mnt/profile\n`) )
+            let boot = `source /mnt/profile`
+            // exec hash as extra boot cmd
+            if( document.location.hash.length > 1 ){ 
+              boot += `&& cmd='${decodeURI(document.location.hash.substr(1))}' && $cmd`
+            }
+            emulator.serial0_send(boot+"\n")
+            instance.winbox.maximize()
+            emulator.serial_adapter.term.focus()
+            ready = true
+              //emulator.serial0_send("root\n")
+              //emulator.serial0_send("mv /mnt/js . && chmod +x js\n")
+          }
+      });    
+
+      // unix to js device
+      emulator.add_listener("9p-write-end", async (opts) => {
+        const decoder = new TextDecoder('utf-8');
+
+        if ( opts[0] == 'js' ){
+          const buf = await emulator.read_file("dev/browser/js")
+          const script = decoder.decode(buf)
+          try{
+            let res = (new Function(`${script}`))()
+            if( res && typeof res != 'string' ) res = JSON.stringify(res,null,2)
+          }catch(e){ 
+            console.error(e)
+          }
+        }
+      })
+
+      // enable/disable logging file (echo 1 > mnt/console.tty) 
+      emulator.add_listener("9p-write-end", async (opts) => {
+        const decoder = new TextDecoder('utf-8');
+        if ( opts[0] == 'console.tty' ){
+          const buf = await emulator.read_file("console.tty")
+          const val = decoder.decode(buf)
+          emulator.log_to_tty = ( String(val).trim() == '1')
+        }
+      })
+    
+    });
+
+  },
+
+  events:{
+
+    // combined AFRAME+DOM reactive events
+    click:   function(e){ }, //
+    keydown: function(e){ },
+
+    // reactive events for this.data updates
+    myvalue: function(e){ this.el.dom.querySelector('b').innerText = this.data.myvalue },
+
+    ready: function( ){
+      this.el.dom.style.display = 'none'
+    },
+
+    launcher: async function(){
+      if( this.instance ){
+        const el = document.querySelector('.isoterminal')
+        return console.warn('TODO: allow multiple terminals (see v86 examples)')
       }
 
-      // init isoterminal
-      this.term = new ISOTerminal(instance,this.data)
+      let s = await AFRAME.utils.require(this.requires)
+      // instance this component
+      const instance = this.instance = this.el.cloneNode(false)
+      this.el.sceneEl.appendChild( instance )
 
       instance.addEventListener('DOMready', () => {
-        this.term.emit('term_init', {instance, aEntity:this})
-        //instance.winbox.resize(720,380)
-        let size = `width: ${this.data.width}; height: ${this.data.height}`
-        instance.setAttribute("window", `title: xrsh.iso; uid: ${instance.uid}; attach: #overlay; dom: #${instance.dom.id}; ${size}; min: ${this.data.minimized}; max: ${this.data.maximized}; class: no-full, no-max, no-resize`)
+        this.runISO(instance.dom, instance)
+        instance.setAttribute("window", `title: ${this.data.iso}; uid: ${instance.uid}; attach: #overlay; dom: #${instance.dom.id}`)
       })
 
       instance.addEventListener('window.oncreate', (e) => {
         instance.dom.classList.add('blink')
-        // canvas to texture texture
-        instance.setAttribute("html-as-texture-in-xr", `domid: .winbox#${instance.uid}; faceuser: true`)
-
-        // run iso
-        let opts = {dom:instance.dom}
-        for( let i in this.data ) opts[i] = this.data[i]
-        opts.cols = this.cols
-        opts.rows = this.rows
-        this.term.start(opts)
-      })
-
-      instance.setAttribute("dom",    "")
-      instance.setAttribute("pastedrop",  "")
-
-
-      // *REMOVE* make a boot-plugin mechanism in feat/term.js
-      this.term.addEventListener('enable-console', () => {
-        instance.dom.classList.remove('blink')
-      })
-
-      this.term.addEventListener('ready', (e) => {
-        instance.dom.classList.remove('blink')
-        this.term.emit('status',"running")
-        if( this.data.debug ) this.runTests()
-      })
-
-      this.term.addEventListener('status', function(e){
-        let msg = e.detail
-        const w = instance.winbox
-        if(!w) return
-        w.titleBak = w.titleBak || w.title
-        w.setTitle( `${w.titleBak} [${msg}]` )
       })
 
       instance.addEventListener('window.onclose', (e) => {
         if( !confirm('do you want to kill this virtual machine and all its processes?') ) e.halt = true
       })
 
-      const resize = (w,h) => { }
+      const resize = (w,h) => {
+        if( instance.dom.emulator && instance.dom.emulator.serial_adapter ){
+          setTimeout( () => {
+            this.autoResize(instance.dom.emulator.serial_adapter.term,instance,-5)
+          },500) // wait for resize anim
+        }
+      }
       instance.addEventListener('window.onresize', resize )
       instance.addEventListener('window.onmaximize', resize )
 
-      const focus = (showdom) => (e) => {
-        this.el.emit('focus',e.detail)
-        if( this.el.components.window && this.data.renderer == 'canvas'){
-          this.el.components.window.show( showdom )
-        }
-      }
+      instance.setAttribute("dom",      "")
+      instance.setAttribute("xd",       "")  // allows flipping between DOM/WebGL when toggling XD-button
+      instance.setAttribute("visible",  AFRAME.utils.XD() == '3D' ? 'true' : 'false' )
+      instance.setAttribute("position", AFRAME.utils.XD.getPositionInFrontOfCamera(0.5) )
 
-      this.el.addEventListener('obbcollisionstarted', focus(false) )
-      this.el.sceneEl.addEventListener('enter-vr', focus(false) )
-      this.el.sceneEl.addEventListener('enter-ar', focus(false) )
-      this.el.sceneEl.addEventListener('exit-vr', focus(true) )
-      this.el.sceneEl.addEventListener('exit-ar', focus(true) )
+      const focus = () => document.querySelector('canvas.a-canvas').focus()
+      instance.addEventListener('obbcollisionstarted', focus )
+      this.el.sceneEl.addEventListener('enter-vr', focus )
 
       instance.object3D.quaternion.copy( AFRAME.scenes[0].camera.quaternion ) // face towards camera
-    },
-
-    initHud: function(){
-      if( AFRAME.utils.device.isMobile() ) this.data.HUD = true 
-      if( this.data.HUD ){
-        document.querySelector('[camera]').appendChild( this.el )
-        this.el.setAttribute("position","0 -0.03 -0.4")
-      }
-    },
-
-    runTests: async function(){
-      await AFRAME.utils.require({
-        "test_util":       "tests/util.js",
-        "test_isoterminal":"tests/ISOTerminal.js"
-      })
-      console.test.run()
-    },
-
-    setupPasteDrop: function(){
-      this.el.addEventListener('pasteFile', (e) => {
-        e.preventDefault()                 // prevent bubbling up to window (which is triggering this initially)
-        if( !this.term.pasteFile ) return  // skip if feat/pastedrop.js is not loaded 
-        this.term.pasteFile(e.detail) 
-      })
-      return this
-    },
-
-    calculateDimension: function(){
-      if( this.data.width == -1  ) this.data.width = document.body.offsetWidth;
-      if( this.data.height == -1 ) this.data.height = Math.floor( document.body.offsetHeight - 30 )
-      if( this.data.height > this.data.width ) this.data.height = this.data.width // mobile smartphone fix
-      this.data.width -= this.data.padding*2
-      this.data.height -= this.data.padding*2
-      this.cols = Math.floor(this.data.width/this.data.lineHeight*2)-1
-      this.rows = Math.floor( (this.data.height*0.93)/this.data.lineHeight)-1
-    },
-
-    events:{
-
-      // combined AFRAME+DOM reactive events
-      click:   function(e){ }, //
-      keydown: function(e){ },
-
-      // reactive events for this.data updates
-      myvalue: function(e){ this.el.dom.querySelector('b').innerText = this.data.myvalue },
-
-      launcher: async function(){
-        this.initTerminal()
-      }
-
-    },
-
-    manifest: { // HTML5 manifest to identify app to xrsh
-      "iso": "linux-x64-4.15.iso",
-      "short_name": "ISOTerm",
-      "name": "terminal",
-      "icons": [
-        {
-          "src": "https://css.gg/terminal.svg",
-          "src": "data:image/svg+xml;base64,PHN2ZwogIHdpZHRoPSIyNCIKICBoZWlnaHQ9IjI0IgogIHZpZXdCb3g9IjAgMCAyNCAyNCIKICBmaWxsPSJub25lIgogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKPgogIDxwYXRoCiAgICBkPSJNNS4wMzMzIDE0LjgyODRMNi40NDc1MSAxNi4yNDI2TDEwLjY5MDIgMTJMNi40NDc1MSA3Ljc1NzMzTDUuMDMzMyA5LjE3MTU1TDcuODYxNzIgMTJMNS4wMzMzIDE0LjgyODRaIgogICAgZmlsbD0iY3VycmVudENvbG9yIgogIC8+CiAgPHBhdGggZD0iTTE1IDE0SDExVjE2SDE1VjE0WiIgZmlsbD0iY3VycmVudENvbG9yIiAvPgogIDxwYXRoCiAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICBjbGlwLXJ1bGU9ImV2ZW5vZGQiCiAgICBkPSJNMiAyQzAuODk1NDMxIDIgMCAyLjg5NTQzIDAgNFYyMEMwIDIxLjEwNDYgMC44OTU0MyAyMiAyIDIySDIyQzIzLjEwNDYgMjIgMjQgMjEuMTA0NiAyNCAyMFY0QzI0IDIuODk1NDMgMjMuMTA0NiAyIDIyIDJIMlpNMjIgNEgyTDIgMjBIMjJWNFoiCiAgICBmaWxsPSJjdXJyZW50Q29sb3IiCiAgLz4KPC9zdmc+",
-          "type": "image/svg+xml",
-          "sizes": "512x512"
-        }
-      ],
-      "id": "/?source=pwa",
-      "start_url": "/?source=pwa",
-      "background_color": "#3367D6",
-      "display": "standalone",
-      "scope": "/",
-      "theme_color": "#3367D6",
-      "shortcuts": [
-        {
-          "name": "What is the latest news?",
-          "cli":{
-            "usage":  "helloworld <type> [options]",
-            "example": "helloworld news",
-            "args":{
-              "--latest": {type:"string"}
-            }
-          },
-          "short_name": "Today",
-          "description": "View weather information for today",
-          "url": "/today?source=pwa",
-          "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
-        }
-      ],
-      "description": "Hello world information",
-      "screenshots": [
-        {
-          "src": "/images/screenshot1.png",
-          "type": "image/png",
-          "sizes": "540x720",
-          "form_factor": "narrow"
-        }
-      ],
-      "help":`
-  Helloworld application
-
-  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.
-      `
     }
 
-  });
-}
+  },
+
+  autoResize: function(term,instance,rowoffset){
+    if( !term.element ) return
+
+    const defaultScrollWidth = 24;
+    const MINIMUM_COLS = 2;
+    const MINIMUM_ROWS = 2;
+
+    const dims = term._core._renderService.dimensions;
+    const scrollbarWidth = (term.options.scrollback === 0
+      ? 0
+      : (term.options.overviewRuler?.width || defaultScrollWidth ));
+
+    const parentElementStyle = window.getComputedStyle(instance.dom);
+    const parentElementHeight = parseInt(parentElementStyle.getPropertyValue('height'));
+    const parentElementWidth = Math.max(0, parseInt(parentElementStyle.getPropertyValue('width')));
+    const elementStyle = window.getComputedStyle(term.element);
+    const elementPadding = {
+      top: parseInt(elementStyle.getPropertyValue('padding-top')),
+      bottom: parseInt(elementStyle.getPropertyValue('padding-bottom')),
+      right: parseInt(elementStyle.getPropertyValue('padding-right')),
+      left: parseInt(elementStyle.getPropertyValue('padding-left'))
+    };
+    const elementPaddingVer = elementPadding.top + elementPadding.bottom;
+    const elementPaddingHor = elementPadding.right + elementPadding.left;
+    const availableHeight = parentElementHeight - elementPaddingVer;
+    const availableWidth = parentElementWidth - elementPaddingHor - scrollbarWidth;
+    const geometry = {
+      cols: Math.max(MINIMUM_COLS, Math.floor(availableWidth / dims.css.cell.width)),
+      rows: Math.max(MINIMUM_ROWS, Math.floor(availableHeight / dims.css.cell.height))
+    };
+    term.resize(geometry.cols, geometry.rows + (rowoffset||0) );
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "iso": "linux-x64-4.15.iso",
+    "short_name": "ISOTerm",
+    "name": "terminal",
+    "icons": [
+      {
+        "src": "https://css.gg/terminal.svg",
+        "src": "data:image/svg+xml;base64,PHN2ZwogIHdpZHRoPSIyNCIKICBoZWlnaHQ9IjI0IgogIHZpZXdCb3g9IjAgMCAyNCAyNCIKICBmaWxsPSJub25lIgogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKPgogIDxwYXRoCiAgICBkPSJNNS4wMzMzIDE0LjgyODRMNi40NDc1MSAxNi4yNDI2TDEwLjY5MDIgMTJMNi40NDc1MSA3Ljc1NzMzTDUuMDMzMyA5LjE3MTU1TDcuODYxNzIgMTJMNS4wMzMzIDE0LjgyODRaIgogICAgZmlsbD0iY3VycmVudENvbG9yIgogIC8+CiAgPHBhdGggZD0iTTE1IDE0SDExVjE2SDE1VjE0WiIgZmlsbD0iY3VycmVudENvbG9yIiAvPgogIDxwYXRoCiAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICBjbGlwLXJ1bGU9ImV2ZW5vZGQiCiAgICBkPSJNMiAyQzAuODk1NDMxIDIgMCAyLjg5NTQzIDAgNFYyMEMwIDIxLjEwNDYgMC44OTU0MyAyMiAyIDIySDIyQzIzLjEwNDYgMjIgMjQgMjEuMTA0NiAyNCAyMFY0QzI0IDIuODk1NDMgMjMuMTA0NiAyIDIyIDJIMlpNMjIgNEgyTDIgMjBIMjJWNFoiCiAgICBmaWxsPSJjdXJyZW50Q29sb3IiCiAgLz4KPC9zdmc+",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Hello world information",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application
+
+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.
+    `
+  }
+
+});

com/isoterminal/ISOTerminal.js

@@ -1,349 +0,0 @@
-function ISOTerminal(instance,opts){
-  // create a neutral isoterminal object which can be decorated
-  // with prototype functions and has addListener() and dispatchEvent()
-  let obj      = new EventTarget()
-  obj.instance = instance
-  obj.opts     = opts 
-  // register default event listeners (enable file based features like isoterminal/jsconsole.js e.g.)
-  for( let event in ISOTerminal.listener )
-    for( let cb in ISOTerminal.listener[event] )
-      obj.addEventListener( event, ISOTerminal.listener[event][cb] )
-  // compose object with functions
-  for( let i in ISOTerminal.prototype ) obj[i] = ISOTerminal.prototype[i]
-  obj.emit('init')
-  return obj
-}
-
-ISOTerminal.prototype.emit = function(event,data,sender){
-  data = data || false 
-  const evObj = new CustomEvent(event, {detail: data} )
-  this.preventFrameDrop( () => {
-    // forward event to worker/instance/AFRAME element or component-function
-    // this feels complex, but actually keeps event- and function-names more concise in codebase
-    this.dispatchEvent( evObj )
-    if( sender !=  "instance" && this.instance                    ) this.instance.dispatchEvent(evObj)
-    if( sender !=  "worker"   && this.worker                      ) this.worker.postMessage({event,data}, PromiseWorker.prototype.getTransferable(data) )
-    if( sender !== undefined  && typeof this[event] == 'function' ) this[event].apply(this, data && data.push ? data : [data] )
-  })
-}
-
-ISOTerminal.addEventListener = (event,cb) => {
-  ISOTerminal.listener = ISOTerminal.listener || {}
-  ISOTerminal.listener[event] = ISOTerminal.listener[event] || []
-  ISOTerminal.listener[event].push(cb)
-}
-
-ISOTerminal.prototype.exec = function(shellscript){
-  this.send(`printf "\n\r"; ${shellscript}\n`,1)
-}
-
-ISOTerminal.prototype.hook = function(hookname,args){
-  let cmd = `{ type hook || source /etc/profile.sh; }; hook ${hookname} "${args.join('" "')}"`
-  this.exec(cmd)
-}
-
-ISOTerminal.prototype.serial_input = 0; // can be set to 0,1,2,3 to define stdinput tty (xterm plugin)
-
-ISOTerminal.prototype.send = function(str, ttyNr){
-  if( ttyNr == undefined) ttyNr = this.serial_input
-  if( ttyNr == undefined ){
-    if( this.emulator.serial_adapter ){
-      this.emulator.serial_adapter.term.paste(str)
-    }else this.emulator.keyboard_send_text(str) // vga screen
-  }else{
-    this.convert.toUint8Array( str ).map( (c) => {
-      this.preventFrameDrop( 
-        () => {
-          this.worker.postMessage({event:`serial${ttyNr}-input`,data:c})
-        }
-      )
-    })
-  }
-}
-
-ISOTerminal.prototype.convert = {
-
-  arrayBufferToBase64: function(buffer){
-      let binary = '';
-      const bytes = new Uint8Array(buffer);
-      const len = bytes.byteLength;
-      for (let i = 0; i < len; i++) binary += String.fromCharCode(bytes[i]);
-      return btoa(binary);
-  },
-
-  base64ToArrayBuffer: function(base64) {
-      const binaryString = atob(base64);
-      const len = binaryString.length;
-      const bytes = new Uint8Array(len);
-
-      for (let i = 0; i < len; i++) {
-          bytes[i] = binaryString.charCodeAt(i);
-      }
-      return bytes.buffer;
-  },
-
-  toUint8Array: function(str) {
-    str = String(str) || String("")
-    // Create a new Uint8Array with the same length as the input string
-    const uint8Array = new Uint8Array(str.length);
-    
-    // Iterate over the string and populate the Uint8Array
-    for (let i = 0; i < str.length; i++) {
-        uint8Array[i] = str.charCodeAt(i);
-    }
-    return uint8Array;
-  },
-
-  Uint8ArrayToString: function(arr){
-    const decoder = new TextDecoder('utf-8'); // Specify encoding
-    return decoder.decode(arr);
-  }
-}
-
-ISOTerminal.prototype.start = function(opts){
-
-  let me = this
-  this.opts = {...this.opts, ...opts}
-  let image = {}
-  if( opts.iso.match(/\.iso$/) ) image.cdrom   = { url: opts.iso }
-  if( opts.iso.match(/\.bin$/) ) image.bzimage = { url: opts.iso }
-
-  opts = { ...image,
-    uart1:true, // /dev/ttyS1
-    uart2:true, // /dev/ttyS2
-    uart3:true, // /dev/ttyS3
-    wasm_path:        "v86.wasm",
-    memory_size:      opts.memory * 1024 * 1024,
-    vga_memory_size:  2 * 1024 * 1024,
-    //screen_container: opts.dom,
-    //serial_container: opts.dom,
-    bios: {
-      url: "bios/seabios.bin",
-    },
-    vga_bios: {
-      url: "bios/vgabios.bin",
-      //urg|: "com/isoterminal/bios/VGABIOS-lgpl-latest.bin",
-    },
-    cmdline: "rw root=host9p rootfstype=9p rootflags=trans=virtio,cache=loose modules=virtio_pci tsc=reliable init_on_freg|=on vga=ask", //vga=0x122",
-    net_device:{
-      relay_url:"fetch", // or websocket proxy "wss://relay.widgetry.org/",
-      type:"virtio"
-    },
-    //bzimage_initrd_from_filesystem: true,
-    //filesystem: {
-    //          baseurl: "com/isoterminal/v86/images/alpine-rootfs-flat",
-    //          basefs:  "com/isoterminal/v86/images/alpine-fs.json",
-    //      },
-    //screen_dummy: true,
-    //disable_jit: false,
-    filesystem: {},
-    autostart: true,
-    prompt: this.opts.prompt,
-    debug: this.opts.debug ? true : false
-  };
-
-  this
-  .setupWorker(opts)
-  .startVM(opts)
-}
-
-ISOTerminal.prototype.setupWorker = function(opts){
-
-  /*
-   * the WebWorker (which runs v86)
-   *
-   */
-  this.worker = new PromiseWorker( "com/isoterminal/worker.js", (cb,event,data) => {
-    if( !data.promiseId ) this.emit(event,data,"worker")  // forward event to world
-    this.preventFrameDrop( cb(event,data) )
-  })
-
-  return this
-}
-
-ISOTerminal.prototype.getLoaderMsg = function(){
-
-  const loading = [
-    'loading quantum bits and bytes',
-    'preparing quantum flux capacitors',
-    'crunching peanuts and chakras',
-    'preparing parallel universe',
-    'loading quantum state fluctuations',
-    'preparing godmode',
-    'loading cat pawns and cuteness',
-    'beaming up scotty',
-    'still faster than Windows update',
-    'loading a microlinux',
-    'figuring out meaning of life',
-    'Aligning your chakras now',
-    'Breathing in good vibes',
-    'Finding inner peace soon',
-    'Centering your Zen energy',
-    'Awakening third eye powers',
-    'Tuning into the universe',
-    'Balancing your cosmic karma',
-    'Stretching time and space',
-    'Recharging your soul battery',
-    'Transcending earthly limits'
-  ]
-
-  const empower    = [
-    "FOSS gives users control over their software, offering freedom to modify and share",
-    "Feeling powerless? FOSS escapes a mindset known as learned helplessness",
-    "FOSS breaks this cycle by showing that anyone can learn and contribute",
-    "Proprietary software can make users dependent, but FOSS offers real choices",
-    "FOSS communities provide support and encourage users to develop new skills",
-    "FOSS empowers users to customize and improve their tools",
-    "Engaging with FOSS helps build confidence and self-reliance in tech",
-    "FOSS shows that anyone can shape the digital world with curiosity and effort",
-    "Linux can revive old computers, extending their life and reduces e-waste",
-    "Many lightweight Linux distributions run smoothly on older hardware",
-    "Installing Linux on aging devices keeps them functional instead of sending them to the landfill",
-    "Linux uses fewer resources, making it ideal for reusing older machines",
-    "By using Linux, you can avoid buying new hardware, cutting down on tech waste",
-    "Instead of discarding slow devices, Linux can bring them back to life",
-    "Linux supports a wide range of devices, helping to prevent e-waste",
-    "Open-source drivers in Linux enable compatibility with old peripherals, reducing the need for replacements",
-    "Free Linux software helps users avoid planned obsolescence in commercial products",
-    "Switching to Linux promotes sustainability by reducing demand for new gadgets and lowering e-waste"
-  ]
-
-  let motd = `
-\r . .  ____  _____________  ________. ._. ._. . . 
-\r . . .\\   \\/  /\\______   \\/   _____//   |   \\. . 
-\r . . . \\     /  |       _/\\_____  \\/    ~    \\ . 
-\r . . . /     \\  |    |   \\/        \\    Y    / . 
-\r . . ./___/\\  \\ |____|_  /_______  /\\___|_  /. . 
-\r . . . . . .\\_/. . . . \\/ . . . .\\/ . . _ \\/ . . 
-\r ▬▬▬▬▬▬▬▬ https://xrsh.isvery.ninja ▬▬▬▬▬▬▬▬▬▬▬▬
-\r local-first, polyglot, unixy WebXR IDE & runtime
-\r
-\r  credits
-\r  ------- 
-\r  @nlnet@nlnet.nl 
-\r  @lvk@mastodon.online
-\r  @utopiah@mastodon.pirateparty.be 
-\r  https://www.w3.org/TR/webxr
-\r  https://xrfragment.org 
-\r  https://threejs.org 
-\r  https://aframe.org 
-\r  https://busybox.net
-\r  https://buildroot.org
-\r`
-
-  const text_color = "\r" 
-  const text_reset = "\033[0m"
-  const loadmsg    = "\n\r"+loading[ Math.floor(Math.random()*1000) % loading.length ] + "..please wait \n\n\r"
-  const empowermsg = "\n\r"+text_reset+'"'+empower[ Math.floor(Math.random()*1000) % empower.length ] + '"\n\r'
-  return { motd, text_color, text_reset, loadmsg, empowermsg}
-}
-
-ISOTerminal.prototype.startVM = function(opts){
-
-  this.v86opts = opts
-
-  this.addEventListener('emulator-started', async (e) => {
-
-    // OVERLAY FS *FIXME*
-    //if( me.opts.overlayfs ){
-    //  fetch(me.opts.overlayfs)
-    //  .then( (f) => {
-    //    f.arrayBuffer().then( (buf) => {
-    //      emulator.create_file('overlayfs.zip', new Uint8Array(buf) )
-    //    })
-    //  })
-    //}
-
-    let line = ''
-    this.ready = false
-
-    this.addEventListener(`serial0-output-string`, async (e) => {
-      const str = e.detail
-
-      // lets scan for a prompt so we can send a 'ready' event to the world
-      if( !this.ready && str.match(/\n(\/ #|~ #|~%|\[.*\]>)/) ) this.postBoot()
-
-      if( this.ready || !this.opts.muteUntilPrompt ) this.emit('serial-output-string', e.detail )
-    })
-  });
-
-  let msglib = this.getLoaderMsg()
-  let msg = msglib.motd
-
-  if( this.opts.prompt ){
-    msg += `\r
-\r  1) boot ${String(this.opts.iso || "").replace(/.*\//,'')} Linux ❤️
-\r  2) just give me a javascript-console in WebXR [=instant]
-\r
-\renter number> `
-  }else{
-    bootISO()
-  }
-  this.emit('status',msglib.loadmsg)
-  this.emit('serial-output-string', msg)
-
-}
-
-ISOTerminal.prototype.bootISO = function(){
-  let msglib = this.getLoaderMsg()
-  let msg = "\n\r" + msglib.empowermsg + msglib.text_color + msglib.loadmsg + msglib.text_reset
-  this.emit('serial-output-string', msg)
-  this.emit('runISO',{...this.v86opts, bufferLatency: this.opts.bufferLatency })
-}
-
-
-ISOTerminal.prototype.postBoot = function(cb){
-  this.emit('postReady',{})
-  this.ready = true
-  setTimeout( () => {
-    this.emit('ready',{})
-    if( cb ) cb()
-  }, 500 )
-}
-
-// this is allows (unsophisticated) outputbuffering
-ISOTerminal.prototype.bufferOutput = function(byte,cb,latency){
-  const resetBuffer = () => ({str:""})
-  this.buffer = this.buffer || resetBuffer()
-  this.buffer.str += String.fromCharCode(byte)
-  if( !this.buffer.id ){ 
-    cb(this.buffer.str)                   // send out leading call
-    this.buffer = resetBuffer()
-    this.buffer.id = setTimeout( () => {  // accumulate succesive calls 
-      if( this.buffer.str ) cb(this.buffer.str)
-      this.buffer = resetBuffer()
-    }, this.latency || 250)
-  }
-}
-
-
-//ISOTerminal.prototype.bufferOutput = function(byte, cb, latency, buffer) {
-//  const str = String.fromCharCode(byte);
-//  //if (str === '\r' || str === '\n' || str.charCodeAt(0) < 32 || str.charCodeAt(0) === 127) {
-//  //  cb(str);
-//  //} else if (str === '\x1b') { // ESC
-//  //  buffer.esc = true;
-//  //} else if (buffer.esc) {
-//  //  cb('\x1b' + str);
-//  //  buffer.esc = false;
-//  //} else {
-//    buffer.str = (buffer.str || '') + str;
-//    if (Date.now() - (buffer.timestamp || 0) >= latency) {
-//    console.log(buffer.str)
-//      cb(buffer.str);
-//      buffer.str = '';
-//      buffer.timestamp = Date.now();
-//    }
-//  //}
-//}
-
-ISOTerminal.prototype.preventFrameDrop = function(cb){
-  // don't let workers cause framerate dropping
-  const xr = this.instance.sceneEl.renderer.xr
-  if( xr.isPresenting ){
-    xr.getSession().requestAnimationFrame(cb)
-  }else{
-    window.requestAnimationFrame(cb)
-  }
-}
-

com/isoterminal/PromiseWorker.js

@@ -1,77 +0,0 @@
-/*
- * This is basically a Javascript Proxy for 'new Worker()' 
- * which allows calling worker-functions via promises.
- *
- * It's basically comlink without the fat.
- *
- * const w = new PromiseWorker("worker.js", (cb,event_or_fn,data) => {
- *   cb(event_or_fn,data) // decorate/ratelimit/hooks here
- * })
- * w.foo().then( console.dir )
- *
- * in worker.js define a function: this.foo = () => return {foo:"Bar"}
- */
-
-function PromiseWorker(file, onmessage){
-
-  let proxy
-  const worker = new Worker(file)
-
-  worker.onmessage = (e) => {           // handle messages originating from worker
-    const {event,data} = e.data         // this is worker.onmessage(...)
-    const cb = (event,data) => () => {  //
-      if( data.promiseId ){             //
-        proxy.resolver(data)             // forward to promise resolver 
-      }
-    }
-    onmessage(cb,event,data)
-  }
-
-  return proxy = new Proxy(this,{
-    get(me,k){
-      if( k.match(/(postMessage|onmessage)/) ) return worker[k].bind(worker)
-      if( k.match(/(resolver|promise)/)      ) return this[k].bind(this)
-      // promisify postMessage(...) call
-      return function(){
-        return this.promise(me,{event: k, data: [...arguments] })
-      }
-    },
-
-    promise(me,msg){
-      if( typeof msg != 'object' || !msg.event || !msg.data ){ 
-        throw 'worker.promise({event:..,data:..}) did not receive correct msg : '+JSON.stringify(msg)
-      }
-      this.resolvers = this.resolvers || {last:1,pending:{}}
-      msg.data.promiseId = this.resolvers.last++
-      // Send id and task to WebWorker
-      worker.postMessage(msg, PromiseWorker.prototype.getTransferable(msg.data) )
-      return new Promise( resolve => this.resolvers.pending[ msg.data.promiseId ] = resolve );
-    },
-
-    resolver(data){
-      if( !data || !data.promiseId ) throw 'promiseId not given'
-      this.resolvers.pending[ data.promiseId ](data.result);
-      delete this.resolvers.pending[ data.promiseId ]; // Prevent memory leak
-    }
-
-  })
-
-}
-
-PromiseWorker.prototype.getTransferable = function(data){
-  let objs = []
-  function isTransferable(obj) {
-    return obj instanceof ArrayBuffer ||
-           obj instanceof MessagePort ||
-           obj instanceof ImageBitmap ||
-           (typeof OffscreenCanvas !== 'undefined' && obj instanceof OffscreenCanvas) ||
-           (typeof ReadableStream !== 'undefined' && obj instanceof ReadableStream) ||
-           (typeof WritableStream !== 'undefined' && obj instanceof WritableStream) ||
-           (typeof TransformStream !== 'undefined' && obj instanceof TransformStream);
-  }
-  for( var i in data ){
-    if( isTransferable(data[i]) ) objs.push(data[i])
-  }
-  if( objs.length ) debugger
-  return objs.length ? objs : undefined
-}

com/isoterminal/assets/CousineBold.ttf

@@ -1,16 +0,0 @@
---2024-09-23 17:49:04--  https://fonts.gstatic.com/s/cousine/v27/d6lNkaiiRdih4SpP9Z8K6T4.ttf
-Resolving fonts.gstatic.com (fonts.gstatic.com)... 142.250.180.195, 2a00:1450:400d:806::2003
-Connecting to fonts.gstatic.com (fonts.gstatic.com)|142.250.180.195|:443... connected.
-HTTP request sent, awaiting response... 200 OK
-Length: 287924 (281K) [font/ttf]
-Saving to: ‘d6lNkaiiRdih4SpP9Z8K6T4.ttf’
-
-     0K .......... .......... .......... .......... .......... 17% 2.31M 0s
-    50K .......... .......... .......... .......... .......... 35% 1.91M 0s
-   100K .......... .......... .......... .......... .......... 53% 9.09M 0s
-   150K .......... .......... .......... .......... .......... 71% 3.03M 0s
-   200K .......... .......... .......... .......... .......... 88% 3.40M 0s
-   250K .......... .......... .......... .                    100% 12.4M=0.09s
-
-2024-09-23 17:49:05 (3.23 MB/s) - ‘d6lNkaiiRdih4SpP9Z8K6T4.ttf’ saved [287924/287924]
-

com/isoterminal/feat/9pfs_utils.js

@@ -1,95 +0,0 @@
-let emulator    = this.emulator
-let me          = this
-
-emulator.fs9p.update_file = async function(file,data){
-    const convert = ISOTerminal.prototype.convert
-
-    const p = this.SearchPath(file);
-
-    if(p.id === -1)
-    {
-        return emulator.create_file(file,data)
-    }
-    
-    const inode = this.GetInode(p.id);
-    const buf   = typeof data == 'string' ? convert.toUint8Array(data) : data || ""
-    if( buf.length == 0 ) return new Promise( (resolve,reject) => resolve(data) )
-
-    try{
-      await this.Write(p.id,0, buf.length, buf )
-      // update inode
-      inode.size = buf.length
-      const now = Math.round(Date.now() / 1000);
-      inode.atime = inode.mtime = now;
-      return new Promise( (resolve,reject) => resolve(buf) )
-    }catch(e){
-      console.error({file,data})
-      return new Promise( (resolve,reject) => reject(e) )
-    }
-}
-
-emulator.fs9p.append_file = async function(file,data){
-    const convert = ISOTerminal.prototype.convert
-
-    const p = this.SearchPath(file);
-
-    if(p.id === -1)
-    {
-        return Promise.resolve(null);
-    }
-    
-    const inode = this.GetInode(p.id);
-    const buf   = typeof data == 'string' ? convert.toUint8Array(data) : data
-    await this.Write(p.id, inode.size, buf.length, buf )
-    // update inode
-    inode.size = inode.size + buf.length
-    const now = Math.round(Date.now() / 1000);
-    inode.atime = inode.mtime = now;
-    return new Promise( (resolve,reject) => resolve(buf) )
-
-}
-
-emulator.fs9p.read_file_world = async function(file){
-    const p = this.SearchPath(file);
-
-    if(p.id === -1)
-    {
-        return Promise.resolve(null);
-    }
-
-    const inode = this.GetInode(p.id);
-    const perms = this.parseFilePermissions(inode.mode)
-    
-    if( !perms.world.read ){
-        return Promise.resolve(null);
-    }
-
-    return this.Read(p.id, 0, inode.size);
-}
-
-emulator.fs9p.parseFilePermissions = function(permissionInt) {
-    // Convert the permission integer to octal
-    const octalPermissions = permissionInt.toString(8);
-
-    // Extract the permission bits (last 3 digits in octal)
-    const permissionBits = octalPermissions.slice(-3);
-
-
-    function parsePermission(digit) {
-        const num = parseInt(digit, 10);
-
-        return {
-            read: Boolean(num & 4),  // 4 = read
-            write: Boolean(num & 2), // 2 = write
-            execute: Boolean(num & 1) // 1 = execute
-        };
-    }
-    // Decode the permissions
-    const permissions = {
-        owner: parsePermission(permissionBits[0]),
-        group: parsePermission(permissionBits[1]),
-        world: parsePermission(permissionBits[2]),
-    };
-
-    return permissions;
-}

com/isoterminal/feat/autorestore.js

@@ -1,72 +0,0 @@
-if( typeof emulator != 'undefined' ){
-  // inside worker-thread
-  importScripts("localforage.js")  // we don't instance it again here (just use its functions)
-  
-  this.restore_state = async function(data){ 
-    return new Promise( (resolve,reject) => {
-      localforage.getItem("state", async (err,stateBase64) => {
-        if( stateBase64 && !err ){
-          state = ISOTerminal.prototype.convert.base64ToArrayBuffer( stateBase64 )
-          await emulator.restore_state(state)
-          console.log("restored state")
-        }else return reject("worker.js: emulator.restore_state (could not get state from localforage)")
-        resolve()
-      })
-    })
-  }
-  this.save_state = async function(){ 
-    console.log("saving session")
-    let state = await emulator.save_state()
-    localforage.setDriver([
-      localforage.INDEXEDDB,
-      localforage.WEBSQL,
-      localforage.LOCALSTORAGE
-    ]).then( () => {
-      localforage.setItem("state", ISOTerminal.prototype.convert.arrayBufferToBase64(state) )
-      console.log("state saved")
-    })
-  }
-
-
-}else{
-  // inside browser-thread
-  ISOTerminal.addEventListener('emulator-started', function(e){
-    this.autorestore(e)
-  })
-
-  ISOTerminal.prototype.autorestore = async function(e){
-
-    localforage.setDriver([
-      localforage.INDEXEDDB,
-      localforage.WEBSQL,
-      localforage.LOCALSTORAGE
-    ]).then( () => {
-
-      localforage.getItem("state", async (err,stateBase64) => {
-        if( stateBase64 && !err && confirm('continue last session?') ){
-          this.noboot = true // see feat/boot.js
-          try{
-            await this.worker.restore_state()
-            // simulate / fastforward boot events
-            this.postBoot( () => {
-              this.send("
l\n") 
-              this.send("hook wakeup\n")
-            })
-          }catch(e){ console.error(e) }
-        } 
-      })
-
-      this.save = async () => {
-        await this.worker.save_state()
-      }
-
-      window.addEventListener("beforeunload", function (e) {
-        var confirmationMessage = "Sure you want to leave?\nTIP: enter 'save' to continue this session later";
-        (e || window.event).returnValue = confirmationMessage; //Gecko + IE
-        return confirmationMessage;                            //Webkit, Safari, Chrome
-      });
-
-    })
-  }
-
-}

com/isoterminal/feat/boot.js

@@ -1,26 +0,0 @@
-ISOTerminal.addEventListener('ready', function(e){
-  setTimeout( () => this.boot(), 50 ) // because of autorestore.js
-})
-
-ISOTerminal.prototype.boot = async function(e){
-  // set environment
-  let env = [
-    `export LINES=${this.opts.rows}`,
-    `export COLUMNS=${this.opts.cols}`,
-    'export BROWSER=1',
-  ]
-  for ( let i in document.location ){
-    if( typeof document.location[i] == 'string' ){
-      env.push( 'export '+String(i).toUpperCase()+'="'+decodeURIComponent( document.location[i]+'"') )
-    }
-  }
-  await this.worker.create_file("profile.browser", this.convert.toUint8Array( env.join('\n') ) )
-
-  if( this.serial_input == 0 ){
-    if( !this.noboot ){
-      this.send("source /etc/profile # \\o/ FOSS powa!\n")
-    }
-  }
-
-}
-

com/isoterminal/feat/httpfs.js

@@ -1,56 +0,0 @@
-if( typeof emulator != 'undefined' ){
-
-}else{
-
-  ISOTerminal.addEventListener('ready', function(e){
-
-    function getMimeType(file) {
-      const mimeTypes = {
-        jpg: 'image/jpeg',
-        jpeg: 'image/jpeg',
-        png: 'image/png',
-        mp4: 'video/mp4',
-        gif: 'image/gif',
-      };
-
-      const extension = file.split('.').pop().toLowerCase();
-      return mimeTypes[extension] || 'application/octet-stream'; // Fallback
-    }
-
-    // listen for http request to the filesystem ( file://host/path )
-    xhook.before( (request,callback) => {
-      console.log(request.url)
-      if (request.url.match(/^\/mnt\/.*/) ){
-        let response
-        let file     = request.url.replace(/^\/mnt\//,'')
-        let mimetype = getMimeType(file)
-        this.worker.read_file_world(file)
-        .then( (data) => {
-          if( data == null ) throw `/mnt/${file} does not exist in ISO filesystem`"
-          let blob     = new Blob( [data], {type: getMimeType(file) })  // wrap Uint8Array into array
-          response = {
-              headers: new Headers({ 'Content-Type': getMimeType(file) }),
-              data,
-              url: file,
-              status: 200,
-              blob: () => new Promise( (resolve,reject) => resolve(blob) ),
-              arrayBuffer: blob.arrayBuffer
-          }
-          console.log("serving from iso filesystem: "+file)
-          console.log("*TODO* large files being served partially")
-          callback(response)
-        })
-        .catch( (e) => {
-            console.error(e)
-          response = new Response()
-          response.status = 404
-          callback(response)
-        })
-        return
-      }else{
-        callback()
-      }
-    })
-
-  })
-}   

com/isoterminal/feat/index.html.js

@@ -1,42 +0,0 @@
-
-if( typeof emulator != 'undefined' ){
-  // inside worker-thread
-
-  this.listenIndexHTML = () => {
-    const file = "dev/browser/html"
-    emulator.readFromPipe( file, async (data) => {
-      const buf = await emulator.read_file( file )
-      const decoder = new TextDecoder('utf-8');
-      const html = decoder.decode(buf).replace(/^#!\/bin\/html/,'') // remove leftover shebangs if any
-      try{
-        this.postMessage({event:'runHTML',data:[html]})
-      }catch(e){ 
-        console.error(file)
-        console.error(e)
-      }
-    })
-  }
-    
-
-}else{
-  // inside browser-thread
-  
-  ISOTerminal.addEventListener('emulator-started', function(){
-    this.addEventListener('ready', async () => {
-      this.worker.listenIndexHTML()
-    })
-  })
-  
-  ISOTerminal.prototype.runHTML = function(html){
-    let $scene = document.querySelector("a-scene")
-    let $root = document.querySelector("a-entity#root")
-    if( !$root ){                          
-      $root = document.createElement("a-entity")
-      $root.id = "root"               
-      $scene.appendChild($root)
-    }                                                            
-    console.log(html)
-    $root.innerHTML = html
-  }
-
-}

com/isoterminal/feat/index.js.js

@@ -1,30 +0,0 @@
-if( typeof emulator != 'undefined' ){
-  // inside worker-thread
-
-  // unix to js device
-  this.emulator.readFromPipe( 'dev/browser/js', async (data) => {
-    const buf = await emulator.read_file("dev/browser/js")
-    const decoder = new TextDecoder('utf-8');
-    const js = decoder.decode(buf).replace(/^#!\/bin\/js/,'') // remove leftover shebangs if any
-    try{
-      this.postMessage({event:'runJavascript',data:[js]})
-    }catch(e){ 
-      console.error(e)
-    }
-  })
-    
-
-}else{
-  // inside browser-thread
-
-  ISOTerminal.prototype.runJavascript = function(js){
-    let $root = document.querySelector("script#root")
-    if( !$root ){                          
-      $root = document.createElement("script")
-      $root.id = "root"               
-      document.body.appendChild($root)
-    }                                                            
-    $root.innerHTML = js
-  }
-
-}

com/isoterminal/feat/javascript.js

@@ -1,51 +0,0 @@
-if( typeof emulator != 'undefined' ){
-  // inside worker-thread
-
-  // unix to js device
-  emulator.readFromPipe( 'dev/browser/js', async (data) => {
-    const convert = ISOTerminal.prototype.convert
-    const buf     = await this.emulator.read_file("dev/browser/js")
-    const script  = convert.Uint8ArrayToString(buf)
-    let PID=null
-    try{
-      if( script.match(/^PID/) ){ 
-        PID = script.match(/^PID=([0-9]+);/)[1] 
-      }
-      this.postMessage({event:'javascript-eval',data:{script,PID}})
-    }catch(e){ 
-      console.error(e)
-    }
-  })
-
-}else{
-  // inside browser-thread
-  
-  ISOTerminal.addEventListener('javascript-eval', async function(e){
-    const {script,PID} = e.detail
-    let res;
-
-    try{
-      let f = new Function(`${script}`);
-      res = f();
-      if( res && typeof res != 'string' ) res = JSON.stringify(res,null,2)
-    }catch(err){
-      console.error(err)
-      console.dir(err)
-      res = "error: "+err.toString()
-
-      // try to figure out line *FIXME*
-      let line = err.stack.split("\n").find(e => e.includes("<anonymous>:") || e.includes("Function:"));
-      if( line ){
-        let lineIndex = (line.includes("<anonymous>:") && line.indexOf("<anonymous>:") + "<anonymous>:".length) ||  (line.includes("Function:") && line.indexOf("Function:") + "Function:".length);
-        let lnr = +line.substring(lineIndex, lineIndex + 1) - 2
-        res += script.split("\n")[lnr-1]
-      }else console.dir(script)
-      console.error(res)
-    }
-    // update output to 9p with PID as filename (in /mnt/run)
-    if( PID ){
-      this.worker.update_file(`run/${PID}`, this.convert.toUint8Array(res) )
-    }
-  })
-
-}

com/isoterminal/feat/jsconsole.js

@@ -1,79 +0,0 @@
-ISOTerminal.prototype.redirectConsole = function(handler){
-   const log = console.log;
-   const dir = console.dir;
-   const err = console.error;
-   const warn = console.warn;
-   const addLineFeeds = (str) => typeof str == 'string' ? str.replace(/\n/g,"\n\r") : str
-
-   console.log = (...args)=>{
-       const textArg = args[0];
-       handler( addLineFeeds(textArg) );
-       log.apply(log, args);
-   };
-   console.error = (...args)=>{
-       const textArg = args[0]
-       handler( addLineFeeds(textArg), '\x1b[31merror\x1b[0m');
-       err.apply(log, args);
-   };
-   console.dir = (...args)=>{
-       const textArg = args[0]
-       let str = JSON.stringify(textArg,null,2)+'\n'
-       handler( addLineFeeds(str) )
-       dir.apply(log, args);
-   };
-   console.warn = (...args)=>{
-       const textArg = args[0]
-       handler( addLineFeeds(textArg),'\x1b[38;5;208mwarn\x1b[0m');
-       err.apply(log, args);
-   };
-
-}
-
-ISOTerminal.prototype.enableConsole = function(opts){
-
-  opts = opts || {stdout:false}
-
-  this.redirectConsole( (str,prefix) => {
-    let _str = typeof str == 'string' ? str : JSON.stringify(str)
-    let finalStr = "";
-    prefix = prefix ? prefix+' ' : ''
-    _str.trim().split("\n").map( (line) => {
-      finalStr += `${opts.stdout ? '' : "\x1b[38;5;165m/dev/browser: \x1b[0m"}`+prefix+line+'\n'
-    })
-    if( opts.stdout ){
-      this.emit('serial-output-string', finalStr)
-    }else this.emit('append_file', ["/dev/browser/console",finalStr])
-  })
-
-  window.addEventListener('error', function(event) {
-    if( event.filename ){
-      console.error(event.filename+":"+event.lineno+":"+event.colno)
-      console.error(event.message);
-      console.error(event.error);
-    }else console.error(event)
-  });
-
-  window.addEventListener('unhandledrejection', function(event) {
-    console.error(event);
-  });
-
-  if( opts.stdout ){
-    this.emit('serial-output-string', "\n\n\r☑ initialized javascript console\n");
-    this.emit('serial-output-string', "\r☑ please use these functions to print:\n");
-    this.emit('serial-output-string', "\r└☑ console.log(\"foo\")\n");
-    this.emit('serial-output-string', "\r└☑ console.warn(\"foo\")\n");
-    this.emit('serial-output-string', "\r└☑ console.dir({foo:12})\n");
-    this.emit('serial-output-string', "\r└☑ console.error(\"foo\")\n");
-    this.emit('serial-output-string', "\r\n");
-  }
-}
-
-ISOTerminal.addEventListener('emulator-started', function(){
-  this.enableConsole()
-})
-
-ISOTerminal.addEventListener('init', function(){
-  this.addEventListener('enable-console', function(opts){
-    this.enableConsole(opts.detail)
-  })
-})

com/isoterminal/feat/pastedrop.js

@@ -1,48 +0,0 @@
-if( typeof emulator != 'undefined' ){
-  // inside worker-thread
-
-}else{
-  // inside browser-thread
-  //
-  ISOTerminal.prototype.pasteWriteFile = async function(data,type,filename){
-    this.pasteWriteFile.fileCount = this.pasteWriteFile.fileCount || 0
-    const file = `clipboard/`+ ( filename || `user-paste-${this.pasteWriteFile.fileCount}`)
-    await this.worker.create_file(file, data ) 
-    // run the xrsh hook
-    this.hook("clipboard", [ `/mnt/${file}`, type ] )
-    console.log("clipboard paste: /mnt/"+file)
-    this.pasteWriteFile.fileCount += 1
-  }
-
-  ISOTerminal.prototype.pasteFile = async function(data){
-    const {type,item,pastedText} = data
-    if( pastedText){
-      // the terminal handles this (pastes text)
-      // this.pasteWriteFile( this.convert.toUint8Array(pastedText) ,type, null, true)
-    }else{
-      const file = item.getAsFile();
-      const reader = new FileReader();
-      reader.onload = (e) => {
-        const arr = new Uint8Array(e.target.result)
-        this.pasteWriteFile( arr, type, file.name ); // or use readAsDataURL for images
-      };
-      reader.readAsArrayBuffer(file);
-    }
-  }
-
-  ISOTerminal.prototype.pasteInit = function(opts){
-      // bind upload input
-      const {instance, aEntity} = opts
-      const el = aEntity.el.dom.querySelector('#pastedrop') // upload input
-      el.addEventListener('change', (e) => {
-        const file = el.files[0];
-        const item = {...file, getAsFile: () => file } // pasteFile-event works with File objets
-        const data = { item, type: file.type }
-        this.emit( 'pasteFile', data, "worker" ) // impersonate as worker (as worker cannot handle File objet)
-      })
-  }
-
-  ISOTerminal.addEventListener('init', function(){
-    this.addEventListener('term_init', (opts) => this.pasteInit(opts.detail) )
-  })
-}

com/isoterminal/feat/screenbuttons.js

@@ -1,13 +0,0 @@
-ISOTerminal.addEventListener('ready', function(){
-  this.screenButtonsCreate()
-})
-
-ISOTerminal.prototype.screenButtonsCreate = function(){
-  let el = document.createElement("a-plane")
-  el.setAttribute("height","1")
-  el.setAttribute("width","1")
-  el.setAttribute("scale","0.1 0.07 1")
-  el.setAttribute("position", "-0.326 -0.270 0")
-  this.instance.appendChild(el)
-}
-

com/isoterminal/feat/term.js

@@ -1,141 +0,0 @@
-ISOTerminal.addEventListener('init', function(){
-  this.TermInit()
-})
-
-ISOTerminal.prototype.TermInit = function(){
-
-  const setupTerm = (opts) => {
-    if( !opts ) return
-    const {instance, aEntity} = opts
-    const el = aEntity.el.dom.querySelector('#term')
-    opts.termOpts = {
-      cols: aEntity.cols, 
-      rows: aEntity.rows,
-      el_or_id: el,
-      scrollback: aEntity.rows*3, 
-      fontSize: null // 
-      //rainbow: [Term.COLOR_MAGENTA, Term.COLOR_CYAN ],
-      //xr: AFRAME.scenes[0].renderer.xr,
-      //map: {
-      //  'ArrowRight': { ch: false, ctrl: '\x1b\x66' },  // this triggers ash-shell forward-word
-      //  'ArrowLeft':  { ch: false, ctrl: '\x1b\x62' }   //                         backward-word
-      //}
-    }
-
-    // patch Term-class
-    Term.prototype.move_textarea = function(){} /* *TODO* *FIXME* does not work in winbox */
-
-    Term.prototype.pasteHandler = function(original){
-      return function (ev){
-        original.apply(this,[ev])
-      }
-    }( Term.prototype.pasteHandler )
-
-    Term.prototype.keyDownHandler = function(original){
-      return function (e){
-        if ((e.ctrlKey || e.metaKey) && e.key === 'v') {
-          return true; // bubble up to pasteHandler (see pastedrop.js)
-        }
-        original.apply(this,[e])
-      }
-    }( Term.prototype.keyDownHandler )
-
-    Term.prototype.href = (a) => {
-      if( a.href ){
-        this.exec(`source /etc/profile.sh; hook href "${a.href}"`)
-      }
-      return false
-    }
-    this.term = new Term( opts.termOpts )
-    this.term.colors = [
-        /* normal */
-        "#000000",
-        "#2FA",
-        "#7700ff",
-        "#555555",
-        "#0000ff",
-        "#aa00aa",
-        "#ff00aa",
-        "#aaaaaa",
-        /* bright */
-        "#555555",
-        "#ff5555",
-        "#2CF",
-        "#aa00ff",
-        "#5555ff",
-        "#ff55ff",
-        "#55ffff",
-        "#ffffff" 
-    ];
-    this.term.open(el)
-    this.term.el = el
-    this.term.prompt = "\r> "
-
-
-    // you can override this REPL in index.html via :
-    //
-    // <script>
-    //   document.querySelector('[isoterminal]')
-    //   .components
-    //   .isoterminal
-    //   .term
-    //   .term
-    //   .setKeyHandler( (ch) => { ....} )
-    //  </script>
-    //
-    //  this might change in the future into something 
-    //  more convenient
-    this.term.setKeyHandler( (ch) => {
-      if( this.ready ){
-        this.send(ch)  // send to v86 webworker
-      }else{
-        if( (ch == "\n" || ch == "\r") && typeof this.console == 'undefined' ){ 
-          switch( this.lastChar ){
-            case '1':   this.bootISO(); break;
-            case '2': {
-                        this.emit('enable-console',{stdout:true})
-                        this.emit('status',"javascript console")
-                        this.console = ""
-                        setTimeout( () => this.term.write( this.term.prompt), 100 )
-                        break;
-                      }
-          }
-        }else if( this.console != undefined ){
-          this.term.write(ch)
-          const reset = () => {
-            this.console = ""
-            setTimeout( () => "\n\r"+this.term.write( this.term.prompt),100)
-          }
-          if( (ch == "\n" || ch == "\r") ){
-            try{
-              this.term.write("\n\r")
-              if( this.console ) eval(this.console)
-              reset()
-            }catch(e){ 
-              reset()
-              throw e // re throw
-            }
-          }else{
-            this.console += ch
-          }
-        }else{
-          this.term.write(ch)
-        }
-        this.lastChar = ch
-      }
-    })
-    aEntity.el.addEventListener('focus', () => el.querySelector("textarea").focus() )
-    aEntity.el.addEventListener('serial-output-string', (e) => {
-      this.term.write(e.detail)
-    })
-    //aEntity.term.emit('initTerm',this)
-    //aEntity.el.addEventListener('focus', () => this.vt100.focus() )
-
-    //aEntity.el.addEventListener('serial-output-string', (e) => {
-    //  this.vt100.write(e.detail)
-    //})
-
-  }
-
-  this.addEventListener('term_init', (opts) => setupTerm(opts.detail) )
-}

com/isoterminal/mnt/alert

@@ -0,0 +1,6 @@
+#!/bin/sh
+title=$1
+shift
+msg="$*"
+echo "$title $(printf "\033[0m")$msg"
+hook alert $title "$msg" 

com/isoterminal/mnt/confirm

@@ -0,0 +1,4 @@
+#!/bin/sh
+read -p "$(printf "\033[0m")[?] $1 [y/n] $(printf "\033[0m")" y
+test $y = y && echo true && exit
+echo false

com/isoterminal/mnt/hook

@@ -0,0 +1,11 @@
+#!/bin/sh
+
+test -z $1 && { echo "usage: hook <cmd_or_jsfunction> [args]"; exit 0; } 
+cmd=$1
+shift 
+
+test -d ~/hook.d/$cmd && {
+  find ~/hook.d/$cmd/ -type f -executable | while read hook; do 
+    { $hook "$@" || true; } |  awk '{ gsub(/\/root\/\//,"",$1); $1 = sprintf("%-40s", $1)} 1'
+  done
+}

com/isoterminal/mnt/js

@@ -1,28 +1,16 @@
 #!/bin/sh
-PID=$$
 test -z "$1" && { echo "Usage: js 'somefunction(1)'"; exit 0; }
 
 test -n "$BROWSER" || { alert warning "/dev/browser not active (are you running outside of v86?)"; }
 javascript="$*"
 
 # if we are run as shebang, use the file as input
-test -f "$1" && {
-  javascript="args = String('$*').split(' '); $(cat $1 | tail +2)"
-}
-
-# below is not ideal
-# first I tried /dev/ttyS* https://github.com/copy/v86/issues/530
-# and differentiate processes by prefixing output by PID's 
-# to parse it later with AWK, but it was very hairy
-
-OUTPUT=/mnt/$PID
-echo -n "PID=$PID; $javascript" > /dev/browser/js
-sleep 0.1
-test -f $OUTPUT && {
-  cat $OUTPUT
-  rm $OUTPUT
-}
+case "$1" in 
+  */*) javascript="args = String('$*').split(' '); $(cat $1 | tail +2)"
+       ;;
+esac
 
+echo -n "$javascript" > /dev/browser/js
 
 # should we use flock, an awesome way to make processes read/write the same file
 # while preventing 1001 concurrency issues?

com/isoterminal/mnt/jsh

@@ -3,8 +3,6 @@
 #         
 # 'jsh prompt question answer' executes: js prompt('question','answer') )
 
-source /mnt/profile.sh
-
 to_js(){
   printf "%s(" "$1"
   shift
@@ -25,7 +23,7 @@ to_js(){
 test -z "$1" || {
   func=$(to_js "$@")
   func=${func/,)/)}
-  js "return $func"
+  js "$func"
   hook "$@"
   exit 0
 }
@@ -35,7 +33,7 @@ echo "jsh> type 'exit' or CTRL-C to quit"
 echo "jsh> HINT: to run alert('foo') outside this REPL, run 'jsh alert foo'"
 echo "jsh>"
 while true; do
-  echo -n -e "\n$(printf "\033[0m")jsh> $(printf "\033[0m")"
+  echo -n -e "\r$(printf "\033[0m")jsh> $(printf "\033[0m")"
   read line
   test "$line" = exit && exit
   js "$line"

com/isoterminal/mnt/motd

@@ -5,12 +5,11 @@
  _ _   /     \  |    |   \/        \    Y    / _ _ _ _ _ _ _
  . .  /___/\  \ |____|_  /_______  /\___|_  /. . . . . . . .
  . . . . . .\_/. . . . \/ . . . .\/ . . _ \/ . . . . . . . .
- ▬▬▬▬ https://xrsh.isvery.ninja ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
+ ▬ ▬ ▬ https://xrsh.isvery.ninja ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬ ▬
+ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 
 
- Open, local-first, unix hackable & selfcontained XR apps.
+ Open, local-first, hackable & selfcontained XR apps.
 
- credits:  NLnet           | @nlnet@nlnet.nl https://nlnet.nl/project
-           all FOSS devs   | copy.sh (v86) aframe.io (AFRAME)
-           Leon van Kammen | @lvk@mastodon.online
-           Fabien Benetou  | @utopiah@mastodon.pirateparty.be 
+ credits:  all FOSS devs | @lvk@mastodon.online 
+           copy.sh (v86) | @utopiah@mastodon.pirateparty.be 
 

com/isoterminal/mnt/profile

@@ -1,41 +1,22 @@
-# source URL data from v86 (file created by v86 during boot)
-test -f /mnt/profile.browser && source /mnt/profile.browser
-
-# source xrsh env
+# install xrsh env
 source /mnt/profile.xrsh
 
-# source shell functions
-source /mnt/profile.sh
-
-# source js functions 
-./.profile.js
-
 ## forward not-found commands to javascript (via jsh)
 command_not_found_handle(){
-  echo "[!] '$1' not found, did you mean $1(...) (javascript?)"
-  test -n "$ONBOARDING" && echo "[i] type 'help' for handy commands"
-  test -n "$ONBOARDING" || help
+  echo "$1 not found, did you mean $1(...) (javascript?)"
+  alert '[XRSH TIPS]'
+  alert 'js console:      ' "type 'jsh'"
+  alert 'js shellfunction:' "type 'alias $1=\"jsh $1\"' to run '$1 yo' as $1('yo')"
+  alert 'js logging:      ' "type 'echo 0 > /dev/browser/console.tty' to disable"
+  alert 'js capture log:  ' "type 'tail -f /dev/browser/console'"
+  alert 'jsh<->sh hooks:  ' "type 'chmod +x ~/hook.d/alert/* && alert helloworld'"
 }
 
-help(){
-  echo ""
-  echo 'TIPS'
-  echo '----'
-  echo 'js run                ' "type 'js 'alert(\"hello\")'"
-  echo 'js console.log:       ' "type 'console document.baseURI"
-  echo 'js function as cmd:   ' "type 'alias $1=\"jsh $1\"' to run '$1 yo' as $1('yo')"
-  echo 'js inspect:           ' "type 'js \"return document.baseURI\"'"
-  echo 'js console disable:   ' "type 'echo 0 > /dev/browser/console.tty' to enable"
-  echo 'js capture console:   ' "type 'tail -f /dev/browser/console'"
-  echo 'jsh<->sh hooks:       ' "type 'chmod +x ~/hook.d/*/* && alert helloworld'"
-  echo 'include file into page' "type 'require <url.js|css>'"
-  echo 'create AFRAME a-entity' "type 'a_entity <componentname> [...]"
-  ONBOARDING=1
-}
+# source javascript functions
+#js "$(cat /mnt/profile.js)"
 
 resize
-test $HOSTNAME = localhost || clear
+#clear 
 cat /mnt/motd
-export PATH=$PATH:/mnt:~/bin
-export PS1="\n\[\033[38;5;57m\]x\[\033[38;5;93m\]r\[\033[38;5;129m\]s\[\033[38;5;165m\]h \[\033[38;5;201m\]# \[\033[0m\]"
-
+export PATH=$PATH:/mnt
+export PS1="\nxrsh # \033[0m"

com/isoterminal/mnt/profile.js

@@ -1,6 +1,3 @@
-#!/bin/js
-
 window.helloworld = function(){
   alert("hello world")
-  return "hello world"
 }

com/isoterminal/mnt/profile.sh

@@ -1,57 +0,0 @@
-hook(){
-  test -z "$1" && { echo "usage: hook <cmd_or_jsfunction> [args]"; return 0; } 
-  cmd=$1
-  shift 
-  test -d ~/hook.d/$cmd && {
-    find ~/hook.d/$cmd/ -type f -executable | while read hook; do 
-      { $hook "$@" || true; } |  awk '{ gsub(/\/root\/\//,"",$1); $1 = sprintf("%-40s", $1)} 1'
-    done
-  }
-}
-
-alert(){
-  test -z "$1" && { echo "usage: alert <title> <message>"; return 0; } 
-  title=$1
-  test -z "$1" || shift
-  msg="$*"
-  printf "%s \033[0m%s\n" "$title" "$msg"
-  hook alert $title "$msg" 
-}
-
-confirm(){
-  test -z "$1" && { echo "usage: confirm <question>"; return 0; } 
-  read -p "$(printf "\033[0m")[?] $1 [y/n] $(printf "\033[0m")" y
-  test $y = y && echo true && return 0
-  test $y = y || echo false 
-  hook confirm $1 $y
-}
-
-prompt(){
-  test -z "$1" && { echo "usage: prompt <question> [answer_default]"; return 0; } 
-  test -n "$2" && answer="[$2] " && answer_fallback="$2"
-  read -p "$(printf "\033[0m")[?] $1: $answer $(printf "\033[0m")" answer
-  test -z "$answer" && answer="$answer_fallback"
-  echo "$answer"
-  hook prompt $1 $answer
-}
-
-console(){
-  js 'return '$1
-}
-
-require(){
-  file=$(basename "$1")
-  js '(async () => {
-    await AFRAME.utils.require({"'$file'": "'$1'"})
-  })()'
-}
-
-a_entity(){
-  code="let el = document.createElement('a-entity')"
-  for i in "$@"; do 
-    code="$code;\nel.setAttribute('$i','')\n"; 
-  done
-  code="document.querySelector('a-scene').appendChild(el)"
-  echo "$code"
-  js "$code"
-}

com/isoterminal/mnt/profile.xrsh

@@ -3,53 +3,39 @@
 test -d /dev/browser || {
 
   setup_binaries(){
-    for bin in /mnt/js* /mnt/v86pipe /mnt/xrsh; do 
+    for bin in /mnt/prompt /mnt/alert /mnt/confirm /mnt/hook /mnt/js* /mnt/v86pipe /mnt/xrsh; do 
       chmod +x $bin
       ln -s $bin /bin/.
     done
   }
 
-  setup_links(){
-    ln -s /mnt/profile ~/.profile
-    ln -s /mnt/profile.js ~/.profile.js
-    ln -s /mnt/profile.browser ~/.profile.browser
-    ln -s /mnt/profile.sh ~/.profile.sh
-    ln -s /mnt/motd ~/.motd 
-    ln -s ~/.profile.js ~/index.js
-    chmod +x ~/.profile.js
-  }
-
   setup_browser_dev(){
     mkdir -p /mnt/dev/browser
     touch /mnt/dev/browser/js
+    touch /mnt/dev/browser/html
     touch /mnt/console.tty
     ln -s /mnt/dev/browser /dev/browser
-    # emulator.write_file() only writes to /mnt/. :(
-    # should be in /proc, but v86 gives 'no such file or dir' when creating it there
-    ln -s /mnt/console.tty /dev/browser/console.tty 
-    echo 1 > /dev/browser/console.tty
-    touch /mnt/console    && ln -s /mnt/console /dev/browser/console
-    touch /mnt/index.html && ln -s /mnt/index.html /dev/browser/index.html
-    ln -s /dev/browser/index.html ~/index.html
+    # setup console goodies
+    ln -s /mnt/console.tty /dev/browser/console.tty # emulator.write_file() only writes to /mnt/. :(
+    echo 1 > /dev/browser/console.tty               # should be in /proc, but v86 gives 'no such file or dir' when creating it there
+    v86pipe /mnt/console /dev/browser/console &
 
     test -f /etc/profile && rm /etc/profile
     ln -s /mnt/profile /etc/profile
   }
 
   setup_hook_dirs(){ # see /mnt/hook for usage
-    mkdir ~/bin
     mkdir -p ~/hook.d/alert  
-    echo -e "#!/bin/sh\necho hook.d/alert/yo: yo \$*"                                   > ~/hook.d/alert/yo 
-    echo -e "#!/bin/js\nstr = \"hook.d/alert/yo.js yo \"+args.slice(1).join(' ')\nalert(str)\nreturn str" > ~/hook.d/alert/yo.js
-    echo -e "#!/usr/bin/env lua\nprint(\"hook.d/alert/yo.lua: yo \" .. arg[1])"         > ~/hook.d/alert/yo.lua
-    echo -e "#!/usr/bin/awk -f\nBEGIN{\n\tprint \"hook.d/alert/yo.awk: yo \" ARGV[1]\n}" > ~/hook.d/alert/yo.awk
-    echo -e "#!/bin/sh\necho hello \$*"                                                 > ~/bin/hello 
-    chmod +x ~/bin/hello
+    mkdir -p ~/hook.d/confirm  
+    mkdir -p ~/hook.d/prompt  
+    echo -e "#!/bin/sh\necho hook.d/alert/yo: yo \$*"                           > ~/hook.d/alert/yo
+    echo -e "#!/bin/js\nalert(\"hook.d/alert/yo.js \"+args.slice(1).join(' '))" > ~/hook.d/alert/yo.js
+    echo -e "#!/usr/bin/lua\nprint(\"hook.d/alert/yo.lua: yo \" .. arg[1])"     > ~/hook.d/alert/yo.lua
   }
 
   setup_network(){
     test -n "$BROWSER" || return 0
-    #mount -a
+    mount -a
     udhcpc 1>>/var/log/network.log 2>>/var/log/network.log & 
     echo 0 > /proc/sys/kernel/printk
   }
@@ -57,7 +43,5 @@ test -d /dev/browser || {
   setup_binaries
   setup_browser_dev
   setup_hook_dirs
-  setup_links
-  setup_network
-
 }
+

com/isoterminal/mnt/prompt

@@ -0,0 +1,3 @@
+#!/bin/sh
+read -p "$(printf "\033[0m")[?] $1: $(printf "\033[0m")" answer
+echo "$answer"

com/isoterminal/mnt/test.awk

@@ -0,0 +1,26 @@
+#!/bin/awk -f
+
+BEGIN {
+    for (i = 1; i < ARGC; i++) {
+        options[i] = ARGV[i]
+    }
+    ARGC = 0
+    selected = 1
+    n = length(options)
+
+    while (1) {
+	printf "\r                                              "
+        for (i = 1; i <= n; i++) {
+            if (i == selected) 
+                printf "\033[44m%s\033[0m ", options[i]
+            else 
+                printf "%s ", options[i]
+        }
+        if (c == 0) {
+            getline dir < "/dev/stdin"
+	    print dir
+            if (dir == "up" && selected > 1) selected--
+            if (dir == "down" && selected < n) selected++
+        }
+    }
+}

com/isoterminal/mnt/xrsh

@@ -0,0 +1,62 @@
+#!/bin/sh
+#
+# a minimalistic terminal muxer 
+
+# Save the original stdout and stderr file descriptors for later restoration
+exec 3>&1 4>&2
+
+# Function to check if a session is already running on the given VT
+is_session_running() {
+    vt_number=$1
+
+    # Check if any process is running on /dev/tty<vt_number>
+    fuser /dev/tty"$vt_number" >/dev/null 2>&1
+    return $?
+}
+
+# Function to mute the output of a session
+mute_session() {
+    vt_number=$1
+    if is_session_running "$vt_number"; then
+        # Redirect stdout and stderr of the session to /dev/null
+        exec > /dev/null 2>&1
+    fi
+}
+
+# Function to unmute the current session (restore stdout and stderr)
+unmute_session() {
+    exec 1>&3 2>&4  # Restore stdout and stderr from file descriptors 3 and 4
+}
+
+# Function to start a new session if not already running
+start_or_switch_session() {
+    vt_number=$1
+
+    # Mute all other sessions except the one we're switching to
+    for vt in $(seq 1 12); do  # Assuming you have up to 12 VTs, adjust as needed
+        if [ "$vt" != "$vt_number" ]; then
+            mute_session "$vt"
+        fi
+    done
+
+    if is_session_running "$vt_number"; then
+        echo "Switching to existing session on VT$vt_number"
+        unmute_session  # Unmute the session we're switching to
+        chvt "$vt_number"
+    else
+        echo "Starting a new session on VT$vt_number"
+        openvt -c "$vt_number" -- /bin/sh &
+        sleep 1  # Give the session a moment to start
+        unmute_session  # Unmute the new session
+        chvt "$vt_number"
+    fi
+}
+
+# Ensure a session number is provided
+if [ "$#" -ne 1 ]; then
+    echo "Usage: $0 <session_number>"
+    exit 1
+fi
+
+# Start or switch to the session
+start_or_switch_session $1

com/isoterminal/worker.js

@@ -1,96 +0,0 @@
-importScripts("libv86.js");
-importScripts("ISOTerminal.js")  // we don't instance it again here (just use its functions)
-
-this.runISO = function(opts){
-  this.opts = opts
-  if( opts.debug ) console.dir(opts)
-
-  if( opts.cdrom   && !opts.cdrom.url.match(/^http/) ) opts.cdrom.url   = "../../"+opts.cdrom.url 
-  if( opts.bzimage && !opts.cdrom.url.match(/^http/) ) opts.bzimage.url = "../../"+opts.bzimage.url 
-
-  let emulator = this.emulator = new V86(opts); 
-  console.log("[worker.js] started emulator")
-
-  // event forwarding
-  emulator.buf0 = {}
-  emulator.buf1 = {}
-  emulator.buf2 = {}
-
-  emulator.add_listener("serial0-output-byte", function(byte){
-    ISOTerminal.prototype.bufferOutput(byte, (str) => { // we buffer to prevent framerate dropping
-      if( !str ) return
-      this.postMessage({event:"serial0-output-string",data:str});
-    }, opts.bufferLatency, emulator.buf0 )
-  }.bind(this));
-
-  emulator.add_listener("serial1-output-byte", function(byte){
-    ISOTerminal.prototype.bufferOutput(byte, (str) => { // we buffer to prevent framerate dropping
-      if( !str ) return
-      this.postMessage({event:"serial1-output-string",data:str});
-    }, opts.bufferLatency, emulator.buf1 )
-  }.bind(this));
-
-  emulator.add_listener("serial2-output-byte", function(byte){
-    ISOTerminal.prototype.bufferOutput(byte, (str) => { // we buffer to prevent framerate dropping
-      if( !str ) return
-      this.postMessage({event:"serial2-output-string",data:str});
-    }, opts.bufferLatency, emulator.buf2 )
-  }.bind(this));
-
-  emulator.add_listener("emulator-started", function(){
-    importScripts("feat/9pfs_utils.js")
-    this.postMessage({event:"emulator-started",data:false});
-  }.bind(this));
-
-  /* 
-   * forward events/functions so non-worker world can reach them
-   */
- 
-  // stripping '/mnt' is needed (the 9p mounted fs does not know about this)
-  const stripMountDir  = (arr) => {
-    arr[0] = String(arr[0]).replace(/^\/mnt/,'')
-    return arr
-  }
-  this.create_file     = async function(){ return emulator.create_file.apply(emulator, stripMountDir(arguments[0]) ) }
-  this.read_file       = async function(){ return emulator.read_file.apply(emulator, stripMountDir(arguments[0]) )   }
-  this.read_file_world = async function(){ return emulator.fs9p.read_file_world.apply(emulator.fs9p, stripMountDir(arguments[0]) )   }
-  this.append_file     = async function(){ emulator.fs9p.append_file.apply(emulator.fs9p, stripMountDir(arguments[0])) }
-  this.update_file     = async function(){ emulator.fs9p.update_file.apply(emulator.fs9p, stripMountDir(arguments[0])) }
-
-  // filename will be read from 9pfs: "/mnt/"+filename
-  emulator.readFromPipe = function(filename,cb){
-    emulator.add_listener("9p-write-end", async (opts) => {
-      if ( opts[0] == filename.replace(/.*\//,'') ){
-        cb()
-      }
-    })
-  }
-
-  importScripts("feat/javascript.js")
-  importScripts("feat/index.html.js")
-  importScripts("feat/autorestore.js")
-}
-/* 
- * forward events/functions so non-worker world can reach them
- */
-
-this['serial0-input'] = function(c){ emulator.bus.send( 'serial0-input', c) } // to /dev/ttyS0
-this['serial1-input'] = function(c){ emulator.bus.send( 'serial1-input', c) } // to /dev/ttyS1
-this['serial2-input'] = function(c){ emulator.bus.send( 'serial2-input', c) } // to /dev/ttyS2
-
-this.onmessage = async function(e){
-  let {event,data} = e.data
-  if( this[event] ){
-    if( this.opts?.debug ) console.log(`[worker.js] this.${event}(${JSON.stringify(data).substr(0,60)})`)
-    try{
-      let result = await this[event](data)
-      if( data.promiseId ){ // auto-callback to ISOTerminal.worker.promise(...)
-        this.postMessage({event,data: {...data,result}})
-      } 
-    }catch(e){
-      if( data.promiseId ){ // auto-callback to ISOTerminal.worker.promise(...)
-        this.postMessage({event,data: {...data,error:e}})
-      } 
-    }
-  }
-}

com/isoterminal/xrsh.iso

@@ -0,0 +1 @@
+buildroot.iso

com/launcher.js

@@ -45,12 +45,9 @@ AFRAME.registerComponent('launcher', {
     cols:   { type:"number", "default": 5 }
   },
 
-  dependencies:{
-    dom:         "com/dom.js"
-  },
+  dependencies:['dom'],
 
   init: async function () {
-    await AFRAME.utils.require(this.dependencies)
     this.worldPosition = new THREE.Vector3()
 
     await AFRAME.utils.require({
@@ -380,7 +377,7 @@ AFRAME.registerSystem('launcher',{
 
   updateLauncher: function(){
     let launcher = document.querySelector('[launcher]')
-    if( launcher ) launcher.components.launcher.render()
+    if( launcher ) launcher.components['launcher'].render()
   }
 
 })

com/paste.js

@@ -0,0 +1,179 @@
+AFRAME.registerComponent('paste', {
+  schema: { 
+    foo: { type:"string"}
+  },
+
+  init: function () {
+    this.el.object3D.visible = false
+    //this.el.innerHTML = ` `
+  },
+
+  requires:{
+    osbutton:              "com/osbutton.js"
+  },
+
+  events:{
+
+    // component events
+    somecomponent: function( ){ console.log("component requirement mounted") },
+    ready:         function(e){ console.log("requires are loaded") },
+
+    launcher:      function(e){ 
+      const paste = () => {
+        navigator.clipboard.readText()
+        .then( (base64) => {
+          let mimetype  = base64.replace(/;base64,.*/,'')
+          let data = base64.replace(/.*;base64,/,'')
+          let type = this.textHeuristic(data)
+          console.log("type="+type)
+          switch( this.textHeuristic(data) ){
+            case "aframe":    this.insertAFRAME(data); break;
+            default:          this.insertText(data); break;
+          }
+          this.count += 1
+        })
+      }
+
+      navigator.permissions.query({ name: 'clipboard-read' })
+      .then( (permission) => {
+        if( permission.state != 'granted' ){
+          this.el.sceneEl.exitVR()
+          setTimeout( () => paste(), 500 )
+          return
+        }else paste()
+      })
+    },
+
+  },
+
+  textHeuristic: function(text){
+    // Script type identification clues
+    const bashClues   = ["|", "if ", "fi", "cat"];
+    const htmlClues   = ["/>", "href=", "src="];
+    const aframeClues = ["<a-entity", "/>", "position="];
+    const jsClues     = ["var ", "let ", "function ", "setTimeout","console."];
+    // Count occurrences of clues for each script type
+    const bashCount = bashClues.reduce((acc, clue) => acc + (text.includes(clue) ? 1 : 0), 0);
+    const htmlCount = htmlClues.reduce((acc, clue) => acc + (text.includes(clue) ? 1 : 0), 0);
+    const aframeCount = aframeClues.reduce((acc, clue) => acc + (text.includes(clue) ? 1 : 0), 0);
+    const jsCount = jsClues.reduce((acc, clue) => acc + (text.includes(clue) ? 1 : 0), 0);
+
+    // Identify the script with the most clues or return unknown if inconclusive
+    const maxCount = Math.max(bashCount, htmlCount, jsCount, aframeCount);
+    if (maxCount === 0) {
+      return "unknown";
+    } else if (bashCount === maxCount) {
+      return "bash";
+    } else if (htmlCount === maxCount) {
+      return "html";
+    } else if (jsCount === maxCount) {
+      return "javascript";
+    } else {
+      return "aframe";
+    }
+  },
+
+  insertAFRAME: function(data){
+    let scene = document.createElement('a-entity')
+    scene.id = "embedAframe"
+    scene.innerHTML = data
+    let el = document.createElement('a-text')
+    el.setAttribute("value",data)
+    el.setAttribute("color","white")
+    el.setAttribute("align","center")
+    el.setAttribute("anchor","align")
+    let osbutton = this.wrapOSButton(el,"aframe",data)
+    AFRAME.scenes[0].appendChild(osbutton)
+    console.log(data)
+  },
+
+  insertText: function(data){
+    let el = document.createElement('a-text')
+    el.setAttribute("value",data)
+    el.setAttribute("color","white")
+    el.setAttribute("align","center")
+    el.setAttribute("anchor","align")
+    let osbutton = this.wrapOSButton(el,"text",data)
+    AFRAME.scenes[0].appendChild(osbutton)
+    console.log(data)
+  },
+
+  wrapOSButton: function(el,type,data){
+    let osbutton = document.createElement('a-entity')
+    let height   = type == 'aframe' ? 0.3 : 0.1
+    let depth    = type == 'aframe' ? 0.3 : 0.05
+    osbutton.setAttribute("osbutton",`width:0.3; height: ${height}; depth: ${depth}; color:blue `)
+    osbutton.appendChild(el)
+    osbutton.object3D.position.copy( this.getPositionInFrontOfCamera() )
+    return osbutton
+  },
+
+  getPositionInFrontOfCamera: function(distance){
+    const camera = this.el.sceneEl.camera;
+    let pos = new THREE.Vector3()
+    let direction = new THREE.Vector3();
+    // Get camera's forward direction (without rotation)
+    camera.getWorldDirection(direction);
+    camera.getWorldPosition(pos)
+    direction.normalize();
+    // Scale the direction by 1 meter
+    if( !distance ) distance = 1.5
+    direction.multiplyScalar(distance);
+    // Add the camera's position to the scaled direction to get the target point
+    pos.add(direction);
+    return pos
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "Paste",
+    "name": "Paste",
+    "icons": [
+      {
+        "src": "https://css.gg/clipboard.svg",
+        "type": "image/svg+xml",
+        "sizes": "512x512"
+      }
+    ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Paste the clipboard",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application 
+
+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.
+    `
+  }
+
+});
+

com/pastedrop.js

@@ -1,130 +0,0 @@
-/** 
- * ## [pastedrop](com/pastedrop.js)
- *
- * detects user copy/paste and file dragdrop action
- * and clipboard functions
- *
- * ```html 
- *   <a-entity pastedrop/>
- * ```
- *
- * | event        | target | info                                                                                               |
- * |--------------|--------|------------------------------------------|
- * | `pasteFile`  | self   | always translates input to a File object |
- */
-
-AFRAME.registerComponent('pastedrop', {
-  schema: { 
-    foo: { type:"string"}
-  },
-
-  init: function () {
-
-    window.addEventListener('paste', this.onPaste.bind(this) )
-
-    document.body.addEventListener('dragover',(e) => e.preventDefault() ) 
-    document.body.addEventListener('drop',  this.onDrop.bind(this) )
-  },
-
-  initClipboard: function(){
-    navigator.permissions.query({ name: 'clipboard-read' })
-    .then( (permission) => {
-      if( permission.state != 'granted' ){
-        this.el.sceneEl.exitVR()
-        setTimeout( () => this.paste(), 500 )
-        return
-      }else this.paste()
-    })
-  },
-
-  getClipboard: function(){
-    navigator.clipboard.readText()
-    .then( async (base64) => {
-      let mimetype  = base64.replace(/;base64,.*/,'')
-      let data = base64.replace(/.*;base64,/,'')
-      let type = this.textHeuristic(data)
-      const term = document.querySelector('[isoterminal]').components.isoterminal.term
-        this.el.emit('pasteFile',{}) /*TODO* data incompatible */
-     })
-  },
-
-  onDrop: function(e){
-    e.preventDefault()
-    this.onPaste({...e, type: "paste", clipboardData: e.dataTransfer})
-  },
-
-  onPaste: function(e){
-    if( e.type != "paste" ) return
-
-    const clipboardData = e.clipboardData || navigator.clipboard;
-    const items = clipboardData.items;
-
-    for (let i = 0; i < items.length; i++) {
-      const item = items[i];
-      const type = item.type;
-
-      // Check if the item is a file
-      if (item.kind === "file") {
-        this.el.emit('pasteFile',{item,type})
-      } else if (type === "text/plain") {
-        const pastedText = clipboardData.getData("text/plain");
-        const newType = "text" // let /root/hook.d/mimetype/text further decide whether this is text/plain (or something else)
-        this.el.emit('pasteFile',{item,type:newType,pastedText})
-      }
-    }
-  },
-
-
-  manifest: { // HTML5 manifest to identify app to xrsh
-    "short_name": "Paste",
-    "name": "Paste",
-    "icons": [
-      {
-        "src": "https://css.gg/clipboard.svg",
-        "type": "image/svg+xml",
-        "sizes": "512x512"
-      }
-    ],
-    "id": "/?source=pwa",
-    "start_url": "/?source=pwa",
-    "background_color": "#3367D6",
-    "display": "standalone",
-    "scope": "/",
-    "theme_color": "#3367D6",
-    "shortcuts": [
-      {
-        "name": "What is the latest news?",
-        "cli":{
-          "usage":  "helloworld <type> [options]",
-          "example": "helloworld news",
-          "args":{
-            "--latest": {type:"string"}
-          }
-        },
-        "short_name": "Today",
-        "description": "View weather information for today",
-        "url": "/today?source=pwa",
-        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
-      }
-    ],
-    "description": "Paste the clipboard",
-    "screenshots": [
-      {
-        "src": "/images/screenshot1.png",
-        "type": "image/png",
-        "sizes": "540x720",
-        "form_factor": "narrow"
-      }
-    ],
-    "help":`
-Helloworld application 
-
-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.
-    `
-  }
-
-});
-

com/require.js

@@ -1,17 +1,12 @@
-/**
- * ## [require](com/require('').js)
- *
- * automatically requires dependencies 
- * 
- * ```javascript
- * await AFRAME.utils.require( this.dependencies )               (*) autoload missing components
- * await AFRAME.utils.require( this.el.getAttributeNames() )     (*) autoload missing components
- * await AFRAME.utils.require({foo: "https://foo.com/aframe/components/foo.js"},this)
- * await AFRAME.utils.require(["./app/foo.js","foo.css"],this)
- * ```
- * 
- * > (*) = prefixes baseURL AFRAME.utils.require.baseURL ('./com/' e.g.)
- */ 
+// usage: 
+//
+// await AFRAME.utils.require( this.dependencies )               (*) autoload missing components
+// await AFRAME.utils.require( this.el.getAttributeNames() )     (*) autoload missing components
+// await AFRAME.utils.require({foo: "https://foo.com/aframe/components/foo.js"},this)
+// await AFRAME.utils.require(["./app/foo.js","foo.css"],this)
+// 
+// (*) = prefixes baseURL AFRAME.utils.require.baseURL ('./com/' e.g.)
+//
 AFRAME.utils.require = function(arr_or_obj,opts){
   opts            = opts || {}
   let i           = 0

com/selfcontainer.js

@@ -34,23 +34,16 @@ AFRAME.registerComponent('selfcontainer', {
 
   installProxyServer: function(){
     if( !window.store ) window.store = {}
-
     // selfcontain every webrequest to store (and serve if stored)
     let curry = function(me){
       return function(request, response, cb){
-
         let data = request ? window.store[ request.url ] || false : false 
         if( data ){ // return inline version
-          console.log('selfcontainer.js: serving '+request.url+' from cache')
+          console.log('selfcontained cache: '+request.url)
           let res = new Response()
           res[ data.binary ? 'data' : 'text' ] = data.binary ? () => me.convert.base64ToArrayBuffer(data.text) : data.text 
           cb(res)
         }else{
-
-          // never cache requests to filesystem
-          if( request.url.match(/(^\/mnt\/)/) ) return cb(response)
-
-          console.log("selfcontainer.js: caching "+request.url)
           if( response.text ){
             data = {text: response.text}
           }else{

com/window.js

@@ -1,46 +1,18 @@
-/** 
- * ## [window](com/window.js)
- *
- * wraps a draggable window around a dom id or [dom](com/dom.js) component.
- *
- * ```html 
- *   <a-entity window="dom: #mydiv"/>
- * ```
- *
- * > depends on [AFRAME.utils.require](com/require.js)
- *
- * | property         | type      | default                | info |
- * |------------------|-----------|------------------------|------|
- * | `title`          |`string`   | ""                     |      |
- * | `width`          |`string`   |                        |      |
- * | `height`         |`string`   | 260px                  |      |
- * | `uid`            |`string`   |                        |      |
- * | `attach`         |`selector` |                        |      |
- * | `dom`            |`selector` |                        |      |
- * | `max`            |`boolean`  | false                  |      |
- * | `min`            |`boolean`  | false                  |      |
- * | `x`              |`string`   | "center"               |      |
- * | `y`              |`string`   | "center"               |      |
- * | `class`          |`array`    | []                     |      |
- */
-
 AFRAME.registerComponent('window', {
   schema:{
-    title:     {type:'string',"default":"title"},
-    width:     {type:'string'}, // wrap
-    height:    {type:'string',"default":'260px'},
-    uid:       {type:'string'},
-    attach:    {type:'selector'},
-    dom:       {type:'selector'},
-    max:       {type:'boolean',"default":false},
-    min:       {type:'boolean',"default":false},
-    x:         {type:'string',"default":"center"},
-    y:         {type:'string',"default":"center"},
-    "class":   {type:'array',"default":[]},
+    title: {type:'string',"default":"title"},
+    width: {type:'string'}, // wrap
+    height: {type:'string',"default":'260px'},
+    uid:    {type:'string'},
+    attach: {type:'selector'},
+    dom:    {type:'selector'},
+    x:      {type:'string',"default":"center"},
+    y:      {type:'string',"default":"center"}
   },
 
   dependencies:{
     dom:         "com/dom.js",
+    html:        "https://unpkg.com/aframe-htmlmesh@2.1.0/build/aframe-html.js",  // html to AFRAME
     winboxjs:    "https://unpkg.com/winbox@0.2.82/dist/winbox.bundle.min.js",     // deadsimple windows: https://nextapps-de.github.io/winbox
     //winboxcss:   "https://unpkg.com/winbox@0.2.82/dist/css/winbox.min.css",       // main theme
   },
@@ -53,23 +25,8 @@ AFRAME.registerComponent('window', {
     await AFRAME.utils.require(this.dependencies)
     if( !this.el.dom ) return console.error('window element requires dom-component as dependency')
 
-    const close = () => {
-      let e = {halt:false}
-      this.el.emit('window.onclose',e)
-      if( e.halt ) return true 
-      this.data.dom.style.display = 'none';
-      if( this.el.parentNode ) this.el.remove() //parentElement.remove( this.el )
-      this.data.dom.parentElement.remove()
-      return false
-    }
-    this.el.addEventListener('close', () => {
-      close()
-      this.el.winbox.close()
-    })
-
     this.el.dom.style.display = 'none'
     let winbox = this.el.winbox = new WinBox( this.data.title, {
-      class: this.data.class,
       height:this.data.height,
       width:this.data.width,
       x: this.data.x,
@@ -77,47 +34,33 @@ AFRAME.registerComponent('window', {
       id:  this.data.uid || String(Math.random()).substr(4), // important hint for html-mesh
       root: this.data.attach || document.body,
       mount: this.data.dom,
-      max: this.data.max,
-      min: this.data.min,
       onresize: () => this.el.emit('window.onresize',{}),
       onmaximize: () => this.el.emit('window.onmaximize',{}),
-      oncreate: (e) => {
+      oncreate: () => {
         this.el.emit('window.oncreate',{})
         // resize after the dom content has been rendered & updated 
         setTimeout( () => {
-          if( !this.data.max ) winbox.resize( this.el.dom.offsetWidth+'px', this.el.dom.offsetHeight+'px' )
+          winbox.resize( this.el.dom.offsetWidth+'px', this.el.dom.offsetHeight+'px' )
+          setTimeout( () => this.el.setAttribute("html",`html:#${this.data.uid}; cursor:#cursor`), 1000)
           // hint grabbable's obb-collider to track the window-object
           this.el.components['obb-collider'].data.trackedObject3D = 'components.html.el.object3D.children.0'
           this.el.components['obb-collider'].update()
         },1000)
       },
-      onclose: close
-       
+      onclose: () => {
+        let e = {halt:false}
+        this.el.emit('window.onclose',e)
+        if( e.halt ) return true 
+        this.data.dom.style.display = 'none';
+        this.data.dom.parentElement.remove()
+        debugger
+        this.el.parentElement.remove( this.el )
+        return false
+      },
     });
     this.data.dom.style.display = '' // show
 
     this.el.setAttribute("grabbable","")
 
-    if( this.el.object3D.position.x == 0 && 
-        this.el.object3D.position.y == 0 && 
-        this.el.object3D.position.z == 0 ){ // position next to previous window
-      var els = [...document.querySelectorAll('[window]')]
-      if( els.length < 2 ) return
-      let current = els[ els.length-1 ]
-      let last    = els[ els.length-2 ]
-      AFRAME.utils.positionObjectNextToNeighbor( current.object3D , last.object3D, 0.02 )
-    }
-  },
-
-  show: function(state){
-    this.el.dom.closest('.winbox').style.display = state ? '' : 'none'
   }
 })
-
-AFRAME.utils.positionObjectNextToNeighbor = function positionObjectNextToNeighbor(object, lastNeighbor = null, margin ){
-  // *FIXME* this could be more sophisticated :)
-  object.position.x = lastNeighbor.position.x + margin 
-  object.position.y = lastNeighbor.position.y - margin 
-  object.position.z = lastNeighbor.position.z + margin
-
-}

com/xd.js

@@ -0,0 +1,111 @@
+AFRAME.registerComponent('xd', {
+  schema: {
+    foo: { type:"string"}
+  },
+
+  init: function () {
+    if( Object.keys(this.el.components).length > 1 ) return // we collect a-entities which wish to be toggled in this.showElements()
+
+    this.el.sceneEl.addEventListener('enter-vr',() => this.toggle(true) )
+    this.el.sceneEl.addEventListener('exit-vr', () => this.toggle(false) )
+    this.el.sceneEl.addEventListener('2D', () => this.showElements(false) )
+    this.el.sceneEl.addEventListener('3D', () => this.showElements(true) )
+
+    // toggle immersive with ESCAPE
+    document.body.addEventListener('keydown', (e) => e.key == 'Escape' && this.toggle() )
+
+    document.head.innerHTML += `<style type="text/css">
+      .XR #toggle_overlay{
+        background: transparent;
+        color: #3aacff;
+      }
+
+      .XR #overlay{
+        visibility: hidden;
+      }
+    </style>`
+
+    this.events.launcher = () => this.toggle()
+  },
+
+  showElements: function(state){
+    let els = [...document.querySelectorAll('[xd]')]
+    els     = els.filter( (el) => el != this.el ? el : null ) // filter out self
+    els.map( (el) => el.setAttribute("visible", state ? "true" : false  ) )
+  },
+
+  // draw a button so we can toggle apps between 2D / XR
+  toggle: function(state){
+    state = state != undefined ? state : state || !document.body.className.match(/XR/)
+    document.body.classList[ state ? 'add' : 'remove'](['XR'])
+    AFRAME.scenes[0].emit( state ? '3D' : '2D')
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "XD",
+    "name": "2D/3D switcher",
+    "icons": [],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "category":"system",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "use ESC-key to toggle between 2D / 3D",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application
+
+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.XD = function(){
+  return document.body.classList.contains('XR') ? '3D' : '2D'
+}
+
+
+AFRAME.utils.XD.getPositionInFrontOfCamera = function(distance){
+  const camera = AFRAME.scenes[0].camera;
+  let pos = new THREE.Vector3()
+  let direction = new THREE.Vector3();
+  // Get camera's forward direction (without rotation)
+  camera.getWorldDirection(direction);
+  camera.getWorldPosition(pos)
+  direction.normalize();
+  // Scale the direction by 1 meter
+  if( !distance ) distance = 1.5
+  direction.multiplyScalar(distance);
+  // Add the camera's position to the scaled direction to get the target point
+  pos.add(direction);
+  return pos
+}

com/xrfragments.js

@@ -0,0 +1,81 @@
+AFRAME.registerComponent('xrfragments', {
+  schema: { 
+    url: { type:"string"}
+  },
+
+  init: function () {  
+  },
+
+  events:{
+
+    launcher: async function(){
+      let url = prompt('enter URL to glb/fbx/json/obj/usdz asset', 'https://xrfragment.org/index.glb')
+      if( !url ) return
+      await AFRAME.utils.require({
+        xrfragments: "https://xrfragment.org/dist/xrfragment.aframe.js",
+      }) 
+
+      // remove objects which are marked to be removed from scene (with noxrf)
+      let els = [...document.querySelectorAll('[noxrf]') ]
+      els.map( (el) => el.remove() )
+
+      if( !this.el.getAttribute("xrf") ){
+        this.el.setAttribute("xrf", url )
+        let ARbutton = document.querySelector('.a-enter-ar-button')
+        if( ARbutton ){  
+          ARbutton.addEventListener('click', () => {
+            AFRAME.XRF.reset() 
+          })
+        }
+      }else AFRAME.XRF.navigator.to(url)
+    }
+
+  },
+
+  manifest: { // HTML5 manifest to identify app to xrsh
+    "short_name": "XRF",
+    "name": "XR Fragment URL",
+    "icons": [ ],
+    "id": "/?source=pwa",
+    "start_url": "/?source=pwa",
+    "background_color": "#3367D6",
+    "display": "standalone",
+    "scope": "/",
+    "theme_color": "#3367D6",
+    "shortcuts": [
+      {
+        "name": "What is the latest news?",
+        "cli":{
+          "usage":  "helloworld <type> [options]",
+          "example": "helloworld news",
+          "args":{
+            "--latest": {type:"string"}
+          }
+        },
+        "short_name": "Today",
+        "description": "View weather information for today",
+        "url": "/today?source=pwa",
+        "icons": [{ "src": "/images/today.png", "sizes": "192x192" }]
+      }
+    ],
+    "description": "Hello world information",
+    "screenshots": [
+      {
+        "src": "/images/screenshot1.png",
+        "type": "image/png",
+        "sizes": "540x720",
+        "form_factor": "narrow"
+      }
+    ],
+    "help":`
+Helloworld application 
+
+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.
+    `
+  }
+
+});
+