Create index.html

This commit is contained in:
Voxel 2025-04-13 11:12:07 -04:00 committed by GitHub
parent 76b98b3538
commit be4fbebc4a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

55
teletext/index.html Normal file
View file

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html>
<head>
<title>Teletext Viewer</title>
<style type="text/css">
body { background: #444; color:#222; font-family:sans-serif; margin:0px; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
#viewer { height:100vh; height:calc(var(--vh, 1vh)*100); width:100vw; display:flex; flex-direction: column; }
H1 { margin: 0em; font-size:1.5em; }
a, span { color:#bbb; text-decoration: none; }
#header { margin-bottom:5px; color:#eee; background:#666; padding:0.25em 0.5em; width:100%; display:flex; align-items: center; justify-content:space-between;}
#bitmaps { display:none; }
#screen { padding:5px; text-align:center; height:100%; flex:1}
#container { flex:1; background:#999; display:inline-flex; width:100vw; height:100%; overflow:hidden }
#right { display:none; max-width:30vw; max-height:100%; height:45em; width: 15em;}
#below { display:none; height:calc(100vw*0.464);}
#remote { padding:5px; height:100%; width:100%; display:none;}
#remote2 { width:100vw; display:none; height:calc(100vw*0.464);}
#teletextCanvas {position:relative; max-width:100%; max-height:100%; }
*, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
</style>
<meta property="og:image" content="preview.png"/>
<meta name="description" content="Web based teletext emulator with different services on each channel. Includes Teefax, Ceefax, and Chunkytext."/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script type="text/javascript" src="viewer.js"></script>
<script type="text/javascript" src="settings.js"></script>
<script type="text/javascript" src="tv.js"></script>
<script type="text/javascript" src="remote.js"></script>
<script type="text/javascript" src="../teletext-resources/renderer.js"></script>
<script type="text/javascript" src="../teletext-resources/teletext.js"></script>
</head>
<body>
<div id="viewer">
<div id="header">
<H1>Teletext viewer</H1>
<span style="color:#e99; padding:0em 1em">Use remote to select channel and press <span style="color:white;">(≡)</span> for teletext.</span>
<span>Created by <a href="https://oldbytes.space/@zxguesser">@ZXGuesser</a></span>
</div>
<div id="container">
<div id="screen">
<canvas id="teletextCanvas" width="1024" height="576"></canvas>
</div>
<div id="right">
<object id="remote" data="remote.svg" type="image/svg+xml"></object>
</div>
</div>
<div id="below">
<object id="remote2" data="remote2.svg" type="image/svg+xml"></object>
</div>
<div id="bitmaps">
<img src="../teletext-resources/static.png" id="static">
<img src="start.png" id="start">
</div>
</div>
</body>
</html>