SpaSca : open SCAffolding to SPAcially and textualy explore interfaces https://fabien.benetou.fr/pub/home/future_of_text_demo/engine/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
text-code-xr-engine/index.html

123 lines
6.5 KiB

<!DOCTYPE html>
2 years ago
<html>
<title>SpaSca : Spatial Scaffolding</title>
2 years ago
<head>
<!-- Suggestions? https://git.benetou.fr/utopiah/text-code-xr-engine/issues/ -->
<script src='dependencies/aframe.offline.min.js'></script>
<script src="dependencies/a-console.js"></script>
<script src='dependencies/aframe-troika-text.min.js'></script>
<script src='dependencies/webdav.js'></script>
<script src='jxr-core.js?1234'></script>
<script src='jxr-postitnote.js?13235'></script>
2 years ago
</head>
<body>
<script>
/* potential paths, from the most traditional to the most exotic
https://developer.mozilla.org/en-US/docs/Glossary/Scope
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy
https://tc39.es/ecma262/#sec-code-realms
https://tc39.es/proposal-shadowrealm/
this starts to look like an "excuse" though for complexity and/or exploring novelty of the language itself and its execution environment
the goal remains to
efficiently modify the current environment
which from experience requires
affordances (assumed here as solved, via e.g keyboard typing, <a-console>, jxr, etc) to code
a safe environment
thus allowing e.g rollback
so far jxr/javascript is executed within a try { eval() } block as
alternatively eval?.( generatedCodeToEval )
// forcing global scope but fails, at least result is undefined in that scope
in code-generation branch
also in nodal branch
this is currently not supported
namely the context is not saved and can't be replaced back after a failure
one has to exit XR (if the bug or new behavior is breaking)
reload the page
until now refreshing has been the way to rollback
some explorations via undo in the speech branch
*/
AFRAME.registerComponent('realm', {
// beyond the visual and self-editable aspect of https://git.benetou.fr/utopiah/text-code-xr-engine/src/branch/scaffolding generalizing it and make it, hopefully, safe.
})
AFRAME.registerComponent('scaffolding', {
init: function(){
console.log(this.el.innerHTML)
// should become editable then saved back/replaced (or cloned)
// could do a test with switching to wireframe or grey color
// BT keyboard does get focus on Vision Pro too
// enter key does not seem to work though
// it does work on desktop tso should console.log() what keypresses are actually received
// Meta+Enter does work though! (on Corne-ish Zen it's Linux key with Enter)
// still prepare jxr regexes
// e.g el = document.querySelector("[scaffolding]")l el.innerHTML = el.innerHTML.replaceAll("<a-cylinder", "<a-cylinder wireframe=true")
// block based too
// responsive pedagogical way, as discuss with Adam particularly, metaphor of the electrician and consecutive pannels with limited access
// put this.el.innerHTML on a plane, e.g 1x1 black plane at back of current scaffolding
// arrow keys (on physical keyboard) move through that, initially changing color or current char
// use a font that faciliates positionning
// as done before, make the carret, e.g | directly in the content text itself
// on save (ESC? to define and test), remove carret then save back to this.el.innerHTML
}
});
let page = "Wiki.VirtualRealityInterface";
let pageFromParam = AFRAME.utils.getUrlParameter('page')
if (pageFromParam) page = pageFromParam
setTimeout( _ => {
Array.from( document.querySelectorAll("[value='"+page+"']") ).map( n =>
n.setAttribute("onreleased", "console.log('dropped, should toggle display children,"+n.id+"')"));
Array.from( document.querySelectorAll("[value='"+page+"']>a-sphere") ).map( n => n.setAttribute("color", "purple"))
}, 5000)
</script>
<div style='position:fixed;z-index:1; top: 0%; left: 0%; border-bottom: 70px solid transparent; border-left: 70px solid #eee; '>
<a href="https://git.benetou.fr/utopiah/text-code-xr-engine/issues/">
<img style='position:fixed;left:10px;' title='code repository' src='gitea_logo.svg'>
</a>
</div>
<a-scene startfunctions onemptypinch="onHoveredTeleport()">
9 months ago
<a-gltf-model hide-on-enter-ar="" id="environment" src="../content/CubeRoom.glb" rotation="0 -90 0" position="0 0 1" scale="" ></a-gltf-model>
<!-- Cube Room by Anonymous [CC-BY] via Poly Pizza -->
1 year ago
<a-entity id="rig">
<a-entity id="player" networked="template:#avatar-template;attachTemplateToLocal:false;"
9 months ago
hud camera look-controls wasd-controls position="0 1.6 0">
<a-entity cursor position="0 0 -1"
geometry="primitive: ring; radiusInner: 0.005; radiusOuter: 0.01"
material="color: black; shader: flat; opacity:.05;"
></a-entity>
1 year ago
</a-entity>
1 year ago
<a-entity id="rightHand" pinchprimary hand-tracking-controls="hand: right;"></a-entity>
<a-entity id="leftHand" pinchsecondary wristattachsecondary="target: #box" hand-tracking-controls="hand: left;"></a-entity>
<a-console position="2 2 0" rotation="0 -45 0" font-size="34" height=1 skip-intro=true></a-console>
</a-entity>
1 year ago
<a-box pressable start-on-press id="box" scale="0.05 0.05 0.05" color="pink"></a-box>
9 months ago
<a-troika-text value="SpaSca : Spatial Scaffolding" anchor="left" outline-width="5%" font="../content/ChakraPetch-Regular.ttf" position="-3 5 -2"
scale="3 3 3" rotation="80 0 0" troika-text="outlineWidth: 0.01; strokeColor: #ffffff" material="flatShading: true; blending: additive; emissive: #c061cb"></a-troika-text>
<a-sky hide-on-enter-ar color="lightgray"></a-sky>
2 years ago
<a-troika-text anchor=left target value="instructions : \n--right pinch to move\n--left pinch to execute" position="0 0.65 -0.2" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left value="jxr location.reload()" target position=" -0.3 1.30 0" rotation="0 40 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left value="jxr makeAnchorsVisibleOnTargets()" target position=" -0.3 1.20 0" rotation="0 40 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-box realm width=10 height=6 depth=10 wireframe="true" position="10 3 1"><a-troika-text scale="10 10 10" value="realm West"></a-troika-text></a-box>
<a-box realm width=10 height=6 depth=10 wireframe="true" position="-10 3 1"><a-troika-text scale="10 10 10" value="realm East"></a-troika-text></a-box>
<a-box realm width=10 height=6 depth=10 wireframe="true" position="0 3 11"><a-troika-text scale="10 10 10" value="realm North"></a-troika-text></a-box>
<a-box realm width=10 height=6 depth=10 wireframe="true" position="0 3 -11"><a-troika-text scale="10 10 10" value="realm South"></a-troika-text></a-box>
2 years ago
</a-scene>
</body>
</script>
2 years ago
</html>