-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
124 lines (119 loc) · 4.77 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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/player.js"></script>
<link rel="stylesheet" href="style/main.css">
<link rel="stylesheet" href="style/player.css">
<title>HearMe</title>
</head>
<body>
<span class="separator"></span>
<img src="helpers/indexbutton.svg" id="logo" onclick="showPlayer()">
<div id="tabs">
<div tabindex="0" onclick="gotoPage(0)" class="tabOption" onmouseover="te(0, 1, this, '4em')" onmouseleave="te(0, 0, this)">
<div class="tabName">Página Inicial</div>
<span class="underline"></span>
</div>
<div tabindex="1" onclick="gotoPage(1)" class="tabOption" onmouseover="te(1, 1, this, '2.7em')" onmouseleave="te(1, 0, this)">
<div class="tabName">Descobrir</div>
<span class="underline"></span>
</div>
<div tabindex="2" onclick="gotoPage(2)" class="tabOption" onmouseover="te(2, 1, this, '1.3em')" onmouseleave="te(2, 0, this)">
<div class="tabName">Você</div>
<span class="underline"></span>
</div>
<div tabindex="3" onclick="gotoPage(3)" class="tabOption" onmouseover="te(3, 1, this, '1.6em')" onmouseleave="te(3, 0, this)">
<div class="tabName">Sobre</div>
<span class="underline"></span>
</div>
<div tabindex="-1" onclick="gotoPage(-1)" class="compOption" onmouseover="ate(4, 1, this)" onmouseleave="ate(4, 0, this)">
<div class="tabName">Ajuda</div>
</div>
<div tabindex="-2" onclick="gotoPage(-2)" class="compOption" onmouseover="ate(5, 1, this)" onmouseleave="ate(5, 0, this)">
<div class="tabName">Se Inscrever / Entrar</div>
</div>
</div>
<audio id="song" src="none"></audio>
<div id="workablescreen"></div>
<div style="visibility: hidden;"><object id="songinfo"></object></div> <!--AJEITAR ESSE BANG-->
<div id="playerws" tabindex="-99" onfocusout="pin_condition()">
<!--Album cover, song name and copy button-->
<div id="pinbutton">
<label>
<input id="pincheck" type="checkbox" oninput="selectpin()" checked>
<span class="container">
<span class="checked">
<span class="checkmark">
<img src="helpers/player/pin.svg" width="10px">
</span>
</span>
</span>
</label>
</div>
<img id="album_cover" src="helpers/player/default_cover.jpg" width="140px">
<div id="name_container">
<div id="song_name">Nenhuma música sendo tocada no momento.</div>
<span id="copybutton" onclick="copysongname()">
<img src="helpers/player/copy.svg" width="10px">
<span>COPIAR</span>
</span>
<br>
<!--audio seeker-->
<div id="time">
<div class="current">0:00</div>
<div class="duration">0:00</div>
<input type="range" id="seek-bar" max="100" value="0">
</div>
<br>
<!--Volume seeker-->
<div id="volume">
<span id="volumenumber">100</span>
<img src="helpers/player/sound.svg" width="20px" style="cursor: pointer;" onclick="volIcon(this)">
<input type="range" id="volume-bar" max="100" value="100" oninput="volControl(this.value)">
</div>
</div>
<!--Play and pause buttons-->
<table class="mainbuttons">
<tr style="height: 35px;">
<th><img src="helpers/player/nextprevbutton.svg" width="20px" style="transform: rotate(180deg);"></th>
<th id="playpause" onclick="play_pause(this)"><img src="helpers/player/play.svg" width="20px"></th>
<th><img width="20px" src="helpers/player/nextprevbutton.svg"></th>
</tr>
</table>
<table class="songmetainfo">
<tr>
<td>ARTISTA<span style="color: rgb(191, 64, 191);">:</span></td>
<td></td>
</tr>
<tr>
<td>VERSÃO<span style="color: rgb(191, 64, 191);">:</span></td>
<td><a></a></td>
</tr>
<tr>
<td>LETRA<span style="color: rgb(191, 64, 191);">:</span></td>
<td><a></a></td>
</tr>
<tr>
<td>LANÇADO<span style="color: rgb(191, 64, 191);">:</span></td>
<td><a></a></td>
</tr>
<tr>
<td>PROD. VOCAL<span style="color: rgb(191, 64, 191);">:</span></td>
<td><a></a></td>
</tr>
<tr>
<td>DIREITOS AUTORAIS<span style="color: rgb(191, 64, 191);">:</span></td>
<td><a></a></td>
</tr>
<tr>
<td>DISTRIBUIDORA<span style="color: rgb(191, 64, 191);">:</span></td>
<td><a></a></td>
</tr>
</table>
</div> <!--END PLAYERWS-->
</body>
</html>