work in progress [might break]
/ mirror_to_github (push) Successful in 19s Details
/ test (push) Successful in 3s Details

This commit is contained in:
Leon van Kammen 2024-05-10 08:38:24 +00:00
parent 78c5d164a2
commit 86d1102872
4 changed files with 257 additions and 6 deletions

View File

@ -1,6 +1,6 @@
AFRAME.registerComponent('helloworld-iframe', {
schema: {
foo: { type:"string"}
url: { type:"string"}
},
init: function(){},
@ -36,16 +36,18 @@ AFRAME.registerComponent('helloworld-iframe', {
// reactive events for this.data updates
myvalue: function(e){ /*this.el.dom.querySelector('b').innerText = this.data.myvalue*/ },
init: function(){
alert("ja")
},
ready: 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 )
},
launcher: function(){
console.log("this.el.dom iframe has been added to DOM")
let URL = prompt('enter URL to display','https://fabien.benetou.fr/Wiki/Wiki')
let URL = this.data.url || prompt('enter URL to display','https://fabien.benetou.fr/Wiki/Wiki')
if( !URL ) return
this.el.dom.querySelector('iframe').src = URL
new WinBox("Hello World",{

111
app/load.js Normal file
View File

@ -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.
`
}
});

138
app/save.js Normal file
View File

@ -0,0 +1,138 @@
AFRAME.registerComponent('save', {
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.save()
},
},
save: function(){
let l = document.querySelector("#left-hand")
let r = document.querySelector("#right-hand")
l.remove()
r.remove()
// *TODO* dont crash on hands
this.inlineFiles()
.then( () => this.download(document.documentElement.innerHTML,"xrsh.html") )
.catch(console.error)
},
download: function(content, filename, contentType){
const a = document.createElement('a');
const file = new Blob([document.documentElement.innerHTML], {type: "text/html"});
a.href= URL.createObjectURL(file);
a.download = filename
a.click();
URL.revokeObjectURL(a.href);
},
inlineFiles: function(){
let p = []
let tags = [ ...document.querySelectorAll('script'),
...document.querySelectorAll('link')
]
tags.map( (el) => {
let remoteFile = el.src || el.href
if( remoteFile ){
p.push( new Promise((resolve,reject) => {
fetch( remoteFile )
.then( (res) => res.text() )
.then( (text) => {
switch( el.tagName ){
case 'LINK': el2 = document.createElement('style')
el2.setAttribute("type","text/css")
el2.setAttribute("_href", el.href )
el2.innerHTML = text
el.parentNode.appendChild(el2)
el.remove()
break;
case 'SCRIPT': el.innerHTML = text
el.setAttribute("_src", el.src)
el.removeAttribute("src")
break;
}
resolve()
})
.catch(reject)
}))
}
})
return Promise.all(p)
},
manifest: { // HTML5 manifest to identify app to xrsh
"short_name": "Hello world",
"name": "Hello world",
"icons": [
{
"src": "https://css.gg/arrow-down-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.
`
}
});

View File

@ -24,7 +24,7 @@ AFRAME.registerComponent('spatialize', {
this.el.sceneEl.addEventListener('launched',(e) => {
console.dir(e)
let appEl = e.detail.el.dom
if( appEl.style.display != 'none' && appEl.innerHTML ){
if( appEl.style && appEl.style.display != 'none' && appEl.innerHTML ){
this.btn.style.display = '' // show button
}
})
@ -38,7 +38,7 @@ AFRAME.registerComponent('spatialize', {
// component events
ready: function(e){
this.btn.style.display = 'none'
//this.btn.style.display = 'none'
this.btn.style.background = 'var(--xrsh-primary)'
this.btn.style.color = '#FFF'
},