From c11d8f5366b6ff847f0a8387f9d020aebe0484f0 Mon Sep 17 00:00:00 2001
From: Edward Opare-Aryee <ed@thisissoon.com>
Date: Mon, 27 Jul 2015 17:47:59 +0100
Subject: [PATCH] add controls to current view

---
 app/less/default/core/normalize.less   |  2 +-
 app/less/default/modules/controls.less |  6 +++++-
 app/less/default/modules/track.less    |  4 ++++
 app/partials/player/current.html       | 23 ++++++++++++++++++++++-
 4 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/app/less/default/core/normalize.less b/app/less/default/core/normalize.less
index 8d785d5a..02bf99ff 100644
--- a/app/less/default/core/normalize.less
+++ b/app/less/default/core/normalize.less
@@ -18,7 +18,7 @@ ng-view {
     position: fixed;
     top: @view-position-top;
 
-    .current ng-view {
+    .current & {
         bottom: 0;
     }
 }
diff --git a/app/less/default/modules/controls.less b/app/less/default/modules/controls.less
index 37b6f20c..2b6935bc 100644
--- a/app/less/default/modules/controls.less
+++ b/app/less/default/modules/controls.less
@@ -8,11 +8,15 @@
     .flex-direction(row);
     .flex-wrap(nowrap);
     .justify-content(space-between);
-    background-color: @controls-bg;
     height: @controls-height;
     min-width: 340px;
     padding-right: 30px;
     text-align: right;
+
+    .current & {
+        .justify-content(center);
+        padding-right: 0;
+    }
 }
 
 .playing-animation {
diff --git a/app/less/default/modules/track.less b/app/less/default/modules/track.less
index 2e63336e..21f10fb0 100644
--- a/app/less/default/modules/track.less
+++ b/app/less/default/modules/track.less
@@ -60,6 +60,10 @@
     .align-self(center);
     margin-right: 20px;
     min-width: 400px;
+
+    .current & {
+        margin-right: 0;
+    }
 }
 
 .track-body {
diff --git a/app/partials/player/current.html b/app/partials/player/current.html
index e5eb7037..723c49be 100644
--- a/app/partials/player/current.html
+++ b/app/partials/player/current.html
@@ -1,10 +1,12 @@
-<div class="container-fluid">
+<div class="container-fluid" ng-show="track.track.uri">
+
     <div class="row">
         <div class="col-xs-4 col-xs-offset-4 text-center">
             <img class="img-responsive" ng-src="{{ track.track.album.images[0].url }}" alt="{{ track.track.name }} album cover">
         </div>
     </div>
     <br>
+
     <div class="row">
         <div class="col-xs-12 text-center">
             <p class="lead track-heading track-info" title="{{ track.name }}">{{ track.track.name }}</p>
@@ -16,4 +18,23 @@
             </p>
         </div>
     </div>
+    <br>
+
+    <div class="row">
+        <div class="col-xs-12">
+            <div class="track-progress" ng-show="trackPositionTimer && track">
+                <div class="progress">
+                    <div class="progress-bar" role="progressbar" aria-valuenow="{{ trackPositionTimer.elapsedTime }}" aria-valuemin="0" aria-valuemax="{{ track.track.duration }}" ng-style="{ width: trackPositionTimer.percent + '%' }"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-xs-12 text-center">
+            <div ng-include="'partials/player/controls.html'"></div>
+        </div>
+    </div>
 </div>
+
+<div ng-include="'partials/loading.html'" ng-show="!track.track.uri"></div>