update startup wizard

dashboard-ui/apiclient/apiclient.js

@@ -2995,15 +2995,11 @@
             });
         };
 
-        self.getUserViews = function (userId, options) {
+        self.getUserViews = function (options, userId) {
-
-            if (!userId) {
-                throw new Error("null userId");
-            }
 
             options = options || {};
 
-            var url = self.getUrl("Users/" + userId + "/Views", options);
+            var url = self.getUrl("Users/" + (userId || self.getCurrentUserId()) + "/Views", options);
 
             return self.ajax({
                 type: "GET",

dashboard-ui/bower_components/promise-polyfill/.bower.json

@@ -0,0 +1,38 @@
+{
+  "name": "promise-polyfill",
+  "version": "2.1.0",
+  "homepage": "https://github.com/taylorhakes/promise-polyfill",
+  "authors": [
+    "Taylor Hakes"
+  ],
+  "description": "Lightweight promise polyfill for the browser and node. A+ Compliant.",
+  "main": "Promise.js",
+  "moduleType": [
+    "globals",
+    "node"
+  ],
+  "keywords": [
+    "promise",
+    "es6",
+    "polyfill",
+    "html5"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "_release": "2.1.0",
+  "_resolution": {
+    "type": "version",
+    "tag": "2.1.0",
+    "commit": "7ee8e28671e2e7ff0304ea37c3d1fb1288645362"
+  },
+  "_source": "git://github.com/taylorhakes/promise-polyfill.git",
+  "_target": "~2.1.0",
+  "_originalSource": "promise-polyfill",
+  "_direct": true
+}

dashboard-ui/bower_components/promise-polyfill/Gruntfile.js

@@ -0,0 +1,23 @@
+module.exports = function(grunt) {
+
+	grunt.initConfig({
+		pkg: grunt.file.readJSON('package.json'),
+
+		uglify: {
+			options: {
+				banner: '/*! <%= pkg.name %> <%= pkg.version %> */\n'
+			},
+			dist: {
+				files: {
+					'Promise.min.js': ['Promise.js']
+				}
+			}
+		}
+
+	});
+
+	grunt.loadNpmTasks('grunt-contrib-uglify');
+
+	grunt.registerTask('build', ['uglify']);
+
+};

dashboard-ui/bower_components/promise-polyfill/LICENSE

@@ -0,0 +1,20 @@
+Copyright (c) 2014 Taylor Hakes
+Copyright (c) 2014 Forbes Lindesay
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

dashboard-ui/bower_components/promise-polyfill/Promise.js

@@ -0,0 +1,190 @@
+(function(root) {
+
+	// Use polyfill for setImmediate for performance gains
+	var asap = (typeof setImmediate === 'function' && setImmediate) ||
+		function(fn) { setTimeout(fn, 1); };
+
+	// Polyfill for Function.prototype.bind
+	function bind(fn, thisArg) {
+		return function() {
+			fn.apply(thisArg, arguments);
+		}
+	}
+
+	var isArray = Array.isArray || function(value) { return Object.prototype.toString.call(value) === "[object Array]" };
+
+	function Promise(fn) {
+		if (typeof this !== 'object') throw new TypeError('Promises must be constructed via new');
+		if (typeof fn !== 'function') throw new TypeError('not a function');
+		this._state = null;
+		this._value = null;
+		this._deferreds = []
+
+		doResolve(fn, bind(resolve, this), bind(reject, this))
+	}
+
+	function handle(deferred) {
+		var me = this;
+		if (this._state === null) {
+			this._deferreds.push(deferred);
+			return
+		}
+		asap(function() {
+			var cb = me._state ? deferred.onFulfilled : deferred.onRejected
+			if (cb === null) {
+				(me._state ? deferred.resolve : deferred.reject)(me._value);
+				return;
+			}
+			var ret;
+			try {
+				ret = cb(me._value);
+			}
+			catch (e) {
+				deferred.reject(e);
+				return;
+			}
+			deferred.resolve(ret);
+		})
+	}
+
+	function resolve(newValue) {
+		try { //Promise Resolution Procedure: https://github.com/promises-aplus/promises-spec#the-promise-resolution-procedure
+			if (newValue === this) throw new TypeError('A promise cannot be resolved with itself.');
+			if (newValue && (typeof newValue === 'object' || typeof newValue === 'function')) {
+				var then = newValue.then;
+				if (typeof then === 'function') {
+					doResolve(bind(then, newValue), bind(resolve, this), bind(reject, this));
+					return;
+				}
+			}
+			this._state = true;
+			this._value = newValue;
+			finale.call(this);
+		} catch (e) { reject.call(this, e); }
+	}
+
+	function reject(newValue) {
+		this._state = false;
+		this._value = newValue;
+		finale.call(this);
+	}
+
+	function finale() {
+		for (var i = 0, len = this._deferreds.length; i < len; i++) {
+			handle.call(this, this._deferreds[i]);
+		}
+		this._deferreds = null;
+	}
+
+	function Handler(onFulfilled, onRejected, resolve, reject){
+		this.onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : null;
+		this.onRejected = typeof onRejected === 'function' ? onRejected : null;
+		this.resolve = resolve;
+		this.reject = reject;
+	}
+
+	/**
+	 * Take a potentially misbehaving resolver function and make sure
+	 * onFulfilled and onRejected are only called once.
+	 *
+	 * Makes no guarantees about asynchrony.
+	 */
+	function doResolve(fn, onFulfilled, onRejected) {
+		var done = false;
+		try {
+			fn(function (value) {
+				if (done) return;
+				done = true;
+				onFulfilled(value);
+			}, function (reason) {
+				if (done) return;
+				done = true;
+				onRejected(reason);
+			})
+		} catch (ex) {
+			if (done) return;
+			done = true;
+			onRejected(ex);
+		}
+	}
+
+	Promise.prototype['catch'] = function (onRejected) {
+		return this.then(null, onRejected);
+	};
+
+	Promise.prototype.then = function(onFulfilled, onRejected) {
+		var me = this;
+		return new Promise(function(resolve, reject) {
+			handle.call(me, new Handler(onFulfilled, onRejected, resolve, reject));
+		})
+	};
+
+	Promise.all = function () {
+		var args = Array.prototype.slice.call(arguments.length === 1 && isArray(arguments[0]) ? arguments[0] : arguments);
+
+		return new Promise(function (resolve, reject) {
+			if (args.length === 0) return resolve([]);
+			var remaining = args.length;
+			function res(i, val) {
+				try {
+					if (val && (typeof val === 'object' || typeof val === 'function')) {
+						var then = val.then;
+						if (typeof then === 'function') {
+							then.call(val, function (val) { res(i, val) }, reject);
+							return;
+						}
+					}
+					args[i] = val;
+					if (--remaining === 0) {
+						resolve(args);
+					}
+				} catch (ex) {
+					reject(ex);
+				}
+			}
+			for (var i = 0; i < args.length; i++) {
+				res(i, args[i]);
+			}
+		});
+	};
+
+	Promise.resolve = function (value) {
+		if (value && typeof value === 'object' && value.constructor === Promise) {
+			return value;
+		}
+
+		return new Promise(function (resolve) {
+			resolve(value);
+		});
+	};
+
+	Promise.reject = function (value) {
+		return new Promise(function (resolve, reject) {
+			reject(value);
+		});
+	};
+
+	Promise.race = function (values) {
+		return new Promise(function (resolve, reject) {
+			for(var i = 0, len = values.length; i < len; i++) {
+				values[i].then(resolve, reject);
+			}
+		});
+	};
+
+	/**
+	 * Set the immediate function to execute callbacks
+	 * @param fn {function} Function to execute
+	 * @private
+	 */
+	Promise._setImmediateFn = function _setImmediateFn(fn) {
+		asap = fn;
+	};
+
+	if (typeof module !== 'undefined' && module.exports) {
+		module.exports = Promise;
+	} else if (!root.Promise) {
+		root.Promise = Promise;
+	}
+
+})(this);

dashboard-ui/bower_components/promise-polyfill/Promise.min.js

@@ -0,0 +1,2 @@
+/*! promise-polyfill 2.1.0 */
+!function(a){function b(a,b){return function(){a.apply(b,arguments)}}function c(a){if("object"!=typeof this)throw new TypeError("Promises must be constructed via new");if("function"!=typeof a)throw new TypeError("not a function");this._state=null,this._value=null,this._deferreds=[],i(a,b(e,this),b(f,this))}function d(a){var b=this;return null===this._state?void this._deferreds.push(a):void j(function(){var c=b._state?a.onFulfilled:a.onRejected;if(null===c)return void(b._state?a.resolve:a.reject)(b._value);var d;try{d=c(b._value)}catch(e){return void a.reject(e)}a.resolve(d)})}function e(a){try{if(a===this)throw new TypeError("A promise cannot be resolved with itself.");if(a&&("object"==typeof a||"function"==typeof a)){var c=a.then;if("function"==typeof c)return void i(b(c,a),b(e,this),b(f,this))}this._state=!0,this._value=a,g.call(this)}catch(d){f.call(this,d)}}function f(a){this._state=!1,this._value=a,g.call(this)}function g(){for(var a=0,b=this._deferreds.length;b>a;a++)d.call(this,this._deferreds[a]);this._deferreds=null}function h(a,b,c,d){this.onFulfilled="function"==typeof a?a:null,this.onRejected="function"==typeof b?b:null,this.resolve=c,this.reject=d}function i(a,b,c){var d=!1;try{a(function(a){d||(d=!0,b(a))},function(a){d||(d=!0,c(a))})}catch(e){if(d)return;d=!0,c(e)}}var j="function"==typeof setImmediate&&setImmediate||function(a){setTimeout(a,1)},k=Array.isArray||function(a){return"[object Array]"===Object.prototype.toString.call(a)};c.prototype["catch"]=function(a){return this.then(null,a)},c.prototype.then=function(a,b){var e=this;return new c(function(c,f){d.call(e,new h(a,b,c,f))})},c.all=function(){var a=Array.prototype.slice.call(1===arguments.length&&k(arguments[0])?arguments[0]:arguments);return new c(function(b,c){function d(f,g){try{if(g&&("object"==typeof g||"function"==typeof g)){var h=g.then;if("function"==typeof h)return void h.call(g,function(a){d(f,a)},c)}a[f]=g,0===--e&&b(a)}catch(i){c(i)}}if(0===a.length)return b([]);for(var e=a.length,f=0;f<a.length;f++)d(f,a[f])})},c.resolve=function(a){return a&&"object"==typeof a&&a.constructor===c?a:new c(function(b){b(a)})},c.reject=function(a){return new c(function(b,c){c(a)})},c.race=function(a){return new c(function(b,c){for(var d=0,e=a.length;e>d;d++)a[d].then(b,c)})},c._setImmediateFn=function(a){j=a},"undefined"!=typeof module&&module.exports?module.exports=c:a.Promise||(a.Promise=c)}(this);

dashboard-ui/bower_components/promise-polyfill/bower.json

@@ -0,0 +1,28 @@
+{
+  "name": "promise-polyfill",
+  "version": "2.1.0",
+  "homepage": "https://github.com/taylorhakes/promise-polyfill",
+  "authors": [
+    "Taylor Hakes"
+  ],
+  "description": "Lightweight promise polyfill for the browser and node. A+ Compliant.",
+  "main": "Promise.js",
+  "moduleType": [
+    "globals",
+    "node"
+  ],
+  "keywords": [
+    "promise",
+    "es6",
+    "polyfill",
+    "html5"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ]
+}

dashboard-ui/bower_components/promise-polyfill/jasmine.json

@@ -0,0 +1,7 @@
+{
+  "spec_dir": "tests",
+  "spec_files": [
+    "**/*.spec.js"
+  ],
+  "helpers": []
+}

dashboard-ui/bower_components/promise-polyfill/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "promise-polyfill",
+  "version": "2.1.0",
+  "description": "Lightweight promise polyfill. A+ compliant",
+  "main": "Promise.js",
+  "scripts": {
+    "test": "./node_modules/.bin/promises-aplus-tests tests/adapter.js && JASMINE_CONFIG_PATH=jasmine.json ./node_modules/jasmine/bin/jasmine.js;"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://taylorhakes@github.com/taylorhakes/promise-polyfill.git"
+  },
+  "author": "Taylor Hakes",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/taylorhakes/promise-polyfill/issues"
+  },
+  "homepage": "https://github.com/taylorhakes/promise-polyfill",
+  "devDependencies": {
+    "grunt": "^0.4.4",
+    "grunt-contrib-uglify": "^0.4.0",
+    "jasmine": "^2.3.1",
+    "promises-aplus-tests": "*"
+  },
+  "keywords": [
+    "promise",
+    "promise-polyfill",
+    "ES6",
+    "promises-aplus"
+  ],
+  "dependencies": {}
+}

dashboard-ui/css/site.css

@@ -892,7 +892,7 @@ h1 .imageLink {
     max-width: 800px;
     padding: .5em 2em 1em;
     margin: 0 auto;
-    background: #e8e8e8;
+    background: #fff;
 }
 
 .wizardNavigation {
@@ -903,10 +903,6 @@ h1 .imageLink {
     max-width: 100%;
 }
 
-.wizardContent p {
-    margin: 2em 0;
-}
-
 .wizardContent h2 img {
     height: 35px;
     vertical-align: middle;

dashboard-ui/scripts/appsettings.js

@@ -62,7 +62,7 @@
                 update('enableSyncToExternalStorage', val.toString());
             }
 
-            return appStorage.getItem('enableSyncToExternalStorage') == 'true';
+            return appStorage.getItem('enableSyncToExternalStorage') != 'false';
         },
 
         displayPreferencesKey: function() {

dashboard-ui/scripts/librarymenu.js

@@ -382,7 +382,7 @@
 
         var apiClient = window.ApiClient;
 
-        apiClient.getUserViews(userId).done(function (result) {
+        apiClient.getUserViews({}, userId).done(function (result) {
 
             var items = result.Items;
 

dashboard-ui/scripts/mediaplayer.js

@@ -1726,7 +1726,7 @@
             };
 
             info = $.extend(info, state.PlayState);
-
+            console.log('repeat mode ' + info.RepeatMode);
             ApiClient.reportPlaybackProgress(info);
         }
 

dashboard-ui/scripts/mypreferenceshome.js

@@ -173,7 +173,7 @@
         var promise2 = ApiClient.getJSON(ApiClient.getUrl("Channels", {
             UserId: user.Id
         }));
-        var promise3 = ApiClient.getUserViews(user.Id);
+        var promise3 = ApiClient.getUserViews({}, user.Id);
         var promise4 = ApiClient.getJSON(ApiClient.getUrl("Users/" + user.Id + "/SpecialViewOptions"));
 
         $.when(promise1, promise2, promise3, promise4).done(function (r1, r2, r3, r4) {
@@ -225,8 +225,8 @@
         displayPreferences.CustomPrefs.home2 = $('#selectHomeSection3', page).val();
         displayPreferences.CustomPrefs.home3 = $('#selectHomeSection4', page).val();
 
-        ApiClient.updateDisplayPreferences('home', displayPreferences, user.Id, AppSettings.displayPreferencesKey()).done(function() {
+        ApiClient.updateDisplayPreferences('home', displayPreferences, user.Id, AppSettings.displayPreferencesKey()).done(function () {
-            
+
             ApiClient.updateUserConfiguration(user.Id, user.Configuration).done(function () {
                 Dashboard.alert(Globalize.translate('SettingsSaved'));
 

dashboard-ui/scripts/nowplayingbar.js

@@ -140,18 +140,19 @@
 
         toggleRepeatButton = $('.toggleRepeatButton', elem).on('click', function () {
 
-            if (currentPlayer && lastPlayerState) {
+            if (currentPlayer) {
-                var state = lastPlayerState;
+                var state = lastPlayerState || {};
+
                 switch ((state.PlayState || {}).RepeatMode) {
-                    case 'RepeatNone':
-                        currentPlayer.setRepeatMode('RepeatAll');
-                        break;
                     case 'RepeatAll':
                         currentPlayer.setRepeatMode('RepeatOne');
                         break;
                     case 'RepeatOne':
                         currentPlayer.setRepeatMode('RepeatNone');
                         break;
+                    default:
+                        currentPlayer.setRepeatMode('RepeatAll');
+                        break;
                 }
             }
         })[0];

dashboard-ui/scripts/sections.js

@@ -4,7 +4,7 @@
 
         var deferred = $.Deferred();
 
-        ApiClient.getUserViews(userId).done(function (result) {
+        ApiClient.getUserViews({}, userId).done(function (result) {
 
             var items = result.Items;
 

dashboard-ui/scripts/site.js

@@ -1731,7 +1731,7 @@ var AppInfo = {};
         AppInfo.supportsSyncPathSetting = isCordova && isAndroid;
 
         if (isCordova && isAndroid) {
-            AppInfo.directPlayAudioContainers = "flac,aac,mp3,mpa,wav,wma,mp2,ogg,oga,webma,ape".split(',');
+            AppInfo.directPlayAudioContainers = "flac,aac,mp3,mpa,wav,wma,mp2,ogg,oga,webma,ape,opus".split(',');
             AppInfo.directPlayVideoContainers = "m4v,3gp,ts,mpegts,mov,xvid,vob,mkv,wmv,asf,ogm,ogv,m2v,avi,mpg,mpeg,mp4,webm".split(',');
         } else {
             AppInfo.directPlayAudioContainers = [];

dashboard-ui/scripts/wizardagreement.js

@@ -2,9 +2,9 @@
 
     function onSubmit() {
 
-        var page = $(this).parents('.page');
+        var page = $(this).parents('.page')[0];
 
-        if ($('#chkAccept', page).checked()) {
+        if (page.querySelector('.chkAccept').checked) {
             Dashboard.navigate('wizardfinish.html');
         } else {
 
@@ -17,9 +17,9 @@
         return false;
     }
 
-    $(document).on('pageinitdepends', '#wizardAgreementPage', function(){
+    $(document).on('pageinitdepends', '#wizardAgreementPage', function () {
 
-    	$('.wizardAgreementForm').off('submit', onSubmit).on('submit', onSubmit);
+        $('.wizardAgreementForm').off('submit', onSubmit).on('submit', onSubmit);
     });
 
 })(window, jQuery);

dashboard-ui/scripts/wizardsettings.js

@@ -11,8 +11,8 @@
 
             config.PreferredMetadataLanguage = $('#selectLanguage', page).val();
             config.MetadataCountryCode = $('#selectCountry', page).val();
-            config.SaveLocalMeta = $('#chkSaveLocalMetadata', page).checked();
+            config.SaveLocalMeta = page.querySelector('.chkSaveLocalMetadata').checked;
-            config.EnableInternetProviders = $('#chkEnableInternetProviders', page).checked();
+            config.EnableInternetProviders = page.querySelector('.chkEnableInternetProviders').checked;
 
             apiClient.ajax({
 

dashboard-ui/scripts/wizarduserpage.js

@@ -38,8 +38,8 @@
             type: 'POST',
             data: {
 
-                Name: $('#txtUsername', form).val(),
+                Name: form.querySelector('#txtUsername').value,
-                ConnectUserName: $('#txtConnectUserName', form).val()
+                ConnectUserName: page.querySelector('#txtConnectUserName').value
 
             },
             url: apiClient.getUrl('Startup/User'),
@@ -70,8 +70,8 @@
 
         apiClient.getJSON(apiClient.getUrl('Startup/User')).done(function (user) {
 
-            $('#txtUsername', page).val(user.Name);
+            page.querySelector('#txtUsername').value = user.Name;
-            $('#txtConnectUserName', page).val(user.ConnectUserName);
+            page.querySelector('#txtConnectUserName').value = user.ConnectUserName;
 
             Dashboard.hideLoadingMsg();
         });

dashboard-ui/vulcanize-out.html

@@ -17910,7 +17910,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
             <g id="live-tv"><path d="M21 6h-7.59l3.29-3.29L16 2l-4 4-4-4-.71.71L10.59 6H3c-1.1 0-2 .89-2 2v12c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V8c0-1.11-.9-2-2-2zm0 14H3V8h18v12zM9 10v8l7-4z"></path></g>
             <g id="notifications"><path d="M11.5 22c1.1 0 2-.9 2-2h-4c0 1.1.9 2 2 2zm6.5-6v-5.5c0-3.07-2.13-5.64-5-6.32V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5v.68c-2.87.68-5 3.25-5 6.32V16l-2 2v1h17v-1l-2-2z"></path></g>
             <g id="add-shopping-cart"><path d="M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z"></path></g>
-            <g id="play-circle-filled"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5v-9l6 4.5-6 4.5z"></path></g>
             <g id="folder"><path d="M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"></path></g>
             <g id="mic"><path d="M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm5.3-3c0 3-2.54 5.1-5.3 5.1S6.7 14 6.7 11H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c3.28-.48 6-3.3 6-6.72h-1.7z"></path></g>
             <g id="insert-drive-file"><path d="M6 2c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6H6zm7 7V3.5L18.5 9H13z"></path></g>

dashboard-ui/wizardagreement.html

@@ -11,26 +11,21 @@
             <div class="ui-corner-all ui-shadow wizardContent" style="position:relative;">
                 <form class="wizardAgreementForm">
 
+                    <h1>
+                        <img src="css/images/mblogoicon.png" style="vertical-align:middle;height:30px;margin-right:5px;" />${HeaderTermsOfService}
+                    </h1>
+
+                    <p style="margin-top:2em;">${MessagePleaseAcceptTermsOfService}</p>
+
+                    <p style="margin:1.5em 0;"><a href="http://emby.media/privacy" target="_blank">${ButtonPrivacyPolicy}</a></p>
+                    <p style="margin:1.5em 0;"><a href="http://emby.media/terms" target="_blank">${ButtonTermsOfService}</a></p>
                     <div>
-                        <h2 style="float:left;">
+                        <paper-checkbox class="chkAccept" checked>${OptionIAcceptTermsOfService}</paper-checkbox>
-                            <img src="css/images/mblogoicon.png" />${HeaderTermsOfService}
-                        </h2>
                     </div>
 
-                    <br style="clear:both;" />
-                    <p>${MessagePleaseAcceptTermsOfService}</p>
-
-                    <p><a href="http://emby.media/privacy" target="_blank">${ButtonPrivacyPolicy}</a></p>
-                    <p><a href="http://emby.media/terms" target="_blank">${ButtonTermsOfService}</a></p>
-                    <ul data-role="listview" class="ulForm">
-                        <li>
-                            <label for="chkAccept">${OptionIAcceptTermsOfService}</label>
-                            <input id="chkAccept" type="checkbox" />
-                        </li>
-                    </ul>
-
                     <div class="wizardNavigation">
-                        <button type="submit" data-iconpos="right" data-icon="arrow-r" data-inline="true">${LabelNext}</button>
+                        <button type="button" data-role="none" class="clearButton" style="width:auto;" onclick="history.back();"><paper-button raised class="subdued"><iron-icon icon="arrow-back"></iron-icon><span>${LabelPrevious}</span></paper-button></button>
+                        <button type="submit" data-role="none" class="clearButton" style="width:auto;"><paper-button raised class="accent"><iron-icon icon="arrow-forward"></iron-icon><span>${LabelNext}</span></paper-button></button>
                     </div>
                 </form>
             </div>

dashboard-ui/wizardfinish.html

@@ -9,35 +9,42 @@
         <div data-role="content">
 
             <div class="ui-corner-all ui-shadow wizardContent">
-                <h2>
+                <h1>
-                    <img src="css/images/checkmarkblack.png" />${LabelYoureDone}</h2>
+                    <img src="css/images/mblogoicon.png" style="vertical-align:middle;height:30px;margin-right:5px;" />${LabelYoureDone}
+                </h1>
 
-                <p>${WizardCompleted}</p>
+                <p style="margin:2em 0;">${WizardCompleted}</p>
 
-                <p class="appLinks">
+                <p style="margin:2em 0;" class="appLinks">
                     <a href="http://www.amazon.com/Mark-Linton-Mediabrowser-Android-Client/dp/B00GVH9O0I" target="_blank">
-                        <img src="css/images/clients/amazon.png" title="Android via Amazon App Store" /></a>
+                        <img src="css/images/clients/amazon.png" title="Android via Amazon App Store" />
+                    </a>
                     <a href="https://play.google.com/store/apps/details?id=com.mb.android&hl=en" target="_blank">
-                        <img src="css/images/clients/playstore.png" title="Android via Google Play Store" /></a>
+                        <img src="css/images/clients/playstore.png" title="Android via Google Play Store" />
+                    </a>
                     <a href="https://itunes.apple.com/us/app/media-browser-for-ios/id705058087" target="_blank">
-                        <img src="css/images/clients/ios.png" title="iOS" /></a>
+                        <img src="css/images/clients/ios.png" title="iOS" />
+                    </a>
                     <a href="https://www.roku.com/channels#!details/44191/emby" target="_blank">
                         <img src="css/images/clients/roku.jpg" title="Roku" />
                     </a>
                     <a href="http://www.windowsphone.com/s?appid=f4971ed9-f651-4bf6-84bb-94fd98613b86" target="_blank">
-                        <img src="css/images/clients/windowsphone.png" title="Windows Phone" /></a>
+                        <img src="css/images/clients/windowsphone.png" title="Windows Phone" />
+                    </a>
                     <a href="http://apps.microsoft.com/windows/en-us/app/media-browser/ad55a2f0-9897-47bd-8944-bed3aefd5d06" target="_blank">
-                        <img src="css/images/clients/windowsrt.png" title="Windows 8.1" /></a>
+                        <img src="css/images/clients/windowsrt.png" title="Windows 8.1" />
+                    </a>
                     <a href="http://emby.media" target="_blank" title="Windows Media Center">
-                        <img src="css/images/clients/mbc.png" /></a>
+                        <img src="css/images/clients/mbc.png" />
+                    </a>
                     <a href="http://emby.media/download" target="_blank" title="Kodi">
                         <img src="css/images/clients/kodi.png" />
                     </a>
                 </p>
-                
+
                 <div class="wizardNavigation">
-                    <button type="button" data-iconpos="left" data-icon="arrow-l" data-inline="true" onclick="history.back();">${LabelPrevious}</button>
+                    <button type="button" data-role="none" class="clearButton" style="width:auto;" onclick="history.back();"><paper-button raised class="subdued"><iron-icon icon="arrow-back"></iron-icon><span>${LabelPrevious}</span></paper-button></button>
-                    <button type="button" data-iconpos="right" data-icon="check" data-inline="true" class="btnWizardNext" data-theme="b">${LabelFinish}</button>
+                    <button class="btnWizardNext clearButton" type="button" data-role="none" style="width:auto;"><paper-button raised class="accent"><iron-icon icon="check"></iron-icon><span>${LabelFinish}</span></paper-button></button>
                 </div>
             </div>
 

dashboard-ui/wizardlibrary.html

@@ -11,10 +11,10 @@
             <div class="ui-corner-all ui-shadow wizardContent">
 
                 <div>
-                    <h2 style="display:inline-block;">
+                    <h1 style="display:inline-block;">
-                        <img src="css/images/mblogoicon.png" />${HeaderSetupLibrary}
+                        <img src="css/images/mblogoicon.png" style="height:30px;vertical-align:middle;margin-right:5px;" />${HeaderSetupLibrary}
-                    </h2>
+                    </h1>
-                    <a href="https://github.com/MediaBrowser/Wiki/wiki/Library%20setup" target="_blank" class="clearLink" style="margin-top:-8px;display:inline-block;vertical-align:middle;margin-left:1em;"><paper-button raised class="secondary mini"><i class="fa fa-info-circle"></i>${ButtonHelp}</paper-button></a>
+                    <a href="https://github.com/MediaBrowser/Wiki/wiki/Library%20setup" target="_blank" class="clearLink" style="margin-top:-10px;display:inline-block;vertical-align:middle;margin-left:2em;"><paper-button raised class="secondary mini"><i class="fa fa-info-circle"></i>${ButtonHelp}</paper-button></a>
                 </div>
 
                 <br />
@@ -58,8 +58,8 @@
                 </div>
                 <br />
                 <div class="wizardNavigation">
-                    <button type="button" data-iconpos="left" data-icon="arrow-l" data-inline="true" onclick="history.back();">${LabelPrevious}</button>
+                    <button type="button" data-role="none" class="clearButton" style="width:auto;" onclick="history.back();"><paper-button raised class="subdued"><iron-icon icon="arrow-back"></iron-icon><span>${LabelPrevious}</span></paper-button></button>
-                    <button type="button" data-iconpos="right" data-icon="arrow-r" data-inline="true" onclick="WizardLibraryPage.next();">${LabelNext}</button>
+                    <button type="button" data-role="none" class="clearButton" style="width:auto;" onclick="WizardLibraryPage.next();"><paper-button raised class="accent"><iron-icon icon="arrow-forward"></iron-icon><span>${LabelNext}</span></paper-button></button>
                 </div>
             </div>
 

dashboard-ui/wizardservice.html

@@ -9,18 +9,19 @@
         <div data-role="content">
 
             <div class="ui-corner-all ui-shadow wizardContent">
-                <h2>
+                <h1>
-                    <img src="css/images/mblogoicon.png" />${LabelWindowsService}</h2>
+                    <img src="css/images/mblogoicon.png" style="vertical-align:middle;height:30px;margin-right:5px;" />${LabelWindowsService}
+                </h1>
 
-                <p>${AWindowsServiceHasBeenInstalled}</p>
+                <p style="margin-top:2em;">${AWindowsServiceHasBeenInstalled}</p>
 
                 <p>${WindowsServiceIntro1}</p>
 
                 <p>${WindowsServiceIntro2}</p>
 
                 <div class="wizardNavigation">
-                    <button type="button" data-iconpos="left" data-icon="arrow-l" data-inline="true" onclick="history.back();">${LabelPrevious}</button>
+                    <button type="button" data-role="none" class="clearButton" style="width:auto;" onclick="history.back();"><paper-button raised class="subdued"><iron-icon icon="arrow-back"></iron-icon><span>${LabelPrevious}</span></paper-button></button>
-                    <button id="btnNextPage" type="button" data-iconpos="right" data-icon="arrow-r" data-inline="true">${LabelNext}</button>
+                    <button id="btnNextPage" type="button" data-role="none" class="clearButton" style="width:auto;"><paper-button raised class="accent"><iron-icon icon="arrow-forward"></iron-icon><span>${LabelNext}</span></paper-button></button>
                 </div>
             </div>
 

dashboard-ui/wizardsettings.html

@@ -10,23 +10,19 @@
 
             <div class="ui-corner-all ui-shadow wizardContent">
                 <form class="wizardSettingsForm">
-                    <h2>
+                    <h1>
-                        <img src="css/images/mblogoicon.png" />${LabelConfigureSettings}
+                        <img src="css/images/mblogoicon.png" style="vertical-align:middle;height:30px;margin-right:5px;" />${LabelConfigureSettings}
-                    </h2>
+                    </h1>
-
+                    <div style="margin: 3em 0;">
-                    <br />
+                        <paper-checkbox class="chkEnableInternetProviders" checked>${LabelDownloadInternetMetadata}</paper-checkbox>
-                    <div style="margin: 1em 0;">
+                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelDownloadInternetMetadataHelp}</div>
-                        <input type="checkbox" id="chkEnableInternetProviders" name="chkEnableInternetProviders" checked="checked" />
-                        <label for="chkEnableInternetProviders">${LabelDownloadInternetMetadata}</label>
-                        <div class="fieldDescription">${LabelDownloadInternetMetadataHelp}</div>
                     </div>
                     <div style="margin: 2em 0;">
-                        <label for="chkSaveLocalMetadata">${LabelSaveLocalMetadata}</label>
+                        <paper-checkbox class="chkSaveLocalMetadata">${LabelSaveLocalMetadataHelp}</paper-checkbox>
-                        <input id="chkSaveLocalMetadata" name="chkSaveLocalMetadata" type="checkbox" />
+                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelSaveLocalMetadataHelp}</div>
-                        <div class="fieldDescription">${LabelSaveLocalMetadataHelp}</div>
                     </div>
 
-                    <h2 style="margin-top: 1.5em;">${HeaderPreferredMetadataLanguage}</h2>
+                    <h1 style="margin-top: 1.5em;">${HeaderPreferredMetadataLanguage}</h1>
 
                     <div style="margin: 2em 0;">
                         <label for="selectLanguage">${LabelLanguage}</label>
@@ -39,8 +35,8 @@
                     </div>
 
                     <div class="wizardNavigation">
-                        <button type="button" data-iconpos="left" data-icon="arrow-l" data-inline="true" onclick="history.back();">${LabelPrevious}</button>
+                        <button type="button" data-role="none" class="clearButton" style="width:auto;" onclick="history.back();"><paper-button raised class="subdued"><iron-icon icon="arrow-back"></iron-icon><span>${LabelPrevious}</span></paper-button></button>
-                        <button id="btnNextPage" type="submit" data-iconpos="right" data-icon="arrow-r" data-inline="true">${LabelNext}</button>
+                        <button type="submit" data-role="none" class="clearButton" style="width:auto;"><paper-button raised class="accent"><iron-icon icon="arrow-forward"></iron-icon><span>${LabelNext}</span></paper-button></button>
                     </div>
                 </form>
             </div>

dashboard-ui/wizardstart.html

@@ -12,15 +12,15 @@
                 <form class="wizardStartForm">
 
                     <div>
-                        <h2 style="float:left;">
+                        <h1 style="float:left;">
-                            <img src="css/images/mblogoicon.png" />${WelcomeToProject}
+                            <img src="css/images/mblogoicon.png" style="vertical-align:middle;height:30px;margin-right:5px;" />${WelcomeToProject}
-                        </h2>
+                        </h1>
                         <a href="https://github.com/MediaBrowser/Wiki/wiki/Quick%20start" target="_blank" class="clearLink" style="float:right;margin-top:20px;"><paper-button raised class="secondary mini"><i class="fa fa-info-circle"></i>${ButtonQuickStartGuide}</paper-button></a>
                     </div>
 
                     <br style="clear:both;" />
                     <p>${ThisWizardWillGuideYou}</p>
-
+                    <br />
                     <ul data-role="listview" class="ulForm">
                         <li>
                             <label for="selectLocalizationLanguage">${LabelPreferredDisplayLanguage}</label>
@@ -28,8 +28,8 @@
                         </li>
                     </ul>
 
-                    <div class="wizardNavigation">
+                    <div class="wizardNavigation" style="text-align:right;">
-                        <button type="submit" data-iconpos="right" data-icon="arrow-r" data-inline="true">${LabelNext}</button>
+                        <button type="submit" data-role="none" class="clearButton" style="width:auto;"><paper-button raised class="accent"><iron-icon icon="arrow-forward"></iron-icon><span>${LabelNext}</span></paper-button></button>
                     </div>
                 </form>
             </div>

dashboard-ui/wizarduser.html

@@ -10,35 +10,30 @@
 
             <div class="ui-corner-all ui-shadow wizardContent">
                 <form class="wizardUserForm">
-                    <h2>
+                    <h1>
-                        <img src="css/images/mblogoicon.png" style="height: 30px;" />${TellUsAboutYourself}
+                        <img src="css/images/mblogoicon.png" style="height: 30px;vertical-align:middle;margin-right:5px;" />${TellUsAboutYourself}
-                    </h2>
+                    </h1>
 
-                    <p>${UserProfilesIntro}</p>
+                    <p style="margin-top:2em;">${UserProfilesIntro}</p>
 
-                    <ul data-role="listview" class="ulForm">
+                    <div>
-                        <li>
+                        <paper-input type="text" id="txtUsername" label="${LabelYourFirstName}" required="required"></paper-input>
-                            <label for="txtUsername">${LabelYourFirstName}</label>
+                        <div class="fieldDescription">${MoreUsersCanBeAddedLater}</div>
-                            <input type="text" id="txtUsername" name="txtUsername" required="required" />
+                    </div>
-                            <div class="fieldDescription">${MoreUsersCanBeAddedLater}</div>
+                    <br />
-                        </li>
+                    <h1 style="margin-bottom:.25em;">${HeaderOptionalLinkEmbyAccount}</h1>
-                    </ul>
+                    <div>
-                    <h2>${HeaderOptionalLinkEmbyAccount}</h2>
+                        <paper-input type="text" id="txtConnectUserName" label="${LabelConnectUserName}"></paper-input>
+                        <div class="fieldDescription">
+                            <div>${LabelConnectUserNameHelp}</div>
+                            <div style="margin-top: .7em;"><a href="http://emby.media/connect" target="_blank">${ButtonLearnMoreAboutEmbyConnect}</a></div>
+                        </div>
+                    </div>
+                    <br />
                     <br />
-                    <ul data-role="listview" class="ulForm">
-                        <li>
-                            <label for="txtConnectUserName">${LabelConnectUserName}</label>
-                            <input id="txtConnectUserName" type="text" />
-                            <div class="fieldDescription">
-                                <div>${LabelConnectUserNameHelp}</div>
-                                <div style="margin-top: .75em;"><a href="http://emby.media/connect" target="_blank">${ButtonLearnMoreAboutEmbyConnect}</a></div>
-                            </div>
-                        </li>
-                    </ul>
-
                     <div class="wizardNavigation">
-                        <button type="button" data-iconpos="left" data-icon="arrow-l" data-inline="true" onclick="history.back();">${LabelPrevious}</button>
+                        <button type="button" data-role="none" class="clearButton" style="width:auto;"><paper-button raised class="subdued"><iron-icon icon="arrow-back"></iron-icon><span>${LabelPrevious}</span></paper-button></button>
-                        <button type="submit" data-iconpos="right" data-icon="arrow-r" data-inline="true">${LabelNext}</button>
+                        <button type="submit" data-role="none" class="clearButton" style="width:auto;"><paper-button raised class="accent"><iron-icon icon="arrow-forward"></iron-icon><span>${LabelNext}</span></paper-button></button>
                     </div>
                 </form>
             </div>