This commit is contained in:
Bruno Rybársky 2022-01-16 10:52:50 +01:00
parent eef96965e9
commit 8bd879e44a
5 changed files with 168 additions and 0 deletions

46
index.css Normal file

@ -0,0 +1,46 @@
table,
th,
td {
border: 1px solid white;
border-collapse: collapse;
}
td > div{
color: white;
}
tr,
td{
text-align: center;
height: 100%;
padding: 0.4%;
}
#playfield,
#bg {
width: 100%;
height: 100%;
}
#localdiv,
#remotediv {
width: 100%;
height: 100%;
float: center;
padding-top: 1%;
padding-bottom: 1%;
}
#local,
#remote {
width: 100%;
height: 100%;
table-layout: fixed;
object-fit: contain;
}
#playfield {
display: flex;
flex-direction: column;
}
#bg {
background-color: #000000;
position: absolute;
top: 0;
left: 0;
z-index: -100;
}

26
index.html Normal file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<script src="jquery-3.6.0.min.js"></script>
<script src="jquery.fittext.js"></script>
<script src="index.js"></script>
<meta charset="utf-8">
<link rel="stylesheet" href="index.css">
<title>Battleship</title>
</head>
<body>
<div id="bg"></div>
<div id="fg">
<div id="playfield">
<div id="remotediv">
<table id="remote">
</table>
</div>
<div id="localdiv">
<table id="local">
</table>
</div>
</div>
</div>
</body>
</html>

51
index.js Normal file

@ -0,0 +1,51 @@
//my personal variables
let w = 10;
let h = 10;
let x = "&#x2588;";
let o = "&#11044;";
let lgrid = new Array(w);
let rgrid = new Array(w);
//Write arrays to html
function writegrid(){
for (let i = 0; i < w; i++){
for (let j = 0; j < h; j++){
$('#lc' + i + '-' + j).html(lgrid[i][j]);
$('#rc' + i + '-' + j).html(rgrid[i][j]);
}
}
}
$(function() {
for (let i = 0; i < w; i++) {
//create columns
$('#local').append('<tr class="column" id="lt' + i + '"></tr>');
$('#remote').append('<tr class="column" id="rt' + i + '"></tr>');
for (let j = 0; j < h; j++) {
//create cells
$('#lt' + i).append('<td class="cellx" id="lcx' + i + '-' + j + '"></td>');
$('#rt' + i).append('<td class="cellx" id="rcx' + i + '-' + j + '"></td>');
//add divs to cells
$('#lcx' + i + '-' + j).append('<div class="cell" id="lc' + i + '-' + j + '"></div>');
$('#rcx' + i + '-' + j).append('<div class="cell" id="rc' + i + '-' + j + '"></div>');
//add arrays to grids
lgrid[i] = new Array(h);
rgrid[i] = new Array(h);
}
}
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){
lgrid[i][j] = x;
rgrid[i][j] = o;
} else {
lgrid[i][j] = o;
rgrid[i][j] = x;
}
}
}
//sync grid
writegrid();
});

2
jquery-3.6.0.min.js vendored Normal file

File diff suppressed because one or more lines are too long

43
jquery.fittext.js Normal file

@ -0,0 +1,43 @@
/*global jQuery */
/*!
* FitText.js 1.2
*
* Copyright 2011, Dave Rupert http://daverupert.com
* Released under the WTFPL license
* http://sam.zoy.org/wtfpl/
*
* Date: Thu May 05 14:23:00 2011 -0600
*/
(function( $ ){
$.fn.fitText = function( kompressor, options ) {
// Setup options
var compressor = kompressor || 1,
settings = $.extend({
'minFontSize' : Number.NEGATIVE_INFINITY,
'maxFontSize' : Number.POSITIVE_INFINITY
}, options);
return this.each(function(){
// Store the object
var $this = $(this);
// Resizer() resizes items based on the object width divided by the compressor * 10
var resizer = function () {
$this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));
};
// Call once to set.
resizer();
// Call on resize. Opera debounces their resize by default.
$(window).on('resize.fittext orientationchange.fittext', resizer);
});
};
})( jQuery );