Skip to content

Instantly share code, notes, and snippets.

@thangman22

thangman22/a-frame.html

Created October 4, 2017 08:47
Show Gist options
  • Save thangman22/882488eaa6f7dde60036043f51d088a0 to your computer and use it in GitHub Desktop.
Save thangman22/882488eaa6f7dde60036043f51d088a0 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
a-frame.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
<script>
AFRAME.registerComponent('change-sky', {
schema: {
skyUrl : {default: 'chess-world.jpg'}
},
init: function () {
let data = this.data;
let el = this.el;
let sky = document.getElementById('sky')
el.addEventListener('click', function () {
sky.setAttribute('src', data.skyUrl)
});
}
});
</script>
</head>
<body data-gr-c-s-loaded="true" class="a-body">
<a-scene>
<a-sky id="sky" src="chess-world.jpg" rotation="0 270 0" material="" geometry=""></a-sky>
<a-camera><a-cursor></a-cursor></a-camera>
<a-entity change-sky="skyUrl: chess-world.jpg" position="-0.055 1.244 -5.067" geometry="width:2.56;height:0.54;primitive:plane" material="color:#223860" text="color:#fff;value:Change to Chess;align:center;width:6"></a-entity>
<a-entity change-sky="skyUrl: puydesancy.jpg" position="-0.038 2.202 -5.067" geometry="width:2.92;height:0.54;primitive:plane" material="width:512.52;color:#223860" text="width:5.61;value:Change to puydesancy;color:#fff;align:center"></a-entity>
</a-scene>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment