Merge remote-tracking branch 'upstream/master' into material-icons

2025-03-30 19:56:21 +00:00 · 2020-01-29 08:45:20 +01:00 · 2020-01-29 08:45:20 +01:00 · cdefae3dee
commit cdefae3dee
parent 0b11883451 5df8202d7d
128 changed files with 5226 additions and 2581 deletions
--- a/.ci/azure-pipelines.yml
+++ b/.ci/azure-pipelines.yml
@ -57,3 +57,7 @@ jobs:

    - script: 'yarn run lint'
      displayName: 'Run ESLint'
+
+    - script: |
+        yarn run stylelint
+      displayName: 'Run stylelint'
--- a/.stylelintrc
+++ b/.stylelintrc
@ -0,0 +1,143 @@
+{
+  "plugins": [
+		"stylelint-no-browser-hacks/lib",
+	],
+  "rules": {
+    "at-rule-empty-line-before": [ "always", {
+      except: [
+        "blockless-after-same-name-blockless",
+        "first-nested",
+      ],
+      ignore: ["after-comment"],
+    } ],
+    "at-rule-name-case": "lower",
+    "at-rule-name-space-after": "always-single-line",
+    "at-rule-no-unknown": true,
+    "at-rule-semicolon-newline-after": "always",
+    "block-closing-brace-empty-line-before": "never",
+    "block-closing-brace-newline-after": "always",
+    "block-closing-brace-newline-before": "always-multi-line",
+    "block-closing-brace-space-before": "always-single-line",
+    "block-no-empty": true,
+    "block-opening-brace-newline-after": "always-multi-line",
+    "block-opening-brace-space-after": "always-single-line",
+    "block-opening-brace-space-before": "always",
+    "color-hex-case": "lower",
+    "color-hex-length": "short",
+    "color-no-invalid-hex": true,
+    "comment-empty-line-before": [ "always", {
+      except: ["first-nested"],
+      ignore: ["stylelint-commands"],
+    } ],
+    "comment-no-empty": true,
+    "comment-whitespace-inside": "always",
+    "custom-property-empty-line-before": [ "always", {
+      except: [
+        "after-custom-property",
+        "first-nested",
+      ],
+      ignore: [
+        "after-comment",
+        "inside-single-line-block",
+      ],
+    } ],
+    "declaration-bang-space-after": "never",
+    "declaration-bang-space-before": "always",
+    "declaration-block-no-duplicate-properties": [
+      true,
+      {
+        ignore: ["consecutive-duplicates-with-different-values"]
+      }
+    ],
+    "declaration-block-no-shorthand-property-overrides": true,
+    "declaration-block-semicolon-newline-after": "always-multi-line",
+    "declaration-block-semicolon-space-after": "always-single-line",
+    "declaration-block-semicolon-space-before": "never",
+    "declaration-block-single-line-max-declarations": 1,
+    "declaration-block-trailing-semicolon": "always",
+    "declaration-colon-newline-after": "always-multi-line",
+    "declaration-colon-space-after": "always-single-line",
+    "declaration-colon-space-before": "never",
+    "font-family-no-duplicate-names": true,
+    "function-calc-no-invalid": true,
+    "function-calc-no-unspaced-operator": true,
+    "function-comma-newline-after": "always-multi-line",
+    "function-comma-space-after": "always-single-line",
+    "function-comma-space-before": "never",
+    "function-linear-gradient-no-nonstandard-direction": true,
+    "function-max-empty-lines": 0,
+    "function-name-case": "lower",
+    "function-parentheses-newline-inside": "always-multi-line",
+    "function-parentheses-space-inside": "never-single-line",
+    "function-whitespace-after": "always",
+    "indentation": 4,
+    "keyframe-declaration-no-important": true,
+    "length-zero-no-unit": true,
+    "max-empty-lines": 1,
+    "media-feature-colon-space-after": "always",
+    "media-feature-colon-space-before": "never",
+    "media-feature-name-case": "lower",
+    "media-feature-name-no-unknown": true,
+    "media-feature-parentheses-space-inside": "never",
+    "media-feature-range-operator-space-after": "always",
+    "media-feature-range-operator-space-before": "always",
+    "media-query-list-comma-newline-after": "always-multi-line",
+    "media-query-list-comma-space-after": "always-single-line",
+    "media-query-list-comma-space-before": "never",
+    "no-descending-specificity": true,
+    "no-duplicate-at-import-rules": true,
+    "no-duplicate-selectors": true,
+    "no-empty-source": true,
+    "no-eol-whitespace": true,
+    "no-extra-semicolons": true,
+    "no-invalid-double-slash-comments": true,
+    "no-missing-end-of-source-newline": true,
+    "number-leading-zero": "always",
+    "number-no-trailing-zeros": true,
+    "plugin/no-browser-hacks": true,
+    "property-case": "lower",
+    "property-no-unknown": [
+      true,
+      {
+        "ignoreProperties": [
+          "user-drag"
+        ]
+      }
+    ],
+    "rule-empty-line-before": [ "always-multi-line", {
+      except: ["first-nested"],
+      ignore: ["after-comment"],
+    } ],
+    "selector-attribute-brackets-space-inside": "never",
+    "selector-attribute-operator-space-after": "never",
+    "selector-attribute-operator-space-before": "never",
+    "selector-combinator-space-after": "always",
+    "selector-combinator-space-before": "always",
+    "selector-descendant-combinator-no-non-space": true,
+    "selector-list-comma-newline-after": "always",
+    "selector-list-comma-space-before": "never",
+    "selector-max-empty-lines": 0,
+    "selector-pseudo-class-case": "lower",
+    "selector-pseudo-class-no-unknown": true,
+    "selector-pseudo-class-parentheses-space-inside": "never",
+    "selector-pseudo-element-case": "lower",
+    "selector-pseudo-element-colon-notation": "double",
+    "selector-pseudo-element-no-unknown": [
+      true,
+      {
+        "ignorePseudoElements": [
+          "cue"
+        ]
+      }
+    ],
+    "selector-type-case": "lower",
+    "selector-type-no-unknown": true,
+    "string-no-newline": true,
+    "unit-case": "lower",
+    "unit-no-unknown": true,
+    "value-list-comma-newline-after": "always-multi-line",
+    "value-list-comma-space-after": "always-single-line",
+    "value-list-comma-space-before": "never",
+    "value-list-max-empty-lines": 0,
+  }
+}
--- a/package.json
+++ b/package.json
@ -12,6 +12,10 @@
    "file-loader": "^3.0.1",
    "html-webpack-plugin": "^3.2.0",
    "style-loader": "^0.23.1",
+    "stylelint": "^13.0.0",
+    "stylelint-config-rational-order": "^0.1.2",
+    "stylelint-no-browser-hacks": "^1.2.1",
+    "stylelint-order": "^4.0.0",
    "webpack": "^4.41.0",
    "webpack-cli": "^3.3.9",
    "webpack-concat-plugin": "^3.0.0",
@ -50,13 +54,13 @@
    "Chrome 53",
    "Chrome 56",
    "Chrome 63",
-    "Explorer 11",
    "Firefox ESR"
  ],
  "scripts": {
    "serve": "webpack-dev-server --config webpack.dev.js --open",
    "build": "webpack --config webpack.prod.js",
    "lint": "eslint \"src\"",
+    "stylelint": "stylelint src/**/*.css",
    "prepare": "webpack --config webpack.prod.js"
  }
 }
