Skip to content

GitLab

Switch branch/tag
Find file Normal viewHistoryPermalink
index.html 10.5 KB
Newer Older
Porter Libby's avatar
add boilerplate    
Porter Libby committed
1
2
3
4
5
6
7
8
9
10
11 
<!doctype html>
<html class="no-js" lang="">
    <head>
        <title>EPIC Journey</title>

        <!-- META INFO -->
        <meta charset="utf-8">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- CDN STYLES-->
Porter Libby's avatar
reformat head    
Porter Libby committed
12
13
14
15 
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" >
        <link rel="stylesheet" href="https://mottie.github.io/Keyboard/css/keyboard.css">
        <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css">
Porter Libby's avatar
fix buttons, add comments    
Porter Libby committed
16
Porter Libby's avatar
add boilerplate    
Porter Libby committed
17 
        <!-- CDN SCRIPTS -->
Porter Libby's avatar
reformat head    
Porter Libby committed
18
19
20 
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
Porter Libby's avatar
add jq keyboard :D    
Porter Libby committed
21
22
23 
        <script src="https://mottie.github.io/Keyboard/js/jquery.keyboard.js"></script>
        <script src="https://mottie.github.io/Keyboard/js/jquery.mousewheel.js"></script>
        <script src="https://mottie.github.io/Keyboard/js/jquery.keyboard.extension-typing.js"></script>
Porter Libby's avatar
fix buttons, add comments    
Porter Libby committed
24
Porter Libby's avatar
reformat head    
Porter Libby committed
25 
        <!-- LOCAL CSS -->
Porter Libby's avatar
add boilerplate    
Porter Libby committed
26 
        <link rel="apple-touch-icon" href="icon.png">
Porter Libby's avatar
add fonts, apply to body    
Porter Libby committed
27 
        <link rel="stylesheet" href="publiic/css/fonts.css">
Porter Libby's avatar
update keyboard events    
Porter Libby committed
28 
        <link rel="stylesheet" href="public/css/keyb.css">
Porter Libby's avatar
add boilerplate    
Porter Libby committed
29 
        <link rel="stylesheet" href="public/css/main.css">
Porter Libby's avatar
update keyboard events    
Porter Libby committed
30
Porter Libby's avatar
reformat head    
Porter Libby committed
31 
        <!-- LOCAL JS -->
Porter Libby's avatar
add data and searchbar js    
Porter Libby committed
32 
        <script src="public/js/searchBar.js"></script>
Porter Libby's avatar
add boilerplate    
Porter Libby committed
33
Porter Libby's avatar
reformat head    
Porter Libby committed
34
35 
        <!-- LOCAL DATA -->
        <script src="public/data/data.js"></script>
Porter Libby's avatar
add boilerplate    
Porter Libby committed
36
37
38 
    </head>

    <body>
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
39 
        <!-- NAV BAR -->
Porter Libby's avatar
add some custom styles to bootstrap    
Porter Libby committed
40 
        <nav class="navbar navbar-expand-lg navbar-dark navbar-ec justify-content-betweenu">
Porter Libby's avatar
add pointer to earlham.edu to logo    
Porter Libby committed
41 
            <a class="navbar-brand" href="https://earlham.edu/">
Porter Libby's avatar
fix more colors    
Porter Libby committed
42
43 
                <img height='35px' src='public/img/ec-logo.png'>
            </a>
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58 
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNavDropdown">
                <ul class="navbar-nav">
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            About
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                            <a class="dropdown-item" href="#">Action</a>
                            <a class="dropdown-item" href="#">Another action</a>
                            <a class="dropdown-item" href="#">Something else here</a>
                        </div>
                    </li>
Porter Libby's avatar
add boilerplate    
Porter Libby committed
59
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
60
61
62
63
64
65
66
67
68
69 
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Your Journey
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                            <a class="dropdown-item" href="#">Action</a>
                            <a class="dropdown-item" href="#">Another action</a>
                            <a class="dropdown-item" href="#">Something else here</a>
                        </div>
                    </li>
