From e7a3a38b03895cefbc7de56dad3290b4088292aa Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Fri, 27 Dec 2013 11:18:42 -0500 Subject: [PATCH] moved search into slide out panel --- dashboard-ui/boxsets.html | 4 +- dashboard-ui/css/librarybrowser.css | 43 ++- dashboard-ui/css/mediaplayer.css | 334 +++++++++++++++++++++++ dashboard-ui/css/search.css | 102 +------ dashboard-ui/css/site.css | 334 ----------------------- dashboard-ui/episodes.html | 4 +- dashboard-ui/gamegenres.html | 4 +- dashboard-ui/games.html | 4 +- dashboard-ui/gamestudios.html | 4 +- dashboard-ui/gamesystems.html | 4 +- dashboard-ui/itemlist.html | 4 +- dashboard-ui/librarysettings.html | 10 +- dashboard-ui/moviegenres.html | 4 +- dashboard-ui/moviepeople.html | 4 +- dashboard-ui/movies.html | 4 +- dashboard-ui/moviestudios.html | 4 +- dashboard-ui/movietrailers.html | 4 +- dashboard-ui/musicalbumartists.html | 4 +- dashboard-ui/musicalbums.html | 4 +- dashboard-ui/musicartists.html | 4 +- dashboard-ui/musicgenres.html | 4 +- dashboard-ui/musicvideos.html | 4 +- dashboard-ui/scripts/librarybrowser.js | 19 +- dashboard-ui/scripts/notifications.js | 4 +- dashboard-ui/scripts/pluginspage.js | 13 +- dashboard-ui/scripts/search.js | 155 ++++------- dashboard-ui/scripts/site.js | 3 +- dashboard-ui/scripts/userprofilespage.js | 3 +- dashboard-ui/scripts/wizarduserpage.js | 6 +- dashboard-ui/songs.html | 4 +- dashboard-ui/tvgenres.html | 4 +- dashboard-ui/tvpeople.html | 4 +- dashboard-ui/tvshows.html | 4 +- dashboard-ui/tvstudios.html | 4 +- 34 files changed, 493 insertions(+), 621 deletions(-) create mode 100644 dashboard-ui/css/mediaplayer.css diff --git a/dashboard-ui/boxsets.html b/dashboard-ui/boxsets.html index 843931e15..4a50e46c8 100644 --- a/dashboard-ui/boxsets.html +++ b/dashboard-ui/boxsets.html @@ -21,8 +21,8 @@
- - + +
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index d4ab6a798..4022662d9 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -4,19 +4,7 @@ } .libraryPage { - padding-top: 68px !important; -} - -@media all and (min-width: 600px) { - .libraryPage:not(.pageViewCount5) { - padding-top: 35px !important; - } -} - -@media all and (min-width: 690px) { - .pageViewCount5 { - padding-top: 35px !important; - } + padding-top: 46px !important; } .ui-panel fieldset + fieldset { @@ -54,21 +42,24 @@ padding: 7px .5em 6px; display: inline-block; vertical-align: middle; - font-family: Arial; } - .viewMenuLink:hover { - color: #fff; +.viewMenuBar .btnCurrentUser { + padding: 7px 1em 6px; +} + +.viewMenuLink:hover { + color: #fff; +} + + .viewMenuLink:hover img { + opacity: .5; } - .viewMenuLink:hover img { - opacity: .5; - } - - .viewMenuLink img { - height: 20px; - vertical-align: top; - } +.viewMenuLink img { + height: 24px; + vertical-align: top; +} .viewMenuSecondary { float: right; @@ -592,6 +583,10 @@ a.itemTag:hover { padding-right: .8em; } + .viewMenuBar .btnCurrentUser { + padding-right: 1.5em; + } + .lnkSibling:not(.hide) { display: block; } diff --git a/dashboard-ui/css/mediaplayer.css b/dashboard-ui/css/mediaplayer.css new file mode 100644 index 000000000..62c55dcfc --- /dev/null +++ b/dashboard-ui/css/mediaplayer.css @@ -0,0 +1,334 @@ + + +/* Now playing bar */ +#nowPlayingBar { + padding: 6px .5em; + border-top: 2px solid green; +} + + #nowPlayingBar .highPosition { + z-index: 99999; + position: relative; + opacity: 0.5; + } + + #nowPlayingBar .highPosition:hover:not(.barBackground ) { + opacity: 0.9; + } + + #nowPlayingBar .barBackground { + border-top: 2px solid green; + background: #3c3c3c; + position: absolute; + margin: -8px -0.5em !important; + width: 100%; + height: 100%; + } + + #nowPlayingBar > *:not(#mediaElement):not(.mediaFlyoutContainer):not(.barBackground ) { + margin: 0 1em; + position: relative; + } + +.nowPlayingBarImage { + border: 1px solid #a7a7a7!important; + padding: 1px; + vertical-align: bottom; +} + +.mediaButton { + display: inline-block; + position: relative; + top: -4px; +} + +#mediaElement { + display: inline-block; + position: relative; +} + +.nowPlayingMediaInfo div { + display: inline-block; +} + +.nowPlayingMediaInfo a { + margin-right: .25em; +} + + +.nowPlayingMediaInfo { + display: none; +} + +.nowPlayingText { + position: relative; + top: -3px; + margin-left: 3px; +} + +@media all and (min-width: 650px) { + .nowPlayingMediaInfo { + display: inline-block; + } +} + +.mediaButton img { + height: 24px; +} + +.itemVideo { + position: absolute; + z-index: 99998; + height: auto; + width: 270px; + bottom: 45px; + left: -290px; + border: 1px solid #666; + background: #000; +} + +.fullscreenVideo { + position: fixed; + top: 0 !important; + bottom: 0 !important; + right: 0 !important; + left: 0 !important; + width: 100%; + height: 100%; + border: 0; + z-index: 99996; +} + +.currentTime { + display: inline-block; + position: relative; + top: -10px; + width: 110px; + margin-right: .25em; +} + +.mediaSlider { + position: relative; + top: -10px; + width: 50px; + cursor: pointer; +} + +@media screen and (-webkit-min-device-pixel-ratio:0) { + /* IE10 won't see this (good) '*/ + .mediaSlider { + -webkit-appearance: none; + -moz-apperance: none; + background: #777; + border-radius: 5px; + vertical-align: bottom; + height: 3px; + top: -17px; + } +} + + +.mediaSlider::-webkit-slider-thumb { + -webkit-appearance: none; + -moz-apperance: none; + width: 15px; + height: 15px; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + -ms-border-radius: 10px; + -o-border-radius: 10px; + border-radius: 10px; + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fefefe), color-stop(0.49, #dddddd), color-stop(0.51, #d1d1d1), color-stop(1, #a1a1a1) ); +} + +.positionSlider { + width: 130px; +} + +.volumeButton { + margin-right: .5em!important; +} + +::-ms-thumb { + background-image: linear-gradient(#fefefe,#dddddd); + width: 15px; +} + +::-ms-track { + padding: 0; + border: 0; + color: #777; +} + +input[type="range"]::-ms-fill-lower { + background-color: #777; +} + +input[type="range"]::-ms-fill-upper { + background-color: #777; +} + +::-ms-tooltip { + display: none; /* display and visibility only */ +} + +@media all and (max-width: 600px) { + .volumeButton, .volumeSlider, .nowPlayingText, .chaptersButton, .audioTracksButton { + display: none!important; + } + + #nowPlayingBar > *:not(#mediaElement):not(.mediaFlyoutContainer):not(.barBackground ) { + margin: 0 .5em; + } + + .positionSlider { + width: 50px; + } + + .itemVideo:not(.fullscreenVideo) { + left: -250px; + } +} + +@media all and (max-width: 750px) { + .positionSlider { + width: 50px; + } +} + +.mediaFlyoutContainer { + display: inline-block; +} + +.mediaPlayerFlyout { + width: 200px; + color: #000; + background-color: #fff; + border: 1px solid #999; + position: absolute; + z-index: 99999; + bottom: 55px; + margin-left: -50px; + max-height: 300px; + overflow-y: auto; + font-size: 13px; +} + +.chaptersFlyout { + width: 250px; +} + +.audioTracksFlyout { + width: 250px; +} + +.mediaFlyoutOption { + display: block; + text-decoration: none; + color: #000; + border-bottom: 1px solid #eee; + cursor: pointer; +} + + .mediaFlyoutOption:hover, .mediaFlyoutOption:focus { + background-color: #eee; + } + +.selectedMediaFlyoutOption { + background-color: #d9F4FF; + background-image: url(images/media/selected.png); + background-repeat: no-repeat; + background-position: right top; + background-size: 16px 16px; +} + +.mediaFlyoutOptionImage { + display: inline-block; + width: 15%; + vertical-align: middle; +} + + .mediaFlyoutOptionImage + .mediaFlyoutOptionContent { + vertical-align: top; + display: inline-block; + width: 85%; + } + +.chaptersFlyout .mediaFlyoutOptionImage { + width: 40%; +} + + .chaptersFlyout .mediaFlyoutOptionImage + .mediaFlyoutOptionContent { + width: 60%; + } + +.mediaFlyoutOptionName { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + padding-left: 5px; +} + +.mediaFlyoutOptionSecondaryText { + font-size: 12px; + color: #999; + margin-top: 3px; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + padding-left: 5px; +} + +@media (min-width: 750px) { + .itemVideo:not(.fullscreenVideo) { + width: 320px; + } +} + +@media (min-width: 1200px) { + .itemVideo:not(.fullscreenVideo) { + width: 320px; + } +} + +@media (min-width: 1440px) { + .itemVideo:not(.fullscreenVideo) { + width: 400px; + } + + .positionSlider { + width: 400px; + } + + .itemVideo { + left: -560px; + } +} + +@media (min-width: 1700px) { + .itemVideo:not(.fullscreenVideo) { + width: 500px; + } + + .positionSlider { + width: 500px; + } + + .itemVideo { + left: -660px; + } +} + +@media (min-width: 2400px) { + .itemVideo:not(.fullscreenVideo) { + width: 550px; + } + + .positionSlider { + width: 550px; + } + + .itemVideo { + left: -710px; + } +} diff --git a/dashboard-ui/css/search.css b/dashboard-ui/css/search.css index 97c24bf6a..0a8431a69 100644 --- a/dashboard-ui/css/search.css +++ b/dashboard-ui/css/search.css @@ -1,133 +1,57 @@ -.headerSearch { - display: none; - margin-right: 1em; - position: relative; -} - -.txtSearch { - vertical-align: middle; - font-size: 14px; - margin: 0 .15em 0 0; - width: 80px; - padding: 0; - border: 1px solid #4d90fe; -} - -.btnSearch { - vertical-align: middle; - background-color: #4d90fe; - background-image: -webkit-gradient(linear,left top,left bottom,from(#4d90fe),to(#4787ed)); - background-image: -webkit-linear-gradient(top,#4d90fe,#4787ed); - background-image: -moz-linear-gradient(top,#4d90fe,#4787ed); - background-image: -ms-linear-gradient(top,#4d90fe,#4787ed); - background-image: -o-linear-gradient(top,#4d90fe,#4787ed); - background-image: linear-gradient(top,#4d90fe,#4787ed); - border: 1px solid #3079ed; - color: #fff!important; - margin: 0 0; - -moz-border-radius: 2px; - -webkit-border-radius: 2px; - border-radius: 2px; - font-weight: bold; - min-width: 54px; - padding: 0 4px; - text-align: center; - text-decoration: none !important; - -moz-user-select: none; - -webkit-user-select: none; -} - -.txtSearch, .btnSearch { - height: 22px; - line-height: 22px; -} - - .btnSearch img { - height: 22px; - margin: 0 auto; - border: 0; - } - -.searchHints { - width: 248px; - color: #000; - background-color: #fff; - border: 1px solid #999; - position: absolute; - z-index: 998; - margin-top: 1px; -} - -.searchHintsContent { - padding: 10px; +.searchHints { + margin-top: 1em; } .searchHint { display: block; text-decoration: none; - color: #000; - border-bottom: 1px solid #eee; + color: #fff; + border-bottom: 1px solid #444; } .searchHint:hover { - background-color: #eee; + background-color: #444; } .searchHint:focus { - background-color: #eee; + background-color: #444; } .searchHintImage { display: inline-block; - width: 15%; + width: 20%; vertical-align: middle; + margin: 4px 0; } .searchHintContent { vertical-align: top; display: inline-block; - width: 85%; + width: 80%; } .searchHintName { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; - font-size: 14px; - color: #000; + font-size: 12px; + color: #fff; } .searchHintSecondaryText { font-size: 12px; - color: #555; + color: #bbb; margin-top: 3px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; + font-weight: 300; } .searchHintContentInner { padding: 2px 5px; } -@media all and (min-width: 300px) { - - .headerSearch { - display: inline-block; - } -} - -@media all and (min-width: 850px) { - - .txtSearch { - width: 200px; - } - - .searchHints { - width: 248px; - } -} - .circle { background-color: rgba(0,0,0,0); border: 5px solid rgba(0,183,229,0.9); diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css index 5a73f1b82..ec21f1827 100644 --- a/dashboard-ui/css/site.css +++ b/dashboard-ui/css/site.css @@ -775,344 +775,10 @@ progress { opacity: .5; } -/* Now playing bar */ -#nowPlayingBar { - padding: 6px .5em; - border-top: 2px solid green; -} - - #nowPlayingBar .highPosition { - z-index: 99999; - position: relative; - opacity: 0.5; - } - - #nowPlayingBar .highPosition:hover:not(.barBackground ) { - opacity: 0.9; - } - - #nowPlayingBar .barBackground { - border-top: 2px solid green; - background: #3c3c3c; - position: absolute; - margin: -8px -0.5em !important; - width: 100%; - height: 100%; - } - - #nowPlayingBar > *:not(#mediaElement):not(.mediaFlyoutContainer):not(.barBackground ) { - margin: 0 1em; - position: relative; - } - -.nowPlayingBarImage { - border: 1px solid #a7a7a7!important; - padding: 1px; - vertical-align: bottom; -} - -.mediaButton { - display: inline-block; - position: relative; - top: -4px; -} - -#mediaElement { - display: inline-block; - position: relative; -} - -.nowPlayingMediaInfo div { - display: inline-block; -} - -.nowPlayingMediaInfo a { - margin-right: .25em; -} - - -.nowPlayingMediaInfo { - display: none; -} - -.nowPlayingText { - position: relative; - top: -3px; - margin-left: 3px; -} - -@media all and (min-width: 650px) { - .nowPlayingMediaInfo { - display: inline-block; - } -} - -.mediaButton img { - height: 24px; -} - -.itemVideo { - position: absolute; - z-index: 99998; - height: auto; - width: 270px; - bottom: 45px; - left: -290px; - border: 1px solid #666; - background: #000; -} - -.fullscreenVideo { - position: fixed; - top: 0 !important; - bottom: 0 !important; - right: 0 !important; - left: 0 !important; - width: 100%; - height: 100%; - border: 0; - z-index: 99996; -} - -.currentTime { - display: inline-block; - position: relative; - top: -10px; - width: 110px; - margin-right: .25em; -} - -.mediaSlider { - position: relative; - top: -10px; - width: 50px; - cursor: pointer; -} - -@media screen and (-webkit-min-device-pixel-ratio:0) { - /* IE10 won't see this (good) '*/ - .mediaSlider { - -webkit-appearance: none; - -moz-apperance: none; - background: #777; - border-radius: 5px; - vertical-align: bottom; - height: 3px; - top: -17px; - } -} - - -.mediaSlider::-webkit-slider-thumb { - -webkit-appearance: none; - -moz-apperance: none; - width: 15px; - height: 15px; - -webkit-border-radius: 10px; - -moz-border-radius: 10px; - -ms-border-radius: 10px; - -o-border-radius: 10px; - border-radius: 10px; - background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fefefe), color-stop(0.49, #dddddd), color-stop(0.51, #d1d1d1), color-stop(1, #a1a1a1) ); -} - -.positionSlider { - width: 130px; -} - -.volumeButton { - margin-right: .5em!important; -} - -::-ms-thumb { - background-image: linear-gradient(#fefefe,#dddddd); - width: 15px; -} - -::-ms-track { - padding: 0; - border: 0; - color: #777; -} - -input[type="range"]::-ms-fill-lower { - background-color: #777; -} - -input[type="range"]::-ms-fill-upper { - background-color: #777; -} - -::-ms-tooltip { - display: none; /* display and visibility only */ -} - .userProfileIcon { width: 36px; } - -@media all and (max-width: 600px) { - .volumeButton, .volumeSlider, .nowPlayingText, .chaptersButton, .audioTracksButton { - display: none!important; - } - - #nowPlayingBar > *:not(#mediaElement):not(.mediaFlyoutContainer):not(.barBackground ) { - margin: 0 .5em; - } - - .positionSlider { - width: 50px; - } - - .itemVideo:not(.fullscreenVideo) { - left: -250px; - } -} - -@media all and (max-width: 750px) { - .positionSlider { - width: 50px; - } -} - -.mediaFlyoutContainer { - display: inline-block; -} - -.mediaPlayerFlyout { - width: 200px; - color: #000; - background-color: #fff; - border: 1px solid #999; - position: absolute; - z-index: 99999; - bottom: 55px; - margin-left: -50px; - max-height: 300px; - overflow-y: auto; - font-size: 13px; -} - -.chaptersFlyout { - width: 250px; -} - -.audioTracksFlyout { - width: 250px; -} - -.mediaFlyoutOption { - display: block; - text-decoration: none; - color: #000; - border-bottom: 1px solid #eee; - cursor: pointer; -} - - .mediaFlyoutOption:hover, .mediaFlyoutOption:focus { - background-color: #eee; - } - -.selectedMediaFlyoutOption { - background-color: #d9F4FF; - background-image: url(images/media/selected.png); - background-repeat: no-repeat; - background-position: right top; - background-size: 16px 16px; -} - -.mediaFlyoutOptionImage { - display: inline-block; - width: 15%; - vertical-align: middle; -} - - .mediaFlyoutOptionImage + .mediaFlyoutOptionContent { - vertical-align: top; - display: inline-block; - width: 85%; - } - -.chaptersFlyout .mediaFlyoutOptionImage { - width: 40%; -} - - .chaptersFlyout .mediaFlyoutOptionImage + .mediaFlyoutOptionContent { - width: 60%; - } - -.mediaFlyoutOptionName { - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - padding-left: 5px; -} - -.mediaFlyoutOptionSecondaryText { - font-size: 12px; - color: #999; - margin-top: 3px; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - padding-left: 5px; -} - -@media (min-width: 750px) { - .itemVideo:not(.fullscreenVideo) { - width: 320px; - } -} - -@media (min-width: 1200px) { - .itemVideo:not(.fullscreenVideo) { - width: 320px; - } -} - -@media (min-width: 1440px) { - .itemVideo:not(.fullscreenVideo) { - width: 400px; - } - - .positionSlider { - width: 400px; - } - - .itemVideo { - left: -560px; - } -} - -@media (min-width: 1700px) { - .itemVideo:not(.fullscreenVideo) { - width: 500px; - } - - .positionSlider { - width: 500px; - } - - .itemVideo { - left: -660px; - } -} - -@media (min-width: 2400px) { - .itemVideo:not(.fullscreenVideo) { - width: 550px; - } - - .positionSlider { - width: 550px; - } - - .itemVideo { - left: -710px; - } -} - #editItemMetadataPage #txtOverview { height: 70px; } diff --git a/dashboard-ui/episodes.html b/dashboard-ui/episodes.html index 438ffe0a6..85521547d 100644 --- a/dashboard-ui/episodes.html +++ b/dashboard-ui/episodes.html @@ -22,8 +22,8 @@
- - + +
diff --git a/dashboard-ui/gamegenres.html b/dashboard-ui/gamegenres.html index d8f2ef949..d63c10316 100644 --- a/dashboard-ui/gamegenres.html +++ b/dashboard-ui/gamegenres.html @@ -15,8 +15,8 @@
- - + +
diff --git a/dashboard-ui/games.html b/dashboard-ui/games.html index 5195e26a2..90daf4fd2 100644 --- a/dashboard-ui/games.html +++ b/dashboard-ui/games.html @@ -17,8 +17,8 @@
- - + +
diff --git a/dashboard-ui/gamestudios.html b/dashboard-ui/gamestudios.html index ab041e69c..86e97c515 100644 --- a/dashboard-ui/gamestudios.html +++ b/dashboard-ui/gamestudios.html @@ -15,8 +15,8 @@
- - + +
diff --git a/dashboard-ui/gamesystems.html b/dashboard-ui/gamesystems.html index f86d33626..3152be049 100644 --- a/dashboard-ui/gamesystems.html +++ b/dashboard-ui/gamesystems.html @@ -15,8 +15,8 @@
- - + +
diff --git a/dashboard-ui/itemlist.html b/dashboard-ui/itemlist.html index ff9ba2532..39ef83e40 100644 --- a/dashboard-ui/itemlist.html +++ b/dashboard-ui/itemlist.html @@ -22,8 +22,8 @@
- - + +
diff --git a/dashboard-ui/librarysettings.html b/dashboard-ui/librarysettings.html index c32df5c88..810d509b3 100644 --- a/dashboard-ui/librarysettings.html +++ b/dashboard-ui/librarysettings.html @@ -17,7 +17,7 @@
  • - +
    This folder contains actor, artist, genre and studio images. @@ -26,7 +26,7 @@
  • - +
  • - -
    • diff --git a/dashboard-ui/moviegenres.html b/dashboard-ui/moviegenres.html index c5f78d275..2c6f8ae06 100644 --- a/dashboard-ui/moviegenres.html +++ b/dashboard-ui/moviegenres.html @@ -19,8 +19,8 @@
    - - + +
    diff --git a/dashboard-ui/moviepeople.html b/dashboard-ui/moviepeople.html index 0b8f2182e..a5432efab 100644 --- a/dashboard-ui/moviepeople.html +++ b/dashboard-ui/moviepeople.html @@ -21,8 +21,8 @@
    - - + +
    diff --git a/dashboard-ui/movies.html b/dashboard-ui/movies.html index 6362316d8..e6c5c26ea 100644 --- a/dashboard-ui/movies.html +++ b/dashboard-ui/movies.html @@ -28,8 +28,8 @@
    - - + +
    diff --git a/dashboard-ui/moviestudios.html b/dashboard-ui/moviestudios.html index c4a94ae67..d88cc0d2e 100644 --- a/dashboard-ui/moviestudios.html +++ b/dashboard-ui/moviestudios.html @@ -19,8 +19,8 @@
    - - + +
    diff --git a/dashboard-ui/movietrailers.html b/dashboard-ui/movietrailers.html index 8c6608aca..c5075498f 100644 --- a/dashboard-ui/movietrailers.html +++ b/dashboard-ui/movietrailers.html @@ -21,8 +21,8 @@
    - - + +
    diff --git a/dashboard-ui/musicalbumartists.html b/dashboard-ui/musicalbumartists.html index 6aef0d787..d6fba10e5 100644 --- a/dashboard-ui/musicalbumartists.html +++ b/dashboard-ui/musicalbumartists.html @@ -20,8 +20,8 @@
    - - + +
    diff --git a/dashboard-ui/musicalbums.html b/dashboard-ui/musicalbums.html index 6b9a34e0c..990292c51 100644 --- a/dashboard-ui/musicalbums.html +++ b/dashboard-ui/musicalbums.html @@ -25,8 +25,8 @@
    - - + +
    diff --git a/dashboard-ui/musicartists.html b/dashboard-ui/musicartists.html index 2e5621e62..3ad2e812a 100644 --- a/dashboard-ui/musicartists.html +++ b/dashboard-ui/musicartists.html @@ -20,8 +20,8 @@
    - - + +
    diff --git a/dashboard-ui/musicgenres.html b/dashboard-ui/musicgenres.html index 15aa5f2ae..e100cf461 100644 --- a/dashboard-ui/musicgenres.html +++ b/dashboard-ui/musicgenres.html @@ -17,8 +17,8 @@
    - - + +
    diff --git a/dashboard-ui/musicvideos.html b/dashboard-ui/musicvideos.html index 446e997ba..98472a8ec 100644 --- a/dashboard-ui/musicvideos.html +++ b/dashboard-ui/musicvideos.html @@ -21,8 +21,8 @@
    - - + +
    diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index 2116665a0..c4eb8cacb 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -2392,9 +2392,7 @@ html += '
    '; - html += Search.getSearchHtml(); - - html += ''; + html += ''; if (user.PrimaryImageTag) { @@ -2411,8 +2409,10 @@ html += ''; + html += ''; + if (user.Configuration.IsAdministrator) { - html += 'Dashboard'; + html += 'Dashboard'; } html += '
    '; @@ -2421,7 +2421,7 @@ $(page).prepend(html); - Search.onSearchRendered($('.viewMenuBar', page)); + Search.onSearchRendered($('.viewMenuBar', page).trigger('create')); } function insertViews(page, user, counts, liveTvServices) { @@ -2433,36 +2433,27 @@ var view = page.getAttribute('data-view') || getParameterByName('context'); - var viewCount = 0; - if (counts.MovieCount || counts.TrailerCount) { html += '' + (view == 'movies' ? selectedHtml : '') + 'Movies'; - viewCount++; } if (counts.EpisodeCount || counts.SeriesCount) { html += '' + (view == 'tv' ? selectedHtml : '') + 'TV'; - viewCount++; } if (liveTvServices.length) { html += '' + (view == 'livetv' ? selectedHtml : '') + 'Live TV'; - viewCount++; } if (counts.SongCount || counts.MusicVideoCount) { html += '' + (view == 'music' ? selectedHtml : '') + 'Music'; - viewCount++; } if (counts.GameCount) { html += '' + (view == 'games' ? selectedHtml : '') + 'Games'; - viewCount++; } - $(page).addClass('pageViewCount' + viewCount); - $('.homeMenuLink', page).after(html); } diff --git a/dashboard-ui/scripts/notifications.js b/dashboard-ui/scripts/notifications.js index 7a4336af1..cf18c4a3e 100644 --- a/dashboard-ui/scripts/notifications.js +++ b/dashboard-ui/scripts/notifications.js @@ -26,7 +26,7 @@ var context = this; - var html = '
    '; + var html = '
    '; html += 'Close'; @@ -40,7 +40,7 @@ html += '

    '; - html += ''; + html += ''; html += '
    '; html += '
    '; diff --git a/dashboard-ui/scripts/pluginspage.js b/dashboard-ui/scripts/pluginspage.js index 13afb8634..7e1bb41e6 100644 --- a/dashboard-ui/scripts/pluginspage.js +++ b/dashboard-ui/scripts/pluginspage.js @@ -1,10 +1,10 @@ var PluginsPage = { onPageShow: function () { - PluginsPage.reloadList(); + PluginsPage.reloadList(this); }, - reloadList: function () { + reloadList: function (page) { Dashboard.showLoadingMsg(); @@ -14,14 +14,12 @@ $.when(promise1, promise2).done(function(response1, response2) { - PluginsPage.populateList(response1[0], response2[0]); + PluginsPage.populateList(page, response1[0], response2[0]); }); }, - populateList: function (plugins, pluginConfigurationPages) { - - var page = $($.mobile.activePage); + populateList: function (page, plugins, pluginConfigurationPages) { plugins = plugins.sort(function (plugin1, plugin2) { @@ -71,6 +69,7 @@ deletePlugin: function (link) { + var page = $(link).parents('.page'); var name = link.getAttribute('data-pluginname'); var uniqueid = link.getAttribute('data-id'); @@ -83,7 +82,7 @@ ApiClient.uninstallPlugin(uniqueid).done(function () { - PluginsPage.reloadList(); + PluginsPage.reloadList(page); }); } }); diff --git a/dashboard-ui/scripts/search.js b/dashboard-ui/scripts/search.js index f21a866ea..38bdcef40 100644 --- a/dashboard-ui/scripts/search.js +++ b/dashboard-ui/scripts/search.js @@ -11,43 +11,12 @@ } } - function createSearchHintsElement(page) { - - $(document.body).off("mousedown.hidesearchhints").on("mousedown.hidesearchhints", function (e) { - - var elem = $(e.target); - - if (!elem.is('#searchHints,#txtSearch,#btnSearch') && !elem.parents('#searchHints,#txtSearch,#btnSearch').length) { - hideFlyout(page); - } - - }); - - return $('#searchHints', page).show(); - } - - function hideFlyout(page) { - $('#searchHints', page).hide(); - - $(document.body).off("mousedown.hidesearchhints"); - } - - function showFlyout(page) { - - var hints = $('#searchHints:visible'); - - if (!hints.length) { - - createSearchHintsElement(page); - } - } - - function updateFlyout(page, searchTerm) { + function updateSearchHints(page, searchTerm) { if (!searchTerm) { + $('#searchHints', page).empty(); clearSearchHintTimeout(); - hideFlyout(page); return; } @@ -69,11 +38,7 @@ if (currentTimeout != searchHintTimeout) { return; } - - if (!result.TotalRecordCount) { - hideFlyout(page); - return; - } + renderSearchHintResult(page, result.SearchHints); }); } @@ -106,7 +71,7 @@ var html = ''; var context; - + if (hint.Type == "Episode" || hint.Type == "Season" || hint.Type == "Series") { context = "tv"; } @@ -238,39 +203,72 @@ $('#searchHints', page).html(html); } + + function getSearchPanel(page) { + + var panel = $('#searchPanel', page); + + if (!panel.length) { + + var html = ''; + + html += '
    '; + + html += '

    '; + html += 'Search'; + html += '

    '; + + html += ''; + + html += '
    '; + + html += '
    '; + + $(page).append(html); + + panel = $('#searchPanel', page).panel({}).trigger('create'); + + $('#txtSearch', panel).on("keyup", function (e) { + + // Down + if (e.keyCode == 40) { + + var first = $('.searchHint', panel)[0]; + + if (first) { + first.focus(); + } + + return false; + } + + }).on("keyup", function (e) { + + if (e.keyCode != 40) { + var value = this.value; + + updateSearchHints(panel, value); + } + + }); + } + + return panel; + } function search() { var self = this; - self.getSearchHtml = function () { + self.showSearchPanel = function (page) { - var html = '
    '; + var panel = getSearchPanel(page); - html += ''; - - html += ''; - - html += '
    '; - - html += ''; - - html += '
    '; - - return html; + $(panel).panel('toggle'); }; self.onSearchRendered = function (parentElem) { - $('#searchForm', parentElem).on("submit", function () { - - Dashboard.alert('Coming soon.'); - - return false; - }); - $('#searchHints', parentElem).on("keydown", '.searchHint', function (e) { // Down @@ -298,39 +296,6 @@ } }); - $('#txtSearch', parentElem).on("keyup", function (e) { - - // Down - if (e.keyCode == 40) { - - var first = $('.searchHint', parentElem)[0]; - - if (first) { - first.focus(); - } - - return false; - } - - }).on("keyup", function (e) { - - if (e.keyCode != 40) { - var value = this.value; - - showFlyout(parentElem); - updateFlyout(parentElem, value); - } - - }).on("focus", function () { - - var value = this.value; - - if (value) { - showFlyout(parentElem, value); - } - - }); - }; } @@ -338,8 +303,6 @@ $(document).on('pagehide', ".libraryPage", function () { - hideFlyout(this); - $('#txtSearch', this).val(''); }); diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index 457a0ce98..a58b53a10 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -265,7 +265,7 @@ var Dashboard = { showServerRestartWarning: function (systemInfo) { - var html = 'Please restart Media Browser Server to finish updating.'; + var html = 'Please restart to finish updating.'; if (systemInfo.CanSelfRestart) { html += ''; @@ -717,7 +717,6 @@ var Dashboard = { var page = $.mobile.activePage; - $("#dashboardPanel", page).panel("open"); }, diff --git a/dashboard-ui/scripts/userprofilespage.js b/dashboard-ui/scripts/userprofilespage.js index 7b17cab8a..da6f80d9f 100644 --- a/dashboard-ui/scripts/userprofilespage.js +++ b/dashboard-ui/scripts/userprofilespage.js @@ -61,6 +61,7 @@ deleteUser: function (link) { + var page = $.mobile.activePage; var name = link.getAttribute('data-username'); var msg = "Are you sure you wish to delete " + name + "?"; @@ -74,7 +75,7 @@ ApiClient.deleteUser(id).done(function () { - Dashboard.validateCurrentUser($.mobile.activePage); + Dashboard.validateCurrentUser(page); UserProfilesPage.loadPageData(); }); } diff --git a/dashboard-ui/scripts/wizarduserpage.js b/dashboard-ui/scripts/wizarduserpage.js index 9a18b3db9..2ab448bd2 100644 --- a/dashboard-ui/scripts/wizarduserpage.js +++ b/dashboard-ui/scripts/wizarduserpage.js @@ -13,7 +13,7 @@ self.onSubmit = function () { Dashboard.showLoadingMsg(); - var page = $.mobile.activePage; + var form = this; ApiClient.getUsers().done(function (users) { @@ -23,13 +23,13 @@ user = users[0]; - user.Name = $('#txtUsername', page).val(); + user.Name = $('#txtUsername', form).val(); ApiClient.updateUser(user).done(onSaveComplete); } else { - user = { Name: $('#txtUsername', page).val() }; + user = { Name: $('#txtUsername', form).val() }; ApiClient.createUser(user).done(onSaveComplete); } diff --git a/dashboard-ui/songs.html b/dashboard-ui/songs.html index e531d6187..f97d106af 100644 --- a/dashboard-ui/songs.html +++ b/dashboard-ui/songs.html @@ -17,8 +17,8 @@
    - - + +
    diff --git a/dashboard-ui/tvgenres.html b/dashboard-ui/tvgenres.html index 925181aa8..acca0de9d 100644 --- a/dashboard-ui/tvgenres.html +++ b/dashboard-ui/tvgenres.html @@ -18,8 +18,8 @@
    - - + +
    diff --git a/dashboard-ui/tvpeople.html b/dashboard-ui/tvpeople.html index 4a71dab5d..f47955f9e 100644 --- a/dashboard-ui/tvpeople.html +++ b/dashboard-ui/tvpeople.html @@ -21,8 +21,8 @@
    - - + +
    diff --git a/dashboard-ui/tvshows.html b/dashboard-ui/tvshows.html index e1c0dc9b0..898cc2918 100644 --- a/dashboard-ui/tvshows.html +++ b/dashboard-ui/tvshows.html @@ -27,8 +27,8 @@
    - - + +
    diff --git a/dashboard-ui/tvstudios.html b/dashboard-ui/tvstudios.html index 910db168a..6881ce14f 100644 --- a/dashboard-ui/tvstudios.html +++ b/dashboard-ui/tvstudios.html @@ -18,8 +18,8 @@
    - - + +