diff --git a/dashboard-ui/scripts/tvshows.js b/dashboard-ui/scripts/tvshows.js
index 5f282702bb..03152e8b1b 100644
--- a/dashboard-ui/scripts/tvshows.js
+++ b/dashboard-ui/scripts/tvshows.js
@@ -1 +1,157 @@
-
\ No newline at end of file
+(function ($, document) {
+
+	// The base query options
+	var query = {
+
+		SortBy: "SortName",
+		SortOrder: "Ascending",
+		IncludeItemTypes: "Episode",
+		Recursive: true,
+		Fields: "PrimaryImageAspectRatio,SeriesInfo"
+	};
+
+	function getTableHtml(items) {
+
+		var html = '<div class="libraryItemsGridContainer"><table data-role="table" data-mode="reflow" class="ui-responsive table-stroke libraryItemsGrid">';
+
+		html += '<thead>';
+
+		html += '<tr>';
+		html += '<th>&nbsp;</th>';
+		html += '<th>Name</th>';
+		html += '<th>Year</th>';
+		html += '<th>Official Rating</th>';
+		html += '<th>Runtime</th>';
+		html += '<th>Community Rating</th>';
+		html += '</tr>';
+
+		html += '</thead>';
+
+		html += '<tbody>';
+
+		for (var i = 0, length = items.length; i < length; i++) {
+
+			html += getRowHtml(items[i]);
+		}
+
+		html += '</tbody>';
+
+		html += '</table></div>';
+
+		return html;
+	}
+
+	function getRowHtml(item) {
+
+		var html = '<tr>';
+
+		html += '<td>';
+
+		var url = "itemdetails.html?id=" + item.Id;
+
+		var imageTags = item.ImageTags;
+
+		html += '<a href="' + url + '">';
+
+		if (imageTags.Primary) {
+
+			html += '<img class="libraryGridImage" src="' + ApiClient.getImageUrl(item.Id, {
+				type: "Primary",
+				height: 150,
+				tag: item.ImageTags.Primary
+			}) + '" />';
+
+		}
+		else {
+			html += '<img class="libraryGridImage" style="background:' + LibraryBrowser.getMetroColor(item.Id) + ';" src="css/images/items/list/collection.png" />';
+		}
+
+		html += '</a></td>';
+
+		html += '<td><a href="' + url + '">' + item.Name + '</a></td>';
+
+		html += '<td>' + (item.ProductionYear || "") + '</td>';
+
+		html += '<td>' + (item.OfficialRating || "") + '</td>';
+		html += '<td>' + (item.RunTimeTicks || "") + '</td>';
+		html += '<td>' + (item.CommunityRating || "") + '</td>';
+
+		html += '</tr>';
+		return html;
+	}
+
+	function reloadItems(page) {
+
+		Dashboard.showLoadingMsg();
+
+		ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) {
+
+			$('#items', page).html(LibraryBrowser.getEpisodePosterViewHtml({
+
+				items: result.Items,
+				useAverageAspectRatio: true
+
+			}))/*.html(getTableHtml(result.Items)).trigger('create')*/;
+
+			Dashboard.hideLoadingMsg();
+		});
+	}
+
+	$(document).on('pageinit', "#tvShowsPage", function () {
+
+		var page = this;
+
+		$('.radioSortBy', this).on('click', function () {
+			query.SortBy = this.getAttribute('data-sortby');
+			reloadItems(page);
+		});
+
+		$('.radioSortOrder', this).on('click', function () {
+			query.SortOrder = this.getAttribute('data-sortorder');
+			reloadItems(page);
+		});
+
+		$('.chkStandardFilter', this).on('change', function () {
+
+			var filterName = this.getAttribute('data-filter');
+			var filters = query.Filters || "";
+
+			filters = (',' + filters).replace(',' + filterName, '').substring(1);
+
+			if (this.checked) {
+				filters = filters ? (filters + ',' + filterName) : filterName;
+			}
+
+			query.Filters = filters;
+
+			reloadItems(page);
+		});
+
+	}).on('pageshow', "#tvShowsPage", function () {
+
+			reloadItems(this);
+
+			// Reset form values using the last used query
+			$('.radioSortBy', this).each(function () {
+
+				this.checked = query.SortBy == this.getAttribute('data-sortby');
+
+			}).checkboxradio('refresh');
+
+			$('.radioSortOrder', this).each(function () {
+
+				this.checked = query.SortOrder == this.getAttribute('data-sortorder');
+
+			}).checkboxradio('refresh');
+
+			$('.chkStandardFilter', this).each(function () {
+
+				var filters = "," + (query.Filters || "");
+				var filterName = this.getAttribute('data-filter');
+
+				this.checked = filters.indexOf(',' + filterName) != -1;
+
+			}).checkboxradio('refresh');
+		});
+
+})(jQuery, document);
\ No newline at end of file
diff --git a/dashboard-ui/tvshows.html b/dashboard-ui/tvshows.html
index 0610c366f8..531463a3ad 100644
--- a/dashboard-ui/tvshows.html
+++ b/dashboard-ui/tvshows.html
@@ -1,14 +1,81 @@
 <!DOCTYPE html>
 <html>
 <head>
