work in progress [might break]
This commit is contained in:
parent
78c5d164a2
commit
86d1102872
|
@ -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",{
|
||||
|
|
|
@ -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.
|
||||
`
|
||||
}
|
||||
|
||||
});
|
||||
|
|
@ -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.
|
||||
`
|
||||
}
|
||||
|
||||
});
|
||||
|
|
@ -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'
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue