mostaphaRoudsari/.block

## .block
license: mit

## README.md

      
    Raw
  

              README.md
            
          
    Suppoesed to be something meaningful but then I had to come back and do the getting started example. Didn't use d3js for this example at all.
If you like clarity and extensibility A-Frame is probably for you!
Built with blockbuilder.org

  
## index.html
<html>
  <head>
    <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
    	<a-assets>
        <img id="groundTexture" src="https://cdn.aframe.io/a-painter/images/floor.jpg">
    		<img id="boxTexture" src="http://www.ladybug.tools/images/graph/honeybee.png">
        <img id="skyTexture" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
  		</a-assets>

      <a-camera>
   			<a-cursor></a-cursor>
  		</a-camera>

      <a-box src="#boxTexture" position="0 4 -5" rotation="0 45 45" scale="2 2 2">
      	<a-animation attribute="position" to="0 5 -15" direction="alternate" dur="2000"
      			repeat="indefinite"></a-animation>
				<a-animation attribute="rotation" to="0 0 0" direction="alternate" dur="1000"
      			repeat="indefinite"></a-animation>

        	<!-- These animations will start when the box is looked at. -->
  				<a-animation attribute="scale" begin="mouseenter" dur="300" to="0.5 0.5 0.5"></a-animation>
  				<a-animation attribute="scale" begin="mouseleave" dur="300" to="2 2 2"></a-animation>
  				<a-animation attribute="rotation" begin="click" dur="2000" to="360 405 45"></a-animation>
      </a-box>

      <a-sky src="#skyTexture"></a-sky>
      <a-plane src="#groundTexture" rotation="-90 0 0" width="30" height="30"
               repeat="20 20"></a-plane>

      <a-light type="ambient" color="#445451"></a-light>
  		<a-light type="point" intensity="0.5" position="0 2 -3"></a-light>
    </a-scene>

  <body>
</html>
	<html>
	<head>
	<script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
	</head>
	<body>
	<a-scene>
	<a-assets>
	<img id="groundTexture" src="https://cdn.aframe.io/a-painter/images/floor.jpg">
	<img id="boxTexture" src="http://www.ladybug.tools/images/graph/honeybee.png">
	<img id="skyTexture" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg">
	</a-assets>

	<a-camera>
	<a-cursor></a-cursor>
	</a-camera>

	<a-box src="#boxTexture" position="0 4 -5" rotation="0 45 45" scale="2 2 2">
	<a-animation attribute="position" to="0 5 -15" direction="alternate" dur="2000"
	repeat="indefinite"></a-animation>
	<a-animation attribute="rotation" to="0 0 0" direction="alternate" dur="1000"
	repeat="indefinite"></a-animation>

	<!-- These animations will start when the box is looked at. -->
	<a-animation attribute="scale" begin="mouseenter" dur="300" to="0.5 0.5 0.5"></a-animation>
	<a-animation attribute="scale" begin="mouseleave" dur="300" to="2 2 2"></a-animation>
	<a-animation attribute="rotation" begin="click" dur="2000" to="360 405 45"></a-animation>
	</a-box>

	<a-sky src="#skyTexture"></a-sky>
	<a-plane src="#groundTexture" rotation="-90 0 0" width="30" height="30"
	repeat="20 20"></a-plane>

	<a-light type="ambient" color="#445451"></a-light>
	<a-light type="point" intensity="0.5" position="0 2 -3"></a-light>
	</a-scene>

	<body>
	</html>