Scratch

blob8108 wrote:

Hardmath123 wrote:

blob8108 wrote:

Horizontal scrolling is a pain. Expanding it might be useful; but I imagine one would mainly use a real text editor, to be honest. Indentation is much more important; go with that. 

...what precisely was the problem with CSS/textareas?

Textareas do not support whiteSpace:pre. They only support no-wrap (scroll but don't indent) and pre-wrap (indent but don't scroll). I will go for indentation, as you suggested, since I don't expect you to code there, just tweak numbers. 

"pre-wrap" is precisely what I was going to suggest. Go with that 

Great, thanks!    Should I provide stuff like who won or what moves you can make, or should that be left to the competitors?

Pros:
Less work for you

Cons:
More work for me 
Not custom-fit for you
Might be slower, you might have better algorithms

Last edited by Hardmath123 (2012-05-04 12:19:53)

I'm actually going to advocate for more competitor-written code for precisely the reasons you put forth.  If the competition is about making AI, the various functions that go along with it are of great importance.  If a team can make more efficient algorithms than another, that should grant them an advantage.  If you provide the movement function and evaluation function, that leaves very little for the teams to make 

blob8108 wrote:

Hardmath123 wrote:

Should I provide stuff like who won or what moves you can make, or should that be left to the competitors?

Who won: absolutely. It should handle all the game-mechanic-y stuff, like endgames — so all you have to do is write AI code to decide where to go. I presume you've already done all the stuff like computer vs computer, UI so you can do player vs computer, and everything... 

