FazBrowse GitHub Viewer
|
Trending
|
URL:
|
Home
Tools:
[Download Repo ZIP]
[View Raw Code]
[Original HTTPS Page]
JavaScript-ID3-Reader/example/index.html at master · aadsm/JavaScript-ID3-Reader · GitHub
aadsm
/
JavaScript-ID3-Reader
Public
Notifications
You must be signed in to change notification settings
Fork
140
Star
557
Code
Issues
10
Pull requests
3
Actions
Projects
Wiki
Security and quality
0
Insights
Additional navigation options
Code
Issues
Pull requests
Actions
Projects
Wiki
Security and quality
Insights
Expand file tree
Breadcrumbs
JavaScript-ID3-Reader
/
example
/
index.html
Copy path
More file actions
More file actions
Latest commit
History
History
History
75 lines (68 loc) · 2.18 KB
Breadcrumbs
JavaScript-ID3-Reader
/
example
/
index.html
Copy path
File metadata and controls
75 lines (68 loc) · 2.18 KB
Raw
Copy raw file
Download raw file
Open symbols panel
Edit and raw actions
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
<!DOCTYPE html
>
<
html
>
<
head
>
<
meta
charset
="
utf-8
"
>
<
title
>
Javascript ID3 Reader
</
title
>
<
meta
http-equiv
="
X-UA-Compatible
"
content
="
IE=edge,chrome=1
"
>
<
meta
name
="
description
"
content
=""
>
<
meta
name
="
viewport
"
content
="
width=device-width
"
>
<
script
src
="
../dist/id3-minimized.js
"
type
="
text/javascript
"
>
</
script
>
<!-- Can be handy for debugging -->
<!--script src="../src/id3-debug.js" type="text/javascript"></script-->
</
head
>
<
body
>
<
div
>
<
input
type
="
file
"
id
="
file
"
onchange
="
loadFile(this)
"
>
<
p
>
<
b
>
Title:
</
b
>
<
span
id
="
title
"
>
</
span
>
</
p
>
<
p
>
<
b
>
Artist:
</
b
>
<
span
id
="
artist
"
>
</
span
>
</
p
>
<
p
>
<
b
>
Album:
</
b
>
<
span
id
="
album
"
>
</
span
>
</
p
>
<
img
id
="
picture
"
src
=""
alt
= "
picture extracted from ID3
"
/>
</
div
>
<
script
>
/**
* Loading the tags using XHR.
*/
//sample.mp3 sits on your domain
ID3
.
loadTags
(
"sample.mp3"
,
function
(
)
{
showTags
(
"sample.mp3"
)
;
}
,
{
tags
:
[
"title"
,
"artist"
,
"album"
,
"picture"
]
}
)
;
/**
* Loading the tags using the FileAPI.
*/
function
loadFile
(
input
)
{
var
file
=
input
.
files
[
0
]
,
url
=
file
.
urn
||
file
.
name
;
ID3
.
loadTags
(
url
,
function
(
)
{
showTags
(
url
)
;
}
,
{
tags
:
[
"title"
,
"artist"
,
"album"
,
"picture"
]
,
dataReader
:
ID3
.
FileAPIReader
(
file
)
}
)
;
}
/**
* Generic function to get the tags after they have been loaded.
*/
function
showTags
(
url
)
{
var
tags
=
ID3
.
getAllTags
(
url
)
;
console
.
log
(
tags
)
;
document
.
getElementById
(
'title'
)
.
textContent
=
tags
.
title
||
""
;
document
.
getElementById
(
'artist'
)
.
textContent
=
tags
.
artist
||
""
;
document
.
getElementById
(
'album'
)
.
textContent
=
tags
.
album
||
""
;
var
image
=
tags
.
picture
;
if
(
image
)
{
var
base64String
=
""
;
for
(
var
i
=
0
;
i
<
image
.
data
.
length
;
i
++
)
{
base64String
+=
String
.
fromCharCode
(
image
.
data
[
i
]
)
;
}
var
base64
=
"data:"
+
image
.
format
+
";base64,"
+
window
.
btoa
(
base64String
)
;
document
.
getElementById
(
'picture'
)
.
setAttribute
(
'src'
,
base64
)
;
}
else
{
document
.
getElementById
(
'picture'
)
.
style
.
display
=
"none"
;
}
}
</
script
>
</
body
>
</
html
>
Back
|
FazBrowse Home
|
New Git URL