From ace2c5b2129b6d99b2a046c60e40dc104164cb7b Mon Sep 17 00:00:00 2001
From: matteo78 <quelquonque@hotmail.fr>
Date: Sun, 21 Dec 2014 21:21:43 +0100
Subject: [PATCH] :bug: Fix wrong look of speed control

Speed control wasn't looking correct
---
 css/piano.css            | 21 ++++++++++++++-------
 js/components/Control.js | 10 +++++++++-
 2 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/css/piano.css b/css/piano.css
index a66a5a2..230581f 100644
--- a/css/piano.css
+++ b/css/piano.css
@@ -279,13 +279,19 @@ a {
 
 /* set play speed */
 .main .control .selector {
-    text-align: center;
-    line-height: 32px;
-    
     border: 1px solid white;
     border-radius: 3px;
     overflow: hidden;
     
+    width: 32px;
+    height: 32px;
+    text-align: center;
+    line-height: 32px;
+    
+    cursor: pointer;
+    color: white;
+    background: none;
+    
     padding: 0;
 }
 
@@ -293,15 +299,16 @@ a {
     background: rgba(255, 255, 255, 0.05);
 }
 
-.main .control .selector:active {
-    padding: 1px 0 0 0;
-}
-
 .main .control .selector:before {
     content: '×';
     cursor: pointer;
 }
 
+.main .control .selector:active,
+.main .control .selector:active:before {
+    text-indent: 1px;
+}
+
 /* close opened file */
 .main .control .close {
     background-image: url('../images/icons/sidebar/close.png');
diff --git a/js/components/Control.js b/js/components/Control.js
index ba66fd4..270e646 100644
--- a/js/components/Control.js
+++ b/js/components/Control.js
@@ -12,6 +12,8 @@
      * @prop {speed: number}                Current speed rate
      * @prop {play: function}               Called to start playback
      * @prop {pause: function}              Called to pause playback
+     * @prop {halt: function}               Called to temporarily halt playback
+     * @prop {resume: function}             Called to resume halted playback
      * @prop {showChannelsModal: function}  Called to show channels manager
      * @prop {setPlaySpeed: function}       Called to set play speed
      * @prop {close: function}              Called to close
@@ -27,6 +29,9 @@
             
             play: React.PropTypes.func,
             pause: React.PropTypes.func,
+            halt: React.PropTypes.func,
+            resume: React.PropTypes.func,
+            
             showChannelsModal: React.PropTypes.func,
             setPlaySpeed: React.PropTypes.func,
             close: React.PropTypes.func
@@ -39,6 +44,9 @@
                 
                 play: function () {},
                 pause: function () {},
+                halt: function () {},
+                resume: function () {},
+                
                 showChannelsModal: function () {},
                 setPlaySpeed: function () {},
                 close: function () {}
@@ -99,7 +107,7 @@
                 
                 controls.push(App.components.UI.Selector({
                     key: 'setPlaySpeed',
-                    className: 'bt icon set-play-speed',
+                    className: 'bt set-play-speed',
                     
                     values: [1, 0.5, 0.3, 1, 2, 3],
                     value: this.props.speed,