Init commit

2018-05-18 00:49:54 +02:00 · 2018-05-18 00:49:54 +02:00 · 94e2c9a768
commit 94e2c9a768
5 changed files with 136 additions and 0 deletions
--- a/black.png
+++ b/black.png
--- a/func.js
+++ b/func.js
@ -0,0 +1,93 @@
+
+$(function () {
+
+    var sortables = []
+    // Build pins
+    for (var i = 1; i < 25; i++) {
+	var div = $("<div />").addClass("pin").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);
+	sortables.push("#checkers_list-"+i);
+
+	checkers_div.append(checkers_list);
+	div.append(checkers_div);
+	$( "#pins" ).append(div);
+    }
+
+    convertBoard();
+    convertToBoard();
+    
+    console.log(sortables.join());
+    $( sortables.join() ).sortable({
+	connectWith: ".checkers_list"
+    });
+    
+});
+
+
+function convertToBoard() {
+    var board = [0]
+
+    for (var i = 1; i < 25; i++) {
+	var amount = $( "#checkers_list-"+i ).children('li').length;
+	board.push(amount);
+    }
+
+    board.push(0)
+    console.log(board);
+}
+
+function convertBoard() {
+    // TODO: Take board as input
+    var 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];
+    // We don't want to deal with bars RIGHT now, TODO: Fix this.
+    for (var i = 1; i < 25; i++) {
+	for (var amt_at_pin = 0; amt_at_pin < Math.abs(board[i]); amt_at_pin++) {
+	    var sign = Math.sign(board[i]);
+	    if (sign > 0) {
+		var list_obj = $( "<li><img src='black.png'  width='40'></li>").addClass(Math.sign(board[i]).toString());
+	    } else if (sign < 0) {
+		var list_obj = $( "<li><img src='white.png'  width='40'></li>").addClass(Math.sign(board[i]).toString());
+	    }
+	    
+	    $( '#checkers_list-'+i ).append(list_obj);
+	}
+    } 
+};
+
+
+function onReceived(data) {
+    var obj = JSON.stringify(data);
+    alert(obj);
+};
+
+
+function get_request() {
+    $.ajax({
+	url: 'http://127.0.0.1:5000/',
+	dataType: 'JSONP',
+	data: {
+	    format: 'json'
+	},
+	type: 'GET',
+	success: onReceived
+    });
+};
+
+
+function onPost(data) {
+    console.log(data);
+};
+
+
+function post_request() {
+    var 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]
+
+    var data = {'board' : board.toString()}
+    $.ajax({
+	type : "POST",
+	url : "http://127.0.0.1:5000/post_request",
+	data: JSON.stringify(data),
+	success: onPost
+    });
+};
--- a/index.html
+++ b/index.html
@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1">
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="jquery-ui/jquery-ui.min.css">
+    <link rel="stylesheet" href="jquery-ui/jquery-ui.structure.min.css">
+    <link rel="stylesheet" href="jquery-ui/jquery-ui.theme.min.css">
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
+	  rel="stylesheet">
+
+    <!-- <link rel="stylesheet" href="bulma.min.css"> -->
+  </head>
+
+  <body>
+    <script src="jquery-3.3.1.min.js"></script>
+    <script src="jquery-ui/jquery-ui.min.js"></script>
+
+    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
+    <script src="func.js"></script>
+
+    <button id="tester" onclick="get_request()">pls</button>
+    <button id="post_test" onclick="post_request()">also_pls</button>
+      
+    <div id="pins">
+      
+    </div>
+    
+    
+  </body>
+</html>
--- a/style.css
+++ b/style.css
@ -0,0 +1,9 @@
+body {
+    text-align: center;
+    background-color: green;
+}
+
+ul {
+    padding-top: 5px;
+    display: inline-block;
+}
--- a/white.png
+++ b/white.png