docs + cleanup and tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2017-04-21 23:25:55 +03:00
parent d08c11b5ef
commit fbd88770c1
2 changed files with 35 additions and 20 deletions

View File

@ -1,5 +1,5 @@
CACHE MANIFEST
# Timestamp: 20170421204925
# Timestamp: 20170421232507
CACHE:
simplesnake.html

View File

@ -38,9 +38,22 @@
*
*
* Goals:
* - Show that the "intuitive" is not the only approach
* - Show that the "intuitive" is not allways the simplest
* - Show that the "intuitive" is not the only approach or is not
* necessarily the simplest...
* - Show one approach to a scalable yet simple architecture
* - Illustrate several programming patterns and approaches:
* - concatinative
* - see how Snake methods are implemented and how they are used
* in setup(..)...
* - see Snake.call(..) and Snake.apply(..) methods and how they
* enable extending the code inline...
* - meta-programming
* see: makeEvent(..)
* - event-oriented-programming
* see Snake events and how they are used in setup(..) to extend
* the basic game logic...
* - Show the use of several HTML5/CSS3 features including appCache,
* touch events and keyboard events and handling...
*
*
*
@ -109,6 +122,25 @@ var Snake = {
y = y < 0 ? (y + h) : y
return { x: x, y: y }
},
// system...
setup: function(field, size, interval){
this.config.field_size = size || this.config.field_size
this.config.interval = interval || this.config.interval
field = field || this._field
field = this._field = typeof(field) == typeof('str') ? document.querySelector(field)
: field
this._make_field()
this._cells = [].slice.call(field.querySelectorAll('td'))
this.field_size = {
width: field.querySelector('tr').querySelectorAll('td').length,
height: field.querySelectorAll('tr').length,
}
this.players = {}
return this
.appleEaten(null)
.snakeKilled(null)
},
_make_field: function(w){
var l = []
l.length = w || this.config.field_size
@ -284,23 +316,6 @@ var Snake = {
gameStopped: makeEvent('__stopHandlers'),
// actions...
setup: function(field, size, interval){
this.config.field_size = size || this.config.field_size
this.config.interval = interval || this.config.interval
field = field || this._field
field = this._field = typeof(field) == typeof('str') ? document.querySelector(field)
: field
this._make_field()
this._cells = [].slice.call(field.querySelectorAll('td'))
this.field_size = {
width: field.querySelector('tr').querySelectorAll('td').length,
height: field.querySelectorAll('tr').length,
}
this.players = {}
return this
.appleEaten(null)
.snakeKilled(null)
},
start: function(t){
this.__timer = this.__timer
|| setInterval(this._tick.bind(this), t || this.config.interval || 200)