fix topbar to work on mobile devices

The topbar, by way of JavaScript, now works
on mobile devices such as cell phones and
tablets.

Internal links for entries from 1984 thru 2015
have been adjusted.

Ran `make www` to perform the above.

TODO: Fix some color issues on topbar.

TODO: More testing!
This commit is contained in:
Landon Curt Noll committed 2024-04-22 15:05:59 -07:00
1 parent 99cd17401e
commit 97f6da1247
440 files changed
+74125 -6956

No files matched your search

+188 -22
View File
@@ -51,6 +51,8 @@
IOCCC
</div>
<div class="mobile-header-button-label">Click This</div>
<div class="topbar-items">
<div class="item">
<span class="item-header">
@@ -58,10 +60,10 @@
</span>
<div class="sub-item">
<div class="outfit-font"><a href="../../index.html">IOCCC Home</a></div>
<div class="outfit-font"><a href="../../years.html">Winning Entries</a></div>
<div class="outfit-font"><a href="../../authors.html">People who have won</a></div>
<div class="outfit-font"><a href="../../location.html">Location of authors</a></div>
<div class="outfit-font"><a href="./index.html">IOCCC Home</a></div>
<div class="outfit-font"><a href="./years.html">Winning Entries</a></div>
<div class="outfit-font"><a href="./authors.html">People who have won</a></div>
<div class="outfit-font"><a href="./location.html">Location of authors</a></div>
</div>
</div>
@@ -71,11 +73,11 @@
</span>
<div class="sub-item">
<div class="outfit-font"><a href="../../news.html">IOCCC News</a></div>
<div class="outfit-font"><a href="../../status.html">Contest status</a></div>
<div class="outfit-font"><a href="../../next/index.html">Rules and Guidelines</a></div>
<div class="outfit-font"><a href="../../faq.html#submit">How to enter the IOCCC</a></div>
<div class="outfit-font"><a href="../../faq.html">FAQ</a></div>
<div class="outfit-font"><a href="./news.html">IOCCC News</a></div>
<div class="outfit-font"><a href="./status.html">Contest status</a></div>
<div class="outfit-font"><a href="./next/index.html">Rules and Guidelines</a></div>
<div class="outfit-font"><a href="./faq.html#submit">How to enter the IOCCC</a></div>
<div class="outfit-font"><a href="./faq.html">FAQ</a></div>
</div>
</div>
@@ -85,11 +87,11 @@
</span>
<div class="sub-item">
<div class="outfit-font"><a href="../../bugs.html">Bugs &amp; (mis)features</a></div>
<div class="outfit-font"><a href="../../faq.html#fix_an_entry">Fixing IOCCC entries</a></div>
<div class="outfit-font"><a href="../../faq.html#fix_web_site">Fixing the web site</a></div>
<div class="outfit-font"><a href="../../faq.html#fix_author">Fixing author info</a></div>
<div class="outfit-font"><a href="../../thanks-for-help.html">Thanks for the help</a></div>
<div class="outfit-font"><a href="./bugs.html">Bugs &amp; (mis)features</a></div>
<div class="outfit-font"><a href="./faq.html#fix_an_entry">Fixing IOCCC entries</a></div>
<div class="outfit-font"><a href="./faq.html#fix_web_site">Fixing the web site</a></div>
<div class="outfit-font"><a href="./faq.html#fix_author">Fixing author info</a></div>
<div class="outfit-font"><a href="./thanks-for-help.html">Thanks for the help</a></div>
</div>
</div>
@@ -99,15 +101,179 @@
</span>
<div class="sub-item">
<div class="outfit-font"><a href="../../judges.html">The IOCCC Judges</a></div>
<div class="outfit-font"><a href="../../contact.html">Contacting the IOCCC</a></div>
<div class="outfit-font"><a href="./judges.html">The IOCCC Judges</a></div>
<div class="outfit-font"><a href="./contact.html">Contacting the IOCCC</a></div>
</div>
</div>
</div>
</div>
</nav>
<div class="header-mobile-menu">
<button id="header-open-menu-button" class="topbar-mobile-menu">
<svg
class="mobile-menu-icon"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M4 6h16M4 12h16M4 18h16"
></path>
</svg>
</button>
<button id="header-close-menu-button" class="hide-content">
<svg
class="mobile-menu-icon"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M6 18L18 6M6 6l12 12"
></path>
</svg>
</button>
<div id="mobile-menu-panel" class="hide-content">
<div class="mobile-menu-container">
<div class="mobile-menu-wrapper">
<div class="mobile-menu-item">
Home
</div>
<div class="mobile-submenu-wrapper">
<a class="mobile-submenu-item" href="./index.html">
IOCCC Home
</a>
<a class="mobile-submenu-item" href="./years.html">
Winning Entries
</a>
<a class="mobile-submenu-item" href="./authors.html">
People who have won
</a>
<a class="mobile-submenu-item" href="./location.html">
Location of authors
</a>
</div>
</div>
<div class="mobile-menu-wrapper">
<div class="mobile-menu-item">
News
</div>
<div class="mobile-submenu-wrapper">
<a class="mobile-submenu-item" href="./news.html">
IOCCC News
</a>
<a class="mobile-submenu-item" href="./status.html">
Contest status
</a>
<a class="mobile-submenu-item" href="./next/index.html">
Rules and Guidelines
</a>
<a class="mobile-submenu-item" href="./faq.html#submit">
How to enter the IOCCC
</a>
<a class="mobile-submenu-item" href="./faq.html">
FAQ
</a>
</div>
</div>
<div class="mobile-menu-wrapper">
<div class="mobile-menu-item">
Bugs
</div>
<div class="mobile-submenu-wrapper">
<a class="mobile-submenu-item" href="./bugs.html">
Bugs &amp; (mis)features
</a>
<a class="mobile-submenu-item" href="./faq.html#fix_an_entry">
Fixing IOCCC entries
</a>
<a class="mobile-submenu-item" href="./faq.html#fix_web_site">
Fixing the web site
</a>
<a class="mobile-submenu-item" href="./faq.html#fix_author">
Fixing author info
</a>
<a class="mobile-submenu-item" href="./thanks-for-help.html">
Thanks for the help
</a>
</div>
</div>
<div class="mobile-menu-wrapper">
<div class="mobile-menu-item">
Judges
</div>
<div class="mobile-submenu-wrapper">
<a class="mobile-submenu-item" href="./judges.html">
The IOCCC Judges
</a>
<a class="mobile-submenu-item" href="./contact.html">
Contacting the IOCCC
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var headerOpenMenuButton = document.getElementById("header-open-menu-button");
var headerCloseMenuButton = document.getElementById("header-close-menu-button");
var mobileMenuPanel = document.getElementById("mobile-menu-panel");
headerOpenMenuButton.addEventListener("click", () => {
headerOpenMenuButton.classList.remove("topbar-mobile-menu");
headerOpenMenuButton.classList.add("hide-content");
headerCloseMenuButton.classList.remove("hide-content");
headerCloseMenuButton.classList.add("topbar-mobile-menu");
mobileMenuPanel.classList.remove("hide-content");
mobileMenuPanel.classList.add("topbar-mobile-panel");
});
headerCloseMenuButton.addEventListener("click", () => {
headerCloseMenuButton.classList.remove("topbar-mobile-menu");
headerCloseMenuButton.classList.add("hide-content");
mobileMenuPanel.classList.add("hide-content");
mobileMenuPanel.classList.remove("topbar-mobile-panel");
headerOpenMenuButton.classList.add("topbar-mobile-menu");
headerOpenMenuButton.classList.remove("hide-content");
});
</script>
<!-- END: this line ends content from: inc/topbar.default.html -->
<!-- START: this line starts content from: inc/header.default.html -->
@@ -182,7 +348,7 @@ combinations are left for the discovery of the user.</p>
bits). It manages to implement most of the hardware in a 1980’s era
IBM-PC using a few hundred fewer bits than the total number of
transistors used to implement the original 8086 CPU.</p>
<p>If you are using macOS, the included <a href="sc-ioccc.terminal">sc-ioccc.terminal</a>
<p>If you are using macOS, the included <a href="https://github.com/ioccc-src/temp-test-ioccc/blob/master/2013/cable3/sc-ioccc.terminal">sc-ioccc.terminal</a>
configuration file will correctly display console applications that use ANSI
graphics.</p>
<p>NOTE: the author remarked that in some systems one might need to <code>#include &lt;unistd.h&gt;</code>. This has been done in the entry but not the alternate version. This
@@ -268,7 +434,7 @@ competition (see above).</li>
supplied is good for Mac OS X, Linux and probably other Unices. I have received
reports that the emulator works on Raspberry Pi/Android/ARM (you will need to
compile with <code>-fsigned-char</code>) and iOS. You will need to adjust the
<a href="Makefile">Makefile</a> if your system lacks <code>sdl-config</code> to correctly point to the
<a href="https://github.com/ioccc-src/temp-test-ioccc/blob/master/M2013/cable3/akefile">Makefile</a> if your system lacks <code>sdl-config</code> to correctly point to the
SDL libraries and header files.</p>
<p>On UNIX-based systems we can get raw keystrokes using <code>stty</code>. However Windows
has no <code>stty</code>. Therefore the Makefile includes a <code>-D</code> option to define a
@@ -286,7 +452,7 @@ offsets) this is not the case, and to run successfully on these systems, you
will need to explicitly declare these functions by adding the appropriate
include to the top of the source:</p>
<pre><code> #include &lt;unistd.h&gt;</code></pre>
<p>NOTE: this has been done in <a href="cable3.c">cable3.c</a>.</p>
<p>NOTE: this has been done in <a href="https://github.com/ioccc-src/temp-test-ioccc/blob/master/2013/cable3/cable3.c">cable3.c</a>.</p>
<h3 id="usage">Usage</h3>
<pre><code> ./cable3 bios-image-file floppy-image-file [harddisk-image-file]</code></pre>
<p>PLEASE NOTE that under Unices the keyboard must be in raw mode for the emulator
@@ -295,14 +461,14 @@ looks something like:</p>
<pre><code> stty cbreak raw -echo min 0
./cable3 bios floppy.img harddisk.img
stty cooked echo</code></pre>
<p>See the <a href="cable3.sh">cable3.sh</a> script.</p>
<p>See the <a href="https://github.com/ioccc-src/temp-test-ioccc/blob/master/2013/cable3/cable3.sh">cable3.sh</a> script.</p>
<h2 id="to-use-the-emulator---floppy-mode-only">To use the emulator - floppy mode only</h2>
<p>The simplest use of the emulator is with a single floppy boot disk image, like
the <code>fd.img</code> provided, which is a FreeDOS boot disk.</p>
<p>Before running the emulator on a Unix-type system, <code>stty</code> needs to be used to
put the keyboard into raw mode (and afterwards it needs to be put back to
cooked). So, run the emulator using something like this script (provided as
<a href="cable3.sh">cable3.sh</a>):</p>
<a href="https://github.com/ioccc-src/temp-test-ioccc/blob/master/c2013/cable3/able3.sh">cable3.sh</a>):</p>
<pre><code> stty cbreak raw -echo min 0
./cable3 bios fd.img
stty cooked echo</code></pre>
@@ -389,7 +555,7 @@ for the (terminal) text and (SDL) graphics displays.</p>
<p>Like a real PC, the emulator needs a BIOS to do anything useful. Here we use a
custom BIOS, written from scratch specifically for the emulator. Source code for
the BIOS (written in 8086 assembly language) which compiles with the
freely-available NASM x86 assembler is in <a href="bios.asm">bios.asm</a>.</p>
freely-available NASM x86 assembler is in <a href="https://github.com/ioccc-src/temp-test-ioccc/blob/master/2013/cable3/bios.asm">bios.asm</a>.</p>
<p>The BIOS implements the standard interrupt interfaces for video, disk, timer,
clock and so on, much as a “real” PC BIOS does, and also a small
timer-controlled video driver to convert video memory formatting into ANSI