examples/3d/js/camera.js
function(col, ray, angle) {
    var step, drops, rain, texX, wall;
    var tex1 = game.map.wall;
    var tex2 = game.map.speaker;
    var left = Math.floor(col * this.spacing);
    var width = Math.ceil(this.spacing);
    var hit = -1;

    // Find the next wall hit.
    while (++hit < ray.length && ray[hit].height <= 0);

    // Draw the wall sections and rain drops.
    for (var i=ray.length - 1; i>=0; i--) {
      step = ray[i];
      drops = Math.pow(Math.random(), 100) * i;
      rain = (drops > 0) && this.project(0.2, angle, step.dist);

      var tex = (step.type === 1) ? tex1 : tex2;

      if (i === hit) {
        texX = Math.floor(tex.width * step.offset);
        wall = this.project(step.height, angle, step.dist);

        ctx.globalAlpha = 1;
        ctx.drawImage(tex.image, texX, 0, 1, tex.height, left, wall.top, width, wall.height);

        ctx.fillStyle = '#000';
        ctx.globalAlpha = Math.max((step.dist + step.shading) / this.lightRange - game.map.light, 0);
        ctx.fillRect(left, wall.top, width, wall.height);
      }

      ctx.fillStyle = '#fff';
      ctx.globalAlpha = 0.15;
      while (--drops > 0) {
        ctx.fillRect(left, Math.random() * rain.top, 1, rain.height);
      }
    }
  }
function(col, ray, angle) {
    var step, drops, rain, texX, wall;
    var tex1 = game.map.wall;
    var tex2 = game.map.speaker;
    var left = Math.floor(col * this.spacing);
    var width = Math.ceil(this.spacing);
    var hit = -1;

    // Find the next wall hit.
    while (++hit < ray.length && ray[hit].height <= 0);

    // Draw the wall sections and rain drops.
    for (var i=ray.length - 1; i>=0; i--) {
      step = ray[i];
      drops = Math.pow(Math.random(), 100) * i;
      rain = (drops > 0) && this.project(0.2, angle, step.dist);

      var tex = (step.type === 1) ? tex1 : tex2;

      if (i === hit) {
        texX = Math.floor(tex.width * step.offset);
        wall = this.project(step.height, angle, step.dist);

        ctx.globalAlpha = 1;
        ctx.drawImage(tex.image, texX, 0, 1, tex.height, left, wall.top, width, wall.height);

        ctx.fillStyle = '#000';
        ctx.globalAlpha = Math.max((step.dist + step.shading) / this.lightRange - game.map.light, 0);
        ctx.fillRect(left, wall.top, width, wall.height);
      }

      ctx.fillStyle = '#fff';
      ctx.globalAlpha = 0.15;
      while (--drops > 0) {
        ctx.fillRect(left, Math.random() * rain.top, 1, rain.height);
      }
    }
  }
function ( col , ray , angle ) { var step , drops , rain , texX , wall ; var tex1 = game . map . wall ; var tex2 = game . map . speaker ; var left = Math . floor ( col * this . spacing ) ; var width = Math . ceil ( this . spacing ) ; var hit = - 1 ; // Find the next wall hit. while ( ++ hit < ray . length && ray [ hit ] . height <= 0 ) ; // Draw the wall sections and rain drops. for ( var i = ray . length - 1 ; i >= 0 ; i -- ) { step = ray [ i ] ; drops = Math . pow ( Math . random ( ) , 100 ) * i ; rain = ( drops > 0 ) && this . project ( 0.2 , angle , step . dist ) ; var tex = ( step . type === 1 ) ? tex1 : tex2 ; if ( i === hit ) { texX = Math . floor ( tex . width * step . offset ) ; wall = this . project ( step . height , angle , step . dist ) ; ctx . globalAlpha = 1 ; ctx . drawImage ( tex . image , texX , 0 , 1 , tex . height , left , wall . top , width , wall . height ) ; ctx . fillStyle = '#000' ; ctx . globalAlpha = Math . max ( ( step . dist + step . shading ) / this . lightRange - game . map . light , 0 ) ; ctx . fillRect ( left , wall . top , width , wall . height ) ; } ctx . fillStyle = '#fff' ; ctx . globalAlpha = 0.15 ; while ( -- drops > 0 ) { ctx . fillRect ( left , Math . random ( ) * rain . top , 1 , rain . height ) ; } } }
Draw a single column of the scene.
@param  {Number} col   Which column in the sequence.
@param  {Array} ray   Ray to follow.
@param  {Number} angle Angle of the ray.
Draw a single column of the scene .