From 39020714f75b1bd1fe41355d4e9dadc9620ed8a1 Mon Sep 17 00:00:00 2001
From: LukePulverenti <luke.pulverenti@gmail.com>
Date: Mon, 11 Mar 2013 10:54:08 -0400
Subject: [PATCH] live saving on the metadata pages

---
 .../Playback/Progressive/VideoService.cs      |   1 +
 .../Html/advancedMetadata.html                |   7 +-
 MediaBrowser.WebDashboard/Html/metadata.html  |  17 +--
 .../Html/metadataImages.html                  | 137 +++++++++---------
 .../AdvancedMetadataConfigurationPage.js      |  10 +-
 .../Html/scripts/MetadataConfigurationPage.js |   8 +-
 .../Html/scripts/MetadataImagesPage.js        |   8 +-
 7 files changed, 99 insertions(+), 89 deletions(-)

diff --git a/MediaBrowser.Api/Playback/Progressive/VideoService.cs b/MediaBrowser.Api/Playback/Progressive/VideoService.cs
index d8ffa61fdc..10455c0288 100644
--- a/MediaBrowser.Api/Playback/Progressive/VideoService.cs
+++ b/MediaBrowser.Api/Playback/Progressive/VideoService.cs
@@ -20,6 +20,7 @@ namespace MediaBrowser.Api.Playback.Progressive
     [Route("/Videos/{Id}/stream.mkv", "GET")]
     [Route("/Videos/{Id}/stream.mpeg", "GET")]
     [Route("/Videos/{Id}/stream.avi", "GET")]
+    [Route("/Videos/{Id}/stream.m2ts", "GET")]
     [Route("/Videos/{Id}/stream", "GET")]
     [ServiceStack.ServiceHost.Api(Description = "Gets a video stream")]
     public class GetVideoStream : VideoStreamRequest
diff --git a/MediaBrowser.WebDashboard/Html/advancedMetadata.html b/MediaBrowser.WebDashboard/Html/advancedMetadata.html
index 60e02ba3c0..6ea3d7e74b 100644
--- a/MediaBrowser.WebDashboard/Html/advancedMetadata.html
+++ b/MediaBrowser.WebDashboard/Html/advancedMetadata.html
@@ -21,13 +21,10 @@
                             <label>Disable internet providers for:</label>
                             <div id="divItemTypes"></div>
                         </li>
-                        <li>
-                            <button type="submit" data-theme="b">
+                        <li style="display: none;">
+                            <button class="btnSubmit" type="submit" data-theme="b">
                                 Save
                             </button>
-                            <button type="button" onclick="Dashboard.navigate('dashboard.html');">
-                                Cancel
-                            </button>
                         </li>
                     </ul>
                 </form>
diff --git a/MediaBrowser.WebDashboard/Html/metadata.html b/MediaBrowser.WebDashboard/Html/metadata.html
index 4618dd4bd8..28fd7dedd0 100644
--- a/MediaBrowser.WebDashboard/Html/metadata.html
+++ b/MediaBrowser.WebDashboard/Html/metadata.html
@@ -18,32 +18,29 @@
                 <form id="metadataConfigurationForm">
                     <ul data-role="listview" class="ulForm">
                         <li>
-                            <input type="checkbox" id="chkEnableInternetProviders" name="chkEnableInternetProviders" />
+                            <input type="checkbox" id="chkEnableInternetProviders" name="chkEnableInternetProviders" onchange="MetadataConfigurationPage.submit();" />
                             <label for="chkEnableInternetProviders">Download metadata from the internet </label>
                         </li>
                         <li>
-                            <input type="checkbox" id="chkSaveLocal" name="chkSaveLocal" />
+                            <input type="checkbox" id="chkSaveLocal" name="chkSaveLocal onchange="MetadataConfigurationPage.submit();" />
                             <label for="chkSaveLocal">Save metadata within media folders </label>
                         </li>
                         <li>
                             <label for="txtRefreshDays">Metadata refresh period (days): </label>
