whynot/NavigationMap.html at master · nathanjksinclair/whynot · GitHub

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
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1"/>
        <meta name="mobile-web-app-capable" content="yes">
         <!-- Class Scripts
      <script src="src/whynot.js"></script>
        <script src="src/view.js"></script>
        <script src="src/controller.js"></script>
        <script src="src/whynotModel.js"></script>-->
        <script src="scripts.js"></script>
        <!-- CSS Files -->
        <link href="layout.css" rel="stylesheet" type="text/css">
        <link href="css/mainScreen.css" rel="stylesheet" type="text/css">
        <link href="css/navigationMapScreen.css" rel="stylesheet" type="text/css">
        <link href="css/mythScreen.css" rel="stylesheet" type="text/css">
        <link href="css/themeScreen.css" rel="stylesheet" type="text/css">
        <link href="css/commentModal.css" rel="stylesheet" type="text/css">
        <title>Why Not? Shattering the Myth</title>
    </head>
    <body>
        <div id="borderDiv">
            <div id="navigationMapScreen" class="navScreen">
                <div>
                    <div id="contactModal" class="modalDialog">
                        <div id="contactModalContent">
                            <p>
                            If you would like to leave some comment regarding this website, or simply want to get in contact, here is a form that you can use to get in contact with me (the producer of the website)
                            </p>
                            <form>
                            <div id="contactModalName">
                            <label for="Name">Name</label>
                                <input id="Name" type="text"></input>
                            </div>
                            <div id="contactModalEmail">
                                <label for="Email">Email</label>
                                <input id="Email "type="text"></input>
                            </div>
                            <div id="contactModalSubject">
                                <label for="Subject">Subject</label>
                                <input id="Subject" type="text"></input>
                            </div>
                            <div id="contactModalComment">
                            <label for="Comments">Comments</label>
                                <textarea id="Comments" rows="5"></textArea>
                            </div>
                            <div id="contactModalSubmit">
                                <input type="submit" value="submit"></input>
                            </div>
                            </form>
                            <ul>
                            <li id="close" class="close">Close</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="contentArea">
                    <div class="panel" id="navScreenElements1">
                            <video width="720" height="480" id="navVideo" controls>
                            <source src="media/videos/NavScreen.mp4" type="video/mp4"></video>
                            <ul>
                            <li id="skip">Skip</li>
                            </ul>
                    </div>
                    <div id="navigationMapTable" hidden>
                        <div class="navigationMapRow">
                            <div class="navigationMapMyth" id="navigationMapMyth1">So You only use 10% of your brain do you?</div>
                            <div class="navigationMapMyth" id="navigationMapMyth2">Prodigies are only found in the arts.</div>
                        </div>
                        <div class="navigationMapRow">
                            <div class="navigationMapMyth" id="navigationMapMyth3">What would you say about the competitiveness to excel?</div>
                            <div class="navigationMapMyth" id="navigationMapMyth4">Brains are like computers?</div>
                        </div>
                    </div>
                </div>
                <div class="bottomArea">
                    <img src="media/images/logo.svg" id="mainScreenLogo">
                    <!-- mainScreen Navbar -->
                    <div id="navigationMapNavBar" class="navBar">
                    <ul>
                    <li class="screenName">Navigation Map</li>
                    <li class="button" id="home">Home</li>
                    <li class="button" id="aboutus">About Us</li>
                    <li class="button" id="contact">Contact</li>
                    <li class="cc"><a rel="license" href="http://creativecommons.org/licenses/by-nc/4.0/"><img alt="Creative Commons Licence" style="border-width:0" src="https://i.creativecommons.org/l/by-nc/4.0/88x31.png" /></a></li>
                    </ul>
                    </div>

                </div>

            </div>
        </div>
        <script>
            document.getElementById('navigationMapMyth1').addEventListener("click", goto10BrainMyth);
            document.getElementById('navigationMapMyth2').addEventListener("click", gotoArtsMyth)
            document.getElementById('navigationMapMyth3').addEventListener("click", gotoExcelMyth)
            document.getElementById('navigationMapMyth4').addEventListener("click", gotoComputerMyth)
            document.getElementById('home').addEventListener("click", gotoHome);
            document.getElementById('aboutus').addEventListener("click", gotoAboutUs);
            document.getElementById('contact').addEventListener("click", gotoContact);
            document.getElementById('close').addEventListener("click", closeModal);
            document.getElementById('skip').addEventListener("click", skipNavMap);
            document.getElementById('navVideo').addEventListener("ended", skipNavMap)
        </script>
    </body>
</html>