Home - Old Man Programmer

Displaying demos/square/map.js

//http://en.wikipedia.org/wiki/Diamond-square_algorithm
function R(range) {
    return Math.floor(Math.random()*range);
}

var Map = {
  grid : null,
  mapsize : 64,
  roughness : 5,

  waterStart : {r:10,g:20,b:40},
  waterEnd : {r:64,g:110,b:142},
  grassStart : {r:67,g:100,b:18},
  grassEnd : {r:180,g:200,b:38},
  mtnStart : {r:191,g:180,b:38},
  mtnEnd : {r:60,g:56,b:31},
  rockStart : {r:100,g:100,b:100},
  rockEnd : {r:190,g:190,b:190},
  snowEnd : {r:200,g:200,b:200},
  snowStart: {r:255,g:255,b:255},

  displace: function(dim) {
    return (Math.random()*(dim/2)-(dim/4))*this.roughness;
  },

  mpd : function(dim) {
    if (dim == 1) return;
    var newdim = dim / 2;

    for(var i = dim; i <= this.mapsize; i += dim) {
      for(var j = dim; j <= this.mapsize; j += dim) {
	var x = i - newdim;
	var y = j - newdim;
	var tl = this.grid[i-dim][j-dim];
	var tr = this.grid[i%this.mapsize][j-dim];
	var bl = this.grid[i-dim][j%this.mapsize];
	var br = this.grid[i%this.mapsize][j%this.mapsize];
	this.grid[x][y] = this.normalize(((tl+tr+bl+br)/4)+this.displace(dim));
      }
    }
    var f = true;
    for(var i = dim; i <= this.mapsize; i += dim) {
      for(var j = dim; j <= this.mapsize; j += dim) {
	var x = i - newdim;
	var y = j - newdim;
	var cp = this.grid[x][y];
	var tl = this.grid[i-dim][j-dim];
	var tr = this.grid[i%this.mapsize][j-dim];
	var bl = this.grid[i-dim][j%this.mapsize];
	var br = this.grid[i%this.mapsize][j%this.mapsize];
	// top
	if ((j-dim)-newdim < 0)
	  this.grid[x][j-dim] = this.normalize((cp+tl+tr+this.grid[x][this.mapsize+((j-dim)-newdim)])/4 + this.displace(dim));
	else
	  this.grid[x][j-dim] = this.normalize((cp+tl+tr+this.grid[x][(j-dim)-newdim])/4 + this.displace(dim));

	//left
	if ((i-dim)-newdim < 0)
	  this.grid[i-dim][y] = this.normalize((cp+tl+bl+this.grid[this.mapsize+((i-dim)-newdim)][y])/4 + this.displace(dim));
	else
	  this.grid[i-dim][y] = this.normalize((cp+tl+bl+this.grid[(i-dim)-newdim][y])/4 + this.displace(dim));
	
	//bot
	this.grid[x][j] = this.normalize((cp+bl+br+this.grid[x][(j+newdim)%this.mapsize])/4 + this.displace(dim));
	
	//right
	this.grid[i][y] = this.normalize((cp+tr+br+this.grid[(i+newdim)%this.mapsize][y])/4 + this.displace(dim));
      }
    }
    this.mpd(newdim);
  },

  normalize: function(n) {
    return Math.max(0, Math.min(255, Math.floor(n)));
  },

  makemap: function(roughness,mapsize) {
    if (typeof roughness != undefined) this.roughness = roughness;
    if (typeof mapsize != undefined) this.mapsize = mapsize;
    var p, c;
    this.grid = new Array(this.mapsize+1);
    for(var x = 0; x <= this.mapsize; x++) {
      this.grid[x] = new Array(this.mapsize+1);
      for(var y = 0; y <= this.mapsize; y++) {
        this.grid[x][y] = -1;
      }
    }
    this.grid[0][0] = 128+(R(50)-25);
    this.mpd(this.mapsize);
  },

  fade : function(startColor, endColor, steps, step){
    var scale = step / steps,
    r = startColor.r + scale * (endColor.r - startColor.r),
    b = startColor.b + scale * (endColor.b - startColor.b),
    g = startColor.g + scale * (endColor.g - startColor.g);

    return Math.floor(r)<<16 | Math.floor(g) << 8 | Math.floor(b);
//    return {r:Math.floor(r), g:Math.floor(g), b:Math.floor(b)};
  },

  drawmap : function(xoff, yoff) {
    var cv = document.getElementById("map");
    var ctx = cv.getContext("2d");
    ctx.translate(xoff, yoff);
    for(var x = 0; x < this.mapsize; x++) {
      for(var y = 0; y < this.mapsize; y++) {
	var p = (this.grid[x][y]/255);
	if (p >= 0 && p <= 0.2) {
	  c = this.fade(waterStart, waterEnd, 30, Math.floor(p* 100));
	} else if (p > 0.2 && p <= 0.7) {
	  c = this.fade(grassStart, grassEnd, 40, Math.floor(p * 100) - 20);
	} else if (p > 0.7 && p <= 0.90) {
	  c = this.fade(mtnStart, mtnEnd, 20, Math.floor(p * 100) - 70);
	} else if (p > 0.90 && p <= 1) {
	  c = this.fade(rockStart, rockEnd, 20, Math.floor(p * 100) - 90);
	}
	ctx.fillStyle="rgb("+c.r+","+c.g+","+c.b+")";
	ctx.fillRect(x*2,y*2, 2, 2);
      }
    }
  }
};