diff --git a/dashboard-ui/apiclient/localassetmanager.js b/dashboard-ui/apiclient/localassetmanager.js index e4ce74d2a2..bd5876ba72 100644 --- a/dashboard-ui/apiclient/localassetmanager.js +++ b/dashboard-ui/apiclient/localassetmanager.js @@ -102,6 +102,13 @@ return deferred.promise(); } + function translateFilePath(path) { + + var deferred = DeferredBuilder.Deferred(); + deferred.resolveWith(null, [path]); + return deferred.promise(); + } + window.LocalAssetManager = { getLocalMediaSource: getLocalMediaSource, saveOfflineUser: saveOfflineUser, @@ -118,7 +125,8 @@ downloadSubtitles: downloadSubtitles, hasImage: hasImage, downloadImage: downloadImage, - fileExists: fileExists + fileExists: fileExists, + translateFilePath: translateFilePath }; })(); \ No newline at end of file diff --git a/dashboard-ui/bower_components/paper-progress/.bower.json b/dashboard-ui/bower_components/paper-progress/.bower.json index cf74ccf48f..7dbcf9e213 100644 --- a/dashboard-ui/bower_components/paper-progress/.bower.json +++ b/dashboard-ui/bower_components/paper-progress/.bower.json @@ -1,6 +1,6 @@ { "name": "paper-progress", - "version": "1.0.4", + "version": "1.0.5", "license": "http://polymer.github.io/LICENSE.txt", "description": "A material design progress bar", "authors": "The Polymer Authors", @@ -29,11 +29,11 @@ "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" }, "homepage": "https://github.com/PolymerElements/paper-progress", - "_release": "1.0.4", + "_release": "1.0.5", "_resolution": { "type": "version", - "tag": "v1.0.4", - "commit": "3bef91b5f9479b8b85c4725b441acf8fb433e008" + "tag": "v1.0.5", + "commit": "baf8049bb33c3f9557d0d3608dc0824847ac34c4" }, "_source": "git://github.com/PolymerElements/paper-progress.git", "_target": "^1.0.0", diff --git a/dashboard-ui/bower_components/paper-progress/bower.json b/dashboard-ui/bower_components/paper-progress/bower.json index cd57467670..1bcb4e3cd3 100644 --- a/dashboard-ui/bower_components/paper-progress/bower.json +++ b/dashboard-ui/bower_components/paper-progress/bower.json @@ -1,6 +1,6 @@ { "name": "paper-progress", - "version": "1.0.4", + "version": "1.0.5", "license": "http://polymer.github.io/LICENSE.txt", "description": "A material design progress bar", "authors": "The Polymer Authors", diff --git a/dashboard-ui/bower_components/paper-progress/paper-progress.html b/dashboard-ui/bower_components/paper-progress/paper-progress.html index fe35a60568..283b77cb93 100644 --- a/dashboard-ui/bower_components/paper-progress/paper-progress.html +++ b/dashboard-ui/bower_components/paper-progress/paper-progress.html @@ -108,7 +108,8 @@ Custom property | Description background-color: var(--paper-progress-container-color, --google-grey-300); } - :host(.transiting) > * { + :host(.transiting) #primaryProgress, + :host(.transiting) #secondaryProgress { -webkit-transition-property: -webkit-transform; transition-property: transform; diff --git a/dashboard-ui/bower_components/paper-progress/test/basic.html b/dashboard-ui/bower_components/paper-progress/test/basic.html index f59533b04e..73547501e8 100644 --- a/dashboard-ui/bower_components/paper-progress/test/basic.html +++ b/dashboard-ui/bower_components/paper-progress/test/basic.html @@ -30,89 +30,116 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN + + + + diff --git a/dashboard-ui/channelitems.html b/dashboard-ui/channelitems.html index 4c6ec0cd04..8fc190d04e 100644 --- a/dashboard-ui/channelitems.html +++ b/dashboard-ui/channelitems.html @@ -24,29 +24,13 @@ ${HeaderFilters} -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - +
+ ${OptionPlayed} + ${OptionUnplayed} + ${OptionResumable} + ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}
diff --git a/dashboard-ui/cordova/localassetmanager.js b/dashboard-ui/cordova/localassetmanager.js index 1a78ed49e9..36bb80b59a 100644 --- a/dashboard-ui/cordova/localassetmanager.js +++ b/dashboard-ui/cordova/localassetmanager.js @@ -467,38 +467,95 @@ getFileSystem().done(function (fileSystem) { - fileSystem.root.getFile(fileName, { create: true }, function (targetFile) { + createDirectory(getParentDirectoryPath(localPath)).done(function () { - var downloader = new BackgroundTransfer.BackgroundDownloader(); - // Create a new download operation. - var download = downloader.createDownload(url, targetFile.toURL()); - // Start the download and persist the promise to be able to cancel the download. - var downloadPromise = download.startAsync().then(function () { + fileSystem.root.getFile(localPath, { create: true }, function (targetFile) { - // on success - var localUrl = localPath; + var downloader = new BackgroundTransfer.BackgroundDownloader(); + // Create a new download operation. + var download = downloader.createDownload(url, targetFile); + // Start the download and persist the promise to be able to cancel the download. + var downloadPromise = download.startAsync().then(function () { - Logger.log('Downloaded local url: ' + localUrl); - deferred.resolveWith(null, [localUrl]); + // on success + var localUrl = localPath; - }, function () { + Logger.log('Downloaded local url: ' + localUrl); + deferred.resolveWith(null, [localUrl]); - // on error - Logger.log('download failed: ' + url + ' to ' + localPath); - deferred.reject(); + }, function () { - }, function (value) { + // on error + Logger.log('download failed: ' + url + ' to ' + localPath); + deferred.reject(); - // on progress - Logger.log('download progress: ' + value); + }, function (value) { + // on progress + Logger.log('download progress: ' + value); + + }); }); - }); - }); + + }).fail(getOnFail(deferred));; + + }).fail(getOnFail(deferred)); return deferred.promise(); } + function createDirectory(path) { + + var deferred = DeferredBuilder.Deferred(); + createDirectoryPart(path, 0, deferred); + return deferred.promise(); + } + + function createDirectoryPart(path, index, deferred) { + + var parts = path.split('/'); + if (index >= parts.length) { + deferred.resolve(); + return; + } + + parts.length = index + 1; + var pathToCreate = parts.join('/'); + + createDirectoryInternal(pathToCreate).done(function () { + + createDirectoryPart(path, index + 1, deferred); + + }).fail(getOnFail(deferred)); + } + + function createDirectoryInternal(path) { + + Logger.log('creating directory: ' + path); + var deferred = DeferredBuilder.Deferred(); + + getFileSystem().done(function (fileSystem) { + + fileSystem.root.getDirectory(path, { create: true, exclusive: false }, function (targetFile) { + + Logger.log('createDirectory succeeded'); + deferred.resolve(); + + }, function () { + + Logger.log('createDirectory failed'); + deferred.reject(); + }); + + }).fail(getOnFail(deferred)); + + return deferred.promise(); + } + + function getParentDirectoryPath(path) { + return path.substring(0, path.lastIndexOf('/'));; + } + function downloadSubtitles(url, localItem, subtitleStream) { var path = item.LocalPath; @@ -593,7 +650,7 @@ function getImageLocalPath(serverId, itemId, imageTag) { var deferred = DeferredBuilder.Deferred(); - var path = "images/" + serverId + "-" + itemId + "/" + imageTag; + var path = "images/" + serverId + "/" + itemId + "/" + imageTag; deferred.resolveWith(null, [path]); @@ -640,6 +697,23 @@ }; } + function translateFilePath(path) { + + var deferred = DeferredBuilder.Deferred(); + + resolveFile(path, function (fileEntry) { + Logger.log('translateFilePath fileExists: true - path: ' + path); + Logger.log('translateFilePath resolving with: ' + fileEntry.toURL()); + deferred.resolveWith(null, [fileEntry.toURL()]); + + }, function () { + Logger.log('translateFilePath fileExists: false - path: ' + path); + deferred.resolveWith(null, [path]); + }); + + return deferred.promise(); + } + window.LocalAssetManager = { getLocalMediaSource: getLocalMediaSource, saveOfflineUser: saveOfflineUser, @@ -656,7 +730,8 @@ downloadSubtitles: downloadSubtitles, hasImage: hasImage, downloadImage: downloadImage, - fileExists: fileExists + fileExists: fileExists, + translateFilePath: translateFilePath }; })(); \ No newline at end of file diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index da6cf9151a..0ebcab950d 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -1036,7 +1036,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons { .syncIndicator { display: block; position: absolute; - top: 32px; + top: 5px; right: 5px; text-align: center; vertical-align: middle; @@ -1044,15 +1044,12 @@ span.itemCommunityRating:not(:empty) + .userDataIcons { height: 24px; border-radius: 50%; color: #fff; - background: rgba(0, 0, 0, .8); line-height: 19px; + background-color: #38c; } -.workingSyncIndicator iron-icon { - -webkit-animation: spin 3s infinite linear; - -moz-animation: spin 3s infinite linear; - -o-animation: spin 3s infinite linear; - -ms-animation: spin 3s infinite linear; +.playedIndicator + .syncIndicator { + top: 32px; } .playedIndicator { diff --git a/dashboard-ui/itemlist.html b/dashboard-ui/itemlist.html index 92e1af165a..63d8aebae0 100644 --- a/dashboard-ui/itemlist.html +++ b/dashboard-ui/itemlist.html @@ -26,34 +26,13 @@ ${HeaderFilters} -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - +
+ ${OptionPlayed} + ${OptionUnplayed} + ${OptionResumable} + ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}
diff --git a/dashboard-ui/livetv.html b/dashboard-ui/livetv.html index 524d380fe1..1b86f4aee8 100644 --- a/dashboard-ui/livetv.html +++ b/dashboard-ui/livetv.html @@ -138,17 +138,10 @@

${HeaderFilters}

-
- - -
-
- - -
-
- - +
+ ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}
diff --git a/dashboard-ui/movies.html b/dashboard-ui/movies.html index e567e4ce52..a71b6da196 100644 --- a/dashboard-ui/movies.html +++ b/dashboard-ui/movies.html @@ -147,35 +147,13 @@

${HeaderFilters}

- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - +
+ ${OptionPlayed} + ${OptionUnplayed} + ${OptionResumable} + ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}

@@ -256,34 +234,13 @@

${HeaderFilters}

-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - +
+ ${OptionPlayed} + ${OptionUnplayed} + ${OptionResumable} + ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}
diff --git a/dashboard-ui/music.html b/dashboard-ui/music.html index d808106684..74705c9e74 100644 --- a/dashboard-ui/music.html +++ b/dashboard-ui/music.html @@ -143,19 +143,10 @@

${HeaderFilters}

-
- - -
- -
- - -
- -
- - +
+ ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}

@@ -199,19 +190,10 @@

${HeaderFilters}

-
- - -
- -
- - -
- -
- - +
+ ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}

