-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.htm
executable file
·164 lines (138 loc) · 5.12 KB
/
index.htm
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
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="jquery-2.1.1.js"></script>
<!-- include Google hosted jQuery Library -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Start jQuery code -->
<script type="text/javascript">
$(document).ready(function() {
var btdtcode = true;
var volunteer = false;
$(".volunteer").hide();
$(".volname").css("visibility", "hidden");
function resetRed() {
$(".volunteer span").css("border", "none");
$(".volname label").css("border", "none");
}
$("#overlay").css("height", $(document).height());
$("#submit_btn").click(function() {
resetRed();
var proceed = true;
if (volunteer) {
if (!$('input[name=volunteer]:checked').val()) {
proceed = false;
$(".volunteer span").css("border", "3px solid red");
console.log("testa");
}
if ($('input[name=volunteer]:checked').val() == "volunteer" && $('input[name=name]').val() == "") {
proceed = false;
$(".volname label").css("border", "8px solid red");
}
}
if(proceed) //everything looks good! proceed...
{
//get input field values data to be sent to server
post_data = {
'user_email' : $('input[name=email]').val(),
'user_comments' : $('textarea[name=comments]').val(),
'volunteer': $('input[name=volunteer]:checked').val() || "unknown",
'volunteer_name': $('input[name=name]').val(),
'btdt' : btdtcode,
};
//Ajax post data to server
$.post('submit.php', post_data, function(response) {
// we don't care about the response - it's possible we should
// clear out fields
$("input[id!=submit_btn][type!=radio], textarea").val('');
$("input[type=radio]").prop('checked', false);
$("#overlay").slideDown().delay(3000).slideUp();
}, 'json');
}
});
$(window).bind("resize", function(){
$("#overlay").css("height", $(window).height());
});
// volunteer button
$("#volunteer_false").click(function () {
$(".volunteer span").css("border", "none");
$(".volname").css("visibility", "hidden");
});
$("#volunteer_true").click(function () {
$(".volunteer span").css("border", "none");
$(".volname").css("visibility", "visible");
});
// config module
// disable submit button until the config is ready
$("#submit_btn").hide();
$("#config_btdton").click(function () {
$(".btdtsteam").show();
btdtcode = true;
});
$("#config_btdtoff").click(function () {
$(".btdtsteam").hide();
btdtcode = false;
});
$("#config_volunteeron").click(function () {
$(".volunteer").show();
volunteer = true;
});
$("#config_volunteeroff").click(function () {
$(".volunteer").hide();
volunteer = false;
});
$("#config_close").click(function () {
$("#config").hide();
$("#submit_btn").show();
$(".volname").css("visibility", "hidden");
});
});
</script>
</head>
<body class="jquery">
<div id="root">
<div id="config">
<div><span>BTDT text:</span><input type="submit" id="config_btdton" value="ON"><input type="submit" id="config_btdtoff" value="OFF"></div>
<div><span>Volunteer options:</span><input type="submit" id="config_volunteeron" value="ON"><input type="submit" id="config_volunteeroff" value="OFF"></div>
<div><input type="submit" id="config_close" value="Close config"></div>
</div>
<div id="overlay">
<img src="thanks.png" id="overlaycontents" />
</div>
<div id="contact_body">
<center>
<h1>Sign up to receive our monthly newsletter!</h1>
<div class="btdtsteam">When you sign up for the mailing list, we'll send you a Steam key to "The <em class="color">Time Gentlemen, Please!</em> and <em class="color">Ben There, Dan That!</em> Special Edition Double Pack," a pair of ridiculous British comedy adventure games by indie developer Size Five Games.<br /><small><em>(These games may not be appropriate for children.)</em></small></div>
<div class="element">
<label>
<div>Email address</div>
<input type="email" name="email" />
</label>
</div>
<div class="element volunteer">
<span>
<label class="selectable"><input type="radio" name="volunteer" value="visitor" id="volunteer_false"/>Visitor</label>
<label class="selectable"><input type="radio" name="volunteer" value="volunteer" id="volunteer_true"/>Volunteer</label>
</span>
</div>
<div class="element volname">
<label>
<div>Name</div>
<input type="text" name="name" />
</label>
</div>
<div class="element">
<label>
<div>Comments</div>
<textarea name="comments"></textarea>
</label>
</div>
<div class="element">
<input type="submit" id="submit_btn" value="Submit" />
</div>
</center>
</div>
</div>
</body>
</html>