add wolfenstein 3d to games directory

17 files changed, 820 insertions, 0 deletions

diff --git a/wolf3d/html/copyright.html b/wolf3d/html/copyright.html
new file mode 100644
index 0000000..cee50f1
--- /dev/null
+++ b/wolf3d/html/copyright.html
@@ -0,0 +1,27 @@
+<div id="copyright">
+    <div class="content" style="position: fixed; left: 0; top: 0; bottom: 0; right: 0; overflow: auto; padding: 32px;">
+        <div style="width: 100%; text-align: center;">
+            <img src="images/wolfenstein3d-logo.png"/>
+        </div>
+        <div class="clear"></div>
+        <div>
+            <img src="images/cake.png"/>
+        </div>
+        <div class="readme process red">HAPPY BIRTHDAY!</div>
+        <div class="readme process">Mobile version coming soon...</div>
+        <div class="clear"></div>
+        <div class="text readme title">COPYRIGHT NOTICE</div>
+        <div class="clear"></div>
+        <div class="readme process">All rights belong to </div>
+        <a href="http://www.idsoftware.com" target="_blank"><span class="readme process cyan">id Software</span></a>
+        <br>
+        <div class="readme process">For further information please refer to </div>
+        <a href="COPYING.txt" target="_blank"><div class="readme process red">this document</div></a>
+        <div class="readme process">Developer contact</div>
+        <a href="mailto:[email protected]" target="_blank"><span class="readme process green">E-mail</span></a>
+        <div class="clear"></div>
+        <a href="app.crx.php" target="_blank"><span class="readme process title">Add game as Chrome Extension</span></a>
+        <div class="clear"></div>
+        <div id="start" class="text readme" style="cursor: pointer;">CLICK TO PLAY!</div>
+    </div>
+</div>
diff --git a/wolf3d/html/credits.html b/wolf3d/html/credits.html
new file mode 100644
index 0000000..7bff5bd
--- /dev/null
+++ b/wolf3d/html/credits.html
@@ -0,0 +1,4 @@
+<div id="credits" class="menu">
+    <img src="images/credits.png"/>
+    <img src="images/credits-stripes.png" class="stripes"></div>
+</div>
\ No newline at end of file
diff --git a/wolf3d/html/customize.html b/wolf3d/html/customize.html
new file mode 100644
index 0000000..94d4d6d
--- /dev/null
+++ b/wolf3d/html/customize.html
@@ -0,0 +1,82 @@
+<div id="customize" class="menu">
+    <img src="images/customize.png" class="title"/>
+    <img src="images/customize-stripes.png" class="stripes"/>
+    <img src="images/menu-help.png" class="help"/>
+    <div style="position: absolute; top: 50%; margin-top: -130px; width: 100%; z-index: 1;">
+        <div class="text readthis">Mouse</div>
+        <table cellpadding="0" cellspacing="0">
+            <tr>
+                <td></td>
+                <td><div class="text">Run</div></td>
+                <td><div class="text">Open</div></td>
+                <td><div class="text">Fire</div></td>
+                <td><div class="text">Strafe</div></td>
+            </tr>
+        </table>
+        <table cellpadding="0" cellspacing="0" class="option disabled">
+            <tr>
+                <td></td>
+                <td><div class="text"></div></td>
+                <td><div class="text disabled">b2</div></td>
+                <td><div class="text disabled">b0</div></td>
+                <td><div class="text disabled">b1</div></td>
+            </tr>
+        </table>
+        <div class="text readthis">Joystick/GamePad</div>
+        <table cellpadding="0" cellspacing="0">
+            <tr>
+                <td></td>
+                <td><div class="text">Run</div></td>
+                <td><div class="text">Open</div></td>
+                <td><div class="text">Fire</div></td>
+                <td><div class="text">Strafe</div></td>
+            </tr>
+        </table>
+        <table cellpadding="0" cellspacing="0" class="option disabled">
+            <tr>
+                <td></td>
+                <td><div class="text disabled">b3</div></td>
+                <td><div class="text disabled">b2</div></td>
+                <td><div class="text disabled">b0</div></td>
+                <td><div class="text disabled">b1</div></td>
+            </tr>
+        </table>
+        <div class="text readthis">Keyboard</div>
+        <table cellpadding="0" cellspacing="0">
+            <tr>
+                <td></td>
+                <td><div class="text">Run</div></td>
+                <td><div class="text">Open</div></td>
+                <td><div class="text">Fire</div></td>
+                <td><div class="text">Strafe</div></td>
+            </tr>
+        </table>
+        <table cellpadding="0" cellspacing="0" class="option">
+            <tr>
+                <td><div id="customizecursor" class="cursor"></div></td>
+                <td><div class="text">Shift</div></td>
+                <td><div class="text">Space</div></td>
+                <td><div class="text">Ctrl</div></td>
+                <td><div class="text">Alt</div></td>
+            </tr>
+        </table>
+        <table cellpadding="0" cellspacing="0">
+            <tr>
+                <td></td>
+                <td><div class="text">Left</div></td>
+                <td><div class="text">Right</div></td>
+                <td><div class="text">Frwd</div></td>
+                <td><div class="text">Bkwrd</div></td>
+            </tr>
+        </table>
+        <table cellpadding="0" cellspacing="0" class="option">
+            <tr>
+                <td></td>
+                <td><div class="text">Left</div></td>
+                <td><div class="text">Right</div></td>
+                <td><div class="text">Up</div></td>
+                <td><div class="text">Down</div></td>
+            </tr>
+        </table>
+    </div>
+</div>
diff --git a/wolf3d/html/detail.html b/wolf3d/html/detail.html
new file mode 100644
index 0000000..79d49f8
--- /dev/null
+++ b/wolf3d/html/detail.html
@@ -0,0 +1,57 @@
+<div id="detail" class="menu">
+    <div class="text title">Select graphic detail resolution</div>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="detailcursor" class="cursor"></div>
+        <table cellpadding="0" cellspacing="0">
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">160</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">120</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">320</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">240</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">480</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">360</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch selected"></div></td>
+                <td><div class="text selected">640</div></td>
+                <td><div class="text selected">x</div></td>
+                <td><div class="text selected">480</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">800</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">600</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">960</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">720</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">1120</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">840</div></td>
+            </tr>
+            <tr>
+                <td><div class="switch"></div></td>
+                <td><div class="text">1280</div></td>
+                <td><div class="text">x</div></td>
+                <td><div class="text">960</div></td>
+            </tr>
+        </table>
+    </div>
+</div>
diff --git a/wolf3d/html/difficulty.html b/wolf3d/html/difficulty.html
new file mode 100644
index 0000000..99bed12
--- /dev/null
+++ b/wolf3d/html/difficulty.html
@@ -0,0 +1,12 @@
+<div id="difficulty" class="menu">
+    <div class="text title">How tough are you?</div>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="difficultycursor" class="cursor"></div>
+        <div id="difficultypicture"></div>
+        <div class="text">Can I play, Daddy?</div>
+        <div class="text">Don't hurt me.</div>
+        <div class="text selected">Bring 'em on!</div>
+        <div class="text">I am Death incarnate!</div>
+    </div>
+</div>
diff --git a/wolf3d/html/episode.html b/wolf3d/html/episode.html
new file mode 100644
index 0000000..b3febd9
--- /dev/null
+++ b/wolf3d/html/episode.html
@@ -0,0 +1,42 @@
+<div id="episode" class="menu">
+    <div class="text title">Which episode to play?</div>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="episodecursor" class="cursor"></div>
+        <div class="episode" episode="Escape from Wolfenstein">
+            <img src="images/episode1.png"/>
+            <div class="text selected">Episode 1</div>
+            <div class="text selected">Escape from Wolfenstein</div>
+        </div>
+        <div class="episode" episode="Operation: Eisenfaust">
+            <img src="images/episode2.png"/>
+            <div class="text">Episode 2</div>
+            <div class="text">Operation: Eisenfaust</div>
+        </div>
+        <div class="episode" episode="Die, Fuhrer, Die!">
+            <img src="images/episode3.png"/>
+            <div class="text">Episode 3</div>
+            <div class="text">Die, Fuhrer, Die!</div>
+        </div>
+        <div class="episode" episode="A Dark Secret">
+            <img src="images/episode4.png"/>
+            <div class="text">Episode 4</div>
+            <div class="text">A Dark Secret</div>
+        </div>
+        <div class="episode" episode="Trail of the Madman">
+            <img src="images/episode5.png"/>
+            <div class="text">Episode 5</div>
+            <div class="text">Trail of the Madman</div>
+        </div>
+        <div class="episode" episode="Confrontation">
+            <img src="images/episode6.png"/>
+            <div class="text">Episode 6</div>
+            <div class="text">Confrontation</div>
+        </div>
+        <div class="episode" episode="Spear of Destiny">
+            <img src="images/episode7.png"/>
+            <div class="text">Episode 7</div>
+            <div class="text">Spear of Destiny</div>
+        </div>
+    </div>
+</div>
diff --git a/wolf3d/html/game.html b/wolf3d/html/game.html
new file mode 100644
index 0000000..52c22c6
--- /dev/null
+++ b/wolf3d/html/game.html
@@ -0,0 +1,50 @@
+<div id="game">
+    <div id="container">
+        <canvas id="background"></canvas>
+        <canvas id="view" width="240" height="160"></canvas>
+        <canvas id="hand" width="512" height="512"></canvas>
+        <canvas id="mask"></canvas>
+        <div id="deathcam" style="display: none;"></div>
+        <div id="letsseethatagain">
+            <div class="text bitmap">LET'S SEE THAT AGAIN!</div>
+        </div>
+        <div id="endlevelscreen">
+            <div class="picture"></div>
+            <div class="text bitmap floor">FLOOR 1</div>
+            <div class="text bitmap completed">COMPLETED</div>
+            <div class="text bitmap bonus">BONUS     0</div>
+            <div class="text bitmap time">TIME 01:52</div>
+            <div class="text bitmap par"> PAR 01:30</div>
+            <div class="text bitmap kill">    KILL RATIO  63%</div>
+            <div class="text bitmap secret">  SECRET RATIO  20%</div>
+            <div class="text bitmap treasure">TREASURE RATIO  26%</div>
+        </div>
+        <div id="secretlevelscreen">
+            <div class="picture"></div>
+            <div class="text bitmap secret">SECRET FLOOR</div>
+            <div class="text bitmap completed">COMPLETED!</div>
+            <div class="text bitmap bonus">15000 BONUS!</div>
+        </div>
+        <div id="wingamescreen">
+            <div class="picture"></div>
+            <div class="text bitmap win">YOU WIN!</div>
+            <div class="text bitmap total">TOTAL TIME</div>
+            <div class="text bitmap time">59:31</div>
+            <div class="text bitmap averages">AVERAGES</div>
+            <div class="text bitmap kill">    KILL  63%</div>
+            <div class="text bitmap secret">  SECRET  20%</div>
+            <div class="text bitmap treasure">TREASURE  26%</div>
+        </div>
+        <img id="gamepause" src="images/game-pause.png"/>
+        <div id="hud">
+            <canvas id="floor" width="48" height="48"></canvas>
+            <canvas id="score" width="200" height="48"></canvas>
+            <canvas id="lives" width="48" height="48"></canvas>
+            <canvas id="face" width="72" height="88"></canvas>
+            <canvas id="health" width="120" height="48"></canvas>
+            <canvas id="ammo" width="96" height="48"></canvas>
+            <canvas id="keys" width="24" height="96"></canvas>
+            <canvas id="weapon" width="144" height="72"></canvas>
+        </div>
+    </div>
+</div>
diff --git a/wolf3d/html/gamemenu.html b/wolf3d/html/gamemenu.html
new file mode 100644
index 0000000..0d10429
--- /dev/null
+++ b/wolf3d/html/gamemenu.html
@@ -0,0 +1,18 @@
+<div id="gamemenu" class="menu">
+    <img src="images/options.png" class="title"/>
+    <img src="images/options-stripes.png" class="stripes"/>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="gamemenucursor" class="cursor"></div>
+        <div class="text selected">New Game</div>
+        <div class="text">Sound</div>
+        <div class="text">Control</div>
+        <div class="text">Load Game</div>
+        <div class="text">Save Game</div>
+        <div class="text">Graphic Detail</div>
+        <div class="text">Read This!</div>
+        <div class="text">End Game</div>
+        <div class="text readthis">Back to Game</div>
+        <div class="text">Quit</div>
+    </div>
+</div>
diff --git a/wolf3d/html/highscores.html b/wolf3d/html/highscores.html
new file mode 100644
index 0000000..bd22391
--- /dev/null
+++ b/wolf3d/html/highscores.html
@@ -0,0 +1,44 @@
+<div id="highscores" class="menu">
+    <img src="images/highscores.png" class="title"/>
+    <img src="images/highscores-stripes.png" class="stripes"/>
+    <img src="images/highscores-name.png" class="name"/>
+    <img src="images/highscores-level.png" class="level"/>
+    <img src="images/highscores-score.png" class="score"/>
+    <table class="rows">
+        <tr>
+            <td class="col-name"><div class="text highscores">id software-'92</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+        <tr>
+            <td class="col-name"><div class="text highscores">Adrian Carmack</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+        <tr>
+            <td class="col-name"><div class="text highscores">John Carmack</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+        <tr>
+            <td class="col-name"><div class="text highscores">Kevin Cloud</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+        <tr>
+            <td class="col-name"><div class="text highscores">Tom Hall</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+        <tr>
+            <td class="col-name"><div class="text highscores">John Romero</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+        <tr>
+            <td class="col-name"><div class="text highscores">Jay Wilbur</div></td>
+            <td class="col-level"><div class="text highscores">E1/L1</div></td>
+            <td class="col-score"><div class="text highscores">10000</div></td>
+        </tr>
+    </table>
+</div>
diff --git a/wolf3d/html/loadgame.html b/wolf3d/html/loadgame.html
new file mode 100644
index 0000000..3fb91bc
--- /dev/null
+++ b/wolf3d/html/loadgame.html
@@ -0,0 +1,38 @@
+<div id="loadgame" class="menu">
+    <img src="images/loadgame.png" class="title"/>
+    <img src="images/loadgame-stripes.png" class="stripes"/>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="loadcursor" class="cursor"></div>
+        <div class="slot empty selected">
+            <div class="text highscores">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+    </div>
+</div>
diff --git a/wolf3d/html/menu.html b/wolf3d/html/menu.html
new file mode 100644
index 0000000..8392c37
--- /dev/null
+++ b/wolf3d/html/menu.html
@@ -0,0 +1,18 @@
+<div id="menu" class="menu">
+    <img src="images/options.png" class="title"/>
+    <img src="images/options-stripes.png" class="stripes"/>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="menucursor" class="cursor"></div>
+        <div class="text selected">New Game</div>
+        <div class="text">Sound</div>
+        <div class="text">Control</div>
+        <div class="text">Load Game</div>
+        <div class="text disabled">Save Game</div>
+        <div class="text">Graphic Detail</div>
+        <div class="text readthis">Read This!</div>
+        <div class="text">View Scores</div>
+        <div class="text disabled">Back to Demo</div>
+        <div class="text">Quit</div>
+    </div>
+</div>
diff --git a/wolf3d/html/msg.html b/wolf3d/html/msg.html
new file mode 100644
index 0000000..38d67c0
--- /dev/null
+++ b/wolf3d/html/msg.html
@@ -0,0 +1,3 @@
+<div id="msg">
+    <div id="msgtext"></div>
+</div>
diff --git a/wolf3d/html/pc13.html b/wolf3d/html/pc13.html
new file mode 100644
index 0000000..0aef359
--- /dev/null
+++ b/wolf3d/html/pc13.html
@@ -0,0 +1,3 @@
+<div id="pc13">
+    <img src="images/pc13.png"/>
+</div>
diff --git a/wolf3d/html/readthis.html b/wolf3d/html/readthis.html
new file mode 100644
index 0000000..6aba2bb
--- /dev/null
+++ b/wolf3d/html/readthis.html
@@ -0,0 +1,355 @@
+<div id="readthis" class="readme-view">
+    <div class="up"></div>
+    <div class="down"></div>
+    <div class="left"></div>
+    <div class="right"></div>
+    <div class="text pagenr">pg 1 of 22</div>
+    <div class="page selected">
+        <div class="text readme title">QUICK COMMAND REFERENCE</div>
+        <div class="clear"></div>
+        <div class="readme process">Arrows move. Ctrl shoots. Alt strafes.</div>
+        <div class="clear"></div>
+        <table cellspacing="0" cellpadding="0">
+            <tr>
+                <td><span class="text readme">F1</span></td>
+                <td><span class="text readme">Help</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F2</span></td>
+                <td><span class="text readme">Save game (F8 for Quick save)</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F3</span></td>
+                <td><span class="text readme">Load game (F9 for Quick load)</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F4</span></td>
+                <td><span class="text readme">Sound menu</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F5</span></td>
+                <td><span class="text readme">Graphic detail menu</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F6</span></td>
+                <td><span class="text readme">Controls menu</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F7</span></td>
+                <td><span class="text readme">End Game</span></td>
+            </tr>
+            <tr>
+                <td><span class="text readme">F10</span></td>
+                <td><span class="text readme">Exit to DOS</span></td>
+            </tr>
+        </table>
+        <div class="clear"></div>
+        <div class="readme process">Read on for more information.</div>
+    </div>
+    <div class="page">
+        <div class="clear"></div>
+        <div class="clear"></div>
+        <div class="text readme title" style="text-align: center; width: 100%;">TABLE OF CONTENTS</div>
+        <div class="clear"></div>
+        <div class="clear"></div>
+        <div style="width: 100%;">
+            <center>
+                <table cellspacing="0" cellpadding="0">
+                    <tr>
+                        <td>
+                            <span class="text readme">STORY</span>
+                            <span class="text readme" style="float: right;">. . . . . . . . . . . . . .</span>
+                        </td>
+                        <td><span class="text readme">3</span></td>
+                    </tr>
+                    <tr>
+                        <td>
+                            <span class="text readme">CONTROLS</span>
+                            <span class="text readme" style="float: right;">. . . . . . . . . . .</span>
+                        </td>
+                        <td><span class="text readme">6</span></td>
+                    </tr>
+                    <tr>
+                        <td>
+                            <span class="text readme">ABOUT</span>
+                            <span class="text readme cyan">Id</span>
+                            <span class="text readme" style="float: right;">. . . . . . . . . . . .</span>
+                        </td>
+                        <td><span class="text readme">12</span></td>
+                    </tr>
+                    <tr>
+                        <td>
+                            <span class="text readme">MORE WOLFENSTEIN!</span>
+                            <span class="text readme" style="float: right;">. . . .</span>
+                        </td>
+                        <td><span class="text readme">16</span></td>
+                    </tr>
+                    <tr>
+                        <td>
+                            <span class="text readme green">SOFTWARE CREATIONS</span>
+                            <span class="text readme" style="float: right;">. . .</span>
+                        </td>
+                        <td><span class="text readme">20</span></td>
+                    </tr>
+                </table>
+            </center>
+        </div>
+    </div>
+    <div class="page">
+        <div style="width: 100%; text-align: center;">
+            <img src="images/wolfenstein3d-logo.png"/>
+        </div>
+        <img src="images/stealth-bj.png" style="float: left; margin: 0 24px 24px 0;"/>
+        <div class="readme process">You stand over the guard's body, grabbing frantically for his gun.
+            You're not sure if the other guards heard his muffled scream.
+            Deep in the belly of a Nazi dungeon, you've only a knife, a gun, and your wits to aid your escape.
+        </div>
+    </div>
+    <div class="page">
+        <img src="images/castle-wolfenstein.png" style="float: left; margin: 0 24px 24px 0;"/>
+        <div class="readme process">Just a few weeks ago you were on a reconnaissance mission of extreme importance.
+            You were to infiltrate the Nazi fortress and find the plans for Operation Eisenfaust.
+            Captured in your attempt, you were taken to their prison, and awaited your execution.
+            Only you know where the plans are kept, and the Allies will face a great defeat if you don't escape!
+            You must face the horrors of the prison keep known as Wolfenstein.
+        </div>
+    </div>
+    <div class="page">
+        <img src="images/twoguns-bj.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="readme process">Captain William J. "B.J." Blazkowicz, you've got a gun and eight floors of hell to get through. Good luck!</div>
+        <div class="clear"></div>
+        <div class="readme process">Hey, if you make it, you'll have something to tell your grandkids about . . . .</div>
+        <div class="clear"></div>
+        <div class="readme process">If you don't, at least you'll go out in a blaze of glory!</div>
+    </div>
+    <div class="page">
+        <img src="images/controls-readthis.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="text readme title" style="width: 600px; margin-bottom: 24px;">CONTROLS</div>
+        <div class="readme process">In Wolfenstein 3-D, you can use the keyboard, mouse, joystick, or Gravis PC Gamepad.</div>
+        <div class="clear"></div>
+        <div class="readme process">To move around the menus, use the arrow keys to move from item to item, then press</div>
+        <span class="text readme green">Enter</span>
+        <div class="readme process">to select that item.</div>
+        <span class="text readme green">Esc</span>
+        <div class="readme process">always backs out.
+            You can press the first letter of a menu item to go to that item.
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">Or use the mouse, joystick, or Gamepad-- they work, too!</div>
+    </div>
+    <div class="page">
+        <img src="images/keyboard-readthis.png" style="float: left; margin: 0 24px 24px 0;"/>
+        <div class="readme process">Once you are in the game, use the arrow keys to move. Hold down</div>
+        <span class="text readme green">Shift</span>
+        <div class="readme process">to run fast.</div>
+        <div class="clear"></div>
+        <span class="text readme">Press</span>
+        <span class="text readme green">Ctrl</span>
+        <div class="readme process">to fire your weapon.</div>
+        <div class="clear"></div>
+        <span class="text readme">Use</span>
+        <span class="text readme green">Alt</span>
+        <div class="readme process">with the left and right arrows to slide side to side instead of turning left or right.
+            This is called "Strafe Mode".
+        </div>
+        <div class="clear"></div>
+        <span class="text readme">Press</span>
+        <span class="text readme green">Space</span>
+        <div class="readme process">to Open Doors and activate elevators to go to the next floor of the keep.</div>
+    </div>
+    <div class="page">
+        <img src="images/controls-readthis.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="readme process">When using the mouse or joystick, use button 1 to shoot, button 2 to strafe.</div>
+        <div class="clear"></div>
+        <div class="readme process">With a three-button mouse, use the third button to open doors.</div>
+        <div class="clear"></div>
+        <div class="readme process">Gravis PC Gamepads have a fourth button, useful as a run button.</div>
+    </div>
+    <div class="page">
+        <div class="readme process">Once you have more than one weapon, the keys 1-4 choose the weapons:</div>
+        <div class="clear"></div>
+        <div style="width: 100%; text-align: center;">
+            <img src="images/weapons-readthis.png"/>
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">Holding down the fire button is fun, but short bursts save bullets.</div>
+    </div>
+    <div class="page">
+        <div class="readme process">Some walls in the prison can be pushed back to reveal hidden rooms.
+            Hold down Space to push the wall in front of you.
+            Just think of Space as the Use key.
+            It will use doors, use elevators, and so on.
+        </div>
+        <div class="clear"></div>
+        <img src="images/goldkey-readthis.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="readme process">There are locked doors in the castle that require either a gold or silver key.
+            It will be somewhere on the floor you're on.
+        </div>
+        <div class="clear"></div>
+        <img src="images/foods-readthis.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="readme process">If you find your health dropping, pick up some food or first aid.
+            You'll find you're damaged more when shot at close range.
+        </div>
+    </div>
+    <div class="page">
+        <img src="images/ammo-readthis.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="readme process">Pick up the ammo left behind when you toast someone.
+            For instance, perforate an SS--free machine gun!
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">You get a free guy every 40,000 points, so collect those treasures!
+            (You can have a maximum of nine lives.)
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">When you get killed, you lose everything but your gun and start at the beginning of the floor you were on.</div>
+    </div>
+    <div class="page">
+        <span class="text readme title">ABOUT</span>
+        <span class="text readme green">Id</span>
+        <span class="text readme title">SOFTWARE</span>
+        <div class="clear"></div>
+        <div class="readme process">Yes, that's Id, as in the id, ego, and superego in the psyche.
+            We think shareware is a fine alternative to the high prices of commercial vendors.
+            For under twelve dollars a game, you can get the hottest, fastest texture-mapped game available.
+            How can you beat that?
+        </div>
+        <div class="clear"></div>
+        <div class="readme process red">We'll answer that question in a</div>
+        <br>
+        <div class="readme process red">few months. . . .</div>
+        <img src="images/id-logo.png" style="position: absolute; right: 24px; bottom: 24px;"/>
+    </div>
+    <div class="page">
+        <div class="text readme title">Id Software is . . .</div>
+        <div class="clear"></div>
+        <span class="text readme green">PROGRAMMERS</span>
+        <br>
+        <div class="readme process">John Carmack</div>
+        <br>
+        <div class="readme process">John Romero</div>
+        <div class="clear"></div>
+        <span class="text readme green">ARTIST</span>
+        <br>
+        <div class="readme process">Adrian Carmack</div>
+        <div class="clear"></div>
+        <span class="text readme green">CREATIVE</span>
+        <span class="text readme green">DIRECTOR</span>
+        <br>
+        <div class="readme process">Tom Hall</div>
+        <img src="images/id-logo.png" style="position: absolute; right: 24px; bottom: 24px;"/>
+    </div>
+    <div class="page">
+        <div class="text readme title">Id Software is . . .</div>
+        <div class="clear"></div>
+        <span class="text readme green">MANUAL</span>
+        <span class="text readme green">DESIGN</span>
+        <br>
+        <div class="readme process">Kevin Cloud</div>
+        <div class="clear"></div>
+        <span class="text readme green">CHIEF</span>
+        <span class="text readme green">OPERATING</span>
+        <span class="text readme green">OFFICER</span>
+        <br>
+        <div class="readme process">Jay Wilbur</div>
+        <img src="images/id-logo.png" style="position: absolute; right: 24px; bottom: 24px;"/>
+    </div>
+    <div class="page">
+        <div class="text readme title">CONTRIBUTORS</div>
+        <div class="clear"></div>
+        <span class="text readme green">COMPOSER</span>
+        <br>
+        <div class="readme process">Robert Prince</div>
+        <div class="clear"></div>
+        <span class="text readme green">ADDITIONAL</span>
+        <span class="text readme green">PROGRAMMING</span>
+        <br>
+        <div class="readme process">Jason Blochowiak</div>
+    </div>
+    <div class="page">
+        <div class="text readme title">WOLFENSTEIN HINT BOOK!</div>
+        <div class="clear"></div>
+        <div class="readme process">If you want to know every nook and cranny of every level, get the</div>
+        <div class="readme process green">Wolfenstein 3-D Hint Book</div>
+        <div class="readme process">now! All six episodes are shown in exquisite detail.</div>
+        <div class="clear"></div>
+        <div class="readme process">It's also filled with fun facts about Id and the development of Wolfenstein 3-D.
+            Find out secrets about B.J. Blazkowicz and get cool tips.
+            Snazzy!
+        </div>
+    </div>
+    <div class="page">
+        <div class="text readme title">NOCTURNAL MISSIONS</div>
+        <div class="clear"></div>
+        <div class="readme process red">Episode Four: A Dark Secret</div>
+        <br>
+        <div class="readme process">Intelligence has uncovered a Nazi plot for large scale chemical warfare.
+            You must eliminate maniac scientist Otto Giftmacher.
+        </div>
+        <div class="clear"></div>
+        <div class="readme process red">Episode Five: Trail of the Madman</div>
+        <br>
+        <div class="readme process">The scientist is dead but the plans are in motion.
+            Explore the dark dungeon and find the plans, man!
+        </div>
+        <div class="clear"></div>
+        <div class="readme process red">Episode Six: Confrontation</div>
+        <br>
+        <div class="readme process">Prepare for the final battle with General Fettgesicht, organizer of the chemical war!</div>
+    </div>
+    <div class="page">
+        <div class="text readme title">SPEAR OF DESTINY</div>
+        <div class="clear"></div>
+        <div class="readme process">This new, incredibly challenging Wolfenstein adventure boasts twenty levels,
+            four tough bosses, plus new graphics and music for the most amazing Wolfenstein yet!
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">The Spear of Destiny--legend has it that with this spear no force may be defeated in battle.
+            BJ must fight the forces in Castle Nuremberg and wrest the Spear from Adolf's clutches!
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">Get this amazing adventure for free!</div>
+    </div>
+    <div class="page">
+        <img src="images/sod-readthis.png"/>
+    </div>
+    <div class="page">
+        <div class="text readme title">QUOTES FROM THE GUYS</div>
+        <div class="clear"></div>
+        <div class="readme process">Here's some quotes from the Id guys:</div>
+        <div class="clear"></div>
+        <div class="readme process">Adrian Carmack, Master of the Pixel:</div>
+        <br>
+        <div class="readme process">"Okay, now for the CGA version . . . NOT!"</div>
+        <div class="clear"></div>
+        <div class="readme process">John Carmack, Technical Director:</div>
+        <br>
+        <div class="readme process">"I just mapped video memory into User Address Space on my Color NeXTStation!"</div>
+    </div>
+    <div class="page">
+        <div class="text readme title">QUOTES FROM THE GUYS</div>
+        <div class="clear"></div>
+        <div class="readme process">John Romero, Programming Director:</div>
+        <br>
+        <div class="readme process">"I really need to work on my Total Time of 5:20 for Episode One.
+            I was messing around too much in those rooms."
+        </div>
+        <div class="clear"></div>
+        <div class="readme process">Tom Hall, Creative Director:</div>
+        <br>
+        <div class="readme process">"Ya don't bring a pistol to a machine gun fight."</div>
+        <br>
+        <div class="readme process">(Since I'm typing this, I'd like to plug John Blackwell's</div>
+        <span class="text readme red">F.Godmom</span>
+        <div class="readme process">game. It's a great puzzle game.  Look for his new 4.0 version online!)</div>
+    </div>
+    <div class="page">
+        <div class="text readme title">CONCLUSION</div>
+        <div class="clear"></div>
+        <div class="readme process">Thanks for playing Wolfenstein 3-D.
+            Please support Id's efforts in making ground- breaking software available at shareware prices.
+        </div>
+        <div class="clear"></div>
+        <img src="images/twoguns-bj.png" style="float: left; margin: 0 24px 0 0;"/>
+        <div class="readme process">Now, go get 'em!</div>
+    </div>
+</div>
diff --git a/wolf3d/html/savegame.html b/wolf3d/html/savegame.html
new file mode 100644
index 0000000..d3810fd
--- /dev/null
+++ b/wolf3d/html/savegame.html
@@ -0,0 +1,38 @@
+<div id="savegame" class="menu">
+    <img src="images/savegame.png" class="title"/>
+    <img src="images/savegame-stripes.png" class="stripes"/>
+    <img src="images/menu-help.png" class="help"/>
+    <div class="options">
+        <div id="savecursor" class="cursor"></div>
+        <div class="slot empty selected">
+            <div class="text highscores">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+        <div class="slot empty">
+            <div class="text small">- empty -</div>
+        </div>
+    </div>
+</div>
diff --git a/wolf3d/html/sound.html b/wolf3d/html/sound.html
new file mode 100644
index 0000000..6f2c7b1
--- /dev/null
+++ b/wolf3d/html/sound.html
@@ -0,0 +1,26 @@
+<div id="sound" class="menu">
+    <img src="images/menu-help.png" class="help"/>
+    <div class="soundtitle">
+        <img src="images/soundeffects.png"/>
+    </div>
+    <div id="soundcursor" class="cursor sound"></div>
+    <div class="soundoption">
+        <div class="text readthis" style="margin-bottom: -6px; margin-left: 650px;">100%</div>
+        <div class="text" style="float: left; margin-left: 76px;">0%</div>
+        <div class="bar">
+            <div class="thumb"></div>
+        </div>
+        <div class="text" style="float: right; margin-right: 20px;">100%</div>
+    </div>
+    <div class="musictitle">
+        <img src="images/music.png"/>
+    </div>
+    <div class="musicoption">
+        <div class="text readthis" style="margin-bottom: -6px; margin-left: 650px;">100%</div>
+        <div class="text" style="float: left; margin-left: 76px;">0%</div>
+        <div class="bar">
+            <div class="thumb"></div>
+        </div>
+        <div class="text" style="float: right; margin-right: 20px;">100%</div>
+    </div>
+</div>
diff --git a/wolf3d/html/title.html b/wolf3d/html/title.html
new file mode 100644
index 0000000..483fb71
--- /dev/null
+++ b/wolf3d/html/title.html
@@ -0,0 +1,3 @@
+<div id="title">
+    <img src="images/welcome.png"/>
+</div>