adam/SotM_Playfield
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Move playfield and editor html to separate files

Browse Source
This commit is contained in:
Adam Goldsmith 2017-10-02 04:30:30 -04:00
parent afcb1851cc
commit 26fa5f3398
5 changed files with 35 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
html/editor.html Normal file
View File

@ -0,0 +1,12 @@
<html>
<head>
<script src="/js/editor.js"></script>
<link rel="stylesheet" type="text/css" href="/style.css">
<title>Editor</title>
</head>
<body>
<input id="jsonUpload" type="file"><br>
<div id="deck"></div>
</body>
</html>

15
html/playfield.html Normal file
View File

@ -0,0 +1,15 @@
<html>
<head>
<script src="/js/interact.js"></script>
<script src="/js/playfield.js"></script>
<link rel="stylesheet" type="text/css" href="/style.css">
<title>Playfield</title>
</head>
<body>
<div id="card-container">
<div class="card-pile deck" data-pile="deck">DECK</div>
<div class="card-pile discard" data-pile="discard">DISCARD</div>
<div id="hand"></div>
</div>
</body>
</html>

2
js/editor.js
View File

@ -1,3 +1,5 @@
document.title = "Editor|" + window.location.pathname.split('/')[2];
window.addEventListener("load", () => { window.addEventListener("load", () => {
document.querySelector('#jsonUpload').addEventListener('change', event => { document.querySelector('#jsonUpload').addEventListener('change', event => {
let files = event.target.files; let files = event.target.files;

6
js/playfield.js
View File

@ -3,9 +3,11 @@
//jshint latedef:nofunc //jshint latedef:nofunc
/* globals interact:true */ /* globals interact:true */
let deckName, deckNum, deckJSON, cardCount, deckWidth, deckHeight, let deckNum, deckJSON, cardCount, deckWidth, deckHeight,
piles = {'deck': [], discard: []}; piles = {'deck': [], discard: []};
document.title = "Playfield|" + window.location.pathname.split('/')[2];
interact.dynamicDrop(true); interact.dynamicDrop(true);
window.addEventListener('load', () => { window.addEventListener('load', () => {
@ -18,9 +20,7 @@ window.addEventListener('load', () => {
shuffle(piles.deck); shuffle(piles.deck);
deckWidth = deckJSON.CustomDeck[deckNum].NumWidth; deckWidth = deckJSON.CustomDeck[deckNum].NumWidth;
deckHeight = deckJSON.CustomDeck[deckNum].NumHeight; deckHeight = deckJSON.CustomDeck[deckNum].NumHeight;
console.log(deckName);
}); });
deckName = document.querySelector('#card-container').getAttribute("data-deckName");
xhr.open("GET", "deck.json"); xhr.open("GET", "deck.json");
xhr.send(); xhr.send();

44
server.js
View File

@ -67,10 +67,10 @@ const server = http.createServer((req, res) => {
let deckName = decodeURI(pathParts[2]); let deckName = decodeURI(pathParts[2]);
switch (pathParts[3]) { switch (pathParts[3]) {
case 'play': case 'play':
sendPlayfield(res, deckName); sendFile(res, 'html/playfield.html');
break; break;
case 'editor': case 'editor':
sendEditor(res, deckName); sendFile(res, 'html/editor.html');
break; break;
case 'deck.png': case 'deck.png':
sendFile(res, deckName + '.png', 'image/png'); sendFile(res, deckName + '.png', 'image/png');
@ -130,46 +130,6 @@ function sendDeckIndex(res, deckName) {
res.end(html, 'utf-8'); res.end(html, 'utf-8');
} }
function sendEditor(res, deckName) {
const html = `
<html>
<head>
<script src="/js/editor.js"></script>
<link rel="stylesheet" type="text/css" href="/style.css">
<title>${deckName} - Editor</title>
</head>
<body>
<input id="jsonUpload" type="file"><br>
<div id="deck"></div>
</body>
</html>
`;
res.writeHead(200, {'Content-type': 'text/html; charset=utf-8'});
res.end(html, 'utf-8');
}
function sendPlayfield(res, deckName) {
const html = `
<html>
<head>
<script src="/js/interact.js"></script>
<script src="/js/playfield.js"></script>
<link rel="stylesheet" type="text/css" href="/style.css">
<title>${deckName} - Playfield</title>
</head>
<body>
<div id="card-container" data-deckName="${deckName}">
<div class="card-pile deck" data-pile="deck">DECK</div>
<div class="card-pile discard" data-pile="discard">DISCARD</div>
<div id="hand"></div>
</div>
</body>
</html>`;
res.writeHead(200, {'Content-type': 'text/html; charset=utf-8'});
res.end(html, 'utf-8');
}
function sendFileJSON(res, deckName) { function sendFileJSON(res, deckName) {
fs.readFile(deckName + '.json', (error, content) => { fs.readFile(deckName + '.json', (error, content) => {
console.log(JSON.parse(content)); console.log(JSON.parse(content));