--- a/src/assets/css/dashboard.css
+++ b/src/assets/css/dashboard.css
@ -2,16 +2,16 @@
 .dashboardSections {
    flex-direction: column;
    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal
+    -webkit-box-direction: normal;
 }

 .dashboardFooter {
    margin-top: 3.5em;
-    text-align: center
+    text-align: center;
 }

 .dashboardFooter a {
-    margin: 0 .7em
+    margin: 0 0.7em;
 }

 progress {
@ -19,59 +19,74 @@ progress {
    -moz-appearance: none;
    -webkit-appearance: none;
    margin: 0;
-    background: #ccc !important
+    background: #ccc !important;
 }

-progress[role]:after {
-    background-image: none
+progress[role]::after {
+    background-image: none;
 }

 progress::-webkit-progress-bar {
-    background: #ccc
+    background: #ccc;
 }

 progress::-moz-progress-bar {
-    background-color: #00a4dc
+    background-color: #00a4dc;
 }

 progress::-webkit-progress-value {
-    background-color: #00a4dc
+    background-color: #00a4dc;
 }

-progress[aria-valuenow]:before {
-    border-radius: .4em;
-    background-color: #00a4dc
+progress[aria-valuenow]::before {
+    border-radius: 0.4em;
+    background-color: #00a4dc;
 }

 .localnav {
-    margin-bottom: 2.2em !important
+    margin-bottom: 2.2em !important;
 }

@media all and (min-width: 50em) {
-
-    .type-interior>.ui-panel-content-wrap>div[data-role=content],
-    .type-interior>div[data-role=content] {
+    .type-interior > div[data-role=content],
+    .type-interior > .ui-panel-content-wrap > div[data-role=content] {
        padding-right: 0;
        padding-left: 0;
        padding-top: 0;
-        overflow: hidden
+        overflow: hidden;
    }
 }

 .dashboardDocument .dashboardEntryHeaderButton,
 .dashboardDocument .lnkManageServer {
-    display: none !important
+    display: none !important;
 }

 .adminDrawerLogo {
    padding: 1.5em 1em 1.2em;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 1em;
-    display: block
+    display: block;
 }

 .adminDrawerLogo img {
-    height: 4em
+    height: 4em;
+}
+
+a[data-role=button] {
+    background: #292929 !important;
+    background-clip: padding-box;
+    -webkit-font-smoothing: antialiased;
+    -webkit-user-select: none;
+    -webkit-background-clip: padding-box;
+    cursor: pointer !important;
+    font-family: inherit !important;
+    font-weight: 500 !important;
+    margin: 0 0.25em !important;
+    display: inline-block;
+    padding: 0.8em 1em;
+    text-align: center;
+    text-decoration: none !important;
 }

 div[data-role=controlgroup] a[data-role=button] {
@ -80,70 +95,88 @@ div[data-role=controlgroup] a[data-role=button] {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-border-radius: 0;
-    border-radius: 0
+    border-radius: 0;
 }

 div[data-role=controlgroup] a[data-role=button]:first-child {
-    -webkit-border-bottom-left-radius: .3125em;
-    border-bottom-left-radius: .3125em;
-    -webkit-border-top-left-radius: .3125em;
-    border-top-left-radius: .3125em
+    -webkit-border-bottom-left-radius: 0.3125em;
+    border-bottom-left-radius: 0.3125em;
+    -webkit-border-top-left-radius: 0.3125em;
+    border-top-left-radius: 0.3125em;
 }

 div[data-role=controlgroup] a[data-role=button]:last-child {
-    -webkit-border-bottom-right-radius: .3125em;
-    border-bottom-right-radius: .3125em;
-    -webkit-border-top-right-radius: .3125em;
-    border-top-right-radius: .3125em
+    -webkit-border-bottom-right-radius: 0.3125em;
+    border-bottom-right-radius: 0.3125em;
+    -webkit-border-top-right-radius: 0.3125em;
+    border-top-right-radius: 0.3125em;
 }

 div[data-role=controlgroup] a[data-role=button] + a[data-role=button] {
    border-left-width: 0 !important;
-    margin: 0 0 0 -.4em !important
+    margin: 0 0 0 -0.4em !important;
 }

 div[data-role=controlgroup] a.ui-btn-active {
    background: #00a4dc !important;
-    color: #292929 !important
+    color: #292929 !important;
+}
+
+.sessionAppInfo img {
+    max-width: 40px;
+    max-height: 40px;
+    margin-right: 8px;
+}
+
+.appLinks img {
+    height: 36px;
+}
+
+.wizardContent h2 img {
+    height: 2.5em;
+    vertical-align: middle;
+    margin-right: 0.5em;
+    position: relative;
+    top: -0.3em;
 }

 .header .imageLink {
-    display: inline-block
+    display: inline-block;
 }

 .header .imageLink img {
    height: 2.1em;
-    vertical-align: middle
+    vertical-align: middle;
 }

 .content-primary {
    padding-top: 6em;
    padding-right: 1em;
-    padding-left: 1em
+    padding-left: 1em;
 }

 .withTabs .content-primary {
-    padding-top: 9em !important
+    padding-top: 9em !important;
 }

@media all and (min-width: 40em) {
    .content-primary {
-        padding-top: 7em
+        padding-top: 7em;
    }

    .withTabs .content-primary {
-        padding-top: 10em !important
+        padding-top: 10em !important;
    }
 }

@media all and (min-width: 84em) {
    .withTabs .content-primary {
-        padding-top: 7em !important
+        padding-top: 7em !important;
    }
 }

 .content-primary ul:first-child {
-    margin-top: 0
+    margin-top: 0;
 }

 .dashboardSections {
@ -151,7 +184,7 @@ div[data-role=controlgroup] a.ui-btn-active {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
-    flex-direction: column
+    flex-direction: column;
 }

 .dashboardColumn {
@ -164,136 +197,7 @@ div[data-role=controlgroup] a.ui-btn-active {
    flex-shrink: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
-    flex-grow: 1
-}
-
-.activeSession:not(.playingSession) .sessionNowPlayingContent {
-    display: none
-}
-
-.dashboardSection {
-    -webkit-flex-shrink: 0;
-    flex-shrink: 0;
-    margin: 0 0 2em
-}
-
-.dashboardSection h3 {
-    margin-top: .5em;
-    margin-bottom: .5em
-}
-
-.activeRecordingItems>.card {
-    width: 50%
-}
-
-@media all and (min-width:70em) {
-    .dashboardSections {
-        -webkit-flex-wrap: wrap;
-        flex-wrap: wrap;
-        -webkit-box-orient: horizontal;
-        -webkit-box-direction: normal;
-        -webkit-flex-direction: row;
-        flex-direction: row
-    }
-
-    .dashboardColumn-2-60 {
-        width: 46%
-    }
-
-    .dashboardColumn-2-40 {
-        width: 27%
-    }
-
-    .dashboardSection {
-        padding: 0 1.5em
-    }
-
-    .activeRecordingItems>.card {
-        width: 25%
-    }
-}
-
-.premiumBanner img {
-    position: absolute;
-    text-align: right;
-    top: 0;
-    right: 0;
-    width: 4.4em;
-    height: 4.4em
-}
-
-.wizardContent {
-    max-width: 62em;
-    padding: .5em 2em 1em;
-    margin: 0 auto;
-    background: #fff
-}
-
-.wizardNavigation {
-    text-align: right
-}
-
-.wizardContent form {
-    max-width: 100%
-}
-
-.wizardContent h2 img {
-    height: 2.5em;
-    vertical-align: middle;
-    margin-right: .5em;
-    position: relative;
-    top: -.3em
-}
-
-.scheduledTaskPaperIconItem {
-    outline: 0 !important
-}
-
-.activeSession {
-    width: 100% !important
-}
-
-.activitylogUserPhoto {
-    height:1.71em;
-    width:1.71em;
-    border-radius:100%;
-    margin-right:.5em;
-    background-size:cover;
-    background-repeat:no-repeat;
-    background-position:center;
-}
-
-@media all and (min-width:40em) {
-    .activeSession {
-        width: 100% !important
-    }
-}
-
-@media all and (min-width:50em) {
-    .activeSession {
-        width: 50% !important
-    }
-}
-
-.sessionCardFooter {
-    padding-top: .5em !important;
-    padding-bottom: 1em !important;
-    border-top: 1px solid #eee;
-    text-align: center;
-    position: relative
-}
-
-.sessionAppInfo {
-    padding: 0.5em;
-    overflow: hidden;
-}
-
-.sessionCardButtons {
-    min-height: 2.7em
-}
-
-.sessionCardButton {
-    margin: 0
+    flex-grow: 1;
 }

 .sessionNowPlayingContent {
@ -305,7 +209,119 @@ div[data-role=controlgroup] a.ui-btn-active {
    top: 0;
    left: 0;
    right: 0;
-    bottom: 0
+    bottom: 0;
+}
+
+.activeSession:not(.playingSession) .sessionNowPlayingContent {
+    display: none;
+}
+
+.dashboardSection {
+    -webkit-flex-shrink: 0;
+    flex-shrink: 0;
+    margin: 0 0 2em;
+}
+
+.dashboardSection h3 {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+}
+
+.activeRecordingItems > .card {
+    width: 50%;
+}
+
+@media all and (min-width: 70em) {
+    .dashboardSections {
+        -webkit-flex-wrap: wrap;
+        flex-wrap: wrap;
+        -webkit-box-orient: horizontal;
+        -webkit-box-direction: normal;
+        -webkit-flex-direction: row;
+        flex-direction: row;
+    }
+
+    .dashboardColumn-2-60 {
+        width: 46%;
+    }
+
+    .dashboardColumn-2-40 {
+        width: 27%;
+    }
+
+    .dashboardSection {
+        padding: 0 1.5em;
+    }
+
+    .activeRecordingItems > .card {
+        width: 25%;
+    }
+}
+
+.wizardContent {
+    max-width: 62em;
+    padding: 0.5em 2em 1em;
+    margin: 0 auto;
+    background: #fff;
+}
+
+.wizardNavigation {
+    text-align: right;
+}
+
+.wizardContent form {
+    max-width: 100%;
+}
+
+.scheduledTaskPaperIconItem {
+    outline: 0 !important;
+}
+
+.activeSession {
+    width: 100% !important;
+}
+
+.activitylogUserPhoto {
+    height: 1.71em;
+    width: 1.71em;
+    border-radius: 100%;
+    margin-right: 0.5em;
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center;
+}
+
+@media all and (min-width: 40em) {
+    .activeSession {
+        width: 100% !important;
+    }
+}
+
+@media all and (min-width: 50em) {
+    .activeSession {
+        width: 50% !important;
+    }
+}
+
+.sessionCardFooter {
+    padding-top: 0.5em !important;
+    padding-bottom: 1em !important;
+    border-top: 1px solid #eee;
+    text-align: center;
+    position: relative;
+}
+
+.sessionAppInfo {
+    padding: 0.5em;
+    overflow: hidden;
+}
+
+.sessionCardButtons {
+    min-height: 2.7em;
+}
+
+.sessionCardButton {
+    margin: 0;
 }

 .sessionNowPlayingInnerContent {
@ -314,23 +330,23 @@ div[data-role=controlgroup] a.ui-btn-active {
    left: 0;
    right: 0;
    bottom: 0;
-    font-weight: 400
+    font-weight: 400;
 }

 .sessionNowPlayingContent-withbackground + .sessionNowPlayingInnerContent {
    color: #fff !important;
-    background: rgba(0, 0, 0, .7)
+    background: rgba(0, 0, 0, 0.7);
 }

 .sessionAppName {
    vertical-align: top;
-    max-width: 200px
+    max-width: 200px;
 }

 .sessionNowPlayingDetails {
    display: flex;
    position: absolute;
-    bottom: 0px;
+    bottom: 0;
    width: 100%;
 }

@ -340,12 +356,6 @@ div[data-role=controlgroup] a.ui-btn-active {
    padding: 0.8em 0.5em;
 }

-.sessionAppInfo img {
-    max-width: 40px;
-    max-height: 40px;
-    margin-right: 8px;
-}
-
 .sessionNowPlayingTime {
    flex-shrink: 0;
    align-self: flex-end;
@ -357,6 +367,13 @@ div[data-role=controlgroup] a.ui-btn-active {
    white-space: nowrap;
 }

+.playbackProgress,
+.transcodingProgress {
+    margin: 0;
+    width: 100%;
+    background: transparent !important;
+}
+
 .activeSession .playbackProgress,
 .activeSession .transcodingProgress {
    position: absolute;
@ -367,13 +384,6 @@ div[data-role=controlgroup] a.ui-btn-active {
    width: 100%;
 }

-.playbackProgress,
-.transcodingProgress {
-    margin: 0px;
-    width: 100%;
-    background: transparent !important;
-}
-
 .playbackProgress > div {
    z-index: 1000;
    background-color: #00a4dc;
@ -385,85 +395,65 @@ div[data-role=controlgroup] a.ui-btn-active {

@media all and (max-width: 34.375em) {
    .sessionAppName {
-        max-width: 160px
+        max-width: 160px;
    }
 }

@media all and (max-width: 31.25em) {
    .sessionAppName {
-        max-width: 150px
+        max-width: 150px;
    }
 }

 .disabledUser {
    -webkit-filter: grayscale(100%);
-    filter: grayscale(100%)
+    filter: grayscale(100%);
 }

 .disabledUserBanner {
-    margin: 0 0 2em
+    margin: 0 0 2em;
 }

 .appLinks a {
-    text-decoration: none !important
+    text-decoration: none !important;
 }

 .appLinks a + a {
-    margin-left: 5px
-}
-
-.appLinks img {
-    height: 36px
-}
-
-a[data-role=button] {
-    background-clip: padding-box;
-    -webkit-font-smoothing: antialiased;
-    -webkit-user-select: none;
-    -webkit-background-clip: padding-box;
-    cursor: pointer !important;
-    font-family: inherit !important;
-    font-weight: 500 !important;
-    margin: 0 .25em !important;
-    display: inline-block;
-    padding: .8em 1em;
-    text-align: center;
-    text-decoration: none !important;
-    background: #292929 !important;
+    margin-left: 5px;
 }

@-webkit-keyframes rotating {
    from {
        -webkit-transform: rotate(0);
-        transform: rotate(0)
+        transform: rotate(0);
    }

    to {
        -webkit-transform: rotate(360deg);
-        transform: rotate(360deg)
+        transform: rotate(360deg);
    }
 }

@keyframes rotating {
    from {
        -webkit-transform: rotate(0);
-        transform: rotate(0)
+        transform: rotate(0);
    }

    to {
        -webkit-transform: rotate(360deg);
-        transform: rotate(360deg)
+        transform: rotate(360deg);
    }
 }

 .rotatingCircle {
    -webkit-animation: rotating 2s linear infinite;
-    animation: rotating 2s linear infinite
+    animation: rotating 2s linear infinite;
 }

 .pluginPreviewImg {
-    -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
-    box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37)
+    -webkit-box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
+    box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
 }

 .ui-bar-a {
--- a/src/assets/css/detailtable.css
+++ b/src/assets/css/detailtable.css
@ -1,7 +1,7 @@
 .detailTableBodyCell,
 .detailTableHeaderCell {
    border-spacing: 0;
-    padding: .4em
+    padding: 0.4em;
 }

 .detailTable {
@ -9,11 +9,11 @@
    border-spacing: 0;
    text-align: left;
    width: 100%;
-    margin: 0 auto
+    margin: 0 auto;
 }

 .detailTableHeaderCell {
    font-weight: 700;
    text-align: left;
-    vertical-align: top
+    vertical-align: top;
 }
--- a/src/assets/css/fonts.css
+++ b/src/assets/css/fonts.css
@ -1,14 +1,13 @@
 html {
    font-family: -apple-system, "Helvetica", system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", 'Open Sans', sans-serif;
-}
-
-html {
    font-size: 93%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
 }

-h1, h2, h3 {
+h1,
+h2,
+h3 {
    /* For better bolding, since Helvetica does not support 500 weight, and 600 is too thick */
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", 'Open Sans', sans-serif;
 }
--- a/src/assets/css/ios.css
+++ b/src/assets/css/ios.css
@ -1,8 +1,8 @@
 html {
-    font-size: 82% !important
+    font-size: 82% !important;
 }

 .formDialogFooter {
    position: static !important;
-    margin: 0 -1em !important
+    margin: 0 -1em !important;
 }
--- a/src/assets/css/librarybrowser.css
+++ b/src/assets/css/librarybrowser.css
--- a/src/assets/css/livetv.css
+++ b/src/assets/css/livetv.css
@ -1,9 +1,9 @@
 .guideVerticalScroller {
-    padding-bottom: 15em
+    padding-bottom: 15em;
 }

@media all and (min-width: 62.5em) {
    #guideTab {
-        padding-left: .5em
+        padding-left: 0.5em;
    }
 }
--- a/src/assets/css/metadataeditor.css
+++ b/src/assets/css/metadataeditor.css
@ -1,29 +1,29 @@
 .editPageSidebar {
-    display: block
+    display: block;
 }

 .editPageSidebar-withcontent {
-    display: none
+    display: none;
 }

 .libraryTree {
-    margin-left: .25em
+    margin-left: 0.25em;
 }

 .offlineEditorNode {
-    color: #c33
+    color: #c33;
 }

 .editorNode img {
    height: 18px;
-    margin: 0 .35em;
+    margin: 0 0.35em;
    vertical-align: middle;
    position: relative;
-    top: -2px
+    top: -2px;
 }

 .jstree-anchor {
-    font-weight: 400 !important
+    font-weight: 400 !important;
 }

 .jstree-wholerow-hovered {
@ -31,7 +31,7 @@
    -webkit-border-radius: 0 !important;
    border-radius: 0 !important;
    -webkit-box-shadow: none !important;
-    box-shadow: none !important
+    box-shadow: none !important;
 }

 .jstree-default .jstree-hovered {
@ -40,15 +40,15 @@
    border-radius: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
-    color: #fff !important
+    color: #fff !important;
 }

 .jstree-default .jstree-wholerow-clicked {
-    background: #00a4dc !important
+    background: #00a4dc !important;
 }

 .metadataSidebarIcon {
-    margin-right: .4em
+    margin-right: 0.4em;
 }

@media all and (min-width: 50em) {
@ -59,21 +59,21 @@
        left: 0;
        width: 30%;
        border-right: 1px solid #555;
-        display: block
+        display: block;
    }

    .editPageInnerContent {
        float: right;
-        width: 68.5%
+        width: 68.5%;
    }
 }

@media all and (min-width: 112.5em) {
    .editPageSidebar {
-        width: 25%
+        width: 25%;
    }

    .editPageInnerContent {
-        width: 73.5%
+        width: 73.5%;
    }
 }
--- a/src/assets/css/scrollstyles.css
+++ b/src/assets/css/scrollstyles.css
@ -9,7 +9,8 @@
    scroll-behavior: smooth;
 }

-.hiddenScrollX, .layout-tv .scrollX {
+.hiddenScrollX,
+.layout-tv .scrollX {
    -ms-overflow-style: none;
 }

@ -17,7 +18,8 @@
    overflow: -moz-scrollbars-none;
 }

-.hiddenScrollX::-webkit-scrollbar, .layout-tv .scrollX::-webkit-scrollbar {
+.hiddenScrollX::-webkit-scrollbar,
+.layout-tv .scrollX::-webkit-scrollbar {
    height: 0 !important;
    display: none;
 }
@ -35,9 +37,12 @@
    scroll-behavior: smooth;
 }

-.hiddenScrollY, .layout-tv .smoothScrollY {
+.hiddenScrollY,
+.layout-tv .smoothScrollY {
    -ms-overflow-style: none;
+
    /* Can't do this because it not only hides the scrollbar, but also prevents scrolling */
+
    /* overflow: -moz-scrollbars-none; */
 }

@ -45,7 +50,9 @@
    overflow: -moz-scrollbars-none;
 }

-.hiddenScrollY::-webkit-scrollbar, .layout-tv .smoothScrollY::-webkit-scrollbar, .layout-tv .scrollY::-webkit-scrollbar {
+.hiddenScrollY::-webkit-scrollbar,
+.layout-tv .smoothScrollY::-webkit-scrollbar,
+.layout-tv .scrollY::-webkit-scrollbar {
    width: 0 !important;
    display: none;
 }
--- a/src/assets/css/site.css
+++ b/src/assets/css/site.css
@ -2,7 +2,7 @@ body,
 html {
    margin: 0;
    padding: 0;
-    height: 100%
+    height: 100%;
 }

 .backgroundContainer {
@ -11,11 +11,11 @@ html {
    left: 0;
    right: 0;
    bottom: 0;
-    contain: strict
+    contain: strict;
 }

 html {
-    line-height: 1.35
+    line-height: 1.35;
 }

 .layout-mobile,
@ -25,44 +25,44 @@ html {
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
-    user-select: none
+    user-select: none;
 }

 body {
    overflow-x: hidden;
    background-color: transparent !important;
-    -webkit-font-smoothing: antialiased
+    -webkit-font-smoothing: antialiased;
 }

 .mainAnimatedPage {
-    contain: style size !important
+    contain: style size !important;
 }

 .pageContainer {
-    overflow-x: visible !important
+    overflow-x: visible !important;
 }

 .bodyWithPopupOpen {
-    overflow-y: hidden !important
+    overflow-y: hidden !important;
 }

 div[data-role=page] {
-    outline: 0
+    outline: 0;
 }

 .pageTitle {
    margin-top: 0;
-    font-family: inherit
+    font-family: inherit;
 }

 .fieldDescription {
-    padding-left: .15em;
+    padding-left: 0.15em;
    font-weight: 400;
-    white-space: normal !important
+    white-space: normal !important;
 }

 .fieldDescription + .fieldDescription {
-    margin-top: .3em
+    margin-top: 0.3em;
 }

 .content-primary,
@ -76,18 +76,18 @@ div[data-role=page] {
@media all and (min-width: 50em) {
    .readOnlyContent,
    form {
-        max-width: 54em
+        max-width: 54em;
    }
 }

 .headerHelpButton {
    margin-left: 1.25em !important;
-    padding-bottom: .4em !important;
-    padding-top: .4em !important
+    padding-bottom: 0.4em !important;
+    padding-top: 0.4em !important;
 }

 .mediaInfoContent {
    margin-left: auto;
    margin-right: auto;
-    width: 85%
+    width: 85%;
 }
--- a/src/assets/css/videoosd.css
+++ b/src/assets/css/videoosd.css
@ -3,7 +3,7 @@
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
-    -ms-user-select: none
+    -ms-user-select: none;
 }

 .osdPoster img,
@ -11,13 +11,13 @@
 .videoOsdBottom {
    bottom: 0;
    left: 0;
-    right: 0
+    right: 0;
 }

 .osdHeader {
-    -webkit-transition: opacity .3s ease-out;
-    -o-transition: opacity .3s ease-out;
-    transition: opacity .3s ease-out;
+    -webkit-transition: opacity 0.3s ease-out;
+    -o-transition: opacity 0.3s ease-out;
+    transition: opacity 0.3s ease-out;
    position: relative;
    z-index: 1;
    background: rgba(0, 0, 0, 0.7) !important;
@ -27,11 +27,11 @@
 }

 .osdHeader-hidden {
-    opacity: 0
+    opacity: 0;
 }

 .osdHeader .headerButton:not(.headerBackButton):not(.headerCastButton) {
-    display: none
+    display: none;
 }

 .chapterThumbContainer {
@ -40,7 +40,7 @@
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    flex-grow: 1;
-    position: relative
+    position: relative;
 }

 .chapterThumb {
@ -50,20 +50,20 @@
    background-repeat: no-repeat;
    border: 0;
    height: 20vh;
-    min-width: 20vh
+    min-width: 20vh;
 }

@media all and (orientation: portrait) {
    .chapterThumb {
        height: 30vw;
-        min-width: 30vw
+        min-width: 30vw;
    }
 }

@media all and (max-height: 50em) and (orientation: landscape) {
    .chapterThumb {
        height: 30vh;
-        min-width: 30vh
+        min-width: 30vh;
    }
 }

@ -72,19 +72,19 @@
    bottom: 0;
    left: 0;
    right: 0;
-    background: rgba(0, 0, 0, .7);
-    padding: .25em .5em;
-    user-select: none
+    background: rgba(0, 0, 0, 0.7);
+    padding: 0.25em 0.5em;
+    user-select: none;
 }

 .chapterThumbText {
-    padding: .25em 0;
+    padding: 0.25em 0;
    margin: 0;
-    opacity: 1
+    opacity: 1;
 }

 .chapterThumbText-dim {
-    opacity: .6
+    opacity: 0.6;
 }

 .videoOsdBottom {
@ -104,21 +104,21 @@
    transition: opacity 0.3s ease-out;
    color: #fff;
    user-select: none;
-    -webkit-touch-callout: none
+    -webkit-touch-callout: none;
 }

 .videoOsdBottom-hidden {
-    opacity: 0
+    opacity: 0;
 }

 .osdControls {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
-    flex-grow: 1
+    flex-grow: 1;
 }

 .videoOsdBottom .buttons {
-    padding: .25em 0 0;
+    padding: 0.25em 0 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
@ -126,14 +126,14 @@
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
-    align-items: center
+    align-items: center;
 }

 .osdVolumeSliderContainer {
    width: 9em;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
-    flex-grow: 1
+    flex-grow: 1;
 }

 .osdMediaInfo,
@ -142,14 +142,14 @@
    display: -webkit-box;
    display: -webkit-flex;
    align-items: center;
-    -webkit-box-align: center
+    -webkit-box-align: center;
 }

 .volumeButtons {
-    margin: 0 .5em 0 auto;
+    margin: 0 0.5em 0 auto;
    display: flex;
    -webkit-align-items: center;
-    align-items: center
+    align-items: center;
 }

 .osdTimeText {
@ -157,13 +157,13 @@
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
-    user-select: none
+    user-select: none;
 }

 .osdPoster {
    width: 10%;
    position: relative;
-    margin-right: .5em
+    margin-right: 0.5em;
 }

 .osdPoster img {
@ -172,28 +172,28 @@
    width: 100%;
    -webkit-box-shadow: 0 0 1.9vh #000;
    box-shadow: 0 0 1.9vh #000;
-    border: .08em solid #222;
+    border: 0.08em solid #222;
    user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
-    -ms-user-select: none
+    -ms-user-select: none;
 }

 .osdTitle,
 .osdTitleSmall {
-    margin: 0 1em 0 0
+    margin: 0 1em 0 0;
 }

 .osdMediaInfo {
    display: flex;
    -webkit-align-items: center;
-    align-items: center
+    align-items: center;
 }

 .osdSecondaryMediaInfo {
-    padding-left: .6em !important
+    padding-left: 0.6em !important;
 }

 .osdTextContainer {
@ -207,14 +207,14 @@
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
-    margin-bottom: .7em;
-    padding-left: .5em
+    margin-bottom: 0.7em;
+    padding-left: 0.5em;
 }

 .osdMainTextContainer {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
-    align-items: baseline
+    align-items: baseline;
 }

 .osdMediaStatus {
@ -224,12 +224,14 @@
@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
+        transform: rotate(360deg);
    }
 }

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
+        transform: rotate(360deg);
    }
 }

@ -248,39 +250,40 @@

 .pageContainer {
    top: 0;
-    position: fixed
+    position: fixed;
 }

@media all and (max-width: 30em) {
-
    .btnFastForward,
    .btnRewind,
    .osdMediaInfo,
    .osdPoster {
-        display: none !important
+        display: none !important;
    }
 }

@media all and (max-width: 33.75em) {
    .videoOsdBottom .paper-icon-button-light {
-        margin: 0
+        margin: 0;
    }
 }

@media all and (max-width: 43em) {
    .videoOsdBottom .volumeButtons,
    .osdMediaStatus span {
-        display: none !important
+        display: none !important;
    }
 }
+
@media all and (max-width: 50em) {
-    .videoOsdBottom .btnFastForward, .videoOsdBottom .btnRewind {
-        display: none !important
+    .videoOsdBottom .btnFastForward,
+    .videoOsdBottom .btnRewind {
+        display: none !important;
    }
 }

@media all and (max-width: 75em) {
    .videoOsdBottom .endsAtText {
-        display: none !important
+        display: none !important;
    }
 }
--- a/src/components/actionsheet/actionsheet.css
+++ b/src/components/actionsheet/actionsheet.css
@ -4,7 +4,7 @@
    padding: 0;
    border: none;
    max-height: 84%;
-    border-radius: .1em !important;
+    border-radius: 0.1em !important;
 }

 .actionsheet-not-fullscreen {
@ -24,7 +24,7 @@

 .actionSheetContent {
    margin: 0 !important;
-    padding: .4em 0 !important;
+    padding: 0.4em 0 !important;
    flex-direction: column;
    display: flex;
    justify-content: center;
@ -45,7 +45,7 @@
 }

 .actionsheetListItemBody {
-    padding: .4em 1em .4em .6em !important;
+    padding: 0.4em 1em 0.4em 0.6em !important;
 }

 .actionSheetItemText {
@ -59,13 +59,13 @@
 }

 .actionSheetItemAsideText {
-    opacity: .7;
+    opacity: 0.7;
    font-size: 90%;
    display: flex;
    justify-content: flex-end;
    flex-shrink: 0;
    margin-left: 5em;
-    margin-right: .5em;
+    margin-right: 0.5em;
 }

 .actionSheetScroller {
@ -83,14 +83,14 @@
 }

 .actionsheetDivider {
-    height: .07em;
-    margin: .25em 0;
+    height: 0.07em;
+    margin: 0.25em 0;
    flex-shrink: 0;
 }

 .actionSheetTitle {
-    margin: .6em 0 .7em !important;
-    padding: 0 .9em;
+    margin: 0.6em 0 0.7em !important;
+    padding: 0 0.9em;
    flex-grow: 0;
 }

@ -100,7 +100,7 @@
 }

 .actionsheetMenuItemIcon {
-    margin: 0 .85em 0 .45em !important;
+    margin: 0 0.85em 0 0.45em !important;
    padding: 0 !important;
 }

@ -110,6 +110,6 @@

 .btnCloseActionSheet {
    position: fixed;
-    top: .75em;
-    left: .5em;
+    top: 0.75em;
+    left: 0.5em;
 }
--- a/src/components/alphapicker/style.css
+++ b/src/components/alphapicker/style.css
@ -35,16 +35,15 @@
    font-size: inherit;
    min-width: initial;
    margin: 0;
-    padding: .1em .4em;
+    padding: 0.1em 0.4em;
    width: auto;
-    border-radius: .1em;
+    border-radius: 0.1em;
    font-weight: normal;
    flex-shrink: 0;
    flex-grow: 1;
 }

@media all and (max-height: 50em) {
-
    .alphaPicker-fixed {
        bottom: 5em;
    }
@ -56,14 +55,12 @@
 }

@media all and (max-height: 49em) {
-
    .alphaPicker-vertical {
        font-size: 94%;
    }
 }

@media all and (max-height: 44em) {
-
    .alphaPicker-vertical {
        font-size: 90%;
    }
@ -75,14 +72,12 @@
 }

@media all and (max-height: 37em) {
-
    .alphaPicker-vertical {
        font-size: 82%;
    }
 }

@media all and (max-height: 32em) {
-
    .alphaPicker-vertical {
        font-size: 74%;
    }
@ -113,15 +108,14 @@
 }

 .alphaPicker-fixed-left {
-    left: .4em;
+    left: 0.4em;
 }

 .alphaPicker-fixed-right {
-    right: .4em;
+    right: 0.4em;
 }

@media all and (min-width: 62.5em) {
-
    .alphaPicker-fixed-left {
        left: 1em;
    }
@ -132,7 +126,6 @@
 }

@media all and (max-height: 31.25em) {
-
    .alphaPicker-fixed {
        display: none !important;
    }
--- a/src/components/apphost.js
+++ b/src/components/apphost.js
@ -168,23 +168,25 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
            return false;
        }

-        var savedResult = appSettings.get(htmlMediaAutoplayAppStorageKey);
-        return "true" === savedResult || "false" !== savedResult && null;
+        return true;
    }

-    function cueSupported() {
+    function supportsCue() {
        try {
            var video = document.createElement("video");
            var style = document.createElement("style");
+
            style.textContent = "video::cue {background: inherit}";
            document.body.appendChild(style);
            document.body.appendChild(video);
+
            var cue = window.getComputedStyle(video, "::cue").background;
            document.body.removeChild(style);
            document.body.removeChild(video);
+
            return !!cue.length;
        } catch (err) {
-            console.log("Error detecting cue support:" + err);
+            console.log("error detecting cue support: " + err);
            return false;
        }
    }
@ -204,8 +206,6 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
        }
    }

-    var htmlMediaAutoplayAppStorageKey = "supportshtmlmediaautoplay0";
-
    var supportedFeatures = function () {
        var features = [];

@ -280,7 +280,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
        //features.push("multiserver");
        features.push("screensaver");

-        if (!browser.orsay && !browser.tizen && !browser.msie && (browser.firefox || browser.ps4 || browser.edge || cueSupported())) {
+        if (!browser.orsay && !browser.tizen && !browser.msie && (browser.firefox || browser.ps4 || browser.edge || supportsCue())) {
            features.push("subtitleappearancesettings");
        }

@ -299,18 +299,6 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
        return features;
    }();

-    if (supportedFeatures.indexOf("htmlvideoautoplay") === -1 && supportsHtmlMediaAutoplay() !== false) {
-        require(["autoPlayDetect"], function (autoPlayDetect) {
-            autoPlayDetect.supportsHtmlMediaAutoplay().then(function () {
-                appSettings.set(htmlMediaAutoplayAppStorageKey, "true");
-                supportedFeatures.push("htmlvideoautoplay");
-                supportedFeatures.push("htmlaudioautoplay");
-            }, function () {
-                appSettings.set(htmlMediaAutoplayAppStorageKey, "false");
-            });
-        });
-    }
-
    var deviceId;
    var deviceName;
    var appName = "Jellyfin Web";
@ -395,7 +383,9 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
            }
        }
    };
+
    var doc = self.document;
+    var isHidden = false;

    if (doc) {
        if (void 0 !== doc.visibilityState) {
@ -419,8 +409,6 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
        }
    }

-    var isHidden = false;
-
    if (doc) {
        doc.addEventListener(visibilityChange, function () {
            if (document[visibilityState]) {
--- a/src/components/cardbuilder/card.css
+++ b/src/components/cardbuilder/card.css
@ -1,19 +1,19 @@
+button {
+    -webkit-border-fit: border !important;
+}
+
 button::-moz-focus-inner {
    padding: 0;
    border: 0;
 }

-button {
-    -webkit-border-fit: border !important;
-}
-
 .card {
    border: 0;
    font-size: inherit !important;
    font-family: inherit !important;
    text-transform: none;
-    background-color: transparent !important;
    background: none !important;
+    background-color: transparent !important;
    margin: 0;
    padding: 0;
    display: block;
@ -55,17 +55,27 @@ button {
    contain: layout style;
 }

-.cardPadder-backdrop, .cardPadder-mixedBackdrop, .cardPadder-smallBackdrop, .cardPadder-overflowBackdrop, .cardPadder-overflowSmallBackdrop {
+.cardPadder-backdrop,
+.cardPadder-mixedBackdrop,
+.cardPadder-smallBackdrop,
+.cardPadder-overflowBackdrop,
+.cardPadder-overflowSmallBackdrop {
    padding-bottom: 56.25%;
    contain: strict;
 }

-.cardPadder-square, .cardPadder-mixedSquare, .cardPadder-overflowSquare, .overflowSquareCard-textCardPadder {
+.cardPadder-square,
+.cardPadder-mixedSquare,
+.cardPadder-overflowSquare,
+.overflowSquareCard-textCardPadder {
    padding-bottom: 100%;
    contain: strict;
 }

-.cardPadder-portrait, .cardPadder-mixedPortrait, .cardPadder-overflowPortrait, .overflowPortraitCard-textCardPadder {
+.cardPadder-portrait,
+.cardPadder-mixedPortrait,
+.cardPadder-overflowPortrait,
+.overflowPortraitCard-textCardPadder {
    padding-bottom: 150%;
    contain: strict;
 }
@ -80,6 +90,7 @@ button {
    margin: 0.6em;
    transition: none;
    border: 0 solid transparent;
+
    /* These both are needed in case cardBox is a button */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none !important;
@ -87,18 +98,18 @@ button {
    contain: style;
 }

+.card.show-animation .cardBox {
+    will-change: transform;
+    transition: transform 200ms ease-out;
+}
+
 .card.show-focus:not(.show-animation) .cardBox {
-    margin: .4em;
+    margin: 0.4em;
 }

 .card.show-focus:not(.show-animation) .cardBox.visualCardBox,
 .card.show-focus:not(.show-animation) .cardBox:not(.visualCardBox) .cardScalable {
-    border: .5em solid transparent;
-}
-
-.card.show-animation .cardBox {
-    will-change: transform;
-    transition: transform 200ms ease-out;
+    border: 0.5em solid transparent;
 }

 .card.show-animation:focus > .cardBox {
@ -123,7 +134,7 @@ button {

 .btnCardOptions {
    position: absolute;
-    bottom: .25em;
+    bottom: 0.25em;
    right: 0;
    margin: 0 !important;
    z-index: 1;
@ -134,8 +145,8 @@ button {
    position: absolute;
    align-items: center;
    justify-content: center;
-    top: .3em;
-    left: .3em;
+    top: 0.3em;
+    left: 0.3em;
    text-align: center;
    vertical-align: middle;
    width: 1.6em;
@ -156,6 +167,7 @@ button {
    position: relative;
    background-clip: content-box !important;
    color: inherit;
+
    /* This is only needed for scalable cards */
    height: 100%;
    contain: strict;
@ -177,10 +189,13 @@ button {
    left: 0;
    right: 0;
    bottom: 0;
+
    /* Needed in case this is a button */
    display: block;
+
    /* Needed in case this is a button */
    margin: 0 !important;
+
    /* Needed in safari */
    height: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
@ -212,10 +227,6 @@ button {
    box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
 }

-.cardImageContainer {
-    display: flex;
-}
-
 .cardImage {
    position: absolute;
    top: 0;
@ -231,6 +242,7 @@ button {
 .cardImage-img {
    max-height: 100%;
    max-width: 100%;
+
    /* This is simply for lazy image purposes, to ensure the image is visible sooner when scrolling */
    min-height: 70%;
    min-width: 70%;
@ -257,17 +269,17 @@ button {
 }

 .cardFooter {
-    padding: .3em .3em .5em .3em;
+    padding: 0.3em 0.3em 0.5em 0.3em;
    position: relative;
 }

 .visualCardBox {
    box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
-    border-radius: .145em;
+    border-radius: 0.145em;
 }

 .innerCardFooter {
-    background: rgba(0,0,0,.7);
+    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    bottom: 0;
    left: 0;
@ -287,7 +299,7 @@ button {
 }

 .cardText {
-    padding: .06em .5em;
+    padding: 0.06em 0.5em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
@ -299,7 +311,24 @@ button {
 }

 .cardText-first {
-    padding-top: .24em;
+    padding-top: 0.24em;
+}
+
+.textActionButton {
+    border: 0 !important;
+    background: transparent;
+    padding: 0 !important;
+    cursor: pointer;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+    outline: none !important;
+    color: inherit;
+    vertical-align: middle;
+    font-family: inherit;
+    font-size: inherit;
+}
+
+.textActionButton:hover {
+    text-decoration: underline;
 }

 .cardText > .textActionButton {
@ -309,7 +338,7 @@ button {
 }

 .innerCardFooter > .cardText {
-    padding: .3em .5em;
+    padding: 0.3em 0.5em;
 }

 .cardFooter-withlogo {
@ -341,24 +370,6 @@ button {
    text-align: center;
 }

-.textActionButton {
-    border: 0 !important;
-    background: transparent;
-    border: 0 !important;
-    padding: 0 !important;
-    cursor: pointer;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
-    outline: none !important;
-    color: inherit;
-    vertical-align: middle;
-    font-family: inherit;
-    font-size: inherit;
-}
-
-.textActionButton:hover {
-    text-decoration: underline;
-}
-
 .cardImageIcon {
    font-size: 5em;
    color: inherit;
@ -366,12 +377,12 @@ button {

 .cardImageIcon-small {
    font-size: 3em;
-    margin-bottom: .1em;
+    margin-bottom: 0.1em;
 }

 .cardIndicators {
-    right: .225em;
-    top: .225em;
+    right: 0.225em;
+    top: 0.225em;
    position: absolute;
    display: flex;
    align-items: center;
@ -388,16 +399,16 @@ button {
 }

 .programAttributeIndicator {
-    padding: .18em .5em;
+    padding: 0.18em 0.5em;
    color: #fff;
    font-weight: 500;
 }

 .cardOverlayButton {
-    color: rgba(255, 255, 255, .76);
+    color: rgba(255, 255, 255, 0.76);
    margin: 0;
    z-index: 1;
-    padding: .75em;
+    padding: 0.75em;
    font-size: 88%;
 }

@ -408,7 +419,7 @@ button {
 }

 .cardOverlayButtonIcon {
-    background-color: rgba(0,0,0,.7) !important;
+    background-color: rgba(0, 0, 0, 0.7) !important;
    border-radius: 100em;
    width: 1.5em !important;
    height: 1.5em !important;
@ -430,10 +441,10 @@ button {
    height: 2.6em;
    top: 50%;
    left: 50%;
-    background-color: rgba(0,0,0,.5) !important;
-    border: .06em solid rgba(255,255,255,.6);
-    padding: .38em !important;
-    color: rgba(255, 255, 255, .76);
+    background-color: rgba(0, 0, 0, 0.5) !important;
+    border: 0.06em solid rgba(255, 255, 255, 0.6);
+    padding: 0.38em !important;
+    color: rgba(255, 255, 255, 0.76);
    transition: transform 200ms ease-out;
 }

@ -480,13 +491,15 @@ button {
        width: 33.333333333333333333333333333333%;
    }

-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 33.333333333333333333333333333333%;
    }
 }

@media (min-width: 43.75em) {
-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 25%;
    }
 }
@ -502,7 +515,8 @@ button {
        width: 50%;
    }

-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 20%;
    }

@ -522,7 +536,8 @@ button {
        width: 25%;
    }

-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 16.666666666666666666666666666667%;
    }

@ -535,9 +550,9 @@ button {
    }
 }

-
@media (min-width: 87.5em) {
-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 14.285714285714285714285714285714%;
    }

@ -555,13 +570,15 @@ button {
        width: 20%;
    }

-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 12.5%;
    }
 }

@media (min-width: 120em) {
-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 11.111111111111111111111111111111%;
    }
 }
@ -571,7 +588,8 @@ button {
        width: 25%;
    }

-    .squareCard, .portraitCard {
+    .squareCard,
+    .portraitCard {
        width: 10%;
    }
 }
@ -602,7 +620,8 @@ button {
    width: 72vw;
 }

-.overflowSquareCard, .overflowPortraitCard {
+.overflowSquareCard,
+.overflowPortraitCard {
    width: 40vw;
 }

@ -627,29 +646,34 @@ button {
 }

@media (min-width: 43.75em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 23.1vw;
    }
 }

@media (min-width: 48.125em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+    .overflowSmallBackdropCard {
        width: 30vw;
    }
 }

@media (orientation: landscape) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+    .overflowSmallBackdropCard {
        width: 30vw;
    }

-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 23.1vw;
    }
 }

@media (orientation: landscape) and (min-width: 48.125em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+    .overflowSmallBackdropCard {
        width: 23.1vw;
    }
 }
@ -661,55 +685,60 @@ button {
 }

@media (min-width: 50em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 18.5vw;
    }
 }

@media (min-width: 75em) {
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+    .overflowSmallBackdropCard {
        width: 23.1vw;
    }

-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 15.5vw;
    }
 }

@media (min-width: 87.5em) {
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 13.3vw;
    }
 }

@media (min-width: 100em) {
-
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+    .overflowSmallBackdropCard {
        width: 18.7vw;
    }

-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 11.6vw;
    }
 }

@media (min-width: 120em) {
-
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 10.3vw;
    }
 }

@media (min-width: 131.25em) {
-
-    .overflowSquareCard, .overflowPortraitCard {
+    .overflowSquareCard,
+    .overflowPortraitCard {
        width: 9.3vw;
    }
 }

@media (min-width: 156.25em) {
-
-    .overflowBackdropCard, .overflowSmallBackdropCard {
+    .overflowBackdropCard,
+    .overflowSmallBackdropCard {
        width: 15.6vw;
    }
 }
@ -726,7 +755,8 @@ button {
    padding-bottom: 87.75%;
 }

-.itemsContainer-tv > .overflowSquareCard, .itemsContainer-tv > .overflowPortraitCard {
+.itemsContainer-tv > .overflowSquareCard,
+.itemsContainer-tv > .overflowPortraitCard {
    width: 15.6vw;
 }

@ -737,7 +767,7 @@ button {
 .cardOverlayContainer {
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
-    transition: opacity .2s;
+    transition: opacity 0.2s;
    position: absolute;
    top: 0;
    left: 0;
--- a/src/components/cardbuilder/cardBuilder.js
+++ b/src/components/cardbuilder/cardBuilder.js
@ -1018,7 +1018,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
                return text;
            }

-            var html = '<button ' + itemShortcuts.getShortcutAttributesHtml(item, serverId) + ' type="button" class="itemAction textActionButton" data-action="link">';
+            var html = '<button ' + itemShortcuts.getShortcutAttributesHtml(item, serverId) + ' type="button" class="itemAction textActionButton" title="' + text + '" data-action="link">';
            html += text;
            html += '</button>';

--- a/src/components/dialogHelper/dialoghelper.css
+++ b/src/components/dialogHelper/dialoghelper.css
@ -15,11 +15,12 @@

 .dialog {
    margin: 0;
-    border-radius: .2em;
+    border-radius: 0.2em;
    -webkit-font-smoothing: antialiased;
    border: 0;
    padding: 0;
    will-change: transform, opacity;
+
    /* Strict does not work well with actionsheet */
    contain: style paint;
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.4);
@ -51,13 +52,13 @@

    to {
        opacity: 0;
-        transform: scale(.5);
+        transform: scale(0.5);
    }
 }

@keyframes scaleup {
    from {
-        transform: scale(.5);
+        transform: scale(0.5);
        opacity: 0;
    }

@ -78,7 +79,6 @@
 }

@keyframes fadeout {
-
    from {
        opacity: 1;
    }
@ -101,7 +101,6 @@
 }

@keyframes slidedown {
-
    from {
        opacity: 1;
        transform: none;
@ -114,8 +113,8 @@
 }

@media all and (max-width: 80em), all and (max-height: 45em) {
-
-    .dialog-fixedSize, .dialog-fullscreen-lowres {
+    .dialog-fixedSize,
+    .dialog-fullscreen-lowres {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
@ -127,7 +126,6 @@
 }

@media all and (min-width: 80em) and (min-height: 45em) {
-
    .dialog-medium {
        width: 80%;
        height: 80%;
@ -169,5 +167,5 @@
 }

 .dialogBackdropOpened {
-    opacity: .5;
+    opacity: 0.5;
 }
--- a/src/components/directorybrowser/directorybrowser.css
+++ b/src/components/directorybrowser/directorybrowser.css
@ -1,8 +1,8 @@
 #ulDirectoryPickerList a {
-    padding-top: .4em;
-    padding-bottom: .4em
+    padding-top: 0.4em;
+    padding-bottom: 0.4em;
 }

 .lblDirectoryPickerPath {
-    white-space: nowrap
+    white-space: nowrap;
 }
--- a/src/components/emby-scrollbuttons/emby-scrollbuttons.css
+++ b/src/components/emby-scrollbuttons/emby-scrollbuttons.css
@ -8,7 +8,7 @@
    min-height: 24px;
    padding-top: 1.25em;
    z-index: 1;
-    color: #ffffff;
+    color: #fff;
    display: flex;
 }

--- a/src/components/filterdialog/style.css
+++ b/src/components/filterdialog/style.css
@ -8,13 +8,13 @@
    -webkit-border-radius: 0 !important;
    border-radius: 0 !important;
    max-height: none !important;
-    max-width: none !important
+    max-width: none !important;
 }

@media all and (min-height: 600px) {
    .dynamicFilterDialog {
        top: 10% !important;
-        bottom: 25% !important
+        bottom: 25% !important;
    }
 }

@ -23,7 +23,7 @@
        width: auto;
        left: 10vw !important;
        right: 10vw !important;
-        margin-left: 0 !important
+        margin-left: 0 !important;
    }
 }

@ -31,6 +31,6 @@
    .dynamicFilterDialog {
        width: 20.16em;
        margin-left: -10.08em !important;
-        left: 50% !important
+        left: 50% !important;
    }
 }
--- a/src/components/formdialog.css
+++ b/src/components/formdialog.css
@ -5,14 +5,15 @@
 }

 .formDialogHeader {
-    padding: 1em .5em;
+    padding: 1em 0.5em;
    display: flex;
    align-items: center;
    flex-shrink: 0;
 }

 .formDialogHeaderTitle {
-    margin-left: .25em;
+    margin-left: 0.25em;
+
    /* In case of h1, h2, h3 */
    margin-top: 0;
    margin-bottom: 0;
@ -23,7 +24,7 @@
 }

 .dialogContentInner {
-    padding: .5em 1em 20em 1em;
+    padding: 0.5em 1em 20em 1em;
 }

 .dialogContentInner-mini {
@ -46,6 +47,7 @@
    display: flex;
    position: absolute;
    padding: 1.25em 1em;
+
    /* Without this emby-checkbox is able to appear on top */
    z-index: 1;
    align-items: center;
@ -62,11 +64,11 @@
    padding-bottom: 1.5em;
    flex-direction: column;
    width: 80% !important;
-    padding-top: .5em;
+    padding-top: 0.5em;
 }

 .formDialogFooterItem {
-    margin: .5em !important;
+    margin: 0.5em !important;
    flex-grow: 1;
    text-align: center;
    flex-basis: 0;
@ -91,7 +93,6 @@
 }

@media all and (min-width: 50em) {
-
    .formDialogFooterItem {
        max-width: 80%;
    }
@ -103,7 +104,6 @@
 }

@media all and (min-width: 80em) {
-
    .formDialogFooterItem {
        max-width: 70%;
    }
--- a/src/components/guide/guide.css
+++ b/src/components/guide/guide.css
@ -14,12 +14,12 @@
 }

 .layout-desktop .tvGuideHeader {
-    margin-bottom: .5em;
+    margin-bottom: 0.5em;
 }

 .guideHeaderDateSelection {
    font-size: 86%;
-    padding: .4em 0;
+    padding: 0.4em 0;
 }

 .guide-headerTimeslots {
@ -39,10 +39,10 @@

 .guideProgramIndicator {
    text-transform: uppercase;
-    border-radius: .25em;
-    margin-right: .5em;
+    border-radius: 0.25em;
+    margin-right: 0.5em;
    font-size: 82%;
-    padding: .2em .25em;
+    padding: 0.2em 0.25em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
@ -51,6 +51,8 @@
 }

 .guide-channelTimeslotHeader {
+    border: 0 !important;
+    border-right-color: transparent;
    flex-shrink: 0;
    justify-content: center;
 }
@ -69,9 +71,14 @@
 }

 .channelPrograms {
+    height: 4.42em;
+    contain: strict;
+    display: flex;
+    flex-direction: column;
+    border-style: solid;
+    border-width: 1px 0 1px 0;
    white-space: nowrap;
    position: relative;
-    contain: strict;
    box-sizing: border-box;
 }

@ -80,31 +87,32 @@
 }

 .guideSpacer {
-    width: .3em;
+    width: 0.3em;
    flex-shrink: 0;
 }

-.channelPrograms, .timeslotHeadersInner {
+.channelPrograms,
+.timeslotHeadersInner {
    width: 1800vw;
 }

@media all and (min-width: 37.5em) {
-
-    .channelPrograms, .timeslotHeadersInner {
+    .channelPrograms,
+    .timeslotHeadersInner {
        width: 1400vw;
    }
 }

@media all and (min-width: 50em) {
-
-    .channelPrograms, .timeslotHeadersInner {
+    .channelPrograms,
+    .timeslotHeadersInner {
        width: 1200vw;
    }
 }

@media all and (min-width: 80em) {
-
-    .channelPrograms, .timeslotHeadersInner {
+    .channelPrograms,
+    .timeslotHeadersInner {
        width: 810vw;
    }
 }
@ -112,11 +120,17 @@
 .timeslotHeader {
    display: inline-flex;
    align-items: center;
-    text-indent: .25em;
+    text-indent: 0.25em;
    width: 2.0833333333333333333333333333333%;
 }

-.guide-channelHeaderCell, .guide-channelTimeslotHeader {
+.programCell,
+.guide-channelHeaderCell {
+    outline: none !important;
+}
+
+.guide-channelHeaderCell,
+.guide-channelTimeslotHeader {
    padding: 0 !important;
    cursor: pointer;
    outline: none !important;
@ -130,11 +144,12 @@
    display: flex;
    align-items: center;
    text-decoration: none;
+
    /* Needed in firefox */
    text-align: left;
    contain: strict;
    flex-shrink: 0;
-    border-radius: .12em;
+    border-radius: 0.12em;
    color: inherit;
 }

@ -148,37 +163,38 @@
    background: transparent;
 }

-.guide-channelTimeslotHeader {
-    border: 0 !important;
-}
-
 /* Important - have to put the fixed width on channelsContainer, not the individual channelHeaderCell
   This was causing channelsContainer to extend beyond the fixed width on ps4, tizen, lg and opera tv.
 */
-.channelsContainer, .guide-channelTimeslotHeader {
+.channelsContainer,
+.guide-channelTimeslotHeader {
    width: 24vw;
 }

@media all and (min-width: 31.25em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+    .guide-channelTimeslotHeader {
        width: 16vw;
    }
 }

@media all and (min-width: 37.5em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+    .guide-channelTimeslotHeader {
        width: 16vw;
    }
 }

@media all and (min-width: 50em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+    .guide-channelTimeslotHeader {
        width: 14vw;
    }
 }

@media all and (min-width: 80em) {
-    .channelsContainer, .guide-channelTimeslotHeader {
+    .channelsContainer,
+    .guide-channelTimeslotHeader {
        width: 12vw;
    }
 }
@ -197,34 +213,26 @@
 }

@media all and (max-width: 50em) {
-
-    .newTvProgram, .liveTvProgram, .premiereTvProgram, .guideHdIcon {
+    .newTvProgram,
+    .liveTvProgram,
+    .premiereTvProgram,
+    .guideHdIcon {
        display: none;
    }
 }

-.channelPrograms {
-    height: 4.42em;
-    contain: strict;
-    display: flex;
-    flex-direction: column;
-    border-style: solid;
-    border-width: 1px 0 1px 0;
-}
-
-    .channelPrograms + .channelPrograms, .guide-channelHeaderCell + .guide-channelHeaderCell {
+.channelPrograms + .channelPrograms,
+.guide-channelHeaderCell + .guide-channelHeaderCell {
    margin-top: -1px;
 }

-.channelPrograms-tv, .guide-channelHeaderCell-tv {
+.channelPrograms-tv,
+.guide-channelHeaderCell-tv {
    height: 3em;
 }

-.guide-channelTimeslotHeader {
-    border-right-color: transparent;
-}
-
-.guide-channelTimeslotHeader, .timeslotHeader {
+.guide-channelTimeslotHeader,
+.timeslotHeader {
    background: transparent !important;
    height: 2.8em;
 }
@ -253,6 +261,7 @@
    text-decoration: none;
    overflow: hidden;
    align-items: center;
+
    /* Needed for Firefox */
    text-align: left;
    contain: strict;
@ -261,7 +270,7 @@
 }

 .guideProgramName {
-    padding: 0 .7em 0;
+    padding: 0 0.7em 0;
    overflow: hidden;
    text-overflow: ellipsis;
    align-items: center;
@ -269,6 +278,7 @@
    position: relative;
    flex-grow: 1;
    contain: layout style paint;
+
    /* transition: transform 60ms ease-out; */
 }

@ -289,11 +299,11 @@
 .guideProgramSecondaryInfo {
    display: flex;
    align-items: center;
-    margin-top: .1em;
+    margin-top: 0.1em;
 }

 .programIcon {
-    margin-left: .5em;
+    margin-left: 0.5em;
    height: 1em;
    width: 1em;
    font-size: 1.6em;
@ -304,16 +314,16 @@

 .guide-programTextIcon {
    font-weight: bold;
-    font-size: .9em;
-    padding: .16em .3em;
-    border-radius: .25em;
-    margin-right: .35em;
+    font-size: 0.9em;
+    padding: 0.16em 0.3em;
+    border-radius: 0.25em;
+    margin-right: 0.35em;
    width: auto;
    height: auto;
 }

 .guide-programTextIcon-tv {
-    font-size: .74em;
+    font-size: 0.74em;
 }

 .guideChannelNumber {
@ -345,14 +355,12 @@
 }

@media all and (min-width: 62.5em) {
-
    .guideChannelName {
        max-width: 40%;
    }
 }

@media all and (max-width: 62.5em) {
-
    .guideChannelNumber {
        display: none;
    }
@ -368,21 +376,19 @@
    flex-direction: column;
 }

-.channelsContainer, .programGrid {
+.channelsContainer,
+.programGrid {
    contain: layout style paint;
 }

-.programCell, .guide-channelHeaderCell {
-    outline: none !important;
-}
-
-.timerIcon, .seriesTimerIcon {
-    color: #cc3333 !important;
+.timerIcon,
+.seriesTimerIcon {
+    color: #c33 !important;
 }

 .seriesTimerIcon-inactive {
    color: inherit !important;
-    opacity: .7;
+    opacity: 0.7;
 }

 .guideOptions {
@ -392,7 +398,6 @@
 }

@media all and (max-width: 50em), all and (max-height: 37.5em) {
-
    .tvGuideHeader {
        padding-left: 0;
    }
@ -415,8 +420,8 @@
 }

 .guide-date-tab-button {
-    padding: .3em .7em !important;
-    margin: 0 .3em !important;
+    padding: 0.3em 0.7em !important;
+    margin: 0 0.3em !important;
    font-weight: normal;
 }

@ -425,6 +430,6 @@
 }

 .guide-date-tab-button.show-focus:focus {
-        border-radius: .15em !important;
+    border-radius: 0.15em !important;
    transform: none !important;
 }
--- a/src/components/guide/programs.css
+++ b/src/components/guide/programs.css
@ -1,15 +1,15 @@
 .newTvProgram {
-    background: #3388cc;
+    background: #38c;
    color: #fff;
 }

 .liveTvProgram {
-    background: #cc3333;
+    background: #c33;
    color: #fff;
 }

 .premiereTvProgram {
-    background: #EF6C00;
+    background: #ef6c00;
    color: #fff;
 }

--- a/src/components/homesections/homesections.css
+++ b/src/components/homesections/homesections.css
@ -1,25 +1,24 @@
 .homeLibraryButton {
    min-width: 18%;
-    margin: .5em !important;
+    margin: 0.5em !important;
 }

@media all and (max-width: 50em) {
-
    .homeLibraryButton {
        width: 46% !important;
    }
 }

 .homeLibraryIcon {
-    margin-left: .5em;
-    margin-right: .5em;
+    margin-left: 0.5em;
+    margin-right: 0.5em;
    -webkit-flex-shrink: 0;
-    flex-shrink: 0
+    flex-shrink: 0;
 }

 .homeLibraryText {
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
-    overflow: hidden
+    overflow: hidden;
 }
--- a/src/components/htmlvideoplayer/plugin.js
+++ b/src/components/htmlvideoplayer/plugin.js
@ -1054,7 +1054,9 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
            var options = {
                video: videoElement,
                subUrl: getTextTrackUrl(track, item),
-                fonts: attachments.map(i => i.DeliveryUrl),
+                fonts: attachments.map(function (i) {
+                    return i.DeliveryUrl;
+                }),
                workerUrl: appRouter.baseUrl() + "/libraries/subtitles-octopus-worker.js",
                onError: function() {
                    htmlMediaHelper.onErrorInternal(self, 'mediadecodeerror')
@ -1401,7 +1403,6 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                        dlg.classList.add('videoPlayerContainer');

                        if (options.backdropUrl) {
-
                            dlg.classList.add('videoPlayerContainer-withBackdrop');
                            dlg.style.backgroundImage = "url('" + options.backdropUrl + "')";
                        }
@ -1410,11 +1411,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                            dlg.classList.add('videoPlayerContainer-onTop');
                        }

-                        // playsinline new for iOS 10
-                        // https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_0.html
-
                        var html = '';
-
                        var cssClass = 'htmlvideoplayer';

                        if (!browser.chromecast) {
@ -1449,7 +1446,6 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                        self._mediaElement = videoElement;

                        if (mediaManager) {
-
                            if (!mediaManager.embyInit) {
                                initMediaManager();
                                mediaManager.embyInit = true;
@ -1465,9 +1461,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                        } else {
                            resolve(videoElement);
                        }
-
                    });
-
                } else {
                    if (options.backdropUrl) {
                        dlg.classList.add('videoPlayerContainer-withBackdrop');
--- a/src/components/htmlvideoplayer/style.css
+++ b/src/components/htmlvideoplayer/style.css
@ -72,7 +72,7 @@ video::-webkit-media-controls {
@keyframes htmlvideoplayer-zoomin {
    from {
        transform: scale3d(0.2, 0.2, 0.2);
-        opacity: .6;
+        opacity: 0.6;
    }

    to {
--- a/src/components/images/style.css
+++ b/src/components/images/style.css
@ -1,5 +1,22 @@
 .lazy-image-fadein {
+    opacity: 0;
    animation: lazy-image-fadein 330ms ease-in normal both;
+    -webkit-animation-duration: 0.8s;
+    -moz-animation-duration: 0.8s;
+    -o-animation-duration: 0.8s;
+    animation-duration: 0.8s;
+    -webkit-animation-name: popInAnimation;
+    -moz-animation-name: popInAnimation;
+    -o-animation-name: popInAnimation;
+    animation-name: popInAnimation;
+    -webkit-animation-fill-mode: forwards;
+    -moz-animation-fill-mode: forwards;
+    -o-animation-fill-mode: forwards;
+    animation-fill-mode: forwards;
+    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
+    -moz-animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
+    -o-animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
+    animation-timing-function: cubic-bezier(0, 0, 0.5, 1);
 }

 .lazy-image-fadein-fast {
@ -16,26 +33,6 @@
    }
 }

-.lazy-image-fadein {
-    opacity: 0;
-    -webkit-animation-duration: .8s;
-    -moz-animation-duration: .8s;
-    -o-animation-duration: .8s;
-    animation-duration: .8s;
-    -webkit-animation-name: popInAnimation;
-    -moz-animation-name: popInAnimation;
-    -o-animation-name: popInAnimation;
-    animation-name: popInAnimation;
-    -webkit-animation-fill-mode: forwards;
-    -moz-animation-fill-mode: forwards;
-    -o-animation-fill-mode: forwards;
-    animation-fill-mode: forwards;
-    -webkit-animation-timing-function: cubic-bezier(0,0,.5,1);
-    -moz-animation-timing-function: cubic-bezier(0,0,.5,1);
-    -o-animation-timing-function: cubic-bezier(0,0,.5,1);
-    animation-timing-function: cubic-bezier(0,0,.5,1);
-}
-
@keyframes popInAnimation {
    0% {
        opacity: 0;
--- a/src/components/imageuploader/style.css
+++ b/src/components/imageuploader/style.css
@ -1,6 +1,7 @@
 .imageEditor-dropZone {
-    border: .2em dashed currentcolor;
-    border-radius: .25em;
+    border: 0.2em dashed currentcolor;
+    border-radius: 0.25em;
+
    /* padding: 1.6em; */
    text-align: center;
    position: relative;
--- a/src/components/indicators/indicators.css
+++ b/src/components/indicators/indicators.css
@ -1,8 +1,8 @@
 .itemProgressBar {
    background: #333;
-    background: rgba(51,51,51,.8);
+    background: rgba(51, 51, 51, 0.8);
    position: relative;
-    height: .28em;
+    height: 0.28em;
 }

 .itemProgressBarForeground {
@ -24,7 +24,7 @@
 }

 .timerIndicator {
-    color: #CB272A;
+    color: #cb272a;
 }

 .timerIndicator-inactive {
@ -32,7 +32,7 @@
 }

 .indicator + .indicator {
-    margin-left: .25em;
+    margin-left: 0.25em;
 }

 .indicatorIcon {
@ -85,12 +85,13 @@
    color: #333;
 }

-.missingIndicator, .unairedIndicator {
-    background: #cc3333;
-    padding: .25em .5em;
+.missingIndicator,
+.unairedIndicator {
+    background: #c33;
+    padding: 0.25em 0.5em;
    border-radius: 100em;
    color: #fff;
    font-size: 84%;
    font-weight: 500;
-    margin: 0 .25em;
+    margin: 0 0.25em;
 }
--- a/src/components/keyboardnavigation.js
+++ b/src/components/keyboardnavigation.js
@ -1,36 +1,133 @@
-define(['inputManager', 'focusManager'], function(inputManager, focusManager) {
-    'use strict';
+define(["inputManager", "layoutManager"], function (inputManager, layoutManager) {
+    "use strict";

    console.log("keyboardnavigation");

+    /**
+     * Key name mapping.
+     */
+    // Add more to support old browsers
+    var KeyNames = {
+        13: "Enter",
+        19: "Pause",
+        27: "Escape",
+        32: "Space",
+        37: "ArrowLeft",
+        38: "ArrowUp",
+        39: "ArrowRight",
+        40: "ArrowDown",
+        // MediaRewind (Tizen/WebOS)
+        412: "MediaRewind",
+        // MediaStop (Tizen/WebOS)
+        413: "MediaStop",
+        // MediaPlay (Tizen/WebOS)
+        415: "MediaPlay",
+        // MediaFastForward (Tizen/WebOS)
+        417: "MediaFastForward",
+        // Back (WebOS)
+        461: "Back",
+        // Back (Tizen)
+        10009: "Back",
+        // MediaTrackPrevious (Tizen)
+        10232: "MediaTrackPrevious",
+        // MediaTrackNext (Tizen)
+        10233: "MediaTrackNext",
+        // MediaPlayPause (Tizen)
+        10252: "MediaPlayPause"
+    };
+
+    var hasFieldKey = false;
+    try {
+        hasFieldKey = "key" in new KeyboardEvent("keydown");
+    } catch (e) {
+        console.log("error checking 'key' field");
+    }
+
+    if (!hasFieldKey) {
+        // Add [a..z]
+        for (var i = 65; i <= 90; i++) {
+            KeyNames[i] = String.fromCharCode(i).toLowerCase();
+        }
+    }
+
+    /**
+     * Returns key name from event.
+     *
+     * @param {KeyboardEvent} keyboard event
+     * @return {string} key name
+     */
+    function getKeyName(event) {
+        return KeyNames[event.keyCode] || event.key;
+    }
+
    function enable() {
-        document.addEventListener('keydown', function(e) {
+        document.addEventListener("keydown", function (e) {
            var capture = true;

-            switch (e.keyCode) {
-                case 37: // ArrowLeft
-                    inputManager.handle('left');
+            switch (getKeyName(e)) {
+                case "ArrowLeft":
+                    inputManager.handle("left");
                    break;
-                case 38: // ArrowUp
-                    inputManager.handle('up');
+                case "ArrowUp":
+                    inputManager.handle("up");
                    break;
-                case 39: // ArrowRight
-                    inputManager.handle('right');
+                case "ArrowRight":
+                    inputManager.handle("right");
                    break;
-                case 40: // ArrowDown
-                    inputManager.handle('down');
+                case "ArrowDown":
+                    inputManager.handle("down");
                    break;
+
+                case "Back":
+                    inputManager.handle("back");
+                    break;
+
+                case "Escape":
+                    if (layoutManager.tv) {
+                        inputManager.handle("back");
+                    } else {
+                        capture = false;
+                    }
+                    break;
+
+                case "MediaPlay":
+                    inputManager.handle("play");
+                    break;
+                case "Pause":
+                    inputManager.handle("pause");
+                    break;
+                case "MediaPlayPause":
+                    inputManager.handle("playpause");
+                    break;
+                case "MediaRewind":
+                    inputManager.handle("rewind");
+                    break;
+                case "MediaFastForward":
+                    inputManager.handle("fastforward");
+                    break;
+                case "MediaStop":
+                    inputManager.handle("stop");
+                    break;
+                case "MediaTrackPrevious":
+                    inputManager.handle("previoustrack");
+                    break;
+                case "MediaTrackNext":
+                    inputManager.handle("nexttrack");
+                    break;
+
                default:
                    capture = false;
            }
+
            if (capture) {
                console.log("Disabling default event handling");
                e.preventDefault();
            }
        });
-
    }
+
    return {
-        enable: enable
+        enable: enable,
+        getKeyName: getKeyName
    };
 });
--- a/src/components/layoutManager.js
+++ b/src/components/layoutManager.js
@ -2,7 +2,6 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve
    'use strict';

    function setLayout(instance, layout, selectedLayout) {
-
        if (layout === selectedLayout) {
            instance[layout] = true;
            document.documentElement.classList.add('layout-' + layout);
@ -38,7 +37,6 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve
    };

    LayoutManager.prototype.getSavedLayout = function (layout) {
-
        return appSettings.get('layout');
    };

--- a/src/components/lazyloader/lazyedgehack.css
+++ b/src/components/lazyloader/lazyedgehack.css
@ -1,5 +1,5 @@
 .lazy {
    /* In edge, intersection observer will not fire on 0px sized elements */
-    min-width: .1em;
-    min-height: .1em;
+    min-width: 0.1em;
+    min-height: 0.1em;
 }
--- a/src/components/listview/listview.css
+++ b/src/components/listview/listview.css
@ -10,7 +10,7 @@
    display: block;
    align-items: center;
    text-align: left;
-    padding: .25em .25em .25em .5em;
+    padding: 0.25em 0.25em 0.25em 0.5em;
    cursor: pointer;
    overflow: hidden;
 }
@ -50,14 +50,18 @@
 }

 .listItem-border.show-focus:focus {
-    transform: scale(1.0) !important;
+    transform: scale(1) !important;
 }

-.listItemImage, .listItemIcon, .listItemAside {
+.listItemImage,
+.listItemIcon,
+.listItemAside {
    flex-shrink: 0;
 }

-.listItemBody, .listItemImage, .listItemIcon {
+.listItemBody,
+.listItemImage,
+.listItemIcon {
    display: inline-block;
    vertical-align: middle;
 }
@ -71,13 +75,13 @@
 }

 .listViewDragHandle {
-    margin-left: -.25em !important;
+    margin-left: -0.25em !important;
    touch-action: none;
 }

 .listItemBody {
    flex-grow: 1;
-    padding: .85em .75em;
+    padding: 0.85em 0.75em;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-direction: column;
@ -85,8 +89,15 @@
    justify-content: center;
 }

+.listItem,
+.listItemBody,
+.listItemMediaInfo {
+    display: flex;
+    contain: layout style;
+}
+
 .layout-tv .listItemBody {
-    padding: .35em .75em;
+    padding: 0.35em 0.75em;
 }

 .listItemBody-noleftpadding {
@ -95,7 +106,7 @@

 .listItemBodyText {
    margin: 0;
-    padding: .1em 0;
+    padding: 0.1em 0;
    overflow: hidden;
    text-overflow: ellipsis;
 }
@ -121,7 +132,7 @@
    width: 19.5vw;
    height: 13vw;
    background-position: center center;
-    margin-right: .75em;
+    margin-right: 0.75em;
 }

 .listItemImageButton {
@ -161,13 +172,13 @@
    }

    .listItemBody {
-        padding-left: .75em;
+        padding-left: 0.75em;
    }
 }

@media all and (max-width: 50em) {
    .listItemBody {
-        padding-right: .5em;
+        padding-right: 0.5em;
    }
 }

@ -180,15 +191,15 @@
    width: 1em !important;
    height: 1em !important;
    font-size: 143%;
-    padding: 0 .25em 0 0;
+    padding: 0 0.25em 0 0;
 }

 .listItemIcon:not(.listItemIcon-transparent) {
    background-color: #00a4dc;
    color: #fff;
-    padding: .5em;
+    padding: 0.5em;
    border-radius: 100em;
-    margin: 0 .2em 0 .4em;
+    margin: 0 0.2em 0 0.4em;
 }

 .listItemProgressBar {
@ -199,7 +210,7 @@
 }

 .listItem:focus {
-    border-radius: .2em;
+    border-radius: 0.2em;
 }

 .listItem:focus .secondary {
@ -207,7 +218,7 @@
 }

 .listItem-focusscale {
-    transition: transform .2s ease-out;
+    transition: transform 0.2s ease-out;
 }

 .listItem-focusscale:focus {
@ -215,7 +226,7 @@
 }

 .paperList {
-    margin: .5em auto;
+    margin: 0.5em auto;
 }

 .paperList-clear {
@ -234,26 +245,23 @@
 }

 .listItemIndicators {
-    right: .324em;
-    top: .324em;
+    right: 0.324em;
+    top: 0.324em;
    position: absolute;
    display: flex;
    align-items: center;
 }

-.listItem, .listItemBody, .listItemMediaInfo {
-    display: flex;
-    contain: layout style;
-}
-
 .listItem-bottomoverview {
    font-size: 88%;
    margin-bottom: 1em;
-    margin-top: .2em;
+    margin-top: 0.2em;
 }

@media all and (max-width: 50em) {
-    .listItem .endsAt, .listItem .criticRating, .listItem-overview {
+    .listItem .endsAt,
+    .listItem .criticRating,
+    .listItem-overview {
        display: none !important;
    }
 }
--- a/src/components/loading/loading.css
+++ b/src/components/loading/loading.css
@ -345,23 +345,10 @@
    }
 }

-.mdl-spinner__circle-clipper {
-    display: inline-block;
-    position: relative;
-    width: 50%;
-    height: 100%;
-    overflow: hidden;
-    border-color: inherit;
-}
-
-    .mdl-spinner__circle-clipper .mdl-spinner__circle {
-        width: 200%;
-    }
-
 .mdl-spinner__circle {
    box-sizing: border-box;
    height: 100%;
-    border-width: .21em;
+    border-width: 0.21em;
    border-style: solid;
    border-color: inherit;
    border-bottom-color: transparent !important;
@ -375,6 +362,19 @@
    left: 0;
 }

+.mdl-spinner__circle-clipper {
+    display: inline-block;
+    position: relative;
+    width: 50%;
+    height: 100%;
+    overflow: hidden;
+    border-color: inherit;
+}
+
+.mdl-spinner__circle-clipper .mdl-spinner__circle {
+    width: 200%;
+}
+
 .mdl-spinner__circleLeft {
    border-right-color: transparent !important;
    -webkit-transform: rotate(129deg);
--- a/src/components/mediainfo/mediainfo.css
+++ b/src/components/mediainfo/mediainfo.css
@ -4,13 +4,13 @@
 }

 .mediaInfoText {
-    padding: .22em .5em;
-    border-radius: .25em;
+    padding: 0.22em 0.5em;
+    border-radius: 0.25em;
    font-size: 92%;
    display: flex;
    align-items: center;
    white-space: nowrap;
-    margin: 0 .5em 0 0;
+    margin: 0 0.5em 0 0;
 }

 .mediaInfoText-upper {
@ -21,7 +21,7 @@
    width: auto;
    height: auto;
    font-size: 1.6em;
-    margin-right: .6em;
+    margin-right: 0.6em;
 }

 .mediaInfoItem:last-child {
@ -63,8 +63,8 @@

 .mediaInfoProgramAttribute {
    text-transform: uppercase;
-    padding: .16em .6em;
-    border-radius: .15em;
+    padding: 0.16em 0.6em;
+    border-radius: 0.15em;
    font-size: 80%;
 }

@ -73,13 +73,13 @@
 }

 .mediaInfoOfficialRating {
-    border: .09em solid currentColor;
-    padding: 0 .6em;
+    border: 0.09em solid currentColor;
+    padding: 0 0.6em;
    height: 1.3em;
    line-height: 1.8em;
    display: flex;
    align-items: center;
    justify-content: center;
-    border-radius: .1em;
+    border-radius: 0.1em;
    font-size: 96%;
 }
--- a/src/components/medialibrarycreator/medialibrarycreator.js
+++ b/src/components/medialibrarycreator/medialibrarycreator.js
@ -2,25 +2,31 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
    "use strict";

    function onAddLibrary() {
-        if (isCreating) return false;
+        if (isCreating) {
+            return false;
+        }

        if (pathInfos.length == 0) {
            require(["alert"], function (alert) {
                alert({
                    text: Globalize.translate("PleaseAddAtLeastOneFolder"),
                    type: "error"
-                })
                });
+            });
+
            return false;
        }

        isCreating = true;
        loading.show();
-
        var dlg = dom.parentWithClass(this, "dlg-librarycreator");
        var name = $("#txtValue", dlg).val();
        var type = $("#selectCollectionType", dlg).val();
-        if (type == "mixed") type = null;
+
+        if (type == "mixed") {
+            type = null;
+        }
+
        var libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector(".libraryOptions"));
        libraryOptions.PathInfos = pathInfos;
        ApiClient.addVirtualFolder(name, type, currentOptions.refresh, libraryOptions).then(function () {
@ -32,6 +38,7 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
            require(["toast"], function (toast) {
                toast(Globalize.translate("ErrorAddingMediaPathToVirtualFolder"));
            });
+
            isCreating = false;
            loading.hide();
        });
@ -49,6 +56,7 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
            var value = this.value;
            var dlg = $(this).parents(".dialog")[0];
            libraryoptionseditor.setContentType(dlg.querySelector(".libraryOptions"), value == "mixed" ? "" : value);
+
            if (value) {
                dlg.querySelector(".libraryOptions").classList.remove("hide");
            } else {
@ -57,17 +65,17 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed

            if (value != "mixed") {
                var index = this.selectedIndex;
+
                if (index != -1) {
                    var name = this.options[index].innerHTML.replace("*", "").replace("&amp;", "&");
                    $("#txtValue", dlg).val(name);
                    var folderOption = collectionTypeOptions.filter(function (i) {
-                        return i.value == value
+                        return i.value == value;
                    })[0];
-                    $(".collectionTypeFieldDescription", dlg).html(folderOption.message || "")
+                    $(".collectionTypeFieldDescription", dlg).html(folderOption.message || "");
                }
            }
        });
-
        page.querySelector(".btnAddFolder").addEventListener("click", onAddButtonClick);
        page.querySelector(".btnSubmit").addEventListener("click", onAddLibrary);
        page.querySelector(".folderList").addEventListener("click", onRemoveClick);
@ -81,28 +89,48 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed

    function onAddButtonClick() {
        var page = dom.parentWithClass(this, "dlg-librarycreator");
+
        require(["directorybrowser"], function (directoryBrowser) {
-            var picker = new directoryBrowser;
+            var picker = new directoryBrowser();
            picker.show({
                enableNetworkSharePath: true,
                callback: function (path, networkSharePath) {
-                    path && addMediaLocation(page, path, networkSharePath);
+                    if (path) {
+                        addMediaLocation(page, path, networkSharePath);
+                    }
+
                    picker.close();
                }
-            })
-        })
+            });
+        });
    }

    function getFolderHtml(pathInfo, index) {
        var html = "";
-        return html += '<div class="listItem listItem-border lnkPath" style="padding-left:.5em;">', html += '<div class="' + (pathInfo.NetworkPath ? "listItemBody two-line" : "listItemBody") + '">', html += '<div class="listItemBodyText">' + pathInfo.Path + "</div>", pathInfo.NetworkPath && (html += '<div class="listItemBodyText secondary">' + pathInfo.NetworkPath + "</div>"), html += "</div>", html += '<button type="button" is="paper-icon-button-light"" class="listItemButton btnRemovePath" data-index="' + index + '"><i class="material-icons">remove_circle</i></button>', html += "</div>"
+        html += '<div class="listItem listItem-border lnkPath" style="padding-left:.5em;">';
+        html += '<div class="' + (pathInfo.NetworkPath ? "listItemBody two-line" : "listItemBody") + '">';
+        html += '<div class="listItemBodyText">' + pathInfo.Path + "</div>";
+
+        if (pathInfo.NetworkPath) {
+            html += '<div class="listItemBodyText secondary">' + pathInfo.NetworkPath + "</div>";
+        }
+
+        html += "</div>";
+        html += '<button type="button" is="paper-icon-button-light"" class="listItemButton btnRemovePath" data-index="' + index + '"><i class="material-icons">remove_circle</i></button>';
+        html += "</div>";
+        return html;
    }

    function renderPaths(page) {
        var foldersHtml = pathInfos.map(getFolderHtml).join("");
        var folderList = page.querySelector(".folderList");
        folderList.innerHTML = foldersHtml;
-        foldersHtml ? folderList.classList.remove("hide") : folderList.classList.add("hide");
+
+        if (foldersHtml) {
+            folderList.classList.remove("hide");
+        } else {
+            folderList.classList.add("hide");
+        }
    }

    function addMediaLocation(page, path, networkSharePath) {
@ -110,11 +138,16 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
        var pathFilter = pathInfos.filter(function (p) {
            return p.Path.toLowerCase() == pathLower;
        });
+
        if (!pathFilter.length) {
            var pathInfo = {
                Path: path
            };
-            networkSharePath && (pathInfo.NetworkPath = networkSharePath);
+
+            if (networkSharePath) {
+                pathInfo.NetworkPath = networkSharePath;
+            }
+
            pathInfos.push(pathInfo);
            renderPaths(page);
        }
@ -139,7 +172,7 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
        libraryoptionseditor.embed(dlg.querySelector(".libraryOptions")).then(function () {
            $("#selectCollectionType", dlg).trigger("change");
            onToggleAdvancedChange.call(dlg.querySelector(".chkAdvanced"));
-        })
+        });
    }

    function editor() {
@ -148,8 +181,9 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
                currentOptions = options;
                currentResolve = resolve;
                hasChanges = false;
-                var xhr = new XMLHttpRequest;
+                var xhr = new XMLHttpRequest();
                xhr.open("GET", "components/medialibrarycreator/medialibrarycreator.template.html", true);
+
                xhr.onload = function (e) {
                    var template = this.response;
                    var dlg = dialogHelper.createDialog({
@ -167,23 +201,22 @@ define(["loading", "dialogHelper", "dom", "jQuery", "components/libraryoptionsed
                    dlg.addEventListener("close", onDialogClosed);
                    dialogHelper.open(dlg);
                    dlg.querySelector(".btnCancel").addEventListener("click", function () {
-                        dialogHelper.close(dlg)
+                        dialogHelper.close(dlg);
                    });
                    pathInfos = [];
                    renderPaths(dlg);
                    initLibraryOptions(dlg);
                };
+
                xhr.send();
            });
-        }
+        };
    }

    var pathInfos = [];
    var currentResolve;
    var currentOptions;
-
    var hasChanges = false;
    var isCreating = false;
-
-    return editor
+    return editor;
 });
--- a/src/components/medialibraryeditor/medialibraryeditor.js
+++ b/src/components/medialibraryeditor/medialibraryeditor.js
@ -2,15 +2,15 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed
    "use strict";

    function onEditLibrary() {
-        if (isCreating) return false;
+        if (isCreating) {
+            return false;
+        }

        isCreating = true;
        loading.show();
-
        var dlg = dom.parentWithClass(this, "dlg-libraryeditor");
        var libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector(".libraryOptions"));
        libraryOptions = Object.assign(currentOptions.library.LibraryOptions || {}, libraryOptions);
-
        ApiClient.updateVirtualFolderOptions(currentOptions.library.ItemId, libraryOptions).then(function () {
            hasChanges = true;
            isCreating = false;
@ -54,6 +54,7 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed
    function onRemoveClick(btnRemovePath, location) {
        var button = btnRemovePath;
        var virtualFolder = currentOptions.library;
+
        require(["confirm"], function (confirm) {
            confirm({
                title: Globalize.translate("HeaderRemoveMediaLocation"),
@ -76,13 +77,19 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed

    function onListItemClick(e) {
        var listItem = dom.parentWithClass(e.target, "listItem");
+
        if (listItem) {
            var index = parseInt(listItem.getAttribute("data-index"));
            var pathInfos = (currentOptions.library.LibraryOptions || {}).PathInfos || [];
            var pathInfo = null == index ? {} : pathInfos[index] || {};
            var originalPath = pathInfo.Path || (null == index ? null : currentOptions.library.Locations[index]);
            var btnRemovePath = dom.parentWithClass(e.target, "btnRemovePath");
-            if (btnRemovePath) return void onRemoveClick(btnRemovePath, originalPath);
+
+            if (btnRemovePath) {
+                onRemoveClick(btnRemovePath, originalPath);
+                return;
+            }
+
            showDirectoryBrowser(dom.parentWithClass(listItem, "dlg-libraryeditor"), originalPath, pathInfo.NetworkPath);
        }
    }
@ -94,9 +101,11 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed
        html += '<h3 class="listItemBodyText">';
        html += pathInfo.Path;
        html += "</h3>";
+
        if (pathInfo.NetworkPath) {
            html += '<div class="listItemBodyText secondary">' + pathInfo.NetworkPath + "</div>";
        }
+
        html += "</div>";
        html += '<button type="button" is="paper-icon-button-light" class="listItemButton btnRemovePath" data-index="' + index + '"><i class="material-icons">remove_circle</i></button>';
        html += "</div>";
@ -106,8 +115,9 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed
    function refreshLibraryFromServer(page) {
        ApiClient.getVirtualFolders().then(function (result) {
            var library = result.filter(function (f) {
-                return f.Name === currentOptions.library.Name
+                return f.Name === currentOptions.library.Name;
            })[0];
+
            if (library) {
                currentOptions.library = library;
                renderLibrary(page, currentOptions);
@ -117,16 +127,21 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed

    function renderLibrary(page, options) {
        var pathInfos = (options.library.LibraryOptions || {}).PathInfos || [];
-        pathInfos.length || (pathInfos = options.library.Locations.map(function(p) {
+
+        if (!pathInfos.length) {
+            pathInfos = options.library.Locations.map(function (p) {
                return {
                    Path: p
+                };
+            });
        }
-        }));
+
        if (options.library.CollectionType === 'boxsets') {
            page.querySelector(".folders").classList.add("hide");
        } else {
            page.querySelector(".folders").classList.remove("hide");
        }
+
        page.querySelector(".folderList").innerHTML = pathInfos.map(getFolderHtml).join("");
    }

@ -136,23 +151,30 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed

    function showDirectoryBrowser(context, originalPath, networkPath) {
        require(["directorybrowser"], function (directoryBrowser) {
-            var picker = new directoryBrowser;
+            var picker = new directoryBrowser();
            picker.show({
-                enableNetworkSharePath: !0,
+                enableNetworkSharePath: true,
                pathReadOnly: null != originalPath,
                path: originalPath,
                networkSharePath: networkPath,
                callback: function (path, networkSharePath) {
-                    path && (originalPath ? updateMediaLocation(context, originalPath, networkSharePath) : addMediaLocation(context, path, networkSharePath));
+                    if (path) {
+                        if (originalPath) {
+                            updateMediaLocation(context, originalPath, networkSharePath);
+                        } else {
+                            addMediaLocation(context, path, networkSharePath);
+                        }
+                    }
+
                    picker.close();
                }
-            })
-        })
+            });
+        });
    }

    function onToggleAdvancedChange() {
        var dlg = dom.parentWithClass(this, "dlg-libraryeditor");
-        libraryoptionseditor.setAdvancedVisible(dlg.querySelector(".libraryOptions"), this.checked)
+        libraryoptionseditor.setAdvancedVisible(dlg.querySelector(".libraryOptions"), this.checked);
    }

    function initEditor(dlg, options) {
@ -176,8 +198,9 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed
            currentOptions = options;
            currentDeferred = deferred;
            hasChanges = false;
-            var xhr = new XMLHttpRequest;
+            var xhr = new XMLHttpRequest();
            xhr.open("GET", "components/medialibraryeditor/medialibraryeditor.template.html", true);
+
            xhr.onload = function (e) {
                var template = this.response;
                var dlg = dialogHelper.createDialog({
@ -200,16 +223,15 @@ define(["jQuery", "loading", "dialogHelper", "dom", "components/libraryoptionsed
                });
                refreshLibraryFromServer(dlg);
            };
+
            xhr.send();
            return deferred.promise();
-        }
+        };
    }

    var currentDeferred;
    var currentOptions;
-
    var hasChanges = false;
    var isCreating = false;
-
    return editor;
 });
--- a/src/components/multiselect/multiselect.css
+++ b/src/components/multiselect/multiselect.css
@ -4,7 +4,7 @@
    left: 0;
    right: 0;
    top: 0;
-    background-color: rgba(0, 0, 0, .3);
+    background-color: rgba(0, 0, 0, 0.3);
    z-index: 99998;
 }

@ -13,7 +13,7 @@
    top: 0;
    left: 0;
    right: 0;
-    padding: 1em .5em;
+    padding: 1em 0.5em;
    display: flex;
    align-items: center;
    z-index: 99999;
--- a/src/components/navdrawer/navdrawer.css
+++ b/src/components/navdrawer/navdrawer.css
@ -3,11 +3,11 @@
    position: fixed;
    top: 0;
    bottom: 0;
-    contain: strict
+    contain: strict;
 }

 .touch-menu-la {
-    background-color: #FFF;
+    background-color: #fff;
    will-change: transform;
    display: -webkit-box;
    display: -webkit-flex;
@ -15,39 +15,38 @@
    -webkit-transition: -webkit-transform ease-out 40ms, left ease-out 260ms;
    -o-transition: transform ease-out 40ms, left ease-out 260ms;
    transition: transform ease-out 40ms, left ease-out 260ms;
-    z-index: 1099
+    z-index: 1099;
 }

 .touch-menu-la.transition {
    -webkit-transition: -webkit-transform ease-out 240ms, left ease-out 260ms;
    -o-transition: transform ease-out 240ms, left ease-out 260ms;
-    transition: transform ease-out 240ms, left ease-out 260ms
+    transition: transform ease-out 240ms, left ease-out 260ms;
 }

 .drawer-open {
-    -webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, .4);
-    box-shadow: 2px 0 12px rgba(0, 0, 0, .4)
+    -webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, 0.4);
+    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.4);
 }

 .scrollContainer {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
-    flex-grow: 1
+    flex-grow: 1;
 }

 .tmla-mask {
    left: 0;
    right: 0;
-    background-color: #000;
    opacity: 0;
    z-index: 1098;
-    -webkit-transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
-    -o-transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
-    transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
+    -webkit-transition: opacity ease-in-out 0.38s, visibility ease-in-out 0.38s;
+    -o-transition: opacity ease-in-out 0.38s, visibility ease-in-out 0.38s;
+    transition: opacity ease-in-out 0.38s, visibility ease-in-out 0.38s;
    will-change: opacity;
-    background-color: rgba(0, 0, 0, .3)
+    background-color: rgba(0, 0, 0, 0.3);
 }

 .tmla-mask.backdrop {
-    opacity: 1
+    opacity: 1;
 }
--- a/src/components/navdrawer/navdrawer.js
+++ b/src/components/navdrawer/navdrawer.js
@ -1,5 +1,6 @@
 define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser, dom) {
    "use strict";
+
    return function (options) {
        function getTouches(e) {
            return e.changedTouches || e.targetTouches || e.touches;
@ -9,14 +10,13 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function(browser,
            options.target.classList.remove("transition");
            var touches = getTouches(e);
            var touch = touches[0] || {};
-
            menuTouchStartX = touch.clientX;
            menuTouchStartY = touch.clientY;
-            menuTouchStartTime = (new Date).getTime();
+            menuTouchStartTime = new Date().getTime();
        }

        function setVelocity(deltaX) {
-            var time = (new Date).getTime() - (menuTouchStartTime || 0);
+            var time = new Date().getTime() - (menuTouchStartTime || 0);
            velocity = Math.abs(deltaX) / time;
        }

@ -28,21 +28,36 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function(browser,
            var endY = touch.clientY || 0;
            var deltaX = endX - (menuTouchStartX || 0);
            var deltaY = endY - (menuTouchStartY || 0);
-            setVelocity(deltaX), isOpen && 1 !== dragMode && deltaX > 0 && (dragMode = 2), 0 === dragMode && (!isOpen || Math.abs(deltaX) >= 10) && Math.abs(deltaY) < 5 ? (dragMode = 1, scrollContainer.addEventListener("scroll", disableEvent), self.showMask()) : 0 === dragMode && Math.abs(deltaY) >= 5 && (dragMode = 2), 1 === dragMode && (newPos = currentPos + deltaX, self.changeMenuPos())
+            setVelocity(deltaX);
+
+            if (isOpen && 1 !== dragMode && deltaX > 0) {
+                dragMode = 2;
+            }
+
+            if (0 === dragMode && (!isOpen || Math.abs(deltaX) >= 10) && Math.abs(deltaY) < 5) {
+                dragMode = 1;
+                scrollContainer.addEventListener("scroll", disableEvent);
+                self.showMask();
+            } else if (0 === dragMode && Math.abs(deltaY) >= 5) {
+                dragMode = 2;
+            }
+
+            if (1 === dragMode) {
+                newPos = currentPos + deltaX;
+                self.changeMenuPos();
+            }
        }

        function onMenuTouchEnd(e) {
            options.target.classList.add("transition");
            scrollContainer.removeEventListener("scroll", disableEvent);
            dragMode = 0;
-
            var touches = getTouches(e);
            var touch = touches[0] || {};
            var endX = touch.clientX || 0;
            var endY = touch.clientY || 0;
            var deltaX = endX - (menuTouchStartX || 0);
            var deltaY = endY - (menuTouchStartY || 0);
-
            currentPos = deltaX;
            self.checkMenuState(deltaX, deltaY);
        }
@ -53,10 +68,12 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function(browser,
            } else {
                if (((getTouches(e)[0] || {}).clientX || 0) <= options.handleSize) {
                    isPeeking = true;
+
                    if (e.type === "touchstart") {
                        dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
                        dom.addEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
                    }
+
                    onMenuTouchStart(e);
                }
            }
@ -65,38 +82,52 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function(browser,
        function onEdgeTouchMove(e) {
            e.preventDefault();
            e.stopPropagation();
-
            onEdgeTouchStart(e);
        }

        function onEdgeTouchEnd(e) {
-            isPeeking && (isPeeking = !1, dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {}), onMenuTouchEnd(e))
+            if (isPeeking) {
+                isPeeking = false;
+                dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
+                onMenuTouchEnd(e);
+            }
        }

        function disableEvent(e) {
-            e.preventDefault(), e.stopPropagation()
+            e.preventDefault();
+            e.stopPropagation();
        }

        function onBackgroundTouchStart(e) {
            var touches = getTouches(e);
            var touch = touches[0] || {};
-            backgroundTouchStartX = touch.clientX, backgroundTouchStartTime = (new Date).getTime()
+            backgroundTouchStartX = touch.clientX;
+            backgroundTouchStartTime = new Date().getTime();
        }

        function onBackgroundTouchMove(e) {
            var touches = getTouches(e);
            var touch = touches[0] || {};
            var endX = touch.clientX || 0;
+
            if (endX <= options.width && self.isVisible) {
                countStart++;
                var deltaX = endX - (backgroundTouchStartX || 0);
-                if (1 === countStart && (startPoint = deltaX), deltaX < 0 && 2 !== dragMode) {
-                    dragMode = 1, newPos = deltaX - startPoint + options.width, self.changeMenuPos();
-                    var time = (new Date).getTime() - (backgroundTouchStartTime || 0);
-                    velocity = Math.abs(deltaX) / time
+
+                if (countStart == 1) {
+                    startPoint = deltaX;
+                }
+                if (deltaX < 0 && dragMode !== 2) {
+                    dragMode = 1;
+                    newPos = deltaX - startPoint + options.width;
+                    self.changeMenuPos();
+                    var time = new Date().getTime() - (backgroundTouchStartTime || 0);
+                    velocity = Math.abs(deltaX) / time;
                }
            }
-            e.preventDefault(), e.stopPropagation()
+
+            e.preventDefault();
+            e.stopPropagation();
        }

        function onBackgroundTouchEnd(e) {
@ -104,13 +135,18 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function(browser,
            var touch = touches[0] || {};
            var endX = touch.clientX || 0;
            var deltaX = endX - (backgroundTouchStartX || 0);
-            self.checkMenuState(deltaX), countStart = 0
+            self.checkMenuState(deltaX);
+            countStart = 0;
        }

        function onMaskTransitionEnd() {
            var classList = mask.classList;
-            classList.contains("backdrop") || classList.add("hide")
+
+            if (!classList.contains("backdrop")) {
+                classList.add("hide");
            }
+        }
+
        var self;
        var defaults;
        var mask;
@ -123,83 +159,195 @@ define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function(browser,
        var dragMode = 0;
        var scrollContainer = options.target.querySelector(".mainDrawer-scrollContainer");
        scrollContainer.classList.add("scrollY");
+
        var TouchMenuLA = function () {
-            self = this, defaults = {
+            self = this;
+            defaults = {
                width: 260,
                handleSize: 10,
-                disableMask: !1,
+                disableMask: false,
                maxMaskOpacity: 0.5
-            }, this.isVisible = !1, this.initialize()
            };
+            this.isVisible = false;
+            this.initialize();
+        };
+
        TouchMenuLA.prototype.initElements = function () {
-            options.target.classList.add("touch-menu-la"), options.target.style.width = options.width + "px", options.target.style.left = -options.width + "px", options.disableMask || (mask = document.createElement("div"), mask.className = "tmla-mask hide", document.body.appendChild(mask), dom.addEventListener(mask, dom.whichTransitionEvent(), onMaskTransitionEnd, {
-                passive: !0
-            }))
+            options.target.classList.add("touch-menu-la");
+            options.target.style.width = options.width + "px";
+            options.target.style.left = -options.width + "px";
+
+            if (!options.disableMask) {
+                mask = document.createElement("div");
+                mask.className = "tmla-mask hide";
+                document.body.appendChild(mask);
+                dom.addEventListener(mask, dom.whichTransitionEvent(), onMaskTransitionEnd, {
+                    passive: true
+                });
+            }
        };
+
        var menuTouchStartX;
        var menuTouchStartY;
        var menuTouchStartTime;
        var edgeContainer = document.querySelector(".mainDrawerHandle");
        var isPeeking = false;
+
        TouchMenuLA.prototype.animateToPosition = function (pos) {
            requestAnimationFrame(function () {
-                options.target.style.transform = pos ? "translateX(" + pos + "px)" : "none"
-            })
-        }, TouchMenuLA.prototype.changeMenuPos = function() {
-            newPos <= options.width && this.animateToPosition(newPos)
-        }, TouchMenuLA.prototype.clickMaskClose = function() {
-            mask.addEventListener("click", function() {
-                self.close()
-            })
-        }, TouchMenuLA.prototype.checkMenuState = function(deltaX, deltaY) {
-            velocity >= 0.4 ? deltaX >= 0 || Math.abs(deltaY || 0) >= 70 ? self.open() : self.close() : newPos >= 100 ? self.open() : newPos && self.close()
-        }, TouchMenuLA.prototype.open = function() {
-            this.animateToPosition(options.width), currentPos = options.width, this.isVisible = !0, options.target.classList.add("drawer-open"), self.showMask(), self.invoke(options.onChange)
-        }, TouchMenuLA.prototype.close = function() {
-            this.animateToPosition(0), currentPos = 0, self.isVisible = !1, options.target.classList.remove("drawer-open"), self.hideMask(), self.invoke(options.onChange)
-        }, TouchMenuLA.prototype.toggle = function() {
-            self.isVisible ? self.close() : self.open()
+                options.target.style.transform = pos ? "translateX(" + pos + "px)" : "none";
+            });
        };
+
+        TouchMenuLA.prototype.changeMenuPos = function () {
+            if (newPos <= options.width) {
+                this.animateToPosition(newPos);
+            }
+        };
+
+        TouchMenuLA.prototype.clickMaskClose = function () {
+            mask.addEventListener("click", function () {
+                self.close();
+            });
+        };
+
+        TouchMenuLA.prototype.checkMenuState = function (deltaX, deltaY) {
+            if (velocity >= 0.4) {
+                if (deltaX >= 0 || Math.abs(deltaY || 0) >= 70) {
+                    self.open();
+                } else {
+                    self.close();
+                }
+            } else {
+                if (newPos >= 100) {
+                    self.open();
+                } else {
+                    if (newPos) {
+                        self.close();
+                    }
+                }
+            }
+        };
+
+        TouchMenuLA.prototype.open = function () {
+            this.animateToPosition(options.width);
+            currentPos = options.width;
+            this.isVisible = true;
+            options.target.classList.add("drawer-open");
+            self.showMask();
+            self.invoke(options.onChange);
+        };
+
+        TouchMenuLA.prototype.close = function () {
+            this.animateToPosition(0);
+            currentPos = 0;
+            self.isVisible = false;
+            options.target.classList.remove("drawer-open");
+            self.hideMask();
+            self.invoke(options.onChange);
+        };
+
+        TouchMenuLA.prototype.toggle = function () {
+            if (self.isVisible) {
+                self.close();
+            } else {
+                self.open();
+            }
+        };
+
        var backgroundTouchStartX;
        var backgroundTouchStartTime;
+
        TouchMenuLA.prototype.showMask = function () {
-            mask.classList.remove("hide"), mask.offsetWidth, mask.classList.add("backdrop")
-        }, TouchMenuLA.prototype.hideMask = function() {
-            mask.classList.remove("backdrop")
-        }, TouchMenuLA.prototype.invoke = function(fn) {
-            fn && fn.apply(self)
+            mask.classList.remove("hide");
+            mask.offsetWidth;
+            mask.classList.add("backdrop");
        };
-        var _edgeSwipeEnabled;
-        return TouchMenuLA.prototype.setEdgeSwipeEnabled = function(enabled) {
-            options.disableEdgeSwipe || browser.touch && (enabled ? _edgeSwipeEnabled || (_edgeSwipeEnabled = !0, dom.addEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
-                passive: !0
-            }), dom.addEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
-                passive: !0
-            }), dom.addEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
-                passive: !0
-            })) : _edgeSwipeEnabled && (_edgeSwipeEnabled = !1, dom.removeEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
-                passive: !0
-            }), dom.removeEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
-                passive: !0
-            }), dom.removeEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
-                passive: !0
-            })))
-        }, TouchMenuLA.prototype.initialize = function() {
-            options = Object.assign(defaults, options || {}), browser.edge && (options.disableEdgeSwipe = !0), self.initElements(), browser.touch && (dom.addEventListener(options.target, "touchstart", onMenuTouchStart, {
-                passive: !0
-            }), dom.addEventListener(options.target, "touchmove", onMenuTouchMove, {
-                passive: !0
-            }), dom.addEventListener(options.target, "touchend", onMenuTouchEnd, {
-                passive: !0
-            }), dom.addEventListener(options.target, "touchcancel", onMenuTouchEnd, {
-                passive: !0
-            }), dom.addEventListener(mask, "touchstart", onBackgroundTouchStart, {
-                passive: !0
-            }), dom.addEventListener(mask, "touchmove", onBackgroundTouchMove, {}), dom.addEventListener(mask, "touchend", onBackgroundTouchEnd, {
-                passive: !0
-            }), dom.addEventListener(mask, "touchcancel", onBackgroundTouchEnd, {
-                passive: !0
-            })), self.clickMaskClose()
-        }, new TouchMenuLA
+
+        TouchMenuLA.prototype.hideMask = function () {
+            mask.classList.add("hide");
+            mask.classList.remove("backdrop");
+        };
+
+        TouchMenuLA.prototype.invoke = function (fn) {
+            if (fn) {
+                fn.apply(self);
            }
+        };
+
+        var _edgeSwipeEnabled;
+
+        TouchMenuLA.prototype.setEdgeSwipeEnabled = function (enabled) {
+            if (!options.disableEdgeSwipe) {
+                if (browser.touch) {
+                    if (enabled) {
+                        if (!_edgeSwipeEnabled) {
+                            _edgeSwipeEnabled = true;
+                            dom.addEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
+                                passive: true
+                            });
+                            dom.addEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
+                                passive: true
+                            });
+                            dom.addEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
+                                passive: true
+                            });
+                        }
+                    } else {
+                        if (_edgeSwipeEnabled) {
+                            _edgeSwipeEnabled = false;
+                            dom.removeEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
+                                passive: true
+                            });
+                            dom.removeEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
+                                passive: true
+                            });
+                            dom.removeEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
+                                passive: true
+                            });
+                        }
+                    }
+                }
+            }
+        };
+
+        TouchMenuLA.prototype.initialize = function () {
+            options = Object.assign(defaults, options || {});
+
+            if (browser.edge) {
+                options.disableEdgeSwipe = true;
+            }
+
+            self.initElements();
+
+            if (browser.touch) {
+                dom.addEventListener(options.target, "touchstart", onMenuTouchStart, {
+                    passive: true
+                });
+                dom.addEventListener(options.target, "touchmove", onMenuTouchMove, {
+                    passive: true
+                });
+                dom.addEventListener(options.target, "touchend", onMenuTouchEnd, {
+                    passive: true
+                });
+                dom.addEventListener(options.target, "touchcancel", onMenuTouchEnd, {
+                    passive: true
+                });
+                dom.addEventListener(mask, "touchstart", onBackgroundTouchStart, {
+                    passive: true
+                });
+                dom.addEventListener(mask, "touchmove", onBackgroundTouchMove, {});
+                dom.addEventListener(mask, "touchend", onBackgroundTouchEnd, {
+                    passive: true
+                });
+                dom.addEventListener(mask, "touchcancel", onBackgroundTouchEnd, {
+                    passive: true
+                });
+            }
+
+            self.clickMaskClose();
+        };
+
+        return new TouchMenuLA();
+    };
 });