Porter Libby's avatar
add boilerplate    
Porter Libby committed
70
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
71
72
73
74
75
76
77
78
79
80
81
82
83 
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Resources
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                            <a class="dropdown-item" href="#">Action</a>
                            <a class="dropdown-item" href="#">Another action</a>
                            <a class="dropdown-item" href="#">Something else here</a>
                        </div>
                    </li>
                </ul>
                <form id='search-bar' class="form-inline">
                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
Porter Libby's avatar
fix more colors    
Porter Libby committed
84 
                    <button class="btn btn-outline-light my-2 my-sm-0" type="submit">Search</button>
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
85
86
87 
                </form>
            </div>
        </nav>
Porter Libby's avatar
add boilerplate    
Porter Libby committed
88
Porter Libby's avatar
fix icon size    
Porter Libby committed
89
90 
        <!-- MAIN CONTENT AREA (padded scrollable area) -->
        <div id='main-content'>
pelibby16's avatar
Revert "add data and searchbar js"    
pelibby16 committed
91 
            <!-- Block 1 -->
Porter Libby's avatar
fix icon size    
Porter Libby committed
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109 
            <div id="create-carousel" class="carousel slide" data-ride="carousel">
                <ol class="carousel-indicators">
                    <li data-target="#create-carousel" data-slide-to="0" class="active"></li>
                    <li data-target="#create-carousel" data-slide-to="1"></li>
                    <li data-target="#create-carousel" data-slide-to="2"></li>
                </ol>
                <div class="carousel-inner"> <!-- slides go here -->
                    <div class="carousel-item active">
                        <img class="d-block w-100" src="public/img/ec-1.jpg" alt="First slide">
                    </div>

                    <div class="carousel-item">
                        <img class="d-block w-100" src="public/img/ec-2.jpg" alt="Second slide">
                    </div>

                    <div class="carousel-item">
                        <img class="d-block w-100" src="public/img/ec-3.jpg" alt="Third slide">
                    </div>
Porter Libby's avatar
fix buttons, add comments    
Porter Libby committed
110
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
111 
                </div>
Porter Libby's avatar
fix icon size    
Porter Libby committed
112
113
114
115
116
117
118
119 
                <a class="carousel-control-prev" href="#create-carousel" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="carousel-control-next" href="#create-carousel" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                </a>
Porter Libby's avatar
add some basic stuff    
Porter Libby committed
120 
            </div>
Porter Libby's avatar
add some more basic stuff    
Porter Libby committed
121
Porter Libby's avatar
fix icon size    
Porter Libby committed
122 
            <!-- Block 1 -->
Dana Yao's avatar
add styles    
Dana Yao committed
123 
            <div class='block' id="block1">
Porter Libby's avatar
some more small stuff    
Porter Libby committed
124
125 
                
                <div style='position:absolute' id='search_parent'>
Porter Libby's avatar
font bigger    
Porter Libby committed
126 
                    <span class='section-prompt'></br>1. Type the name of a major you are interested in</span>
Porter Libby's avatar
some more small stuff    
Porter Libby committed
127 
                </div>
Porter Libby's avatar
conflicts    
Porter Libby committed
128 
                <script>
Porter Libby's avatar
some more small stuff    
Porter Libby committed
129 
                    var parent = document.getElementById('search_parent');
Porter Libby's avatar
conflicts    
Porter Libby committed
130 
                    create_searchbar(parent,'major_selection');
Porter Libby's avatar
fix keyboard    
Porter Libby committed
131
132 
                    if (('ontouchstart' in document.documentElement)){
                        $("#search_parent #searchbar").keyboard({
Porter Libby's avatar
conflicts    
Porter Libby committed
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155 
                            usePreview: false,
                            autoAccept: true,
                            autoAcceptOnEsc: true,
                            keyBinding: 'mousedown touchstart',
                            accepted      : function(e, keyboard, el) {
                                var event = new Event('input', {
                                    bubbles: true,
                                    cancelable: true,
                                });

                                el.dispatchEvent(event);
                            },
                            change        : function(e, keyboard, el) {
                                var event = new Event('input', {
                                    bubbles: true,
                                    cancelable: true,
                                });

                                el.dispatchEvent(event);
                            }
                        }); // create virtual keyboard if touchscreen is detected
                    }
                </script>
