From 6daaed3bccf22a6f57eed43c70786c26a2ddd9a1 Mon Sep 17 00:00:00 2001
From: Luke Pulverenti <luke.pulverenti@gmail.com>
Date: Sun, 19 Apr 2015 11:54:20 -0400
Subject: [PATCH] added a photo view

---
 dashboard-ui/css/card.css                |   1 +
 dashboard-ui/css/librarybrowser.css      |   1 +
 dashboard-ui/edititemmetadata.html       |   6 +
 dashboard-ui/itemdetails.html            |   7 +
 dashboard-ui/photos.html                 |  24 +++
 dashboard-ui/scripts/edititemmetadata.js |  10 +-
 dashboard-ui/scripts/indexpage.js        |   3 +-
 dashboard-ui/scripts/itemdetailpage.js   |  16 +-
 dashboard-ui/scripts/librarybrowser.js   |  10 +-
 dashboard-ui/scripts/moviecollections.js |   2 +-
 dashboard-ui/scripts/photos.js           | 233 +++++++++++++++++++++++
 11 files changed, 301 insertions(+), 12 deletions(-)
 create mode 100644 dashboard-ui/photos.html
 create mode 100644 dashboard-ui/scripts/photos.js
diff --git a/dashboard-ui/css/card.css b/dashboard-ui/css/card.css
index bc2dca1e2a..266ed1f7f9 100644
--- a/dashboard-ui/css/card.css
+++ b/dashboard-ui/css/card.css
@@ -22,6 +22,7 @@
     background-color: rgba(0, 0, 0, .85);
     z-index: 998;
     display: none;
+    line-height: initial;
 }
 
 .cardOverlayInner {
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css
index 9d331279f9..32131bdf6c 100644
--- a/dashboard-ui/css/librarybrowser.css
+++ b/dashboard-ui/css/librarybrowser.css
@@ -859,6 +859,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
     color: #fff;
     background: rgb(0, 143, 187);
     background: rgba(0, 143, 187, .8);
+    line-height: initial;
 }
 
 .offlinePosterRibbon {
diff --git a/dashboard-ui/edititemmetadata.html b/dashboard-ui/edititemmetadata.html
index 336d2a2c2a..46e4ac7c77 100644
--- a/dashboard-ui/edititemmetadata.html
+++ b/dashboard-ui/edititemmetadata.html
@@ -36,6 +36,12 @@
                                     <button id="btnDelete" type="button" data-icon="delete" data-mini="true" data-inline="true">${ButtonDelete}</button>
                                 </div>
                             </div>
+                            <div style="display: inline-block;vertical-align:middle;margin-left: 1em;" class="hide">
+                                <div id="refreshLoading" style="display:none;">
+                                    <div class="circle1" style="top:-10px;"></div>
+                                    <div style="margin-top: -15px;"></div>
+                                </div>
+                            </div>
                         </div>
 
                         <div style="padding: 10px 0;">
diff --git a/dashboard-ui/itemdetails.html b/dashboard-ui/itemdetails.html
index 64a43b3a0b..f0c76ed506 100644
--- a/dashboard-ui/itemdetails.html
+++ b/dashboard-ui/itemdetails.html
@@ -40,6 +40,13 @@
                 <a href="moviestudios.html">${TabStudios}</a>
             </div>
         </div>
+        <div class="itemTabs photoTabs" style="display: none;">
+            <div class="libraryViewNav scopedLibraryViewNav">
+                <a href="photos.html" class="ui-btn-active lnkPhotoAlbums">${TabAlbums}</a>
+                <a href="photos.html?context=photos-photos" class="lnkPhotos">${TabPhotos}</a>
+                <a href="photos.html?context=photos-videos" class="lnkVideos">${TabVideos}</a>
+            </div>
+        </div>
         <div id="tvShowsTabs" class="itemTabs" style="display: none;">
             <div class="libraryViewNav scopedLibraryViewNav">
                 <a href="tvrecommended.html">${TabSuggestions}</a>
diff --git a/dashboard-ui/photos.html b/dashboard-ui/photos.html
new file mode 100644
index 0000000000..338e315dd9
--- /dev/null
+++ b/dashboard-ui/photos.html
@@ -0,0 +1,24 @@
+﻿<!DOCTYPE html>
+<html>
+<head>
+    <title>Emby</title>
+</head>
+<body>
+    <div id="photosPage" data-role="page" class="page libraryPage">
+
+        <div class="libraryViewNav scopedLibraryViewNav">
+            <a href="photos.html" class="ui-btn-active lnkPhotoAlbums">${TabAlbums}</a>
+            <a href="photos.html?context=photos-photos" class="lnkPhotos">${TabPhotos}</a>
+            <a href="photos.html?context=photos-videos" class="lnkVideos">${TabVideos}</a>
+        </div>
+
+        <div data-role="content">
+            <div class="viewSettings">
+                <div class="listTopPaging">
+                </div>
+            </div>
+            <div id="items" class="itemsContainer paddedItemsContainer" style="text-align:center;"></div>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/dashboard-ui/scripts/edititemmetadata.js b/dashboard-ui/scripts/edititemmetadata.js
index 8f0c3cea10..301c6287f6 100644
--- a/dashboard-ui/scripts/edititemmetadata.js
+++ b/dashboard-ui/scripts/edititemmetadata.js
@@ -1338,10 +1338,9 @@
 
     function refreshWithOptions(page, options) {
 
-        ApiClient.refreshItem(currentItem.Id, options).done(function () {
+        $('#refreshLoading', page).show();
 
-            Dashboard.alert(Globalize.translate('MessageRefreshQueued'));
-        });
+        ApiClient.refreshItem(currentItem.Id, options);
     }
 
     function onWebSocketMessageReceived(e, data) {
@@ -1352,8 +1351,11 @@
 
             if (msg.Data.ItemsUpdated.indexOf(currentItem.Id) != -1) {
 
+                var page = $.mobile.activePage;
+
                 console.log('Item updated - reloading metadata');
-                reload($.mobile.activePage);
+                reload(page);
+                $('#refreshLoading', page).hide();
             }
         }
     }
