after abandoning the simple game, I may have started something HUGE ... as in: a little too big as the next step, considering that it is just another "getting familiar with XYZ" project.
Eventually I want to create level, normal and depth maps through pcg methods and use WebGL & shaders for interesting 2D lighting effects.
It is not that there is no progress. I think what I have so far has potential ... but there are quite a few battles that need to be fought.
- A map with 256 x 256 tiles is created randomly (so far the array stores values 0 and 1 only)
- Cellular automation is used to get a smooth result
- A landscape creator serves as a cursor into the map and it translates the map into renderable chunks
- 25 x 3 images are rendered (map areas around the players position), so far only the level map is drawn in a very basic way, normal and depth map stay white.
- So far the contexts are still 2D canvas contexts. A part of the landscape at the center is copied to the main canvas.
http://procgames.com/raidaces/
For some reason Firefox does not do the last part: transfer the image to the main canvas.
It does work for me in Chrome. Not sure if that is a bug in my code ... there is no error message shown by Firebug.
At least I know now that my Java approach with stream sources works in JavaScript as well:
For reproducible content:[code=js:0]var MIN_SEQUENCE_LENGTH = 40;var MAX_SEED_VALUE = 123321;//// StreamSourceFixed//function StreamSourceFixed(seed1, seed2) { this.currentNumber1 = seed1; this.currentNumber2 = seed2; this.bufferSequence = "";}StreamSourceFixed.prototype = Object.create(AbstractStreamSource.prototype);StreamSourceFixed.prototype.constructor = StreamSourceFixed;//// Methods//StreamSourceFixed.prototype.consumeChar = function() { return String.fromCharCode(this.consumeByte());}StreamSourceFixed.prototype.consumeByte = function() { this.updateBufferSequence(); var number = parseInt(this.bufferSequence.substring(0,3)) % 256; this.bufferSequence = this.bufferSequence.substring(3); return number;}StreamSourceFixed.prototype.consumeShort = function() { this.updateBufferSequence(); var number = parseInt(this.bufferSequence.substring(0,5)) % 32768; this.bufferSequence = this.bufferSequence.substring(5); return number;}StreamSourceFixed.prototype.consumeInt = function() { this.updateBufferSequence(); var number = parseInt(this.bufferSequence.substring(0,10)) % 2147483648; this.bufferSequence = this.bufferSequence.substring(10); return number;}StreamSourceFixed.prototype.consumeLong = function() { this.updateBufferSequence(); var number = parseInt(this.bufferSequence.substring(0,16)) % 9007199254740993; this.bufferSequence = this.bufferSequence.substring(16); return number;}StreamSourceFixed.prototype.consumeDouble = function() { throw "error_double_not_supported";}StreamSourceFixed.prototype.consumeBoolean = function() { this.updateBufferSequence(); var number = parseInt(this.bufferSequence.substring(0, 1)) % 2; this.bufferSequence = this.bufferSequence.substring(1); return 1 == number;}StreamSourceFixed.prototype.updateBufferSequence = function() { while (MIN_SEQUENCE_LENGTH > this.bufferSequence.length) { this.bufferSequence += this.currentNumber1; this.bufferSequence += this.currentNumber2; var sum = (this.currentNumber1 + this.currentNumber2); while (MAX_SEED_VALUE < sum) { sum -= MAX_SEED_VALUE; } this.currentNumber1 = this.currentNumber2; this.currentNumber2 = sum; }}
... and the random one:[code=js:0]//// StreamSourceRandom//function StreamSourceRandom() { StreamSourceFixed.apply(this, [ Math.floor((Math.random()*MAX_SEED_VALUE)+1), Math.floor((Math.random()*MAX_SEED_VALUE)+1) ]);}StreamSourceRandom.prototype = Object.create(StreamSourceFixed.prototype);StreamSourceRandom.prototype.constructor = StreamSourceRandom;
