completed name ui

web/game.js

@@ -113,21 +113,22 @@ function gameOver() {
         fill(255, 0, 0);
         textSize(40);
         textAlign(CENTER);
-        text("Game Over", width / 2, height / 2 - 80);
+        text("Game Over", width / 2, height / 2 - height/6);
 
         fill(255, 255, 255)
         textSize(18);
         textAlign(CENTER);
-        text("Score: " + int(time), width / 2, height / 2 - 55);
+        text("Score: " + int(time), width / 2, height / 2 - height/8);
 
         textSize(32);
+        textAlign(CENTER, CENTER);
         text(letters[currentIndex[0]], width / 2 - 30, height / 2);
         text(letters[currentIndex[1]], width / 2, height / 2);
         text(letters[currentIndex[2]], width / 2 + 30, height / 2);
 
-        text("Restart", width / 2, height / 2 + 45);
+        text("Restart", width / 2, height / 2 + height/12);
 
-        text("Main Menu", width / 2, height / 2 + 90);
+        text("Main Menu", width / 2, height / 2 + height/6);
         pop();
     }
 }
@@ -294,60 +295,32 @@ function nameSubmit() {
         keyReleasedFlag = false;
     }
 }
-function nameDraw() {
+function nameDraw(positiony) {
-    if (entered) {
+    if (iIndex == 0) {
-        if (buttonSelectDead == 0) {
+        push()
-            push()
+        stroke(205, 205, 205)
+        strokeWeight(2)
+        fill(0, 0, 0, 0)
+        rect(width / 2 - 30, height / positiony, 30, 40)
+        pop()
+    }
+    if (iIndex == 1) {
+        push()
+        stroke(205, 205, 205)
+        strokeWeight(2)
+        fill(0, 0, 0, 0)
+        rect(width / 2, height / positiony, 30, 40)
+        pop()
+    }
+    if (iIndex == 2) {
+        push()
+        stroke(205, 205, 205)
+        strokeWeight(2)
+        fill(0, 0, 0, 0)
+        rect(width / 2 + 30, height / positiony, 30, 40)
+        pop()
+    }
 
-            stroke(205, 205, 205)
-            strokeWeight(2)
-            fill(0, 0, 0, 0)
-            rect(width / 2, height / 2 - 15, 90, 40)
-            pop()
-        }
-        if (buttonSelectDead == 1) {
-            push()
-            stroke(205, 205, 205)
-            strokeWeight(2)
-            fill(0, 0, 0, 0)
-            rect(width / 2, height / 2 + 30, 110, 40)
-            pop()
-        }
-        if (buttonSelectDead == 2) {
-            push()
-            stroke(205, 205, 205)
-            strokeWeight(2)
-            fill(0, 0, 0, 0)
-            rect(width / 2, height / 2 + 75, 160, 40)
-            pop()
-        }
-    }
-    else {
-        if (iIndex == 0) {
-            push()
-            stroke(205, 205, 205)
-            strokeWeight(2)
-            fill(0, 0, 0, 0)
-            rect(width / 2 - 30, height / 2 - 15, 30, 40)
-            pop()
-        }
-        if (iIndex == 1) {
-            push()
-            stroke(205, 205, 205)
-            strokeWeight(2)
-            fill(0, 0, 0, 0)
-            rect(width / 2, height / 2 - 15, 30, 40)
-            pop()
-        }
-        if (iIndex == 2) {
-            push()
-            stroke(205, 205, 205)
-            strokeWeight(2)
-            fill(0, 0, 0, 0)
-            rect(width / 2 + 30, height / 2 - 15, 30, 40)
-            pop()
-        }
-    }
 }
 // the function draw() is called every frame
 function draw() {
@@ -408,7 +381,35 @@ function draw() {
         }
     }
     if (isDead) {
-        nameDraw();
+        if (entered) {
+            if (buttonSelectDead == 0) {
+                push()
+                stroke(205, 205, 205)
+                strokeWeight(2)
+                fill(0, 0, 0, 0)
+                rect(width / 2, height / 2, 90, 40)
+                pop()
+            }
+            if (buttonSelectDead == 1) {
+                push()
+                stroke(205, 205, 205)
+                strokeWeight(2)
+                fill(0, 0, 0, 0)
+                rect(width / 2, height / 2 + height/12, 110, 40)
+                pop()
+            }
+            if (buttonSelectDead == 2) {
+                push()
+                stroke(205, 205, 205)
+                strokeWeight(2)
+                fill(0, 0, 0, 0)
+                rect(width / 2, height / 2 + height/6, 160, 40)
+                pop()
+            }
+        }
+        else {
+            nameDraw(2);
+        }
     }
 }
 async function randPatern() {

web/js/Menu.js

@@ -73,17 +73,28 @@ function pauseMenu() {
 }
 
 function scoremenu() {
-    textAlign(CENTER);
+    textAlign(CENTER, CENTER);
     textSize(50);
     fill(255, 255, 255);
-    text("Score", width / 2, height / 2 - height / 6);
+    text("Score", width / 2, height / 4);
     textSize(32);
-    text(letters[currentIndex[0]], width / 2 - 30, height / 2);
+    text(letters[currentIndex[0]], width / 2 - 30, height / 3);
-    text(letters[currentIndex[1]], width / 2, height / 2);
+    text(letters[currentIndex[1]], width / 2, height / 3);
-    text(letters[currentIndex[2]], width / 2 + 30, height / 2);
+    text(letters[currentIndex[2]], width / 2 + 30, height / 3);
 
     if (scorescreenOn && keyReleasedFlag) {
         nameSubmit();
     }
-    nameDraw();
+
+    if (entered) {
+        push()
+        stroke(205, 205, 205)
+        strokeWeight(2)
+        fill(0, 0, 0, 0)
+        rect(width / 2, height / 3, 90, 40)
+        pop()
+    }
+    else {
+        nameDraw(3);
+    }
 }