Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
/* examples of usage :
slides.setupSlides() // load and layout slides with links
slides.nextSlide() // switch to the next slide (loops)
slides.removeAllMedia() // remove all slides
slides.startAutoPresent() // move from slide to slide in the allotated time then drops them all
slides.dropAllContent()
*/
var slides = {
timer:20000, //ms
links:[],
loaded:[],
slideScale: 0.9,
linkScale: 0.5,
currentSlide: 0,
cleanUpSlides,
nextSlide,
setupSlides,
dropAllContent,
startAutoPresent,
presenting:false,
autoPresent: null,
removeAllMedia,
targetRoom: 'https://hubs.mozilla.com/bxrsafy/awe-nite-berlin-6/'
}
slides.content = [
// can have 3D objects per slide but also global e.g. path or starting arrow
{title:'Fabien Benetou', url:'https://fabien.benetou.fr', img:'https://images.unsplash.com/photo-1550052558-11de18b04282?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1950&q=80'},
{title:'@ European Parliament Innovation service', url:'https://twitter.com/utopiah/status/1262788181184974854', img:'https://twitter.com/i/status/1262788181184974854'},
{title:'@ UNICEF Innovation Fund', url:'https://twitter.com/theentreflaneur/status/1088831930261475329', img:'https://pbs.twimg.com/media/DxxO25_X4AEJ5qW?format=jpg&name=large'},
{title:'@ Mozilla Tech Speakers', url:'https://twitter.com/mozTechSpeakers/status/1168578445812436992/',img:'https://pbs.twimg.com/media/EDefouMUwAAIUtA?format=jpg&name=4096x4096'},
{title:'PIM motivation', url: 'https://fabien.benetou.fr/Wiki/VirtualRealityInterface', img: 'https://pbs.twimg.com/media/EYdm6AqXQAEfl4_?format=jpg&name=4096x4096'},
{title:'scripting in Hubs 1', url:'https://twitter.com/utopiah/status/1244968857690877952', img:'https://pbs.twimg.com/media/EWxeYghWoAc1pRI?format=jpg&name=4096x4096'},
{title: 'nodejs bot 2', url:'https://t.co/PWqU6oDUk3?amp=1', img:'https://pbs.twimg.com/media/EWxfIoFXQAU4iW2?format=jpg&name=large'},
{title:'puppeter', url:'https://github.com/zach-capalbo/hubs-client-bot', img:'https://twitter.com/i/status/1261677410342354944'},
{title:'local client 3', url:'', img:'https://pbs.twimg.com/media/EWxfL_eX0AEWiY1?format=jpg&name=large'},
{title:'hubs cloud welcome 4', url:'', img:'https://pbs.twimg.com/media/EWxfMwqWkAAwRzI?format=jpg&name=4096x4096'},
{title:'setting up your Hubs Cloud instance', url:'https://twitter.com/utopiah/status/1263352654195015680', img:'https://pbs.twimg.com/media/EYhTythXgAATolz?format=jpg&name=large'},
{title:'Lessons learned', url:'https://fabien.benetou.fr/Tools/Hubs', img:'https://twitter.com/i/status/1260475760747347973'},
{title:'... now what? Build. Explore. Share.', url:'https://en.wikipedia.org/wiki/Comparison_of_free_and_open-source_software_licences', img:'https://moviesdrop.com/wp-content/uploads/2013/02/The-Thirteenth-Floor-1999.jpg'},
{title:'(slides)', url:'https://gist.github.com/Utopiah/b4bdcd5422cc8c12b97fac3776955cb2', img:'https://gist.github.com/Utopiah/b4bdcd5422cc8c12b97fac3776955cb2'},
// convert -size 1024x128 -fill black -font Helvetica caption:"a lot more text" text.png; gwenview text.png
]
slides.additional = [
'https://twitter.com/utopiah/status/1257410087666225158'
]
//---- from Hubs utils ----------------------------------------------
// https://gist.github.com/Utopiah/1cfc123239fa2994569fc7c5c60b2928/
var hubs_utils = { loadAssetsFromURLs }
function loadAssetsFromURLs(URLs){
var backupImgSrc = 'https://hubs-proxy.com/https://fabien.benetou.fr/pub/home/AWE_Berlin/'
var elements = []
var i = 1
for (var url of URLs){
var el = document.createElement("a-entity")
AFRAME.scenes[0].appendChild(el)
el.setAttribute("media-loader", { src: backupImgSrc+(i++)+'.jpg', fitToBox: true, resolve: false })
el.setAttribute("networked", { template: "#interactable-media" } )
elements.push(el)
}
return elements
}
//---- from Hubs utils ----------------------------------------------
function nextSlide(){
slides.loaded[slides.currentSlide].object3D.scale.setScalar(slides.slideScale)
//slides.links[slides.currentSlide].object3D.scale.setScalar(slides.linkScale)
if (slides.currentSlide<slides.loaded.length-1){
slides.currentSlide++
} else {
slides.currentSlide = 0
}
slides.loaded[slides.currentSlide].object3D.scale.addScalar(slides.slideScale)
//slides.links[slides.currentSlide].object3D.scale.addScalar(slides.linkScale)
}
function setupSlides(){
slides.currentSlide = 0
slides.loaded = hubs_utils.loadAssetsFromURLs(slides.content.map(s => s.img))
//slides.links = hubs_utils.loadAssetsFromURLs(slides.content.map(s => s.url))
var l = slides.content.length
slides.loaded.map( (s,i) => {
s.object3D.position.y = 2
s.object3D.position.x = 1*i - 7 + 0.5
s.object3D.position.z = (i - l/2) * (i - l/2) / 20 - 3
//s.setAttribute("pinnable", {pinned:true})
})
/*
slides.links.map( (s,i) => {
s.object3D.position.y = 1.1
s.object3D.position.x = 1*i - 7 + 0.5
s.object3D.position.z = (i - l/2) * (i - l/2) / 20 - 3
s.object3D.scale.setScalar(slides.linkScale)
s.setAttribute("pinnable", {pinned:true})
})*/
slides.loaded[slides.currentSlide].object3D.scale.addScalar(slides.slideScale)
//slides.links[slides.currentSlide].object3D.scale.addScalar(slides.linkScale)
}
function cleanUpSlides(){
//slides.links.map( s => { s.setAttribute("pinnable", {pinned:false}); s.remove()} )
slides.loaded.map( s => { s.setAttribute("pinnable", {pinned:false}); s.remove()} )
//slides.links = []
slides.loaded = []
}
function dropAllContent(){
console.log("Time's up!")
slides.loaded.map( s => {
NAF.utils.getNetworkedEntity(s).then(networkedEl => {
const mine = NAF.utils.isMine(networkedEl)
if (!mine) var owned = NAF.utils.takeOwnership(networkedEl)
networkedEl.setAttribute("body-helper", {type:"dynamic", mass:1, gravity:{x:0,y:-9.8,z:0} })
})
})
//slides.links.map( s => s.setAttribute("body-helper", {type:"dynamic", mass:1, gravity:{x:0,y:-9.8,z:0} }) )
slides.presenting = false
if (slides.autoPresent) clearInterval(slides.autoPresent)
}
function removeAllMedia(){
for (var el of document.querySelectorAll("[media-loader]")){
var match = el.components["media-loader"].attrValue.src.match('fabien.benetou.fr')
if (match && match.length>0){
NAF.utils.getNetworkedEntity(el).then(networkedEl => {
const mine = NAF.utils.isMine(networkedEl)
if (!mine) var owned = NAF.utils.takeOwnership(networkedEl)
networkedEl.components["set-unowned-body-kinematic"].setBodyKinematic()
networkedEl.setAttribute("pinnable", {pinned:false})
networkedEl.remove()
})
}
}
}
function startAutoPresent(){
if (slides.loaded.length == 0) slides.setupSlides()
slides.presenting = true
slides.autoPresent = setInterval( _ => {
slides.nextSlide()
}, slides.timer / slides.loaded.length)
setTimeout( slides.dropAllContent, slides.timer)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment