-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
102 lines (89 loc) · 3.65 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
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<html>
<head>
<link rel="stylesheet" type="text/css" href="/css/main.css"></link>
<script type="text/javascript" src="/_ah/channel/jsapi"></script>
<script type="text/javascript" src="/soundmanager/script/soundmanager2.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="/js/song.js"></script>
<script type="text/javascript" src="/js/user.js"></script>
<script type="text/javascript" src="/js/channel.js"></script>
<script type="text/javascript" src="/js/main.js"></script>
<!-- This is used to pass values to the client on initial load -->
<script type="text/javascript">
var server_token = "{{ token }}";
var server_me = "{{ me }}";
var server_me_email = "{{ me_email }}";
var server_session_key = "{{ session_key }}";
var server_session_link = "{{ session_link }}";
var server_logout_link = "{{ logout_link }}";
</script>
</head>
<body>
<div id="container">
<!-- Header (title, logout) -->
<div id="header" class="text-center">
<a href="/" style="text-decoration: none"><div id="title"><img style="height: 100px;" src="/images/clouDJ_logo.png"></div></a>
<button id="logout" class="right">Logout</button>
</div>
<!-- Left side (potential sessions, friend management) -->
<div id="left">
<div id="session_list">
<h2>Session List</h2>
<div id="other_sessions">
<ul id="sessions"></ul>
</div>
<h2>Current Session</h2>
<div id="upload_song">
<form id="upload_song_form" action="/update" target="hidden_frame" method="POST" enctype="multipart/form-data">
Add song to playlist: <input id="upload_song_form_file" type="file" name="file">
<input id="upload_song_form_filename" class="hidden" type="text" name="filename">
<!--<input id="upload_song_form_endflag" class="hidden" type="checkbox" name="endflag" checked="true">-->
<input id="upload_song_form_session_key" class="hidden" type="text" name="session_key">
</form>
</div>
<div id="add_user">
<form action="/add_listener" target="hidden_frame" method="post">
<div><input type="text" name="email" rows="1" cols="40" style="width: 260px"></textarea></div>
<div><input type="submit" value="Add User To Session"></div>
</form>
</div>
<div id="remove_user">
<form action="/remove_listener" target="hidden_frame" method="post">
<div><input type="text" name="email" rows="1" cols="40" style="width: 260px"></textarea></div>
<div><input type="submit" value="Remove User From Session"></div>
</form>
</div>
<!--<button id="reset">Reset</button>-->
</div>
<iframe id="hidden_frame" class="hidden"></iframe>
</div>
<!-- Right side (current song, up next, listeners) -->
<div id="right">
<div id="currently_playing">
<h1 class="text-center">Currently Playing</h1>
<div id="song">
Song: <div id="song_title"></div></br>
Artist: <div id="song_artist"></div></br>
Album: <div id="song_album"></div></br>
<div id="song_playback"></div></br>
<div id="song_loading"></div></br>
<hr>
<p align="center"><button id="toggle_mute">Toggle Mute</button>
<button id="pause_button">Pause</button>
<button id="play_button">Play</button>
<button id="next_button">Next</button>
</p>
</div>
</div>
<div id="song_list">
<h2>Up next</h2>
<ul id="songs"></ul>
</div>
<div id="listener_list">
<h2>Listener List</h2>
<ul id="listeners"></ul>
</div>
</div>
</div>
</body>
</html>