diff --git a/dashboard-ui/scripts/indexpage.js b/dashboard-ui/scripts/indexpage.js
index e7bbd269b5..11f4acca82 100644
--- a/dashboard-ui/scripts/indexpage.js
+++ b/dashboard-ui/scripts/indexpage.js
@@ -227,8 +227,7 @@
                     showTitle: showTitles,
                     centerText: true,
                     lazy: true,
-                    autoThumb: true,
-                    context: 'home'
+                    autoThumb: true
                 });
                 html += '</div>';
             }
diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js
index bef15841d4..ed46d1b2d5 100644
--- a/dashboard-ui/scripts/itemdetailpage.js
+++ b/dashboard-ui/scripts/itemdetailpage.js
@@ -254,7 +254,21 @@
             $('a', elem).removeClass('ui-btn-active');
             $('.lnkHomeLatest', page).addClass('ui-btn-active');
         }
-        else if (context == 'movies' || item.Type == 'Movie' || context == 'movies-trailers') {
+        else if (context == 'photos' || context == 'photos-photos') {
+            elem = $('.photoTabs', page).show();
+            $('a', elem).removeClass('ui-btn-active');
+            $('.lnkHomeLatest', page).addClass('ui-btn-active');
+
+            if (context == 'photos-photos') {
+                $('.lnkPhotos', page).addClass('ui-btn-active');
+            }
+            else if (context == 'photos-videos') {
+                $('.lnkVideos', page).addClass('ui-btn-active');
+            } else {
+                $('.lnkPhotoAlbums', page).addClass('ui-btn-active');
+            }
+        }
+        else if (context == 'movies' || context == 'movies-trailers') {
             elem = $('#movieTabs', page).show();
             $('a', elem).removeClass('ui-btn-active');
 
diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js
index 48aa421ca3..4e50e0ad36 100644
--- a/dashboard-ui/scripts/librarybrowser.js
+++ b/dashboard-ui/scripts/librarybrowser.js
@@ -484,10 +484,6 @@
                     return 'collections.html?topParentId=' + item.Id;
                 }
 
-                if (item.CollectionType == 'trailers') {
-                    return "itemlist.html?parentId=" + item.Id;
-                }
-
                 if (item.CollectionType == 'tvshows') {
                     return 'tvrecommended.html?topParentId=' + item.Id;
                 }
@@ -502,11 +498,17 @@
                 if (item.CollectionType == 'playlists') {
                     return 'playlists.html?topParentId=' + item.Id;
                 }
+                if (item.CollectionType == 'photos') {
+                    return 'photos.html?topParentId=' + item.Id;
+                }
             }
             if (item.Type == 'CollectionFolder') {
                 return 'itemlist.html?topParentId=' + item.Id + '&parentid=' + item.Id;
             }
 
