-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
122 lines (94 loc) · 8.08 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html xml:lang="en" lang="en">
<head>
<title>la .magias.</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="description" content="This is the teaser homepage for a video game that I have been prototyping since 2012. In this game the player is able to create and cast magic spells using the Lojban constructed language." />
<link rel="icon" type="image/x-icon" href="./favicon.ico"/>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="./clippyjs/assets/clippy.css" />
<link rel="stylesheet" href="./css/main.css" type="text/css" media="screen" />
<link rel="stylesheet" href="./css/clippy.css" type="text/css" />
</head>
<body>
<main class="scroll">
<div class="scroll-header">
<div class="scroll-conceal"></div>
<div class="scroll-top">
<div class="shadow"></div>
</div>
</div>
<div class="scroll-view">
<div class="cipher h1">HEY YOU DEVELOPER-BOT-COPY-PASTER, HOW DARE YOU NOT READ THIS TEXT IN ITS INTENDED FONT</div>
<div class="scroll-content" role="main">
<h1 class="title">Magia - The Wizardry Sim</h1>
<h2 class="minor-push">Finally, the words of magic will have a meaning behind them.</h2>
<h3 class="cipher minor-push">Game Status - Postponed (Too ambitious for a first commercial game project)</h3>
<h2 id="incantation" class="underline">Incantation</h2>
<iframe id="playerIncantation" class="player" width="480" height="360" src="https://www.youtube.com/embed/YGarOF1mSkw?autohide=0&autoplay=0&cc_load_policy=1&controls=0&enablejsapi=1&end=163&iv_load_policy=3&loop=0&modestbranding=1&playerapiid=playerIncantation&playsinline=1&rel=0&showinfo=0&start=140"></iframe>
<blockquote class="quote">
<q>Now, Master <b>Merlin</b>, there are three <a href="https://tvtropes.org/pmwiki/pmwiki.php/Main/SpellConstruction">classes of magic</a>, three stages of progression to full wizard status.<br />
The first, and lowest stage is wizard by <a href="https://tvtropes.org/pmwiki/pmwiki.php/Main/MagicalIncantation">incantation</a>. <strong>Abracadabra! Dove and chalk!</strong></q>
<footer>- <cite><b>Frik</b> in <em>Merlin</em> TV mini-series</cite> (<time>1998</time>)</footer>
</blockquote>
<iframe id="playerIncantationReferences" class="player" width="640" height="360" src="https://www.youtube.com/embed/videoseries?listType=playlist&list=PLNS9FVjtN-TO2O4gS-ZluqfyzEe3K_UFP&autohide=0&autoplay=0&cc_load_policy=0&controls=0&enablejsapi=1&iv_load_policy=3&loop=1&modestbranding=1&playerapiid=playerIncantationReferences&playsinline=1&rel=0&showinfo=0&start=28"></iframe>
<blockquote class="major-push">
<q>All this magic stuff needs new terminology because it's not what people are being told it is at all.</q>
<footer>- <cite>Grant Morrison, in "Grant Morrison: Master & Commander"</cite> by Christopher Butcher, Part 4 : Highway X</footer>
</blockquote>
<article role="article">
<h2 class="cipher">What is this?</h2>
<p class="cipher">This is the teaser homepage for a video game that I have been prototyping since 2012. In this game the player is able to create and cast magic spells using the Lojban constructed language.</p>
</article>
<h2 id="gestures">Gestures</h2>
<iframe id="playerGestures" class="player" width="480" height="360" src="https://www.youtube.com/embed/YGarOF1mSkw?autohide=0&autoplay=0&cc_load_policy=1&controls=0&enablejsapi=1&end=174&iv_load_policy=3&loop=0&modestbranding=1&playerapiid=playerGestures&playsinline=1&rel=0&showinfo=0&start=162"></iframe>
<blockquote class="quote">
<q>The second stage wizards are hand wizards. Whose magic is performed by <a href="https://tvtropes.org/pmwiki/pmwiki.php/Main/MagicalGesture">gestures</a> of the hands, and fingers.</q>
<footer>- <cite><b>Frik</b> in <em>Merlin</em> TV mini-series</cite> (<time>1998</time>)</footer>
</blockquote>
<iframe id="playerGesturesReferences" class="player" width="640" height="360" src="https://www.youtube.com/embed/LCHWiw9Jxyw?autohide=0&autoplay=0&cc_load_policy=0&controls=0&enablejsapi=1&iv_load_policy=3&loop=1&modestbranding=1&playerapiid=playerGesturesReferences&playsinline=1&rel=0&showinfo=0&start=10"></iframe>
<blockquote class="major-push">
<q>Too much magic could wrap time and space around itself, and that wasn't good news for the kind of person who had grown used to things like effects following things like causes.</q>
<footer>- <cite>Terry Pratchett, in Sourcery</cite> (1988)</footer>
</blockquote>
<h2 class="cipher">What is everything after this?</h2>
<p class="cipher minor-push">Nothing. Just stuff that fills the void of this homepage. Often magic has these three different ways of casting magic spells. Though at present we can only convey the first class by typing or using a microphone and, the third with shortcuts.</p>
<h2 id="will" class="underline">Will</h2>
<iframe id="playerWill" class="player" width="480" height="360" src="https://www.youtube.com/embed/YGarOF1mSkw?autohide=0&autoplay=0&cc_load_policy=1&controls=0&enablejsapi=1&iv_load_policy=3&loop=0&modestbranding=1&playerapiid=playerWill&playsinline=1&rel=0&showinfo=0&start=174"></iframe>
<blockquote class="quote">
<q>The third and highest stage of wizardry, the supreme exponents, are wizards of pure thought. Who need no words, nor gestures but by their <a href="https://tvtropes.org/pmwiki/pmwiki.php/Main/SimplifiedSpellcasting">will</a> alone test the heavens. Of course, only the most supremely gifted personages become wizards of the third stage.</q>
<footer>- <cite><b>Frik</b> in <em>Merlin</em> TV mini-series</cite> (<time>1998</time>)</footer>
</blockquote>
<iframe id="playerWillReferences" class="player" width="640" height="360" src="https://www.youtube.com/embed/videoseries?listType=playlist&list=PLNS9FVjtN-TMUv46ylLG_2fTRNDNxqLtV&autohide=0&autoplay=0&cc_load_policy=0&controls=0&enablejsapi=1&iv_load_policy=3&loop=1&modestbranding=1&playerapiid=playerWillReferences&playsinline=1&rel=0&showinfo=0"></iframe>
<blockquote>
<q>The power of Thought, the magic of the Mind!</q>
<footer>- <cite>Lord Byron, in The Corsair</cite> (1813)</footer>
</blockquote>
<h1>Prototype</h1>
<iframe id="prototypeVideo" width="640" height="360" src="https://www.youtube.com/embed/8MicHA_oVWk?autohide=0&autoplay=0&cc_load_policy=1&controls=1&enablejsapi=1&iv_load_policy=3&loop=1&modestbranding=1&playerapiid=playerWillReferences&playsinline=1&rel=0&showinfo=0" allowfullscreen></iframe>
</div>
<div class="cipher h1">HEY YOU DEVELOPER-BOT-COPY-PASTER, HOW DARE YOU NOT READ THIS TEXT IN ITS INTENDED FONT</div>
</div>
<div class="scroll-footer">
<div class="scroll-bottom">
<div class="shadow"></div>
</div>
<div class="scroll-conceal"></div>
</div>
</main>
<div class="footer">
<a href="https://github.com/Pendrokar/magia-ts/">Source Code (GitHub)</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-visible/1.3.0-rc.1/jquery.visible.min.js"></script>
<!-- Clippy.js -->
<script type="text/javascript" src="/clippyjs/dist/clippy.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/systemjs/0.21.5/system.js"></script>
<script type="text/javascript">
System.defaultJSExtensions = true;
System.import("./js/main.js")
System.import("./js/ClippyController.js")
</script>
</body>
</html>