Address #560 by adding a 'Volume' label

This commit is contained in:
calzoneman 2016-03-23 22:45:54 -07:00
parent 7448429341
commit c5c40a0386
4 changed files with 29 additions and 6 deletions

View file

@ -23,9 +23,14 @@ window.SoundCloudPlayer = class SoundCloudPlayer extends Player
)
# Soundcloud embed widget doesn't have a volume control.
volumeSlider = $('<div/>').attr('id', 'widget-volume')
.css('top', '170px')
sliderHolder = $('<div/>').attr('id', 'soundcloud-volume-holder')
.insertAfter(widget)
$('<span/>').attr('id', 'soundcloud-volume-label')
.addClass('label label-default')
.text('Volume')
.appendTo(sliderHolder)
volumeSlider = $('<div/>').attr('id', 'soundcloud-volume')
.appendTo(sliderHolder)
.slider(
range: 'min'
value: VOLUME * 100

View file

@ -102,7 +102,7 @@ window.handleMediaUpdate = (data) ->
)
window.removeOld = (replace) ->
$('#sc_volume').remove()
$('#soundcloud-volume-holder').remove()
replace ?= $('<div/>').addClass('embed-responsive-item')
old = $('#ytapiplayer')
replace.insertBefore(old)

View file

@ -664,3 +664,19 @@ input#logout[type="submit"]:hover {
margin-left: 10px;
margin-right: 10px;
}
#soundcloud-volume-holder {
position: absolute;
top: 170px;
width: 100%;
}
#soundcloud-volume-label {
margin-left: 2px;
}
#soundcloud-volume {
margin-top: 5px;
margin-left: 10px;
margin-right: 10px;
}

View file

@ -714,7 +714,7 @@
this.setMediaProperties(data);
waitUntilDefined(window, 'SC', (function(_this) {
return function() {
var soundUrl, volumeSlider, widget;
var sliderHolder, soundUrl, volumeSlider, widget;
removeOld();
if (data.meta.scuri) {
soundUrl = data.meta.scuri;
@ -726,7 +726,9 @@
id: 'scplayer',
src: "https://w.soundcloud.com/player/?url=" + soundUrl
});
volumeSlider = $('<div/>').attr('id', 'widget-volume').css('top', '170px').insertAfter(widget).slider({
sliderHolder = $('<div/>').attr('id', 'soundcloud-volume-holder').insertAfter(widget);
$('<span/>').attr('id', 'soundcloud-volume-label').addClass('label label-default').text('Volume').appendTo(sliderHolder);
volumeSlider = $('<div/>').attr('id', 'soundcloud-volume').appendTo(sliderHolder).slider({
range: 'min',
value: VOLUME * 100,
stop: function(event, ui) {
@ -1350,7 +1352,7 @@
window.removeOld = function(replace) {
var old;
$('#sc_volume').remove();
$('#soundcloud-volume-holder').remove();
if (replace == null) {
replace = $('<div/>').addClass('embed-responsive-item');
}