forked from fasterthanlime/jsmad
-
Notifications
You must be signed in to change notification settings - Fork 0
/
mhd.js
107 lines (89 loc) · 3.21 KB
/
mhd.js
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
function onPlayPause() {
console.log("playPause");
}
function onSeek(percentage) {
console.log("seek " + percentage + "%");
}
function onProgress(current, total, preload) {
//console.log("current = " + current + ", total = " + total);
var preloadbar = document.getElementById('preloadbar');
preloadbar.style.width = (preload * 360) + 'px';
var progressbar = document.getElementById('progressbar');
progressbar.style.width = (current / total * 360) + 'px';
}
var globalPlayer = null;
var ofm = new OfficialFM('Q5Bd7987TmfsNVOHP9Zt');
var ofmTrack = null;
function domReady() {
document.getElementById('ofm').onkeypress = function (ev) {
if(ev.keyCode == 13) { // enter pressed?
var track_id = this.value;
var url = "https://jsmad.org/track/" + track_id;
ofm.track(track_id, function(track) {
ofmTrack = track;
Mad.Player.fromURL(url, usePlayer);
});
return false;
}
};
}
function usePlayer (player) {
if(globalPlayer) globalPlayer.destroy();
globalPlayer = player;
if (player.id3) {
var id3 = player.id3.toHash();
var id3element = document.getElementById('ID3');
var id3string = "<div class='player'><div class='picture'>";
var pictures = id3['Attached picture'];
if(ofmTrack) {
id3string += "<img class='picture' src='" + ofmTrack.picture_absolute_url.replace('_small', '_large') + "' />";
} else if (pictures) {
var mime = pictures[0].mime;
var enc = btoa(pictures[0].value);
id3string += "<img class='picture' src='data:" + mime + ';base64,' + enc + "' />";
} else {
id3string += "<img class='picture' src='../images/nopicture.png' />";
}
id3string += "<a href='#' id='playpause' class='button play'></a>";
id3string += "<div class='timeline'><div id='preloadbar'><div id='progressbar'></div></div></div>";
id3string += "</div></div>";
id3string += "<div class='info'>";
id3string += "<h2>" + (ofmTrack ? ofmTrack.title : id3['Title/Songname/Content description']) + "</h2>";
id3string += "<h3>" + (ofmTrack? ofmTrack.artist_string: id3['Lead artist/Lead performer/Soloist/Performing group']) + "</h3>";
id3string += "<div class='meta'>";
if(id3['Album/Movie/Show title']) {
id3string += "<p><strong>Album:</strong> " + id3['Album/Movie/Show title'] + "</p>";
}
if(id3['Track number/Position in set']) {
id3string += "<p><strong>Track:</strong> " + id3['Track number/Position in set'] + "</p>";
}
if(id3['Year']) {
id3string += "<p><strong>Year:</strong> " + id3['Year'] + "</p>";
}
id3string += "</div>";
id3string += "</div>";
ofmTrack = null;
id3element.innerHTML = id3string;
document.getElementById('playpause').onclick = function () {
player.setPlaying(!player.playing);
return false;
};
}
player.onProgress = onProgress;
player.onPlay = function() {
document.getElementById('playpause').className = 'button pause';
};
player.onPause = function() {
document.getElementById('playpause').className = 'button play';
};
player.createDevice();
}
function readFile() {
// uploadData is a form element
// fileChooser is input element of type 'file'
var file = document.forms['uploadData']['fileChooser'].files[0];
if (!file) {
return;
}
Mad.Player.fromFile(file, usePlayer);
}