I hate footers

app/components/bridge-controls.js

@@ -1,6 +1,8 @@
 import Em from 'ember';
 
 export default Em.Component.extend({
+  classNames: ['bridgeControls', 'maxHeight'],
+
   bridgeIp: null,
   manualBridgeIp: null,
   bridgeUsername: null,
@@ -22,6 +24,10 @@ export default Em.Component.extend({
       this.doUpdateGroupsData();
       this.set('lightsDataIntervalHandle', setInterval(this.updateLightData.bind(this), 1000));
     }
+
+    if (localStorage.getItem('huegasm.selectedTab')) {
+      this.set('selectedTab', Number(localStorage.getItem('huegasm.selectedTab')));
+    }
   },
 
   onUpdateGroupsDataChange: function(){
@@ -43,7 +49,7 @@ export default Em.Component.extend({
     this.toggleProperty('updateGroupsData');
   },
 
-  tabList: ["Music", "Lights"],
+  tabList: ["Lights", "Music"],
   selectedTab: 0,
   tabData: function(){
     var tabData = [], selectedTab = this.get('selectedTab');
@@ -61,12 +67,14 @@ export default Em.Component.extend({
     return tabData;
   }.property('tabList', 'selectedTab'),
 
-  lightsTabSelected: Em.computed.equal('selectedTab', 1),
+  lightsTabSelected: Em.computed.equal('selectedTab', 0),
-  musicTabSelected: Em.computed.equal('selectedTab', 0),
+  musicTabSelected: Em.computed.equal('selectedTab', 1),
 
   actions: {
     changeTab: function(tabName){
-      this.set('selectedTab', this.get('tabList').indexOf(tabName));
+      var index = this.get('tabList').indexOf(tabName)
+      this.set('selectedTab', index);
+      localStorage.setItem('huegasm.selectedTab', index);
     }
   },
 

app/components/huegasm-app.js

@@ -1,6 +1,7 @@
 import Em from 'ember';
 
 export default Em.Component.extend({
+  classNames: ['maxHeight'],
   bridgeIp: null,
 
   bridgeUsername: null,

app/styles/app.scss

@@ -1,8 +1,12 @@
+// TODO: more elegant way to disable the automatic colapsing?
+$locked-breakpoint: 800px !important;
+
 @import 'ember-paper';
 @import 'bower_components/bootstrap-sass/assets/stylesheets/_bootstrap';
 @import 'ember-modal-dialog/ember-modal-structure';
 @import 'ember-modal-dialog/ember-modal-appearance';
 
+
 $playerBackColor: #F12B24;
 $playerHeight: 400px;
 $playerBeatAreaHeight: 320px;
@@ -10,8 +14,18 @@ $playListBackgroundColor: #1E1E1E;
 $playerDefaultIconColor: #BBBBBB;
 
 // BRIDGE FINDER
-.footerFixed {
+html, body {
-  position: static !important;
+  margin: 0;
+  padding: 0;
+  height: 100%;
+}
+
+.maxHeight {
+  height: 100%
+}
+
+.ember-app {
+  padding-bottom: 50px;
 }
 
 .footer {
@@ -22,7 +36,7 @@ $playerDefaultIconColor: #BBBBBB;
 
 .footer .text-muted {
   padding-left: 0;
-  margin-top: 30px;
+  margin-top: 10px;
   text-align: center;
 }
 
@@ -62,10 +76,15 @@ md-progress-circular {
 }
 
 md-content {
-  max-width: 800px;
+  margin: 0 auto 0 auto;
+  max-width: 1000px;
 }
 
 // BRIDGE CONTROLS
+.bridgeControls {
+  position: relative;
+}
+
 .navigation {
   margin: 0 auto 0 auto;
   padding: 30px 0 30px 0;
@@ -174,9 +193,9 @@ md-toolbar {
   background-color: inherit !important;
 }
 
-.innerControlFrame {
+//.innerControlFrame {
-  height: 80vh;
+//  height: 100vh;
-}
+//}
 
 // GROUP CONTROL
 .groupRow.selectedRow {

app/templates/components/bridge-controls.hbs

@@ -17,14 +17,14 @@
           {{/each}}
         </div>
 
-        {{#liquid-if lightsTabSelected class="tabSwitch"}}
+        {{#if lightsTabSelected class="tabSwitch"}}
           {{controls/light-control apiURL=apiURL lightsData=lightsData activeLights=activeLights trial=trial}}
-        {{/liquid-if}}
+        {{/if}}
 
-        {{#liquid-if musicTabSelected class="tabSwitch"}}
+        {{#if musicTabSelected class="tabSwitch"}}
           {{controls/music-control apiURL=apiURL lightsData=lightsData  activeLights=activeLights}}
-        {{/liquid-if}}
+        {{/if}}
-        {{huegasm-footer classNames="footerFixed"}}
     {{/paper-content}}
   {{/paper-nav-container}}
+  {{huegasm-footer}}
 {{/if}}

app/templates/components/huegasm-app.hbs

@@ -1,8 +1,8 @@
-{{#liquid-if bridgeUsername}}
+{{#if bridgeUsername}}
   {{bridge-controls bridgeIp=bridgeIp bridgeUsername=bridgeUsername trial=trial}}
 {{else}}
   {{bridge-finder bridgeIp=bridgeIp bridgeUsername=bridgeUsername trial=trial}}
-{{/liquid-if}}
+{{/if}}
 
 {{#unless bridgeUsername}}
   {{huegasm-footer}}