forked from dfarrenk/ProjectOne
-
Notifications
You must be signed in to change notification settings - Fork 0
/
group.html
88 lines (79 loc) · 3.7 KB
/
group.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
85
86
87
88
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>Secret Santa Groups</title>
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase.js"></script>
<!-- initializing firebase -->
<script src="assets/javascript/firebase_initialization.js"></script>
<!-- JQuery link -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<link rel="stylesheet" href="assets/css/groupStyle.css" type="text/css" />
</head>
<body>
<div id="header" class="valign-wrapper">
<img src="assets/images/secretSanta.png" alt="Secret Santa Image">
</div>
<div class="row">
<div class="col s9 l6">
<div class="row valign-wrapper">
<h4 class="center-align">
<span>Welcome,</span>
<span class="userName">User's Name</span> !
<a id="menuButton" class="dropdown-button btn" data-activates="menu"><i class="material-icons">arrow_drop_down</i></a>
</h4>
<ul id='menu' class='dropdown-content'>
<li><a href="#!" id="signOut">Sign Out</a></li>
<li><a class="modal-trigger" href="#modal1">New group</a></li>
<li><a class="modal-trigger" href="#modal2">Join group</a></li>
</ul>
<!-- create a new group Trigger -->
</div>
</div>
<div class="col s12 l3">
<div id="modal1" class="modal">
<div class="modal-content">
<h4>Create a new group</h4>
<input type="text" name="nameOfGroup" placeholder="Name of group" id='nameOfGroup'>
<button class="btn" id='createNewGroup'>Submit</button>
<button class="btn modal-action modal-close">Close</button>
</div>
</div>
<div id="modal2" class="modal">
<div class="modal-content">
<h4>Join a group</h4>
<input type="text" name="nameOfGroup" placeholder="Name of group" id='nameOfGroupJoin'>
<button class="btn" id='joinGroup'>Submit</button>
<button class="btn modal-action modal-close">Close</button>
</div>
</div>
</div>
<div class="col s3 l3">
<div style="padding: 20px">
<button class="btn-floating btn-large waves-effect waves-light right" id="play-music"><i class="material-icons">play_circle_outline</i></button>
<div id="player" style="visibility:hidden"></div>
</div>
</div>
</div>
<!-- main field with group list -->
<div class="row">
<div class="col s12" id="mainField">
</div>
<!--TODO: Link Me-->
<script src="assets/javascript/script.js"></script>
<script type="text/javascript" src="assets/javascript/music.js"></script>
<script>
$("#expandEmail0").click(function() {
$("#emailForm0").toggleClass("scale-out").toggleClass("scale-in");
});
</script>
</div>
<!-- Modal Structure -->
</body>
</html>