From b71562cca144f6926f87d41aac9213da9e4a19d7 Mon Sep 17 00:00:00 2001 From: Fabien Benetou Date: Thu, 18 May 2023 16:35:48 +0200 Subject: [PATCH] basis --- index.html | 103 +++++++++++++++++++++++++++-------------------------- 1 file changed, 52 insertions(+), 51 deletions(-) diff --git a/index.html b/index.html index bc5b0be..ec40398 100644 --- a/index.html +++ b/index.html @@ -2202,7 +2202,7 @@ function highlight(code = `console.log("Here is your code."); var x = 5;`, langu } document.body.addEventListener( "highlighterready", (e) => { - fetch("colorme.js").then(r=>r.text()).then( page => { addCodeEditor( page ) }) + //fetch("colorme.js").then(r=>r.text()).then( page => { addCodeEditor( page ) }) }, false); function startExperience(){ @@ -2223,7 +2223,8 @@ let codeEditor = { lengthWindowRange: 20, scrollInterval: null, currentlyDisplayedText: "", - caret: null + caret: null, + language: null, } function nextLineCodeEditor(lines=1){ // can be negative to scroll up @@ -2232,8 +2233,7 @@ function nextLineCodeEditor(lines=1){ // can be negative to scroll up let content=codeEditor.page.split("\n").slice(codeEditor.line,codeEditor.line+codeEditor.lengthWindowRange).join("\n"); codeEditor.currentlyDisplayedText=content codeEditor.element.setAttribute("troika-text", {value: content}) - codeEditor.element.setAttribute("troika-text", {colorRanges: highlight(content, language='javascript')}) - // should respect language set, can be empty + if (codeEditor.language) codeEditor.element.setAttribute("troika-text", {colorRanges: highlight(content, language='javascript')}) let gutterEl = document.getElementById("leftgutter") if (gutterEl){ let lineNumbers = "\n" @@ -2381,8 +2381,7 @@ function updateCodeEditorWithContent(content){ if (!codeEditor.element) return codeEditor.currentlyDisplayedText=content codeEditor.element.setAttribute("troika-text", {value: content}) - codeEditor.element.setAttribute("troika-text", {colorRanges: highlight(content, language='javascript')}) - // should respect language set, can be empty + if (codeEditor.language) codeEditor.element.setAttribute("troika-text", {colorRanges: highlight(content, language='javascript')}) } function addBackdropToTroikaElement( el ){ @@ -2531,7 +2530,20 @@ function getNumberOfLinesFromCodeEditor(){ function addCodeEditor(page="jxr console.log('hello world')", language="javascript", position="-.5 1.6 -.7", name="codeditor" ){ // could also add empty but with column and row for sizing // for now supporting only 1 code editor, despite the name parameter - codeEditor.page = page + + let forcedLines = '' + const width = 50 + let pos = 0 + let content = page + while ( pos < page.length ){ + let potentialine = content.slice(pos, pos+width) + console.log(potentialine.lastIndexOf(' ') ) + forcedLines += potentialine.trim() + '\n' + pos+=width +// should check for caesure + } + + codeEditor.page = forcedLines //.slice(0,-1) // remove trailing newline codeEditor.line = codeEditor.startWindowRange let numberOfLines = getNumberOfLinesFromCodeEditor() if (numberOfLines 0 && language != "none") codeEditor.element.setAttribute("troika-text", {colorRanges: highlight(content, language)}) + codeEditor.element.setAttribute("rotation", "30 0 0") + if (language?.length > 0 && language != "none") { + codeEditor.element.setAttribute("troika-text", {colorRanges: highlight(content, language)}) + codeEditor.language = language + } addBackdropToTroikaElement( codeEditor.element ) - addGuttersToTroikaElement( codeEditor.element ) + //addGuttersToTroikaElement( codeEditor.element ) let scrollbarPicked = false let previousPosition @@ -3008,27 +3025,19 @@ AFRAME.registerComponent('collider-check', { } }); -AFRAME.registerComponent('startfunctions', { - init: function () { - // load a rigger avatar from e.g RPM with a basic interaction script and few pre-recorded sentence with model details, e.g speaker id - // bare minimum in complexity and weight to explain itself and kickstart the process - // rely on jxr and hand interactions - // add eye and head following, few basic animations (pre-recorded or not) e.g nodding or moving - // see the inspection mechanism written - // add the bones visible - // wireframe all with different colours and add geometry on bones and all positions, attached even - // see past branches - // mannequin - // stt - // could provide predetermined behavior e.g blinked, nodding, delayed tracking, etc - // a kind of phase of "populating" what capabilities are available, a bit like Metzinger's self model - } -}) - +// should generalize to selector, like pushDownClass and related +function tiltUpId(id){ tiltId(id, 0.1) } +function tiltDownId(id){ tiltId(id, -0.1) } +function tiltId(id, value){ + document.getElementById(id).object3D.position.y+=value; + document.getElementById(id).object3D.rotation.x+=value; +} // used for testing AFRAME.registerComponent('startfunctions', { init: function () { + fetch( 'https://webdav.benetou.fr/fot-demo-day/mobydick-extract.txt').then(r=>r.text()).then( page => { addCodeEditor( page, '', '-0.22 1.4 -.4' ) }) + // should become a component instead //startExperience() //doublePinchToScale() //emptyPinchToMove() @@ -3046,8 +3055,7 @@ AFRAME.registerComponent('startfunctions', { + toolbox disable-components-via-url enable-components-via-url NOcommands-from-external-json> - @@ -3082,37 +3088,32 @@ AFRAME.registerComponent('startfunctions', { - - - - + + + + - + + - - - - - - - + + + + + + + + + + --> - - - - - - - -