1<?php
2 $follow = array(
3 "twitter" => "https://www.twitter.com/",
4 "facebook" => "https://www.facebook.com/",
5 "youtube" => "https://www.youtube.com/",
6 "twitch" => "https://www.twitch.tv/"
7 );
8 $url_param = "/?subtopic=";
9
10 /*
11 isNew -- determines wether the page is new or not, set to _true_ if it is a new page
12
13 isPage -- if the menu item is not a page but a link to a file to be downloaded, set to _false_
14
15 */
16 $menu_items = array(
17 "Main" => array(
18 "fontIcon" => "home",
19 "Latest News" => array("latestnews", "isNew" => false, "isPage" => true),
20 "News Archive" => array("newsarchive", "isNew" => false, "isPage" => true),
21 "Report Bug(s)" => array("reportbug", "isNew" => true, "isPage" => true)
22 ),
23 "Account" => array(
24 "fontIcon" => "user-circle",
25 "My Account" => array("accountmanagement", "isNew" => false, "isPage" => true),
26 "Create Account" => array("createaccount", "isNew" => false, "isPage" => true),
27 "Downloads" => array("downloads", "isNew" => false, "isPage" => true),
28 "Recover Password" => array("loastaccount", "isNew" => true, "isPage" => true)
29 ),
30 "Community" => array(
31 "fontIcon" => "users",
32 "Characters" => array("characters", "isNew" => false, "isPage" => true),
33 "Who is online" => array("whoisonline", "isNew" => false, "isPage" => true),
34 "Highscores" => array("highscores", "isNew" => false, "isPage" => true),
35 "Houses" => array("houses", "isNew" => false, "isPage" => true),
36 "Latest Kills" => array("killstatistics", "isNew" => false, "isPage" => true),
37 "Guilds" => array("guilds", "isNew" => false, "isPage" => true)
38 ),
39 "Library" => array(
40 "fontIcon" => "book",
41 "Server Rules" => array("tibiarules", "isNew" => false, "isPage" => true),
42 "Server Info" => array("serverinfo", "isNew" => false, "isPage" => true),
43 "Exp Table" => array("experiencetable", "isNew" => true, "isPage" => true)
44 ),
45 "Support" => array(
46 "fontIcon" => "info-circle",
47 "Team" => array("team", "isNew" => false, "isPage" => true),
48 "testDLFILE" => array("file.txt", "isNew" => true, "isPage" => false)
49 ),
50 "Shop" => array(
51 "fontIcon" => "shopping-cart",
52 "Donate" => array("donate", "isNew" => true, "isPage" => true),
53 "Buy Points" => array("buypoints", "isNew" => false, "isPage" => true),
54 "Items" => array("shopoffer", "isNew" => false, "isPage" => true)
55 )
56 );
57
58 $countDown = "Apr 5, 2019 15:37:25";
59?>
60<!DOCTYPE html>
61<html lang="en" dir="ltr">
62 <head>
63 <meta charset="utf-8">
64 <title>OTS Title | Layout</title>
65
66 <!-- Stylesheet(s) -->
67 <link rel="stylesheet" href="./css/style.css">
68 <link rel="stylesheet" href="./fontawesome/css/font-awesome.min.css">
69 <link rel="stylesheet" href="./css/resp.css">
70
71 <!-- JavaScript(s) -->
72 <script src="./js/countdown.js" charset="utf-8"></script>
73 <script type="text/javascript">
74 document.addEventListener('DOMContentLoaded', function () {
75 var timer = document.getElementById('countDownTimer');
76 if (timer) {
77 countDown('countDownTimer', timer.getAttribute('data-date'));
78 }
79
80 document.querySelectorAll('.loginBtn').forEach(function (button) {
81 button.addEventListener('click', function () {
82 var container = document.querySelector('.loginContainer');
83 if (container) {
84 container.style.display = 'block';
85 }
86 });
87 });
88 });
89 </script>
90 </head>
91 <body>
92 <!--
93 Author: Blackwolf (Snavy on otland)
94
95 Otland: https://otland.net/members/snavy.155163/
96 Facebook: http://www.facebook.com/idont.reallywolf.1
97 Twitter: @idontreallywolf
98 -->
99 <!-- Main container -->
100 <div class="main">
101 <nav>
102 <div class="container">
103 <div class="pull-left">
104 <ul>
105 <?php foreach ($menu_items as $category => $items): ?>
106 <?php $icon = $items['fontIcon'] ?? 'circle'; ?>
107 <li>
108 <a><i class="fa fa-<?= htmlspecialchars($icon) ?>"></i> <?= htmlspecialchars($category) ?></a>
109 <ul>
110 <?php foreach ($items as $item => $properties): ?>
111 <?php if ($item === 'fontIcon') continue; ?>
112 <?php
113 $target = $properties[0] ?? '';
114 $isPage = $properties['isPage'] ?? true;
115 $href = $isPage ? ($url_param . $target) : $target;
116 ?>
117 <li>
118 <a href="<?= htmlspecialchars($href) ?>">
119 <?= htmlspecialchars($item) ?>
120 </a>
121 </li>
122 <?php endforeach; ?>
123 </ul>
124 </li>
125 <?php endforeach; ?>
126 </ul>
127 </div>
128 <div class="pull-right">
129 <ul>
130 <li><a class="modIcon loginBtn"><i class="fa fa-lock"></i><i class="fa fa-unlock"></i> Login</a> </li>
131 <li><a href="/?subtopic=createaccount"><i class="fa fa-key"></i> Register</a> </li>
132 </ul>
133 </div>
134 </div>
135 </nav>
136
137 <div class="well banner"></div>
138
139 <div class="well feedContainer preventCollapse">
140
141 <div class="well topPane preventCollapse">
142 <div class="well pull-left">
143 <div id="countDownTimer" data-date="<?=$countDown?>"></div>
144 </div>
145
146 <div class="well pull-right">
147 <form class="searchForm" action="/?subtopic=characters" method="post">
148 <input type="text" name="name" placeholder="e.g: John Sheppard">
149 </form>
150 </div>
151 </div>
152 <!-- MAIN FEED -->
153 <div class="pull-left leftPane">
154
155
156<div class="postHolder">
157 <div class="well">
158 <div class="header">
159 test
160 </div>
161 <div class="body">
162 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
163 </div>
164 </div>
165</div>
166
167<div class="postHolder">
168 <div class="well">
169 <div class="header">
170 test
171 </div>
172 <div class="body">
173 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
174 </div>
175 </div>
176</div>
177
178
179 </div>
180 <!-- MAIN FEED END -->
181
182 <!-- RIGHT PANE -->
183 <div class="pull-right rightPane">
184
185 <div class="well loginContainer">
186 <div class="header">
187 Login
188 </div>
189 <div class="body">
190 <form class="loginForm" action="/?subtopic=accountmanagement" method="post">
191 <input type="text" name="accountLogin" placeholder="Account name">
192 <input type="password" name="accountPassword" placeholder="••••••••">
193 <button type="submit" name="submit">continue</button>
194 </form>
195 </div>
196 </div>
197
198 <div class="well">
199 <div class="header">
200 Follow Us
201 </div>
202 <div class="body">
203 <table class="smedia centralizeContent">
204 <tr>
205 <td><a href="<?= htmlspecialchars($follow['facebook'] ?? '#') ?>" target="_blank"><i class="fa fa-facebook"></i></a></td>
206 <td><a href="<?= htmlspecialchars($follow['twitter'] ?? '#') ?>" target="_blank"><i class="fa fa-twitter"></i></a></td>
207 <td><a href="<?= htmlspecialchars($follow['youtube'] ?? '#') ?>" target="_blank"><i class="fa fa-youtube"></i></a></td>
208 <td><a href="<?= htmlspecialchars($follow['twitch'] ?? '#') ?>" target="_blank"><i class="fa fa-twitch"></i></a></td>
209 </tr>
210 </table>
211
212 </div>
213 </div>
214
215 <div class="well">
216 <div class="header">
217 Events
218 </div>
219 <div class="body">
220 <table>
221 <tr><td>Event Name</td><td><i class="fa fa-clock-o"></i> 2h 5m 10s</td></tr>
222 <tr><td>Event Name</td><td><i class="fa fa-clock-o"></i> 2h 5m 10s</td></tr>
223 <tr><td>Event Name</td><td><i class="fa fa-clock-o"></i> 2h 5m 10s</td></tr>
224 <tr><td>Event Name</td><td><i class="fa fa-clock-o"></i> 2h 5m 10s</td></tr>
225 <tr><td>Event Name</td><td><i class="fa fa-clock-o"></i> 2h 5m 10s</td></tr>
226 </table>
227 </div>
228 </div>
229
230 <div class="well">
231 <div class="header">
232 Top 10 Players
233 </div>
234 <div class="body">
235 <table>
236 <tr><td>#</td><td>Name</td></tr>
237 <tr><td>1</td><td>Name</td></tr>
238 <tr><td>2</td><td>Name</td></tr>
239 <tr><td>3</td><td>Name</td></tr>
240 <tr><td>4</td><td>Name</td></tr>
241 <tr><td>5</td><td>Name</td></tr>
242 <tr><td>6</td><td>Name</td></tr>
243 <tr><td>7</td><td>Name</td></tr>
244 <tr><td>8</td><td>Name</td></tr>
245 <tr><td>9</td><td>Name</td></tr>
246 <tr><td>10</td><td>Name</td></tr>
247 </table>
248 </div>
249 </div>
250 </div>
251 <!-- RIGHT PANE END -->
252 </div>
253
254 <footer class="well preventCollapse">
255 <div class="pull-left">
256 Designed By <a href="https://otland.net/members/snavy.155163/" target="_blank">Snavy</a>
257 </div>
258 <div class="pull-right">
259 Github repository : <a href="https://github.com/idontreallywolf/ots_layouts" target="_blank">ots_layouts</a>
260 </div>
261 </footer>
262 </div><!-- Main container END -->
263 </body>
264</html>
265<!--
266 Author: Blackwolf (Snavy on otland)
267
268 Otland: https://otland.net/members/snavy.155163/
269 Facebook: http://www.facebook.com/idont.reallywolf.1
270 Twitter: @idontreallywolf
271-->
272