-                            <input type="number" id="txtRefreshDays" name="txtRefreshDays" pattern="[0-9]*" required="required" min="1" />
+                            <input type="number" id="txtRefreshDays" name="txtRefreshDays" pattern="[0-9]*" required="required" min="1" onchange="MetadataConfigurationPage.submit();" />
                         </li>
                         <li>
                             <label for="selectLanguage">Preferred language: </label>
-                            <select name="selectLanguage" id="selectLanguage"></select>
+                            <select name="selectLanguage" id="selectLanguage" onchange="MetadataConfigurationPage.submit();"></select>
                         </li>
                         <li>
                             <label for="selectCountry">Country: </label>
-                            <select name="selectCountry" id="selectCountry"></select>
+                            <select name="selectCountry" id="selectCountry" onchange="MetadataConfigurationPage.submit();"></select>
                         </li>
-                        <li>
-                            <button type="submit" data-theme="b">
+                        <li style="display: none;">
+                            <button class="btnSubmit" type="submit" data-theme="b">
                                 Save
                             </button>
-                            <button type="button" onclick="Dashboard.navigate('dashboard.html');">
-                                Cancel
-                            </button>
                         </li>
                     </ul>
                 </form>
diff --git a/MediaBrowser.WebDashboard/Html/metadataImages.html b/MediaBrowser.WebDashboard/Html/metadataImages.html
index b06a3205b7..0197af43da 100644
--- a/MediaBrowser.WebDashboard/Html/metadataImages.html
+++ b/MediaBrowser.WebDashboard/Html/metadataImages.html
@@ -18,7 +18,7 @@
                 <form id="metadataImagesConfigurationForm">
                     <ul data-role="listview" class="ulForm">
                         <li>
-                            <input type="checkbox" id="chkRefreshItemImages" name="chkRefreshItemImages" />
+                            <input type="checkbox" id="chkRefreshItemImages" name="chkRefreshItemImages" onchange="MetadataImagesPage.submit();" />
                             <label for="chkRefreshItemImages">Refresh existing images </label>
                             <div class="fieldDescription">
                                 When enabled, images will be refreshed periodically
@@ -26,100 +26,100 @@
                         </li>
                         <li>
                             <label for="txtNumbackdrops">Max number of backdrops per item: </label>
-                            <input type="number" id="txtNumbackdrops" name="txtNumbackdrops" pattern="[0-9]*" required="required" min="1" />
+                            <input type="number" id="txtNumbackdrops" name="txtNumbackdrops" pattern="[0-9]*" required="required" min="1" onchange="MetadataImagesPage.submit();" />
                         </li>
                         <li>
                             <label>Enable additional image downloading:</label>
-                                
-                                <div data-role="collapsible">
-                                    <h3>Movies</h3>
-                                    <div data-role="controlgroup">
-                                        <input type="checkbox" data-mini="true" id="chkDownloadMovieArt" name="chkDownloadMovieArt" />
-                                        <label for="chkDownloadMovieArt">Movie Art</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadMovieBanner" name="chkDownloadMovieBanner" />
-                                        <label for="chkDownloadMovieBanner">Movie Banner</label>
+                            <div data-role="collapsible">
+                                <h3>Movies</h3>
+                                <div data-role="controlgroup">
+                                    <input type="checkbox" data-mini="true" id="chkDownloadMovieArt" name="chkDownloadMovieArt" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadMovieArt">Movie Art</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadMovieDisc" name="chkDownloadMovieDisc" />
-                                        <label for="chkDownloadMovieDisc">Movie Disc</label>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadMovieBanner" name="chkDownloadMovieBanner" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadMovieBanner">Movie Banner</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadMovieLogo" name="chkDownloadMovieLogo" />
-                                        <label for="chkDownloadMovieLogo">Movie Logo</label>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadMovieDisc" name="chkDownloadMovieDisc" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadMovieDisc">Movie Disc</label>
+
+                                    <input type="checkbox" data-mini="true" id="chkDownloadMovieLogo" name="chkDownloadMovieLogo" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadMovieLogo">Movie Logo</label>
+
+                                    <input type="checkbox" data-mini="true" id="chkDownloadMovieThumb" name="chkDownloadMovieThumb" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadMovieThumb">Movie Thumb</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadMovieThumb" name="chkDownloadMovieThumb" />
-                                        <label for="chkDownloadMovieThumb">Movie Thumb</label>
 
