Live WebXR demo
https://companion.benetou.fr/index.html
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.
123 lines
3.8 KiB
123 lines
3.8 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<script src="https://fabien.benetou.fr/pub/home/future_of_text_demo/engine/dependencies/webdav.js"></script>
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<div id=content></div>
|
|
|
|
<script>
|
|
// insert screenshots (could probably do the same way, i.e. filereader then webdav upload
|
|
const webdavURL = "https://webdav.benetou.fr";
|
|
const subdirWebDAV = "/fotsave/fot_sloan_companion_public/"
|
|
var webdavClient = window.WebDAV.createClient(webdavURL)
|
|
const hmdURL = "https://hmd.link/?https://companion.benetou.fr"
|
|
|
|
// const eventSourceConverted = new EventSource( `https://ntfy.benetou.fr/convertedwebdav/sse` )
|
|
// to use for live updates
|
|
|
|
async function getContent(){
|
|
let rootEl = document.getElementById("content")
|
|
const contents = await webdavClient.getDirectoryContents(subdirWebDAV);
|
|
// consider instead search https://github.com/perry-mitchell/webdav-client#search
|
|
contents.filter(f => f.basename.endsWith('demo_q1.json'))
|
|
.map(a => {
|
|
fetch(a.basename).then( r => r.json() ).then( r => {
|
|
r.content.filter( c => c.name ).map( c => {
|
|
let h2 = document.createElement("h2")
|
|
h2.innerText = c.name
|
|
rootEl.appendChild(h2)
|
|
if ( c.screenshot ){
|
|
let img = document.createElement("img")
|
|
img.src = c.screenshot
|
|
img.style.height = "200px"
|
|
rootEl.appendChild(img)
|
|
}
|
|
if ( c.description ){
|
|
let h3 = document.createElement("h3")
|
|
//h3.innerText = c.description //.replace()
|
|
h3.innerHTML = c.description.replace(/(.*) (http.*)/,'$1 <a href="$2">$2</a>').replaceAll('\n','<br>')
|
|
// could be innerHTML instead
|
|
// should make link clickable
|
|
rootEl.appendChild(h3)
|
|
}
|
|
if ( c.video ){
|
|
let ul = document.createElement("ul")
|
|
rootEl.appendChild(ul)
|
|
let li = document.createElement("li")
|
|
let link = document.createElement("a")
|
|
link.href = c.video
|
|
link.innerText = "video extract"
|
|
ul.appendChild(li)
|
|
link.target = "_blank"
|
|
li.appendChild(link)
|
|
}
|
|
if (c.usernames) {
|
|
let ul = document.createElement("ul")
|
|
rootEl.appendChild(ul)
|
|
|
|
c.usernames.map( h => {
|
|
let li = document.createElement("li")
|
|
let link = document.createElement("a")
|
|
link.href = "/index.html?username="+h
|
|
link.innerText = "link"
|
|
li.appendChild(link)
|
|
let spanEl = document.createElement("span")
|
|
spanEl.innerText = " "
|
|
li.appendChild(spanEl)
|
|
let linkHMD = document.createElement("a")
|
|
linkHMD.href = hmdURL + "/index.html?username="+h
|
|
linkHMD.target = "_blank"
|
|
linkHMD.innerText = "(open on other device)"
|
|
li.appendChild(linkHMD)
|
|
ul.appendChild(li)
|
|
})
|
|
}
|
|
|
|
let hr = document.createElement("hr")
|
|
rootEl.appendChild(hr)
|
|
})
|
|
})
|
|
})
|
|
}
|
|
|
|
getContent()
|
|
</script>
|
|
|
|
<div id=comments>
|
|
|
|
<br>
|
|
<br>
|
|
</div>
|
|
|
|
<h3>
|
|
ideas :
|
|
</h3>
|
|
|
|
<ul>
|
|
<li>integrate better live messages (via ?allowNtfyFeedbackHUD=true , e.g. https://companion.benetou.fr/index.htm?allowNtfyFeedbackHUD=true )
|
|
<li>JSON editing, either as-is or via PmWiki (including raw text within JSON) or with CodeMirror as editor (just text area is plain text should be enough
|
|
<li>feedback intertwined per demo (based on screenshot/audio recording demos)
|
|
<li>richer text rendering
|
|
<li>couple live messages with inView(targetSelector)
|
|
</ul>
|
|
|
|
<h3>
|
|
done :
|
|
</h3>
|
|
|
|
<ul>
|
|
<li>hmd.link/? to share directly over same local network
|
|
<li>link as clickable (right now only trailing ones, and 1 link per description maximum)
|
|
<li>source JSON URL https://webdav.benetou.fr/fotsave/fot_sloan_companion_public/demo_q1.json
|
|
<li>alternative descriptions https://futuretextlab.info/1st-quarter/ (more verbose but static)
|
|
<li>mobile view
|
|
<li>linked to editor : https://companion.benetou.fr/demos_editor_example.html
|
|
</ul>
|
|
|
|
</body>
|
|
</html>
|
|
|