Compare commits

..

No commits in common. "1f055471d36e7f53c3337fd88b6557091cb9b17b" and "ee365d4c1cbf559b9da231d3949ecbd780865c38" have entirely different histories.

7 changed files with 104 additions and 177 deletions

View File

@ -1,49 +0,0 @@
html, body {
margin: 0;
padding: 0;
overflow: hidden;
font-family: sans-serif;
}
div#settings {
position: absolute;
border-radius: 50%;
background: rgba(0, 0, 0, 0.5);
height: 1.5rem;
width: 1.5rem;
display: grid;
right: 5px;
top: 5px;
cursor: pointer;
z-index: 1000;
}
div#settings > img {
height: 1rem;
margin: auto;
cursor: pointer;
}
div#menu {
background: rgba(0, 0, 0, 0.5);
color: white;
padding-top: 2rem;
display: none;
position: absolute;
right: 0;
top: 0;
height: 100vh;
width: 20vw;
text-align: center;
}
div#menu > ul {
list-style-type: none;
margin: 0;
padding: 0;
}
div#menu > ul > li {
padding-top: 10px;
cursor: pointer;
}

View File

@ -1,33 +1,49 @@
html, body { html, body {
margin: 0; margin: 0;
height: 100vh; padding: 0;
width: 100vw; overflow: hidden;
background: lightskyblue;
font-family: sans-serif; font-family: sans-serif;
} }
h1 { div#settings {
text-align: center; position: absolute;
} border-radius: 50%;
background: rgba(0, 0, 0, 0.5);
ul { height: 1.5rem;
list-style-type: none; width: 1.5rem;
text-align: center;
padding: 0;
display: grid; display: grid;
right: 5px;
top: 5px;
cursor: pointer;
z-index: 1000;
} }
li { div#settings > img {
width: 25vw; height: 1rem;
padding: 10px 20px; margin: auto;
margin: 0 auto;
margin-top: 20px;
background: #9ea399;
border-radius: 5px;
border: 2px solid #1c1914;
cursor: pointer; cursor: pointer;
} }
li:hover { div#menu {
box-shadow: 2px 2px #1c1914; background: rgba(0, 0, 0, 0.5);
color: white;
padding-top: 2rem;
display: none;
position: absolute;
right: 0;
top: 0;
height: 100vh;
width: 20vw;
text-align: center;
}
div#menu > ul {
list-style-type: none;
margin: 0;
padding: 0;
}
div#menu > ul > li {
padding-top: 10px;
cursor: pointer;
} }

View File

@ -1,27 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/game.css">
<script type="module" src="src/game.js"></script>
<title>Game</title>
</head>
<body>
<div id="settings">
<img src="res/cog-solid.svg" alt="Settings">
</div>
<div id="menu">
<ul>
<li><a id="close">Quit game</a></li>
<li><a id="save">Save progress</a></li>
<li><a id="mainmenu">Return to main menu</a></li>
</ul>
</div>
<div id="board">
<!-- Renderer will push content here -->
</div>
</body>
</html>

View File

@ -3,16 +3,24 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Caa-game</title>
<link rel="stylesheet" href="css/index.css"> <link rel="stylesheet" href="css/index.css">
<script type="module" src="src/index.js"></script>
<title>Game</title>
</head> </head>
<body> <body>
<h1>Caa-game</h1> <div id="settings">
<img src="res/cog-solid.svg" alt="Settings">
</div>
<div id="menu">
<ul> <ul>
<li id="resume">Resume game</li> <li><a id="close">Quit game</a></li>
<li id="settings">Settings</li> <li><a id="save">Save progress</a></li>
<li id="quit">Quit game</li>
</ul> </ul>
<script src="src/index.js"></script> </div>
<div id="board">
<!-- Renderer will push content here -->
</div>
</body> </body>
</html> </html>

View File

@ -1,15 +1,13 @@
const { app, BrowserWindow, ipcMain } = require('electron') const { app, BrowserWindow, ipcMain } = require('electron')
const path = require('path') const path = require('path')
require('electron-reload')(__dirname, { require('electron-reload')(__dirname);
electron: path.join(__dirname, 'node_modules', '.bin', 'electron')
});
function createWindow () { function createWindow () {
// Create the browser window. // Create the browser window.
const win = new BrowserWindow({ const win = new BrowserWindow({
width: 640, width: 800,
height: 320, height: 600,
backgroundColor: '#111', backgroundColor: '#111',
resizable: false, resizable: false,
frame: false, frame: false,

View File

@ -1,52 +0,0 @@
const { ipcRenderer, remote } = require('electron')
var asdf = require('asdf-games');
const { Game, Container, math, KeyControls, MouseControls, Text, Texture, TileMap, Sprite, TileSprite } = asdf;
const window = { w: 640, h: 320 };
const game = new Game(window.w, window.h, true);
ipcRenderer.send('resize', window);
const { scene, w, h } = game;
var Player = require("./src/entities/player.js")
var Level = require("./src/levels/level.js")
const mouseAim = new MouseControls(document.getElementById('board'));
const keys = new KeyControls();
var player = new Player(keys, window);
var level = new Level(window, keys, player);
scene.add(level);
scene.add(player);
game.run((dt ,t) => {
if (mouseAim.isDown) {
console.log('cliccccccccccc');
}
// Check gamestate
// TODO
});
/* *********************************************************
Settings behavior
********************************************************* */
// Opening and closing of menu.
document.getElementById('settings').addEventListener('click', () => {
const menuRef = document.getElementById('menu');
menuRef.style.display = menuRef.style.display === "block" ? "none" : "block";
});
// Quit Game handling.
document.getElementById('close').addEventListener('click', () => {
remote.app.quit();
});
// Return to main menu button
document.getElementById('mainmenu').addEventListener('click', () => {
remote.getCurrentWindow().loadFile(__dirname + "/index.html");
});

View File

@ -1,14 +1,47 @@
const { remote } = require("electron"); const { ipcRenderer, remote } = require('electron')
document.addEventListener("DOMContentLoaded", () => { var asdf = require('asdf-games');
const { Game, Container, math, KeyControls, MouseControls, Text, Texture, TileMap, Sprite, TileSprite } = asdf;
// Start game const window = { w: 640, h: 320 };
document.getElementById('resume').addEventListener("click", () => {
remote.getCurrentWindow().loadFile(__dirname + "/game.html"); const game = new Game(window.w, window.h, true);
ipcRenderer.send('resize', window);
const { scene, w, h } = game;
var Player = require("./src/entities/player.js")
var Level = require("./src/levels/level.js")
const mouseAim = new MouseControls(document.getElementById('board'));
const keys = new KeyControls();
var player = new Player(keys, window);
var level = new Level(window, keys, player);
scene.add(level);
scene.add(player);
game.run((dt ,t) => {
if (mouseAim.isDown) {
console.log('cliccccccccccc');
}
// Check gamestate
// TODO
}); });
// Quit game /* *********************************************************
document.getElementById('quit').addEventListener("click", () => { Settings behavior
********************************************************* */
// Opening and closing of menu.
document.getElementById('settings').addEventListener('click', () => {
const menuRef = document.getElementById('menu');
menuRef.style.display = menuRef.style.display === "block" ? "none" : "block";
});
// Quit Game handling.
document.getElementById('close').addEventListener('click', () => {
remote.app.quit(); remote.app.quit();
}); });
});