var interval;
const ip: string = "http://127.0.0.1";
const port: string = "35270";
var totalRoll = 0;
var quad = false;
var prevBoard = []
var pubeval = false;
var currentPlayer = 1;
var toggled: boolean = false;
const init_board = [0, 2, 0, 0, 0, 0, -5, 0, -3, 0, 0, 0, 5, -5, 0, 0, 0, 3, 0, 5, 0, 0, 0, 0, -2, 0];
// const init_board = [0,1,0,0,-1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]


$(function () {
    var board = []

    const red = "#E83D04"
    const white = "#E8E077"
    const brown = "#4C2E00"

    var color = white;


    var roll = [Math.floor(Math.random() * 6)+1, Math.floor(Math.random() * 6)+1]
    var roll = [1,2];
    totalRoll = roll[0] + roll[1];

    if (roll[0] == roll[1]) {
	totalRoll = roll[0] * 4;
	roll = [roll[0], roll[0], roll[0], roll[0]];
	quad = true;
    }
    
    $( "#roll" ).text("roll: " + roll.toString() + " total moves: " + totalRoll.toString());

    console.log("Initial roll:");
    console.log(roll);


    // Build pins
    for (var i = 0; i < 26; i++) {
	
	if (i < 13 && 0 < i) {
	    var pos = 'bottom';
	} else if (i > 12 && i < 25) {
	    var pos = 'top';
	} else {
	    var pos = 'bar';
	}
	
	if (color == white) {
	    color = red;
	} else {
	    color = white;
	}
	
	if (i == 0 || i == 25) {
	    color = brown;
	}



	var div = $("<div style='background-color:"+color+"'/>").addClass("pin").addClass("pin-"+pos).attr('id', 'pin-'+i);

	
	var checkers_div = $("<div />").addClass("checkers").attr('id', 'checkers-'+i);
	var checkers_list = $("<ul />").addClass("checkers_list").attr('id', 'checkers_list-'+i).attr('pinId', i);


	checkers_div.append(checkers_list);
	div.append(checkers_div);
	$( "#pins" ).append(div);
    }

    var div = $("<div style='background-color:black'/>").addClass("pin").addClass("pin-26").attr('id', 'pin-26');
	
    var checkers_div = $("<div />").addClass("checkers").attr('id', 'checkers-26');
    var checkers_list = $("<ul />").addClass("checkers_list").attr('id', 'checkers_list-26').attr('pinId', 26);

    checkers_div.append(checkers_list);
    div.append(checkers_div);
    $( "#pins" ).append(div);


    convertToPins(init_board);
    //prevBoard = convertToBoard();
    let initBotResult = getBotMove(init_board);
    prevBoard = initBotResult.board;
    convertToPins(prevBoard);
    
    prevBoard = convertToBoard();

    ($( ".checkers_list") as any).sortable({
	connectWith: ".checkers_list",
	receive: function (event, ui) {

	    // Handle putting people on the bar correclty and getting off it.
	    // Something like look at the index you drop the checker at


	    
	    var toIdx = event.target.attributes.pinId.value;
	    var fromIdx = ui.sender.attr("pinId");
	    
	    // console.log(fromIdx);
	    // console.log(toIdx);
	    
	    if (toIdx < 26) {
		var cloned_board = prevBoard.slice();
                var sign = Math.sign(cloned_board[fromIdx]);

                // if bar stuff has to be handled
                if (cloned_board[toIdx] * sign == -1) {
                    // Lift checker
                    cloned_board[fromIdx] += -(sign);

                    // Check where the opponents bar is
                    if (sign == -1) {
                        cloned_board[0] += -(sign);
                    } else {
                        cloned_board[25] += -(sign);
                    }

                    // flip the piece at target index
                    cloned_board[toIdx] *= -1
                    // Load the board into the pins
                    convertToPins(cloned_board);
                }
            }

	    board = convertToBoard();
	    // console.log("board!!!!");
	    // console.log(board);
	    var dataObject = handleMove(prevBoard, board, roll, totalRoll, quad);
	    prevBoard = dataObject.board;
	    // prevBoard = data_stuff['board'];
	    roll = dataObject.roll;
	    // roll = data_stuff['roll'];
	    totalRoll = dataObject.totalRoll;
	    // totalRoll = data_stuff['totalRoll'];
	    
	    convertToPins(prevBoard);
	    
	    console.log("total roll is:");
	    console.log(totalRoll);
	    if (totalRoll == 0) {
                if (board != convertToBoard()) {
		    currentPlayer = -1;
                    let botResult = getBotMove(prevBoard);
		    prevBoard = botResult.board;
                    convertToPins(prevBoard);
		    
                    roll = [Math.floor(Math.random() * 6)+1, Math.floor(Math.random() * 6)+1]
                    totalRoll = roll[0] + roll[1];
		    
                    if (roll[0] == roll[1]) {
			console.log("huehue");
                        totalRoll = roll[0] * 4;
                        roll = [roll[0], roll[0], roll[0], roll[0]]
                        quad = true;
                    }
                }
            }
	    currentPlayer = 1;
            $( "#roll" ).text("roll: " + roll.toString() + " total moves: " + totalRoll.toString());
	}
    });
   
});

function toggleDemoOn() {
    prevBoard = convertToBoard();

    if (!toggled) {
	toggled = true;
	interval = setInterval(doDemoMove, 500);
    }

    // Make sure that the demo doesn't stop on player 1's turn, so take one extra step, if that's the case
    // Also make sure that the board reverts to init board, if a player is done.
}

function toggleDemoOff() {
    if (toggled) {
	clearInterval(interval);
	if (currentPlayer == 1) {
	    doDemoMove();
	}
	clearInterval(interval);
	toggled = false;
    }
}