-    <title>Media Browser</title>
+	<title>Media Browser</title>
 </head>
 <body>
-    <div id="tvShowsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a">
-        <h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
-            <img src="css/images/home.png"></a>TV Shows</h1>
-        <div data-role="content">
-        </div>
-    </div>
+<div id="tvShowsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a">
+	<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
+		<img src="css/images/home.png"></a>TV Shows</h1>
+	<div data-role="content">
+		<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
+			<a href="tvrecommended.html" data-role="button" class="ui-btn-active">Recommended</a>
+			<a href="tvshows.html" data-role="button">Shows</a>
+			<a href="#" data-role="button">Genres</a>
+			<a href="#" data-role="button">Actors</a>
+		</div>
+		<div class="viewSettings">
+			<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>
+			<button data-mini="true" data-icon="filter" data-inline="true" onclick="$('#filterPanel', $.mobile.activePage).panel( 'toggle' );">Filter</button>
+		</div>
+		<div id="items"></div>
+	</div>
+	<div data-role="panel" id="sortPanel" data-position="right" data-display="overlay" data-theme="b" data-position-fixed="true">
+
+		<form>
+			<div id="sortpanel">
+				<fieldset data-role="controlgroup">
+					<legend>
+						<h3>Sort By:</h3>
+					</legend>
+
+					<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioSortName" value="on" checked="checked" data-sortby="SortName">
+					<label for="radioSortName">Name</label>
+
+					<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioCommunityRating" value="off" data-sortby="CommunityRating">
+					<label for="radioCommunityRating">Community Rating</label>
+
+					<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioDateCreated" value="off" data-sortby="DateCreated">
+					<label for="radioDateCreated">Date Added</label>
+
+					<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioPremiereDate" value="off" data-sortby="PremiereDate">
+					<label for="radioPremiereDate">Premiere Date</label>
+
+					<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioRuntime" value="off" data-sortby="Runtime">
+					<label for="radioRuntime">Runtime</label>
+				</fieldset>
+
+				<fieldset data-role="controlgroup">
+					<legend>
+						<h3>Sort Order:</h3>
+					</legend>
+
+					<input class="radioSortOrder" data-theme="c" type="radio" name="radioSortOrder" id="radioAscending" value="on" checked="checked" data-sortorder="Ascending">
+					<label for="radioAscending">Ascending</label>
+
+					<input class="radioSortOrder" data-theme="c" type="radio" name="radioSortOrder" id="radioDescending" value="off" data-sortorder="Descending">
+					<label for="radioDescending">Descending</label>
+				</fieldset>
+			</div>
+		</form>
+	</div>
+	<div data-role="panel" id="filterPanel" data-position="right" data-display="overlay" data-theme="b" data-position-fixed="true">
+		<form>
+			<fieldset data-role="controlgroup">
+				<legend>
+					<h3>Filters:</h3>
+				</legend>
+				<input class="chkStandardFilter" type="checkbox" name="chkIsFavorite" id="chkIsFavorite" data-theme="c" data-filter="IsFavorite">
+				<label for="chkIsFavorite">Favorite</label>
+
+				<input class="chkStandardFilter" type="checkbox" name="chkLikes" id="chkLikes" data-theme="c" data-filter="Likes">
+				<label for="chkLikes">Likes</label>
+
+				<input class="chkStandardFilter" type="checkbox" name="chkDislikes" id="chkDislikes" data-theme="c" data-filter="Dislikes">
+				<label for="chkDislikes">Dislikes</label>
+			</fieldset>
+		</form>
+	</div>
+</div>
 </body>
 </html>