From bc508119d7bcddcc8f34dfe73f5cef55fee54dfd Mon Sep 17 00:00:00 2001
From: Alexander Popov <iiiypuk@fastmail.fm>
Date: Fri, 17 Feb 2017 04:34:12 +0300
Subject: [PATCH] BTOOM!

---
 html/README.md        |   1 +
 html/Vegur/.gitignore |   1 +
 html/Vegur/README.md  |   1 +
 html/Vegur/vegur.css  |   7 ++++
 html/game.js          |  58 +++++++++++++++++++++++++++
 html/genKeys.py       |   6 ++-
 html/index.html       |  91 ++++--------------------------------------
 html/keys.html        |   1 -
 html/screen.png       | Bin 0 -> 3693 bytes
 html/styles.css       |  56 ++++++++++++++++++++++++++
 10 files changed, 135 insertions(+), 87 deletions(-)
 create mode 100644 html/README.md
 create mode 100644 html/Vegur/.gitignore
 create mode 100644 html/Vegur/README.md
 create mode 100644 html/Vegur/vegur.css
 create mode 100644 html/game.js
 delete mode 100644 html/keys.html
 create mode 100644 html/screen.png
 create mode 100644 html/styles.css

diff --git a/html/README.md b/html/README.md
new file mode 100644
index 0000000..603b336
--- /dev/null
+++ b/html/README.md
@@ -0,0 +1 @@
+![Screenshot](https://raw.githubusercontent.com/iiiypuk/hgman/master/html/screen.png)
diff --git a/html/Vegur/.gitignore b/html/Vegur/.gitignore
new file mode 100644
index 0000000..5b0b552
--- /dev/null
+++ b/html/Vegur/.gitignore
@@ -0,0 +1 @@
+*.otf
diff --git a/html/Vegur/README.md b/html/Vegur/README.md
new file mode 100644
index 0000000..acb6d04
--- /dev/null
+++ b/html/Vegur/README.md
@@ -0,0 +1 @@
+Download from [it](http://dotcolon.net/font/vegur/).
diff --git a/html/Vegur/vegur.css b/html/Vegur/vegur.css
new file mode 100644
index 0000000..ebcd0b0
--- /dev/null
+++ b/html/Vegur/vegur.css
@@ -0,0 +1,7 @@
+@font-face {
+    font-family: 'Vegur';
+    src: url('Vegur-Regular.otf') format('opentype');
+    font-weight: normal;
+    font-style: normal;
+
+}
diff --git a/html/game.js b/html/game.js
new file mode 100644
index 0000000..27139ec
--- /dev/null
+++ b/html/game.js
@@ -0,0 +1,58 @@
+var words = ['google', 'speed', 'window', 'horizon'];
+
+var lives = 6;
+var gameWord = words[Math.floor(Math.random() * words.length)].toUpperCase();
+var gameAnswered = new Array(gameWord.length + 1).join('-')
+
+window.onload = function()
+{
+  console.log(gameWord)
+  document.getElementById("WORD").innerHTML = gameAnswered;
+  document.getElementById("lives").innerHTML = 'Lives ' + lives;
+}
+
+function wrong()
+{
+  lives -= 1;
+  document.getElementById("lives").innerHTML = 'Lives ' + lives;
+}
+
+function offChar(char)
+{
+  var charButton = document.getElementById(char);
+  charButton.disabled = true; 
+
+  if (gameAnswered.split('').indexOf('-') == -1)
+  {
+    alert('You Win');
+    return;
+  }
+
+  if (lives == 0) {
+    alert('You dead');
+    return;
+  }
+
+  var indices = [];
+  var idx = gameWord.split('').indexOf(char)
+  if (idx == -1)
+  {
+    wrong();
+    return;
+  }
+  
+  while (idx != -1)
+  {
+    indices.push(idx);
+    idx = gameWord.split('').indexOf(char, idx + 1);
+  }
+  console.log(indices)
+
+  indices.forEach(function(item, indices)
+  {
+    var wordArray = gameAnswered.split('')
+    wordArray[item] = char;
+    gameAnswered = wordArray.join('');
+    document.getElementById("WORD").innerHTML = gameAnswered;
+  })
+}
diff --git a/html/genKeys.py b/html/genKeys.py
index 53af962..25b78a6 100644
--- a/html/genKeys.py
+++ b/html/genKeys.py
@@ -1,7 +1,7 @@
 #!/usr/bin/env python3
 
 __author__ = 'Alexander Popov'
-__version__ = '0.1.0'
+__version__ = '1.0.0'
 __license__ = 'MIT'
 
 usQwertyKeyboard = 'abcdefghijklmnopqrstuvwxyz'.upper()
@@ -10,7 +10,9 @@ def genKeys(alphabet):
         keys = list()
 
         for letter in alphabet:
-            keys.append('<button onclick="offChar(\'%s\')">%s</button>' % (letter, letter)) # FIX IT
+            keys.append(
+              '<button id="{l}" onclick="offChar(\'{l}\')">{l}</button>'
+              .format(l=letter))
 
         return(keys)
 
diff --git a/html/index.html b/html/index.html
index 16a7117..7e1fc9e 100644
--- a/html/index.html
+++ b/html/index.html
@@ -9,31 +9,8 @@
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
   <title>hgman</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-  <style type="text/css">
-    body {
-      font-size: 24px;
-    }
-
-    .wrap {
-      max-width: 400px;
-      margin: 10px auto;
-    }
-
-    div.word, div.lives {
-      text-align: center;
-    }
-
-    div.keyboard {
-      text-align: center;
-    }
-
-    div.keyboard button {
-      padding: 8px;
-      border: 1px solid #999;
-      box-sizing: border-box;
-      margin: 2px;
-    }
-  </style>
+  <link rel="stylesheet" type="text/css" href="styles.css">
+  <link rel="stylesheet" type="text/css" href="Vegur/vegur.css">
 </head>
 <body>
 
@@ -47,66 +24,12 @@
     </div>
 
     <div class="keyboard">
-      <button onclick="offChar('A')">A</button><button onclick="offChar('B')">B</button><button onclick="offChar('C')">C</button><button onclick="offChar('D')">D</button><button onclick="offChar('E')">E</button><button onclick="offChar('F')">F</button><button onclick="offChar('G')">G</button><button onclick="offChar('H')">H</button><button onclick="offChar('I')">I</button><button onclick="offChar('J')">J</button><button onclick="offChar('K')">K</button><button onclick="offChar('L')">L</button><button onclick="offChar('M')">M</button><button onclick="offChar('N')">N</button><button onclick="offChar('O')">O</button><button onclick="offChar('P')">P</button><button onclick="offChar('Q')">Q</button><button onclick="offChar('R')">R</button><button onclick="offChar('S')">S</button><button onclick="offChar('T')">T</button><button onclick="offChar('U')">U</button><button onclick="offChar('V')">V</button><button onclick="offChar('W')">W</button><button onclick="offChar('X')">X</button><button onclick="offChar('Y')">Y</button><button onclick="offChar('Z')">Z</button>
-  </div>
+      <button id="A" onclick="offChar('A')">A</button><button id="B" onclick="offChar('B')">B</button><button id="C" onclick="offChar('C')">C</button><button id="D" onclick="offChar('D')">D</button><button id="E" onclick="offChar('E')">E</button><button id="F" onclick="offChar('F')">F</button><button id="G" onclick="offChar('G')">G</button><button id="H" onclick="offChar('H')">H</button><button id="I" onclick="offChar('I')">I</button><button id="J" onclick="offChar('J')">J</button><button id="K" onclick="offChar('K')">K</button><button id="L" onclick="offChar('L')">L</button><button id="M" onclick="offChar('M')">M</button><button id="N" onclick="offChar('N')">N</button><button id="O" onclick="offChar('O')">O</button><button id="P" onclick="offChar('P')">P</button><button id="Q" onclick="offChar('Q')">Q</button><button id="R" onclick="offChar('R')">R</button><button id="S" onclick="offChar('S')">S</button><button id="T" onclick="offChar('T')">T</button><button id="U" onclick="offChar('U')">U</button><button id="V" onclick="offChar('V')">V</button><button id="W" onclick="offChar('W')">W</button><button id="X" onclick="offChar('X')">X</button><button id="Y" onclick="offChar('Y')">Y</button><button id="Z" onclick="offChar('Z')">Z</button>
+    </div>
+
+    <footer>2017 by iiiypuk</footer>
   </div>
 
-  <script type="text/javascript">
-    var words = ['wood', 'speed'];
-
-    var lives = 6;
-    var gameWord = words[Math.floor(Math.random() * words.length)].toUpperCase();
-    var gameAnswered = new Array(gameWord.length + 1).join('-')
-
-    window.onload = function()
-    {
-      console.log(gameWord)
-      document.getElementById("WORD").innerHTML = gameAnswered;
-      document.getElementById("lives").innerHTML = lives;
-    }
-
-    function wrong()
-    {
-      lives -= 1;
-      document.getElementById("lives").innerHTML = lives;
-    }
-
-    function offChar(char)
-    {
-      if (gameAnswered.split('').indexOf('-') == -1)
-      {
-        alert('You Win');
-        return;
-      }
-
-      if (lives == 0) {
-        alert('You dead');
-        return;
-      }
-
-      var indices = [];
-      var idx = gameWord.split('').indexOf(char)
-      if (idx == -1)
-      {
-        wrong();
-        return;
-      }
-      
-      while (idx != -1)
-      {
-        indices.push(idx);
-        idx = gameWord.split('').indexOf(char, idx + 1);
-      }
-      console.log(indices)
-
-      indices.forEach(function(item, indices)
-      {
-        var wordArray = gameAnswered.split('')
-        wordArray[item] = char;
-        gameAnswered = wordArray.join('');
-        document.getElementById("WORD").innerHTML = gameAnswered;
-      })
-    }
-  </script>
+  <script type="text/javascript" src="game.js"></script>
 </body>
 </html>
diff --git a/html/keys.html b/html/keys.html
deleted file mode 100644
index 9d09536..0000000
--- a/html/keys.html
+++ /dev/null
@@ -1 +0,0 @@
-<button onclick="offChar('A')">A</button><button onclick="offChar('B')">B</button><button onclick="offChar('C')">C</button><button onclick="offChar('D')">D</button><button onclick="offChar('E')">E</button><button onclick="offChar('F')">F</button><button onclick="offChar('G')">G</button><button onclick="offChar('H')">H</button><button onclick="offChar('I')">I</button><button onclick="offChar('J')">J</button><button onclick="offChar('K')">K</button><button onclick="offChar('L')">L</button><button onclick="offChar('M')">M</button><button onclick="offChar('N')">N</button><button onclick="offChar('O')">O</button><button onclick="offChar('P')">P</button><button onclick="offChar('Q')">Q</button><button onclick="offChar('R')">R</button><button onclick="offChar('S')">S</button><button onclick="offChar('T')">T</button><button onclick="offChar('U')">U</button><button onclick="offChar('V')">V</button><button onclick="offChar('W')">W</button><button onclick="offChar('X')">X</button><button onclick="offChar('Y')">Y</button><button onclick="offChar('Z')">Z</button>
\ No newline at end of file
diff --git a/html/screen.png b/html/screen.png
new file mode 100644
index 0000000000000000000000000000000000000000..427cbc91019d767f6743c7bdf60a9804e688456d
GIT binary patch
literal 3693
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

literal 0
HcmV?d00001

diff --git a/html/styles.css b/html/styles.css
new file mode 100644
index 0000000..9d86808
--- /dev/null
+++ b/html/styles.css
@@ -0,0 +1,56 @@
+* {
+  margin: 0; padding: 0; outline: 0;
+}
+
+body {
+  color: #032137;
+  background-color: #29516D;
+  font-family: 'Vegur';
+  font-size: 32px;
+}
+
+.wrap {
+  max-width: 400px;
+  margin: 10px auto;
+}
+
+div.word {
+  padding: 8px;
+  border-top: 1px solid #032137;
+}
+
+div.lives {
+  font-size: 24px;
+}
+
+div.word, div.lives {
+  text-align: center;
+}
+
+div.keyboard {
+  text-align: center;
+}
+
+div.keyboard button {
+  color: #032137;
+  font-family: 'Vegur';
+  border-radius: 4px;
+  font-size: 16px;
+  background-color: #708EA4;
+  padding: 8px;
+  border: 1px solid #032137;
+  box-sizing: border-box;
+  margin: 2px;
+}
+
+div.keyboard button:disabled {
+  opacity: 0.5;
+}
+
+footer {
+  border-top: 1px solid #032137;
+  padding: 8px;
+  margin-top: 20px;
+  text-align: center;
+  font-size: 16px;
+}