--- a/src/components/nowplayingbar/nowplayingbar.css
+++ b/src/components/nowplayingbar/nowplayingbar.css
@ -28,7 +28,8 @@
    justify-content: center;
 }

-.mediaButton, .nowPlayingBarUserDataButtons .btnUserItemRating {
+.mediaButton,
+.nowPlayingBarUserDataButtons .btnUserItemRating {
    vertical-align: middle;
    margin: 0;
    text-align: center;
@ -62,6 +63,7 @@
 .nowPlayingBarCenter {
    vertical-align: middle;
    text-align: center;
+
    /* Need this to make sure it's on top of nowPlayingBarPositionContainer so that buttons are fully clickable */
    z-index: 2;
    flex-grow: 1;
@ -74,7 +76,7 @@
 .nowPlayingBarPositionContainer {
    position: absolute !important;
    left: 0;
-    top: -.56em;
+    top: -0.56em;
    right: 0;
    z-index: 1;
 }
@ -89,7 +91,8 @@

 .nowPlayingBarRight {
    position: relative;
-    margin: 0 .5em 0 auto;
+    margin: 0 0.5em 0 auto;
+
    /* Need this to make sure it's on top of nowPlayingBarPositionContainer so that buttons are fully clickable */
    z-index: 2;
    display: flex;
@ -121,7 +124,6 @@
 }

@media all and (max-width: 70em) {
-
    .nowPlayingBarRight .nowPlayingBarUserDataButtons {
        display: none;
    }
@ -155,13 +157,15 @@
    .nowPlayingBarRight .nowPlayingBarVolumeSliderContainer {
        display: none !important;
    }
+
    .nowPlayingBarInfoContainer {
        width: 70%;
    }
 }

@media all and (max-width: 24em) {
-    .nowPlayingBar .muteButton, .nowPlayingBar .unmuteButton {
+    .nowPlayingBar .muteButton,
+    .nowPlayingBar .unmuteButton {
        display: none;
    }
 }
--- a/src/components/playback/autoplaydetect.js
+++ b/src/components/playback/autoplaydetect.js
@ -1,61 +0,0 @@
-define([], function () {
-    'use strict';
-
-    function supportsHtmlMediaAutoplay() {
-
-        return new Promise(function (resolve, reject) {
-
-            var timeout;
-            var elem = document.createElement('video');
-            var elemStyle = elem.style;
-            //skip the test if video itself, or the autoplay
-            //element on it isn't supported
-            if (!('autoplay' in elem)) {
-                reject();
-                return;
-            }
-            elemStyle.position = 'absolute';
-            elemStyle.height = 0;
-            elemStyle.width = 0;
-
-            elem.setAttribute('autoplay', 'autoplay');
-            elem.style.display = 'none';
-            document.body.appendChild(elem);
-
-            var testAutoplay = function (arg) {
-                clearTimeout(timeout);
-                elem.removeEventListener('playing', testAutoplay);
-                elem.removeEventListener('play', testAutoplay);
-                var supported = (arg && arg.type === 'playing') || (arg && arg.type === 'play') || elem.currentTime !== 0;
-                elem.parentNode.removeChild(elem);
-
-                if (supported) {
-                    resolve();
-                } else {
-                    reject();
-                }
-            };
-
-            // play needed for firefox
-            elem.addEventListener('play', testAutoplay);
-            elem.addEventListener('playing', testAutoplay);
-
-            try {
-                elem.src = 'data:video/mp4;base64,AAAAHGZ0eXBtcDQyAAAAAG1wNDJpc29tYXZjMQAAAz5tb292AAAAbG12aGQAAAAAzaNacc2jWnEAAV+QAAFfkAABAAABAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACAAAAGGlvZHMAAAAAEICAgAcAT////3//AAACQ3RyYWsAAABcdGtoZAAAAAHNo1pxzaNacQAAAAEAAAAAAAFfkAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAEAAAAAAEAAAABAAAAAAAd9tZGlhAAAAIG1kaGQAAAAAzaNacc2jWnEAAV+QAAFfkFXEAAAAAAAhaGRscgAAAAAAAAAAdmlkZQAAAAAAAAAAAAAAAAAAAAGWbWluZgAAABR2bWhkAAAAAQAAAAAAAAAAAAAAJGRpbmYAAAAcZHJlZgAAAAAAAAABAAAADHVybCAAAAABAAABVnN0YmwAAACpc3RzZAAAAAAAAAABAAAAmWF2YzEAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAEAAQAEgAAABIAAAAAAAAAAEOSlZUL0FWQyBDb2RpbmcAAAAAAAAAAAAAAAAAAAAAAAAY//8AAAAxYXZjQwH0AAr/4QAZZ/QACq609NQYBBkAAAMAAQAAAwAKjxImoAEABWjOAa8gAAAAEmNvbHJuY2xjAAYAAQAGAAAAGHN0dHMAAAAAAAAAAQAAAAUAAEZQAAAAKHN0c3oAAAAAAAAAAAAAAAUAAAIqAAAACAAAAAgAAAAIAAAACAAAAChzdHNjAAAAAAAAAAIAAAABAAAABAAAAAEAAAACAAAAAQAAAAEAAAAYc3RjbwAAAAAAAAACAAADYgAABaQAAAAUc3RzcwAAAAAAAAABAAAAAQAAABFzZHRwAAAAAAREREREAAAAb3VkdGEAAABnbWV0YQAAAAAAAAAhaGRscgAAAAAAAAAAbWRpcgAAAAAAAAAAAAAAAAAAAAA6aWxzdAAAADKpdG9vAAAAKmRhdGEAAAABAAAAAEhhbmRCcmFrZSAwLjkuOCAyMDEyMDcxODAwAAACUm1kYXQAAAHkBgX/4NxF6b3m2Ui3lizYINkj7u94MjY0IC0gY29yZSAxMjAgLSBILjI2NC9NUEVHLTQgQVZDIGNvZGVjIC0gQ29weWxlZnQgMjAwMy0yMDExIC0gaHR0cDovL3d3dy52aWRlb2xhbi5vcmcveDI2NC5odG1sIC0gb3B0aW9uczogY2FiYWM9MCByZWY9MSBkZWJsb2NrPTE6MDowIGFuYWx5c2U9MHgxOjAgbWU9ZXNhIHN1Ym1lPTkgcHN5PTAgbWl4ZWRfcmVmPTAgbWVfcmFuZ2U9NCBjaHJvbWFfbWU9MSB0cmVsbGlzPTAgOHg4ZGN0PTAgY3FtPTAgZGVhZHpvbmU9MjEsMTEgZmFzdF9wc2tpcD0wIGNocm9tYV9xcF9vZmZzZXQ9MCB0aHJlYWRzPTYgc2xpY2VkX3RocmVhZHM9MCBucj0wIGRlY2ltYXRlPTEgaW50ZXJsYWNlZD0wIGJsdXJheV9jb21wYXQ9MCBjb25zdHJhaW5lZF9pbnRyYT0wIGJmcmFtZXM9MCB3ZWlnaHRwPTAga2V5aW50PTUwIGtleWludF9taW49NSBzY2VuZWN1dD00MCBpbnRyYV9yZWZyZXNoPTAgcmM9Y3FwIG1idHJlZT0wIHFwPTAAgAAAAD5liISscR8A+E4ACAACFoAAITAAAgsAAPgYCoKgoC+L4vi+KAvi+L4YfAEAACMzgABF9AAEUGUgABDJiXnf4AAAAARBmiKUAAAABEGaQpQAAAAEQZpilAAAAARBmoKU';
-                var promise = elem.play();
-                if (promise && promise.catch) {
-                    promise.catch(reject);
-                }
-
-                timeout = setTimeout(testAutoplay, 500);
-            } catch (e) {
-                reject();
-                return;
-            }
-        });
-    }
-
-    return {
-        supportsHtmlMediaAutoplay: supportsHtmlMediaAutoplay
-    };
-});
--- a/src/components/playback/iconosd.css
+++ b/src/components/playback/iconosd.css
@ -4,11 +4,11 @@
    right: 3%;
    z-index: 100000;
    background: #222;
-    background: rgba(0, 0, 0, .8);
+    background: rgba(0, 0, 0, 0.8);
    padding: 1em;
    color: #fff;
    backdrop-filter: blur(5px);
-    border-radius: .25em;
+    border-radius: 0.25em;
    transition: opacity 200ms ease-out;
 }

@ -19,22 +19,22 @@
 .iconOsdIcon {
    font-size: 320%;
    display: block;
-    margin: .25em .7em;
+    margin: 0.25em 0.7em;
 }

 .iconOsdProgressOuter {
-    margin: 1.5em .25em 1em;
-    height: .35em;
+    margin: 1.5em 0.25em 1em;
+    height: 0.35em;
    background: #222;
-    border-radius: .25em;
+    border-radius: 0.25em;
 }

 .iconOsdProgressInner {
    background: #00a4dc;
    height: 100%;
-    border-radius: .25em;
+    border-radius: 0.25em;
 }

 .brightnessOsdProgressInner {
-    background: #FF9800;
+    background: #ff9800;
 }
--- a/src/components/playerstats/playerstats.css
+++ b/src/components/playerstats/playerstats.css
@ -1,11 +1,10 @@
 .playerStats {
    background: rgba(28, 28, 28, 0.8);
-    border-radius: .3em;
+    border-radius: 0.3em;
    color: #fff;
    left: 1.5em;
    position: absolute;
    top: 5em;
-    color: #fff;
 }

 .playerStats-tv {
@ -23,8 +22,8 @@

 .playerStats-closeButton {
    position: absolute;
-    top: .25em;
-    right: .25em;
+    top: 0.25em;
+    right: 0.25em;
    color: #ccc;
    z-index: 1;
 }
@ -44,7 +43,7 @@

 .playerStats-stat-label {
    font-weight: 500;
-    margin: 0 .5em 0 0;
+    margin: 0 0.5em 0 0;
 }

 .playerStats-stat-header {
--- a/src/components/recordingcreator/recordingcreator.css
+++ b/src/components/recordingcreator/recordingcreator.css
@ -9,7 +9,7 @@
 }

 .recordingDialog-itemName {
-    margin-top: .7em;
+    margin-top: 0.7em;
 }

 .recordingDetailsContainer {
--- a/src/components/recordingcreator/recordingfields.css
+++ b/src/components/recordingcreator/recordingfields.css
@ -4,9 +4,9 @@
 }

 .recordingIcon-active {
-    color: #cc3333;
+    color: #c33;
 }

 .recordSeriesContainer {
-    margin-bottom: .8em;
+    margin-bottom: 0.8em;
 }
--- a/src/components/remotecontrol/remotecontrol.css
+++ b/src/components/remotecontrol/remotecontrol.css
@ -5,11 +5,11 @@
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
-    flex-direction: row
+    flex-direction: row;
 }

 .navigationSection {
-    text-align: center
+    text-align: center;
 }

 .btnArrowUp {
@ -33,11 +33,11 @@
 }

 .nowPlayingPageTitle {
-    margin: 0 0 .5em .5em
+    margin: 0 0 0.5em 0.5em;
 }

 .nowPlayingPositionSliderContainer {
-    margin: .7em 0 .7em 1em
+    margin: 0.7em 0 0.7em 1em;
 }

 .nowPlayingInfoButtons {
@ -48,27 +48,27 @@
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
-    flex-wrap: wrap
+    flex-wrap: wrap;
 }

 .nowPlayingInfoControls,
 .nowPlayingTime {
    display: flex;
    display: -webkit-box;
-    display: -webkit-flex
+    display: -webkit-flex;
 }

 .nowPlayingPageImageContainer {
    width: 20%;
-    margin-right: .25em;
+    margin-right: 0.25em;
    position: relative;
    -webkit-flex-shrink: 0;
-    flex-shrink: 0
+    flex-shrink: 0;
 }

@media all and (min-width: 50em) {
    .nowPlayingPageImageContainer {
-        width: 16%
+        width: 16%;
    }
 }

@ -83,7 +83,7 @@
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
-    justify-content: center
+    justify-content: center;
 }

 .nowPlayingPageImage {
@ -93,13 +93,13 @@
    width: 100%;
    -webkit-box-shadow: 0 0 1.9vh #000;
    box-shadow: 0 0 1.9vh #000;
-    border: .1em solid #222;
+    border: 0.1em solid #222;
    user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
-    -ms-user-select: none
+    -ms-user-select: none;
 }

@media all and (orientation: portrait) and (max-width: 50em) {
@ -110,43 +110,43 @@
        flex-direction: column !important;
        -webkit-box-align: center;
        -webkit-align-items: center;
-        align-items: center
+        align-items: center;
    }

    .nowPlayingPageTitle {
        text-align: center;
-        margin: .5em 0 .75em
+        margin: 0.5em 0 0.75em;
    }

    .nowPlayingPositionSliderContainer {
-        margin: .7em 1em
+        margin: 0.7em 1em;
    }

    .nowPlayingInfoButtons {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
-        justify-content: center
+        justify-content: center;
    }

    .nowPlayingPageImageContainer {
        width: auto;
-        margin-right: 0
+        margin-right: 0;
    }

    .nowPlayingInfoControls {
        margin-top: 1em;
-        max-width: 100%
+        max-width: 100%;
    }

    .nowPlayingPageImage {
        width: auto;
-        height: 36vh
+        height: 36vh;
    }
 }

@media all and (orientation: portrait) and (max-width: 40em) {
    .nowPlayingPageImage {
-        height: 30vh
+        height: 30vh;
    }
 }

@ -155,7 +155,7 @@
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
-    margin: 0 1em
+    margin: 0 1em;
 }

 .nowPlayingSecondaryButtons {
@ -169,7 +169,7 @@
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
-    justify-content: center
+    justify-content: center;
 }