-                                        
-                                    </div>
                                 </div>
+                            </div>
 
-                                <div data-role="collapsible">
-                                    <h3>TV Series</h3>
-                                    <div data-role="controlgroup">
-                                        <input type="checkbox" data-mini="true" id="chKDownloadTVArt" name="chKDownloadTVArt" />
-                                        <label for="chKDownloadTVArt">TV Series Art</label>
+                            <div data-role="collapsible">
+                                <h3>TV Series</h3>
+                                <div data-role="controlgroup">
+                                    <input type="checkbox" data-mini="true" id="chKDownloadTVArt" name="chKDownloadTVArt" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chKDownloadTVArt">TV Series Art</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadTVBanner" name="chkDownloadTVBanner" />
-                                        <label for="chkDownloadTVBanner">TV Series Banner</label>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadTVBanner" name="chkDownloadTVBanner" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadTVBanner">TV Series Banner</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadTVLogo" name="chkDownloadTVLogo" />
-                                        <label for="chkDownloadTVLogo">TV Series Logo</label>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadTVLogo" name="chkDownloadTVLogo" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadTVLogo">TV Series Logo</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadTVThumb" name="chkDownloadTVThumb" />
-                                        <label for="chkDownloadTVThumb">TV Series Thumb</label>
-                                    </div>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadTVThumb" name="chkDownloadTVThumb" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadTVThumb">TV Series Thumb</label>
                                 </div>
+                            </div>
 
 
-                                <div data-role="collapsible">
-                                    <h3>TV Seasons</h3>
-                                    <div data-role="controlgroup">
-                                        <input type="checkbox" data-mini="true" id="chkDownloadSeasonBackdrops" name="chkDownloadSeasonBackdrops" />
-                                        <label for="chkDownloadSeasonBackdrops">TV Season Backdrops</label>
-
-                                        <input type="checkbox" data-mini="true" id="chkDownloadSeasonBanner" name="chkDownloadSeasonBanner" />
-                                        <label for="chkDownloadSeasonBanner">TV Season Banner</label>
+                            <div data-role="collapsible">
+                                <h3>TV Seasons</h3>
+                                <div data-role="controlgroup">
+                                    <input type="checkbox" data-mini="true" id="chkDownloadSeasonBackdrops" name="chkDownloadSeasonBackdrops" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadSeasonBackdrops">TV Season Backdrops</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadSeasonThumb" name="chkDownloadSeasonThumb" />
-                                        <label for="chkDownloadSeasonThumb">TV Season Thumb</label>
-                                    </div>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadSeasonBanner" name="chkDownloadSeasonBanner" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadSeasonBanner">TV Season Banner</label>
 
+                                    <input type="checkbox" data-mini="true" id="chkDownloadSeasonThumb" name="chkDownloadSeasonThumb" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadSeasonThumb">TV Season Thumb</label>
                                 </div>
 
-                                <div data-role="collapsible">
-                                    <h3>Music Artists</h3>
-                                    <div data-role="controlgroup">
-                                        <input type="checkbox" data-mini="true" id="chkDownloadArtistThumb" name="chkDownloadArtistThumb" />
-                                        <label for="chkDownloadArtistThumb">Music Artist Thumb (primary image)</label>
+                            </div>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadArtistBackdrops" name="chkDownloadArtistBackdrops" />
-                                        <label for="chkDownloadArtistBackdrops">Music Artist Backdrops</label>
+                            <div data-role="collapsible">
+                                <h3>Music Artists</h3>
+                                <div data-role="controlgroup">
+                                    <input type="checkbox" data-mini="true" id="chkDownloadArtistThumb" name="chkDownloadArtistThumb" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadArtistThumb">Music Artist Thumb (primary image)</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadArtistLogo" name="chkDownloadArtistLogo" />
-                                        <label for="chkDownloadArtistLogo">Music Artist Logo</label>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadArtistBackdrops" name="chkDownloadArtistBackdrops" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadArtistBackdrops">Music Artist Backdrops</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadArtistBanner" name="chkDownloadArtistBanner" />
-                                        <label for="chkDownloadArtistBanner">Music Artist Banner</label>
-                                    </div>
+                                    <input type="checkbox" data-mini="true" id="chkDownloadArtistLogo" name="chkDownloadArtistLogo" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadArtistLogo">Music Artist Logo</label>
 
