Utopiah · July 5, 2016 19:14
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
 <!doctype html>
 <html>
  <head>
    <title>VR Knowledge Map</title>
    <meta name="description" content="VR Knowledge Map">
    <script src="https://rawgit.com/aframevr/aframe/master/dist/aframe-v0.2.0.min.js"></script>
    <script src="https://rawgit.com/ngokevin/aframe-text-component/master/dist/aframe-text-component.min.js"></script>
  </head>
  <body>
    <a-scene>
      <a-assets>
  Lesson1Position_Code      
      </a-assets>
      
    <a-entity position="0 1.8 4" camera id="camera" look-controls wasd-controls>
      <a-cursor color="white"></a-cursor>
    </a-entity>
     
    <a-entity id="textid" text="text: VR knowledge map"position="-5 0 -5" material="color: white" scale="2">
      </a-entity>
      
    <a-sky id=background src="" color="lightblue" cross-origin=""></a-sky>
      
    <a-plane position="0 2 3" color="#dbd7d7" visible="false" id="loadingPlane">
      <a-animation begin="firstanimation" attribute="scale" to="0 0 0" dur="3000"></a-animation>
    </a-plane>
    
    <a-plane rotation="-90 0 0" position="0 -1 0" scale="20 20 20"></a-plane>
      
      <a-entity id="Lesson1Position" class="Day1" position="-5 0 2">
        <a-entity id="savetext" text="text: Save" position="-2.5 0 0" material="color: black" scale="0.5 0.5 0.5"></a-entity>
        <a-entity id="Lesson1Position_Title" text="text: Lesson1: Position" rotation="-90 0 0" position="0 -0.9 0" material="color: black"></a-entity>
        <a-cube color="red" position="0 0 0"></a-cube>
        <a-entity id="Lesson1Position_Code" text='text: <a-cube color="red" position="0 0 0">' rotation="-90 0 0" position="0 -0.9 -1" material="color: grey"></a-entity>
      <a-cube rotation="0 0 0" position="4 0.1 -3" scale="6 2 1" color="lightgrey"></a-cube>
      <a-plane rotation="-90 0 0" position="-1 -0.9 -4" scale="1 6 1" color="orange"></a-plane>
      </a-entity>
      
      <a-entity id="Lesson2Color" class="Day1" position="-5 0 -4">
        <a-entity id="Lesson2Color_Title" text="text: Lesson2: Color" rotation="-90 0 0" position="0 -0.9 -1" material="color: black"></a-entity>
        <a-cube color="green" position="0 0 0"></a-cube>
        <a-entity id="Lesson1Position_Code" text='text: <a-cube color="green" position="0 0 0">' rotation="-90 0 0" position="0 -0.9 0" material="color: grey"></a-entity>
      <a-cube rotation="0 0 0" position="4 0.1 -3" scale="6 2 1" color="lightgrey"></a-cube>
      <a-plane rotation="-90 0 0" position="-1 -0.9 -4" scale="1 6 1" color="orange"></a-plane>
      </a-entity>
    
    </a-scene>
 
    <script>
      
      /* TODO
          catch URL pameters and position camera accordingly
          simplify the default building block room
      */
      var lessons = {
        "Lesson1Position" : {position:"-5 0 2"},
        "Lesson2Color" : {position:"-5 0 -4"},
      };
      
      // check if URL parameters, if so, position the camera in front of the appropriate lesson
      var QueryString = function () {
        // This function is anonymous, is executed immediately and 
        // the return value is assigned to QueryString!
        var query_string = {};
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i=0;i<vars.length;i++) {
          var pair = vars[i].split("=");
              // If first entry with this name
          if (typeof query_string[pair[0]] === "undefined") {
            query_string[pair[0]] = decodeURIComponent(pair[1]);
              // If second entry with this name
          } else if (typeof query_string[pair[0]] === "string") {
            var arr = [ query_string[pair[0]],decodeURIComponent(pair[1]) ];
            query_string[pair[0]] = arr;
              // If third or later entry with this name
          } else {
            query_string[pair[0]].push(decodeURIComponent(pair[1]));
          }
        } 
        return query_string;
      }();

      if(QueryString.TargetLesson){
        if(lessons[QueryString.TargetLesson]){
          TargetLessonPosition = lessons[QueryString.TargetLesson].position;
        }
      }
      
      var scene = document.querySelector('a-scene');
      if (scene.hasLoaded) {
        run();
      } else {
        scene.addEventListener('loaded', run);
      }
      function run () {
        
        if(TargetLessonPosition){
          var camera = document.querySelector('#camera');
          camera.setAttribute('position',TargetLessonPosition);
        }
          
        var item = document.querySelector('#savetext');
        item.addEventListener('mouseenter', function() {
             var learnedcode = encodeURIComponent('{a-box color="yellow" position='+document.getElementById('Lesson1Position_Code').getAttribute('text').text+'"}{/a-box}');
             window.open('mailto:[email protected]?subject=VC Inception School - Room1&body=continue https://output.jsbin.com/dibonoj code, you learned '+learnedcode+' (for safety reason the inferior/superior signs were replaced by {/}) and personalize using your own code and lessons you learned https://jsbin.com/dibonoj/edit?html,output',"_self");
        });
      }
      
    </script>
  </body>
 </html>
	<!doctype html>
	<html>
	<head>
	<title>VR Knowledge Map</title>
	<meta name="description" content="VR Knowledge Map">
	<script src="https://rawgit.com/aframevr/aframe/master/dist/aframe-v0.2.0.min.js"></script>
	<script src="https://rawgit.com/ngokevin/aframe-text-component/master/dist/aframe-text-component.min.js"></script>
	</head>
	<body>
	<a-scene>
	<a-assets>
	Lesson1Position_Code
	</a-assets>

	<a-entity position="0 1.8 4" camera id="camera" look-controls wasd-controls>
	<a-cursor color="white"></a-cursor>
	</a-entity>

	<a-entity id="textid" text="text: VR knowledge map"position="-5 0 -5" material="color: white" scale="2">
	</a-entity>

	<a-sky id=background src="" color="lightblue" cross-origin=""></a-sky>

	<a-plane position="0 2 3" color="#dbd7d7" visible="false" id="loadingPlane">
	<a-animation begin="firstanimation" attribute="scale" to="0 0 0" dur="3000"></a-animation>
	</a-plane>

	<a-plane rotation="-90 0 0" position="0 -1 0" scale="20 20 20"></a-plane>

	<a-entity id="Lesson1Position" class="Day1" position="-5 0 2">
	<a-entity id="savetext" text="text: Save" position="-2.5 0 0" material="color: black" scale="0.5 0.5 0.5"></a-entity>
	<a-entity id="Lesson1Position_Title" text="text: Lesson1: Position" rotation="-90 0 0" position="0 -0.9 0" material="color: black"></a-entity>
	<a-cube color="red" position="0 0 0"></a-cube>
	<a-entity id="Lesson1Position_Code" text='text: <a-cube color="red" position="0 0 0">' rotation="-90 0 0" position="0 -0.9 -1" material="color: grey"></a-entity>
	<a-cube rotation="0 0 0" position="4 0.1 -3" scale="6 2 1" color="lightgrey"></a-cube>
	<a-plane rotation="-90 0 0" position="-1 -0.9 -4" scale="1 6 1" color="orange"></a-plane>
	</a-entity>

	<a-entity id="Lesson2Color" class="Day1" position="-5 0 -4">
	<a-entity id="Lesson2Color_Title" text="text: Lesson2: Color" rotation="-90 0 0" position="0 -0.9 -1" material="color: black"></a-entity>
	<a-cube color="green" position="0 0 0"></a-cube>
	<a-entity id="Lesson1Position_Code" text='text: <a-cube color="green" position="0 0 0">' rotation="-90 0 0" position="0 -0.9 0" material="color: grey"></a-entity>
	<a-cube rotation="0 0 0" position="4 0.1 -3" scale="6 2 1" color="lightgrey"></a-cube>
	<a-plane rotation="-90 0 0" position="-1 -0.9 -4" scale="1 6 1" color="orange"></a-plane>
	</a-entity>

	</a-scene>

	<script>

	/* TODO
	catch URL pameters and position camera accordingly
	simplify the default building block room
	*/
	var lessons = {
	"Lesson1Position" : {position:"-5 0 2"},
	"Lesson2Color" : {position:"-5 0 -4"},
	};

	// check if URL parameters, if so, position the camera in front of the appropriate lesson
	var QueryString = function () {
	// This function is anonymous, is executed immediately and
	// the return value is assigned to QueryString!
	var query_string = {};
	var query = window.location.search.substring(1);
	var vars = query.split("&");
	for (var i=0;i<vars.length;i++) {
	var pair = vars[i].split("=");
	// If first entry with this name
	if (typeof query_string[pair[0]] === "undefined") {
	query_string[pair[0]] = decodeURIComponent(pair[1]);
	// If second entry with this name
	} else if (typeof query_string[pair[0]] === "string") {
	var arr = [ query_string[pair[0]],decodeURIComponent(pair[1]) ];
	query_string[pair[0]] = arr;
	// If third or later entry with this name
	} else {
	query_string[pair[0]].push(decodeURIComponent(pair[1]));
	}
	}
	return query_string;
	}();

	if(QueryString.TargetLesson){
	if(lessons[QueryString.TargetLesson]){
	TargetLessonPosition = lessons[QueryString.TargetLesson].position;
	}
	}

	var scene = document.querySelector('a-scene');
	if (scene.hasLoaded) {
	run();
	} else {
	scene.addEventListener('loaded', run);
	}
	function run () {

	if(TargetLessonPosition){
	var camera = document.querySelector('#camera');
	camera.setAttribute('position',TargetLessonPosition);
	}

	var item = document.querySelector('#savetext');
	item.addEventListener('mouseenter', function() {
	var learnedcode = encodeURIComponent('{a-box color="yellow" position='+document.getElementById('Lesson1Position_Code').getAttribute('text').text+'"}{/a-box}');
	window.open('mailto:[email protected]?subject=VC Inception School - Room1&body=continue https://output.jsbin.com/dibonoj code, you learned '+learnedcode+' (for safety reason the inferior/superior signs were replaced by {/}) and personalize using your own code and lessons you learned https://jsbin.com/dibonoj/edit?html,output',"_self");
	});
	}

	</script>
	</body>
	</html>