@media all and (min-width: 50em) {
@ -179,25 +179,25 @@
        flex-grow: 1;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
-        justify-content: flex-end
+        justify-content: flex-end;
    }
 }

@media all and (min-width: 80em) {
    .nowPlayingPageImageContainer {
-        margin-right: .75em
+        margin-right: 0.75em;
    }
 }

 .nowPlayingNavButtonContainer {
-    width: 30em
+    width: 30em;
 }

 .smallBackdropPosterItem .cardOverlayInner > div {
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
-    overflow: hidden
+    overflow: hidden;
 }

 .playlistIndexIndicatorImage {
@ -207,17 +207,18 @@
 }

 .hideVideoButtons .videoButton {
-    display: none
+    display: none;
 }

 .nowPlayingVolumeSliderContainer {
-    width: 9em
+    width: 9em;
 }

@media all and (max-width: 50em) {
    .nowPlayingInfoButtons .nowPlayingPageUserDataButtons {
-        display: none !important
+        display: none !important;
    }
+
    .navigationSection .collapseContent i {
        font-size: 4em;
    }
@ -225,7 +226,7 @@

@media all and (max-width: 47em) {
    .nowPlayingInfoButtons .repeatToggleButton {
-        display: none !important
+        display: none !important;
    }
 }

@ -233,6 +234,6 @@
    .nowPlayingInfoButtons .btnNowPlayingFastForward,
    .nowPlayingInfoButtons .btnNowPlayingRewind,
    .nowPlayingInfoButtons .playlist .listItemMediaInfo {
-        display: none !important
+        display: none !important;
    }
 }
--- a/src/components/search/searchfields.css
+++ b/src/components/search/searchfields.css
@ -4,8 +4,8 @@
 }

 .searchfields-icon {
-    margin-bottom: .1em;
-    margin-right: .25em;
+    margin-bottom: 0.1em;
+    margin-right: 0.25em;
    font-size: 2em;
    align-self: flex-end;
 }
--- a/src/components/slideshow/style.css
+++ b/src/components/slideshow/style.css
@ -3,11 +3,14 @@
    background: #000;
 }

-.slideshowSwiperContainer, .swiper-wrapper, .swiper-slide {
+.slideshowSwiperContainer,
+.swiper-wrapper,
+.swiper-slide {
    background: #000;
 }

-.slideshowImage, .slideshowSwiperContainer {
+.slideshowImage,
+.slideshowSwiperContainer {
    position: fixed;
    top: 0;
    right: 0;
@ -27,11 +30,12 @@

 .slideshowImageText {
    position: fixed;
-    bottom: .25em;
-    right: .5em;
+    bottom: 0.25em;
+    right: 0.5em;
    color: #fff;
    z-index: 1002;
    font-weight: normal;
+
    /* Add an outline */
    text-shadow: 3px 3px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
 }
@ -52,26 +56,26 @@

 .slideshowButtonIcon {
    color: #fff;
-    opacity: .7;
+    opacity: 0.7;
 }

 .btnSlideshowPrevious {
-    left: .5vh;
+    left: 0.5vh;
    top: 45vh;
    z-index: 1002;
    position: absolute;
 }

 .btnSlideshowNext {
-    right: .5vh;
+    right: 0.5vh;
    top: 45vh;
    z-index: 1002;
    position: absolute;
 }

 .topActionButtons {
-    right: .5vh;
-    top: .5vh;
+    right: 0.5vh;
+    top: 0.5vh;
    z-index: 1002;
    position: absolute;
 }
@ -81,9 +85,9 @@
    left: 0;
    bottom: 0;
    right: 0;
-    background-color: rgba(0, 0, 0, .7);
+    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
-    padding: .5%;
+    padding: 0.5%;
    display: flex;
    flex-direction: row;
    align-items: center;
@ -95,9 +99,9 @@
    left: 0;
    top: 0;
    right: 0;
-    background-color: rgba(0, 0, 0, .7);
+    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
-    padding: .5%;
+    padding: 0.5%;
    display: flex;
    flex-direction: row;
    align-items: center;
@ -121,14 +125,14 @@
 .slideTextInner {
    margin: 0 auto;
    max-width: 60%;
-    background: rgba(0,0,0,.8);
+    background: rgba(0, 0, 0, 0.8);
    display: inline-block;
-    padding: .5em 1em;
-    border-radius: .25em;
+    padding: 0.5em 1em;
+    border-radius: 0.25em;
 }

 .slideTitle {
-    margin: 0 0 .25em;
+    margin: 0 0 0.25em;
 }

 .slideSubtitle {
--- a/src/components/subtitlesync/subtitlesync.css
+++ b/src/components/subtitlesync/subtitlesync.css
@ -4,7 +4,7 @@
    margin-right: 30%;
    height: 4.2em;
    background: rgba(28, 28, 28, 0.8);
-    border-radius: .3em;
+    border-radius: 0.3em;
    color: #fff;
    position: absolute;
 }
@ -43,6 +43,6 @@
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    flex-grow: 1;
-    border-radius: .3em;
+    border-radius: 0.3em;
    z-index: 1;
 }
--- a/src/components/toast/toast.css
+++ b/src/components/toast/toast.css
@ -3,9 +3,9 @@
    min-width: 20em;
    box-sizing: border-box;
    box-shadow: 0 0.0725em 0.29em 0 rgba(0, 0, 0, 0.37);
-    border-radius: .15em;
+    border-radius: 0.15em;
    cursor: default;
-    transition: transform .3s ease-out;
+    transition: transform 0.3s ease-out;
    min-height: initial;
    padding: 1em 1.5em;
    bottom: 1em;
--- a/src/components/upnextdialog/upnextdialog.css
+++ b/src/components/upnextdialog/upnextdialog.css
@ -28,7 +28,7 @@
    position: relative;
    margin-right: 1em;
    flex-shrink: 0;
-    margin-bottom: .5em;
+    margin-bottom: 0.5em;
 }

 .upNextDialog-button {
@ -37,7 +37,6 @@
 }

@media all and (orientation: landscape) {
-
    .upNextDialog {
        flex-direction: row;
    }
--- a/src/components/userdatabuttons/userdatabuttons.css
+++ b/src/components/userdatabuttons/userdatabuttons.css
@ -1,3 +1,3 @@
 .btnUserDataOn {
-    color: #cc3333 !important;
+    color: #c33 !important;
 }
--- a/src/components/usersettings/usersettings.js
+++ b/src/components/usersettings/usersettings.js
@ -1,5 +0,0 @@
-define(['userSettingsBuilder'], function (userSettingsBuilder) {
-    'use strict';
-
-    return new userSettingsBuilder();
-});
--- a/src/components/viewManager/viewContainer.css
+++ b/src/components/viewManager/viewContainer.css
@ -5,7 +5,9 @@
    right: 0;
    bottom: 0;
    contain: layout style size;
+
    /* Can't use will-change because it causes the alpha picker to move when the page scrolls */
+
    /* will-change: transform; */
 }

@ -18,6 +20,7 @@
        opacity: 0;
    }
 }
+
@keyframes view-fadein {
    from {
        opacity: 0;
--- a/src/controllers/auth/login.js
+++ b/src/controllers/auth/login.js
@ -8,7 +8,14 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
        apiClient.authenticateUserByName(username, password).then(function (result) {
            var user = result.User;
            var serverId = getParameterByName("serverid");
-            var newUrl = user.Policy.IsAdministrator && !serverId ? "dashboard.html" : "home.html";
+            var newUrl;
+
+            if (user.Policy.IsAdministrator && !serverId) {
+                newUrl = "dashboard.html";
+            } else {
+                newUrl = "home.html";
+            }
+
            loading.hide();
            Dashboard.onServerChanged(user.Id, result.AccessToken, apiClient);
            Dashboard.navigate(newUrl);
@ -16,6 +23,7 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
            page.querySelector("#txtManualName").value = "";
            page.querySelector("#txtManualPassword").value = "";
            loading.hide();
+
            if (response.status === 401) {
                require(["toast"], function (toast) {
                    toast(Globalize.translate("MessageInvalidUser"));
@ -34,8 +42,18 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
        context.querySelector(".manualLoginForm").classList.remove("hide");
        context.querySelector(".visualLoginForm").classList.add("hide");
        context.querySelector(".btnManual").classList.add("hide");
-        focusPassword ? context.querySelector("#txtManualPassword").focus() : context.querySelector("#txtManualName").focus();
-        showCancel ? context.querySelector(".btnCancel").classList.remove("hide") : context.querySelector(".btnCancel").classList.add("hide");
+
+        if (focusPassword) {
+            context.querySelector("#txtManualPassword").focus();
+        } else {
+            context.querySelector("#txtManualName").focus();
+        }
+
+        if (showCancel) {
+            context.querySelector(".btnCancel").classList.remove("hide");
+        } else {
+            context.querySelector(".btnCancel").classList.add("hide");
+        }
    }

    var metroColors = ["#6FBD45", "#4BB3DD", "#4164A5", "#E12026", "#800080", "#E1B222", "#008040", "#0094FF", "#FF00C7", "#FF870F", "#7F0037"];
@ -49,22 +67,25 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
        if (str) {
            var character = String(str.substr(0, 1).charCodeAt());
            var sum = 0;
+
            for (var i = 0; i < character.length; i++) {
                sum += parseInt(character.charAt(i));
            }
+
            var index = String(sum).substr(-1);
            return metroColors[index];
        }
+
        return getRandomMetroColor();
    }

    function loadUserList(context, apiClient, users) {
        var html = "";
+
        for (var i = 0; i < users.length; i++) {
            var user = users[i];

            // TODO move card creation code to Card component
-
            var cssClass = "card squareCard scalableCard squareCard-scalable";

            if (layoutManager.tv) {
@ -76,13 +97,13 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
            }

            var cardBoxCssClass = "cardBox cardBox-bottompadded";
-
            html += '<button type="button" class="' + cssClass + '">';
            html += '<div class="' + cardBoxCssClass + '">';
            html += '<div class="cardScalable">';
            html += '<div class="cardPadder cardPadder-square"></div>';
            html += '<div class="cardContent" data-haspw="' + user.HasPassword + '" data-username="' + user.Name + '" data-userid="' + user.Id + '">';
            var imgUrl;
+
            if (user.PrimaryImageTag) {
                imgUrl = apiClient.getUserImageUrl(user.Id, {
                    width: 300,
@ -95,6 +116,7 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
                imgUrl = "assets/img/avatar.png";
                html += '<div class="cardImageContainer coveredImage coveredImage-noScale" style="background-image:url(\'' + imgUrl + "');background-color:" + background + ';"></div>';
            }
+
            html += "</div>";
            html += "</div>";
            html += '<div class="cardFooter visualCardBox-cardFooter">';
@ -103,13 +125,19 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
            html += "</div>";
            html += "</button>";
        }
+
        context.querySelector("#divUsers").innerHTML = html;
    }

    return function (view, params) {
        function getApiClient() {
            var serverId = params.serverid;
-            return serverId ? connectionManager.getOrCreateApiClient(serverId) : ApiClient;
+
+            if (serverId) {
+                return connectionManager.getOrCreateApiClient(serverId);
+            }
+
+            return ApiClient;
        }

        function showVisualForm() {
@ -125,11 +153,13 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
        view.querySelector("#divUsers").addEventListener("click", function (e) {
            var card = dom.parentWithClass(e.target, "card");
            var cardContent = card ? card.querySelector(".cardContent") : null;
+
            if (cardContent) {
                var context = view;
                var id = cardContent.getAttribute("data-userid");
                var name = cardContent.getAttribute("data-username");
                var haspw = cardContent.getAttribute("data-haspw");
+
                if (id === 'manual') {
                    context.querySelector("#txtManualName").value = "";
                    showManualForm(context, true);
@ -142,7 +172,6 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
                }
            }
        });
-
        view.querySelector(".manualLoginForm").addEventListener("submit", function (e) {
            appSettings.enableAutoLogin(view.querySelector(".chkRememberLogin").checked);
            var apiClient = getApiClient();
@ -150,23 +179,21 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
            e.preventDefault();
            return false;
        });
-
        view.querySelector(".btnForgotPassword").addEventListener("click", function () {
            Dashboard.navigate("forgotpassword.html");
        });
-
        view.querySelector(".btnCancel").addEventListener("click", showVisualForm);
-
        view.querySelector(".btnManual").addEventListener("click", function () {
            view.querySelector("#txtManualName").value = "";
            showManualForm(view, true);
        });
-
        view.addEventListener("viewshow", function (e) {
            loading.show();
+
            if (!appHost.supports('multiserver')) {
                view.querySelector(".btnSelectServer").classList.add("hide");
            }
+
            var apiClient = getApiClient();
            apiClient.getPublicUsers().then(function (users) {
                if (users.length) {
@ -179,10 +206,9 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout
            }).catch().then(function () {
                loading.hide();
            });
-
            apiClient.getJSON(apiClient.getUrl("Branding/Configuration")).then(function (options) {
                view.querySelector(".disclaimer").textContent = options.LoginDisclaimer || "";
            });
        });
-    }
+    };
 });
--- a/src/controllers/dashboard/general.js
+++ b/src/controllers/dashboard/general.js
@ -4,35 +4,26 @@ define(["jQuery", "loading", "fnchecked", "emby-checkbox", "emby-textarea", "emb
    function loadPage(page, config, languageOptions, systemInfo) {
        page.querySelector("#txtServerName").value = systemInfo.ServerName;
        $("#chkAutoRunWebApp", page).checked(config.AutoRunWebApp);
+
        if (systemInfo.CanLaunchWebBrowser) {
            page.querySelector("#fldAutoRunWebApp").classList.remove("hide");
        } else {
            page.querySelector("#fldAutoRunWebApp").classList.add("hide");
        }
+
        page.querySelector("#txtCachePath").value = systemInfo.CachePath || "";
        $("#txtMetadataPath", page).val(systemInfo.InternalMetadataPath || "");
        $("#txtMetadataNetworkPath", page).val(systemInfo.MetadataNetworkPath || "");
        $("#selectLocalizationLanguage", page).html(languageOptions.map(function (language) {
-            return '<option value="' + language.Value + '">' + language.Name + "</option>"
+            return '<option value="' + language.Value + '">' + language.Name + "</option>";
        })).val(config.UICulture);
        currentLanguage = config.UICulture;
-        if (systemInfo.CanSelfUpdate) {
-            page.querySelector(".fldAutomaticUpdates").classList.remove("hide");
-        } else {
-            page.querySelector(".fldAutomaticUpdates").classList.add("hide");
-        }
-        $("#chkEnableAutomaticServerUpdates", page).checked(config.EnableAutoUpdate);
-        $("#chkEnableAutomaticRestart", page).checked(config.EnableAutomaticRestart);
-        if (systemInfo.CanSelfRestart) {
-            page.querySelector("#fldEnableAutomaticRestart").classList.remove("hide");
-        } else {
-            page.querySelector("#fldEnableAutomaticRestart").classList.add("hide");
-        }
        if (systemInfo.CanSelfRestart || systemInfo.CanSelfUpdate) {
            $(".autoUpdatesContainer", page).removeClass("hide");
        } else {
            $(".autoUpdatesContainer", page).addClass("hide");
        }
+
        loading.hide();
    }

@ -40,56 +31,57 @@ define(["jQuery", "loading", "fnchecked", "emby-checkbox", "emby-textarea", "emb
        loading.show();
        var form = this;
        $(form).parents(".page");
-        return ApiClient.getServerConfiguration().then(function(config) {
+        ApiClient.getServerConfiguration().then(function (config) {
            config.ServerName = $("#txtServerName", form).val();
            config.UICulture = $("#selectLocalizationLanguage", form).val();
            config.CachePath = form.querySelector("#txtCachePath").value;
            config.MetadataPath = $("#txtMetadataPath", form).val();
            config.MetadataNetworkPath = $("#txtMetadataNetworkPath", form).val();
-            var requiresReload = (config.UICulture !== currentLanguage);
+            var requiresReload = config.UICulture !== currentLanguage;
            config.AutoRunWebApp = $("#chkAutoRunWebApp", form).checked();
-            config.EnableAutomaticRestart = $("#chkEnableAutomaticRestart", form).checked();
-            config.EnableAutoUpdate = $("#chkEnableAutomaticServerUpdates", form).checked();
            ApiClient.updateServerConfiguration(config).then(function() {
                ApiClient.getNamedConfiguration(brandingConfigKey).then(function(brandingConfig) {
                    brandingConfig.LoginDisclaimer = form.querySelector("#txtLoginDisclaimer").value;
                    brandingConfig.CustomCss = form.querySelector("#txtCustomCss").value;
+
                    if (currentBrandingOptions && brandingConfig.CustomCss !== currentBrandingOptions.CustomCss) {
                        requiresReload = true;
                    }
+
                    ApiClient.updateNamedConfiguration(brandingConfigKey, brandingConfig).then(function () {
                        Dashboard.processServerConfigurationUpdateResult();
+
                        if (requiresReload && !AppInfo.isNativeApp) {
                            window.location.reload(true);
                        }
                    });
-                })
-            })
-        }), !1
+                });
+            });
+        });
+        return false;
    }

    var currentBrandingOptions;
    var currentLanguage;
    var brandingConfigKey = "branding";
-
    return function (view, params) {
        $("#btnSelectCachePath", view).on("click.selectDirectory", function () {
            require(["directorybrowser"], function (directoryBrowser) {
-                var picker = new directoryBrowser;
+                var picker = new directoryBrowser();
                picker.show({
                    callback: function (path) {
                        if (path) {
                            view.querySelector("#txtCachePath").value = path;
                        }
+
                        picker.close();
                    },
                    validateWriteable: true,
                    header: Globalize.translate("HeaderSelectServerCachePath"),
                    instruction: Globalize.translate("HeaderSelectServerCachePathHelp")
-                })
-            })
                });
-
+            });
+        });
        $("#btnSelectMetadataPath", view).on("click.selectDirectory", function () {
            require(["directorybrowser"], function (directoryBrowser) {
                var picker = new directoryBrowser();
@ -100,19 +92,20 @@ define(["jQuery", "loading", "fnchecked", "emby-checkbox", "emby-textarea", "emb
                        if (path) {
                            $("#txtMetadataPath", view).val(path);
                        }
+
                        if (networkPath) {
                            $("#txtMetadataNetworkPath", view).val(networkPath);
                        }
+
                        picker.close();
                    },
                    validateWriteable: true,
                    header: Globalize.translate("HeaderSelectMetadataPath"),
                    instruction: Globalize.translate("HeaderSelectMetadataPathHelp"),
                    enableNetworkSharePath: true
-                })
-            })
                });
-
+            });
+        });
        $(".dashboardGeneralForm", view).off("submit", onSubmit).on("submit", onSubmit);
        view.addEventListener("viewshow", function () {
            var promiseConfig = ApiClient.getServerConfiguration();
@ -127,5 +120,5 @@ define(["jQuery", "loading", "fnchecked", "emby-checkbox", "emby-textarea", "emb
                view.querySelector("#txtCustomCss").value = config.CustomCss || "";
            });
        });
-    }
+    };
 });