+                                    <input type="checkbox" data-mini="true" id="chkDownloadArtistBanner" name="chkDownloadArtistBanner" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadArtistBanner">Music Artist Banner</label>
                                 </div>
-                                
-                                <div data-role="collapsible">
-                                    <h3>Music Albums</h3>
-                                    <div data-role="controlgroup">
-                                        <input type="checkbox" data-mini="true" id="chkDownloadAlbumPrimary" name="chkDownloadAlbumPrimary" />
-                                        <label for="chkDownloadAlbumPrimary">Music Album Cover</label>
 
-                                        <input type="checkbox" data-mini="true" id="chkDownloadAlbumBackdrops" name="chkDownloadAlbumBackdrops" />
-                                        <label for="chkDownloadAlbumBackdrops">Music Album Backdrops</label>
-                                    </div>
+                            </div>
+
+                            <div data-role="collapsible">
+                                <h3>Music Albums</h3>
+                                <div data-role="controlgroup">
+                                    <input type="checkbox" data-mini="true" id="chkDownloadAlbumPrimary" name="chkDownloadAlbumPrimary" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadAlbumPrimary">Music Album Cover</label>
 
+                                    <input type="checkbox" data-mini="true" id="chkDownloadAlbumBackdrops" name="chkDownloadAlbumBackdrops" onchange="MetadataImagesPage.submit();" />
+                                    <label for="chkDownloadAlbumBackdrops">Music Album Backdrops</label>
                                 </div>
 
+                            </div>
+
                         </li>
                         <li>
                             <label for="selectTmdbPosterDownloadSize">Tmdb poster download size: </label>
-                            <select id="selectTmdbPosterDownloadSize" name="selectTmdbPosterDownloadSize">
+                            <select id="selectTmdbPosterDownloadSize" name="selectTmdbPosterDownloadSize" onchange="MetadataImagesPage.submit();">
                                 <option value="original">original</option>
                                 <option value="w92">w92</option>
                                 <option value="w154">w154</option>
@@ -130,7 +130,7 @@
                         </li>
                         <li>
                             <label for="selectTmdbBackdropDownloadSize">Tmdb backdrop download size: </label>
-                            <select id="selectTmdbBackdropDownloadSize" name="selectTmdbBackdropDownloadSize">
+                            <select id="selectTmdbBackdropDownloadSize" name="selectTmdbBackdropDownloadSize" onchange="MetadataImagesPage.submit();">
                                 <option value="original">original</option>
                                 <option value="w380">w380</option>
                                 <option value="w780">w780</option>
@@ -139,20 +139,17 @@
                         </li>
                         <li>
                             <label for="selectTmdbPersonImageDownloadSize">Tmdb person image download size: </label>
-                            <select id="selectTmdbPersonImageDownloadSize" name="selectTmdbPersonImageDownloadSize">
+                            <select id="selectTmdbPersonImageDownloadSize" name="selectTmdbPersonImageDownloadSize" onchange="MetadataImagesPage.submit();">
                                 <option value="original">original</option>
                                 <option value="w45">w45</option>
                                 <option value="w185">w185</option>
                                 <option value="h632">h632</option>
                             </select>
                         </li>
-                        <li>
-                            <button type="submit" data-theme="b">
+                        <li style="display: none;">
+                            <button class="btnSubmit" type="submit" data-theme="b">
                                 Save
                             </button>
-                            <button type="button" onclick="Dashboard.navigate('dashboard.html');">
-                                Cancel
-                            </button>
                         </li>
                     </ul>
                 </form>
