init
This commit is contained in:
parent
eef96965e9
commit
8bd879e44a
46
index.css
Normal file
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
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
51
index.js
Normal file
@ -0,0 +1,51 @@
|
||||
//my personal variables
|
||||
let w = 10;
|
||||
let h = 10;
|
||||
let x = "█";
|
||||
let o = "⬤";
|
||||
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
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
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 );
|
Loading…
Reference in New Issue
Block a user