diff --git a/dashboard-ui/bower_components/iron-behaviors/.bower.json b/dashboard-ui/bower_components/iron-behaviors/.bower.json
index fe0c6d195d..9df3c3f1d5 100644
--- a/dashboard-ui/bower_components/iron-behaviors/.bower.json
+++ b/dashboard-ui/bower_components/iron-behaviors/.bower.json
@@ -1,6 +1,6 @@
 {
   "name": "iron-behaviors",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "Provides a set of behaviors for the iron elements",
   "private": true,
   "authors": [
@@ -30,11 +30,11 @@
   },
   "ignore": [],
   "homepage": "https://github.com/PolymerElements/iron-behaviors",
-  "_release": "1.0.15",
+  "_release": "1.0.16",
   "_resolution": {
     "type": "version",
-    "tag": "v1.0.15",
-    "commit": "f91583bfae24235401a21a1d67bde8cacce13030"
+    "tag": "v1.0.16",
+    "commit": "161e67233c4776e32a275a719a000865ed309393"
   },
   "_source": "git://github.com/PolymerElements/iron-behaviors.git",
   "_target": "^1.0.0",
diff --git a/dashboard-ui/bower_components/iron-behaviors/bower.json b/dashboard-ui/bower_components/iron-behaviors/bower.json
index ba405d65db..89d24c0514 100644
--- a/dashboard-ui/bower_components/iron-behaviors/bower.json
+++ b/dashboard-ui/bower_components/iron-behaviors/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "iron-behaviors",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "Provides a set of behaviors for the iron elements",
   "private": true,
   "authors": [
diff --git a/dashboard-ui/bower_components/iron-behaviors/iron-control-state.html b/dashboard-ui/bower_components/iron-behaviors/iron-control-state.html
index ab5b432b3e..f34d057994 100644
--- a/dashboard-ui/bower_components/iron-behaviors/iron-control-state.html
+++ b/dashboard-ui/bower_components/iron-behaviors/iron-control-state.html
@@ -73,13 +73,15 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 
       if (event.target === this) {
         this._setFocused(event.type === 'focus');
-      } else if (!this.shadowRoot &&
-          !this.isLightDescendant(Polymer.dom(event).localTarget)) {
-        this.fire(event.type, {sourceEvent: event}, {
-          node: this,
-          bubbles: event.bubbles,
-          cancelable: event.cancelable
-        });
+      } else if (!this.shadowRoot) {
+        var target = /** @type {Node} */(Polymer.dom(event).localTarget);
+        if (!this.isLightDescendant(target)) {
+          this.fire(event.type, {sourceEvent: event}, {
+            node: this,
+            bubbles: event.bubbles,
+            cancelable: event.cancelable
+          });
+        }
       }
     },
 
diff --git a/dashboard-ui/bower_components/iron-meta/.bower.json b/dashboard-ui/bower_components/iron-meta/.bower.json
index e1304d174b..f4bfef4a7c 100644
--- a/dashboard-ui/bower_components/iron-meta/.bower.json
+++ b/dashboard-ui/bower_components/iron-meta/.bower.json
@@ -26,14 +26,14 @@
     "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
   },
   "main": "iron-meta.html",
-  "homepage": "https://github.com/PolymerElements/iron-meta",
+  "homepage": "https://github.com/polymerelements/iron-meta",
   "_release": "1.1.1",
   "_resolution": {
     "type": "version",
     "tag": "v1.1.1",
     "commit": "e171ee234b482219c9514e6f9551df48ef48bd9f"
   },
-  "_source": "git://github.com/PolymerElements/iron-meta.git",
+  "_source": "git://github.com/polymerelements/iron-meta.git",
   "_target": "^1.0.0",
-  "_originalSource": "PolymerElements/iron-meta"
+  "_originalSource": "polymerelements/iron-meta"
 }
\ No newline at end of file
diff --git a/dashboard-ui/bower_components/neon-animation/.bower.json b/dashboard-ui/bower_components/neon-animation/.bower.json
index 0c7de829c6..822971a867 100644
--- a/dashboard-ui/bower_components/neon-animation/.bower.json
+++ b/dashboard-ui/bower_components/neon-animation/.bower.json
@@ -1,7 +1,7 @@
 {
   "name": "neon-animation",
   "description": "A system for animating Polymer-based web components",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "authors": [
     "The Polymer Authors"
   ],
@@ -49,14 +49,13 @@
     "iron-icons": "PolymerElements/iron-icons#^1.0.0",
     "paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0"
   },
-  "_release": "1.2.2",
+  "_release": "1.2.3",
   "_resolution": {
     "type": "version",
-    "tag": "v1.2.2",
-    "commit": "67b614a9261c84be12293f1105bafc158a2f443c"
+    "tag": "v1.2.3",
+    "commit": "c50d51e62825f4aa53f10e93f746796a174af232"
   },
   "_source": "git://github.com/PolymerElements/neon-animation.git",
   "_target": "^1.2.2",
-  "_originalSource": "PolymerElements/neon-animation",
-  "_direct": true
+  "_originalSource": "PolymerElements/neon-animation"
 }
