From ccf1871c0840db40c7e55c86aa1660fa52aca2b4 Mon Sep 17 00:00:00 2001
From: Luke Pulverenti <luke.pulverenti@gmail.com>
Date: Mon, 20 Jan 2014 11:09:53 -0500
Subject: [PATCH] #680 - Support new episode file sorting

---
 dashboard-ui/css/librarybrowser.css          |  10 +-
 dashboard-ui/css/posteritem.css              |   4 +-
 dashboard-ui/dashboard.html                  |   2 +-
 dashboard-ui/library.html                    |   2 +-
 dashboard-ui/libraryfileorganizer.html       | 173 +++++++++++++++++++
 dashboard-ui/librarysettings.html            |   2 +-
 dashboard-ui/scripts/itemdetailpage.js       |  14 +-
 dashboard-ui/scripts/libraryfileorganizer.js | 128 ++++++++++++++
 dashboard-ui/scripts/livetvchannel.js        |   3 -
 dashboard-ui/scripts/livetvchannels.js       |   2 +-
 dashboard-ui/scripts/livetvguide.js          |   3 -
 dashboard-ui/scripts/livetvprogram.js        |  13 +-
 dashboard-ui/scripts/livetvrecording.js      |   9 +
 dashboard-ui/scripts/livetvseriestimer.js    |  14 +-
 dashboard-ui/scripts/mediaplayer.js          |   2 +-
 15 files changed, 345 insertions(+), 36 deletions(-)
 create mode 100644 dashboard-ui/libraryfileorganizer.html
 create mode 100644 dashboard-ui/scripts/libraryfileorganizer.js

diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css
index ecb49ff54..b7ab994e0 100644
--- a/dashboard-ui/css/librarybrowser.css
+++ b/dashboard-ui/css/librarybrowser.css
@@ -599,7 +599,7 @@ a.itemTag:hover {
 
 .detailImageProgressContainer {
     position: absolute;
-    bottom: 6px;
+    bottom: 7px;
     right: 0;
     left: 0;
     text-align: center;
@@ -608,7 +608,7 @@ a.itemTag:hover {
     .detailImageProgressContainer progress {
         width: 100%;
         margin: 0 auto;
-        height: 6px;
+        height: 7px;
     }
 
 @media all and (max-width: 550px) {
@@ -978,12 +978,6 @@ a.itemTag:hover {
     background-color: #cc3333;
 }
 
-.userDataIcons .itemProgressBar {
-    vertical-align: top;
-    position: relative;
-    top: 3px;
-}
-
 .tileItem .itemProgressBar {
     top: 2px;
     width: 40px;
diff --git a/dashboard-ui/css/posteritem.css b/dashboard-ui/css/posteritem.css
index 06c7abc10..9c1b8ce5f 100644
--- a/dashboard-ui/css/posteritem.css
+++ b/dashboard-ui/css/posteritem.css
@@ -180,11 +180,11 @@
 
 .miniPosterItemProgress {
     /* Make sure it's on top of the fade gradient '*/
-    z-index: 10;
+    z-index: 1000;
 }
 
     .miniPosterItemProgress .itemProgressBar {
-        height: 7px;
+        height: 8px;
         opacity: 1;
     }
 
diff --git a/dashboard-ui/dashboard.html b/dashboard-ui/dashboard.html
index 807a3f1ea..3acfabc0f 100644
--- a/dashboard-ui/dashboard.html
+++ b/dashboard-ui/dashboard.html
@@ -76,7 +76,7 @@
                         </div>
 
                         <div id="contribute" style="margin-top: 4em; display: none;">
-                            <h2 style="margin:0 0 .35em;">Help Improve Media Browser</h2>
+                            <h2 style="margin: 0 0 .35em;">Help Improve Media Browser</h2>
                             <div>
                                 <form name="_xclick" action="https://www.paypal.com/cgi-bin/webscr"
                                     method="post">
diff --git a/dashboard-ui/library.html b/dashboard-ui/library.html
index 9ee9e4f8c..7473fe034 100644
--- a/dashboard-ui/library.html
+++ b/dashboard-ui/library.html
@@ -9,7 +9,7 @@
         <div data-role="content">
             <div class="content-primary">
                 <div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
-                    <a href="#" data-role="button" class="ui-btn-active">Media</a>
+                    <a href="#" data-role="button" class="ui-btn-active">Media Folders</a>
                     <a href="librarysettings.html" data-role="button">Settings</a>
                 </div>
                 <div class="readOnlyContent">
diff --git a/dashboard-ui/libraryfileorganizer.html b/dashboard-ui/libraryfileorganizer.html
new file mode 100644
index 000000000..d721b9b0c
--- /dev/null
+++ b/dashboard-ui/libraryfileorganizer.html
@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Media Library</title>
+</head>
+<body>
+    <div id="libraryFileOrganizerPage" data-role="page" class="page type-interior mediaLibraryPage">
+
+        <div data-role="content">
+            <div class="content-primary">
+                <div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
+                    <a href="library.html" data-role="button">Media Folders</a>
+                    <a href="librarysettings.html" data-role="button">Settings</a>
+                    <a href="#" data-role="button" class="ui-btn-active">File Organizer</a>
+                </div>
+
+                <form class="libraryFileOrganizerForm">
+
+                    <p>File organizing allows the server to monitor your download folders for new files and move them to your media directories.</p>
+
+                    <div data-role="controlgroup" data-type="horizontal" data-mini="true" class="sortingTabs" style="display: none;">
+                        <input type="radio" name="radioSortingSettingsTab" class="radioSortingSettingsTab" id="radioTvSortingSettings" value="tv" checked="checked">
+                        <label for="radioTvSortingSettings">TV Sorting</label>
+                        <input type="radio" name="radioSortingSettingsTab" class="radioSortingSettingsTab" id="radioMovieSortingSettings" value="movies">
+                        <label for="radioMovieSortingSettings">Movie Sorting</label>
+                    </div>
+                    <div class="tvTab tab">
+                        <p>TV file organizing will only add episodes to existing series. It will not create new series folders.</p>
+                        <ul data-role="listview" class="ulForm" style="margin-bottom: 0!important;">
+                            <li>
+                                <input type="checkbox" id="chkEnableTvSorting" name="chkEnableTvSorting" />
+                                <label for="chkEnableTvSorting">Enable new episode organization</label>
+                            </li>
+                            <li>
+                                <label for="txtWatchFolder">Watch folder: </label>
+                                <div style="display: inline-block; width: 92%;">
+                                    <input type="text" id="txtWatchFolder" name="txtWatchFolder" />
+                                </div>
+                                <button id="btnSelectWatchFolder" type="button" data-icon="search" data-iconpos="notext" data-inline="true">Select Directory</button>
+                                <div class="fieldDescription">
+                                    The server will poll this folder during the "Organize new media files" <a href="scheduledtasks.html">scheduled task</a>.
+                                </div>
+                            </li>
+                            <li>
+                                <label for="txtMinFileSize">Minimum file size (MB): </label>
+                                <input type="number" id="txtMinFileSize" name="txtMinFileSize" pattern="[0-9]*" required="required" min="0" data-mini="true" />
+                            </li>
+                            <li>
+                                <label for="txtSeasonFolderPattern">Season folder pattern: </label>
+                                <input type="text" id="txtSeasonFolderPattern" name="txtSeasonFolderPattern" required="required" data-mini="true" />
+                                <div class="fieldDescription seasonFolderFieldDescription"></div>
+                            </li>
+                            <li>
+                                <label for="txtSeasonZeroName">Season zero folder name: </label>
+                                <input type="text" id="txtSeasonZeroName" name="txtSeasonZeroName" required="required" data-mini="true" />
+                            </li>
+                        </ul>
+                        <div data-role="collapsible">
+                            <h3>Episode file pattern</h3>
+                            <div>
+                                <br />
+                                <div>
+                                    <label for="txtEpisodePattern">Episode pattern: </label>
+                                    <input type="text" id="txtEpisodePattern" name="txtEpisodePattern" required="required" data-mini="true" />
+                                    <div class="fieldDescription episodePatternDescription"></div>
+                                </div>
+
+                                <p>Supported Patterns</p>
+
+                                <table data-role="table" id="movie-table" data-mode="reflow" class="ui-responsive">
+                                    <thead>
+                                        <tr>
+                                            <th>Term</th>
+                                            <th>Pattern</th>
+                                            <th>Result</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr>
+                                            <th>Series Name</th>
+                                            <td>%sn</td>
+                                            <td>Series Name</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Series Name</th>
+                                            <td>%s.n</td>
+                                            <td>Series.Name</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Series Name</th>
+                                            <td>%s_n</td>
+                                            <td>Series_Name</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Season Number</th>
+                                            <td>%s</td>
+                                            <td>1</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Season Number</th>
+                                            <td>%0s</td>
+                                            <td>01</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Episode Number</th>
+                                            <td>%e</td>
+                                            <td>4</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Episode Number</th>
+                                            <td>%0e</td>
+                                            <td>04</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Episode Name</th>
+                                            <td>%en</td>
+                                            <td>Episode Name</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Episode Name</th>
+                                            <td>%e.n</td>
+                                            <td>Episode.Name</td>
+                                        </tr>
+                                        <tr>
+                                            <th>Episode Name</th>
+                                            <td>%e_n</td>
+                                            <td>Episode_Name</td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+
+                            </div>
+                        </div>
+                        <br />
+                        <ul data-role="listview" class="ulForm">
+                            <li>
+                                <input type="checkbox" id="chkOverwriteExistingEpisodes" name="chkOverwriteExistingEpisodes" />
+                                <label for="chkOverwriteExistingEpisodes">Overwrite existing episodes</label>
+                            </li>
+                            <li>
+                                <input type="checkbox" id="chkDeleteEmptyFolders" name="chkDeleteEmptyFolders" />
+                                <label for="chkDeleteEmptyFolders">Delete empty folders after organizing</label>
+                            </li>
+                            <li>
+                                <input type="checkbox" id="chkEnableTrialMode" name="chkEnableTrialMode" />
+                                <label for="chkEnableTrialMode">Enable trial mode</label>
+                                <div class="fieldDescription">With trial mode enabled, file organizations will be logged but not executed.</div>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <ul data-role="listview" class="ulForm">
+                        <li>
+                            <button type="submit" data-theme="b" data-icon="check" data-mini="true">
+                                Save
+                            </button>
+                            <button type="button" onclick="Dashboard.navigate('dashboard.html');" data-icon="delete" data-mini="true">
+                                Cancel
+                            </button>
+                        </li>
+
+                    </ul>
+                </form>
+
+            </div>
+        </div>
+
+        <script type="text/javascript">
+            $('.libraryFileOrganizerForm').off('submit', LibraryFileOrganizerPage.onSubmit).on('submit', LibraryFileOrganizerPage.onSubmit);
+        </script>
+    </div>
+</body>
+</html>
diff --git a/dashboard-ui/librarysettings.html b/dashboard-ui/librarysettings.html
index 810d509b3..021de11d7 100644
--- a/dashboard-ui/librarysettings.html
+++ b/dashboard-ui/librarysettings.html
@@ -9,7 +9,7 @@
         <div data-role="content">
             <div class="content-primary">
                 <div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
-                    <a href="library.html" data-role="button">Media</a>
+                    <a href="library.html" data-role="button">Media Folders</a>
                     <a href="#" data-role="button" class="ui-btn-active">Settings</a>
                 </div>
 
diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js
index 8022d5177..39bad760d 100644
--- a/dashboard-ui/scripts/itemdetailpage.js
+++ b/dashboard-ui/scripts/itemdetailpage.js
@@ -83,7 +83,7 @@
                 $('#playButtonContainer', page).hide();
                 $('#playExternalButtonContainer', page).hide();
             }
-            
+
             if (item.LocalTrailerCount && item.LocationType !== "Offline") {
                 $('#trailerButtonContainer', page).show();
             } else {
@@ -407,15 +407,13 @@
                     continue;
                 }
 
-                var friendlyTypeName = item.Type == "Audio" ? "song" : item.Type.toLowerCase();
-
                 if (curr.IndexNumber < item.IndexNumber) {
 
-                    $('.lnkPreviousItem', page).removeClass('hide').attr('href', 'itemdetails.html?id=' + curr.Id).html('← Previous ' + friendlyTypeName);
+                    $('.lnkPreviousItem', page).removeClass('hide').attr('href', 'itemdetails.html?id=' + curr.Id).html('← Previous');
                 }
                 else if (curr.IndexNumber > item.IndexNumber) {
 
-                    $('.lnkNextItem', page).removeClass('hide').attr('href', 'itemdetails.html?id=' + curr.Id).html('Next ' + friendlyTypeName + ' →');
+                    $('.lnkNextItem', page).removeClass('hide').attr('href', 'itemdetails.html?id=' + curr.Id).html('Next' + ' →');
                 }
             }
         });
@@ -531,12 +529,12 @@
     function renderChildren(page, item, user) {
 
         var fields = "ItemCounts,DateCreated,AudioInfo,PrimaryImageAspectRatio";
-        
+
         var query = {
             ParentId: item.Id,
             Fields: fields
         };
-        
+
         // Let the server pre-sort boxsets
         if (item.Type !== "BoxSet") {
             query.SortBy = "SortName";
@@ -1127,7 +1125,7 @@
         });
 
         $('#btnPlayTrailer', page).on('click', function () {
-            
+
             ApiClient.getLocalTrailers(Dashboard.getCurrentUserId(), currentItem.Id).done(function (trailers) {
 
                 MediaPlayer.play(trailers);
diff --git a/dashboard-ui/scripts/libraryfileorganizer.js b/dashboard-ui/scripts/libraryfileorganizer.js
new file mode 100644
index 000000000..4148967bf
--- /dev/null
+++ b/dashboard-ui/scripts/libraryfileorganizer.js
@@ -0,0 +1,128 @@
+(function ($, document, window) {
+    
+    function updateSeasonPatternHelp(page, value) {
+        
+        var replacementHtmlResult = 'Result: ' + value.replace('%s', '1').replace('%0s', '01').replace('%00s', '001');
+
+        $('.seasonFolderFieldDescription', page).html(replacementHtmlResult);
+    }
+
+    function updateEpisodePatternHelp(page, value) {
+
+        var seriesName = "Series Name";
+        var episodeTitle = "Episode Four";
+        
+        value = value.replace('%sn', seriesName)
+            .replace('%s.n', seriesName.replace(' ', '.'))
+            .replace('%s_n', seriesName.replace(' ', '_'))
+            .replace('%s', '1')
+            .replace('%0s', '01')
+            .replace('%00s', '001')
+            .replace('%ext', 'mkv')
+            .replace('%en', episodeTitle)
+            .replace('%e.n', episodeTitle.replace(' ', '.'))
+            .replace('%e_n', episodeTitle.replace(' ', '_'))
+            .replace('%e', '4')
+            .replace('%0e', '04')
+            .replace('%00e', '004');
+        
+        var replacementHtmlResult = 'Result: ' + value;
+
+        $('.episodePatternDescription', page).html(replacementHtmlResult);
+    }
+
+    function loadPage(page, config) {
+
+        var tvOptions = config.TvFileOrganizationOptions;
+
+        $('#chkEnableTvSorting', page).checked(tvOptions.IsEnabled).checkboxradio('refresh');
+        $('#chkOverwriteExistingEpisodes', page).checked(tvOptions.OverwriteExistingEpisodes).checkboxradio('refresh');
+        $('#chkDeleteEmptyFolders', page).checked(tvOptions.DeleteEmptyFolders).checkboxradio('refresh');
+        $('#chkEnableTrialMode', page).checked(tvOptions.EnableTrialMode).checkboxradio('refresh');
+
+        $('#txtMinFileSize', page).val(tvOptions.MinFileSizeMb);
+        $('#txtSeasonFolderPattern', page).val(tvOptions.SeasonFolderPattern).trigger('change');
+        $('#txtSeasonZeroName', page).val(tvOptions.SeasonZeroFolderName);
+        $('#txtWatchFolder', page).val(tvOptions.WatchLocations[0] || '');
+
+        $('#txtEpisodePattern', page).val(tvOptions.EpisodeNamePattern).trigger('change');
+    }
+    
+    $(document).on('pageinit', "#libraryFileOrganizerPage", function () {
+
+        var page = this;
+
+        $('#txtSeasonFolderPattern', page).on('change keypress', function() {
+
+            updateSeasonPatternHelp(page, this.value);
+
+        });
+
+        $('#txtEpisodePattern', page).on('change keypress', function () {
+
+            updateEpisodePatternHelp(page, this.value);
+
+        });
+
+        $('#btnSelectWatchFolder', page).on("click.selectDirectory", function () {
+
+            var picker = new DirectoryBrowser(page);
+
+            picker.show({
+
+                callback: function (path) {
+
+                    if (path) {
+                        $('#txtWatchFolder', page).val(path);
+                    }
+                    picker.close();
+                },
+
+                header: "Select Watch Folder",
+
+                instruction: "Browse or enter the path to your watch folder. The folder must be writeable."
+            });
+        });
+
+    }).on('pageshow', "#libraryFileOrganizerPage", function () {
+
+        var page = this;
+
+        ApiClient.getServerConfiguration().done(function (config) {
+            loadPage(page, config);
+        });
+    });
+
+    window.LibraryFileOrganizerPage = {
+      
+        onSubmit: function() {
+
+            var form = this;
+
+            ApiClient.getServerConfiguration().done(function (config) {
+                
+                var tvOptions = config.TvFileOrganizationOptions;
+
+                tvOptions.IsEnabled = $('#chkEnableTvSorting', form).checked();
+                tvOptions.OverwriteExistingEpisodes = $('#chkOverwriteExistingEpisodes', form).checked();
+                tvOptions.DeleteEmptyFolders = $('#chkDeleteEmptyFolders', form).checked();
+                tvOptions.EnableTrialMode = $('#chkEnableTrialMode', form).checked();
+
+                tvOptions.MinFileSizeMb = $('#txtMinFileSize', form).val();
+                tvOptions.SeasonFolderPattern = $('#txtSeasonFolderPattern', form).val();
+                tvOptions.SeasonZeroFolderName = $('#txtSeasonZeroName', form).val();
+
+                tvOptions.EpisodeNamePattern = $('#txtEpisodePattern', form).val();
+
+                var watchLocation = $('#txtWatchFolder', form).val();
+                tvOptions.WatchLocations = watchLocation ? [watchLocation] : [];
+
+                ApiClient.updateServerConfiguration(config).done(Dashboard.processServerConfigurationUpdateResult);
+            });
+
+            return false;
+        }
+
+    };
+
+})(jQuery, document, window);
diff --git a/dashboard-ui/scripts/livetvchannel.js b/dashboard-ui/scripts/livetvchannel.js
index fd03333d0..7e0177b4b 100644
--- a/dashboard-ui/scripts/livetvchannel.js
+++ b/dashboard-ui/scripts/livetvchannel.js
@@ -57,9 +57,6 @@
 
             var name = program.Name;
 
-            if (program.IsRepeat) {
-                name += " (R)";
-            }
             html += '<div class="tvProgramName">' + name + '</div>';
 
             html += '<div class="tvProgramTime">';
diff --git a/dashboard-ui/scripts/livetvchannels.js b/dashboard-ui/scripts/livetvchannels.js
index a77cd7871..593258456 100644
--- a/dashboard-ui/scripts/livetvchannels.js
+++ b/dashboard-ui/scripts/livetvchannels.js
@@ -10,7 +10,7 @@
         return LibraryBrowser.getPosterViewHtml({
             items: channels,
             useAverageAspectRatio: true,
-            shape: "backdrop",
+            shape: "smallBackdrop",
             centerText: true
         });
     }
diff --git a/dashboard-ui/scripts/livetvguide.js b/dashboard-ui/scripts/livetvguide.js
index 591c78e54..cecbeb0ed 100644
--- a/dashboard-ui/scripts/livetvguide.js
+++ b/dashboard-ui/scripts/livetvguide.js
@@ -257,9 +257,6 @@
                 html += '<div class="guideProgramName">';
                 html += program.Name;
 
-                if (program.IsRepeat) {
-                    html += ' (R)';
-                }
                 html += '</div>';
 
                 html += '<div class="guideProgramTime">';
diff --git a/dashboard-ui/scripts/livetvprogram.js b/dashboard-ui/scripts/livetvprogram.js
index 9a7c25e21..230b3fb9b 100644
--- a/dashboard-ui/scripts/livetvprogram.js
+++ b/dashboard-ui/scripts/livetvprogram.js
@@ -32,10 +32,6 @@
 
             var name = item.Name;
             
-            if (item.IsRepeat) {
-                name += ' (R)';
-            }
-
             $('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item));
 
             Dashboard.setPageTitle(name);
@@ -127,6 +123,15 @@
             deleteTimer(page, currentItem.TimerId);
         });
 
+        $('#btnRemote', page).on('click', function () {
+
+            RemoteControl.showMenuForItem({
+
+                item: currentItem,
+                context: 'livetv'
+            });
+        });
+
     }).on('pageshow', "#liveTvProgramPage", function () {
 
         var page = this;
diff --git a/dashboard-ui/scripts/livetvrecording.js b/dashboard-ui/scripts/livetvrecording.js
index cc1fc7b9b..9eab912b8 100644
--- a/dashboard-ui/scripts/livetvrecording.js
+++ b/dashboard-ui/scripts/livetvrecording.js
@@ -107,6 +107,15 @@
         $('#btnDelete', page).on('click', deleteRecording);
         $('#btnPlay', page).on('click', play);
 
+        $('#btnRemote', page).on('click', function () {
+
+            RemoteControl.showMenuForItem({
+
+                item: currentItem,
+                context: 'livetv'
+            });
+        });
+
     }).on('pagebeforeshow', "#liveTvRecordingPage", function () {
 
         var page = this;
diff --git a/dashboard-ui/scripts/livetvseriestimer.js b/dashboard-ui/scripts/livetvseriestimer.js
index 13dd646ef..10c74ca7b 100644
--- a/dashboard-ui/scripts/livetvseriestimer.js
+++ b/dashboard-ui/scripts/livetvseriestimer.js
@@ -172,12 +172,20 @@
 
             html += '<h3>';
             html += program.EpisodeTitle || timer.Name;
-            if (program.IsRepeat) {
-                html += ' (R)';
-            }
             html += '</h3>';
 
             html += '<p>';
+            
+            if (program.IsLive) {
+                html += '<span class="liveTvProgram">LIVE&nbsp;&nbsp;</span>';
+            }
+            else if (program.IsPremiere) {
+                html += '<span class="premiereTvProgram">PREMIERE&nbsp;&nbsp;</span>';
+            }
+            else if (program.IsSeries && !program.IsRepeat) {
+                html += '<span class="newTvProgram">NEW&nbsp;&nbsp;</span>';
+            }
+
             html += LiveTvHelpers.getDisplayTime(timer.StartDate);
             html += ' - ' + LiveTvHelpers.getDisplayTime(timer.EndDate);
             html += '</p>';
diff --git a/dashboard-ui/scripts/mediaplayer.js b/dashboard-ui/scripts/mediaplayer.js
index 11203d4f5..c8464a957 100644
--- a/dashboard-ui/scripts/mediaplayer.js
+++ b/dashboard-ui/scripts/mediaplayer.js
@@ -1720,7 +1720,7 @@
                     }
                 }
 
-                html += '<div class="mediaFlyoutOptionName">' + (language || 'Unknown language') + '</div>';
+                html += '<div class="mediaFlyoutOptionName">' + (language || stream.Language || 'Unknown language') + '</div>';
 
                 var options = [];