-
Notifications
You must be signed in to change notification settings - Fork 0
/
radio.html
150 lines (145 loc) · 6.87 KB
/
radio.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
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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>PipBoy</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/pipboy.app.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light first-navbar">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-SupportedContent" aria-expanded="false" aria-label="Toggle-navigation"></button>
<div class="collapse navbar-collapse" id="navbarSupportContent mainNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="index.html">STAT</a>
</li>
<li class="nav-item">
<a class="nav-link" href="inv.html">INV</a>
</li>
<li class="nav-item">
<a class="nav-link" href="data.html">DATA</a>
</li>
<li class="nav-item">
<a class="nav-link" href="map.html">MAP</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="radio.html">RADIO</a>
</li>
</ul>
</div>
</nav>
<span class="playlist-text">PLAYLIST</span>
<span class="playlist-background"></span>
<div class="container">
<div class="row">
<div class="col col-radio text-center">
<ul class="list-group">
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(0)">A WONDERFUL GUY</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(1)">ACCENTUATE THE POSITIVE</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(2)">ANYTHING GOES</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(3)">ATOM BOMB BABY</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(4)">BUTCHER PETE</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(5)">CRAZY HE CALLS ME</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(6)">CIVILIZATION</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(7)">END OF THE WORLD</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(8)">THE WANDERER</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(9)">URANIUM FEVER</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(10)">A KISS TO BUILD A DREAM ON</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(11)">AIN'T THAT A KICK IN THE HEAD</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(12)">BIG IRON</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(13)">ROCKET 69</a>
</li>
<li class="list-group-item text-left">
<span> <img src="Radio Music/play button.png"> </span>
<a href="#" onclick="loadSong(14)">TAKE ME HOME, COUNTRY ROADS</a>
</li>
</ul>
</div>
<div class="col text-center">
<div class="audio-player-container">
<div class="player">
<img src="Radio Music/shuffle.png" onclick="shuffle();">
<img src="Radio Music/previous song.png" onclick="previous();">
<img id="play-pause-check" src="Radio Music/play button.png" onclick="playPause(this);">
<img src="Radio Music/next song.png" onclick="next();">
<img src="Radio Music/replay.png" onclick="replay();">
</div>
<div class="player slider">
<img src="Radio Music/mute.png" onclick="mute(this);">
<input id="songSlider" class="song-slider" type="range" min="0" step="1" onchange="seekSong()">
</div>
</div>
<div>
<div class="wave">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
</div>
</div>
<navbar class="navbar-light pip-footer pip-footer-radio">
</navbar>
<script src="js/jquery-2.5.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/radio.js"></script>
</body>
</html>