-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
86 lines (74 loc) · 3.24 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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Google Analytics Tag (gtag.js) -->
<!-- This script sends data every time a user enters this page,
as well as periodically when the user is on the index page.
Using this code via Google Analytics, we can monitor how many users visited our app
and the duration that they spent on the app.-->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-EFS38DVNK0"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-EFS38DVNK0');
</script>
<!-- Metadata for search engines -->
<meta name="keywords" content="HTML, CSS, JavaScript, Treasure Hunt">
<meta name="author" content="Alexis Demetriou, Ivan Semenov, Charalampos Nikolaou">
<meta name="location" content="Based in Cyprus. Larnaca">
<meta name="description" content="Treasure Hunt by ACI Group is a fun, challenging and
engaging quiz game that tests your common knowledge as well as logically solving challenging tasks.">
<!-- Charset and viewport settings -->
<meta charset="UTF-8">
<meta name="theme-color" content="#ffffff">
<title>Treasure Hunt App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Stylesheet and manifest files -->
<link rel="stylesheet" type="text/css" href="css/welcome_css.css">
<link rel="manifest" href="manifest.json">
</head>
<body>
<!-- Background video -->
<video id="myVideo" autoplay muted>
<source src="videos/treasure_hunt_background_index.mp4" type="video/mp4" />
</video>
<!-- Header section with logo and navigation buttons -->
<header>
<div class="logo">ACI Group</div>
<div>
<a onclick="showModal('helpPage');" href="#" class="btn"><b>Help</b></a>
<a href="about.html" class="btn"><b>About</b></a>
<a href="test.html" class="btn"><b>Testing</b></a>
</div>
</header>
<!-- Welcome message section -->
<div class="welcome-message" id="message_box">
<img src="images/pirate_android_small.png" alt="Pirate Image"/>
<div>
<h4>Welcome to the ACI Group - Treasure Hunt App!</h4>
<p>Click the "About" button to discover the application's purpose and explore its features.</p>
<p>Press the "Help" button to understand the scoring system.</p>
<p>Select the "Testing" button to gain insights into the app's testing process.</p>
<p style="color: #FD5949">When you are ready, click the button below to begin!</p>
</div>
</div>
<!-- Button to navigate to the next page -->
<div class="next-page">
<a class="next-button" href="app.html">Let's get started</a>
</div>
<!-- Help page modal -->
<div id="helpPage" class="modal">
<div class="modal-content">
<span class="close" onclick="hideModal('helpPage');">×</span>
<h2 class="title_help">Help</h2>
<p>Select a category, register your name and try to answer the questions.</p>
<p>Each correct answer is +10 points.<br>
Each wrong answer is -3 points.<br>
Each skipped questionText is -5 points.</p>
</div>
</div>
<!-- JavaScript files -->
<script src="js/background.js"></script>
</body>
</html>