Skip to content
Snippets Groups Projects
Commit 83f598aa authored by Andrew Stephen Brown's avatar Andrew Stephen Brown
Browse files

Made purely d3

parent 0ad2fb9e
No related branches found
No related tags found
No related merge requests found
Pipeline #419 failed
Source diff could not be displayed: it is too large. Options to address this: view the blob.
......@@ -19,6 +19,8 @@
This is a simple Battleship game.
</p>
<div class="attack" id="attack">
<svg xmlns="http://www.w3.org/2000/svg" id="attackBoard" width="300" height="300">
</svg>
</div>
<div class="buttons" id="but">
......@@ -32,6 +34,8 @@
<button type="button" class="shipButton" id='carrier'>Carrier</button><br><br>
</div>
<div class="defend" id="defend">
<svg xmlns="http://www.w3.org/2000/svg" id="defendBoard" width="300" height="300">
</svg>
</div>
</div>
......
c56ea7f967e240a37dc882c73a7f8f580f6a7481 {"key":"{\"uglify-es\":\"3.3.9\",\"uglifyjs-webpack-plugin\":\"1.2.7\",\"uglifyjs-webpack-plugin-options\":{\"test\":/\\.js(\\?.*)?$/i,\"warningsFilter\":function () {\n return true;\n },\"extractComments\":false,\"sourceMap\":false,\"cache\":true,\"parallel\":true,\"uglifyOptions\":{\"compress\":{\"inline\":1},\"output\":{\"comments\":/^\\**!|@preserve|@license|@cc_on/}}},\"path\":\"\\u002Fhome\\u002Fabrown95\\u002F2019\\u002Ft2\\u002Fcosc360\\u002Fa2\\u002Fdist\\u002Fbundle.js\",\"hash\":\"824d5569a000767c12133e811f9bf07b\"}","integrity":"sha512-GGuYWI0oTv6MrWMWXFC6UlL6xbB3LBnfpoO9jqAyDapBdOOhQ0Og+o8TNWvLTkFSbbEYN4J468z1MBkvbWbitg==","time":1567131783871,"size":126411}
\ No newline at end of file
import { battleship, ship } from "./battleship"
import * as React from "react"
import * as ReactDOM from "react-dom"
export class Board extends React.Component {
cellSize = 30
bs = new battleship()
createGrid = () => {
let grid = []
for (let i = 0; i < this.bs.w; i++) {
let row = []
for (let j = 0; j < this.bs.h; j++) {
row.push(<rect
className="cell"
x={+(j * this.cellSize)}
y={+(i * this.cellSize)}
width={+(this.cellSize)}
height={+(this.cellSize)}
/>)
}
grid.push(row)
}
return grid
}
render() {
return (
<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300">
<g>
{this.createGrid()}
</g>
</svg>
);
}
}
import { render, bs, bs2 } from "./render";
import { Board } from "./Board"
import * as React from "react";
import * as ReactDOM from "react-dom";
ReactDOM.render(
<Board />,
document.querySelector("#attack")
);
ReactDOM.render(
<Board />,
document.querySelector("#defend")
);
render()
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment