topical media & game development

talk show tell print

mobile-query-three-plugins-minecraft-examples-bubble.htm / htm



  <!doctype html><title>Minimal tQuery Page</title>
  <script src="../../../build/tquery-bundle.js"></script>
  <script src="../tquery.spritesheet.js"></script>
  
  <body><script>
          var world        = tQuery.createWorld().boilerplate().start();
          var material        = new THREE.MeshBasicMaterial({
                  color                : 0x000000,
                  wireframe        : true
          })
          tQuery.createCube(material).addTo(world);
  
          var items        = tQuery.createSpritesheet({
                  url        : 'images/items/items.png',
                  imgW        : 256,
                  imgH        : 256,
                  spriteW        : 16,
                  spriteH        : 16
          });
          items.bind('load', function(){
                  var item        = items.createMesh(10, 2).addTo(world);
          
                  var canvas        = document.createElement('canvas');
                  var context        = canvas.getContext('2d');
                  context.fillStyle        = "rgba(0,0,0, 0)";
                  context.fillRect(0, 0, canvas.width, canvas.height);  
  
                  context.fillStyle        = "rgb(230,230,230)"; 
                  context.font        = "900 "+(2*24)+"px Arial";
                  var print        = function(x, y, text){
                          context.fillText(text, 8+(16*x), 28+(28*y));
                  }
                  print(2,1, "Hello")
                  print(7,3, "#bbg !!")
  
                  var url                = '../../grassground/images/grasslight-big.jpg';
                  var mesh        = tQuery.createPlane().addTo(item)
                          .geometry()
                                  .translateX(1/16 - 0.5/16)
                                  .translateY(3/16 + 0.5/16)
                                  .translateZ(1/16+0.001)
                                  .scaleBy(12/16, 7/16,1)
                                  .back()
                          .setBasicMaterial().ambient(0x444444).color(0xffffff).map(canvas).transparent(true).back();
  
          });
          
  
  </script></body>


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.