danbarber/neompc
1
0
Fork 0
mirror of https://github.com/danbee/neompc synced 2025-03-04 08:39:10 +00:00
Code Issues Releases Wiki Activity

~ Volume control works now! Still some tweaking to be done.

Browse Source
This commit is contained in:
Dan Barber 2010-01-13 18:15:57 +00:00
parent db27ac9573
commit 20f5bb09cf
7 changed files with 109 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
control.php
View File

@ -33,6 +33,11 @@
$repeat = ($mympd->repeat == 0 ? 1 : 0);
$mympd->SetRepeat($repeat);
break;
case 'volume':
$volume = $_GET['value'];
$mympd->SetVolume($volume);
die();
break;
}
echo mpd_info();

70
lib/js/neompc.js
View File

@ -3,6 +3,7 @@ template = '{:$template:}';
volume_min = {:$volume_min:};
volume_max = {:$volume_max:};
vol_orientation = '{:$volume_orientation:}'
vol_offset = 0;
String.prototype.pad = function(l, s){
return (l -= this.length) > 0 ? (s = new Array(Math.ceil(l / s.length) + 1).join(s)).substr(0, s.length) + this + s.substr(0, l - s.length) : this;
@ -14,41 +15,46 @@ function seconds_to_time(seconds) {
}
function volume_to_pos(volume) {
pos = volume_min + (volume / 100) * (volume_max - volume_min);
pos = Math.round(volume_min + ((volume / 100) * (volume_max - volume_min)));
return pos;
}
function pos_to_volume(pos) {
volume = Math.round(((pos - volume_min) / (volume_max - volume_min)) * 100);
return volume;
}
function ajax_control(action) {
function ajax_control(action, value) {
// this function will fire an AJAX call with the appropriate action.
// or it will simply fire an AJAX call to get the current status.
$.getJSON('control.php', {action: action},
$.getJSON('control.php', {action: action, value: value},
function(data){
// this is where we update the page.
if (data.state == 'play') {
$('#playpause_button').addClass('pause');
if (data != null) {
if (data.state == 'play') {
$('#playpause_button').addClass('pause');
}
else {
$('#playpause_button').removeClass('pause');
}
$('#pos').text((data.track_no > -1 ? data.track_no+'.' : ''));
$('#artist').text(data.artist || '');
$('#album').text(data.album || '');
$('#title').text(data.title || '');
$('#cover').attr('src', (data.coverimage ? data.coverimage : 'templates/'+template+'/images/default_cover.png'));
$('#current').text((data.position > -1 ? seconds_to_time(data.position) : '--:--'));
if (data.repeat == 1) {
$('#repeat_button').addClass('selected');
}
else {
$('#repeat_button').removeClass('selected');
}
if ($('#volume_slider').attr('rel') != '1') {
$('#volume_slider').css((vol_orientation == 'h' ? 'left' : 'top'), volume_to_pos(data.volume)+'px');
}
update_progress(data.position, data.length);
}
else {
$('#playpause_button').removeClass('pause');
}
$('#pos').text((data.track_no > -1 ? data.track_no+'.' : ''));
$('#artist').text(data.artist || '');
$('#album').text(data.album || '');
$('#title').text(data.title || '');
$('#cover').attr('src', (data.coverimage ? data.coverimage : 'templates/'+template+'/images/default_cover.png'));
$('#current').text((data.position > -1 ? seconds_to_time(data.position) : '--:--'));
if (data.repeat == 1) {
$('#repeat_button').addClass('selected');
}
else {
$('#repeat_button').removeClass('selected');
}
$('#volume_slider').css('top', volume_to_pos(data.volume)+'px');
update_progress(data.position, data.length);
});
}
@ -85,8 +91,6 @@ function show_volume() {
$(document).ready(function(){
update_int = null;
$('.control_button').click(function(event){
ajax_control(this.rel);
this.blur();
@ -98,11 +102,25 @@ $(document).ready(function(){
return false;
});
$('#volume_container').click(function(event){
$('#volume_hide').click(function(event){
hide_volume();
return false;
});
$('#volume_slider').draggable({
axis: 'y',
containment: 'parent',
opacity: 0.5,
start: function() {
this.rel = '1';
},
stop: function() {
pos = parseInt($('#volume_slider').css('top'));
ajax_control('volume', pos_to_volume(pos));
this.rel = '';
}
});
ajax_control();
ajax_int = setInterval('ajax_control()', 1000);

72
smarty/templates_c/%%FD^FD6^FD689738%%neompc.js.php
View File

@ -1,4 +1,4 @@
<?php /* Smarty version 2.6.26, created on 2010-01-12 20:03:58
<?php /* Smarty version 2.6.26, created on 2010-01-13 17:13:45
compiled from ../lib/js/neompc.js */ ?>
progressbar_width = <?php echo $this->_tpl_vars['progressbar_width']; ?>
;
@ -10,6 +10,7 @@ volume_max = <?php echo $this->_tpl_vars['volume_max']; ?>
;
vol_orientation = '<?php echo $this->_tpl_vars['volume_orientation']; ?>
'
vol_offset = 0;
String.prototype.pad = function(l, s){
return (l -= this.length) > 0 ? (s = new Array(Math.ceil(l / s.length) + 1).join(s)).substr(0, s.length) + this + s.substr(0, l - s.length) : this;
@ -21,41 +22,46 @@ function seconds_to_time(seconds) {
}
function volume_to_pos(volume) {
pos = volume_min + (volume / 100) * (volume_max - volume_min);
pos = Math.round(volume_min + ((volume / 100) * (volume_max - volume_min)));
return pos;
}
function pos_to_volume(pos) {
volume = Math.round(((pos - volume_min) / (volume_max - volume_min)) * 100);
return volume;
}
function ajax_control(action) {
function ajax_control(action, value) {
// this function will fire an AJAX call with the appropriate action.
// or it will simply fire an AJAX call to get the current status.
$.getJSON('control.php', {action: action},
$.getJSON('control.php', {action: action, value: value},
function(data){
// this is where we update the page.
if (data.state == 'play') {
$('#playpause_button').addClass('pause');
if (data != null) {
if (data.state == 'play') {
$('#playpause_button').addClass('pause');
}
else {
$('#playpause_button').removeClass('pause');
}
$('#pos').text((data.track_no > -1 ? data.track_no+'.' : ''));
$('#artist').text(data.artist || '');
$('#album').text(data.album || '');
$('#title').text(data.title || '');
$('#cover').attr('src', (data.coverimage ? data.coverimage : 'templates/'+template+'/images/default_cover.png'));
$('#current').text((data.position > -1 ? seconds_to_time(data.position) : '--:--'));
if (data.repeat == 1) {
$('#repeat_button').addClass('selected');
}
else {
$('#repeat_button').removeClass('selected');
}
if ($('#volume_slider').attr('rel') != '1') {
$('#volume_slider').css((vol_orientation == 'h' ? 'left' : 'top'), volume_to_pos(data.volume)+'px');
}
update_progress(data.position, data.length);
}
else {
$('#playpause_button').removeClass('pause');
}
$('#pos').text((data.track_no > -1 ? data.track_no+'.' : ''));
$('#artist').text(data.artist || '');
$('#album').text(data.album || '');
$('#title').text(data.title || '');
$('#cover').attr('src', (data.coverimage ? data.coverimage : 'templates/'+template+'/images/default_cover.png'));
$('#current').text((data.position > -1 ? seconds_to_time(data.position) : '--:--'));
if (data.repeat == 1) {
$('#repeat_button').addClass('selected');
}
else {
$('#repeat_button').removeClass('selected');
}
$('#volume_slider').css('top', volume_to_pos(data.volume)+'px');
update_progress(data.position, data.length);
});
}
@ -92,8 +98,6 @@ function show_volume() {
$(document).ready(function(){
update_int = null;
$('.control_button').click(function(event){
ajax_control(this.rel);
this.blur();
@ -105,11 +109,25 @@ $(document).ready(function(){
return false;
});
$('#volume_container').click(function(event){
$('#volume_hide').click(function(event){
hide_volume();
return false;
});
$('#volume_slider').draggable({
axis: 'y',
containment: 'parent',
opacity: 0.5,
start: function() {
this.rel = '1';
},
stop: function() {
pos = parseInt($('#volume_slider').css('top'));
ajax_control('volume', pos_to_volume(pos));
this.rel = '';
}
});
ajax_control();
ajax_int = setInterval('ajax_control()', 1000);

4
templates/default/config.inc.php
View File

@ -7,7 +7,7 @@
$_CONFIG['progress_bar_width'] = 276;
$_CONFIG['volume_orientation'] = 'v';
$_CONFIG['volume_max'] = 5;
$_CONFIG['volume_min'] = 105;
$_CONFIG['volume_max'] = 0;
$_CONFIG['volume_min'] = 100;
?>

8
templates/default/control.html
View File

@ -17,7 +17,7 @@
<div id="album_info"><p id="artist"></p><p id="album"></p></div>
<div id="tracktime"><span id="current">--:--</span></div>
<div id="tracktime"><span id="current">--:--</span><span id="volume_display"></span></div>
<div id="progress"><div id="progressbar" style="margin-right: 100%;">&nbsp;</div></div>
@ -37,8 +37,10 @@
</ul>
<div id="volume_repeat">
<div id="volume_container">
<a id="volume_slider"></a>
<a id="volume_hide" href="index.php?action=hide_volume"></a>
<div id="slider_container">
<a id="volume_slider"></a>
<a id="volume_hide" href="index.php?action=hide_volume"></a>
</div>
</div>
<a rel="volume" id="volume_button" href="index.php?action=show_volume"></a>
<a rel="repeat" id="repeat_button" class="control_button" href="index.php?action=repeat"></a>

1
templates/default/index.html
View File

@ -11,6 +11,7 @@
</style>
<script type="text/javascript" src="lib/js/jquery-min.js"></script>
<script type="text/javascript" src="lib/js/jquery-ui-custom-min.js"></script>
<script type="text/javascript">
{:include file="../lib/js/neompc.js":}
</script>

8
templates/default/styles.css
View File

@ -231,6 +231,12 @@ img.button {
height: 160px;
width: 30px;
}
#volume_container #slider_container {
position: absolute;
top: 5px;
height: 130px;
width: 28px;
}
#volume_container a#volume_hide {
position: absolute;
top: 140px;
@ -238,7 +244,7 @@ img.button {
width: 30px;
height: 20px;
}
#volume_container a#volume_slider {
#volume_container #volume_slider {
background: url(templates/{:$template:}/images/volume_slider.png) center center no-repeat;
position: absolute;
top: 5px;