-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
126 lines (96 loc) · 4.8 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
125
126
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Media Analyzer</title>
<link rel="shortcut icon" href="data:;base64,iVBORw0KGgo=" type="image/x-icon">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="wrapper">
<h3>Media Analyzer * <a href="https://github.com/aliyilmaz/media-analyzer">Github</a></h3>
<input type="file" id="fileinput" name="fileinput" multiple />
<input type="file" id="fileinput1" name="fileinput" multiple />
<input type="file" id="fileinput2" name="fileinput" multiple />
<br>(<small>also check the console</small>)<br>
<div id="output"></div>
<textarea id="output"></textarea>
</div>
<script type="text/javascript" src="mediainfo.min.js"></script>
<script type="text/javascript" src="script.js"></script>
<script>
let divOutputHtml = '',
divOutputElement = document.querySelector('div#output');
media_analyzer('#fileinput', function(e, media){
console.log(media);
for (let index = 0; index < media.length; index++) {
mime_type = (media[index]['mime_type'] != undefined) ? media[index]['mime_type'].split('/')[0] : undefined;
filename = truncate(basename(media[index]['filename']), 60);
// console.log(media[index]);
// .jpeg, .jpg, .png, .webp, .svg, .gif
if(mime_type == 'image'){
divOutputHtml = '<img src="'+(URL.createObjectURL(e.target.files[index]))+'" title="'+filename+'">';
}
// .mov, .mp4, .webm, .m4v, .mkv
if(mime_type == 'video'){
divOutputHtml = '<video src="'+(URL.createObjectURL(e.target.files[index]))+'" controls title="'+filename+'"></video>';
}
// .mp3, .wav, .flac, .aac, .m4a
if(mime_type == 'audio'){
divOutputHtml = '<audio src="'+(URL.createObjectURL(e.target.files[index]))+'" controls title="'+filename+'"></audio>';
}
// or...
divOutputElement.appendChild(stringToHTML(divOutputHtml));
}
document.querySelector('textarea#output').value = JSON.stringify(media, null, 2);
});
media_analyzer('#fileinput1', function(e, media){
console.log(media);
for (let index = 0; index < media.length; index++) {
mime_type = (media[index]['mime_type'] != undefined) ? media[index]['mime_type'].split('/')[0] : undefined;
filename = truncate(basename(media[index]['filename']), 60);
// console.log(media[index]);
// .jpeg, .jpg, .png, .webp, .svg, .gif
if(mime_type == 'image'){
divOutputHtml = '<img src="'+(URL.createObjectURL(e.target.files[index]))+'" title="'+filename+'">';
}
// .mov, .mp4, .webm, .m4v, .mkv
if(mime_type == 'video'){
divOutputHtml = '<video src="'+(URL.createObjectURL(e.target.files[index]))+'" controls title="'+filename+'"></video>';
}
// .mp3, .wav, .flac, .aac, .m4a
if(mime_type == 'audio'){
divOutputHtml = '<audio src="'+(URL.createObjectURL(e.target.files[index]))+'" controls title="'+filename+'"></audio>';
}
// or...
divOutputElement.appendChild(stringToHTML(divOutputHtml));
}
document.querySelector('textarea#output').value = JSON.stringify(media, null, 2);
});
media_analyzer('#fileinput2', function(e, media){
console.log(media);
for (let index = 0; index < media.length; index++) {
mime_type = (media[index]['mime_type'] != undefined) ? media[index]['mime_type'].split('/')[0] : undefined;
filename = truncate(basename(media[index]['filename']), 60);
// console.log(media[index]);
// .jpeg, .jpg, .png, .webp, .svg, .gif
if(mime_type == 'image'){
divOutputHtml = '<img src="'+(URL.createObjectURL(e.target.files[index]))+'" title="'+filename+'">';
}
// .mov, .mp4, .webm, .m4v, .mkv
if(mime_type == 'video'){
divOutputHtml = '<video src="'+(URL.createObjectURL(e.target.files[index]))+'" controls title="'+filename+'"></video>';
}
// .mp3, .wav, .flac, .aac, .m4a
if(mime_type == 'audio'){
divOutputHtml = '<audio src="'+(URL.createObjectURL(e.target.files[index]))+'" controls title="'+filename+'"></audio>';
}
// or...
divOutputElement.appendChild(stringToHTML(divOutputHtml));
}
document.querySelector('textarea#output').value = JSON.stringify(media, null, 2);
});
</script>
</body>
</html>