sanj/oxjs
1
0
Fork 0
forked from 0x2620/oxjs
Code Pull requests Activity

update Ox.AudioPlayer + CSS

Browse source
This commit is contained in:
rolux 2014-08-19 10:18:35 +02:00
commit e56333523b
2 changed files with 48 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

53
source/Ox.UI/js/Audio/AudioPlayer.js
View file

@ -78,8 +78,37 @@ Ox.AudioPlayer = function(options, self) {
self.tracks = self.options.audio.length;
self.volume = self.options.muted ? 1 : self.options.volume;
self.$listButton = Ox.MenuButton({
items: self.options.audio.slice(
Math.max(self.options.track - 10, 0),
Math.min(self.options.track + 11, self.tracks)
).map(function(track, index) {
index += Math.max(self.options.track - 10, 0);
return {
id: index.toString(),
title: formatTrack(track),
checked: index == self.options.track
};
}),
maxWidth: 256,
overlap: 'left',
title: 'select',
type: 'image'
})
.addClass('OxListButton')
.appendTo(that);
self.$shuffleButton = Ox.Button(
Ox.extend({overlap: 'left', type: 'image'}, getButtonOptions('shuffle'))
)
.addClass('OxShuffleButton')
.bindEvent({
click: toggleShuffle
})
.appendTo(that);
self.$repeatButton = Ox.Button(
Ox.extend({overlap: 'right', type: 'image'}, getButtonOptions('repeat'))
Ox.extend({overlap: 'left', type: 'image'}, getButtonOptions('repeat'))
)
.addClass('OxRepeatButton')
.bindEvent({
@ -93,15 +122,6 @@ Ox.AudioPlayer = function(options, self) {
})
.appendTo(that);
self.$shuffleButton = Ox.Button(
Ox.extend({overlap: 'left', type: 'image'}, getButtonOptions('shuffle'))
)
.addClass('OxShuffleButton')
.bindEvent({
click: toggleShuffle
})
.appendTo(that);
self.$trackLabel = Ox.Label({
textAlign: 'center',
title: '',
@ -222,6 +242,12 @@ Ox.AudioPlayer = function(options, self) {
setTrack(self.options.track);
function formatTrack(data) {
return [
data.name, data.artist, data.album, data.year
].join(' · ');
}
function getButtonOptions(id) {
var options;
if (id == 'mute') {
@ -290,7 +316,7 @@ Ox.AudioPlayer = function(options, self) {
function setSizes() {
that.css({width: self.options.width + 'px'});
self.$trackLabel.options({width: self.options.width - 32});
self.$trackLabel.options({width: self.options.width - 46});
self.$positionSlider.options({size: self.options.width - 262});
self.$positionLabel.css({left: self.options.width - 232 + 'px'});
self.$volumeLabel.css({left: self.options.width - 46 + 'px'})
@ -308,12 +334,9 @@ Ox.AudioPlayer = function(options, self) {
}
function setTrack(track) {
var data = self.options.audio[track];
self.options.track = track;
self.$trackLabel.options({
title: [
data.name, data.artist, data.album, data.year
].join(' · ')
title: formatTrack(self.options.audio[track])
});
self.$audio.options({src: self.options.audio[self.options.track].file});
!self.options.paused && self.$audio.play();