+            if (item.Type == "PhotoAlbum" && context == 'photos') {
+                return "photos.html?parentId=" + id;
+            }
             if (item.Type == "Playlist") {
                 return "playlistedit.html?id=" + id;
             }
diff --git a/dashboard-ui/scripts/moviecollections.js b/dashboard-ui/scripts/moviecollections.js
index 2ef0cd8480..85407c0383 100644
--- a/dashboard-ui/scripts/moviecollections.js
+++ b/dashboard-ui/scripts/moviecollections.js
@@ -492,7 +492,7 @@
 
             var invalidTypes = ['Person', 'Genre', 'MusicGenre', 'Studio', 'GameGenre', 'BoxSet', 'Playlist', 'UserView', 'CollectionFolder', 'Audio', 'Episode'];
 
-            return item.LocationType == 'FileSystem' && !item.CollectionType && invalidTypes.indexOf(item.Type) == -1;
+            return item.LocationType == 'FileSystem' && !item.CollectionType && invalidTypes.indexOf(item.Type) == -1 && item.MediaType != 'Photo';
         }
     };
 
diff --git a/dashboard-ui/scripts/photos.js b/dashboard-ui/scripts/photos.js
new file mode 100644
index 0000000000..1bd004c034
--- /dev/null
+++ b/dashboard-ui/scripts/photos.js
@@ -0,0 +1,233 @@
+﻿(function ($, document) {
+
+    var view = LibraryBrowser.getDefaultItemsView('Poster', 'Poster');
+
+    // The base query options
+    var query = {
+
+        SortBy: "SortName",
+        SortOrder: "Ascending",
+        Fields: "PrimaryImageAspectRatio,SortName,SyncInfo",
+        StartIndex: 0,
+        ImageTypeLimit: 1,
+        EnableImageTypes: "Primary"
+    };
+
+    function getSavedQueryKey() {
+
+        return 'photos' + (query.ParentId || '');
+    }
+
+    function reloadItems(page) {
+
+        Dashboard.showLoadingMsg();
+
+        ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) {
+
+            // Scroll back up so they can see the results from the beginning
+            $(document).scrollTop(0);
+
+            var html = '';
+            var pagingHtml = LibraryBrowser.getQueryPagingHtml({
+                startIndex: query.StartIndex,
+                limit: query.Limit,
+                totalRecordCount: result.TotalRecordCount,
+                viewButton: false,
+                showLimit: false
+            });
+
+            $('.listTopPaging', page).html(pagingHtml).trigger('create');
+
+            updateFilterControls(page);
+
+            // Poster
+            html = LibraryBrowser.getPosterViewHtml({
+                items: result.Items,
+                shape: "auto",
+                context: getParameterByName('context') || 'photos',
+                showTitle: false,
+                centerText: true,
+                lazy: true
+            });
+
+            var elem = $('#items', page).html(html).lazyChildren();
+
+            $(pagingHtml).appendTo(elem).trigger('create');
+
+            $('.btnNextPage', page).on('click', function () {
+                query.StartIndex += query.Limit;
+                reloadItems(page);
+            });
+
+            $('.btnPreviousPage', page).on('click', function () {
+                query.StartIndex -= query.Limit;
+                reloadItems(page);
+            });
+
+            LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
+
+            Dashboard.hideLoadingMsg();
+        });
+    }
+
+    function updateFilterControls(page) {
+
+        // Reset form values using the last used query
+        $('.radioSortBy', page).each(function () {
+
+            this.checked = (query.SortBy || '').toLowerCase() == this.getAttribute('data-sortby').toLowerCase();
+
+        }).checkboxradio('refresh');
+
+        $('.radioSortOrder', page).each(function () {
+
+            this.checked = (query.SortOrder || '').toLowerCase() == this.getAttribute('data-sortorder').toLowerCase();
+
+        }).checkboxradio('refresh');
+
+        $('.chkStandardFilter', page).each(function () {
+
+            var filters = "," + (query.Filters || "");
+            var filterName = this.getAttribute('data-filter');
+
+            this.checked = filters.indexOf(',' + filterName) != -1;
+
+        }).checkboxradio('refresh');
+    }
+
+    var filtersLoaded;
+    function reloadFiltersIfNeeded(page) {
+
+        if (!filtersLoaded) {
+
+            filtersLoaded = true;
+
+            QueryFilters.loadFilters(page, Dashboard.getCurrentUserId(), query, function () {
+
+                reloadItems(page);
+            });
+        }
+    }
+
+    function setQueryPerContext(page) {
+
+        var context = getParameterByName('context');
+
+        $('.libraryViewNav a', page).removeClass('ui-btn-active');
+
+        if (context == 'photos-photos') {
+            query.Recursive = true;
+            query.MediaTypes = 'Photo';
+            $('.lnkPhotos', page).addClass('ui-btn-active');
+        }
+        else if (context == 'photos-videos') {
+            query.Recursive = true;
+            query.MediaTypes = 'Video';
+            $('.lnkVideos', page).addClass('ui-btn-active');
+        }
+        else {
+            query.Recursive = false;
+            query.MediaTypes = null;
+            $('.lnkPhotoAlbums', page).addClass('ui-btn-active');
+        }
+
+        query.ParentId = getParameterByName('parentId') || LibraryMenu.getTopParentId();
+    }
+
+    $(document).on('pageinit', "#photosPage", function () {
+
+        var page = this;
+
+        $('.viewPanel', page).on('panelopen', function () {
+
+            reloadFiltersIfNeeded(page);
+        });
+
+        $('.radioSortBy', this).on('click', function () {
+            query.SortBy = this.getAttribute('data-sortby');
+            query.StartIndex = 0;
+            reloadItems(page);
+        });
+
+        $('.radioSortOrder', this).on('click', function () {
+            query.SortOrder = this.getAttribute('data-sortorder');
+            query.StartIndex = 0;
+            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;
+            query.StartIndex = 0;
+            reloadItems(page);
+        });
+
+        $('#radioBasicFilters', this).on('change', function () {
+
+            if (this.checked) {
+                $('.basicFilters', page).show();
+                $('.advancedFilters', page).hide();
+            } else {
+                $('.basicFilters', page).hide();
+            }
+        });
+
+        $('#radioAdvancedFilters', this).on('change', function () {
+
+            if (this.checked) {
+                $('.advancedFilters', page).show();
+                $('.basicFilters', page).hide();
+            } else {
+                $('.advancedFilters', page).hide();
+            }
+        });
+
+        $('#selectPageSize', page).on('change', function () {
+            query.Limit = parseInt(this.value);
+            query.StartIndex = 0;
+            reloadItems(page);
+        });
+
+    }).on('pagebeforeshow', "#photosPage", function () {
+
+        var page = this;
+
+        setQueryPerContext(page);
+
+        var limit = LibraryBrowser.getDefaultPageSize();
+
+        // If the default page size has changed, the start index will have to be reset
+        if (limit != query.Limit) {
+            query.Limit = limit;
+            query.StartIndex = 0;
+        }
+
+        var viewKey = getSavedQueryKey();
+
+        LibraryBrowser.loadSavedQueryValues(viewKey, query);
+        QueryFilters.onPageShow(page, query);
+
+        LibraryBrowser.getSavedViewSetting(viewKey).done(function (val) {
+
+            if (val) {
+                $('#selectView', page).val(val).selectmenu('refresh').trigger('change');
+            } else {
+                reloadItems(page);
+            }
+        });
+
+    }).on('pageshow', "#photosPage", function () {
+
+        updateFilterControls(this);
+    });
+
+})(jQuery, document);
\ No newline at end of file