--- a/src/controllers/dashboard/networking.js
+++ b/src/controllers/dashboard/networking.js
@ -7,47 +7,55 @@ define(["loading", "libraryMenu", "globalize", "emby-checkbox", "emby-select"],
        var enableUpnp = form.querySelector("#chkEnableUpnp").checked;
        confirmSelections(localAddress, enableUpnp, function () {
            var validationResult = getValidationAlert(form);
-            if (validationResult) return void alertText(validationResult);
+
+            if (validationResult) {
+                alertText(validationResult);
+                return;
+            }
+
            validateHttps(form).then(function () {
                loading.show();
                ApiClient.getServerConfiguration().then(function (config) {
                    config.LocalNetworkSubnets = form.querySelector("#txtLanNetworks").value.split(",").map(function (s) {
-                        return s.trim()
+                        return s.trim();
                    }).filter(function (s) {
-                        return s.length > 0
+                        return s.length > 0;
                    });
-
                    config.RemoteIPFilter = form.querySelector("#txtExternalAddressFilter").value.split(",").map(function (s) {
-                        return s.trim()
+                        return s.trim();
                    }).filter(function (s) {
-                        return s.length > 0
+                        return s.length > 0;
                    });
-
                    config.IsRemoteIPFilterBlacklist = "blacklist" === form.querySelector("#selectExternalAddressFilterMode").value;
                    config.PublicPort = form.querySelector("#txtPublicPort").value;
                    config.PublicHttpsPort = form.querySelector("#txtPublicHttpsPort").value;
                    var httpsMode = form.querySelector("#selectHttpsMode").value;
+
                    switch (httpsMode) {
                        case "proxy":
                            config.EnableHttps = true;
                            config.RequireHttps = false;
                            config.IsBehindProxy = true;
                            break;
+
                        case "required":
                            config.EnableHttps = true;
                            config.RequireHttps = true;
                            config.IsBehindProxy = false;
                            break;
+
                        case "enabled":
                            config.EnableHttps = true;
                            config.RequireHttps = false;
                            config.IsBehindProxy = false;
                            break;
+
                        default:
                            config.EnableHttps = false;
                            config.RequireHttps = false;
                            config.IsBehindProxy = false;
                    }
+
                    config.HttpsPortNumber = form.querySelector("#txtHttpsPort").value;
                    config.HttpServerPortNumber = form.querySelector("#txtPortNumber").value;
                    config.EnableUPnP = enableUpnp;
@ -57,44 +65,63 @@ define(["loading", "libraryMenu", "globalize", "emby-checkbox", "emby-select"],
                    config.CertificatePassword = form.querySelector("#txtCertPassword").value || null;
                    config.LocalNetworkAddresses = localAddress ? [localAddress] : [];
                    ApiClient.updateServerConfiguration(config).then(Dashboard.processServerConfigurationUpdateResult, Dashboard.processErrorResponse);
-                })
-            })
-        }), e.preventDefault()
+                });
+            });
+        });
+        e.preventDefault();
    }

    function triggerChange(select) {
        var evt = document.createEvent("HTMLEvents");
-        evt.initEvent("change", !1, !0), select.dispatchEvent(evt)
+        evt.initEvent("change", false, true);
+        select.dispatchEvent(evt);
    }

    function getValidationAlert(form) {
-        return form.querySelector("#txtPublicPort").value === form.querySelector("#txtPublicHttpsPort").value ? "The public http and https ports must be different." : form.querySelector("#txtPortNumber").value === form.querySelector("#txtHttpsPort").value ? "The http and https ports must be different." : null
+        if (form.querySelector("#txtPublicPort").value === form.querySelector("#txtPublicHttpsPort").value) {
+            return "The public http and https ports must be different.";
+        }
+
+        if (form.querySelector("#txtPortNumber").value === form.querySelector("#txtHttpsPort").value) {
+            return "The http and https ports must be different.";
+        }
+
+        return null;
    }

    function validateHttps(form) {
        var certPath = form.querySelector("#txtCertificatePath").value || null;
        var httpsMode = form.querySelector("#selectHttpsMode").value;
-        return "enabled" !== httpsMode && "required" !== httpsMode || certPath ? Promise.resolve() : new Promise(function(resolve, reject) {
+
+        if ("enabled" !== httpsMode && "required" !== httpsMode || certPath) {
+            return Promise.resolve();
+        }
+
+        return new Promise(function (resolve, reject) {
            return alertText({
                title: globalize.translate("TitleHostingSettings"),
                text: globalize.translate("HttpsRequiresCert")
-            }).then(reject, reject)
-        })
+            }).then(reject, reject);
+        });
    }

    function alertText(options) {
        return new Promise(function (resolve, reject) {
            require(["alert"], function (alert) {
-                alert(options).then(resolve, reject)
-            })
-        })
+                alert(options).then(resolve, reject);
+            });
+        });
    }

    function confirmSelections(localAddress, enableUpnp, callback) {
-        localAddress || !enableUpnp ? alertText({
+        if (localAddress || !enableUpnp) {
+            alertText({
                title: globalize.translate("TitleHostingSettings"),
                text: globalize.translate("SettingsWarning")
-        }).then(callback) : callback()
+            }).then(callback);
+        } else {
+            callback();
+        }
    }

    return function (view, params) {
@ -108,7 +135,17 @@ define(["loading", "libraryMenu", "globalize", "emby-checkbox", "emby-select"],
            page.querySelector("#selectExternalAddressFilterMode").value = config.IsRemoteIPFilterBlacklist ? "blacklist" : "whitelist";
            page.querySelector("#chkRemoteAccess").checked = null == config.EnableRemoteAccess || config.EnableRemoteAccess;
            var selectHttpsMode = page.querySelector("#selectHttpsMode");
-            config.IsBehindProxy ? selectHttpsMode.value = "proxy" : config.RequireHttps ? selectHttpsMode.value = "required" : config.EnableHttps ? selectHttpsMode.value = "enabled" : selectHttpsMode.value = "disabled";
+
+            if (config.IsBehindProxy) {
+                selectHttpsMode.value = "proxy";
+            } else if (config.RequireHttps) {
+                selectHttpsMode.value = "required";
+            } else if (config.EnableHttps) {
+                selectHttpsMode.value = "enabled";
+            } else {
+                selectHttpsMode.value = "disabled";
+            }
+
            page.querySelector("#txtHttpsPort").value = config.HttpsPortNumber;
            page.querySelector("#txtBaseUrl").value = config.BaseUrl || "";
            var txtCertificatePath = page.querySelector("#txtCertificatePath");
@ -120,26 +157,49 @@ define(["loading", "libraryMenu", "globalize", "emby-checkbox", "emby-select"],
        }

        view.querySelector("#chkRemoteAccess").addEventListener("change", function () {
-            this.checked ? (view.querySelector(".fldExternalAddressFilter").classList.remove("hide"), view.querySelector(".fldExternalAddressFilterMode").classList.remove("hide"), view.querySelector(".fldPublicPort").classList.remove("hide"), view.querySelector(".fldPublicHttpsPort").classList.remove("hide"), view.querySelector(".fldCertificatePath").classList.remove("hide"), view.querySelector(".fldCertPassword").classList.remove("hide"), view.querySelector(".fldHttpsMode").classList.remove("hide"), view.querySelector(".fldEnableUpnp").classList.remove("hide")) : (view.querySelector(".fldExternalAddressFilter").classList.add("hide"), view.querySelector(".fldExternalAddressFilterMode").classList.add("hide"), view.querySelector(".fldPublicPort").classList.add("hide"), view.querySelector(".fldPublicHttpsPort").classList.add("hide"), view.querySelector(".fldCertificatePath").classList.add("hide"), view.querySelector(".fldCertPassword").classList.add("hide"), view.querySelector(".fldHttpsMode").classList.add("hide"), view.querySelector(".fldEnableUpnp").classList.add("hide"))
-        }), view.querySelector("#btnSelectCertPath").addEventListener("click", function() {
+            if (this.checked) {
+                view.querySelector(".fldExternalAddressFilter").classList.remove("hide");
+                view.querySelector(".fldExternalAddressFilterMode").classList.remove("hide");
+                view.querySelector(".fldPublicPort").classList.remove("hide");
+                view.querySelector(".fldPublicHttpsPort").classList.remove("hide");
+                view.querySelector(".fldCertificatePath").classList.remove("hide");
+                view.querySelector(".fldCertPassword").classList.remove("hide");
+                view.querySelector(".fldHttpsMode").classList.remove("hide");
+                view.querySelector(".fldEnableUpnp").classList.remove("hide");
+            } else {
+                view.querySelector(".fldExternalAddressFilter").classList.add("hide");
+                view.querySelector(".fldExternalAddressFilterMode").classList.add("hide");
+                view.querySelector(".fldPublicPort").classList.add("hide");
+                view.querySelector(".fldPublicHttpsPort").classList.add("hide");
+                view.querySelector(".fldCertificatePath").classList.add("hide");
+                view.querySelector(".fldCertPassword").classList.add("hide");
+                view.querySelector(".fldHttpsMode").classList.add("hide");
+                view.querySelector(".fldEnableUpnp").classList.add("hide");
+            }
+        });
+        view.querySelector("#btnSelectCertPath").addEventListener("click", function () {
            require(["directorybrowser"], function (directoryBrowser) {
-                var picker = new directoryBrowser;
+                var picker = new directoryBrowser();
                picker.show({
-                    includeFiles: !0,
-                    includeDirectories: !0,
+                    includeFiles: true,
+                    includeDirectories: true,
                    callback: function (path) {
-                        path && (view.querySelector("#txtCertificatePath").value = path), picker.close()
+                        if (path) {
+                            view.querySelector("#txtCertificatePath").value = path;
+                        }
+
+                        picker.close();
                    },
                    header: globalize.translate("HeaderSelectCertificatePath")
-                })
-            })
                });
-
-        view.querySelector(".dashboardHostingForm").addEventListener("submit", onSubmit), view.addEventListener("viewshow", function(e) {
+            });
+        });
+        view.querySelector(".dashboardHostingForm").addEventListener("submit", onSubmit);
+        view.addEventListener("viewshow", function (e) {
            loading.show();
            ApiClient.getServerConfiguration().then(function (config) {
                loadPage(view, config);
            });
        });
-    }
+    };
 });
--- a/src/controllers/playback/videoosd.js
+++ b/src/controllers/playback/videoosd.js
@ -1,4 +1,4 @@
-define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "mediaInfo", "focusManager", "imageLoader", "scrollHelper", "events", "connectionManager", "browser", "globalize", "apphost", "layoutManager", "userSettings", "scrollStyles", "emby-slider", "paper-icon-button-light", "css!assets/css/videoosd"], function (playbackManager, dom, inputManager, datetime, itemHelper, mediaInfo, focusManager, imageLoader, scrollHelper, events, connectionManager, browser, globalize, appHost, layoutManager, userSettings) {
+define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "mediaInfo", "focusManager", "imageLoader", "scrollHelper", "events", "connectionManager", "browser", "globalize", "apphost", "layoutManager", "userSettings", "keyboardnavigation", "scrollStyles", "emby-slider", "paper-icon-button-light", "css!assets/css/videoosd"], function (playbackManager, dom, inputManager, datetime, itemHelper, mediaInfo, focusManager, imageLoader, scrollHelper, events, connectionManager, browser, globalize, appHost, layoutManager, userSettings, keyboardnavigation) {
    "use strict";

    function seriesImageUrl(item, options) {
@ -437,6 +437,11 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
                });
                currentVisibleMenu = null;
                toggleSubtitleSync("hide");
+
+                // Firefox does not blur by itself
+                if (document.activeElement) {
+                    document.activeElement.blur();
+                }
            }
        }

