mirror of
https://github.com/skoelle/moonweb-site.git
synced 2026-09-17 17:00:25 +00:00
269 lines
9.5 KiB
HTML
Executable File
269 lines
9.5 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>PHOBIA DemoGroup Archive - Nostalgic PC Intros from 1994</title>
|
|
<meta name="description" content="Explore the PHOBIA DemoGroup Archive, showcasing the 1994 PC intros, including the notable Phobia Welcome Intro. Relive the early days of PC intros with source code and more.">
|
|
<link rel="canonical" href="https://www.moonweb.org/phobia/" />
|
|
<style>
|
|
body {
|
|
background-color: #1a1a1a;
|
|
margin: 0;
|
|
color: #f0f0f0;
|
|
font-family: 'Arial', sans-serif;
|
|
line-height: 1.6;
|
|
}
|
|
.header {
|
|
display: flex;
|
|
align-items: center;
|
|
background-color: #000071;
|
|
padding-top:5px;
|
|
padding-left: 20px;
|
|
}
|
|
.header img {
|
|
margin-right: 20px;
|
|
}
|
|
.header a {
|
|
margin: 0 15px;
|
|
color: #518DAF;
|
|
text-decoration: none;
|
|
font-size: 1.2em;
|
|
}
|
|
.header a:hover {
|
|
color: #f0f0f0;
|
|
}
|
|
.content {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
padding: 40px;
|
|
}
|
|
.program {
|
|
display: flex;
|
|
flex: 1 1 100%;
|
|
margin-bottom: 40px;
|
|
}
|
|
.program-image {
|
|
flex: 1 1 150px;
|
|
margin-right: 20px;
|
|
}
|
|
.program-image img {
|
|
width: 100%;
|
|
height: auto;
|
|
border-radius: 10px;
|
|
}
|
|
.program-description {
|
|
margin-top: 10px;
|
|
font-size: 1.1em;
|
|
}
|
|
.program-info {
|
|
flex: 2 1 300px;
|
|
}
|
|
.program-info h2 {
|
|
font-size: 2em;
|
|
margin-bottom: 10px;
|
|
}
|
|
.footer {
|
|
font-size: 0.9em;
|
|
text-align: center;
|
|
padding: 20px;
|
|
background-color: #333;
|
|
margin-top: 20px;
|
|
}
|
|
@media (max-width: 768px) {
|
|
h1 {
|
|
font-size: 1.7em;
|
|
}
|
|
.program-info h2 {
|
|
font-size: 1.5em;
|
|
margin-bottom: 10px;
|
|
}
|
|
.header img {
|
|
width: 100%;
|
|
}
|
|
.content {
|
|
flex-direction: column;
|
|
align-items: left;
|
|
}
|
|
.program {
|
|
flex-direction: column;
|
|
align-items: left;
|
|
}
|
|
.program-image {
|
|
margin-right: 0;
|
|
margin-bottom: 20px;
|
|
}
|
|
.program-info {
|
|
text-align: left;
|
|
}
|
|
}
|
|
th {
|
|
text-align:left;
|
|
}
|
|
a {
|
|
color:#00A6FF;
|
|
}
|
|
|
|
.lightbox {
|
|
display: none;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, 0.8);
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.lightbox-content {
|
|
position: relative;
|
|
width: 80%;
|
|
max-width: 800px;
|
|
}
|
|
.lightbox-content iframe {
|
|
width: 100%;
|
|
height: 450px;
|
|
}
|
|
.close {
|
|
position: absolute;
|
|
top: 10px;
|
|
right: 10px;
|
|
font-size: 30px;
|
|
color: #fff;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
<script>
|
|
function openLightbox() {
|
|
document.getElementById('lightbox').style.display = 'flex';
|
|
document.getElementById('video').src = 'https://www.youtube.com/embed/Cj3RgjVs5dk?autoplay=1';
|
|
}
|
|
|
|
function closeLightbox(event) {
|
|
if (event.target.id === 'lightbox' || event.target.className === 'close') {
|
|
document.getElementById('lightbox').style.display = 'none';
|
|
document.getElementById('video').src = '';
|
|
}
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<a href="index.html">
|
|
<img src="phobialogo.png" alt="PHOBIA">
|
|
</a>
|
|
</div>
|
|
<div class="content">
|
|
|
|
<div class="welcome">
|
|
<h1>Welcome to the PHOBIA DemoGroup Archive</h1>
|
|
|
|
<p>This site showcases the releases from my DemoGroup, PHOBIA. Although PHOBIA existed only briefly on the PC in 1994, it made a notable impact with its focus on PC intros. The highlight of our work was the major release, the Phobia Welcome Intro.</p>
|
|
<p>Feel free to explore and enjoy the nostalgia of the early days of PC intros.</p>
|
|
<p>Best regards, Stefan Koelle</p>
|
|
</div>
|
|
|
|
<div class="program">
|
|
<div class="program-image">
|
|
<img src="welcomeintro.png" alt="Program 1 Image" onclick="openLightbox()">
|
|
<div class="program-description">
|
|
<p><b>Phobia Welcome Intro</b></p>
|
|
<p><a href="#" onclick="openLightbox()">YouTube Video of the Intro</a></p>
|
|
<p><a href="https://github.com/skoelle/dos-phobia-welcome-intro" target="_blank">Github Sourcecode</a></p>
|
|
</div>
|
|
</div>
|
|
<div class="program-info">
|
|
<h2>Phobia Welcome Intro</h2>
|
|
<p>The Phobia Welcome Intro was programmed in 1994 using Turbo Pascal, with inline assembler for the graphics routines. The idea for this intro was inspired by an Amiga demo, though the specific name of the demo has been forgotten. All graphics and programming were done by Stefan Koelle on a 486 DX2-66 DOS PC.</p>
|
|
<p>This intro utilized an early version of the X-LIB unit, specifically the TextGraf.pas, which was also developed by Stefan Koelle. The source code for the intro is available on GitHub. The primary technique used in this intro to create the illusion of movement was through color palette changes, rather than altering the pixels on the screen.</p>
|
|
<p>The music for the intro was borrowed from an old Amiga demo and played using a public Mod-Player. The font used in the intro was custom-created and compiled into the executable as an object, along with the music and graphics.</p>
|
|
|
|
<h2>Key Details:</h2>
|
|
<table>
|
|
<tr>
|
|
<th>Feature</th>
|
|
<th>Description</th>
|
|
</tr>
|
|
<tr>
|
|
<td>Programming Language</td>
|
|
<td>Turbo Pascal with inline assembler</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Year</td>
|
|
<td>1994</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Developer</td>
|
|
<td>Stefan Koelle</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Development Machine</td>
|
|
<td>486 DX2-66 DOS PC</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Graphics Technique</td>
|
|
<td>Color palette changes</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Music Source</td>
|
|
<td>Old Amiga demo</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Music Player</td>
|
|
<td>Public Mod-Player</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Custom Font</td>
|
|
<td>Compiled into the executable as an object</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Graphics Library</td>
|
|
<td>Early version of X-LIB unit (TextGraf.pas)</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Source Code</td>
|
|
<td>Available on GitHub <a href="https://github.com/skoelle/dos-phobia-welcome-intro" target="_blank">https://github.com/skoelle/dos-phobia-welcome-intro</a></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!--
|
|
<div class="program">
|
|
<div class="program-image">
|
|
<img src="program2.jpg" alt="Program 2 Image">
|
|
<div class="program-description">
|
|
<p><b>Program 2</b></p>
|
|
<p>Kurze Beschreibung des zweiten Programms.</p>
|
|
</div>
|
|
</div>
|
|
<div class="program-info">
|
|
<h2>Program 2 Information</h2>
|
|
<p>Hier steht der Infotext zum zweiten Programm. Dieser Text enthält detaillierte Informationen über das Programm, seine Funktionen und andere relevante Details.</p>
|
|
</div>
|
|
</div>
|
|
<div class="program">
|
|
<div class="program-image">
|
|
<img src="program3.jpg" alt="Program 3 Image">
|
|
<div class="program-description">
|
|
<p><b>Program 3</b></p>
|
|
<p>Kurze Beschreibung des dritten Programms.</p>
|
|
</div>
|
|
</div>
|
|
<div class="program-info">
|
|
<h2>Program 3 Information</h2>
|
|
<p>Hier steht der Infotext zum dritten Programm. Dieser Text enthält detaillierte Informationen über das Programm, seine Funktionen und andere relevante Details.</p>
|
|
</div>
|
|
</div>-->
|
|
</div>
|
|
<div class="footer">
|
|
PHOBIA website - initially created November 1999 - code from 1994 - Stefan Koelle<br>
|
|
Part of <a href="/">moonweb.org</a> · <a href="/retro/">Retro Corner</a> · <a href="/impressum/">Legal Notice</a>
|
|
</div>
|
|
<div id="lightbox" class="lightbox" onclick="closeLightbox(event)">
|
|
<div class="lightbox-content">
|
|
<span class="close" onclick="closeLightbox()">×</span>
|
|
<iframe id="video" src="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |