diff --git a/feast.css b/feast.css
index 487afc7..10622d9 100644
--- a/feast.css
+++ b/feast.css
@@ -66,6 +66,10 @@ button {
user-select: none;
}
+#compass {
+ padding: 10px;
+}
+
.compass-button {
width: 100px;
height: 100px;
@@ -73,9 +77,16 @@ button {
user-select: none;
}
+#actions {
+ display: flex;
+ flex-wrap: wrap;
+ width: 40%;
+ padding: 15px;
+}
+
.action-button {
- width: 100px;
- height: 100px;
+ flex: 1 0 200px;
+ height: 50px;
font-size: 18px;
user-select: none;
}
@@ -148,12 +159,13 @@ button {
#game-and-stats {
margin: auto;
height: 500px;
- width: 700px;
+ max-width: 1000px;
+ padding: 15px;
display: flex;
}
#footer {
- width: 500px;
+ max-width: 800px;
margin: auto;
}
diff --git a/feast.html b/feast.html
index eb99ccb..050caf1 100644
--- a/feast.html
+++ b/feast.html
@@ -110,41 +110,6 @@
-
-
- |
-
- |
-
-
- |
-
-
- |
-
-
- |
-
- |
-
-
- |
-
-
- |
-
-
- |
-
- |
-
-
- |
-
-
- |
-
-
diff --git a/feast.js b/feast.js
index d2a26ee..13fb031 100644
--- a/feast.js
+++ b/feast.js
@@ -6,8 +6,6 @@ let currentDialog = null;
let currentFoe = null;
let dirButtons = [];
-let actionButtons = [];
-
let mode = "explore";
let actions = [];
let time = 9*60*60;
@@ -117,19 +115,17 @@ function updateExploreCompass() {
function updateExploreActions() {
updateActions();
- for (let i = 0; i < actionButtons.length; i++) {
- if (i < actions.length) {
- actionButtons[i].disabled = false;
- actionButtons[i].innerHTML = actions[i].name;
- actionButtons[i].classList.remove("inactive-button");
- actionButtons[i].classList.add("active-button");
- }
- else {
- actionButtons[i].disabled = true;
- actionButtons[i].innerHTML = "";
- actionButtons[i].classList.remove("active-button");
- actionButtons[i].classList.add("inactive-button");
- }
+ let actionButtons = document.querySelector("#actions");
+
+ actionButtons.innerHTML = "";
+
+ for (let i = 0; i < actions.length; i++) {
+ let button = document.createElement("button");
+ button.innerHTML = actions[i].name;
+ button.classList.add("active-button");
+ button.classList.add("action-button");
+ button.addEventListener("click", function() { actions[i].action(); });
+ actionButtons.appendChild(button);
}
}
@@ -365,7 +361,6 @@ function start() {
document.getElementById("game").style.display = "block";
document.getElementById("stat-button-status").addEventListener("click", status, false);
document.getElementById("log-button").addEventListener("click", toggleLog, false);
- loadActions();
loadCompass();
loadDialog();
world = createWorld();
@@ -680,17 +675,6 @@ function loadDialog() {
}
}
-function actionClicked(index) {
- actions[index].action();
-}
-
-function loadActions() {
- actionButtons = Array.from( document.querySelectorAll(".action-button"));
- for (let i = 0; i < actionButtons.length; i++) {
- actionButtons[i].addEventListener("click", function() { actionClicked(i); });
- }
-}
-
function loadCompass() {
dirButtons[NORTH_WEST] = document.getElementById("compass-north-west");
dirButtons[NORTH_WEST].addEventListener("click", function() {