mirror of
https://github.com/Oreolek/gamebookformat.git
synced 2024-06-29 05:05:13 +03:00
431357a85c
It was handled at parse time, but must be done at output time to be sure the section to use has been parsed.
103 lines
3.4 KiB
HTML
103 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset='utf-8'>
|
|
<meta name="viewport"
|
|
content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
<title>Format</title>
|
|
<script type="text/javascript" src="gamebookformatplay.js"></script>
|
|
<link rel="stylesheet" href="gamebookformat.css"
|
|
type="text/css" />
|
|
<script>
|
|
if (typeof gamebook !== 'undefined') {
|
|
gamebook.id = 'format2';
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="hideintrolink nodisplay"
|
|
onclick="gamebook.hideIntroSections()">HIDE THE INTRO</div>
|
|
<div class="gamebook">
|
|
<div class="introsection">
|
|
<div class="introsectionheading">Introduction</div>
|
|
<div class="introsectionbody">
|
|
Adding an introduction to the gamebook here. This will create a section, but it will not be shuffled nor numbered with the gamebook sections below.
|
|
</div>
|
|
</div>
|
|
<div class="introsection">
|
|
<div class="introsectionheading">Another Heading</div>
|
|
<div class="introsectionbody">
|
|
This starts another non-shuffled section.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="resumelink nodisplay"
|
|
onclick="gamebook.loadGame()">Resume saved game.</div>
|
|
|
|
<div class="startlink"
|
|
onclick="gamebook.turnTo(1)">Adventure begins in section 1.</div>
|
|
<script>
|
|
if (typeof gamebook !== 'undefined' && gamebook.hasSavedGame()) {
|
|
var resumeLinks = document.getElementsByClassName('resumelink');
|
|
Array.prototype.forEach.call(resumeLinks, function(e) {
|
|
e.classList.remove('nodisplay');
|
|
});
|
|
}
|
|
</script>
|
|
<div class="section" id="section1">
|
|
<div class="sectionnumber" id="para1">1</div>
|
|
<div class="sectiontext">
|
|
This examples tests gamebook formatting, not so much game mechanics or references. Currently there is nothing here really. This section contains some tricky characters to quote, like } and { and " and ' and \. HTML will probably not like <div> or &boom;. There should be an image below as well. If something broke, turn to <a class="sectionref enabledlink" data-ref="2"
|
|
href="#section2">2</a>, otherwise turn to <a class="sectionref enabledlink" data-ref="3"
|
|
href="#section3">3</a>. <img src="testimage.png" class="sectionimage"></img>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
if (this.gamebook) {
|
|
gamebook.addSection(1, document.getElementById('section1'));
|
|
}
|
|
</script><div class="section" id="section2">
|
|
<div class="sectionnumber" id="para2">2</div>
|
|
<div class="sectiontext">
|
|
Bad.
|
|
</div>
|
|
</div>
|
|
<script>
|
|
if (this.gamebook) {
|
|
gamebook.addSection(2, document.getElementById('section2'));
|
|
}
|
|
</script><div class="section" id="section3">
|
|
<div class="sectionnumber" id="para3">3</div>
|
|
<div class="sectiontext">
|
|
Good!
|
|
</div>
|
|
</div>
|
|
<script>
|
|
if (this.gamebook) {
|
|
gamebook.addSection(3, document.getElementById('section3'));
|
|
}
|
|
</script> <div id="counters" class="counters">
|
|
</div>
|
|
<div id="counterTemplate" class="counterTemplate">
|
|
<span class="counterheading"></span>
|
|
<span class="countercontents"></span>
|
|
</div>
|
|
</div>
|
|
<div id="collections" class="collections">
|
|
</div>
|
|
<div id="collectionTemplate" class="collectionTemplate">
|
|
<span class="collectionheading"></span>
|
|
<span class="collectioncontents"></span>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
if (typeof gamebook !== 'undefined') {
|
|
gamebook.prepare();
|
|
}
|
|
</script>
|
|
<div class="displayintrolink nodisplay"
|
|
onclick="gamebook.showIntroSections()">SHOW THE INTRO</div>
|
|
</div>
|
|
</body>
|
|
</html>
|