77 lines
3.0 KiB
JavaScript
77 lines
3.0 KiB
JavaScript
"use strict";
|
|
(function() {
|
|
var moduleName = "views/songProgress";
|
|
|
|
var deps = [];
|
|
deps.push("views/view");
|
|
|
|
define(moduleName, deps, function() {
|
|
var View = require("views/view");
|
|
|
|
var SongProgress = View.inherit({
|
|
className: "SongProgress",
|
|
constructor: function(controller, options) {
|
|
var base = {
|
|
minHeight: 10,
|
|
maxHeight: 10
|
|
};
|
|
W.extend(base, options)
|
|
var el = document.createElement("div");
|
|
this._createBars();
|
|
View.fn.constructor.call(this, controller, base, el);
|
|
|
|
this._f.on("load", this._onLoad, this);
|
|
this._f.on("playback", this._onPlayback, this);
|
|
|
|
this._e.style.backgroundColor = "#eeeeee";
|
|
this._e.appendChild(this._loadProgress);
|
|
this._e.appendChild(this._playbackProgress);
|
|
},
|
|
destructor: function() {
|
|
this._f.off("load", this._onLoad, this);
|
|
this._f.off("playback", this._onPlayback, this);
|
|
|
|
View.fn.destructor.call(this);
|
|
},
|
|
_createBars: function() {
|
|
|
|
this._loadProgress = document.createElement("div");
|
|
this._playbackProgress = document.createElement("div");
|
|
|
|
this._loadProgress.style.backgroundColor = View.theme.secondaryColor || "#ffff00";
|
|
this._loadProgress.style.height = "100%";
|
|
this._loadProgress.style.width = "0";
|
|
this._loadProgress.style.position = "absolute";
|
|
this._loadProgress.style.top = "0";
|
|
this._loadProgress.style.left = "0";
|
|
|
|
this._playbackProgress.style.backgroundColor = View.theme.primaryColor || "#ff0000";
|
|
this._playbackProgress.style.height = "100%";
|
|
this._playbackProgress.style.width = "0";
|
|
this._playbackProgress.style.position = "absolute";
|
|
this._playbackProgress.style.top = "0";
|
|
this._playbackProgress.style.left = "0";
|
|
},
|
|
_onData: function() {
|
|
this._onLoad(this._f.load);
|
|
this._onPlayback(this._f.playback);
|
|
},
|
|
_onLoad: function(load) {
|
|
this._loadProgress.style.width = load * 100 + "%";
|
|
},
|
|
_onPlayback: function(pb) {
|
|
this._playbackProgress.style.width = pb * 100 + "%";
|
|
},
|
|
_resetTheme: function() {
|
|
View.fn._resetTheme.call(this);
|
|
|
|
this._loadProgress.style.backgroundColor = View.theme.secondaryColor || "#ffff00"
|
|
this._playbackProgress.style.backgroundColor = View.theme.primaryColor || "#ff0000";
|
|
}
|
|
});
|
|
|
|
return SongProgress;
|
|
})
|
|
})();
|
|
|