meet.js #11 Białystok
@maciejkorsan
Maciek Korsan
Maciek @ polarbits
Maciek @ Korsan Studio
To jest lightning talk. Nie znam dobrze technologii, o której opowiem, więc proszę - nie zadawajcie głupich i trudnych pytań bo na nie zwyczajnie nie odpowiem. Wszystko co dziś ode mnie usłyszycie bazuje na moim kilkugodzinnym doświadczeniu. Serio to czytasz? Musisz się mocno nudzić. To czytaj dalej. Kto Ci zabroni? Chyba ja (jak zmienię slajd). Fajnie, że był z nami dzisiaj Wawrzyk - miały być wielkie brawa dla niego, ale sobie poszedł :(. Czas na suchara: Co omawia biolog? Omawialiście. He he. Wracając, tak naprawdę nie wiem nic o VR, ale i tak Wam opowiem. Bo mogę. Bo Hubert mnie poprosił. A jemu się nie odmawia.
Editor’s Draft, 9 November 2016
A-TEAM
WebVR content-creation framework by Mozilla
A-Frame is an open-source web framework for building virtual reality experiences. We can build VR web pages that we can walk inside with just HTML. Under the hood, it is a three.js framework that brings the entity-component-system pattern to the DOM.
<a-scene>
<a-box position="-1 0.5 1" rotation="0 45 0"
width="1" height="1" depth="1" color="#4CC3D9">
</a-box>
<a-sky color="#0000FF"></a-sky>
<a-entity position="0 0 3.8">
<a-camera></a-camera>
</a-entity>
</a-scene>
Hello world
<a-entity geometry="primitive: sphere" material="color: red">
<a-sphere color="#FF0000"></a-box>
Element
Encja
<a-entity position="0 0 3.8">
<a-camera>
<a-cursor color="#4CC3D9" fuse="true" timeout="10"></a-cursor>
</a-camera>
</a-entity>
<script>
AFRAME.registerComponent('set-sky', {
schema: {default: ''},
init() {
const sky = document.querySelector('a-sky');
this.el.addEventListener('click', () => {
sky.setAttribute('src', this.data);
});
}
});
</script>
<a-sphere color="#F44336" radius="1" position="-4 2 0"
set-sky="https://c3.staticflickr.com/2/1475/26239222850_cabde81c39_k.jpg">
</a-sphere>
Przeglądarka
FOLLOW ME: @maciejkorsan