function isBlackDone(pin) {
    return pin >= 0;
}

function isWhiteDone(pin) {
    return pin <= 0;
}

function isGameDone(board: number[]): boolean {

    return (board.every(isBlackDone) || board.every(isWhiteDone));
    
}

function doDemoMove() {

    prevBoard = convertToBoard();
    let tmp: number[] = convertToBoard();
    let isFinished = isGameDone(tmp);
    if (isFinished) {
	prevBoard = init_board;
    }

    var doDemoMove;

    if ($("#doPubevalDemo").is(':checked')) {
	doDemoMove = getPubevalMove;
    } else {
	doDemoMove = getNetworkMove;
    }
    
    let res = doDemoMove(prevBoard, currentPlayer);
    prevBoard = res.board;
    convertToPins(prevBoard);
    currentPlayer = currentPlayer * -1;
}


function handleMove(previousBoard, board, roll, totalRoll, quad): {board: number[]; totalRoll: number; roll: number[]}{
    var data = postRequest(previousBoard, board, roll, totalRoll, quad);

    return data;
};

function togglePubeval() {
    if (pubeval == true) {
	pubeval = false;
    } else {
	pubeval = true;
    }
}

function convertToBoard() {
    let board = []

    for (var i = 0; i < 26; i++) {
	var amount: number = $( "#checkers_list-"+i ).children('li').length;
	if (amount != 0) {
	    var sign: number = parseInt(($("#checkers_list-"+i+"> li").attr('class').split(' ')[0]));
	    if (i == 21) {
		// console.log(amount)
		// console.log(sign)
	    }
	    let checkers: number = sign*amount;
	    board.push(checkers);
	} else {
	    board.push(0);
	}
	
    }
    // console.log("The built board");
    // console.log(board);
    return board
}

function emptyLists() {
    for (var i=0; i < 27; i++) {
		$( '#checkers_list-'+i ).empty();
    }
}

function convertToPins(board ) {
    // console.log(board);

    emptyLists();
    
    for (var i = 0; i < 26; i++) {
	var tmp = parseInt(board[i]);
	for (var amt_at_pin = 0; amt_at_pin < Math.abs(tmp); amt_at_pin++) {
	    var sign = Math.sign(tmp);
	    if (sign < 0) {
		var list_obj = $( "<li><img src='black.png'  width='40'></li>").addClass(Math.sign(tmp).toString());
	    } else if (sign > 0) {
		var list_obj = $( "<li><img src='white.png'  width='40'></li>").addClass(Math.sign(tmp).toString());
	    }
	    
	    $( '#checkers_list-'+i ).append(list_obj);
	}
    } 
};


interface botMove {
    board: number[];
}


function getNetworkMove(board, player): botMove {
    
    let data = {'board' : board.toString(), 'player' : player.toString()}
    let result : botMove = {board: []}
    
    $.ajax({
	type : "POST",
	async: false, 
	url : "http://127.0.0.1:"+port+"/network_move",
	data: JSON.stringify(data),
	success: function(data) {
	    data.split(",").forEach(function(item, index) {
		result.board.push(parseInt(item));
	    });
	}
    });
    return result;
};


function getPubevalMove(board, player): botMove {
    
    let data = {'board' : board.toString(), 'player' : player.toString()}
    let result : botMove = {board: []}
    
    $.ajax({
	type : "POST",
	async: false, 
	url : "http://127.0.0.1:"+port+"/pubeval_move",
	data: JSON.stringify(data),
	success: function(data) {
	    data.split(",").forEach(function(item, index) {
		result.board.push(parseInt(item));
	    });
	}
    });
    return result;
};



function getBotMove(board): botMove {
    
    let data = {'board' : board.toString(), 'pubeval' : pubeval}
    let result : botMove = {board: []}
    
    $.ajax({
	type : "POST",
	async: false, 
	url : "http://127.0.0.1:"+port+"/bot_move",
	data: JSON.stringify(data),
	success: function(data) {
	    data.split(",").forEach(function(item, index) {
		result.board.push(parseInt(item));
	    });
	}
    });
    return result;
};

function noMovesAvailable() {
    let curBoard = convertToBoard();
    console.log(curBoard);
    let res = getBotMove(curBoard);
    prevBoard = res.board;
    console.log(prevBoard);
    convertToPins(prevBoard);
    
    var roll = [Math.floor(Math.random() * 6)+1, Math.floor(Math.random() * 6)+1]

    if (roll[0] == roll[1]) {
	console.log("huehue");
        totalRoll = roll[0] * 4;
        roll = [roll[0], roll[0], roll[0], roll[0]]
        quad = true;
    }
    
    $( "#roll" ).text("roll: " + roll.toString() + " total moves: " + totalRoll.toString());
}


interface requestResult {
    board: number[];
    totalRoll: number;
    roll: number[];
}

function postRequest(previousBoard: number[], board: number[], roll: number[], totalRoll: number, quad: boolean) : requestResult {

    let result: requestResult = {board: [], totalRoll: 0, roll: []};

    var data = {'board' : board.toString(), 'prevBoard': previousBoard.toString(), 'roll': roll.toString(),
		'totalRoll': totalRoll.toString(),
		'quad': quad.toString()
	}
    $.ajax({
	type : "POST",
	async: false, 
	url : "http://127.0.0.1:"+port+"/post_board",
	data: JSON.stringify(data),
	success: function(data) {
	    let splitData: string = data.split("#");


	    splitData[0].split(",").forEach(function(item, index) {
		result.board.push(parseInt(item));
	    });

	    result.totalRoll = parseInt(splitData[1]);
	    
	    splitData[2].split(",").forEach(function(item, index) {
		result.roll.push(parseInt(item));
	    });
	    
	}
    });

    return result;
}