Created
October 5, 2011 17:17
-
-
Save potix2/1265057 to your computer and use it in GitHub Desktop.
reversi assist
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <title>Reversi Assistant</title> | |
| <style type="text/css"> | |
| #content-table { | |
| border: solid 1px #ccc; | |
| border-collapse: collapse; | |
| empty-cells: show; | |
| } | |
| #content-table tr { | |
| } | |
| #content-table tr th { | |
| background-color: #333; | |
| color: #fefefe; | |
| font-weight: bold; | |
| text-align: center; | |
| vertical-align: middle; | |
| } | |
| #content-table tr td { | |
| border: solid 1px #ccc; | |
| background-color: #159450; | |
| text-align: center; | |
| vertical-align: middle; | |
| font-weight: bold; | |
| color: #3c3; | |
| } | |
| #content-table thead tr th, | |
| #content-table tfoot tr th { | |
| width: 60px; | |
| height: 20px; | |
| } | |
| #content-table tbody tr th { | |
| width: 20px; | |
| height: 60px; | |
| } | |
| #content-table tr td.black { | |
| background-color: #000; | |
| } | |
| #content-table tr td.white { | |
| background-color: #fff; | |
| } | |
| </style> | |
| <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> | |
| <script type="text/javascript"> | |
| $(document).ready(function() { | |
| //config | |
| var classes = ['', 'white', 'black']; | |
| function Board() { | |
| this.data = []; | |
| this.current = 1; | |
| this.players = []; | |
| } | |
| function InteractivePlayer() { | |
| } | |
| InteractivePlayer.prototype = { | |
| notifyPass: function(b) { | |
| }, | |
| notifyChangePlayer: function(b) { | |
| }, | |
| action: function(b, avs) { | |
| } | |
| }; | |
| CPU.prototype = { | |
| notifyPass: function(b) { | |
| }, | |
| notifyChangePlayer: function(b) { | |
| }, | |
| action: function(b, avs) { | |
| b.put(avs[Math.floor(Math.random() * avs.length)]); | |
| } | |
| }; | |
| Board.prototype = { | |
| startGame: function(p1, p2) { | |
| this.players = [p1, p2]; | |
| this.current = 1; | |
| this.data = [ | |
| 0,0,0,0,0,0,0,0, | |
| 0,0,0,0,0,0,0,0, | |
| 0,0,0,0,0,0,0,0, | |
| 0,0,0,1,2,0,0,0, | |
| 0,0,0,2,1,0,0,0, | |
| 0,0,0,0,0,0,0,0, | |
| 0,0,0,0,0,0,0,0, | |
| 0,0,0,0,0,0,0,0 | |
| ]; | |
| this.play(); | |
| }, | |
| collectAvailablePlaces: function(p) { | |
| var result = []; | |
| for ( var i = 0; i < this.data.length; i++ ) { | |
| if ( this.canPut(i) ) { | |
| result.push(i); | |
| } | |
| } | |
| return result; | |
| }, | |
| play: function() { | |
| var availables = this.collectAvailablePlaces(this.current); | |
| if ( availables.length == 0 ) { | |
| //pass | |
| this.getCurrentPlayer().notifyPass(); | |
| this.changePlayer(); | |
| this.play(); | |
| } | |
| else { | |
| this.getCurrentPlayer().action(this, availables); | |
| } | |
| }, | |
| put: function(i) { | |
| if ( this.canPut(i) ) { | |
| return true; | |
| } | |
| else { | |
| return false; | |
| } | |
| }, | |
| changePlayer: function() { | |
| var c = this.current - 1; | |
| this.next = (this.next % 2) + 1; | |
| return this.players[c]; | |
| }, | |
| setRenderer: function(r) { | |
| this.renderer = r; | |
| }, | |
| }; | |
| function render(data) { | |
| for ( var i = 0; i < data.length; i++ ) { | |
| $('#content-table tbody tr:nth-child(' + (Math.floor(i/8) + 1) + ') td:nth-child(' + ((i%8) + 2) + ')') | |
| .removeClass() | |
| .addClass(classes[data[i]]); | |
| } | |
| } | |
| $('#new-button').click(init); | |
| $('#new-button').click(); | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <table id="content-table"> | |
| <thead> | |
| <tr><th style="width: 20px;"></th><th>A</th><th>B</th><th>C</th><th>D</th><th>E</th><th>F</th><th>G</th><th>H</th><th style="width: 20px;"></th></tr> | |
| </thead> | |
| <tbody> | |
| <tr><th>1</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>2</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>3</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>4</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>5</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>6</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>7</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| <tr><th>8</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><th></th></tr> | |
| </tbody> | |
| <tfoot> | |
| <tr><th style="width: 20px;"></th><th></th><th></th><th></th><th></th><th></th><th></th><th></th><th></th><th style="width: 20px;"></th></tr> | |
| </tfoot> | |
| </table> | |
| <input id="new-button" type="button" value="New" /> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment