add auxiliaries

This commit is contained in:
Bruno Rybársky 2022-01-16 13:56:53 +01:00
parent 93eedc7ac5
commit 78bebead10
3 changed files with 100 additions and 25 deletions

@ -13,19 +13,27 @@ td{
height: 100%;
padding: 0.4%;
}
#playfield,
#bg {
#playfield {
width: 100%;
height: 100%;
}
#localdiv,
#remotediv {
width: 100%;
height: 100%;
width: 70%;
height: 70%;
float: center;
padding-top: 1%;
padding-bottom: 1%;
}
#localauxdiv,
#remoteauxdiv {
width: 25%;
height: 25%;
float: center;
padding-top: 1%;
padding-bottom: 1%;
padding-left: 1%;
}
#local,
#remote {
width: 100%;
@ -33,14 +41,17 @@ td{
table-layout: fixed;
object-fit: contain;
}
#localaux,
#remoteaux {
width: 100%;
height: 100%;
table-layout: fixed;
object-fit: contain;
}
#playfield {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
#bg {
background-color: #000000;
position: absolute;
top: 0;
left: 0;
z-index: -100;
body{
background-color: black;
}

@ -10,17 +10,22 @@
<title>Battleship</title>
</head>
<body>
<div id="bg"></div>
<div id="fg">
<div id="playfield">
<div id="remotediv">
<div id="playfield">
<div id="remotediv">
<table id="remote">
</table>
</div>
<div id="localdiv">
</div>
<div id="remoteauxdiv">
<table id="remoteaux">
</table>
</div>
<div id="localdiv">
<table id="local">
</table>
</div>
</div>
<div id="localauxdiv">
<table id="localaux">
</table>
</div>
</div>
</body>

@ -1,10 +1,14 @@
//my personal variables
let w = 10;
let h = 10;
let x = "&#x2714;";
let o = "&#11044;";
let lgrid = new Array(w);
let rgrid = new Array(w);
let waux = 10;
let haux = 10;
let x = "&#x2714;";
let o = "&#11044;";
let lauxgrid = new Array(w);
let rauxgrid = new Array(w);
//Write arrays to html
function writegrid() {
for (let i = 0; i < w; i++) {
@ -14,8 +18,16 @@ function writegrid() {
}
}
}
function writeauxgrid(){
for (let i = 0; i < waux; i++) {
for (let j = 0; j < haux; j++) {
$('#lac' + i + '-' + j).html(lauxgrid[i][j]);
$('#rac' + i + '-' + j).html(rauxgrid[i][j]);
}
}
}
$(function () {
function inittable(){
for (let i = 0; i < w; i++) {
//create columns
$('#local').append('<tr class="column" id="lt' + i + '"></tr>');
@ -33,11 +45,32 @@ $(function () {
}
}
}
function initauxtable(){
for (let i = 0; i < waux; i++) {
//create columns
$('#localaux').append('<tr class="column" id="lax' + i + '"></tr>');
$('#remoteaux').append('<tr class="column" id="rax' + i + '"></tr>');
for (let j = 0; j < haux; j++) {
//create cells
$('#lax' + i).append('<td class="cellx" id="lacx' + i + '-' + j + '"></td>');
$('#rax' + i).append('<td class="cellx" id="racx' + i + '-' + j + '"></td>');
//add divs to cells
$('#lacx' + i + '-' + j).append('<div class="cell" id="lac' + i + '-' + j + '"></div>');
$('#racx' + i + '-' + j).append('<div class="cell" id="rac' + i + '-' + j + '"></div>');
//add arrays to grids
lauxgrid[i] = new Array(haux);
rauxgrid[i] = new Array(haux);
}
}
}
function randomizetable(){
for (let i = 0; i < w; i++) {
for (let j = 0; j < h; j++) {
//randomly choose between o and x
let rand = Math.floor(Math.random() * 2);
if (rand == 0) {
let r = Math.floor(Math.random() * 2);
if (r == 0) {
lgrid[i][j] = x;
rgrid[i][j] = o;
} else {
@ -46,6 +79,32 @@ $(function () {
}
}
}
//sync grid
}
function randomizeaux(){
for (let i = 0; i < waux; i++) {
for (let j = 0; j < haux; j++) {
let r = Math.floor(Math.random() * 2);
if (r == 0) {
lauxgrid[i][j] = x;
rauxgrid[i][j] = o;
} else {
lauxgrid[i][j] = o;
rauxgrid[i][j] = x;
}
}
}
}
function main() {
inittable();
initauxtable();
randomizetable();
writegrid();
randomizeaux();
writeauxgrid();
}
$(function () {
main();
});