diff --git a/MediaBrowser.WebDashboard/Html/scripts/AdvancedMetadataConfigurationPage.js b/MediaBrowser.WebDashboard/Html/scripts/AdvancedMetadataConfigurationPage.js
index 73ed3f4311..8b89add10a 100644
--- a/MediaBrowser.WebDashboard/Html/scripts/AdvancedMetadataConfigurationPage.js
+++ b/MediaBrowser.WebDashboard/Html/scripts/AdvancedMetadataConfigurationPage.js
@@ -33,7 +33,7 @@
 
             var checkedAttribute = configuration.InternetProviderExcludeTypes.indexOf(type) != -1 ? ' checked="checked"' : '';
 
-            html += '<input' + checkedAttribute + ' class="chkItemType" data-itemtype="' + type + '" type="checkbox" name="' + id + '" id="' + id + '" />';
+            html += '<input' + checkedAttribute + ' class="chkItemType" data-itemtype="' + type + '" type="checkbox" name="' + id + '" id="' + id + '" onchange="AdvancedMetadataConfigurationPage.submit();" />';
             html += '<label for="' + id + '">' + type + '</label>';
         }
 
@@ -42,6 +42,12 @@
         $('#divItemTypes', page).html(html).trigger("create");
     },
 
+    submit: function () {
+
+        $('.btnSubmit', $.mobile.activePage)[0].click();
+
+    },
+
     onSubmit: function () {
         Dashboard.showLoadingMsg();
 
@@ -54,7 +60,7 @@
                 return currentCheckbox.getAttribute('data-itemtype');
             });
 
-            ApiClient.updateServerConfiguration(config).done(Dashboard.processServerConfigurationUpdateResult);
+            ApiClient.updateServerConfiguration(config);
         });
 
         // Disable default form submission
diff --git a/MediaBrowser.WebDashboard/Html/scripts/MetadataConfigurationPage.js b/MediaBrowser.WebDashboard/Html/scripts/MetadataConfigurationPage.js
index e68940b832..f7a9ba07b2 100644
--- a/MediaBrowser.WebDashboard/Html/scripts/MetadataConfigurationPage.js
+++ b/MediaBrowser.WebDashboard/Html/scripts/MetadataConfigurationPage.js
@@ -79,6 +79,12 @@
         $('#selectLanguage', '#metadataConfigurationPage').html(html).selectmenu("refresh");
     },
 
+    submit: function () {
+
+        $('.btnSubmit', $.mobile.activePage)[0].click();
+
+    },
+
     onSubmit: function () {
         Dashboard.showLoadingMsg();
 
@@ -92,7 +98,7 @@
             config.PreferredMetadataLanguage = $('#selectLanguage', form).val();
             config.MetadataCountryCode = $('#selectCountry', form).val();
 
-            ApiClient.updateServerConfiguration(config).done(Dashboard.processServerConfigurationUpdateResult);
+            ApiClient.updateServerConfiguration(config);
         });
 
         // Disable default form submission
diff --git a/MediaBrowser.WebDashboard/Html/scripts/MetadataImagesPage.js b/MediaBrowser.WebDashboard/Html/scripts/MetadataImagesPage.js
index 0dff46c398..e09172d36e 100644
--- a/MediaBrowser.WebDashboard/Html/scripts/MetadataImagesPage.js
+++ b/MediaBrowser.WebDashboard/Html/scripts/MetadataImagesPage.js
@@ -42,6 +42,12 @@
         Dashboard.hideLoadingMsg();
     },
 
+    submit: function () {
+
+        $('.btnSubmit', $.mobile.activePage)[0].click();
+
+    },
+
     onSubmit: function () {
         Dashboard.showLoadingMsg();
 
@@ -75,7 +81,7 @@
             config.DownloadMusicAlbumImages.Primary = $('#chkDownloadAlbumPrimary', form).checked();
             config.DownloadMusicAlbumImages.Backdrops = $('#chkDownloadAlbumBackdrops', form).checked();
 
-            ApiClient.updateServerConfiguration(config).done(Dashboard.processServerConfigurationUpdateResult);
+            ApiClient.updateServerConfiguration(config);
         });
 
         // Disable default form submission