Merge pull request #683 from dkanada/codec

Minor playback improvements and a few icon and string fixes

.ci/azure-pipelines.yml

@@ -20,24 +20,21 @@ jobs:
 
     steps:
     - task: NodeTool@0
-      displayName: 'Install Node.js'
+      displayName: 'Install Node'
       inputs:
         versionSpec: '10.x'
 
-    - script: |
+    - script: 'yarn install'
-        yarn install
+      displayName: 'Install Dependencies'
-      displayName: 'Install dependencies'
 
-    - script: |
+    - script: 'test -d dist'
-        test -d dist
+      displayName: 'Check Build'
-      displayName: 'Check dist directory'
 
-    - script: |
+    - script: 'yarn pack --filename jellyfin-web.tgz'
-        yarn pack --filename jellyfin-web.tgz
+      displayName: 'Bundle Release'
-      displayName: 'Build package'
 
     - task: PublishPipelineArtifact@1
-      displayName: 'Publish package'
+      displayName: 'Publish Release'
       condition: succeeded()
       inputs:
         targetPath: '$(Build.SourcesDirectory)/jellyfin-web.tgz'
@@ -51,14 +48,12 @@ jobs:
 
     steps:
     - task: NodeTool@0
-      displayName: 'Install Node.js'
+      displayName: 'Install Node'
       inputs:
         versionSpec: '10.x'
 
-    - script: |
+    - script: 'yarn install'
-        yarn install
+      displayName: 'Install Dependencies'
-      displayName: 'Install dependencies'
 
-    - script: |
+    - script: 'yarn run lint'
-        yarn run lint
       displayName: 'Run ESLint'

src/components/htmlvideoplayer/plugin.js