@@ -234,19 +216,10 @@

${HeaderFilters}

-
- - -
- -
- - -
- -
- - +
+ ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}
@@ -270,29 +243,12 @@

${HeaderFilters}

-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - +
+ ${OptionPlayed} + ${OptionUnplayed} + ${OptionFavorite} + ${OptionLikes} + ${OptionDislikes}
diff --git a/dashboard-ui/scripts/externalplayer.js b/dashboard-ui/scripts/externalplayer.js index 67a30152e2..96e6aa8872 100644 --- a/dashboard-ui/scripts/externalplayer.js +++ b/dashboard-ui/scripts/externalplayer.js @@ -137,28 +137,30 @@ } }; - var streamInfo = MediaPlayer.createStreamInfo('Video', item, mediaSource, startPosition); - var currentSrc = streamInfo.url; + MediaPlayer.createStreamInfo('Video', item, mediaSource, startPosition).done(function (streamInfo) { - var audioStreamIndex = getParameterByName('AudioStreamIndex', currentSrc); + var currentSrc = streamInfo.url; - if (audioStreamIndex) { - basePlayerState.PlayState.AudioStreamIndex = parseInt(audioStreamIndex); - } - basePlayerState.PlayState.SubtitleStreamIndex = self.currentSubtitleStreamIndex; + var audioStreamIndex = getParameterByName('AudioStreamIndex', currentSrc); - basePlayerState.PlayState.PlayMethod = getParameterByName('static', currentSrc) == 'true' ? - 'DirectStream' : - 'Transcode'; + if (audioStreamIndex) { + basePlayerState.PlayState.AudioStreamIndex = parseInt(audioStreamIndex); + } + basePlayerState.PlayState.SubtitleStreamIndex = self.currentSubtitleStreamIndex; - basePlayerState.PlayState.LiveStreamId = getParameterByName('LiveStreamId', currentSrc); - basePlayerState.PlayState.PlaySessionId = getParameterByName('PlaySessionId', currentSrc); + basePlayerState.PlayState.PlayMethod = getParameterByName('static', currentSrc) == 'true' ? + 'DirectStream' : + 'Transcode'; - basePlayerState.PlayState.MediaSourceId = mediaSource.Id; - basePlayerState.PlayState.CanSeek = false; - basePlayerState.NowPlayingItem = MediaPlayer.getNowPlayingItemForReporting(item, mediaSource); + basePlayerState.PlayState.LiveStreamId = getParameterByName('LiveStreamId', currentSrc); + basePlayerState.PlayState.PlaySessionId = getParameterByName('PlaySessionId', currentSrc); - deferred.resolveWith(null, [streamInfo]); + basePlayerState.PlayState.MediaSourceId = mediaSource.Id; + basePlayerState.PlayState.CanSeek = false; + basePlayerState.NowPlayingItem = MediaPlayer.getNowPlayingItemForReporting(item, mediaSource); + + deferred.resolveWith(null, [streamInfo]); + }); } function getPlayerState(positionTicks) { diff --git a/dashboard-ui/scripts/htmlmediarenderer.js b/dashboard-ui/scripts/htmlmediarenderer.js index 161e39c139..5038cc6466 100644 --- a/dashboard-ui/scripts/htmlmediarenderer.js +++ b/dashboard-ui/scripts/htmlmediarenderer.js @@ -12,7 +12,7 @@ function hideStatusBar() { if (options.type == 'video' && window.StatusBar) { StatusBar.backgroundColorByName("black"); - StatusBar.overlaysWebView(true); + //StatusBar.overlaysWebView(true); StatusBar.hide(); } } @@ -20,7 +20,7 @@ function showStatusBar() { if (options.type == 'video' && window.StatusBar) { StatusBar.show(); - StatusBar.overlaysWebView(false); + //StatusBar.overlaysWebView(false); } } @@ -355,6 +355,11 @@ } var val = streamInfo.url; + + if (AppInfo.isNativeApp && $.browser.safari) { + val = val.replace('file://', ''); + } + requiresSettingStartTimeOnStart = false; var startTime = getStartTime(val); var playNow = false; diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index a2ba50919f..909d6b9b60 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -270,9 +270,26 @@ }, delay); }); + function fadeOutLeftBig(elem, iterations) { + var keyframes = [{ opacity: '1', transform: 'none', offset: 0 }, + { opacity: '0', transform: 'translate3d(-2000px, 0, 0)', offset: 1 }]; + var timing = { duration: 700, iterations: iterations }; + return elem.animate(keyframes, timing); + } + if (!LibraryBrowser.navigateOnLibraryTabSelect()) { tabs.addEventListener('iron-select', function () { - pages.selected = this.selected; + + var selected = pages.selected; + if (selected != null) { + var newValue = this.selected; + fadeOutLeftBig(pages.querySelectorAll('.pageTabContent')[selected], 1).onfinish = function () { + pages.selected = newValue; + }; + } + else { + pages.selected = this.selected; + } }); } }, @@ -2362,12 +2379,12 @@ var syncPercent = item.SyncPercent; if (syncPercent) { - return '
'; + return '
'; } if (item.SyncStatus == 'Queued' || item.SyncStatus == 'Converting' || item.SyncStatus == 'ReadyToTransfer' || item.SyncStatus == 'Transferring') { - return '
'; + return '
'; } return ''; diff --git a/dashboard-ui/scripts/librarylist.js b/dashboard-ui/scripts/librarylist.js index 8edfdde064..4933b8530f 100644 --- a/dashboard-ui/scripts/librarylist.js +++ b/dashboard-ui/scripts/librarylist.js @@ -617,6 +617,13 @@ return; } + var url = 'itemdetails.html?id=' + itemId; + if (context) { + url += '&context=' + context; + } + Dashboard.navigate(url); + return; + var ids = items.map(function (i) { return i.Id; }); diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js index 8cf96ee378..ce4e49c199 100644 --- a/dashboard-ui/scripts/librarymenu.js +++ b/dashboard-ui/scripts/librarymenu.js @@ -121,7 +121,7 @@ var mainDrawerButton = document.querySelector('.mainDrawerButton'); if (mainDrawerButton) { - if (AppInfo.isTouchPreferred) { + if (AppInfo.isTouchPreferred || $.browser.mobile) { Events.on(mainDrawerButton, 'click', openMainDrawer); @@ -178,32 +178,35 @@ document.body.classList.add('bodyWithPopupOpen'); } - var drawer = document.querySelector('.mainDrawerPanel .mainDrawer'); + var pageElem = $($.mobile.activePage)[0]; - ConnectionManager.user(window.ApiClient).done(function (user) { + if (requiresDrawerRefresh || requiresDashboardDrawerRefresh) { - if (requiresDrawerRefresh) { - ensureDrawerStructure(drawer); + ConnectionManager.user(window.ApiClient).done(function (user) { - refreshUserInfoInDrawer(user, drawer); - refreshLibraryInfoInDrawer(user, drawer); - refreshBottomUserInfoInDrawer(user, drawer); + var drawer = document.querySelector('.mainDrawerPanel .mainDrawer'); - Events.trigger(document, 'libraryMenuCreated'); - updateLibraryMenu(user.localUser); - } + if (requiresDrawerRefresh) { + ensureDrawerStructure(drawer); - var pageElem = $($.mobile.activePage)[0]; + refreshUserInfoInDrawer(user, drawer); + refreshLibraryInfoInDrawer(user, drawer); + refreshBottomUserInfoInDrawer(user, drawer); - if (requiresDrawerRefresh || requiresDashboardDrawerRefresh) { - refreshDashboardInfoInDrawer(pageElem, user, drawer); - requiresDashboardDrawerRefresh = false; - } + Events.trigger(document, 'libraryMenuCreated'); + updateLibraryMenu(user.localUser); + } - requiresDrawerRefresh = false; + if (requiresDrawerRefresh || requiresDashboardDrawerRefresh) { + refreshDashboardInfoInDrawer(pageElem, user, drawer); + requiresDashboardDrawerRefresh = false; + } - updateLibraryNavLinks(pageElem); - }); + requiresDrawerRefresh = false; + }); + } + + updateLibraryNavLinks(pageElem); document.querySelector('.mainDrawerPanel #drawer').classList.add('verticalScrollingDrawer'); } @@ -714,26 +717,33 @@ lnkMediaFolder.classList.remove('selectedMediaFolder'); } } + } + function updateTabLinks(page) { var context = getParameterByName('context'); - if (context !== 'playlists') { + var elems = page.querySelectorAll('.scopedLibraryViewNav a'); - elems = page.querySelectorAll('.scopedLibraryViewNav a'); + var id = page.classList.contains('liveTvPage') || page.classList.contains('channelsPage') || page.classList.contains('metadataEditorPage') || page.classList.contains('reportsPage') || page.classList.contains('mySyncPage') || page.classList.contains('allLibraryPage') ? + '' : + getTopParentId() || ''; - for (i = 0, length = elems.length; i < length; i++) { + if (!id) { + return; + } - var lnk = elems[i]; - var src = lnk.href; + for (i = 0, length = elems.length; i < length; i++) { - if (src.indexOf('#') != -1) { - continue; - } + var lnk = elems[i]; + var src = lnk.href; - src = replaceQueryString(src, 'topParentId', id); - - lnk.href = src; + if (src.indexOf('#') != -1) { + continue; } + + src = replaceQueryString(src, 'topParentId', id); + + lnk.href = src; } } @@ -792,7 +802,9 @@ var page = this; - requiresDashboardDrawerRefresh = true; + if (page.classList.contains('type-interior')) { + requiresDashboardDrawerRefresh = true; + } onPageBeforeShowDocumentReady(page); @@ -861,7 +873,12 @@ if (AppInfo.enableBottomTabs) { page.classList.add('noSecondaryNavPage'); - document.querySelector('.footer').classList.add('footerOverBottomTabs'); + if (page.classList.contains('pageWithAbsoluteTabs')) { + document.querySelector('.footer').classList.add('footerOverBottomTabs'); + } + else { + document.querySelector('.footer').classList.remove('footerOverBottomTabs'); + } } else { @@ -927,6 +944,7 @@ // Scroll back up so in case vertical scroll was messed with window.scrollTo(0, 0); } + updateTabLinks(page); } function initHeadRoom(elem) { diff --git a/dashboard-ui/scripts/livetvchannels.js b/dashboard-ui/scripts/livetvchannels.js index bb7bc9c8a6..e72ee8d849 100644 --- a/dashboard-ui/scripts/livetvchannels.js +++ b/dashboard-ui/scripts/livetvchannels.js @@ -96,16 +96,16 @@ function updateFilterControls(page) { var query = getQuery(); - $('#chkFavorite', page).checked(query.IsFavorite == true); - $('#chkLikes', page).checked(query.IsLiked == true); - $('#chkDislikes', page).checked(query.IsDisliked == true); + $('.chkFavorite', page).checked(query.IsFavorite == true); + $('.chkLikes', page).checked(query.IsLiked == true); + $('.chkDislikes', page).checked(query.IsDisliked == true); } window.LiveTvPage.initChannelsTab = function (page, tabContent) { var viewPanel = page.querySelector('.channelViewPanel'); - $('#chkFavorite', viewPanel).on('change', function () { + $('.chkFavorite', viewPanel).on('change', function () { var query = getQuery(); query.StartIndex = 0; @@ -115,7 +115,7 @@ }); - $('#chkLikes', viewPanel).on('change', function () { + $('.chkLikes', viewPanel).on('change', function () { var query = getQuery(); query.StartIndex = 0; @@ -124,7 +124,7 @@ reloadItems(tabContent, viewPanel); }); - $('#chkDislikes', viewPanel).on('change', function () { + $('.chkDislikes', viewPanel).on('change', function () { var query = getQuery(); query.StartIndex = 0; diff --git a/dashboard-ui/scripts/mediaplayer-video.js b/dashboard-ui/scripts/mediaplayer-video.js index 1ab492aaf0..770271cd78 100644 --- a/dashboard-ui/scripts/mediaplayer-video.js +++ b/dashboard-ui/scripts/mediaplayer-video.js @@ -891,28 +891,29 @@ requirejs(['videorenderer'], function () { - var streamInfo = self.createStreamInfo('Video', item, mediaSource, startPosition); + self.createStreamInfo('Video', item, mediaSource, startPosition).done(function (streamInfo) { - // Huge hack alert. Safari doesn't seem to like if the segments aren't available right away when playback starts - // This will start the transcoding process before actually feeding the video url into the player - if ($.browser.safari && !mediaSource.RunTimeTicks) { + // Huge hack alert. Safari doesn't seem to like if the segments aren't available right away when playback starts + // This will start the transcoding process before actually feeding the video url into the player + if ($.browser.safari && !mediaSource.RunTimeTicks) { - Dashboard.showLoadingMsg(); + Dashboard.showLoadingMsg(); - ApiClient.ajax({ - type: 'GET', - url: streamInfo.url.replace('master.m3u8', 'live.m3u8') - }).always(function () { + ApiClient.ajax({ + type: 'GET', + url: streamInfo.url.replace('master.m3u8', 'live.m3u8') + }).always(function () { - Dashboard.hideLoadingMsg(); + Dashboard.hideLoadingMsg(); - }).done(function () { + }).done(function () { + self.playVideoInternal(item, mediaSource, startPosition, streamInfo, callback); + }); + + } else { self.playVideoInternal(item, mediaSource, startPosition, streamInfo, callback); - }); - - } else { - self.playVideoInternal(item, mediaSource, startPosition, streamInfo, callback); - } + } + }); }); }; diff --git a/dashboard-ui/scripts/mediaplayer.js b/dashboard-ui/scripts/mediaplayer.js index 90530b01f2..37abbd6cc4 100644 --- a/dashboard-ui/scripts/mediaplayer.js +++ b/dashboard-ui/scripts/mediaplayer.js @@ -291,8 +291,6 @@ profile.ContainerProfiles = []; - var maxAudioChannels = isVlc ? '6' : '2'; - profile.CodecProfiles = []; profile.CodecProfiles.push({ Type: 'Audio', @@ -303,16 +301,6 @@ }] }); - profile.CodecProfiles.push({ - Type: 'VideoAudio', - Codec: 'mp3', - Conditions: [{ - Condition: 'LessThanEqual', - Property: 'AudioChannels', - Value: maxAudioChannels - }] - }); - if (!isVlc) { profile.CodecProfiles.push({ Type: 'VideoAudio', @@ -340,7 +328,7 @@ { Condition: 'LessThanEqual', Property: 'AudioChannels', - Value: maxAudioChannels + Value: '6' } ] }); @@ -641,17 +629,18 @@ if (validatePlaybackInfoResult(result)) { self.currentMediaSource = result.MediaSources[0]; - var streamInfo = self.createStreamInfo(self.currentItem.MediaType, self.currentItem, self.currentMediaSource, ticks); + self.createStreamInfo(self.currentItem.MediaType, self.currentItem, self.currentMediaSource, ticks).done(function (streamInfo) { - if (!streamInfo.url) { - MediaController.showPlaybackInfoErrorMessage('NoCompatibleStream'); - self.stop(); - return false; - } + if (!streamInfo.url) { + MediaController.showPlaybackInfoErrorMessage('NoCompatibleStream'); + self.stop(); + return; + } - self.currentSubtitleStreamIndex = subtitleStreamIndex; + self.currentSubtitleStreamIndex = subtitleStreamIndex; - changeStreamToUrl(mediaRenderer, playSessionId, streamInfo, streamInfo.startTimeTicksOffset || 0); + changeStreamToUrl(mediaRenderer, playSessionId, streamInfo, streamInfo.startTimeTicksOffset || 0); + }); } }); }; @@ -915,6 +904,8 @@ self.createStreamInfo = function (type, item, mediaSource, startPosition) { + var deferred = $.Deferred(); + var mediaUrl; var contentType; var startTimeTicksOffset = 0; @@ -1018,13 +1009,32 @@ } } - return { + var resultInfo = { url: mediaUrl, mimeType: contentType, startTimeTicksOffset: startTimeTicksOffset, startPositionInSeekParam: startPositionInSeekParam, playMethod: playMethod }; + + if (playMethod == 'DirectPlay' && mediaSource.Protocol == 'File') { + + require(['localassetmanager'], function () { + + LocalAssetManager.translateFilePath(resultInfo.url).done(function (path) { + + resultInfo.url = path; + Logger.log('LocalAssetManager.translateFilePath: path: ' + resultInfo.url + ' result: ' + path); + deferred.resolveWith(null, [resultInfo]); + }); + }); + + } + else { + deferred.resolveWith(null, [resultInfo]); + } + + return deferred.promise(); }; self.lastBitrateDetect = 0; @@ -1872,65 +1882,67 @@ function playAudioInternal(item, mediaSource, startPositionTicks) { - var streamInfo = self.createStreamInfo('Audio', item, mediaSource, startPositionTicks); - var audioUrl = streamInfo.url; - self.startTimeTicksOffset = streamInfo.startTimeTicksOffset; + self.createStreamInfo('Audio', item, mediaSource, startPositionTicks).done(function (streamInfo) { - var initialVolume = self.getSavedVolume(); + var audioUrl = streamInfo.url; + self.startTimeTicksOffset = streamInfo.startTimeTicksOffset; - var mediaRenderer = new AudioRenderer({ - poster: self.getPosterUrl(item) - }); + var initialVolume = self.getSavedVolume(); - Events.on(mediaRenderer, "volumechange.mediaplayerevent", function () { + var mediaRenderer = new AudioRenderer({ + poster: self.getPosterUrl(item) + }); - Logger.log('audio element event: volumechange'); + Events.on(mediaRenderer, "volumechange.mediaplayerevent", function () { - self.onVolumeChanged(this); + Logger.log('audio element event: volumechange'); - }); + self.onVolumeChanged(this); - $(mediaRenderer).one("playing.mediaplayerevent", function () { + }); - Logger.log('audio element event: playing'); + $(mediaRenderer).one("playing.mediaplayerevent", function () { - // For some reason this is firing at the start, so don't bind until playback has begun - Events.on(this, 'ended', self.onPlaybackStopped); + Logger.log('audio element event: playing'); - $(this).one('ended', self.playNextAfterEnded); + // For some reason this is firing at the start, so don't bind until playback has begun + Events.on(this, 'ended', self.onPlaybackStopped); - self.onPlaybackStart(this, item, mediaSource); + $(this).one('ended', self.playNextAfterEnded); - }).on("pause.mediaplayerevent", function () { + self.onPlaybackStart(this, item, mediaSource); - Logger.log('audio element event: pause'); + }).on("pause.mediaplayerevent", function () { - self.onPlaystateChange(this); + Logger.log('audio element event: pause'); - // In the event timeupdate isn't firing, at least we can update when this happens - self.setCurrentTime(self.getCurrentTicks()); + self.onPlaystateChange(this); - }).on("playing.mediaplayerevent", function () { + // In the event timeupdate isn't firing, at least we can update when this happens + self.setCurrentTime(self.getCurrentTicks()); - Logger.log('audio element event: playing'); + }).on("playing.mediaplayerevent", function () { - self.onPlaystateChange(this); + Logger.log('audio element event: playing'); - // In the event timeupdate isn't firing, at least we can update when this happens - self.setCurrentTime(self.getCurrentTicks()); + self.onPlaystateChange(this); - }).on("timeupdate.mediaplayerevent", onTimeUpdate); + // In the event timeupdate isn't firing, at least we can update when this happens + self.setCurrentTime(self.getCurrentTicks()); - self.currentMediaRenderer = mediaRenderer; - self.currentDurationTicks = self.currentMediaSource.RunTimeTicks; + }).on("timeupdate.mediaplayerevent", onTimeUpdate); - mediaRenderer.init().done(function () { + self.currentMediaRenderer = mediaRenderer; + self.currentDurationTicks = self.currentMediaSource.RunTimeTicks; - // Set volume first to avoid an audible change - mediaRenderer.volume(initialVolume); + mediaRenderer.init().done(function () { - mediaRenderer.setCurrentSrc(streamInfo, item, mediaSource); - self.streamInfo = streamInfo; + // Set volume first to avoid an audible change + mediaRenderer.volume(initialVolume); + + mediaRenderer.setCurrentSrc(streamInfo, item, mediaSource); + self.streamInfo = streamInfo; + }); }); } diff --git a/dashboard-ui/scripts/syncactivity.js b/dashboard-ui/scripts/syncactivity.js index 5e1505d2a7..97d610be1a 100644 --- a/dashboard-ui/scripts/syncactivity.js +++ b/dashboard-ui/scripts/syncactivity.js @@ -22,6 +22,39 @@ }); } + function getSyncStatusBanner(job) { + + var opacity = '.85'; + var background = 'rgba(204,51,51,' + opacity + ')'; + var text = Globalize.translate('SyncJobStatus' + job.Status); + + if (job.Status == 'Completed') { + background = 'rgba(82, 181, 75, ' + opacity + ')'; + } + else if (job.Status == 'CompletedWithError') { + + } + else if (job.Status == 'Queued') { + background = 'rgba(51, 136, 204, ' + opacity + ')'; + } + else if (job.Status == 'ReadyToTransfer') { + background = 'rgba(51, 136, 204, ' + opacity + ')'; + } + else if (job.Status == 'Transferring') { + background = 'rgba(72, 0, 255, ' + opacity + ')'; + } + else if (job.Status == 'Converting') { + background = 'rgba(255, 106, 0, ' + opacity + ')'; + } + + var html = ''; + html += '
'; + html += text; + html += '
'; + + return html; + } + function getSyncJobHtml(page, job, cardBoxCssClass, syncJobPage) { var html = ''; @@ -54,42 +87,23 @@ html += '
'; - if (job.Progress && job.Progress < 100) { - html += '
'; - html += "
"; - html += ''; - html += "
"; - html += "
"; + var progress = job.Progress || 0; + + var footerClass = 'cardFooter fullCardFooter lightCardFooter'; + + if (progress == 0 || progress >= 100) { + footerClass += ' hide'; } + html += '
'; + html += "
"; + html += ''; + html += "
"; + html += "
"; + html += "
"; - var opacity = '.85'; - var background = 'rgba(204,51,51,' + opacity + ')'; - var text = Globalize.translate('SyncJobStatus' + job.Status); - - if (job.Status == 'Completed') { - background = 'rgba(82, 181, 75, ' + opacity + ')'; - } - else if (job.Status == 'CompletedWithError') { - - } - else if (job.Status == 'Queued') { - background = 'rgba(51, 136, 204, ' + opacity + ')'; - } - else if (job.Status == 'ReadyToTransfer') { - background = 'rgba(51, 136, 204, ' + opacity + ')'; - } - else if (job.Status == 'Transferring') { - background = 'rgba(72, 0, 255, ' + opacity + ')'; - } - else if (job.Status == 'Converting') { - background = 'rgba(255, 106, 0, ' + opacity + ')'; - } - - html += '
'; - html += text; - html += '
'; + html += getSyncStatusBanner(job); // cardContent html += ""; @@ -139,8 +153,17 @@ return html; } + var lastDataLoad = 0; + function loadData(page, jobs) { + if ((new Date().getTime() - lastDataLoad) < 60000) { + refreshData(page, jobs); + return; + } + + lastDataLoad = new Date().getTime(); + var html = ''; var lastTargetName = ''; @@ -195,6 +218,46 @@ } } + function refreshData(page, jobs) { + + for (var i = 0, length = jobs.length; i < length; i++) { + + var job = jobs[i]; + refreshJob(page, job); + } + } + + function refreshJob(page, job) { + + var card = page.querySelector('.card[data-id=\'' + job.Id + '\']'); + + if (!card) { + return; + } + + var banner = card.querySelector('.syncStatusBanner'); + + if (banner.getAttribute('data-status') == job.Status) { + var elem = document.createElement('div'); + elem.innerHTML = getSyncStatusBanner(job); + elem = elem.querySelector('.syncStatusBanner'); + elem.parentNode.removeChild(elem); + + banner.parentNode.replaceChild(elem, banner); + } + + var progress = job.Progress || 0; + var cardFooter = card.querySelector('.cardFooter'); + + if (progress == 0 || progress >= 100) { + cardFooter.classList.add('hide'); + } + else { + cardFooter.classList.remove('hide'); + cardFooter.querySelector('.itemProgressBar').value = progress; + } + } + function showJobMenu(page, elem) { var card = $(elem).parents('.card'); @@ -265,6 +328,9 @@ loadData(page, response.Items); + setTimeout(function () { + loadData(page, response.Items); + }, 2000); Dashboard.hideLoadingMsg(); }); @@ -314,6 +380,7 @@ $(document).on('pageshowready', ".syncActivityPage", function () { var page = this; + lastDataLoad = 0; Dashboard.getPluginSecurityInfo().done(function (pluginSecurityInfo) { diff --git a/dashboard-ui/scripts/syncjob.js b/dashboard-ui/scripts/syncjob.js index 5cbaeaf49f..126bacf90e 100644 --- a/dashboard-ui/scripts/syncjob.js +++ b/dashboard-ui/scripts/syncjob.js @@ -85,6 +85,10 @@ } html += '
'; + html += '
'; + html += ''; + html += '
'; + html += ''; if (hasActions) { diff --git a/dashboard-ui/themes/ios.css b/dashboard-ui/themes/ios.css index dbce1bb6dd..8fb062aaec 100644 --- a/dashboard-ui/themes/ios.css +++ b/dashboard-ui/themes/ios.css @@ -21,7 +21,7 @@ } .viewMenuBar.semiTransparent { - background-color: rgba(28, 28, 28, .8); + background-color: rgba(28, 28, 28, .75); } .libraryViewNav a { @@ -191,199 +191,4 @@ paper-tab { #footer { /* Eliminate transparency to prevent clicks from passing through to the elements underneath */ background-color: rgb(26,26,26); -} - - -/* Checkboxes */ -input[type='checkbox'] { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - -webkit-appearance: none; - -moz-appearance: none; - -ms-appearance: none; - -o-appearance: none; - appearance: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - height: 31px; - width: 51px; - position: relative; - border-radius: 16px; - cursor: pointer; - outline: 0; - z-index: 0; - margin: 0; - padding: 0; - border: none; - -webkit-transition-duration: 600ms; - -moz-transition-duration: 600ms; - transition-duration: 600ms; - -webkit-transition-timing-function: ease-in-out; - -moz-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; - -webkit-touch-callout: none; - -webkit-text-size-adjust: none; - -webkit-tap-highlight-color: transparent; - -webkit-user-select: none; -} - -.ui-body-a input[type='checkbox'] { - background-color: #e5e5e5; -} - -.ui-body-b input[type='checkbox'] { - background-color: #1f1f1f; -} - -input[type='checkbox']::before { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - height: 27px; - width: 47px; - content: ' '; - position: absolute; - left: 2px; - top: 2px; - border-radius: 16px; - z-index: 1; - -webkit-transition-duration: 300ms; - -moz-transition-duration: 300ms; - transition-duration: 300ms; - -webkit-transform: scale(1); - -moz-transform: scale(1); - -ms-transform: scale(1); - -o-transform: scale(1); - transform: scale(1); -} - -.ui-body-a input[type='checkbox']::before { - background-color: #ffffff; -} - -.ui-body-b input[type='checkbox']::before { - background-color: #000; -} - -input[type='checkbox']::after { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - height: 27px; - width: 27px; - content: ' '; - position: absolute; - border-radius: 27px; - background: #ffffff; - z-index: 2; - top: 2px; - left: 2px; - box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.25), 0px 4px 11px 0px rgba(0, 0, 0, 0.08), -1px 3px 3px 0px rgba(0, 0, 0, 0.14); - -webkit-transition: -webkit-transform 300ms, width 280ms; - -moz-transition: -moz-transform 300ms, width 280ms; - transition: transform 300ms, width 280ms; - -webkit-transform: translate3d(0, 0, 0); - -moz-transform: translate3d(0, 0, 0); - -ms-transform: translate3d(0, 0, 0); - -o-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - -webkit-transition-timing-function: cubic-bezier(0.42, 0.8, 0.58, 1.2); - -moz-transition-timing-function: cubic-bezier(0.42, 0.8, 0.58, 1.2); - transition-timing-function: cubic-bezier(0.42, 0.8, 0.58, 1.2); -} - -input[type='checkbox']:checked { - background-color: #4CD964; - background-image: -webkit-linear-gradient(-90deg, #4CD964 0%, #4dd865 100%); - background-image: linear-gradient(-180deg,#4CD964 0%, #4dd865 100%); -} - - input[type='checkbox']:checked::after { - -webkit-transform: translate3d(16px, 0, 0); - -moz-transform: translate3d(16px, 0, 0); - -ms-transform: translate3d(16px, 0, 0); - -o-transform: translate3d(16px, 0, 0); - transform: translate3d(16px, 0, 0); - right: 18px; - left: inherit; - } - -input[type='checkbox']:active::after { - width: 35px; -} - -input[type='checkbox']:checked::before, input[type='checkbox']:active::before { - -webkit-transform: scale(0); - -moz-transform: scale(0); - -ms-transform: scale(0); - -o-transform: scale(0); - transform: scale(0); -} - -input[type='checkbox']:disabled { - opacity: 0.5; - cursor: default; - -webkit-transition: none; - -moz-transition: none; - transition: none; -} - - input[type='checkbox']:disabled:active::before, input[type='checkbox']:disabled:active::after, input[type='checkbox']:disabled:checked:active::before, input[type='checkbox']:disabled:checked::before { - width: 27px; - -webkit-transition: none; - -moz-transition: none; - transition: none; - } - - input[type='checkbox']:disabled:active::before { - height: 27px; - width: 41px; - -webkit-transform: translate3d(6px, 0, 0); - -moz-transform: translate3d(6px, 0, 0); - -ms-transform: translate3d(6px, 0, 0); - -o-transform: translate3d(6px, 0, 0); - transform: translate3d(6px, 0, 0); - } - - input[type='checkbox']:disabled:checked:active::before { - height: 27px; - width: 27px; - -webkit-transform: scale(0); - -moz-transform: scale(0); - -ms-transform: scale(0); - -o-transform: scale(0); - transform: scale(0); - } - -.ui-body-a input[type='checkbox'] { - background-color: #e5e5e5; -} - -.ui-body-b input[type='checkbox'] { - background-color: #151515; -} - -.ui-body-a input[type='checkbox']::before { - background-color: #ffffff; -} - -.ui-body-b input[type='checkbox']::before { - background-color: #000; -} - -.ui-body-a input[type='checkbox']::after { - background: #ffffff; -} - -.ui-body-b input[type='checkbox']::after { - background: #444; -} - -input[type='checkbox']:checked { - background-color: #4CD964; - background-image: -webkit-linear-gradient(-90deg, #4CD964 0%, #4dd865 100%); - background-image: linear-gradient(-180deg,#4CD964 0%, #4dd865 100%); -} +} \ No newline at end of file diff --git a/dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.popup.css b/dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.popup.css index e79f7bf7df..0077d36342 100644 --- a/dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.popup.css +++ b/dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.popup.css @@ -1,63 +1,81 @@ -.ui-popup-open .ui-header-fixed, +.ui-popup.ui-body-a { + background: #f4f4f4; +} +.ui-popup.ui-body-b { + background: #222; +} +.ui-popup-open .ui-header-fixed, .ui-popup-open .ui-footer-fixed { - position: absolute !important; /* See issues #4816, #4844 and #4874 and popup.js */ + position: absolute !important; /* See issues #4816, #4844 and #4874 and popup.js */ } + .ui-popup-screen { - background-image: url("data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); /* Necessary to set some form of background to ensure element is clickable in IE6/7. While legacy IE won't understand the data-URI'd image, it ensures no additional requests occur in all other browsers with little overhead. */ - top: 0; - left: 0; - right: 0; - bottom: 1px; - position: absolute; - filter: Alpha(Opacity=0); - opacity: 0; - z-index: 1099; -} -.ui-popup-screen.in { - opacity: 0.5; - filter: Alpha(Opacity=50); -} -.ui-popup-screen.out { - opacity: 0; - filter: Alpha(Opacity=0); + background-image: url("data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="); /* Necessary to set some form of background to ensure element is clickable in IE6/7. While legacy IE won't understand the data-URI'd image, it ensures no additional requests occur in all other browsers with little overhead. */ + top: 0; + left: 0; + right: 0; + bottom: 1px; + position: absolute; + filter: Alpha(Opacity=0); + opacity: 0; + z-index: 1099; } + + .ui-popup-screen.in { + opacity: 0.5; + filter: Alpha(Opacity=50); + } + + .ui-popup-screen.out { + opacity: 0; + filter: Alpha(Opacity=0); + } + .ui-popup-container { - z-index: 1100; - display: inline-block; - position: absolute; - padding: 0; - outline: 0; + z-index: 1100; + display: inline-block; + position: absolute; + padding: 0; + outline: 0; } + .ui-popup { - position: relative; -} -.ui-popup.ui-body-inherit { - border-width: 1px; - border-style: solid; + position: relative; } + + .ui-popup.ui-body-inherit { + border-width: 1px; + border-style: solid; + } + .ui-popup-hidden { - left: 0; - top: 0; - position: absolute !important; - visibility: hidden; + left: 0; + top: 0; + position: absolute !important; + visibility: hidden; } + .ui-popup-truncate { - height: 1px; - width: 1px; - margin: -1px; - overflow: hidden; - clip: rect(1px,1px,1px,1px); + height: 1px; + width: 1px; + margin: -1px; + overflow: hidden; + clip: rect(1px,1px,1px,1px); } + .ui-popup.ui-content, .ui-popup .ui-content { - overflow: visible; + overflow: visible; } + .ui-popup > .ui-header { - border-top-width: 0; + border-top-width: 0; } + .ui-popup > .ui-footer { - border-bottom-width: 0; + border-bottom-width: 0; } + .ui-popup > p, .ui-popup > h1, .ui-popup > h2, @@ -65,12 +83,14 @@ .ui-popup > h4, .ui-popup > h5, .ui-popup > h6 { - margin: .5em .4375em; + margin: .5em .4375em; } + .ui-popup > span { - display: block; - margin: .5em .4375em; + display: block; + margin: .5em .4375em; } + .ui-popup-container .ui-content > p, .ui-popup-container .ui-content > h1, .ui-popup-container .ui-content > h2, @@ -78,11 +98,13 @@ .ui-popup-container .ui-content > h4, .ui-popup-container .ui-content > h5, .ui-popup-container .ui-content > h6 { - margin: .5em 0; + margin: .5em 0; } + .ui-popup-container .ui-content > span { - margin: 0; + margin: 0; } + .ui-popup-container .ui-content > p:first-child, .ui-popup-container .ui-content > h1:first-child, .ui-popup-container .ui-content > h2:first-child, @@ -90,8 +112,9 @@ .ui-popup-container .ui-content > h4:first-child, .ui-popup-container .ui-content > h5:first-child, .ui-popup-container .ui-content > h6:first-child { - margin-top: 0; + margin-top: 0; } + .ui-popup-container .ui-content > p:last-child, .ui-popup-container .ui-content > h1:last-child, .ui-popup-container .ui-content > h2:last-child, @@ -99,81 +122,121 @@ .ui-popup-container .ui-content > h4:last-child, .ui-popup-container .ui-content > h5:last-child, .ui-popup-container .ui-content > h6:last-child { - margin-bottom: 0; + margin-bottom: 0; } + .ui-popup > img { - max-width: 100%; - max-height: 100%; - vertical-align: middle; + max-width: 100%; + max-height: 100%; + vertical-align: middle; } + .ui-popup:not(.ui-content) > img:only-child, .ui-popup:not(.ui-content) > .ui-btn-left:first-child + img:last-child, .ui-popup:not(.ui-content) > .ui-btn-right:first-child + img:last-child { - -webkit-border-radius: inherit; - border-radius: inherit; + -webkit-border-radius: inherit; + border-radius: inherit; } + .ui-popup iframe { - vertical-align: middle; + vertical-align: middle; } + .ui-popup > .ui-btn-left, .ui-popup > .ui-btn-right { - position: absolute; - top: -11px; - margin: 0; - z-index: 1101; + position: absolute; + top: -11px; + margin: 0; + z-index: 1101; } + .ui-popup > .ui-btn-left { - left: -11px; + left: -11px; } + .ui-popup > .ui-btn-right { - right: -11px; + right: -11px; } @-webkit-keyframes fadein { - from { opacity: 0; } - to { opacity: 1; } + from { + opacity: 0; + } + + to { + opacity: 1; + } } + @-moz-keyframes fadein { - from { opacity: 0; } - to { opacity: 1; } + from { + opacity: 0; + } + + to { + opacity: 1; + } } + @keyframes fadein { - from { opacity: 0; } - to { opacity: 1; } + from { + opacity: 0; + } + + to { + opacity: 1; + } } @-webkit-keyframes fadeout { - from { opacity: 1; } - to { opacity: 0; } + from { + opacity: 1; + } + + to { + opacity: 0; + } } + @-moz-keyframes fadeout { - from { opacity: 1; } - to { opacity: 0; } + from { + opacity: 1; + } + + to { + opacity: 0; + } } + @keyframes fadeout { - from { opacity: 1; } - to { opacity: 0; } + from { + opacity: 1; + } + + to { + opacity: 0; + } } .fade.out { - opacity: 0; - -webkit-animation-duration: 125ms; - -webkit-animation-name: fadeout; - -moz-animation-duration: 125ms; - -moz-animation-name: fadeout; - animation-duration: 125ms; - animation-name: fadeout; + opacity: 0; + -webkit-animation-duration: 125ms; + -webkit-animation-name: fadeout; + -moz-animation-duration: 125ms; + -moz-animation-name: fadeout; + animation-duration: 125ms; + animation-name: fadeout; } .fade.in { - opacity: 1; - -webkit-animation-duration: 225ms; - -webkit-animation-name: fadein; - -moz-animation-duration: 225ms; - -moz-animation-name: fadein; - animation-duration: 225ms; - animation-name: fadein; + opacity: 1; + -webkit-animation-duration: 225ms; + -webkit-animation-name: fadein; + -moz-animation-duration: 225ms; + -moz-animation-name: fadein; + animation-duration: 225ms; + animation-name: fadein; } @@ -222,32 +285,32 @@ **/ .ui-popup-arrow-container { - width: 20px; - height: 20px; + width: 20px; + height: 20px; } -/* aside from the "infinities" (-1000,2000), triangle height is used */ -.ui-popup-arrow-container.ui-popup-arrow-l { - left: -10px; - clip: rect(-1000px,10px,2000px,-1000px); -} + /* aside from the "infinities" (-1000,2000), triangle height is used */ + .ui-popup-arrow-container.ui-popup-arrow-l { + left: -10px; + clip: rect(-1000px,10px,2000px,-1000px); + } -.ui-popup-arrow-container.ui-popup-arrow-t { - top: -10px; - clip: rect(-1000px,2000px,10px,-1000px); -} + .ui-popup-arrow-container.ui-popup-arrow-t { + top: -10px; + clip: rect(-1000px,2000px,10px,-1000px); + } -.ui-popup-arrow-container.ui-popup-arrow-r { - right: -10px; - clip: rect(-1000px,2000px,2000px,10px); -} + .ui-popup-arrow-container.ui-popup-arrow-r { + right: -10px; + clip: rect(-1000px,2000px,2000px,10px); + } -.ui-popup-arrow-container.ui-popup-arrow-b { - bottom: -10px; - clip: rect(10px,2000px,1000px,-1000px); -} + .ui-popup-arrow-container.ui-popup-arrow-b { + bottom: -10px; + clip: rect(10px,2000px,1000px,-1000px); + } -/** + /** * For each side, the arrow is twice the desired size and its corner is aligned * with the edge of the container: * @@ -268,85 +331,82 @@ * (clips arrow) **/ -.ui-popup-arrow-container .ui-popup-arrow { - /* (4*desired triangle height)/sqrt(2) - does not account for border - centred within the outer rectangle */ - width: 28.284271247px; - height: 28.284271247px; - border-width: 1px; - border-style: solid; -} + .ui-popup-arrow-container .ui-popup-arrow { + /* (4*desired triangle height)/sqrt(2) - does not account for border - centred within the outer rectangle */ + width: 28.284271247px; + height: 28.284271247px; + border-width: 1px; + border-style: solid; + } -.ui-popup-arrow-container.ui-popup-arrow-t .ui-popup-arrow { - left: -4.142135623px; - top: 5.857864376px; -} + .ui-popup-arrow-container.ui-popup-arrow-t .ui-popup-arrow { + left: -4.142135623px; + top: 5.857864376px; + } -.ui-popup-arrow-container.ui-popup-arrow-b .ui-popup-arrow { - left: -4.142135623px; - top: -14.142135623px; -} + .ui-popup-arrow-container.ui-popup-arrow-b .ui-popup-arrow { + left: -4.142135623px; + top: -14.142135623px; + } -.ui-popup-arrow-container.ui-popup-arrow-l .ui-popup-arrow { - left: 5.857864376px; - top: -4.142135623px; -} + .ui-popup-arrow-container.ui-popup-arrow-l .ui-popup-arrow { + left: 5.857864376px; + top: -4.142135623px; + } -.ui-popup-arrow-container.ui-popup-arrow-r .ui-popup-arrow { - left: -14.142135623px; - top: -4.142135623px; -} + .ui-popup-arrow-container.ui-popup-arrow-r .ui-popup-arrow { + left: -14.142135623px; + top: -4.142135623px; + } -/* Fix rotation center for oldIE - see http://www.useragentman.com/IETransformsTranslator/ */ -.ui-popup-arrow-container.ui-popup-arrow-t.ie .ui-popup-arrow { - margin-left: -5.857864376269049px; - margin-top: -7.0710678118654755px; -} -.ui-popup-arrow-container.ui-popup-arrow-b.ie .ui-popup-arrow { - margin-left: -5.857864376269049px; - margin-top: -4.142135623730951px; -} - -.ui-popup-arrow-container.ui-popup-arrow-l.ie .ui-popup-arrow { - margin-left: -7.0710678118654755px; - margin-top: -5.857864376269049px; -} -.ui-popup-arrow-container.ui-popup-arrow-r.ie .ui-popup-arrow { - margin-left: -4.142135623730951px; - margin-top: -5.857864376269049px; -} + /* Fix rotation center for oldIE - see http://www.useragentman.com/IETransformsTranslator/ */ + .ui-popup-arrow-container.ui-popup-arrow-t.ie .ui-popup-arrow { + margin-left: -5.857864376269049px; + margin-top: -7.0710678118654755px; + } + + .ui-popup-arrow-container.ui-popup-arrow-b.ie .ui-popup-arrow { + margin-left: -5.857864376269049px; + margin-top: -4.142135623730951px; + } + + .ui-popup-arrow-container.ui-popup-arrow-l.ie .ui-popup-arrow { + margin-left: -7.0710678118654755px; + margin-top: -5.857864376269049px; + } + + .ui-popup-arrow-container.ui-popup-arrow-r.ie .ui-popup-arrow { + margin-left: -4.142135623730951px; + margin-top: -5.857864376269049px; + } /* structure */ .ui-popup > .ui-popup-arrow-guide { - position: absolute; - left: 0; - right: 0; - top: 0; - bottom: 0; - visibility: hidden; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + visibility: hidden; } .ui-popup-arrow-container { - position: absolute; + position: absolute; } .ui-popup-arrow { - -webkit-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); - position: absolute; - overflow: hidden; - box-sizing: border-box; + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); + position: absolute; + overflow: hidden; + box-sizing: border-box; } .ui-popup-arrow-container.ie .ui-popup-arrow { - -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865474, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865474, SizingMethod='auto expand')"; - filter: progid:DXImageTransform.Microsoft.Matrix( - M11=0.7071067811865474, - M12=-0.7071067811865477, - M21=0.7071067811865477, - M22=0.7071067811865474, - SizingMethod='auto expand'); + -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865474, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865474, SizingMethod='auto expand')"; + filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.7071067811865474, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865474, SizingMethod='auto expand'); } @@ -355,8 +415,8 @@ /* Popup arrow */ .ui-popup.ui-corner-all > .ui-popup-arrow-guide { - left: .6em /*{global-radii-blocks}*/; - right: .6em /*{global-radii-blocks}*/; - top: .6em /*{global-radii-blocks}*/; - bottom: .6em /*{global-radii-blocks}*/; + left: .6em /*{global-radii-blocks}*/; + right: .6em /*{global-radii-blocks}*/; + top: .6em /*{global-radii-blocks}*/; + bottom: .6em /*{global-radii-blocks}*/; } diff --git a/dashboard-ui/thirdparty/paper-button-style.css b/dashboard-ui/thirdparty/paper-button-style.css index 23750d1573..874dc9f431 100644 --- a/dashboard-ui/thirdparty/paper-button-style.css +++ b/dashboard-ui/thirdparty/paper-button-style.css @@ -391,9 +391,29 @@ paper-menu-item { border-color: #eee; } +.ui-body-a paper-checkbox #checkbox.checked.paper-checkbox { + background-color: #52B54B; + border-color: #52B54B; +} + .ui-body-b paper-checkbox #checkbox.checked.paper-checkbox { - background-color: #2ad; - border-color: #2ad; + background-color: #52B54B; + border-color: #52B54B; +} + +paper-checkbox #checkboxContainer { + width: 22px !important; + height: 22px !important; +} + +paper-checkbox paper-ripple { + top: -13px !important; + left: -13px !important; +} + +paper-checkbox #checkmark { + border-right-width: 4px !important; + border-bottom-width: 4px !important; } .paperCheckboxList paper-checkbox { @@ -533,3 +553,36 @@ paper-dialog paper-radio-group paper-radio-button { padding: 0 1em; margin-top: 1em; } + +.paperToggleContainer { + padding: .5em 0; +} + + .paperToggleContainer paper-toggle-button { + vertical-align: middle; + } + + .paperToggleContainer > span { + vertical-align: middle; + margin-left: 1em; + } + +paper-toggle-button #toggleBar { + background-color: #080808; +} + +paper-toggle-button #toggleButton, paper-toggle-button[checked] #toggleBar { + background-color: #52B54B; +} + +paper-toggle-button paper-ripple { + color: #52B54B; +} + +.ui-body-b paper-progress #progressContainer { + background-color: #222 !important; +} + +paper-progress.mini #progressContainer { + height: 3px !important; +} diff --git a/dashboard-ui/vulcanize-out.html b/dashboard-ui/vulcanize-out.html index f3c8c43838..b66d52b22b 100644 --- a/dashboard-ui/vulcanize-out.html +++ b/dashboard-ui/vulcanize-out.html @@ -16614,7 +16614,8 @@ iron-selector:not(.narrow-layout) #main ::content [paper-drawer-toggle] { background-color: var(--paper-progress-container-color, --google-grey-300); } - :host(.transiting) > * { + :host(.transiting) #primaryProgress, + :host(.transiting) #secondaryProgress { -webkit-transition-property: -webkit-transform; transition-property: transform;