mirror of
https://github.com/nat3yice/savethedate.git
synced 2026-03-10 08:51:18 +00:00
159 lines
6.1 KiB
HTML
159 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang='eng'>
|
|
<head>
|
|
<!-- Hotjar Tracking Code for www.nathanandnikita.com -->
|
|
<script>
|
|
(function(h,o,t,j,a,r){
|
|
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
|
|
h._hjSettings={hjid:721376,hjsv:6};
|
|
a=o.getElementsByTagName('head')[0];
|
|
r=o.createElement('script');r.async=1;
|
|
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
|
|
a.appendChild(r);
|
|
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
|
|
</script>
|
|
<meta charset='UTF-8'>
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<title>Be there or be square!</title>
|
|
<link href="https://fonts.googleapis.com/css?family=Glass+Antiqua" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css?family=Dawning+of+a+New+Day" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css?family=Cutive+Mono" rel="stylesheet">
|
|
<link rel='stylesheet' href='savethedate.css'/>
|
|
<script src="https://www.gstatic.com/firebasejs/4.9.1/firebase.js"></script>
|
|
<script>
|
|
var config = {
|
|
databaseURL: "https://rsvp-dbb88.firebaseio.com"
|
|
};
|
|
firebase.initializeApp(config);
|
|
var database = firebase.database();
|
|
</script>
|
|
<style type="text/css">
|
|
.hero {
|
|
font-family: 'Dawning of a New Day', cursive;
|
|
}
|
|
.details, .location, #login-button, .overlay-content, .input-box, #take-me-in-btn {
|
|
font-family: 'Glass Antiqua', cursive;
|
|
}
|
|
</style>
|
|
<meta name='viewport'
|
|
content='width=device-width, initial-scale=1.0, maximum-scale=1.0' />
|
|
<link href='img-vid/favicon.png' rel="shortcut icon" type="image/png"/>
|
|
<script>
|
|
|
|
var visitorCode = null;
|
|
var visitor = null;
|
|
|
|
function openModal(modalName) {
|
|
document.getElementById(modalName).style.display = "block";
|
|
}
|
|
|
|
function closeModal(modalName) {
|
|
document.getElementById(modalName).style.display = "none";
|
|
}
|
|
|
|
function openNav() {
|
|
document.getElementById("myNav").style.display = "block";
|
|
document.getElementById("outer-container").style.display = "none";
|
|
}
|
|
function closeNav() {
|
|
document.getElementById("myNav").style.display = "none";
|
|
document.getElementById("outer-container").style.display = "block";
|
|
}
|
|
|
|
function validateVisitor(visitor, email) {
|
|
if(visitor === null){
|
|
return false;
|
|
}
|
|
|
|
var lowercaseEmails = visitor.emails;
|
|
for(var i = 0; i < lowercaseEmails.length; i++){
|
|
lowercaseEmails[i] = lowercaseEmails[i].toLowerCase();
|
|
}
|
|
|
|
if (lowercaseEmails.indexOf(email.toLowerCase()) < 0) {
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
|
|
function openRsvp(){
|
|
closeModal("invalid-credentials");
|
|
|
|
visitorCode = document.getElementById("code-input").value;
|
|
if(visitorCode.length < 1){
|
|
openModal("invalid-credentials");
|
|
return;
|
|
}
|
|
|
|
firebase.database().ref('/attendees/' + visitorCode).once('value').then(function(snapshot) {
|
|
console.log("IN FIREBASE");
|
|
|
|
visitor = snapshot.val();
|
|
var visitorEmail = document.getElementById("email-input").value;
|
|
if (!validateVisitor(visitor, visitorEmail)) {
|
|
openModal("invalid-credentials");
|
|
}
|
|
else{
|
|
console.log("MOVING TO ", visitorCode);
|
|
window.location.replace("/rsvp.html?code="+visitorCode);
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
|
|
<body class='body'>
|
|
<div class="fullscreen-bg">
|
|
<video loop muted autoplay poster='img-vid/eng-540p-low-img.jpg'class="fullscreen-bg__video">
|
|
<source src="img-vid/eng-540p-low.mp4" type="video/mp4">
|
|
</video>
|
|
</div>
|
|
<div class='outer-container' id='outer-container'>
|
|
<div class='outer'>
|
|
<div class='hero'>
|
|
<h1 id='names'>nathan & nikita</h1>
|
|
</div>
|
|
<div class='details'>
|
|
<p id='wed-details'>
|
|
<span>June 30<sup style="font-size: 13px !important">
|
|
th</sup> 2018</span>
|
|
<span>Oldehove • The Netherlands
|
|
<a href='https://goo.gl/maps/yj2srDnwXc42' target='_blank'>
|
|
<img class='mapbutton'src='img-vid/mapicon-red.svg' alt='map pin drop icon'></a></span>
|
|
</p>
|
|
<div id='wed-details-mobile'>
|
|
<p id='p-june30-mobile'>June 30<sup style='font-size: 11px !important'>th</sup> 2018</p>
|
|
<p id='p-oldehove-mobile'>Oldehove</p>
|
|
<p id='p-thenetherlands-mobile'>The Netherlands
|
|
<a href='https://goo.gl/maps/yj2srDnwXc42' target='_blank'><img class='mapbutton-mobile'
|
|
src='img-vid/mapicon-red.svg' alt='map pin drop icon'></a></p>
|
|
</div>
|
|
<button type='button' id='login-button' class='button1' onclick="openNav()">Login</button>
|
|
</div>
|
|
<div class='location'>
|
|
<p id='wed-location'>Shot at Lake Atitlan, Guatemala</p>
|
|
<p id='wed-location-mobile'>Shot at Lake Atitlan, Guatemala</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="myNav" class="overlay">
|
|
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
|
|
<form class="overlay-content">
|
|
<p class="modal-message">Please use your invitation email and code we sent</p>
|
|
<input tabindex="1" class="input-box" type="text" id="email-input" tabindex="10" value="" placeholder="email">
|
|
<br>
|
|
<input tabindex="2" class="input-box" type="text" id="code-input" value="" placeholder="code">
|
|
<br>
|
|
<div class="invalid-credentials" id="invalid-credentials" style="font-size:22px; color: #ED3F54; font-weight: bold; letter-spacing: 1px; line-height: 150%;">
|
|
Hmm.. that didn't work </br>Please make sure to use your invitation email and code we sent
|
|
</div>
|
|
<button tabindex="3" type="submit" id="take-me-in-btn" onclick="openRsvp()">Take me in!</button>
|
|
</form>
|
|
</div>
|
|
</body>
|
|
<script>
|
|
closeModal("invalid-credentials");
|
|
</script>
|
|
</html>
|