Code that determines what moves you can make should be part of the AI code, I think; and seems quite trivial to me    (doesn't it just look for empty tiles?)

As an aside (and I think we mentioned this): you should definitely copy the board before passing it to the AI code, and get the function to only return the [x, y] co-ordinates of where it wants to move — otherwise the AI could potentially "cheat" by moving/deleting opposing pieces    So best check in your code to make sure the move is allowed (ie. doesn't overlap an existing piece), I think.

However, you might like to provide some example code for things like listing possible moves. Maybe include a really really dumb basic AI that does something like place its pieces in a random non-empty square, to demonstrate how it all works? 

So I think the consensus here is that I should write in a whoWon(board) function and an isMoveValid (board, row, col), which is private to my back-end; your AI's have to re-implement it the best you can or copy it from me ( ). I'll include a "random" player for testing and learning how to code the AI's.

Amcerbu, do you want to join, too? I noiced you've been posting but you never said you wanted to join. You're welcome to, though. 

amcerbu wrote:

@Hardmath123: I'd like to, but I don't know a bit of JavaScript.

...and that's a problem because...? 

hardmath, how's going?

could write the js code 
just upload the page

Hardmath123 wrote:

Promise not to add in loopholes to help you cheat? ( )

i will write it nice and documented so you all can see i didn't do anything :cuteface:

amcerbu wrote:

(Am I the only one obsessed with making beautiful, over-commenting code?)

No.    But beautiful code is very difficult to write. One keeps being "forced" to use ugly hacks... 

blob8108 wrote:

amcerbu wrote:

(Am I the only one obsessed with making beautiful, over-commenting code?)

No.    But beautiful code is very difficult to write. One keeps being "forced" to use ugly hacks... 

?

I love writing "beautiful" code. You never need an ugly hack, no matter what your situation is. There's always a reasonable cross-browser workaround, even if it means giving up on a smaller feature. If there isn't, you shouldn't be using that feature anyway. 

Roijac, if you're serious about helping out with the framework, I'll post the code here. The framework consists of a single HexBoard object with all the methods built right in—you just need to fill in the methods. I'll paste the code this afternoon, once I comment it out for you. 

Hardmath123 wrote:

blob8108 wrote:

amcerbu wrote:

(Am I the only one obsessed with making beautiful, over-commenting code?)

No.    But beautiful code is very difficult to write. One keeps being "forced" to use ugly hacks... 

I love writing "beautiful" code. You never need an ugly hack, no matter what your situation is. There's always a reasonable cross-browser workaround, even if it means giving up on a smaller feature. If there isn't, you shouldn't be using that feature anyway. 

I jest (partly).    And for web stuff, you can always use progressive enhancement. 

I meant for code in general -- like the Python code behind Kurt. It may be beautiful at first (or even merely kinda pretty), but then you have to make a small tweak or change and the temptation is to just "add it on", as it were; despite knowing the best (and more time-consuming) thing might be to rework the whole design.

Or sometimes, you can just hide the "ugly" code behind a nice, clean interface... JS libraries like jQuery or Raphael.js that handle cross-browser differences and quirks come to mind.

I do agree with you: beautiful code is much nicer; as well as being easier to read and debug and maintain.    And the issue I describe is much less a problem for smaller projects, I'll admit.

Maybe I'll write a Kurt 2.0 someday... but I'm getting offtopic. 

Last edited by blob8108 (2012-05-15 02:39:14)

sparks wrote:

I must admit i'm a just-get-it-working kind of programmer, much to the chagrin of my C# lecturer. I truly appreciate beautiful code though, and wish I could do it 

This is the point — I feel like this sometimes... 

This is being written in JavaScript as a team effort, right? 

As I understand it, the JS framework for the competition is being written by Hardmath123/as a team effort. For the competition, everyone writes their own AI in JS — I'm not entirely sure whether team entries are allowed or not. 

@Roijac: Here's the basic code which we need to fill in, test, debug, etc. Anyone is welcome to complete a method for me. You'll get to see how the backend works so your AI will work out better, too! 

/* HexFramework consists of a single HexBoard object which contains all the
 * methods needed by the AIs and the backend. Methods which need to be
 * filled in are marked, though you may want to optimize and debug the rest;
 * I wrote this quite late at night and I haven't tested any of it.
 *
 * When specifying cells, all the functions take in two arguments (row, col)
 * as the inputs. Row indicates which item along the X axis, and col
 * indicates which item along the Y axis. So the middle of the top row is
 * cell row:4 col:0 (Note: cells are named 0-9 for JS array compatibility).
 *
 */
function HexBoard() {
    this.contents = new Array(10);
    
    for (var i=0; i<10; i++) {// Create empty 10*10 array
        this.contents[i]=new Array(10);
        for (var j=0; j<10; j++) {
            this.contents[i][j] = "-";
        }
    }
    
    this.copy = function(newBoard) {// Create a copy, save it in newBoard pointer
        for (var i=0; i<10; i++) {
            for (var j=0; j<10; j++) {
                newBoard.contents[i][j] = this.contents[i][j];
            }
        }
    }
    
    this.whoWon = function() {// !!!!! returns who won, "R", "B", "-" (nobody) or "T" (tie)
    
        // To implement this, first implement the connected? method.
        // Then check if all pairs of cells which, if connected, would result in a win, are connected.
        // For example, (0,0) and (9,9) would result in a win if connected.
    }
    
    this.connected = function(row1, col1, row2, col2, player) {// !!!!! returns true if two specified cells are connected by a chain of the same color "player" (R, B, or -)
        // This should work recursively: two cells are connected if either they are adjacent, or a cell adjacent to one of the cells is connected to the second.
        // The code below is non-functional but explains how the working code should function
        
        /*
        var options = this.adjacent(row1, col1); // get adjacent cells
        for (var i=0; i<options.length; i++) {
            if (this.contents[options[i][0]][options[i][1]]==player) {// get adjacent cells of wanted color
                if (options[i] = [row2, col2]) {// if the adjacent cell is the one we are check to see if they are connected
                    return true;
                } else {
                    if (this.connected(options[i][0], options[i][1], row2, col2, player)) {// if the adjacent cell is connected to the cell...
                        return true;
                    }
                }
            }
        }
        return false;*/
    
    }
    
    this.rotate = function() {// !!!!! rotate board 90 degrees, don't return anything
    }
    
    this.moveTo = function(row, col, piece) { // Just places piece @ cell
        this.contents[row][col]=(piece=="R") ? "R" : "B";
    }
    
    this.empty = function(row, col) { // Checks if a cell exists
        return (this.contents[row] && this.contents[row][col]);
    }
    
    this.adjacent = function(row, col) {// returns all adjacent cells
        var options = [];
        if (this.empty(row-1, col)) {
            options.push([row-1, col]);
        }
        if (this.empty(row+1, col)) {
            options.push([row+1, col]);
        }
        if (this.empty(row, col+1)) {
            options.push([row, col+1]);
        }
        if (this.empty(row, col-1)) {
            options.push([row, col-1]);
        }
        if (this.empty(row-1, col+1)) {
            options.push([row-1, col+1]);
        }
        if (this.empty(row+1, col-1)) {
            options.push([row+1, col-1]);
        }
        return options;
    }
    
    this.drawOn = function(ctx) {// draws on a context
        ctx.save();
        for (var i=0; i<10; i++) {
            for (var j=0; j<10; j++) {
                switch (this.contents[i][j]) {
                    case "-":
                        ctx.fillStyle="gray";
                        break;
                    case "R":
                        ctx.fillStyle="red";
                        break;
                    case "B":
                        ctx.fillStyle="blue";
                        break;
                }
                ctx.beginPath();
                ctx.arc(i*33+15*j+15, j*30+15, 15, 0, Math.PI*2, false);
                ctx.fill();
            }
        }
        ctx.restore();
    }
}