From: riccardo <riccardo@parisson.com>
Date: Tue, 29 Mar 2011 14:10:26 +0000 (+0200)
Subject: added volume, still some changes to do in the playlist management and popups
X-Git-Tag: 1.1~320
X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=3ec0977c31ba74d52d76732f5bc466fedeab9429;p=telemeta.git

added volume, still some changes to do in the playlist management and popups
---

diff --git a/telemeta/htdocs/js/playerUtils.js b/telemeta/htdocs/js/playerUtils.js
index 93b0c51c..a6f30038 100644
--- a/telemeta/htdocs/js/playerUtils.js
+++ b/telemeta/htdocs/js/playerUtils.js
@@ -36,7 +36,9 @@ function load_sound() {
         
         TimeSide.load(function() {
             provider.setSource(sound);
+            player.updateVolumeAnchor(provider.getVolume());
         });
+
     // sound.load(); // Auto-loading overloads the Django test server
     }
 }
diff --git a/telemeta/htdocs/timeside/skins/lab/img/volume.png b/telemeta/htdocs/timeside/skins/lab/img/volume.png
index fb280164..d741e554 100644
Binary files a/telemeta/htdocs/timeside/skins/lab/img/volume.png and b/telemeta/htdocs/timeside/skins/lab/img/volume.png differ
diff --git a/telemeta/htdocs/timeside/skins/lab/style.css b/telemeta/htdocs/timeside/skins/lab/style.css
index abc95433..03365001 100755
--- a/telemeta/htdocs/timeside/skins/lab/style.css
+++ b/telemeta/htdocs/timeside/skins/lab/style.css
@@ -20,11 +20,18 @@
     line-height: 13px;
 }
 
-.ts-skin-lab .ts-player .ts-viewer .ts-pointer {
+.ts-skin-lab .ts-player .ts-viewer { /*.ts-pointer {*/
     color: #3c4251;
     background: #e7e7e7;
 }
+.ts-pointer{
+    border: 1px solid #B0C4DE !important;
+     -moz-border-radius: .5ex !important;
+    -webkit-border-radius: .5ex  !important;
+    border-radius: .5ex !important;
+    color: #006666 !important;
 
+}
 .ts-skin-lab .ts-player .ts-ruler .ts-section .ts-label {
     color: #c3c2cc;
     background: #2a3242;
@@ -75,7 +82,7 @@
     background-image: url('img/volume.png');
     background-repeat: no-repeat;
     background-position: 0px 0px !important;
-    width:160px !important;
+    width:60px !important;
 }
 
 .ts-skin-lab .ts-player .ts-control .ts-playback .ts-play {
diff --git a/telemeta/htdocs/timeside/src/player.js b/telemeta/htdocs/timeside/src/player.js
index b120cac9..b24c79cd 100644
--- a/telemeta/htdocs/timeside/src/player.js
+++ b/telemeta/htdocs/timeside/src/player.js
@@ -107,9 +107,12 @@ TimeSide(function($N, $J) {
             this.elements.pause.attr('href', '#').bind('click', this.attach(this._onPause));
             this.elements.play.attr('href', '#').bind('click', this.attach(this._onPlay));
             //
-            this.elements.volume.attr('href', '#').bind('mousedown', this.attach(
+            this.elements.volume.attr('href', '#').click(function(){return false;}).bind('mousedown', this.attach(
                 function(e){
-                    this.changeVolume(e);
+                    if(e.which===1){ //left button
+                        this.changeVolume(e);
+                    }
+                    return false;
                 }
                 ));
 
@@ -160,7 +163,7 @@ TimeSide(function($N, $J) {
                 resizeTimer = setTimeout(this.attach(this.resize), 100);
             }));
              //_updateVolumeChanged(this.soundProvider.getVolume());
-             this.soundProvider.observe('volume',this.onVolumeChanged);
+             this.soundProvider.observe('volume',this.attach(this.onVolumeChanged));
         //this.container.resize(this.attach(this.resize)); // Can loop ?
         },
 
@@ -264,7 +267,7 @@ TimeSide(function($N, $J) {
             var vol = event.layerX;
             for(var i=0; i<ticks.length; i++){
                 if(vol<=ticks[i]){
-                    var index = i;
+                    //var index = i;
                     var volume = i*20;
                     this.soundProvider.setVolume(volume);
                     return false;
@@ -281,13 +284,16 @@ TimeSide(function($N, $J) {
         },
 
         updateVolumeAnchor: function(volume){
-            var indices = [20,40,60,80,100];
+            var indices = [20,40,60,80,100,100000];
             for(var i=0; i <indices.length; i++){
                 if(volume<indices[i]){
-                    this.elements.volume.css('backgroundPositionY',-28*(indices.length-i));
+                    var pos = -28*i;
+                    pos = '0px '+ pos+ 'px !important';
+                    this.elements.volume.css('backgroundPosition',pos);
+                    return;
                 }
             }
-          this.elements.volume.css('backgroundPositionY',0)
+         // this.elements.volume.css('backgroundPosition','0px 0px !important')
 
         },
 
diff --git a/telemeta/htdocs/timeside/src/soundprovider.js b/telemeta/htdocs/timeside/src/soundprovider.js
index 621d81a0..b0e75923 100644
--- a/telemeta/htdocs/timeside/src/soundprovider.js
+++ b/telemeta/htdocs/timeside/src/soundprovider.js
@@ -42,8 +42,13 @@ TimeSide(function($N) {
 
         play: function() {
             if (this.sound) {
+                //it seems that, if sound is played until its end
+                //playing sound again resets the volume to 100, even though
+                //sound.volume is at the right value. We use this trick which seems to work:
+                this.sound.setVolume(this.sound.volume);
                 if (!this.sound.playState) {
                     this.sound.play();
+                    //console.log(this.getVolume());
                 } else if (this.sound.paused) {
                     this.sound.resume();
                 }
@@ -71,7 +76,7 @@ TimeSide(function($N) {
         },
 
         getVolume: function() {
-                return this.sound.volume;
+             return this.sound.volume;
         },
 
         seek: function(offset) {