\ No newline at end of file
diff --git a/dashboard-ui/bower_components/neon-animation/animations/cascaded-animation.html b/dashboard-ui/bower_components/neon-animation/animations/cascaded-animation.html
index 97b045071e..539975333d 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/cascaded-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/cascaded-animation.html
@@ -68,7 +68,7 @@ Configuration:
           this._animations.push(animation);
           effects.push(effect);
         } else {
-          Polymer.Base._warn(this.is + ':', config.animation, 'not found!');
+          console.warn(this.is + ':', config.animation, 'not found!');
           abortedConfigure = true;
           break;
         }
diff --git a/dashboard-ui/bower_components/neon-animation/animations/hero-animation.html b/dashboard-ui/bower_components/neon-animation/animations/hero-animation.html
index a9075e138f..176bee789e 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/hero-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/hero-animation.html
@@ -57,15 +57,15 @@ Configuration:
       var deltaWidth = fromRect.width / toRect.width;
       var deltaHeight = fromRect.height / toRect.height;
 
-      this.setPrefixedProperty(shared.to, 'transformOrigin', '0 0');
-      shared.to.style.zIndex = 10000;
-      shared.from.style.visibility = 'hidden';
-
       this._effect = new KeyframeEffect(shared.to, [
         {'transform': 'translate(' + deltaLeft + 'px,' + deltaTop + 'px) scale(' + deltaWidth + ',' + deltaHeight + ')'},
         {'transform': 'none'}
       ], this.timingFromConfig(config));
 
+      this.setPrefixedProperty(shared.to, 'transformOrigin', '0 0');
+      shared.to.style.zIndex = 10000;
+      shared.from.style.visibility = 'hidden';
+
       return this._effect;
     },
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/opaque-animation.html b/dashboard-ui/bower_components/neon-animation/animations/opaque-animation.html
index f5b60a4514..e3a007258c 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/opaque-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/opaque-animation.html
@@ -29,11 +29,11 @@ webkit/safari from drawing a frame before an animation for elements that animate
 
     configure: function(config) {
       var node = config.node;
-      node.style.opacity = '0';
       this._effect = new KeyframeEffect(node, [
         {'opacity': '1'},
         {'opacity': '1'}
       ], this.timingFromConfig(config));
+      node.style.opacity = '0';
       return this._effect;
     },
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/reverse-ripple-animation.html b/dashboard-ui/bower_components/neon-animation/animations/reverse-ripple-animation.html
index 7284e9bd42..f1f9de96f8 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/reverse-ripple-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/reverse-ripple-animation.html
@@ -66,13 +66,14 @@ Configuration:
       var scaleY = diameter / fromRect.height;
       var scale = 'scale(' + scaleX + ',' + scaleY + ')';
 
-      this.setPrefixedProperty(shared.from, 'transformOrigin', '50% 50%');
-      shared.from.style.borderRadius = '50%';
-
       this._effect = new KeyframeEffect(shared.from, [
         {'transform': translate + ' ' + scale},
         {'transform': translate + ' scale(0)'}
       ], this.timingFromConfig(config));
+
+      this.setPrefixedProperty(shared.from, 'transformOrigin', '50% 50%');
+      shared.from.style.borderRadius = '50%';
+
       return this._effect;
     },
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/ripple-animation.html b/dashboard-ui/bower_components/neon-animation/animations/ripple-animation.html
index 1f5c736e3b..d97186c377 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/ripple-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/ripple-animation.html
@@ -70,13 +70,14 @@ Configuration:
       var scaleY = diameter / toRect.height;
       var scale = 'scale(' + scaleX + ',' + scaleY + ')';
 
-      this.setPrefixedProperty(shared.to, 'transformOrigin', '50% 50%');
-      shared.to.style.borderRadius = '50%';
-
       this._effect = new KeyframeEffect(shared.to, [
         {'transform': translate + ' scale(0)'},
         {'transform': translate + ' ' + scale}
       ], this.timingFromConfig(config));
+
+      this.setPrefixedProperty(shared.to, 'transformOrigin', '50% 50%');
+      shared.to.style.borderRadius = '50%';
+
       return this._effect;
     },
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/scale-down-animation.html b/dashboard-ui/bower_components/neon-animation/animations/scale-down-animation.html
index 6dc187b317..1dcb1713ae 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/scale-down-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/scale-down-animation.html
@@ -41,10 +41,6 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
-      if (config.transformOrigin) {
-        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
-      }
-
       var scaleProperty = 'scale(0, 0)';
       if (config.axis === 'x') {
         scaleProperty = 'scale(0, 1)';
@@ -57,6 +53,10 @@ Configuration:
         {'transform': scaleProperty}
       ], this.timingFromConfig(config));
 
+      if (config.transformOrigin) {
+        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
+      }
+
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/scale-up-animation.html b/dashboard-ui/bower_components/neon-animation/animations/scale-up-animation.html
index b5164f7fe1..42ec3f3228 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/scale-up-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/scale-up-animation.html
@@ -41,10 +41,6 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
-      if (config.transformOrigin) {
-        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
-      }
-
       var scaleProperty = 'scale(0)';
       if (config.axis === 'x') {
         scaleProperty = 'scale(0, 1)';
@@ -57,6 +53,10 @@ Configuration:
         {'transform': 'scale(1, 1)'}
       ], this.timingFromConfig(config));
 