Porter Libby's avatar
some more small stuff    
Porter Libby committed
156 
                <iframe style='' width="560" height="315" src="https://www.youtube.com/embed/vjsbZiBVFRM"
Dana Yao's avatar
add styles    
Dana Yao committed
157
158 
                frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; 
                picture-in-picture" allowfullscreen></iframe>
Porter Libby's avatar
fix icon size    
Porter Libby committed
159 
            </div>
Porter Libby's avatar
add some more basic stuff    
Porter Libby committed
160
Porter Libby's avatar
fix icon size    
Porter Libby committed
161 
            <!-- Block 2 -->
Dana Yao's avatar
add styles    
Dana Yao committed
162 
            <div class='block' id="block2">
Porter Libby's avatar
fix icon size    
Porter Libby committed
163
164
165 
                <span class='section-prompt'>2. Choose something that sounds fulfilling</span>
                <br>
                <div class='inner-nav'> <!-- Nav options for this block -->
Dana Yao's avatar
add styles    
Dana Yao committed
166 
                    <button type="button" class="btn btn-labeled btn-dark btn-research">
Porter Libby's avatar
fix icon size    
Porter Libby committed
167 
                        <span class="btn-label"><i class="fa fa-flask"></i></span><br>Research</button>
Dana Yao's avatar
add styles    
Dana Yao committed
168 
                    <button type="button" class="btn btn-labeled btn-dark btn-internship">
Porter Libby's avatar
fix icon size    
Porter Libby committed
169 
                        <span class="btn-label"><i class="fa fa-user-md"></i></span><br> Internship</button>
Dana Yao's avatar
add styles    
Dana Yao committed
170 
                    <button type="button" class="btn btn-labeled btn-dark btn-offcampus">
Porter Libby's avatar
fix icon size    
Porter Libby committed
171
172 
                        <span class="btn-label"><i class="fa fa-book"></i></span><br> Off-campus Study</button>
                </div>
Porter Libby's avatar
fix buttons, add comments    
Porter Libby committed
173 
            </div>
Porter Libby's avatar
add some more basic stuff    
Porter Libby committed
174
Porter Libby's avatar
fix icon size    
Porter Libby committed
175 
            <!-- Block 3 -->
Dana Yao's avatar
add styles    
Dana Yao committed
176 
            <div class='block' id="block3">
Porter Libby's avatar
fix icon size    
Porter Libby committed
177
178 
                <span class='section-prompt'>3. What would you like to do for fun?</span>
            </div>
Porter Libby's avatar
add some more basic stuff    
Porter Libby committed
179
Porter Libby's avatar
fix icon size    
Porter Libby committed
180 
            <!-- Block 4 -->
Dana Yao's avatar
add styles    
Dana Yao committed
181 
            <div class='block' id="block4">
Porter Libby's avatar
fix icon size    
Porter Libby committed
182
183
184 
                <span class='section-prompt'>4. What would you like to become?</span>
                <br>
                <div class='inner-nav'> <!-- Nav options for this block -->
Dana Yao's avatar
add styles    
Dana Yao committed
185 
                    <button type="button" class="btn btn-labeled btn-dark btn-explore">
Porter Libby's avatar
fix icon size    
Porter Libby committed
186 
                        <span class="btn-label"><i class="fa fa-globe"></i></span><br> Explore</button>
Porter Libby's avatar
fix buttons, add comments    
Porter Libby committed
187
Dana Yao's avatar
add styles    
Dana Yao committed
188 
                    <button type="button" class="btn btn-labeled btn-dark btn-finish">
Porter Libby's avatar
fix icon size    
Porter Libby committed
189
190 
                        <span class="btn-label"><i class="fa fa-check"></i></span><br> Finish!</button>
                </div>
Porter Libby's avatar
fix buttons, add comments    
Porter Libby committed
191 
            </div>
Porter Libby's avatar
add some more basic stuff    
Porter Libby committed
192 
        </div>
Porter Libby's avatar
add boilerplate    
Porter Libby committed
193
194 
    </body>
</html>