@@ -95,23 +95,19 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
     }
 
     function getMediaStreamAudioTracks(mediaSource) {
-
         return mediaSource.MediaStreams.filter(function (s) {
             return s.Type === 'Audio';
         });
     }
 
     function getMediaStreamTextTracks(mediaSource) {
-
         return mediaSource.MediaStreams.filter(function (s) {
             return s.Type === 'Subtitle';
         });
     }
 
     function zoomIn(elem) {
-
         return new Promise(function (resolve, reject) {
-
             var duration = 240;
             elem.style.animation = 'htmlvideoplayer-zoomin ' + duration + 'ms ease-in normal';
             dom.addEventListener(elem, dom.whichAnimationEvent(), resolve, {
@@ -1429,7 +1425,6 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
                         if (!appHost.supports('htmlvideoautoplay')) {
                             html += '<video class="' + cssClass + '" preload="metadata" autoplay="autoplay" controls="controls" webkit-playsinline playsinline>';
                         } else {
-
                             // Chrome 35 won't play with preload none
                             html += '<video class="' + cssClass + '" preload="metadata" autoplay="autoplay" webkit-playsinline playsinline>';
                         }
@@ -1805,7 +1800,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
     };
 
     HtmlVideoPlayer.prototype.getAspectRatio = function () {
-        return this._currentAspectRatio;
+        return this._currentAspectRatio || "auto";
     };
 
     HtmlVideoPlayer.prototype.getSupportedAspectRatios = function () {

src/components/itemcontextmenu.js

@@ -70,7 +70,7 @@ define(["apphost", "globalize", "connectionManager", "itemHelper", "appRouter",
                 commands.push({
                     name: globalize.translate("InstantMix"),
                     id: "instantmix",
-                    icon: "shuffle"
+                    icon: "explore"
                 });
             }
         }
@@ -178,7 +178,7 @@ define(["apphost", "globalize", "connectionManager", "itemHelper", "appRouter",
                 commands.push({
                     name: globalize.translate("EditImages"),
                     id: "editimages",
-                    icon: "edit"
+                    icon: "image"
                 });
             }
         }

src/components/listview/listview.css

@@ -35,6 +35,8 @@
 }
 
 .listItem-indexnumberleft {
+    min-width: 2%;
+    text-align: center;
     margin-right: 1em;
 }
 

src/itemdetails.html

@@ -45,7 +45,7 @@
 
                 <button is="emby-button" type="button" class="button-flat btnInstantMix hide detailButton-mobile">
                     <div class="detailButton-mobile-content">
-                        <i class="md-icon detailButton-mobile-icon">shuffle</i>
+                        <i class="md-icon detailButton-mobile-icon">explore</i>
                         <div class="detailButton-mobile-text">${HeaderInstantMix}</div>
                     </div>
                 </button>

src/scripts/browserdeviceprofile.js

@@ -6,15 +6,12 @@ define(['browser'], function (browser) {
     }
 
     function canPlayH265(videoTestElement, options) {
-
         if (browser.tizen || browser.orsay || browser.xboxOne || browser.web0s || options.supportsHevc) {
             return true;
         }
 
         var userAgent = navigator.userAgent.toLowerCase();
-
         if (browser.chromecast) {
-
             var isChromecastUltra = userAgent.indexOf('aarch64') !== -1;
             if (isChromecastUltra) {
                 return true;
@@ -31,7 +28,6 @@ define(['browser'], function (browser) {
 
     var _supportsTextTracks;
     function supportsTextTracks() {
-
         if (browser.tizen || browser.orsay) {
             return true;
         }
@@ -46,15 +42,14 @@ define(['browser'], function (browser) {
 
     var _canPlayHls;
     function canPlayHls(src) {
-
         if (_canPlayHls == null) {
             _canPlayHls = canPlayNativeHls() || canPlayHlsWithMSE();
         }
+
         return _canPlayHls;
     }
 
     function canPlayNativeHls() {
-
         if (browser.tizen || browser.orsay) {
             return true;
         }
@@ -77,8 +72,27 @@ define(['browser'], function (browser) {
         return false;
     }
 
-    function canPlayAudioFormat(format) {
+    function supportsAc3(videoTestElement) {
+        if (browser.edgeUwp || browser.tizen || browser.orsay || browser.web0s) {
+            return true;
+        }
 
+        if (browser.osx || browser.iOS) {
+            return false;
+        }
+
+        return videoTestElement.canPlayType('audio/mp4; codecs="ac-3"').replace(/no/, '');
+    }
+
+    function supportsEac3(videoTestElement) {
+        if (browser.tizen || browser.orsay || browser.web0s) {
+            return true;
+        }
+
+        return videoTestElement.canPlayType('audio/mp4; codecs="ec-3"').replace(/no/, '');
+    }
+
+    function canPlayAudioFormat(format) {
         var typeString;
 
         if (format === 'flac') {
@@ -97,14 +111,12 @@ define(['browser'], function (browser) {
             }
         } else if (format === 'opus') {
             typeString = 'audio/ogg; codecs="opus"';
-
             if (document.createElement('audio').canPlayType(typeString).replace(/no/, '')) {
                 return true;
             }
 
             return false;
         } else if (format === 'mp2') {
-
             // For now
             return false;
         }
@@ -113,14 +125,6 @@ define(['browser'], function (browser) {
             typeString = 'audio/webm';
         } else if (format === 'mp2') {
             typeString = 'audio/mpeg';
-        } else if (format === 'ogg' || format === 'oga') {
-
-            // chrome says probably, but seeing failures
-            if (browser.chrome) {
-                return false;
-            }
-            typeString = 'audio/' + format;
-
         } else {
             typeString = 'audio/' + format;
         }
@@ -133,7 +137,6 @@ define(['browser'], function (browser) {
     }
 
     function testCanPlayMkv(videoTestElement) {
-
         if (browser.tizen || browser.orsay || browser.web0s) {
             return true;
         }
@@ -147,7 +150,6 @@ define(['browser'], function (browser) {
 
         // Unfortunately there's no real way to detect mkv support
         if (browser.chrome) {
-
             // Not supported on opera tv
             if (browser.operaTv) {
                 return false;
@@ -162,7 +164,6 @@ define(['browser'], function (browser) {
         }
 
         if (browser.edgeUwp) {
-
             return true;
         }
 
@@ -174,17 +175,15 @@ define(['browser'], function (browser) {
     }
 
     function supportsMpeg2Video() {
-        return browser.orsay || browser.tizen || browser.edgeUwp || browser.web0s;
+        return browser.tizen || browser.orsay || browser.web0s || browser.edgeUwp;
     }
 
     function supportsVc1() {
-        return browser.orsay || browser.tizen || browser.edgeUwp || browser.web0s;
+        return browser.tizen || browser.orsay || browser.web0s || browser.edgeUwp;
     }
 
     function getFlvMseDirectPlayProfile() {
-
         var videoAudioCodecs = ['aac'];
-
         if (!browser.edge && !browser.msie) {
             videoAudioCodecs.push('mp3');
         }
@@ -198,13 +197,11 @@ define(['browser'], function (browser) {
     }
 
     function getDirectPlayProfileForVideoContainer(container, videoAudioCodecs, videoTestElement, options) {
-
         var supported = false;
         var profileContainer = container;
         var videoCodecs = [];
 
         switch (container) {
-
             case 'asf':
                 supported = browser.tizen || browser.orsay || browser.edgeUwp;
                 videoAudioCodecs = [];
@@ -279,16 +276,12 @@ define(['browser'], function (browser) {
     }
 
     function getMaxBitrate() {
-
         return 120000000;
     }
 
     function getGlobalMaxVideoBitrate() {
-
         var userAgent = navigator.userAgent.toLowerCase();
-
         if (browser.chromecast) {
-
             var isChromecastUltra = userAgent.indexOf('aarch64') !== -1;
             if (isChromecastUltra) {
                 return null;
@@ -319,27 +312,9 @@ define(['browser'], function (browser) {
                     (browser.tizen && isTizenFhd ? 20000000 : null)));
     }
 
-    function supportsAc3(videoTestElement) {
-
-        if (browser.edgeUwp || browser.tizen || browser.orsay || browser.web0s) {
-            return true;
-        }
-
-        return (videoTestElement.canPlayType('audio/mp4; codecs="ac-3"').replace(/no/, '') && !browser.osx && !browser.iOS);
-    }
-
-    function supportsEac3(videoTestElement) {
-
-        if (browser.tizen || browser.orsay || browser.web0s) {
-            return true;
-        }
-
-        return videoTestElement.canPlayType('audio/mp4; codecs="ec-3"').replace(/no/, '');
-    }
-
     return function (options) {
-
         options = options || {};
+
         var physicalAudioChannels = options.audioChannels || (browser.tv || browser.ps4 || browser.xboxOne ? 6 : 2);
 
         var bitrateSetting = getMaxBitrate();
@@ -417,7 +392,6 @@ define(['browser'], function (browser) {
 
             // PS4 fails to load HLS with mp3 audio
             if (!browser.ps4) {
-
                 // mp3 encoder only supports 2 channels, so only make that preferred if we're only requesting 2 channels
                 // Also apply it for chromecast because it no longer supports AAC 5.1
                 if (physicalAudioChannels <= 2) {
@@ -425,14 +399,15 @@ define(['browser'], function (browser) {
                 }
             }
         }
-        if (canPlayAacVideoAudio) {
 
+        if (canPlayAacVideoAudio) {
             if (videoAudioCodecs.indexOf('aac') === -1) {
                 videoAudioCodecs.push('aac');
             }
 
             hlsVideoAudioCodecs.push('aac');
         }
+
         if (supportsMp3VideoAudio) {
             // PS4 fails to load HLS with mp3 audio
             if (!browser.ps4) {
@@ -525,6 +500,7 @@ define(['browser'], function (browser) {
         if (canPlayVp8) {
             mp4VideoCodecs.push('vp8');
         }
+
         if (canPlayVp9) {
             mp4VideoCodecs.push('vp9');
         }
@@ -563,20 +539,17 @@ define(['browser'], function (browser) {
         ['opus', 'mp3', 'mp2', 'aac', 'flac', 'alac', 'webma', 'wma', 'wav', 'ogg', 'oga'].filter(canPlayAudioFormat).forEach(function (audioFormat) {
 
             if (audioFormat === 'mp2') {
-
                 profile.DirectPlayProfiles.push({
                     Container: 'mp2,mp3',
                     Type: 'Audio',
                     AudioCodec: audioFormat
                 });
             } else if (audioFormat === 'mp3') {
-
                 profile.DirectPlayProfiles.push({
                     Container: audioFormat,
                     Type: 'Audio',
                     AudioCodec: audioFormat
                 });
-
             } else {
                 profile.DirectPlayProfiles.push({
                     Container: audioFormat === 'webma' ? 'webma,webm' : audioFormat,
@@ -586,7 +559,6 @@ define(['browser'], function (browser) {
 
             // aac also appears in the m4a container
             if (audioFormat === 'aac' || audioFormat === 'alac') {
-
                 profile.DirectPlayProfiles.push({
                     Container: 'm4a',
                     AudioCodec: audioFormat,
@@ -619,7 +591,6 @@ define(['browser'], function (browser) {
 
         if (canPlayHls() && browser.enableHlsAudio !== false) {
             profile.TranscodingProfiles.push({
-
                 // hlsjs, edge, and android all seem to require ts container
                 Container: !canPlayNativeHls() || browser.edge || browser.android ? 'ts' : 'aac',
                 Type: 'Audio',
@@ -636,7 +607,6 @@ define(['browser'], function (browser) {
         // But for static (offline sync), it will be just fine.
         // Prioritize aac higher because the encoder can accept more channels than mp3
         ['aac', 'mp3', 'opus', 'wav'].filter(canPlayAudioFormat).forEach(function (audioFormat) {
-
             profile.TranscodingProfiles.push({
                 Container: audioFormat,
                 Type: 'Audio',
@@ -648,7 +618,6 @@ define(['browser'], function (browser) {
         });
 
         ['opus', 'mp3', 'aac', 'wav'].filter(canPlayAudioFormat).forEach(function (audioFormat) {
-
             profile.TranscodingProfiles.push({
                 Container: audioFormat,
                 Type: 'Audio',
@@ -804,7 +773,8 @@ define(['browser'], function (browser) {
                     Condition: 'LessThanEqual',
                     Property: 'VideoLevel',
                     Value: maxH264Level.toString()
-                }]
+                }
+            ]
         });
 
         if (!browser.edgeUwp && !browser.tizen && !browser.orsay && !browser.web0s) {
@@ -888,7 +858,6 @@ define(['browser'], function (browser) {
         // External vtt or burn in
         profile.SubtitleProfiles = [];
         if (supportsTextTracks()) {
-
             profile.SubtitleProfiles.push({
                 Format: 'vtt',
                 Method: 'External'
@@ -896,7 +865,6 @@ define(['browser'], function (browser) {
         }
 
         profile.ResponseProfiles = [];
-
         profile.ResponseProfiles.push({
             Type: 'Video',
             Container: 'm4v',

src/strings/en-gb.json

@@ -83,7 +83,7 @@
     "Art": "Art",
     "AsManyAsPossible": "As many as possible",
     "Ascending": "Ascending",
-    "AspectRatio": "Aspect ratio",
+    "AspectRatio": "Aspect Ratio",
     "AttributeNew": "New",
     "Audio": "Audio",
     "AuthProviderHelp": "Select an Authentication Provider to be used to authenticate this user's password.",
@@ -565,7 +565,7 @@
     "ReplaceExistingImages": "Replace existing images",
     "ReplaceAllMetadata": "Replace all metadata",
     "RepeatOne": "Repeat one",
-    "RepeatMode": "Repeat mode",
+    "RepeatMode": "Repeat Mode",
     "RepeatEpisodes": "Repeat episodes",
     "RepeatAll": "Repeat all",
     "Repeat": "Repeat",

src/strings/en-us.json

@@ -36,7 +36,7 @@
     "Artists": "Artists",
     "AsManyAsPossible": "As many as possible",
     "Ascending": "Ascending",
-    "AspectRatio": "Aspect ratio",
+    "AspectRatio": "Aspect Ratio",
     "AttributeNew": "New",
     "Audio": "Audio",
     "AuthProviderHelp": "Select an Authentication Provider to be used to authenticate this user's password.",
@@ -1258,7 +1258,7 @@
     "Repeat": "Repeat",
     "RepeatAll": "Repeat all",
     "RepeatEpisodes": "Repeat episodes",
-    "RepeatMode": "Repeat mode",
+    "RepeatMode": "Repeat Mode",
     "RepeatOne": "Repeat one",
     "ReplaceAllMetadata": "Replace all metadata",
     "ReplaceExistingImages": "Replace existing images",