@ -1087,50 +1092,66 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
         */
        var NavigationKeys = ["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];

+        /**
+         * Clicked element.
+         * To skip 'click' handling on Firefox/Edge.
+         */
+        var clickedElement;
+
        function onWindowKeyDown(e) {
+            clickedElement = e.srcElement;
+
+            var key = keyboardnavigation.getKeyName(e);
+
            if (!currentVisibleMenu && 32 === e.keyCode) {
                playbackManager.playPause(currentPlayer);
                showOsd();
                return;
            }

-            if (layoutManager.tv && NavigationKeys.indexOf(e.key) != -1) {
+            if (layoutManager.tv && NavigationKeys.indexOf(key) != -1) {
                showOsd();
                return;
            }

-            switch (e.key) {
+            switch (key) {
+                case "Enter":
+                    showOsd();
+                    break;
+                case "Escape":
+                case "Back":
+                    // Ignore key when some dialog is opened
+                    if (currentVisibleMenu === "osd" && !document.querySelector(".dialogContainer")) {
+                        hideOsd();
+                        e.stopPropagation();
+                    }
+                    break;
                case "k":
                    playbackManager.playPause(currentPlayer);
                    showOsd();
                    break;
-
                case "l":
                case "ArrowRight":
                case "Right":
                    playbackManager.fastForward(currentPlayer);
                    showOsd();
                    break;
-
                case "j":
                case "ArrowLeft":
                case "Left":
                    playbackManager.rewind(currentPlayer);
                    showOsd();
                    break;
-
                case "f":
                    if (!e.ctrlKey && !e.metaKey) {
                        playbackManager.toggleFullscreen(currentPlayer);
                        showOsd();
                    }
                    break;
-
                case "m":
                    playbackManager.toggleMute(currentPlayer);
                    showOsd();
                    break;
-
                case "NavigationLeft":
                case "GamepadDPadLeft":
                case "GamepadLeftThumbstickLeft":
@ -1140,7 +1161,6 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
                        showOsd();
                    }
                    break;
-
                case "NavigationRight":
                case "GamepadDPadRight":
                case "GamepadLeftThumbstickRight":
@ -1152,6 +1172,14 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
            }
        }

+        function onWindowMouseDown(e) {
+            clickedElement = e.srcElement;
+        }
+
+        function onWindowTouchStart(e) {
+            clickedElement = e.srcElement;
+        }
+
        function getImgUrl(item, chapter, index, maxWidth, apiClient) {
            if (chapter.ImageTag) {
                return apiClient.getScaledImageUrl(item.Id, {
@ -1280,6 +1308,12 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
                showOsd();
                inputManager.on(window, onInputCommand);
                dom.addEventListener(window, "keydown", onWindowKeyDown, {
+                    capture: true
+                });
+                dom.addEventListener(window, window.PointerEvent ? "pointerdown" : "mousedown", onWindowMouseDown, {
+                    passive: true
+                });
+                dom.addEventListener(window, "touchstart", onWindowTouchStart, {
                    passive: true
                });
            } catch (e) {
@ -1294,6 +1328,12 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
            }

            dom.removeEventListener(window, "keydown", onWindowKeyDown, {
+                capture: true
+            });
+            dom.removeEventListener(window, window.PointerEvent ? "pointerdown" : "mousedown", onWindowMouseDown, {
+                passive: true
+            });
+            dom.removeEventListener(window, "touchstart", onWindowTouchStart, {
                passive: true
            });
            stopOsdHideTimer();
@ -1465,7 +1505,10 @@ define(["playbackManager", "dom", "inputManager", "datetime", "itemHelper", "med
            playbackManager.previousTrack(currentPlayer);
        });
        view.querySelector(".btnPause").addEventListener("click", function () {
+            // Ignore 'click' if another element was originally clicked (Firefox/Edge issue)
+            if (this.contains(clickedElement)) {
                playbackManager.playPause(currentPlayer);
+            }
        });
        view.querySelector(".btnNextTrack").addEventListener("click", function () {
            playbackManager.nextTrack(currentPlayer);
--- a/src/controllers/user/display.js
+++ b/src/controllers/user/display.js
@ -1,4 +1,4 @@
-define(["displaySettings", "userSettingsBuilder", "userSettings", "autoFocuser"], function (DisplaySettings, userSettingsBuilder, currentUserSettings, autoFocuser) {
+define(["displaySettings", "userSettings", "autoFocuser"], function (DisplaySettings, currentUserSettings, autoFocuser) {
    "use strict";

    return function (view, params) {
@ -11,7 +11,7 @@ define(["displaySettings", "userSettingsBuilder", "userSettings", "autoFocuser"]
        var settingsInstance;
        var hasChanges;
        var userId = params.userId || ApiClient.getCurrentUserId();
-        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettingsBuilder();
+        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettings();
        view.addEventListener("viewshow", function () {
            window.addEventListener("beforeunload", onBeforeUnload);

--- a/src/controllers/user/home.js
+++ b/src/controllers/user/home.js
@ -1,4 +1,4 @@
-define(["homescreenSettings", "userSettingsBuilder", "dom", "globalize", "loading", "userSettings", "autoFocuser", "listViewStyle"], function (HomescreenSettings, userSettingsBuilder, dom, globalize, loading, currentUserSettings, autoFocuser) {
+define(["homescreenSettings", "dom", "globalize", "loading", "userSettings", "autoFocuser", "listViewStyle"], function (HomescreenSettings, dom, globalize, loading, currentUserSettings, autoFocuser) {
    "use strict";

    return function (view, params) {
@ -11,7 +11,7 @@ define(["homescreenSettings", "userSettingsBuilder", "dom", "globalize", "loadin
        var homescreenSettingsInstance;
        var hasChanges;
        var userId = params.userId || ApiClient.getCurrentUserId();
-        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettingsBuilder();
+        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettings();
        view.addEventListener("viewshow", function () {
            window.addEventListener("beforeunload", onBeforeUnload);

--- a/src/controllers/user/playback.js
+++ b/src/controllers/user/playback.js
@ -1,4 +1,4 @@
-define(["playbackSettings", "userSettingsBuilder", "dom", "globalize", "loading", "userSettings", "autoFocuser", "listViewStyle"], function (PlaybackSettings, userSettingsBuilder, dom, globalize, loading, currentUserSettings, autoFocuser) {
+define(["playbackSettings", "dom", "globalize", "loading", "userSettings", "autoFocuser", "listViewStyle"], function (PlaybackSettings, dom, globalize, loading, currentUserSettings, autoFocuser) {
    "use strict";

    return function (view, params) {
@ -11,7 +11,7 @@ define(["playbackSettings", "userSettingsBuilder", "dom", "globalize", "loading"
        var settingsInstance;
        var hasChanges;
        var userId = params.userId || ApiClient.getCurrentUserId();
-        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettingsBuilder();
+        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettings();
        view.addEventListener("viewshow", function () {
            window.addEventListener("beforeunload", onBeforeUnload);

--- a/src/controllers/user/subtitles.js
+++ b/src/controllers/user/subtitles.js
@ -1,4 +1,4 @@
-define(["subtitleSettings", "userSettingsBuilder", "userSettings", "autoFocuser"], function (SubtitleSettings, userSettingsBuilder, currentUserSettings, autoFocuser) {
+define(["subtitleSettings", "userSettings", "autoFocuser"], function (SubtitleSettings, currentUserSettings, autoFocuser) {
    "use strict";

    return function (view, params) {
@ -11,7 +11,7 @@ define(["subtitleSettings", "userSettingsBuilder", "userSettings", "autoFocuser"
        var subtitleSettingsInstance;
        var hasChanges;
        var userId = params.userId || ApiClient.getCurrentUserId();
-        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettingsBuilder();
+        var userSettings = userId === ApiClient.getCurrentUserId() ? currentUserSettings : new userSettings();
        view.addEventListener("viewshow", function () {
            window.addEventListener("beforeunload", onBeforeUnload);

--- a/src/dashboardgeneral.html
+++ b/src/dashboardgeneral.html
@ -56,21 +56,6 @@
                    </div>
                </div>

-                <div class="verticalSection autoUpdatesContainer hide">
-                    <h2>${HeaderAutomaticUpdates}</h2>
-                    <label class="fldAutomaticUpdates checkboxContainer">
-                        <input is="emby-checkbox" type="checkbox" id="chkEnableAutomaticServerUpdates" />
-                        <span>${OptionEnableAutomaticServerUpdates}</span>
-                    </label>
-                    <div id="fldEnableAutomaticRestart" class="checkboxContainer checkboxContainer-withDescription hide">
-                        <label>
-                            <input is="emby-checkbox" type="checkbox" id="chkEnableAutomaticRestart" />
-                            <span>${LabelAllowServerAutoRestart}</span>
-                        </label>
-                        <div class="fieldDescription checkboxFieldDescription">${LabelAllowServerAutoRestartHelp}</div>
-                    </div>
-                </div>
-
                <div class="verticalSection">
                    <h2>${HeaderBranding}</h2>
                    <div class="inputContainer">
--- a/src/elements/emby-button/emby-button.css
+++ b/src/elements/emby-button/emby-button.css
@ -8,6 +8,9 @@
    font-size: inherit;
    font-family: inherit;
    color: inherit;
+
+    /* These are getting an outline in opera tv browsers, which run chrome 30 */
+    outline: none !important;
    outline-width: 0;
    -moz-user-select: none;
    -ms-user-select: none;
@ -18,15 +21,13 @@
    padding: 0.9em 1em;
    vertical-align: middle;
    border: 0;
-    vertical-align: middle;
    border-radius: 0.2em;
-    /* These are getting an outline in opera tv browsers, which run chrome 30 */
-    outline: none !important;
-    position: relative;
    font-weight: 600;
+
    /* Disable webkit tap highlighting */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    text-decoration: none;
+
    /* Not crazy about this but it normalizes heights between anchors and buttons */
    line-height: 1.35;
    transform-origin: center;
@ -47,7 +48,7 @@
 }

 .button-flat:hover {
-    opacity: .5;
+    opacity: 0.5;
 }

 .button-link {
@ -84,7 +85,7 @@
    display: block;
    align-items: center;
    justify-content: center;
-    margin: .25em 0;
+    margin: 0.25em 0;
    width: 100%;
 }

@ -93,7 +94,7 @@
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
-    margin: 0 .29em;
+    margin: 0 0.29em;
    background: transparent;
    text-align: center;
    font-size: inherit;
@ -109,15 +110,15 @@
    min-height: initial;
    width: auto;
    height: auto;
-    padding: .556em;
+    padding: 0.556em;
    vertical-align: middle;
    border: 0;
-    vertical-align: middle;
+
    /* These are getting an outline in opera tv browsers, which run chrome 30 */
    outline: none !important;
-    position: relative;
    overflow: hidden;
    border-radius: 50%;
+
    /* Disable webkit tap highlighting */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    justify-content: center;
@ -141,6 +142,7 @@

 .paper-icon-button-light > i {
    font-size: 1.66956521739130434em;
+
    /* Make sure its on top of the ripple */
    position: relative;
    z-index: 1;
@ -169,7 +171,6 @@
 .filterButtonBubble {
    color: #fff;
    position: absolute;
-    background: #444;
    top: 0;
    right: 0;
    width: 1.6em;
@ -180,7 +181,7 @@
    justify-content: center;
    font-size: 82%;
    border-radius: 100em;
-    box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px -1px rgba(0, 0, 0, 0.2);
-    background: #03A9F4;
+    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
+    background: #03a9f4;
    font-weight: bold;
 }
--- a/src/elements/emby-checkbox/emby-checkbox.css
+++ b/src/elements/emby-checkbox/emby-checkbox.css
@ -32,6 +32,7 @@

 .emby-checkbox {
    position: absolute;
+
    /* This is for focusing purposes, so the focusManager doesn't skip over it */
    width: 1px;
    height: 1px;
@ -49,14 +50,13 @@
    position: absolute;
    top: 3px;
    left: 0;
-    display: inline-block;
    box-sizing: border-box;
    width: 1.83em;
    height: 1.83em;
    margin: 0;
    overflow: hidden;
    border: 2px solid currentcolor;
-    border-radius: .14em;
+    border-radius: 0.14em;
    z-index: 2;
    display: flex;
    align-items: center;
@ -103,7 +103,7 @@

 .checkboxList-verticalwrap > .emby-checkbox-label {
    display: inline-flex;
-        margin: .3em 0 .3em 0;
+    margin: 0.3em 0 0.3em 0;
    width: 12em;
 }

@ -112,7 +112,7 @@
 }

 .checkboxListLabel {
-    margin-bottom: .25em;
+    margin-bottom: 0.25em;
 }

@keyframes repaintChrome {
--- a/src/elements/emby-collapse/emby-collapse.css
+++ b/src/elements/emby-collapse/emby-collapse.css
@ -1,5 +1,5 @@
 .emby-collapse {
-    margin: .5em 0;
+    margin: 0.5em 0;
 }

 .collapseContent {
@ -18,10 +18,9 @@
    text-transform: none;
    width: 100%;
    text-align: left;
-    text-transform: none;
-    border-width: 0 0 .1em 0;
+    border-width: 0 0 0.1em 0;
    border-style: solid;
-    padding-left: .1em;
+    padding-left: 0.1em;
    background: transparent;
    box-shadow: none;
 }
@ -30,7 +29,7 @@
    transform-origin: 50% 50%;
    transition: transform 180ms ease-out;
    position: absolute;
-    right: .5em;
+    right: 0.5em;
    font-size: 1.5em;
 }

--- a/src/elements/emby-input/emby-input.css
+++ b/src/elements/emby-input/emby-input.css
@ -2,14 +2,14 @@
    display: block;
    margin: 0;
    margin-bottom: 0 !important;
-    /* Remove select styling */
-    /* Font size must the 16px or larger to prevent iOS page zoom on focus */
-    font-size: 110%;
-    /* General select styles: change as needed */
    font-family: inherit;
    font-weight: inherit;
-    padding: .4em .25em;
-    /* Prevent padding from causing width overflow */
+    padding: 0.4em 0.25em;
+
+    /* must the 16px or larger to prevent iOS page zoom on focus */
+    font-size: 110%;
+
+    /* prevent padding from causing width overflow */
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: none !important;
@ -21,17 +21,21 @@
    border: 0;
 }

+.emby-input:required { 
+    box-shadow: none; 
+}
+
 .inputContainer {
    margin-bottom: 1.8em;
 }

 .inputLabel {
    display: inline-block;
-    margin-bottom: .25em;
+    margin-bottom: 0.25em;
 }

 .emby-input + .fieldDescription {
-    margin-top: .25em;
+    margin-top: 0.25em;
 }

 .emby-input-iconbutton {
--- a/src/elements/emby-progressring/emby-progressring.css
+++ b/src/elements/emby-progressring/emby-progressring.css
@ -11,9 +11,9 @@
    width: 100%;
    height: 100%;
    border-radius: 50%;
-    border: .25em solid rgba(0, 0, 0, 1);
+    border: 0.25em solid rgba(0, 0, 0, 1);
    box-sizing: border-box;
-    background: rgba(0, 0, 0, .9);
+    background: rgba(0, 0, 0, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
@ -51,7 +51,7 @@
    width: 200%;
    height: 200%;
    border-radius: 50%;
-    border-width: .25em;
+    border-width: 0.25em;
    border-style: solid;
    box-sizing: border-box;
 }
--- a/src/elements/emby-radio/emby-radio.css
+++ b/src/elements/emby-radio/emby-radio.css
@ -4,23 +4,20 @@
    display: inline-block;
    box-sizing: border-box;
    margin: 0;
-    padding-left: 0;
+    padding-left: 24px;
 }

 .radio-label-block {
    display: flex;
    align-items: center;
-    margin-top: .5em;
-    margin-bottom: .5em;
-}
-
-.mdl-radio {
-    padding-left: 24px;
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
 }

 .mdl-radio__button {
    line-height: 24px;
    position: absolute;
+
    /* 1px is for focusing purposes, so the focusManager doesn't skip over it */
    width: 1px;
    height: 1px;
@ -90,11 +87,11 @@
 }

 .mdl-radio__button:focus + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle {
-    box-shadow: 0 0 0px 10px rgba(255, 255, 255, 0.76);
+    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.76);
 }

 .mdl-radio__button:checked:focus + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle {
-    box-shadow: 0 0 0 10px rgba(0, 164, 220, 0.26)
+    box-shadow: 0 0 0 10px rgba(0, 164, 220, 0.26);
 }

 .mdl-radio__label {
--- a/src/elements/emby-select/emby-select.css
+++ b/src/elements/emby-select/emby-select.css
@ -2,13 +2,17 @@
    display: block;
    margin: 0;
    margin-bottom: 0 !important;
+
    /* Remove select styling */
+
    /* Font size must the 16px or larger to prevent iOS page zoom on focus */
    font-size: 110%;
+
    /* General select styles: change as needed */
    font-family: inherit;
    font-weight: inherit;
-    padding: .5em 1.9em .5em .5em;
+    padding: 0.5em 1.9em 0.5em 0.5em;
+
    /* Prevent padding from causing width overflow */
    box-sizing: border-box;
    outline: none !important;
@ -25,8 +29,12 @@
    appearance: none;
 }

+.emby-select::-moz-focus-inner {
+    border: 0;
+}
+
 .selectContainer-inline > .emby-select {
-    padding: .3em 1.9em .3em .5em;
+    padding: 0.3em 1.9em 0.3em 0.5em;
    font-size: inherit;
 }

@ -35,10 +43,6 @@
    padding-right: 0;
 }

-.emby-select::-moz-focus-inner {
-    border: 0;
-}
-
 .emby-select-focusscale {
    transition: transform 180ms ease-out !important;
    -webkit-transform-origin: center center;
@ -51,7 +55,7 @@
 }

 .emby-select + .fieldDescription {
-    margin-top: .25em;
+    margin-top: 0.25em;
 }

 .selectContainer {
@ -67,32 +71,32 @@

 .selectLabel {
    display: block;
-    margin-bottom: .25em;
+    margin-bottom: 0.25em;
 }

 .selectContainer-inline > .selectLabel {
    margin-bottom: 0;
-    margin-right: .5em;
+    margin-right: 0.5em;
    flex-shrink: 0;
 }

 .emby-select-withcolor {
    -webkit-appearance: none;
    appearance: none;
-    border-radius: .2em;
+    border-radius: 0.2em;
 }

 .selectArrowContainer {
    position: absolute;
-    right: .3em;
-    top: .2em;
+    right: 0.3em;
+    top: 0.2em;
    color: inherit;
    pointer-events: none;
 }

 .selectContainer-inline > .selectArrowContainer {
    top: initial;
-    bottom: .24em;
+    bottom: 0.24em;
    font-size: 90%;
 }

@ -101,7 +105,7 @@
 }

 .selectArrow {
-    margin-top: .35em;
+    margin-top: 0.35em;
    font-size: 1.7em;
 }

--- a/src/elements/emby-slider/emby-slider.css
+++ b/src/elements/emby-slider/emby-slider.css
@ -1,4 +1,4 @@
-_:-ms-input-placeholder {
+:-ms-input-placeholder {
    appearance: none;
    -ms-appearance: none;
    height: 2.223em;
@ -25,6 +25,7 @@ _:-ms-input-placeholder {
    z-index: 1;
    cursor: pointer;
    margin: 0;
+
    /* Disable webkit tap highlighting */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    display: block;
@ -56,7 +57,7 @@ _:-ms-input-placeholder {
 .mdl-slider::-ms-track {
    background: none;
    color: transparent;
-        height: .2em;
+    height: 0.2em;
    width: 100%;
    border: none;
 }
@ -102,10 +103,10 @@ _:-ms-input-placeholder {
    height: 0.9em;
    box-sizing: border-box;
    border-radius: 50%;
-    background-image: none;
    background: #00a4dc;
+    background-image: none;
    border: none;
-    transform: Scale(1.4, 1.4);
+    transform: scale(1.4, 1.4);
 }

 .mdl-slider::-ms-thumb {
@ -116,13 +117,13 @@ _:-ms-input-placeholder {
    border-radius: 50%;
    background: #00a4dc;
    border: none;
-    transform: scale(.9, .9);
+    transform: scale(0.9, 0.9);
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
 }

 .mdl-slider-hoverthumb::-ms-thumb {
-    margin-left: -.4em;
-    transform: scale(.5, .5);
+    margin-left: -0.4em;
+    transform: scale(0.5, 0.5);
 }

 .mdl-slider:hover::-ms-thumb {
@ -160,15 +161,15 @@ _:-ms-input-placeholder {
 .mdl-slider-background-flex-container {
    width: 100%;
    box-sizing: border-box;
-    margin-top: -.05em;
+    margin-top: -0.05em;
    top: 50%;
    position: absolute;
 }

 .mdl-slider-background-flex {
    background: #333;
-    height: .2em;
-    margin-top: -.08em;
+    height: 0.2em;
+    margin-top: -0.08em;
    width: 100%;
    top: 50%;
    left: 0;
@ -199,6 +200,7 @@ _:-ms-input-placeholder {

 .mdl-slider-background-lower-withtransform {
    width: 100%;
+
    /* transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1); */
    transform-origin: left center;
    transform: scaleX(0);
@ -207,7 +209,7 @@ _:-ms-input-placeholder {
 .mdl-slider-background-upper {
    /* transition: left 0.18s cubic-bezier(0.4, 0, 0.2, 1), width 0.18s cubic-bezier(0.4, 0, 0.2, 1); */
    background: #666;
-    background: rgba(255, 255, 255, .4);
+    background: rgba(255, 255, 255, 0.4);
    position: absolute;
    left: 0;
    width: 0;
@ -229,5 +231,5 @@ _:-ms-input-placeholder {

 .sliderBubbleText {
    margin: 0;
-    padding: .5em .75em;
+    padding: 0.5em 0.75em;
 }
--- a/src/elements/emby-slider/emby-slider.js
+++ b/src/elements/emby-slider/emby-slider.js
@ -1,4 +1,4 @@
-define(['browser', 'dom', 'layoutManager', 'css!./emby-slider', 'registerElement', 'emby-input'], function (browser, dom, layoutManager) {
+define(['browser', 'dom', 'layoutManager', 'keyboardnavigation', 'css!./emby-slider', 'registerElement', 'emby-input'], function (browser, dom, layoutManager, keyboardnavigation) {
    'use strict';

    var EmbySliderPrototype = Object.create(HTMLInputElement.prototype);
@ -250,7 +250,7 @@ define(['browser', 'dom', 'layoutManager', 'css!./emby-slider', 'registerElement
     * Handle KeyDown event
     */
    function onKeyDown(e) {
-        switch (e.key) {
+        switch (keyboardnavigation.getKeyName(e)) {
            case 'ArrowLeft':
            case 'Left':
                stepKeyboard(this, -this.keyboardStepDown || -1);
--- a/src/elements/emby-textarea/emby-textarea.css
+++ b/src/elements/emby-textarea/emby-textarea.css
@ -2,14 +2,18 @@
    display: block;
    margin: 0;
    margin-bottom: 0 !important;
+
    /* Remove select styling */
+
    /* Font size must the 16px or larger to prevent iOS page zoom on focus */
    font-size: inherit;
+
    /* General select styles: change as needed */
    font-family: inherit;
    font-weight: inherit;
    color: inherit;
-    padding: .35em .25em;
+    padding: 0.35em 0.25em;
+
    /* Prevent padding from causing width overflow */
    box-sizing: border-box;
    outline: none !important;
@ -23,10 +27,10 @@

 .textareaLabel {
    display: inline-block;
-    transition: all .2s ease-out;
-    margin-bottom: .25em;
+    transition: all 0.2s ease-out;
+    margin-bottom: 0.25em;
 }

 .emby-textarea + .fieldDescription {
-    margin-top: .25em;
+    margin-top: 0.25em;
 }
--- a/src/elements/emby-toggle/emby-toggle.css
+++ b/src/elements/emby-toggle/emby-toggle.css
@ -60,7 +60,7 @@
    background: #999;
    position: absolute;
    left: 0;
-    top: -.25em;
+    top: -0.25em;
    height: 1.44em;
    width: 1.44em;
    border-radius: 50%;
@ -77,7 +77,7 @@
 .mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb {
    background: #00a4dc;
    left: 1.466em;
-    box-shadow: 0 3px 0.28em 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px .56em 0 rgba(0, 0, 0, 0.12);
+    box-shadow: 0 3px 0.28em 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 0.56em 0 rgba(0, 0, 0, 0.12);
 }

 .mdl-switch__input[disabled] + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb {
@ -93,14 +93,14 @@
    transform: translate(-50%, -50%);
    display: inline-block;
    box-sizing: border-box;
-    width: .6em;
-    height: .6em;
+    width: 0.6em;
+    height: 0.6em;
    border-radius: 50%;
    background-color: transparent;
 }

 .mdl-switch__input:focus + .mdl-switch__label + .mdl-switch__trackContainer .mdl-switch__focus-helper {
-    box-shadow: 0 0 0 1.39em rgba(0, 0, 0, .05);
+    box-shadow: 0 0 0 1.39em rgba(0, 0, 0, 0.05);
 }

 .mdl-switch__input:checked:focus + .mdl-switch__label + .mdl-switch__trackContainer .mdl-switch__focus-helper {
@ -113,7 +113,7 @@
    margin: 0;
    display: inline-flex;
    align-items: center;
-    margin-left: .7em;
+    margin-left: 0.7em;
 }

 .mdl-switch__input[disabled] .mdl-switch__label {
--- a/src/scripts/inputManager.js
+++ b/src/scripts/inputManager.js
@ -22,9 +22,7 @@ define(['playbackManager', 'focusManager', 'appRouter', 'dom'], function (playba

    var eventListenerCount = 0;
    function on(scope, fn) {
-        if (eventListenerCount) {
        eventListenerCount++;
-        }
        dom.addEventListener(scope, 'command', fn, {});
    }

--- a/src/scripts/librarymenu.js
+++ b/src/scripts/librarymenu.js
@ -1,6 +1,38 @@
 define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "viewManager", "libraryBrowser", "appRouter", "apphost", "playbackManager", "browser", "globalize", "scripts/imagehelper", "paper-icon-button-light", "material-icons", "scrollStyles", "flexStyles"], function (dom, layoutManager, inputManager, connectionManager, events, viewManager, libraryBrowser, appRouter, appHost, playbackManager, browser, globalize, imageHelper) {
    "use strict";

+    function renderHeader() {
+        var html = "";
+        html += '<div class="flex align-items-center flex-grow headerTop">';
+        html += '<div class="headerLeft">';
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonLeft headerBackButton hide"><i class="material-icons">' + (browser.safari ? "chevron_left" : "arrow_back") + "</i></button>";
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerHomeButton hide barsMenuButton headerButtonLeft"><i class="material-icons">home</i></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton mainDrawerButton barsMenuButton headerButtonLeft hide"><i class="material-icons">menu</i></button>';
+        html += '<h3 class="pageTitle"></h3>';
+        html += "</div>";
+        html += '<div class="headerRight">';
+        html += '<span class="headerSelectedPlayer"></span>';
+        html += '<button is="paper-icon-button-light" class="headerCastButton castButton headerButton headerButtonRight hide"><i class="material-icons">cast</i></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonRight headerSearchButton hide"><i class="material-icons">search</i></button>';
+        html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerUserButton hide"><i class="material-icons">person</i></button>';
+        html += "</div>";
+        html += "</div>";
+        html += '<div class="headerTabs sectionTabs hide">';
+        html += "</div>";
+
+        skinHeader.classList.add("skinHeader-withBackground");
+        skinHeader.classList.add("skinHeader-blurred");
+        skinHeader.innerHTML = html;
+
+        headerHomeButton = skinHeader.querySelector(".headerHomeButton");
+        headerUserButton = skinHeader.querySelector(".headerUserButton");
+        headerCastButton = skinHeader.querySelector(".headerCastButton");
+        headerSearchButton = skinHeader.querySelector(".headerSearchButton");
+
+        lazyLoadViewMenuBarImages();
+        bindMenuEvents();
+    }
+
    function getCurrentApiClient() {
        if (currentUser && currentUser.localUser) {
            return connectionManager.getApiClient(currentUser.localUser.ServerId);
@ -840,37 +872,7 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", "
        updateLibraryNavLinks(page);
    });

-    (function () {
-        var html = "";
-        html += '<div class="flex align-items-center flex-grow headerTop">';
-        html += '<div class="headerLeft">';
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonLeft headerBackButton hide"><i class="material-icons">' + (browser.safari ? "chevron_left" : "arrow_back") + "</i></button>";
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerHomeButton hide barsMenuButton headerButtonLeft"><i class="material-icons">home</i></button>';
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton mainDrawerButton barsMenuButton headerButtonLeft hide"><i class="material-icons">menu</i></button>';
-        html += '<h3 class="pageTitle"></h3>';
-        html += "</div>";
-        html += '<div class="headerRight">';
-        html += '<span class="headerSelectedPlayer"></span>';
-        html += '<button is="paper-icon-button-light" class="headerCastButton castButton headerButton headerButtonRight hide"><i class="material-icons">cast</i></button>';
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonRight headerSearchButton hide"><i class="material-icons">search</i></button>';
-        html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerUserButton hide"><i class="material-icons">person</i></button>';
-        html += "</div>";
-        html += "</div>";
-        html += '<div class="headerTabs sectionTabs hide">';
-        html += "</div>";
-
-        skinHeader.classList.add("skinHeader-withBackground");
-        skinHeader.classList.add("skinHeader-blurred");
-        skinHeader.innerHTML = html;
-
-        headerHomeButton = skinHeader.querySelector(".headerHomeButton");
-        headerUserButton = skinHeader.querySelector(".headerUserButton");
-        headerCastButton = skinHeader.querySelector(".headerCastButton");
-        headerSearchButton = skinHeader.querySelector(".headerSearchButton");
-
-        lazyLoadViewMenuBarImages();
-        bindMenuEvents();
-    })();
+    renderHeader();

    events.on(connectionManager, "localusersignedin", function (e, user) {
        currentDrawerType = null;
--- a/src/scripts/settings/appSettings.js
+++ b/src/scripts/settings/appSettings.js
@ -10,13 +10,13 @@ define(['appStorage', 'events'], function (appStorage, events) {
    }

    function AppSettings() {
-
    }

    AppSettings.prototype.enableAutoLogin = function (val) {
        if (val != null) {
            this.set('enableAutoLogin', val.toString());
        }
+
        return this.get('enableAutoLogin') !== 'false';
    };

--- a/src/components/usersettings/usersettingsbuilder.js
+++ b/src/components/usersettings/usersettingsbuilder.js
@ -242,5 +242,5 @@ define(['appSettings', 'events'], function (appSettings, events) {
        return this.get(key, true);
    };

-    return UserSettings;
+    return new UserSettings();
 });
--- a/src/scripts/site.js
+++ b/src/scripts/site.js
@ -315,6 +315,14 @@ var AppInfo = {};
        return "components";
    }

+    function getElementsPath() {
+        return "elements"
+    }
+
+    function getScriptsPath() {
+        return "scripts"
+    }
+
    function getPlaybackManager(playbackManager) {
        window.addEventListener("beforeunload", function () {
            try {
@ -650,8 +658,12 @@ var AppInfo = {};

    (function () {
        var urlArgs = "v=" + (window.dashboardVersion || new Date().getDate());
+
        var bowerPath = getBowerPath();
        var componentsPath = getComponentsPath();
+        var elementsPath = getElementsPath();
+        var scriptsPath = getScriptsPath();
+
        var paths = {
            browserdeviceprofile: "scripts/browserdeviceprofile",
            browser: "scripts/browser",
@ -672,7 +684,6 @@ var AppInfo = {};
            itemHelper: componentsPath + "/itemhelper",
            itemShortcuts: componentsPath + "/shortcuts",
            playQueueManager: componentsPath + "/playback/playqueuemanager",
-            autoPlayDetect: componentsPath + "/playback/autoplaydetect",
            nowPlayingHelper: componentsPath + "/playback/nowplayinghelper",
            pluginManager: componentsPath + "/pluginManager",
            packageManager: componentsPath + "/packagemanager",
@ -765,7 +776,6 @@ var AppInfo = {};
            return queryString;
        });

-        var elementsPath = "elements"
        define("emby-button", [elementsPath + "/emby-button/emby-button"], returnFirstDependency);
        define("paper-icon-button-light", [elementsPath + "/emby-button/paper-icon-button-light"], returnFirstDependency);
        define("emby-checkbox", [elementsPath + "/emby-checkbox/emby-checkbox"], returnFirstDependency);
@ -778,6 +788,9 @@ var AppInfo = {};
        define("emby-textarea", [elementsPath + "/emby-textarea/emby-textarea"], returnFirstDependency);
        define("emby-toggle", [elementsPath + "/emby-toggle/emby-toggle"], returnFirstDependency);

+        define("appSettings", [scriptsPath + "/settings/appSettings"], returnFirstDependency);
+        define("userSettings", [scriptsPath + "/settings/userSettings"], returnFirstDependency);
+
        define("chromecastHelper", [componentsPath + "/chromecast/chromecasthelpers"], returnFirstDependency);
        define("mediaSession", [componentsPath + "/playback/mediasession"], returnFirstDependency);
        define("actionsheet", [componentsPath + "/actionsheet/actionsheet"], returnFirstDependency);
@ -865,9 +878,6 @@ var AppInfo = {};
        define("toast", [componentsPath + "/toast/toast"], returnFirstDependency);
        define("scrollHelper", [componentsPath + "/scrollhelper"], returnFirstDependency);
        define("touchHelper", [componentsPath + "/touchhelper"], returnFirstDependency);
-        define("appSettings", [componentsPath + "/appSettings"], returnFirstDependency);
-        define("userSettings", [componentsPath + "/usersettings/usersettings"], returnFirstDependency);
-        define("userSettingsBuilder", [componentsPath + "/usersettings/usersettingsbuilder", "layoutManager", "browser"], returnFirstDependency);
        define("imageUploader", [componentsPath + "/imageuploader/imageuploader"], returnFirstDependency);
        define("htmlMediaHelper", [componentsPath + "/htmlMediaHelper"], returnFirstDependency);
        define("viewContainer", [componentsPath + "/viewContainer"], returnFirstDependency);
--- a/src/strings/ar.json
+++ b/src/strings/ar.json
@ -92,7 +92,7 @@
    "CinemaModeConfigurationHelp": "الطور السينمائي يوفر أجواء سينمائية إلى قلب صالتك مع إمكانية تشغيل عروض إعلانية لأفلام أخرى وعرض مقدمات أخرى من انتقاءاتك قبل تشغيل الفيلم الرئيسي.",
    "CustomDlnaProfilesHelp": "إنشاء عرائض مخصوصه تستهدف جهازاً جديداً أو يمتطي حساباً نظامياً.",
    "DeathDateValue": "توفي: {0}",
-    "DefaultErrorMessage": "كان هناك خطأ في معالجة الطلب. الرجاء المحاولة لاحقاً",
+    "DefaultErrorMessage": "كان هناك خطأ في معالجة الطلب. الرجاء المحاولة لاحقاً.",
    "Delete": "حذف",
    "DeleteDeviceConfirmation": "هل أنت متأكد أنك تريد حذف هذا الجهاز؟ سيظهر الجهاز من جديد في المرة القادمة التي يسجل فها مستخدم دخوله عبره.",
    "DeleteImage": "حذف صورة",
@ -103,13 +103,13 @@
    "DeviceAccessHelp": "هذه الميزة تنطبق حصرياً على الأجهزة التي يمكن التعرف عليها فردياً ولن تمنع المتصفح من الدخول عليها. ترشيح الوصول لأجهزة المستخدم ستمنع المستخدمين من استعمال الأجهزة الجديدة إلى أن يتم اعتمادهم من هنا.",
    "DrmChannelsNotImported": "القنوات المجهزة بإدارة الحقوق الرقمية DRM لن تورّد.",
    "EasyPasswordHelp": "الرمز الشخصي الميسرالخاص بك يمكنك من الاتصال إلى خادم مكتبتك، عبر تطبيقات أمبي على الأجهزة أو الدخول على حسابك في الشبكة الداخلية.",
-    "EnablePhotos": "تفعيل الصور",
+    "EnablePhotos": "عرض الصور",
    "EnablePhotosHelp": "سيتم اكتشاف الصور وعرضها مع ملفات الوسائط الأخرى",
    "ErrorAddingListingsToSchedulesDirect": "كان هناك خطأ في إضافة الاصطفاف لخدمة \"Schedules Direct\" الخاصة بك. خدمة \"Schedules Direct\" لا تسمح إلا بعدد محدود من الاصطفافات لكل حساب. قد تحتاج إلى تسجيل الدخول إلى موقع \"Schedules Direct\" لإزالة الاصطفافات الأخرى من حسابك قبل المتابعة.",
    "ErrorAddingMediaPathToVirtualFolder": "كان هناك خطأ في إضافة مسار الوسائط. الرجاء التأكد من صحة المسار وأن خادم أمبي لديه صلاحية الوصول إلى الموقع.",
    "ErrorAddingTunerDevice": "كان هناك خطأ في إضافة جهاز المولف. الرجاء التأكد من صلاحية الوصول إليه ثم عاود المحاولة.",
-    "ErrorAddingXmlTvFile": "كان هناك خطأ في محاولة الوصول إلى ملف XmlTV . الرجاء التأكد من وجود الملف ثم حاول مرة أخرى.",
-    "ErrorGettingTvLineups": "كان هناك خطأ في إنزال اصطفافات التلفزة. الرجاء التأكد من أن بياناتك صحيحة ثم عاود المحاولة.",
+    "ErrorAddingXmlTvFile": "كان هناك خطأ في محاولة الوصول إلى ملف XMLTV. الرجاء التأكد من وجود الملف ثم حاول مرة أخرى.",
+    "ErrorGettingTvLineups": "كان هناك خطأ في إنزال اصطفافات التلفاز. الرجاء التأكد من أن بياناتك صحيحة ثم عاود المحاولة.",
    "ErrorMessageStartHourGreaterThanEnd": "وقت النهاية يجب أن يكون أكبر من وقت البداية.",
    "ErrorPleaseSelectLineup": "الرجاء اختيار اصطفاف ثم المحاولة مرة أخرى. إن لم تتوفر أية اصطفافات، فالرجاء التأكد من اسم المستخدم وكلمة المرور الخاصة بك، وتأكد من صحة رمزك البريدي.",
    "ErrorSavingTvProvider": "كان هناك خطأ في حفظ مزود التلفزة. الرجاء التأكد من صلاحية الوصول إليه ثم عاود المحاولة.",
@ -195,7 +195,7 @@
    "HeaderGuideProviders": "مزودو الأدلة",
    "HeaderHttpHeaders": "رؤوس http",
    "HeaderIdentification": "التعريفة",
-    "HeaderIdentificationCriteriaHelp": "أدخل على الأقل معيار واحد للتعريف",
+    "HeaderIdentificationCriteriaHelp": "أدخل على الأقل معيار واحد للتعريف.",
    "HeaderIdentificationHeader": "رأس التعريفة",
    "HeaderImageOptions": "خيارات الصورة",
    "HeaderImageSettings": "إعدادات الصورة",
@ -699,7 +699,6 @@
    "OptionEnableAccessFromAllDevices": "تفعيل الدخول على كافة الأجهزة",
    "OptionEnableAccessToAllChannels": "تفعيل الدخول على كافة القنوات",
    "OptionEnableAccessToAllLibraries": "تمكين الدخول على كافة المكتبات",
-    "OptionEnableAutomaticServerUpdates": "تمكين التحديثات الآلية في الخادم",
    "OptionEnableExternalContentInSuggestions": "تمكين المحتوى الخارجي في المقترحات",
    "OptionEnableExternalContentInSuggestionsHelp": "السماح للعروض الإعلانية من الإنترنت وبرامج بث التلفزة الحي لتضمّن في المحتوى المقترح.",
    "OptionEnableForAllTuners": "تمكين كل أجهزة المولفات",
@ -947,7 +946,7 @@
    "AuthProviderHelp": "حدد مقدم المصادقات ليتم استخدامه لمصادقة كلمة مرور هذا المستخدم.",
    "AroundTime": "حول",
    "AttributeNew": "جديد",
-    "AspectRatio": "نسبة العرض على الارتفاع",
+    "AspectRatio": "نسبة العرض الى الارتفاع",
    "Ascending": "تصاعدي",
    "AsManyAsPossible": "أكبر عدد ممكن",
    "Artists": "الفنان",
@ -958,7 +957,7 @@
    "AlwaysPlaySubtitles": "شغل الترجمة دائماً",
    "AllowedRemoteAddressesHelp": "قائمة لعناوين IP أو إدخالات IP / قناع الشبكة مفصولة بفاصلة للشبكات التي سيتم السماح لها بالاتصال عن بعد. إذا تركت فارغة ، فسيتم السماح بجميع العناوين البعيدة.",
    "AllowOnTheFlySubtitleExtractionHelp": "يمكن استخراج الترجمات المدمجة في الفيديو وعرضها على المشاهد بنص عادي للمساعدة في منع تحويل الفيديو. ولكن في بعض الأنظمة ، قد يستغرق هذا وقتًا طويلًا ويتسبب في توقف تشغيل الفيديو أثناء عملية الاستخراج. قم بتعطيل هذا الأمر ليتم حرق ترجمات مضمّنة مع تحويل الفيديو عندما لا تكون معتمدة من قبل الجهاز العميل.",
-    "AllowOnTheFlySubtitleExtraction": "السماح بإستخراج الترجمه في الحال.",
+    "AllowOnTheFlySubtitleExtraction": "السماح بإستخراج الترجمه في الحال",
    "AllowMediaConversionHelp": "السماح او عدم السماح بالوصول لخاصية تحويل الوسائط.",
    "AllowMediaConversion": "السماح بتحويل الوسائظ",
    "AllLanguages": "كل اللغات",
@ -975,5 +974,18 @@
    "Add": "أضف",
    "Actor": "ممثل",
    "AccessRestrictedTryAgainLater": "الوصول مقيد حاليًا. الرجاء معاودة المحاولة في وقت لاحق.",
-    "Absolute": "مطلق"
+    "Absolute": "مطلق",
+    "Ended": "انتهى",
+    "EndsAtValue": "ينتهى عند {0}",
+    "Episodes": "الحلقات",
+    "ConfirmDeletion": "تأكيد الحذف",
+    "ConfirmDeleteItems": "سوف يتم حذف هذه العناصر من نظام الملفات ومن مكتبة الوسائط. هل ترغب فى الاستمرار؟",
+    "EveryNDays": "كل {0} يوم",
+    "ConfirmDeleteItem": "سوف يتم حذف هذا العنصر من نظام الملفات ومن مكتبة الوسائط. هل ترغب فى الاستمرار؟",
+    "DropShadow": "اسقاط ظل",
+    "LabelDropShadow": "اسقاط الظل:",
+    "EditSubtitles": "تعديل الترجمات",
+    "EditMetadata": "تعديل البيانات الوصفية",
+    "EditImages": "تعديل الصور",
+    "Edit": "تعديل"
 }
--- a/src/strings/bg-bg.json
+++ b/src/strings/bg-bg.json
@ -565,7 +565,6 @@
    "OptionEnableAccessFromAllDevices": "Позволяване на достъпа от всички устройства",
    "OptionEnableAccessToAllChannels": "Позволяване на достъпа до всички канали",
    "OptionEnableAccessToAllLibraries": "Позволяване на достъпа до всички библиотеки",
-    "OptionEnableAutomaticServerUpdates": "Разрешаване на автоматичните обновления",
    "OptionEnded": "Приключило",
    "OptionEveryday": "Всеки ден",
    "OptionExternallyDownloaded": "Външно сваляне",
--- a/src/strings/cs.json
+++ b/src/strings/cs.json
@ -930,7 +930,6 @@
    "OptionEnableAccessFromAllDevices": "Povolit přístup ze všech zařízení",
    "OptionEnableAccessToAllChannels": "Povolit přístup ze všech kanálů",
    "OptionEnableAccessToAllLibraries": "Povolit přístup ke všem knihovnám",
-    "OptionEnableAutomaticServerUpdates": "Povolit automatickou aktualizaci serveru",
    "OptionEnableExternalContentInSuggestions": "Aktivovat externí obsah v návrzích",
    "OptionEnableExternalContentInSuggestionsHelp": "Povolit zahrnutí internetových upoutávek a živých televizních programů do navrhovaného obsahu.",
    "OptionEnableForAllTuners": "Povolit pro všechna zařízení tunerů",
--- a/src/strings/da.json
+++ b/src/strings/da.json
@ -825,7 +825,6 @@
    "OptionEnableAccessFromAllDevices": "Tillad adgang fra alle enheder",
    "OptionEnableAccessToAllChannels": "Tillad adgang til alle kanaler",
    "OptionEnableAccessToAllLibraries": "Tillad adgang til alle biblioteker",
-    "OptionEnableAutomaticServerUpdates": "Aktiver automatiske serveropdateringer",
    "OptionEnableExternalContentInSuggestions": "Aktiver eksternt indhold i anbefalinger",
    "OptionEnableExternalContentInSuggestionsHelp": "Tillad at internet-trailers og live-tv-programmer bliver inkluderet i det anbefalede indhold.",
    "OptionEnableForAllTuners": "Aktiver for alle tuner-enheder",
--- a/src/strings/de.json
+++ b/src/strings/de.json
@ -636,7 +636,7 @@
    "LabelMaxChromecastBitrate": "Max Chromcast Datenrate:",
    "LabelMaxParentalRating": "Höchste erlaubte elterlich Bewertung:",
    "LabelMaxResumePercentage": "Maximale Prozent für Wiederaufnahme:",
-    "LabelMaxResumePercentageHelp": "Titel werden als \"vollständig gesehen\" eingetragen, wenn sie nach dieser Zeit gestoppt werden",
+    "LabelMaxResumePercentageHelp": "Titel werden als \"vollständig gesehen\" markiert, wenn sie nach dieser Zeitmarke gestoppt werden",
    "LabelMaxScreenshotsPerItem": "Maximale Anzahl von Screenshots pro Element:",
    "LabelMaxStreamingBitrate": "Maximale Streaming-Qualität:",
    "LabelMaxStreamingBitrateHelp": "Wähle die maximale Bitrate während des streamens.",
@ -654,9 +654,9 @@
    "LabelMethod": "Methode:",
    "LabelMinBackdropDownloadWidth": "Minimale Breite für zu herunterladende Hintergründe:",
    "LabelMinResumeDuration": "Minimale Dauer für Wiederaufnahme:",
-    "LabelMinResumeDurationHelp": "Die kürzeste Videolänge in Sekunden, die den Wiedergabeplatz speichert und dich fortsetzen lässt",
+    "LabelMinResumeDurationHelp": "Die Videolänge in Sekunden, ab der die Wiedergabeposition gespeichert wird und dich fortsetzen lässt",
    "LabelMinResumePercentage": "Minimale Prozent für Wiederaufnahme:",
-    "LabelMinResumePercentageHelp": "Titel werden als \"Ungesehen\" eingetragen, wenn sie vor dieser Zeit gestoppt werden",
+    "LabelMinResumePercentageHelp": "Titel werden als \"Ungesehen\" eingetragen, wenn sie vor dieser Zeit gestoppt werden.",
    "LabelMinScreenshotDownloadWidth": "Minimale Breite für zu herunterladende Screenshot:",
    "LabelModelDescription": "Modellbeschreibung",
    "LabelModelName": "Modellname",
@ -974,7 +974,6 @@
    "OptionEnableAccessFromAllDevices": "Erlaube Zugriff von allen Geräten",
    "OptionEnableAccessToAllChannels": "Erlaube Zugriff auf alle Kanäle",
    "OptionEnableAccessToAllLibraries": "Erlaube Zugriff auf alle Bibliotheken",
-    "OptionEnableAutomaticServerUpdates": "Aktiviere automatische Server Updates",
    "OptionEnableExternalContentInSuggestions": "Aktiviere externe Inhalte in Empfehlungen",
    "OptionEnableExternalContentInSuggestionsHelp": "Erlaube Internet Trailer und Live TV  Sendungen in Empfehlungen.",
    "OptionEnableForAllTuners": "Aktiviere für alle Tuner",
@ -1326,7 +1325,7 @@
    "LabelVersion": "Version:",
    "LabelVersionNumber": "Version {0}",
    "LabelVideo": "Video:",
-    "LeaveBlankToNotSetAPassword": "Optional - frei lassen um kein Passwort zu setzen",
+    "LeaveBlankToNotSetAPassword": "Du kannst dieses Feld frei lassen um kein Passwort zu setzen",
    "LinksValue": "Links: {0}",
    "MessageImageFileTypeAllowed": "Nur JPEG- und PNG-Dateien werden unterstützt.",
    "MessageImageTypeNotSelected": "Bitte wähle einen Bildtyp aus dem Drop-Down Menü aus.",
@ -1460,7 +1459,7 @@
    "MusicAlbum": "Musikalbum",
    "MoreMediaInfo": "Medieninformation",
    "MessageNoServersAvailable": "Die automatische Serversuche konnte keinen Server finden.",
-    "LabelPlayer": "Player:",
+    "LabelPlayer": "Schauspieler:",
    "MediaInfoCodecTag": "Codec Tag",
    "SubtitleOffset": "Untertitelvorlauf",
    "PlaybackData": "Wiedergabeinformationen",
@ -1475,5 +1474,7 @@
    "OptionRandom": "Zufällig",
    "TabNetworking": "Netzwerk",
    "VideoRange": "Videobereich",
-    "ButtonSplit": "Teilen"
+    "ButtonSplit": "Teilen",
+    "SelectAdminUsername": "Bitte einen Benutzernamen für das Administrator-Konto auswählen.",
+    "HeaderNavigation": "Navigation"
 }
--- a/src/strings/el.json
+++ b/src/strings/el.json
@ -868,7 +868,6 @@
    "OptionEnableAccessFromAllDevices": "Πρόσβαση από όλες τις συσκευές",
    "OptionEnableAccessToAllChannels": "Ενεργοποιήστε την πρόσβαση σε όλα τα κανάλια",
    "OptionEnableAccessToAllLibraries": "Πρόσβαση σε όλες τις Βιβλιοθήκες",
-    "OptionEnableAutomaticServerUpdates": "Ενεργοποίηση αυτόματων ενημερώσεων διακομιστή",
    "OptionEnableExternalContentInSuggestionsHelp": "Να επιτρέπεται η συμπερίληψη internet trailers και προγράμματα live tv στο προτεινόμενο περιεχόμενο.",
    "OptionEnableM2tsMode": "Ενεργοποίηση λειτουργίας M2ts",
    "OptionEnded": "Τέλος",
--- a/src/strings/en-gb.json
+++ b/src/strings/en-gb.json
@ -1303,7 +1303,6 @@
    "OptionEnableM2tsModeHelp": "Enable m2ts mode when encoding to mpegts.",
    "OptionEnableM2tsMode": "Enable M2ts mode",
    "OptionEnableExternalContentInSuggestions": "Enable external content in suggestions",
-    "OptionEnableAutomaticServerUpdates": "Enable automatic server updates",
    "OptionEnableAccessToAllLibraries": "Enable access to all libraries",
    "OptionEnableAccessToAllChannels": "Enable access to all channels",
    "OptionEnableAccessFromAllDevices": "Enable access from all devices",
--- a/src/strings/en-us.json
+++ b/src/strings/en-us.json
@ -1104,7 +1104,6 @@
    "OptionEnableAccessFromAllDevices": "Enable access from all devices",
    "OptionEnableAccessToAllChannels": "Enable access to all channels",
    "OptionEnableAccessToAllLibraries": "Enable access to all libraries",
-    "OptionEnableAutomaticServerUpdates": "Enable automatic server updates",
    "OptionEnableExternalContentInSuggestions": "Enable external content in suggestions",
    "OptionEnableExternalContentInSuggestionsHelp": "Allow internet trailers and live TV programs to be included within suggested content.",
    "OptionEnableForAllTuners": "Enable for all tuner devices",
--- a/src/strings/es-mx.json
+++ b/src/strings/es-mx.json
@ -1018,7 +1018,6 @@
    "OptionEnableAccessFromAllDevices": "Habilitar acceso desde todos los dispositivos",
    "OptionEnableAccessToAllChannels": "Habilitar acceso a todos los canales",
    "OptionEnableAccessToAllLibraries": "Habilitar el acceso a todas las bibliotecas",
-    "OptionEnableAutomaticServerUpdates": "Habilitar actualizaciones automáticas del servidor",
    "OptionEnableExternalContentInSuggestions": "Habilitar contenido externo en las sugerencias",
    "OptionEnableExternalContentInSuggestionsHelp": "Permitir que los trailers de Internet y los programas de televisión en vivo se incluyan en el contenido sugerido.",
    "OptionEnableForAllTuners": "Habilitar para todos los dispositivos sintonizadores",
--- a/src/strings/es.json
+++ b/src/strings/es.json
@ -95,7 +95,7 @@
    "ButtonRestart": "Reiniciar",
    "ButtonResume": "Continuar",
    "ButtonRevoke": "Revocar",
-    "ButtonSave": "Grabar",
+    "ButtonSave": "Guardar",
    "ButtonScanAllLibraries": "Escanear todas las bibliotecas",
    "ButtonSearch": "Buscar",
    "ButtonSelectDirectory": "Seleccionar directorio",
@ -120,7 +120,7 @@
    "CancelRecording": "Cancelar grabación",
    "CancelSeries": "Cancelar series",
    "Categories": "Categorías",
-    "ChannelAccessHelp": "Seleccione los canales para compartir con este usuario. Los administradores podrán editar todos los canales mediante el gestor de metadatos.",
+    "ChannelAccessHelp": "Seleccione los canales para compartir con este usuario. Los administradores podrán editar todos los canales mediante el editor de etiquetas.",
    "ChannelNameOnly": "Canal {0} solo",
    "ChannelNumber": "Número de canal",
    "Channels": "Canales",
@ -139,8 +139,8 @@
    "DeathDateValue": "Murió: {0}",
    "Default": "Por defecto",
    "DefaultErrorMessage": "Ha habido un error procesando la solicitud. Por favor inténtalo más tarde.",
-    "DefaultMetadataLangaugeDescription": "Estos son tus ajustes y se pueden personalizar para cada librería.",
-    "DefaultSubtitlesHelp": "Los subtítulos se activan en función de los ajustes por defecto y etiquetas en los metadatos integrados. Los ajustes de idioma se tienen en cuenta cuando hay varias opciones disponibles.",
+    "DefaultMetadataLangaugeDescription": "Estos son tus ajustes y se pueden personalizar para cada biblioteca.",
+    "DefaultSubtitlesHelp": "Los subtítulos que se utilizarán dependerán de como estén etiquetadas las pistas de los archivos (si \"por defecto\" o \"forzado\"). Los ajustes de idioma se tienen en cuenta cuando hay varias opciones disponibles.",
    "Delete": "Borrar",
    "DeleteDeviceConfirmation": "¿Estás seguro de que quieres borrar este dispositivo? Volverá a aparecer la próxima vez que un usuario inicie sesión en él.",
    "DeleteImage": "Borrar imagen",
@ -304,7 +304,7 @@
    "HeaderItems": "Elementos",
    "HeaderKeepRecording": "Mantener grabación",
    "HeaderKeepSeries": "Mantener series",
-    "HeaderKodiMetadataHelp": "Para habilitar o deshabilitar metadatos NFO, edite una biblioteca en la configuración de la biblioteca Jellyfin y localice la sección de metadatos.",
+    "HeaderKodiMetadataHelp": "Puedes activar o desactivar las etiquetas en formato NFO abriendo la configuración de una biblioteca y revisando los ajustes en la sección de etiquetas.",
    "HeaderLatestEpisodes": "Últimos episodios",
    "HeaderLatestMedia": "Últimos medios",
    "HeaderLatestMovies": "Últimas películas",
@ -322,7 +322,7 @@
    "HeaderMedia": "Medios",
    "HeaderMediaFolders": "Carpetas de medios",
    "HeaderMediaInfo": "Información multimedia",
-    "HeaderMetadataSettings": "Ajustes de metadatos",
+    "HeaderMetadataSettings": "Ajustes de etiquetas",
    "HeaderMoreLikeThis": "Más como este",
    "HeaderMovies": "Películas",
    "HeaderMusicVideos": "Vídeos musicales",
@ -349,7 +349,7 @@
    "HeaderPlaybackError": "Error de reproducción",
    "HeaderPleaseSignIn": "Por favor, inicie sesión",
    "HeaderPluginInstallation": "Instalación del complemento",
-    "HeaderPreferredMetadataLanguage": "Idioma preferido para los metadatos",
+    "HeaderPreferredMetadataLanguage": "Idioma preferido para las etiquetas",
    "HeaderProfile": "Perfil",
    "HeaderProfileInformation": "Información del perfil",
    "HeaderProfileServerSettingsHelp": "Estos valores controlan como el servidor Jellyfin se presenta al dispositivo.",
@ -369,8 +369,8 @@
    "HeaderSeasons": "Temporadas",
    "HeaderSecondsValue": "{0} segundos",
    "HeaderSelectCertificatePath": "Elige la ruta del certificado",
-    "HeaderSelectMetadataPath": "Seleccione la ruta para Metadatos",
-    "HeaderSelectMetadataPathHelp": "Busque o escriba la ruta donde desea almacenar los metadatos. La carpeta debe tener permiso de escritura.",
+    "HeaderSelectMetadataPath": "Seleccione la ruta para las etiquetas",
+    "HeaderSelectMetadataPathHelp": "Busque o escriba la ruta donde almacenar las etiquetas. La carpeta debe tener permiso de escritura.",
    "HeaderSelectPath": "Elige ruta",
    "HeaderSelectServer": "Selecionar servidor",
    "HeaderSelectServerCachePath": "Seleccione la ruta para el caché del servidor",
@ -459,7 +459,7 @@
    "LabelArtists": "Artistas:",
    "LabelArtistsHelp": "Separar múltiples artistas usando ;",
    "LabelAudioLanguagePreference": "Idioma de audio preferido:",
-    "LabelAutomaticallyRefreshInternetMetadataEvery": "Actualizar los metadatos automáticamente de internet:",
+    "LabelAutomaticallyRefreshInternetMetadataEvery": "Actualizar las etiquetas automáticamente desde Internet:",
    "LabelBindToLocalNetworkAddress": "Vincular a la dirección de red local:",
    "LabelBindToLocalNetworkAddressHelp": "Opcional. Anule la dirección IP local para enlazar el servidor HTTP. Si se deja vacío, el servidor se enlazará a todas las direcciones disponibles. Para cambiar este valor, debe reiniciar el servidor Jellyfin.",
    "LabelBirthDate": "Fecha de nacimiento:",
@ -489,7 +489,7 @@
    "LabelCustomRating": "Valoración pesonalizada:",
    "LabelDateAdded": "Fecha de añadido:",
    "LabelDateAddedBehavior": "Comportamiento de la fecha añadida para contenido nuevo:",
-    "LabelDateAddedBehaviorHelp": "Si un valor de metadato está disponible su usará siempre antes que ninguna de esas opciones.",
+    "LabelDateAddedBehaviorHelp": "Si el elemento tiene etiquetas que contengan información sobre la fecha de creación, independientemente de lo seleccionado aquí, se utilizarán para ordenar el contenido.",
    "LabelDay": "Día:",
    "LabelDeathDate": "Fecha de muerte:",
    "LabelDefaultUser": "Usuario por defecto:",
@ -595,15 +595,15 @@
    "LabelMaxStreamingBitrateHelp": "Especifica la tasa de bits máxima de la transmisión.",
    "LabelMessageText": "Mensaje de texto:",
    "LabelMessageTitle": "Título del mensaje:",
-    "LabelMetadata": "Metadatos:",
+    "LabelMetadata": "Etiquetas:",
    "LabelMetadataDownloadLanguage": "Idioma preferido de visualizado:",
-    "LabelMetadataDownloadersHelp": "Activa y ordena tus descargadores de metadatos por prioridad. Los que tengan menor prioridad se sólo se utilizarán para llenar la información faltante.",
-    "LabelMetadataPath": "Ruta de los metadatos:",
-    "LabelMetadataPathHelp": "Especifica una ruta para los pósteres y metadatos.",
-    "LabelMetadataReaders": "Lectores de metadatos:",
-    "LabelMetadataReadersHelp": "Ordena tus fuentes de metadatos locales por prioridad. Se leerá el primer archivo encontrado.",
-    "LabelMetadataSavers": "Almacenadores de metadatos:",
-    "LabelMetadataSaversHelp": "Elige el formato de archivo para guardar tus metadatos.",
+    "LabelMetadataDownloadersHelp": "Activa y ordena estos proveedores de etiquetas por prioridad. Los que tengan menor prioridad sólo se utilizarán para completar la información que falte.",
+    "LabelMetadataPath": "Ruta de las etiquetas:",
+    "LabelMetadataPathHelp": "Especifica una ruta para las imágenes y las etiquetas.",
+    "LabelMetadataReaders": "Lectores de etiquetas:",
+    "LabelMetadataReadersHelp": "Ordena los proveedores de etiquetas locales por prioridad. Se leerá el primer archivo encontrado.",
+    "LabelMetadataSavers": "Formato de etiquetas:",
+    "LabelMetadataSaversHelp": "Elige el formato de archivo para guardar las etiquetas.",
    "LabelMethod": "Método:",
    "LabelMinBackdropDownloadWidth": "Anchura mínima de descarga de imágenes de fondo:",
    "LabelMinResumeDuration": "Duración mínima de reanudación:",
@ -676,8 +676,8 @@
    "LabelRemoteClientBitrateLimit": "Límite de la transmisión de tasa de bits por internet (Mbps):",
    "LabelRemoteClientBitrateLimitHelp": "Un límite opcional de tasa de bits para todos los dispositivos fuera de la red. Esto es útil para evitar que los dispositivos soliciten una tasa de bits más alta que la que su conexión a Internet puede manejar. Esto puede ocasionar una mayor carga de la CPU en su servidor para transcodificar vídeos sobre la marcha a una tasa de bits más baja.",
    "LabelRuntimeMinutes": "Tiempo de ejecución (minutos):",
-    "LabelSaveLocalMetadata": "Guardar imágenes y metadatos en las carpetas de medios",
-    "LabelSaveLocalMetadataHelp": "Guardar imágenes y metadatos directamente en las carpetas de medios, permitirá colocarlas en un lugar donde se pueden editar fácilmente.",
+    "LabelSaveLocalMetadata": "Guardar imágenes y etiquetas en las carpetas de medios",
+    "LabelSaveLocalMetadataHelp": "Guardar imágenes y etiquetas directamente en las carpetas en las que estén los elementos hará que se puedan editar más fácilmente.",
    "LabelScheduledTaskLastRan": "Última ejecución {0}, tardando {1}.",
    "LabelScreensaver": "Salvapantallas:",
    "LabelSeasonNumber": "Número de temporada:",
@ -729,7 +729,7 @@
    "LabelTunerIpAddress": "IP del sintonizador:",
    "LabelTunerType": "Tipo de sintonizador:",
    "LabelType": "Tipo:",
-    "LabelTypeMetadataDownloaders": "{0} descargadores de metadatos:",
+    "LabelTypeMetadataDownloaders": "Proveedores de etiquetas para {0}:",
    "LabelTypeText": "Texto",
    "LabelUseNotificationServices": "Usar los siguientes servicios:",
    "LabelUser": "Usuario:",
@ -754,7 +754,7 @@
    "LanNetworksHelp": "Lista de direcciones IP separadas por comas o entradas de dirección IP / máscara de red para redes que se considerarán en la red local al imponer restricciones de ancho de banda. Si se establece, todas las demás direcciones IP se considerarán en la red externa y estarán sujetas a las restricciones de ancho de banda externo. Si se deja en blanco, solo se considera que la subred del servidor está en la red local.",
    "Large": "Grande",
    "LatestFromLibrary": "Reciente en {0}",
-    "LibraryAccessHelp": "Seleccione las bibliotecas a compartir con este usuario. Los administradores podrán editar todas las carpetas usando el gestor de metadatos.",
+    "LibraryAccessHelp": "Seleccione las bibliotecas a compartir con este usuario. Los administradores podrán editar todas las carpetas usando el gestor de etiquetas.",
    "Like": "Me gusta",
    "Live": "Directo",
    "LiveBroadcasts": "Emisiones en vivo",
@ -824,7 +824,7 @@
    "MessageNoTrailersFound": "No se han encontrado tráilers. Instala el canal de tráilers para mejorar su experiencia añadiendo una biblioteca de tráilers por internet.",
    "MessageNothingHere": "Nada aquí.",
    "MessagePasswordResetForUsers": "Se ha restablecido las contraseñas a los siguientes usuarios. Ahora pueden iniciar sesión con los códigos PIN que usaron para el restablecimiento.",
-    "MessagePleaseEnsureInternetMetadata": "Por favor, asegúrese que la descarga de metadatos de internet está habilitada.",
+    "MessagePleaseEnsureInternetMetadata": "Asegúrate de que la descarga de etiquetas desde internet está activada.",
    "MessagePleaseWait": "Por favor, espere.",
    "MessagePluginConfigurationRequiresLocalAccess": "Para configurar este complemento inicia sesión en tu servidor local directamente.",
    "MessagePluginInstallDisclaimer": "Los complementos creados por los miembros de la comunidad de Jellyfin son una buena forma de mejorar tu experiencia Jellyfin con características adicionales y otros beneficios. Antes de instalarlos considera los efectos que pueden tener en tu servidor Jellyfin, como escaneos de la biblioteca más largos, procesado en segundo plano adicional y una reducción de la estabilidad del sistema.",
@ -834,9 +834,9 @@
    "MessageUnableToConnectToServer": "No podemos conectar con el servidor seleccionado ahora mismo. Por favor, asegúrate de que esta funcionando e inténtalo otra vez.",
    "MessageUnsetContentHelp": "El contenido se mostrará como carpetas planas. Para tener mejores resultados utiliza el gestor de metadatos para establecer los tipos de contenidos de las sub-carpetas.",
    "MessageYouHaveVersionInstalled": "Actualmente tienes la versión {0} instalada.",
-    "Metadata": "Metadatos",
-    "MetadataManager": "Administrador de metadatos",
-    "MetadataSettingChangeHelp": "El cambio de la configuración de metadatos afectará al nuevo contenido que se añada en el futuro. Para actualizar el contenido existente, abra la pantalla de detalles y haga clic en el botón Actualizar o realice actualizaciones masivas utilizando el administrador de metadatos.",
+    "Metadata": "Etiquetas",
+    "MetadataManager": "Administrador de etiquetas",
+    "MetadataSettingChangeHelp": "Este cambio afectará al nuevo contenido que se añada en el futuro. Para actualizar el contenido existente abra la pantalla de detalles y haga clic en el botón \"Actualizar\". También se pueden actualizar todas las etiquetas a la vez utilizando el administrador de etiquetas.",
    "MinutesAfter": "minutos después",
    "MinutesBefore": "minutos antes",
    "Mobile": "Móvil",
@ -928,7 +928,6 @@
    "OptionEnableAccessFromAllDevices": "Habilitar acceso desde todos los equipos",
    "OptionEnableAccessToAllChannels": "Habilitar acceso a todos los canales",
    "OptionEnableAccessToAllLibraries": "Habilitar acceso a todas las bibliotecas",
-    "OptionEnableAutomaticServerUpdates": "Activar actualizaciones automáticas del servidor",
    "OptionEnableExternalContentInSuggestions": "Habilitar contenido externo en sugerencias",
    "OptionEnableExternalContentInSuggestionsHelp": "Permite incluir los tráilers de Internet y los programas de TV en vivo en el contenido sugerido.",
    "OptionEnableForAllTuners": "Activar para todos los dispositivos sintonizadores",
@ -982,8 +981,8 @@
    "OptionResumable": "Se puede continuar",
    "OptionRuntime": "Tiempo",
    "OptionSaturday": "Sábado",
-    "OptionSaveMetadataAsHidden": "Guardar los metadatos e imágenes como archivos ocultos",
-    "OptionSaveMetadataAsHiddenHelp": "Cambiar esto se aplicará a los nuevos metadatos guardados en el futuro. Los archivos de metadatos existentes se actualizarán la próxima vez que sean guardados por el servidor Jellyfin.",
+    "OptionSaveMetadataAsHidden": "Guardar las etiquetas e imágenes como archivos ocultos",
+    "OptionSaveMetadataAsHiddenHelp": "La configuración se aplicará a las nuevas etiquetas que se creen. Las etiquetas existentes se actualizarán la próxima vez que sean guardadas por Jellyfin.",
    "OptionSpecialEpisode": "Especiales",
    "OptionSunday": "Domingo",
    "OptionThursday": "Jueves",
@ -1025,7 +1024,7 @@
    "PleaseSelectTwoItems": "Seleccione al menos dos elementos.",
    "PluginInstalledMessage": "El complemento se ha instalado correctamente. El servidor Jellyfin deberá reiniciarse para que los cambios surjan efecto.",
    "PreferEmbeddedTitlesOverFileNames": "Preferir títulos incrustados sobre los nombres de archivo",
-    "PreferEmbeddedTitlesOverFileNamesHelp": "Esto determina el título por defecto cuando no hay ningún metadato de internet o local.",
+    "PreferEmbeddedTitlesOverFileNamesHelp": "Esto determina el título que se utilizará cuando un elemento no tenga etiquetas ni estas se hayan podido descargar de Internet.",
    "PreferredNotRequired": "Preferido, pero no requerido",
    "Premieres": "Estrenos",
    "Previous": "Anterior",
@ -1048,7 +1047,7 @@
    "RecordingScheduled": "Grabación programada.",
    "Recordings": "Grabaciones",
    "Refresh": "Refrescar",
-    "RefreshMetadata": "Actualizar metadatos",
+    "RefreshMetadata": "Actualizar etiquetas",
    "RefreshQueued": "Actualización programada.",
    "ReleaseDate": "Fecha de lanzamiento",
    "RememberMe": "Recuérdame",
@ -1059,7 +1058,7 @@
    "RepeatEpisodes": "Repetir episodios",
    "RepeatMode": "Modo de repetición",
    "RepeatOne": "Repetir uno",
-    "ReplaceAllMetadata": "Reemplazar todos los metadatos",
+    "ReplaceAllMetadata": "Reemplazar todas las etiquetas",
    "ReplaceExistingImages": "Reemplazar imágenes existentes",
    "RequiredForAllRemoteConnections": "Requerido para todas las conexiones remotas",
    "ResumeAt": "Continuar desde {0}",
@ -1075,8 +1074,8 @@
    "Screenshot": "Captura de pantalla",
    "Screenshots": "Capturas de pantalla",
    "Search": "Buscar",
-    "SearchForCollectionInternetMetadata": "Buscar en internet ilustraciones y metadatos",
-    "SearchForMissingMetadata": "Buscar metadatos faltantes",
+    "SearchForCollectionInternetMetadata": "Buscar en internet imágenes y etiquetas",
+    "SearchForMissingMetadata": "Buscar etiquetas que falten",
    "SearchForSubtitles": "Búsqueda de subtítulos",
    "SearchResults": "Resultados de la búsqueda",
    "SendMessage": "Enviar mensaje",
@ -1097,7 +1096,7 @@
    "Shows": "Series",
    "Shuffle": "Mezclar",
    "SimultaneousConnectionLimitHelp": "Número máximo de transmisiones simultáneas permitidas. Pon 0 para no tener límite.",
-    "SkipEpisodesAlreadyInMyLibrary": "No grabar episodios que ya están en mi librería",
+    "SkipEpisodesAlreadyInMyLibrary": "No grabar episodios que ya están en mi biblioteca",
    "SkipEpisodesAlreadyInMyLibraryHelp": "Los episodios serán comparados usando el número de temporada y de episodio, cuando estén disponibles.",
    "Small": "Pequeño",
    "Smart": "Inteligente",
@ -1135,7 +1134,7 @@
    "TabLatest": "Novedades",
    "TabLibrary": "Biblioteca",
    "TabLiveTV": "Televisión en directo",
-    "TabMetadata": "Metadatos",
+    "TabMetadata": "Etiquetas",
    "TabMovies": "Películas",
    "TabMusic": "Música",
    "TabMusicVideos": "Videos musicales",
@ -1237,7 +1236,7 @@
    "Banner": "Pancarta",
    "BurnSubtitlesHelp": "Determina si el servidor debería incrustar los subtítulos al convertir el vídeo dependiendo del formato de los subtítulos. Evitar incrustar los subtítulos mejorará el rendimiento del servidor. Selecciona Auto para incrustar subtítulos basados en imágenes (VOBSUB, PGS, SUB/IDX, etc.) y algunos subtítulos de tipo ASS/SSA.",
    "ButtonInfo": "Información",
-    "ChangingMetadataImageSettingsNewContent": "Los cambios a la configuración de descarga de metadatos o arte sólo se aplicará al nuevo contenido añadido a la biblioteca. Para aplicar los cambios a los títulos existentes, necesitarás actualizar los metadatos manualmente.",
+    "ChangingMetadataImageSettingsNewContent": "Los cambios a la configuración de descarga de etiquetas e imágenes sólo se aplicará al nuevo contenido que se añada a la biblioteca. Para aplicar los cambios a los elementos existentes necesitarás actualizar las etiquetas manualmente.",
    "ColorPrimaries": "Colores primarios",
    "ColorSpace": "Espacio de color",
    "ColorTransfer": "Transferencia de color",
@ -1258,7 +1257,7 @@
    "DisplayMissingEpisodesWithinSeasons": "Mostrar episodios ausentes en las temporadas",
    "DisplayMissingEpisodesWithinSeasonsHelp": "Esto también debe ser habilitado para la biblioteca de TV en la configuración del servidor.",
    "DropShadow": "Sombra",
-    "EditMetadata": "Editar metadatos",
+    "EditMetadata": "Editar etiquetas",
    "EnableBackdrops": "Imágenes de fondo",
    "EnableBackdropsHelp": "Mostrar imágenes de fondo en algunas páginas mientras se explora la biblioteca.",
    "EnableColorCodedBackgrounds": "Fondos  con código de colores",
@ -1402,7 +1401,7 @@
    "PlayCount": "Reproducciones",
    "Premiere": "Estreno",
    "Raised": "Elevación",
-    "RefreshDialogHelp": "Los metadatos se actualizan basados en las configuraciones y los servicios de internet habilitados en el panel del servidor Jellyfin.",
+    "RefreshDialogHelp": "Las etiquetas se actualizan basándose en las configuraciones y los servicios de internet activados desde el panel de control de Jellyfin.",
    "RestartPleaseWaitMessage": "Por favor, espera mientras el servidor Jellyfin se reinicia. Esto puede tardar un minuto o dos.",
    "RunAtStartup": "Ejecutar al iniciar",
    "Series": "Series",
@ -1461,5 +1460,6 @@
    "HeaderFavoritePeople": "Personas favoritas",
    "OptionRandom": "Aleatorio",
    "SelectAdminUsername": "Por favor seleccione un nombre de usuario para la cuenta de administrador.",
-    "ButtonSplit": "Dividir"
+    "ButtonSplit": "Dividir",
+    "HeaderNavigation": "Navegación"
 }
--- a/src/strings/fr.json
+++ b/src/strings/fr.json
@ -1009,7 +1009,6 @@
    "OptionEnableAccessFromAllDevices": "Autoriser l'accès depuis tous les appareils",
    "OptionEnableAccessToAllChannels": "Activer l'accès à toutes les chaînes",
    "OptionEnableAccessToAllLibraries": "Activer l'accès à toutes les librairies",
-    "OptionEnableAutomaticServerUpdates": "Activer les mises à jour automatiques du serveur",
    "OptionEnableExternalContentInSuggestions": "Activer le contenu externe dans les suggestions",
    "OptionEnableExternalContentInSuggestionsHelp": "Autoriser les bandes-annonces sur internet et les programmes TV en direct à être inclus dans le contenu suggéré.",
    "OptionEnableForAllTuners": "Autoriser pour tous les tuners",
@ -1455,5 +1454,6 @@
    "HeaderFavoritePeople": "Personnes préférées",
    "OptionRandom": "Aléatoire",
    "ButtonSplit": "Séparer",
-    "SelectAdminUsername": "Veuillez choisir un nom d'utilisateur pour le compte administrateur."
+    "SelectAdminUsername": "Veuillez choisir un nom d'utilisateur pour le compte administrateur.",
+    "HeaderNavigation": "Navigation"
 }
--- a/src/strings/gl.json
+++ b/src/strings/gl.json
@ -0,0 +1 @@
+{}
--- a/src/strings/hr.json
+++ b/src/strings/hr.json
@ -755,7 +755,6 @@
    "OptionEnableAccessFromAllDevices": "Omogući pristup svim uređajima",
    "OptionEnableAccessToAllChannels": "Omogući pristup svim kanalima",
    "OptionEnableAccessToAllLibraries": "Omogući pristup svim bibliotekama",
-    "OptionEnableAutomaticServerUpdates": "Omogući automatska ažuriranja servera",
    "OptionEnableExternalContentInSuggestions": "Omogući vanjske sadržaje u prijedlozima",
    "OptionEnableExternalContentInSuggestionsHelp": "Dopusti internet kratkim filmovima i TV programima uživo da budu uključeni u preporučenom sadržaju.",
    "OptionEnableForAllTuners": "Omogući za sve TV/Radio uređaje",
--- a/src/strings/hu.json
+++ b/src/strings/hu.json
@ -411,7 +411,6 @@
    "OptionEnableAccessFromAllDevices": "Hozzáférés engedélyezése minden eszközről",
    "OptionEnableAccessToAllChannels": "Hozzáférés engedélyezése minden csatornához",
    "OptionEnableAccessToAllLibraries": "Hozzáférés engedélyezése minden könyvtárhoz",
-    "OptionEnableAutomaticServerUpdates": "Automatikus szerverfrissítés engedélyezése",
    "OptionExternallyDownloaded": "Külső letöltés",
    "OptionFavorite": "Kedvencek",
    "OptionFriday": "Péntek",
--- a/src/strings/it.json
+++ b/src/strings/it.json
@ -969,7 +969,6 @@
    "OptionEnableAccessFromAllDevices": "Abilita l'accesso da tutti i dispositivi",
    "OptionEnableAccessToAllChannels": "Abilita l'accesso a tutti i canali",
    "OptionEnableAccessToAllLibraries": "Abilita l'accesso a tutte le librerie",
-    "OptionEnableAutomaticServerUpdates": "Attiva aggiornamenti automatici del server",
    "OptionEnableExternalContentInSuggestions": "Abilita contenuto remoto nei suggerimenti",
    "OptionEnableExternalContentInSuggestionsHelp": "Consenti l'inclusione di trailer Internet e programmi TV tra i contenuti suggeriti.",
    "OptionEnableForAllTuners": "Abilita per tutti i sintonizzatori",
--- a/src/strings/ja.json
+++ b/src/strings/ja.json
@ -643,7 +643,6 @@
    "OptionDownloadLogoImage": "ロゴ",
    "OptionEnableAccessToAllChannels": "すべてのチャンネルへのアクセスを有効化",
    "OptionEnableAccessToAllLibraries": "すべてのライブラリへのアクセスを優幸化",
-    "OptionEnableAutomaticServerUpdates": "サーバーの自動アップデートを有効化",
    "OptionWeekly": "週間",
    "OriginalAirDateValue": "元の公開日: {0}",
    "RepeatOne": "リピート",
--- a/src/strings/kk.json
+++ b/src/strings/kk.json
@ -1065,7 +1065,6 @@
    "OptionEnableAccessFromAllDevices": "Barlyq qurylǵylardan qatynaýdy qosý",
    "OptionEnableAccessToAllChannels": "Barlyq arnalarǵa qatynaýdy qosý",
    "OptionEnableAccessToAllLibraries": "Barlyq tasyǵyshhanalarǵa qatynaýdy qosý",
-    "OptionEnableAutomaticServerUpdates": "Serverdiń avtomatty jańartylýyn qosý",
    "OptionEnableExternalContentInSuggestions": "Uynystarǵa syrtqy mazmundy qosý",
    "OptionEnableExternalContentInSuggestionsHelp": "Internet-treılerler men efırlik kórsetimderge usynǵan mazmunǵa kirý úshin ruqsat etedi.",
    "OptionEnableForAllTuners": "Barlyq túner qurylǵylary úshin qosý",
--- a/src/strings/ko.json
+++ b/src/strings/ko.json
@ -585,7 +585,6 @@
    "OptionEnableAccessFromAllDevices": "모든 기기에서 접속 허용",
    "OptionEnableAccessToAllChannels": "모든 채널에 접속 허용",
    "OptionEnableAccessToAllLibraries": "모든 라이브러리에 접속 허용",
-    "OptionEnableAutomaticServerUpdates": "서버 자동 업데이트 사용",
    "OptionEnableM2tsMode": "M2ts 모드 활성화",
    "OptionEnded": "종료됨",
    "OptionEveryday": "매일",
--- a/Show more
+++ b/Show more