+      if (config.transformOrigin) {
+        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
+      }
+
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-down-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-down-animation.html
index c17141f25e..9db28dd17e 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-down-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-down-animation.html
@@ -40,17 +40,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateY(0%)'},
+        {'transform': 'translateY(100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateY(0%)'},
-        {'transform': 'translateY(100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-from-bottom-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-from-bottom-animation.html
index 18c40db26b..d1156e9353 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-from-bottom-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-from-bottom-animation.html
@@ -40,17 +40,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateY(100%)'},
+        {'transform': 'translateY(0)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateY(100%)'},
-        {'transform': 'translateY(0)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-from-left-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-from-left-animation.html
index d248175221..5386c9b04f 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-from-left-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-from-left-animation.html
@@ -41,17 +41,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateX(-100%)'},
+        {'transform': 'none'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateX(-100%)'},
-        {'transform': 'none'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-from-right-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-from-right-animation.html
index 4ebbf11b86..2afb591f15 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-from-right-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-from-right-animation.html
@@ -41,17 +41,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateX(100%)'},
+        {'transform': 'none'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateX(100%)'},
-        {'transform': 'none'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-from-top-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-from-top-animation.html
index 32920f06b8..c0a4881128 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-from-top-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-from-top-animation.html
@@ -40,17 +40,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translateY(-100%)'},
+        {'transform': 'translateY(0%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translateY(-100%)'},
-        {'transform': 'translateY(0%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-left-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-left-animation.html
index 7fbc446bcc..da80a6bd7d 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-left-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-left-animation.html
@@ -40,17 +40,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'none'},
+        {'transform': 'translateX(-100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'none'},
-        {'transform': 'translateX(-100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-right-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-right-animation.html
index e6441c4f38..99b5794e49 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-right-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-right-animation.html
@@ -40,17 +40,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'none'},
+        {'transform': 'translateX(100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '0 50%');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'none'},
-        {'transform': 'translateX(100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/slide-up-animation.html b/dashboard-ui/bower_components/neon-animation/animations/slide-up-animation.html
index fdf1186d16..6464e78ed3 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/slide-up-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/slide-up-animation.html
@@ -40,17 +40,17 @@ Configuration:
     configure: function(config) {
       var node = config.node;
 
+      this._effect = new KeyframeEffect(node, [
+        {'transform': 'translate(0)'},
+        {'transform': 'translateY(-100%)'}
+      ], this.timingFromConfig(config));
+
       if (config.transformOrigin) {
         this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
       } else {
         this.setPrefixedProperty(node, 'transformOrigin', '50% 0');
       }
 
-      this._effect = new KeyframeEffect(node, [
-        {'transform': 'translate(0)'},
-        {'transform': 'translateY(-100%)'}
-      ], this.timingFromConfig(config));
-
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/animations/transform-animation.html b/dashboard-ui/bower_components/neon-animation/animations/transform-animation.html
index f5963ed05f..2e5044422e 100644
--- a/dashboard-ui/bower_components/neon-animation/animations/transform-animation.html
+++ b/dashboard-ui/bower_components/neon-animation/animations/transform-animation.html
@@ -53,15 +53,15 @@ Configuration:
       var transformFrom = config.transformFrom || 'none';
       var transformTo = config.transformTo || 'none';
 
-      if (config.transformOrigin) {
-        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
-      }
-
       this._effect = new KeyframeEffect(node, [
         {'transform': transformFrom},
         {'transform': transformTo}
       ], this.timingFromConfig(config));
 
+      if (config.transformOrigin) {
+        this.setPrefixedProperty(node, 'transformOrigin', config.transformOrigin);
+      }
+
       return this._effect;
     }
 
diff --git a/dashboard-ui/bower_components/neon-animation/bower.json b/dashboard-ui/bower_components/neon-animation/bower.json
index 192e7bef81..29499b822e 100644
--- a/dashboard-ui/bower_components/neon-animation/bower.json
+++ b/dashboard-ui/bower_components/neon-animation/bower.json
@@ -1,7 +1,7 @@
 {
   "name": "neon-animation",
   "description": "A system for animating Polymer-based web components",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "authors": [
     "The Polymer Authors"
   ],
diff --git a/dashboard-ui/bower_components/neon-animation/demo/card/x-card.html b/dashboard-ui/bower_components/neon-animation/demo/card/x-card.html
index 6a578fc489..92885d29c8 100644
--- a/dashboard-ui/bower_components/neon-animation/demo/card/x-card.html
+++ b/dashboard-ui/bower_components/neon-animation/demo/card/x-card.html
@@ -66,9 +66,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
             }],
 
             'exit': [{
-              name: 'opaque-animation',
-              node: this.$.placeholder
-            }, {
               name: 'fade-out-animation',
               node: this.$.container,
               timing: {
diff --git a/dashboard-ui/bower_components/neon-animation/neon-animatable-behavior.html b/dashboard-ui/bower_components/neon-animation/neon-animatable-behavior.html
index 734563f4cf..dd58a6cfba 100644
--- a/dashboard-ui/bower_components/neon-animation/neon-animatable-behavior.html
+++ b/dashboard-ui/bower_components/neon-animation/neon-animatable-behavior.html
@@ -9,7 +9,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 -->
 
 <link rel="import" href="../polymer/polymer.html">
-<link rel="import" href="animations/opaque-animation.html">
 
 <script>
 
@@ -51,21 +50,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 
     _entryAnimationChanged: function() {
       this.animationConfig = this.animationConfig || {};
-      if (this.entryAnimation !== 'fade-in-animation') {
-        // insert polyfill hack
-        this.animationConfig['entry'] = [{
-          name: 'opaque-animation',
-          node: this
-        }, {
-          name: this.entryAnimation,
-          node: this
-        }];
-      } else {
-        this.animationConfig['entry'] = [{
-          name: this.entryAnimation,
-          node: this
-        }];
-      }
+      this.animationConfig['entry'] = [{
+        name: this.entryAnimation,
+        node: this
+      }];
     },
 
     _exitAnimationChanged: function() {
diff --git a/dashboard-ui/bower_components/neon-animation/neon-animated-pages.html b/dashboard-ui/bower_components/neon-animation/neon-animated-pages.html
index b115ae20e8..4cc94c72b6 100644
--- a/dashboard-ui/bower_components/neon-animation/neon-animated-pages.html
+++ b/dashboard-ui/bower_components/neon-animation/neon-animated-pages.html
@@ -98,7 +98,7 @@ animations to be run when switching to or switching out of the page.
       if (this.items.indexOf(selectedPage) < 0) {
         return;
       }
-      
+
       var oldPage = this._valueToItem(this._prevSelected) || false;
       this._prevSelected = this.selected;
 
@@ -108,11 +108,7 @@ animations to be run when switching to or switching out of the page.
         return;
       }
 
-      // insert safari fix.
-      this.animationConfig = [{
-        name: 'opaque-animation',
-        node: selectedPage
-      }];
+      this.animationConfig = [];
 
       // configure selectedPage animations.
       if (this.entryAnimation) {
@@ -163,7 +159,7 @@ animations to be run when switching to or switching out of the page.
       selectedPage.classList.add('neon-animating');
 
       // actually run the animations.
-      if (this.animationConfig.length > 1) {
+      if (this.animationConfig.length >= 1) {
 
         // on first load, ensure we run animations only after element is attached.
         if (!this.isAttached) {
diff --git a/dashboard-ui/bower_components/neon-animation/neon-animation-runner-behavior.html b/dashboard-ui/bower_components/neon-animation/neon-animation-runner-behavior.html
index 096d5c3e07..2b414e2577 100644
--- a/dashboard-ui/bower_components/neon-animation/neon-animation-runner-behavior.html
+++ b/dashboard-ui/bower_components/neon-animation/neon-animation-runner-behavior.html
@@ -45,7 +45,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
               });
             }
           } else {
-            Polymer.Base._warn(this.is + ':', config.name, 'not found!');
+            console.warn(this.is + ':', config.name, 'not found!');
           }
         }
       }
@@ -72,27 +72,30 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       if (!allConfigs) {
         return;
       }
-      var allAnimations = this._configureAnimationEffects(allConfigs);
-      var allEffects = allAnimations.map(function(animation) {
-        return animation.effect;
-      });
+      try {
+        var allAnimations = this._configureAnimationEffects(allConfigs);
+        var allEffects = allAnimations.map(function(animation) {
+          return animation.effect;
+        });
 
-      if (allEffects.length > 0) {
-        this._player = this._runAnimationEffects(allEffects);
-        this._player.onfinish = function() {
-          this._completeAnimations(allAnimations);
+        if (allEffects.length > 0) {
+          this._player = this._runAnimationEffects(allEffects);
+          this._player.onfinish = function() {
+            this._completeAnimations(allAnimations);
 
-          if (this._player) {
-            this._player.cancel();
-            this._player = null;
-          }
+            if (this._player) {
+              this._player.cancel();
+              this._player = null;
+            }
 
-          this.fire('neon-animation-finish', cookie, {bubbles: false});
-        }.bind(this);
-
-      } else {
-        this.fire('neon-animation-finish', cookie, {bubbles: false});
+            this.fire('neon-animation-finish', cookie, {bubbles: false});
+          }.bind(this);
+          return;
+        }
+      } catch (e) {
+        console.warn('Couldnt play', '(', type, allConfigs, ').', e);
       }
+      this.fire('neon-animation-finish', cookie, {bubbles: false});
     },
 
     /**
diff --git a/dashboard-ui/bower_components/neon-animation/neon-shared-element-animation-behavior.html b/dashboard-ui/bower_components/neon-animation/neon-shared-element-animation-behavior.html
index 65ca1bdca2..7787615b03 100644
--- a/dashboard-ui/bower_components/neon-animation/neon-shared-element-animation-behavior.html
+++ b/dashboard-ui/bower_components/neon-animation/neon-shared-element-animation-behavior.html
@@ -37,12 +37,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       var fromPage = config.fromPage;
       var toPage = config.toPage;
       if (!fromPage || !toPage) {
-        Polymer.Base._warn(this.is + ':', !fromPage ? 'fromPage' : 'toPage', 'is undefined!');
+        console.warn(this.is + ':', !fromPage ? 'fromPage' : 'toPage', 'is undefined!');
         return null;
       };
 
       if (!fromPage.sharedElements || !toPage.sharedElements) {
-        Polymer.Base._warn(this.is + ':', 'sharedElements are undefined for', !fromPage.sharedElements ? fromPage : toPage);
+        console.warn(this.is + ':', 'sharedElements are undefined for', !fromPage.sharedElements ? fromPage : toPage);
         return null;
       };
 
@@ -50,7 +50,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       var to = toPage.sharedElements[config.id];
 
       if (!from || !to) {
-        Polymer.Base._warn(this.is + ':', 'sharedElement with id', config.id, 'not found in', !from ? fromPage : toPage);
+        console.warn(this.is + ':', 'sharedElement with id', config.id, 'not found in', !from ? fromPage : toPage);
         return null;
       }
 
diff --git a/dashboard-ui/bower_components/neon-animation/test/neon-animated-pages-lazy.html b/dashboard-ui/bower_components/neon-animation/test/neon-animated-pages-lazy.html
index aabe24da00..3f873b5373 100644
--- a/dashboard-ui/bower_components/neon-animation/test/neon-animated-pages-lazy.html
+++ b/dashboard-ui/bower_components/neon-animation/test/neon-animated-pages-lazy.html
@@ -60,9 +60,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
           assert.equal(event.detail.toPage, pages[1]);
           assert.isTrue(animatedPages._completeAnimations.calledTwice);
           var a$ = animatedPages._completeAnimations.getCall(1).args[0];
-          assert.isTrue(a$[0].animation.isNeonAnimation, 'default animation is not a registered animation');
-          assert.isTrue(a$[1].animation.isNeonAnimation, 'entry animation is not a registered animation');
-          assert.isTrue(a$[2].animation.isNeonAnimation, 'exit animation is not a registered animation');
+          assert.isTrue(a$[0].animation.isNeonAnimation, 'entry animation is not a registered animation');
+          assert.isTrue(a$[1].animation.isNeonAnimation, 'exit animation is not a registered animation');
           done();
         });
         animatedPages.selected = 0;
diff --git a/dashboard-ui/bower_components/paper-behaviors/.bower.json b/dashboard-ui/bower_components/paper-behaviors/.bower.json
index 2b04bf9f8a..a6b333d335 100644
--- a/dashboard-ui/bower_components/paper-behaviors/.bower.json
+++ b/dashboard-ui/bower_components/paper-behaviors/.bower.json
@@ -45,7 +45,7 @@
     "tag": "v1.0.11",
     "commit": "e3c1ab0c72905b58fb4d9adc2921ea73b5c085a5"
   },
-  "_source": "git://github.com/PolymerElements/paper-behaviors.git",
+  "_source": "git://github.com/polymerelements/paper-behaviors.git",
   "_target": "^1.0.0",
-  "_originalSource": "PolymerElements/paper-behaviors"
+  "_originalSource": "polymerelements/paper-behaviors"
 }
\ No newline at end of file
diff --git a/dashboard-ui/bower_components/paper-ripple/.bower.json b/dashboard-ui/bower_components/paper-ripple/.bower.json
index 157225ee71..2f654d71c6 100644
--- a/dashboard-ui/bower_components/paper-ripple/.bower.json
+++ b/dashboard-ui/bower_components/paper-ripple/.bower.json
@@ -32,14 +32,14 @@
     "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
   },
   "ignore": [],
-  "homepage": "https://github.com/PolymerElements/paper-ripple",
+  "homepage": "https://github.com/polymerelements/paper-ripple",
   "_release": "1.0.5",
   "_resolution": {
     "type": "version",
     "tag": "v1.0.5",
     "commit": "d72e7a9a8ab518b901ed18dde492df3b87a93be5"
   },
-  "_source": "git://github.com/PolymerElements/paper-ripple.git",
+  "_source": "git://github.com/polymerelements/paper-ripple.git",
   "_target": "^1.0.0",
-  "_originalSource": "PolymerElements/paper-ripple"
+  "_originalSource": "polymerelements/paper-ripple"
 }
\ No newline at end of file
diff --git a/dashboard-ui/bower_components/polymer/.bower.json b/dashboard-ui/bower_components/polymer/.bower.json
index 3e8a4009a3..bbad7fe7ba 100644
--- a/dashboard-ui/bower_components/polymer/.bower.json
+++ b/dashboard-ui/bower_components/polymer/.bower.json
@@ -34,6 +34,6 @@
     "commit": "11c987b2eb3c73b388a79fc8aaea8ca01624f514"
   },
   "_source": "git://github.com/Polymer/polymer.git",
-  "_target": "^1.0.0",
+  "_target": "^1.1.0",
   "_originalSource": "Polymer/polymer"
 }
\ No newline at end of file
diff --git a/dashboard-ui/components/metadataeditor/metadataeditor.js b/dashboard-ui/components/metadataeditor/metadataeditor.js
index 7d3e424907..acb1f402bd 100644
--- a/dashboard-ui/components/metadataeditor/metadataeditor.js
+++ b/dashboard-ui/components/metadataeditor/metadataeditor.js
@@ -283,7 +283,7 @@
         });
     }
 
-    function showMoreMenu(context, button) {
+    function showMoreMenu(context, button, user) {
 
         var items = [];
 
@@ -293,11 +293,13 @@
             ironIcon: 'photo'
         });
 
-        items.push({
-            name: Globalize.translate('ButtonIdentify'),
-            id: 'identify',
-            ironIcon: 'info'
-        });
+        if (LibraryBrowser.canIdentify(user, currentItem.Type)) {
+            items.push({
+                name: Globalize.translate('ButtonIdentify'),
+                id: 'identify',
+                ironIcon: 'info'
+            });
+        }
 
         items.push({
             name: Globalize.translate('ButtonRefresh'),
@@ -378,7 +380,10 @@
 
         context.querySelector('.btnMore').addEventListener('click', function (e) {
 
-            showMoreMenu(context, e.target);
+            Dashboard.getCurrentUser().then(function (user) {
+                showMoreMenu(context, e.target, user);
+            });
+
         });
 
         context.querySelector('.btnHeaderSave').addEventListener('click', function (e) {
@@ -676,16 +681,6 @@
             $('#fldYear', context).show();
         }
 
-        Dashboard.getCurrentUser().then(function (user) {
-
-            if (LibraryBrowser.getMoreCommands(item, user).indexOf('identify') != -1) {
-
-                $('#btnIdentify', context).show();
-            } else {
-                $('#btnIdentify', context).hide();
-            }
-        });
-
         if (item.Type == "Movie" || item.Type == "Trailer" || item.Type == "BoxSet") {
             $('#keywordsCollapsible', context).show();
         } else {
diff --git a/dashboard-ui/components/recordingcreator/recordingcreator.js b/dashboard-ui/components/recordingcreator/recordingcreator.js
index e8d28ad9df..b0baa0198d 100644
--- a/dashboard-ui/components/recordingcreator/recordingcreator.js
+++ b/dashboard-ui/components/recordingcreator/recordingcreator.js
@@ -1,4 +1,4 @@
-define(['dialogHelper', 'jQuery', 'scripts/livetvcomponents', 'livetvcss', 'paper-checkbox', 'paper-input', 'paper-toggle-button', 'paper-icon-button-light'], function (dialogHelper, $) {
+define(['dialogHelper', 'jQuery', 'scripts/livetvcomponents', 'livetvcss', 'paper-checkbox', 'paper-input', 'paper-icon-button-light'], function (dialogHelper, $) {
 
     var currentProgramId;
     var currentDialog;
@@ -202,20 +202,6 @@
             closeDialog(false);
         });
 
-        context.querySelector('.chkAdvanced').addEventListener('change', function (e) {
-
-            var elems = context.querySelectorAll('.advancedToggle');
-            var isChecked = e.target.checked;
-
-            for (var i = 0, length = elems.length; i < length; i++) {
-                if (isChecked) {
-                    slideDownToShow(elems[i]);
-                } else {
-                    slideUpToHide(elems[i]);
-                }
-            }
-        });
-
         $('form', context).off('submit', onSubmit).on('submit', onSubmit);
 
         var supporterButtons = context.querySelectorAll('.btnSupporter');
diff --git a/dashboard-ui/components/recordingcreator/recordingcreator.template.html b/dashboard-ui/components/recordingcreator/recordingcreator.template.html
index f82d255d75..096194f3ff 100644
--- a/dashboard-ui/components/recordingcreator/recordingcreator.template.html
+++ b/dashboard-ui/components/recordingcreator/recordingcreator.template.html
@@ -7,10 +7,6 @@
 
 <form class="liveTvNewRecordingForm" style="margin: 0 auto;">
 
-    <div style="text-align: right; display: flex; justify-content: flex-end;">
-        <paper-toggle-button class="chkAdvanced">${ButtonAdvanced}</paper-toggle-button>
-    </div>
-
     <p><span class="itemName inlineItemName"></span></p>
     <p class="itemEpisodeName"></p>
     <p class="itemMiscInfo"></p>
@@ -52,14 +48,12 @@
         <div class="fieldDescription paperCheckboxFieldDescription btnSupporterForConverting hide"><a href="https://emby.media/premiere" target="_blank" class="accent">${FeatureRequiresEmbyPremiere}</a></div>
     </div>
     <br />
-    <div class="advancedToggle hide">
-        <div>
-            <paper-input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPrePaddingMinutes}"></paper-input>
-        </div>
-        <br />
-        <div>
-            <paper-input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPostPaddingMinutes}"></paper-input>
-        </div>
+    <div>
+        <paper-input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPrePaddingMinutes}"></paper-input>
+    </div>
+    <br />
+    <div>
+        <paper-input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPostPaddingMinutes}"></paper-input>
     </div>
     <br />
     <div>
diff --git a/dashboard-ui/components/remotecontrol.js b/dashboard-ui/components/remotecontrol.js
index dde6368cc1..343228ce2d 100644
--- a/dashboard-ui/components/remotecontrol.js
+++ b/dashboard-ui/components/remotecontrol.js
@@ -1,4 +1,4 @@
-define(['browser', 'datetime', 'jQuery', 'paper-fab', 'paper-slider'], function (browser, datetime, $) {
+define(['browser', 'datetime', 'jQuery', 'libraryBrowser', 'paper-fab', 'paper-slider'], function (browser, datetime, $, libraryBrowser) {
 
     function showSlideshowMenu(context) {
         require(['scripts/slideshow'], function () {
@@ -202,7 +202,7 @@
             }
 
             ApiClient.getItem(Dashboard.getCurrentUserId(), item.Id).then(function (fullItem) {
-                context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = LibraryBrowser.getUserDataIconsHtml(fullItem, false);
+                context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = libraryBrowser.getUserDataIconsHtml(fullItem, false);
             });
         } else {
             context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '';
@@ -417,7 +417,7 @@
 
             if (playlistOpen) {
 
-                html += LibraryBrowser.getListViewHtml({
+                html += libraryBrowser.getListViewHtml({
                     items: MediaController.playlist(),
                     smallIcon: true
                 });
@@ -459,7 +459,7 @@
         }
 
         function isPlaylistOpen(context) {
-            return LibraryBrowser.selectedTab(context.querySelector('.mdl-tabs')) == 2;
+            return libraryBrowser.selectedTab(context.querySelector('.mdl-tabs')) == 2;
         }
 
         function onStateChanged(e, state) {
@@ -609,7 +609,7 @@
 
             var mediaItem = parentWithClass(e.target, 'mediaItem');
             if (mediaItem != null) {
-                var info = LibraryBrowser.getListItemInfo(mediaItem);
+                var info = libraryBrowser.getListItemInfo(mediaItem);
 
                 MediaController.currentPlaylistIndex(info.index);
 
@@ -793,7 +793,7 @@
             return false;
         }
 
-        function init(context) {
+        function init(ownerView, context) {
 
             require(['css!css/nowplaying.css']);
             bindEvents(context);
@@ -821,6 +821,8 @@
                 context.querySelector('.libraryViewNav').classList.remove('bottom');
             }
 
+            libraryBrowser.configurePaperLibraryTabs(ownerView, mdlTabs);
+
             mdlTabs.addEventListener('tabchange', function (e) {
                 if (e.detail.selectedTabIndex == 2 && playlistNeedsRefresh) {
                     loadPlaylist(context);
@@ -851,7 +853,7 @@
             updateCastIcon(context);
         }
 
-        self.init = function (context) {
+        self.init = function (ownerView, context) {
 
             dlg = context;
 
@@ -861,7 +863,7 @@
             }
 
             componentHandler.upgradeAllRegistered(dlg);
-            init(dlg);
+            init(ownerView, dlg);
         };
 
         self.onShow = function () {
diff --git a/dashboard-ui/nowplaying.html b/dashboard-ui/nowplaying.html
index 591d1adece..345bf3f4cf 100644
--- a/dashboard-ui/nowplaying.html
+++ b/dashboard-ui/nowplaying.html
@@ -1,4 +1,4 @@
-<div id="nowPlayingPage" data-role="page" class="page libraryPage nowPlayingPage noSecondaryNavPage selfBackdropPage" data-contextname="${TitleRemoteControl}" data-theme="b" data-require="scripts/nowplayingpage,MaterialTabs,paper-icon-button-light,paper-slider,paper-button">
+<div id="nowPlayingPage" data-role="page" class="page libraryPage nowPlayingPage noSecondaryNavPage selfBackdropPage" data-contextname="${TitleRemoteControl}" data-theme="b">
 
     <div class="remoteControlContent">
 
@@ -11,11 +11,11 @@
         </div>
 
         <div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
-            <div class="libraryViewNav">
+            <div class="libraryViewNav headroomDisabled">
                 <div class="mdl-tabs__tab-bar">
                     <a href="#nowPlayingTab" class="mdl-tabs__tab is-active" data-index="0">${TabNowPlaying}</a>
                     <a href="#controlsTab" class="mdl-tabs__tab" data-index="1">${TabControls}</a>
-                    <a href="#playlistTab" class="mdl-tabs__tab" data-index="1">${TabPlaylist}</a>
+                    <a href="#playlistTab" class="mdl-tabs__tab" data-index="2">${TabPlaylist}</a>
                 </div>
             </div>
             <div class="mdl-tabs__panel is-active pageTabContent ehsContent" id="nowPlayingTab" data-index="0">
@@ -122,7 +122,7 @@
                     </div>
                 </div>
             </div>
-            <div class="mdl-tabs__panel pageTabContent ehsContent" id="playlistTab" data-index="1">
+            <div class="mdl-tabs__panel pageTabContent ehsContent" id="playlistTab" data-index="2">
                 <div class="playlist itemsContainer" style="max-width: 800px; margin: 3em auto 0; padding-bottom: 200px;">
                 </div>
             </div>
diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js
index 85dea75929..e752a3fd22 100644
--- a/dashboard-ui/scripts/librarybrowser.js
+++ b/dashboard-ui/scripts/librarybrowser.js
@@ -688,25 +688,34 @@
                     commands.push('share');
                 }
 
-                if (item.Type == "Movie" ||
-                    item.Type == "Trailer" ||
-                    item.Type == "Series" ||
-                    item.Type == "Game" ||
-                    item.Type == "BoxSet" ||
-                    item.Type == "Person" ||
-                    item.Type == "Book" ||
-                    item.Type == "MusicAlbum" ||
-                    item.Type == "MusicArtist") {
-
-                    if (user.Policy.IsAdministrator) {
-
-                        commands.push('identify');
-                    }
+                if (LibraryBrowser.canIdentify(user, item.Type)) {
+                    commands.push('identify');
                 }
 
                 return commands;
             },
 
+            canIdentify: function(user, itemType) {
+                
+                if (itemType == "Movie" ||
+                  itemType == "Trailer" ||
+                  itemType == "Series" ||
+                  itemType == "Game" ||
+                  itemType == "BoxSet" ||
+                  itemType == "Person" ||
+                  itemType == "Book" ||
+                  itemType == "MusicAlbum" ||
+                  itemType == "MusicArtist") {
+
+                    if (user.Policy.IsAdministrator) {
+
+                        return true;
+                    }
+                }
+
+                return false;
+            },
+
             refreshItem: function (itemId) {
 
                 ApiClient.refreshItem(itemId, {
diff --git a/dashboard-ui/scripts/livetvcomponents.js b/dashboard-ui/scripts/livetvcomponents.js
index 3edbaf79e0..4a562e705a 100644
--- a/dashboard-ui/scripts/livetvcomponents.js
+++ b/dashboard-ui/scripts/livetvcomponents.js
@@ -4,6 +4,10 @@
         return browserInfo.mobile && AppInfo.enableAppLayouts;
     }
 
+    function getSquareShape() {
+        return enableScrollX() ? 'overflowSquare' : 'square';
+    }
+
     function getTimersHtml(timers) {
 
         var items = timers.map(function (t) {
@@ -68,7 +72,7 @@
 
             html += LibraryBrowser.getPosterViewHtml({
                 items: group.items,
-                shape: "square",
+                shape: getSquareShape(),
                 showTitle: true,
                 showAirTime: true,
                 showChannelName: true,
diff --git a/dashboard-ui/scripts/nowplayingbar.js b/dashboard-ui/scripts/nowplayingbar.js
index e4fc06e00a..e38aefedce 100644
--- a/dashboard-ui/scripts/nowplayingbar.js
+++ b/dashboard-ui/scripts/nowplayingbar.js
@@ -190,7 +190,7 @@
 
         elem.querySelector('.playlistButton').addEventListener('click', function () {
 
-            showRemoteControl('playlist');
+            showRemoteControl(2);
         });
 
         toggleRepeatButton = $('.toggleRepeatButton', elem).on('click', function () {
@@ -254,10 +254,10 @@
         }, 300);
     }
 
-    function showRemoteControl(tab) {
+    function showRemoteControl(tabIndex) {
 
-        if (tab) {
-            Dashboard.navigate('nowplaying.html?tab=' + tab);
+        if (tabIndex) {
+            Dashboard.navigate('nowplaying.html?tab=' + tabIndex);
         } else {
             Dashboard.navigate('nowplaying.html');
         }
diff --git a/dashboard-ui/scripts/nowplayingpage.js b/dashboard-ui/scripts/nowplayingpage.js
index 2550347cbf..394d002ae2 100644
--- a/dashboard-ui/scripts/nowplayingpage.js
+++ b/dashboard-ui/scripts/nowplayingpage.js
@@ -1,43 +1,30 @@
-define(['jQuery'], function ($) {
+define(['components/remotecontrol'], function (remotecontrolFactory) {
 
-    pageIdOn('pageinit', "nowPlayingPage", function () {
+    return function (view, params) {
 
-        var page = this;
+        var self = this;
 
-        require(['components/remotecontrol'], function (remotecontrolFactory) {
-            page.remoteControl = new remotecontrolFactory();
-            page.remoteControl.init(page.querySelector('.remoteControlContent'));
-            page.remoteControl.onShow();
-            page.remoteControlInitComplete = true;
-        });
-    });
+        var remoteControl = new remotecontrolFactory();
+        remoteControl.init(view, view.querySelector('.remoteControlContent'));
 
-    pageIdOn('pagebeforeshow', "nowPlayingPage", function () {
+        view.addEventListener('viewbeforeshow', function (e) {
+            document.body.classList.add('hiddenViewMenuBar');
+            document.body.classList.add('hiddenNowPlayingBar');
 
-        var page = this;
-
-        document.body.classList.add('hiddenViewMenuBar');
-        document.body.classList.add('hiddenNowPlayingBar');
-
-        if (page.remoteControl) {
-
-            if (!page.remoteControlInitComplete) {
-                page.remoteControlInitComplete = true;
-            } else {
-                page.remoteControl.onShow();
+            if (remoteControl) {
+                remoteControl.onShow();
             }
-        }
-    });
+        });
 
-    pageIdOn('pagebeforehide', "nowPlayingPage", function () {
+        view.addEventListener('viewbeforehide', function (e) {
 
-        var page = this;
+            if (remoteControl) {
+                remoteControl.destroy();
+            }
 
-        if (page.remoteControl) {
-            page.remoteControl.destroy();
-        }
-        document.body.classList.remove('hiddenViewMenuBar');
-        document.body.classList.remove('hiddenNowPlayingBar');
-    });
+            document.body.classList.remove('hiddenViewMenuBar');
+            document.body.classList.remove('hiddenNowPlayingBar');
+        });
+    };
 
 });
\ No newline at end of file
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index 2d725e98a9..a13e4eeec6 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -2783,7 +2783,8 @@ var AppInfo = {};
 
         defineRoute({
             path: '/nowplaying.html',
-            dependencies: [],
+            dependencies: ['MaterialTabs', 'paper-icon-button-light', 'paper-slider', 'paper-button'],
+            controller: 'scripts/nowplayingpage',
             autoFocus: false
         });