mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

continue jQuery removal

Browse source
This commit is contained in:
Luke Pulverenti 2016-06-06 20:44:15 -04:00
parent b449d37d84
commit a391e96df5
8 changed files with 228 additions and 206 deletions
Download patch file Download diff file Expand all files Collapse all files

2
dashboard-ui/components/metadataeditor/metadataeditor.template.html
View file

@ -301,7 +301,7 @@
</div> </div>
</div> </div>
<br /> <br />
<button is="emby-button" type="submit" class="raised submit block"><iron-icon icon="check"></iron-icon><span>${ButtonSave}</span></button> <button is="emby-button" type="submit" class="raised submit block btnSave"><iron-icon icon="check"></iron-icon><span>${ButtonSave}</span></button>
</div> </div>
<br /> <br />
<br /> <br />

39
dashboard-ui/scripts/htmlmediarenderer.js
View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) { define([], function () {
var supportsTextTracks; var supportsTextTracks;
var hlsPlayer; var hlsPlayer;
@ -51,7 +51,7 @@
var elem = e.target; var elem = e.target;
elem.removeEventListener('playing', onOneAudioPlaying); elem.removeEventListener('playing', onOneAudioPlaying);
$('.mediaPlayerAudioContainer').hide(); document.querySelector('.mediaPlayerAudioContainer').classList.add('hide');
} }
function onPlaying() { function onPlaying() {
@ -113,7 +113,7 @@
var requiresNativeControls = !self.enableCustomVideoControls(); var requiresNativeControls = !self.enableCustomVideoControls();
if (requiresNativeControls) { if (requiresNativeControls) {
$(element).attr('controls', 'controls'); element.setAttribute('controls', 'controls');
} }
if (requiresSettingStartTimeOnStart) { if (requiresSettingStartTimeOnStart) {
@ -137,9 +137,9 @@
function createAudioElement() { function createAudioElement() {
var elem = $('.mediaPlayerAudio'); var elem = document.querySelector('.mediaPlayerAudio');
if (!elem.length) { if (!elem) {
var html = ''; var html = '';
var requiresControls = !MediaPlayer.canAutoPlayAudio(); var requiresControls = !MediaPlayer.canAutoPlayAudio();
@ -147,19 +147,17 @@
if (requiresControls) { if (requiresControls) {
html += '<div class="mediaPlayerAudioContainer" style="position: fixed;top: 40%;text-align: center;left: 0;right: 0;z-index:999999;"><div class="mediaPlayerAudioContainerInner">';; html += '<div class="mediaPlayerAudioContainer" style="position: fixed;top: 40%;text-align: center;left: 0;right: 0;z-index:999999;"><div class="mediaPlayerAudioContainerInner">';;
} else { } else {
html += '<div class="mediaPlayerAudioContainer" style="display:none;padding: 1em;background: #222;"><div class="mediaPlayerAudioContainerInner">';; html += '<div class="mediaPlayerAudioContainer hide" style="padding: 1em;background: #222;"><div class="mediaPlayerAudioContainerInner">';;
} }
html += '<audio class="mediaPlayerAudio" controls>'; html += '<audio class="mediaPlayerAudio" controls>';
html += '</audio></div></div>'; html += '</audio></div></div>';
$(document.body).append(html); document.body.insertAdjacentHTML('beforeend', html);
elem = $('.mediaPlayerAudio'); elem = document.querySelector('.mediaPlayerAudio');
} }
elem = elem[0];
elem.addEventListener('playing', onOneAudioPlaying); elem.addEventListener('playing', onOneAudioPlaying);
elem.addEventListener('timeupdate', onTimeUpdate); elem.addEventListener('timeupdate', onTimeUpdate);
elem.addEventListener('ended', onEnded); elem.addEventListener('ended', onEnded);
@ -212,9 +210,10 @@
html += '</video>'; html += '</video>';
var elem = $('#videoElement', '#videoPlayer').prepend(html); var elem = document.querySelector('#videoPlayer #videoElement');
elem.insertAdjacentHTML('afterbegin', html);
var itemVideo = $('.itemVideo', elem)[0]; var itemVideo = elem.querySelector('.itemVideo');
itemVideo.addEventListener('loadedmetadata', onLoadedMetadata); itemVideo.addEventListener('loadedmetadata', onLoadedMetadata);
@ -485,7 +484,9 @@
} }
if (elem.tagName.toLowerCase() != 'audio') { if (elem.tagName.toLowerCase() != 'audio') {
$(elem).remove(); if (elem.parentNode) {
elem.parentNode.removeChild(elem);
}
} }
} }
}; };
@ -816,8 +817,8 @@
} }
var allTracks = mediaElement.textTracks; // get list of tracks var allTracks = mediaElement.textTracks; // get list of tracks
var i;
for (var i = 0; i < allTracks.length; i++) { for (i = 0; i < allTracks.length; i++) {
var track = allTracks[i]; var track = allTracks[i];
@ -832,11 +833,13 @@
} }
} }
$('track', mediaElement).each(function () { var trackElements = mediaElement.querySelectorAll('track');
for (i = 0; i < trackElements.length; i++) {
this.src = replaceQueryString(this.src, 'startPositionTicks', startPositionTicks); var trackElement = trackElements[i];
}); trackElement.src = replaceQueryString(trackElement.src, 'startPositionTicks', startPositionTicks);
}
}; };
self.enableCustomVideoControls = function () { self.enableCustomVideoControls = function () {

180
dashboard-ui/scripts/mediaplayer-video.js
View file

@ -1,4 +1,4 @@
define(['appSettings', 'datetime', 'mediaInfo', 'jQuery', 'scrollStyles', 'paper-icon-button-light'], function (appSettings, datetime, mediaInfo, $) { define(['appSettings', 'datetime', 'mediaInfo', 'scrollStyles', 'paper-icon-button-light'], function (appSettings, datetime, mediaInfo) {
function createVideoPlayer(self) { function createVideoPlayer(self) {
@ -32,6 +32,13 @@
} }
}; };
function setClass(elems, method, className) {
for (var i = 0, length = elems.length; i < length; i++) {
elems[i].classList[method](className);
}
}
self.resetEnhancements = function () { self.resetEnhancements = function () {
if (!initComplete) { if (!initComplete) {
@ -48,8 +55,11 @@
videoPlayerElement.classList.remove('fullscreenVideo'); videoPlayerElement.classList.remove('fullscreenVideo');
videoPlayerElement.classList.remove('idlePlayer'); videoPlayerElement.classList.remove('idlePlayer');
$('.hiddenOnIdle').removeClass("inactive"); setClass(document.querySelectorAll('.hiddenOnIdle'), 'remove', 'inactive');
$("video").remove(); var video = videoPlayerElement.querySelector('video');
if (video) {
video.parentNode.removeChild(video);
}
document.querySelector('.mediaButton.infoButton').classList.remove('active'); document.querySelector('.mediaButton.infoButton').classList.remove('active');
document.querySelector('.videoControls .nowPlayingInfo').classList.add('hide'); document.querySelector('.videoControls .nowPlayingInfo').classList.add('hide');
@ -338,7 +348,7 @@
throw new Error('item cannot be null'); throw new Error('item cannot be null');
} }
var mediaControls = $("#videoPlayer"); var mediaControls = document.querySelector("#videoPlayer");
var state = self.getPlayerStateInternal(self.currentMediaRenderer, item.CurrentProgram || item, self.currentMediaSource); var state = self.getPlayerStateInternal(self.currentMediaRenderer, item.CurrentProgram || item, self.currentMediaSource);
@ -382,9 +392,9 @@
} }
if (url) { if (url) {
$('.nowPlayingImage', mediaControls).html('<img src="' + url + '" />'); mediaControls.querySelector('.nowPlayingImage').innerHTML = '<img src="' + url + '" />';
} else { } else {
$('.nowPlayingImage', mediaControls).html(''); mediaControls.querySelector('.nowPlayingImage').innerHTML = '';
} }
if (state.NowPlayingItem.LogoItemId) { if (state.NowPlayingItem.LogoItemId) {
@ -395,37 +405,39 @@
tag: state.NowPlayingItem.LogoImageTag tag: state.NowPlayingItem.LogoImageTag
}); });
$('.videoTopControlsLogo', mediaControls).html('<img src="' + url + '" />'); mediaControls.querySelector('.videoTopControlsLogo').innerHTML = '<img src="' + url + '" />';
} else { } else {
$('.videoTopControlsLogo', mediaControls).html(''); mediaControls.querySelector('.videoTopControlsLogo').innerHTML = '';
} }
var elem = $('.nowPlayingTabs', mediaControls).html(getNowPlayingTabsHtml(item.CurrentProgram || item)).lazyChildren(); var elem = mediaControls.querySelector('.nowPlayingTabs');
elem.innerHTML = getNowPlayingTabsHtml(item.CurrentProgram || item);
ImageLoader.lazyChildren(elem);
$('.nowPlayingTabButton', elem).on('click', function () { function onTabButtonClick() {
if (!this.classList.contains('selectedNowPlayingTabButton')) {
if (!$(this).hasClass('selectedNowPlayingTabButton')) { var selectedNowPlayingTabButton = document.querySelector('.selectedNowPlayingTabButton');
$('.selectedNowPlayingTabButton').removeClass('selectedNowPlayingTabButton'); if (selectedNowPlayingTabButton) {
$(this).addClass('selectedNowPlayingTabButton'); selectedNowPlayingTabButton.classList.remove('selectedNowPlayingTabButton');
$('.nowPlayingTab').hide(); }
$('.' + this.getAttribute('data-tab')).show().trigger('scroll'); this.classList.add('selectedNowPlayingTabButton');
setClass(document.querySelectorAll('.nowPlayingTab'), 'add', 'hide');
document.querySelector('.' + this.getAttribute('data-tab')).classList.remove('hide');
}
} }
});
$('.chapterCard', elem).on('click', function () { var nowPlayingTabButtons = elem.querySelectorAll('.nowPlayingTabButton');
for (var i = 0, length = nowPlayingTabButtons.length; i < length; i++) {
nowPlayingTabButtons[i].addEventListener('click', onTabButtonClick);
}
elem.querySelector('.chapterCard').addEventListener('click', function () {
self.seek(parseInt(this.getAttribute('data-position'))); self.seek(parseInt(this.getAttribute('data-position')));
}); });
}; };
$.fn.lazyChildren = function () {
for (var i = 0, length = this.length; i < length; i++) {
ImageLoader.lazyChildren(this[i]);
}
return this;
};
function getNowPlayingTabsHtml(item) { function getNowPlayingTabsHtml(item) {
var html = ''; var html = '';
@ -463,7 +475,7 @@
html += '</div>'; html += '</div>';
if (item.Chapters && item.Chapters.length) { if (item.Chapters && item.Chapters.length) {
html += '<div class="tabScenes nowPlayingTab smoothScrollX" style="display:none;white-space:nowrap;margin-bottom:2em;">'; html += '<div class="tabScenes nowPlayingTab smoothScrollX hide" style="white-space:nowrap;margin-bottom:2em;">';
var chapterIndex = 0; var chapterIndex = 0;
html += item.Chapters.map(function (c) { html += item.Chapters.map(function (c) {
@ -510,7 +522,7 @@
} }
if (item.People && item.People.length) { if (item.People && item.People.length) {
html += '<div class="tabCast nowPlayingTab smoothScrollX" style="display:none;white-space:nowrap;">'; html += '<div class="tabCast nowPlayingTab smoothScrollX hide" style="white-space:nowrap;">';
html += item.People.map(function (cast) { html += item.People.map(function (cast) {
var personHtml = '<div class="tileItem smallPosterTileItem" style="width:300px;">'; var personHtml = '<div class="tileItem smallPosterTileItem" style="width:300px;">';
@ -764,13 +776,14 @@
initComplete = true; initComplete = true;
ensureVideoPlayerElements(); ensureVideoPlayerElements();
var parent = $("#videoPlayer"); var parent = document.querySelector("#videoPlayer");
muteButton = $('.muteButton', parent); muteButton = parent.querySelector('.muteButton');
unmuteButton = $('.unmuteButton', parent); unmuteButton = parent.querySelector('.unmuteButton');
currentTimeElement = $('.currentTime', parent); currentTimeElement = parent.querySelector('.currentTime');
positionSlider = $(".videoPositionSlider", parent).on('change', onPositionSliderChange)[0]; positionSlider = parent.querySelector(".videoPositionSlider", parent);
positionSlider.addEventListener('change', onPositionSliderChange);
positionSlider._setPinValue = function (value) { positionSlider._setPinValue = function (value) {
@ -787,13 +800,14 @@
this.pinValue = datetime.getDisplayRunningTime(ticks); this.pinValue = datetime.getDisplayRunningTime(ticks);
}; };
volumeSlider = $('.videoVolumeSlider', parent).on('change', function () { volumeSlider = parent.querySelector('.videoVolumeSlider');
volumeSlider.addEventListener('change', function () {
var vol = this.value; var vol = this.value;
updateVolumeButtons(vol); updateVolumeButtons(vol);
self.setVolume(vol); self.setVolume(vol);
})[0]; });
} }
var idleHandlerTimeout; var idleHandlerTimeout;
@ -804,27 +818,27 @@
} }
if (idleState == true) { if (idleState == true) {
$('.hiddenOnIdle').removeClass("inactive"); setClass(document.querySelectorAll('.hiddenOnIdle'), 'remove', 'inactive');
$('#videoPlayer').removeClass('idlePlayer'); document.querySelector('#videoPlayer').classList.remove('idlePlayer');
} }
idleState = false; idleState = false;
idleHandlerTimeout = window.setTimeout(function () { idleHandlerTimeout = window.setTimeout(function () {
idleState = true; idleState = true;
$('.hiddenOnIdle').addClass("inactive"); setClass(document.querySelectorAll('.hiddenOnIdle'), 'add', 'inactive');
$('#videoPlayer').addClass('idlePlayer'); document.querySelector('#videoPlayer').classList.add('idlePlayer');
}, 3500); }, 3500);
} }
function updateVolumeButtons(vol) { function updateVolumeButtons(vol) {
if (vol) { if (vol) {
muteButton.show(); muteButton.classList.remove('hide');
unmuteButton.hide(); unmuteButton.classList.add('hide');
} else { } else {
muteButton.hide(); muteButton.classList.add('hide');
unmuteButton.show(); unmuteButton.classList.remove('hide');
} }
} }
@ -843,16 +857,12 @@
function enterFullScreen() { function enterFullScreen() {
var player = $("#videoPlayer"); document.querySelector("#videoPlayer").classList.add("fullscreenVideo");
player.addClass("fullscreenVideo");
} }
function exitFullScreenToWindow() { function exitFullScreenToWindow() {
var player = $("#videoPlayer"); document.querySelector("#videoPlayer").classList.remove("fullscreenVideo");
player.removeClass("fullscreenVideo");
} }
function onPopState() { function onPopState() {
@ -956,7 +966,7 @@
self.cleanup = function (mediaRenderer) { self.cleanup = function (mediaRenderer) {
if (currentTimeElement) { if (currentTimeElement) {
currentTimeElement.html('--:--'); currentTimeElement.innerHTML = '--:--';
} }
unbindEventsForPlayback(mediaRenderer); unbindEventsForPlayback(mediaRenderer);
@ -1064,27 +1074,27 @@
// Create video player // Create video player
var mediaPlayerContainer = document.querySelector('#videoPlayer'); var mediaPlayerContainer = document.querySelector('#videoPlayer');
fadeIn(mediaPlayerContainer); fadeIn(mediaPlayerContainer);
var videoControls = $('.videoControls', mediaPlayerContainer); var videoControls = mediaPlayerContainer.querySelector('.videoControls');
//show stop button //show stop button
$('#video-playButton', videoControls).hide(); document.querySelector('#video-playButton').classList.add('hide');
$('#video-pauseButton', videoControls).show(); document.querySelector('#video-pauseButton').classList.remove('hide');
$('.videoTrackControl').addClass('hide');
$('.videoQualityButton', videoControls).show(); document.querySelector('.videoTrackControl').classList.add('hide');
document.querySelector('.videoQualityButton').classList.remove('hide');
if (mediaStreams.filter(function (s) { if (mediaStreams.filter(function (s) {
return s.Type == "Audio"; return s.Type == "Audio";
}).length) { }).length) {
$('.videoAudioButton').show(); document.querySelector('.videoAudioButton').classList.remove('hide');
} else { } else {
$('.videoAudioButton').hide(); document.querySelector('.videoAudioButton').classList.add('hide');
} }
if (subtitleStreams.length) { if (subtitleStreams.length) {
$('.videoSubtitleButton').show(); document.querySelector('.videoSubtitleButton').classList.remove('hide');
} else { } else {
$('.videoSubtitleButton').hide(); document.querySelector('.videoSubtitleButton').classList.add('hide');
} }
var mediaRenderer = new VideoRenderer({ var mediaRenderer = new VideoRenderer({
@ -1095,25 +1105,25 @@
var requiresNativeControls = !mediaRenderer.enableCustomVideoControls(); var requiresNativeControls = !mediaRenderer.enableCustomVideoControls();
if (requiresNativeControls || AppInfo.isNativeApp) { if (requiresNativeControls || AppInfo.isNativeApp) {
$('#video-fullscreenButton', videoControls).hide(); videoControls.querySelector('#video-fullscreenButton').classList.add('hide');
} else { } else {
$('#video-fullscreenButton', videoControls).show(); videoControls.querySelector('#video-fullscreenButton').classList.remove('hide');
} }
if (AppInfo.hasPhysicalVolumeButtons) { if (AppInfo.hasPhysicalVolumeButtons) {
$(volumeSlider).addClass('hide'); volumeSlider.classList.add('hide');
$('.muteButton', videoControls).addClass('hide'); videoControls.querySelector('.muteButton').classList.add('hide');
$('.unmuteButton', videoControls).addClass('hide'); videoControls.querySelector('.unmuteButton').classList.add('hide');
} else { } else {
$(volumeSlider).removeClass('hide'); volumeSlider.classList.remove('hide');
$('.muteButton', videoControls).removeClass('hide'); videoControls.querySelector('.muteButton').classList.remove('hide');
$('.unmuteButton', videoControls).removeClass('hide'); videoControls.querySelector('.unmuteButton').classList.remove('hide');
} }
if (requiresNativeControls) { if (requiresNativeControls) {
videoControls.addClass('hide'); videoControls.classList.add('hide');
} else { } else {
videoControls.removeClass('hide'); videoControls.classList.remove('hide');
} }
initialVolume = self.getSavedVolume(); initialVolume = self.getSavedVolume();
@ -1127,7 +1137,7 @@
self.currentSubtitleStreamIndex = mediaSource.DefaultSubtitleStreamIndex; self.currentSubtitleStreamIndex = mediaSource.DefaultSubtitleStreamIndex;
$(document.body).addClass('bodyWithPopupOpen'); document.body.classList.add('bodyWithPopupOpen');
self.currentMediaRenderer = mediaRenderer; self.currentMediaRenderer = mediaRenderer;
self.currentDurationTicks = self.currentMediaSource.RunTimeTicks; self.currentDurationTicks = self.currentMediaSource.RunTimeTicks;
@ -1163,11 +1173,16 @@
var videoControls = document.querySelector('#videoPlayer .videoControls'); var videoControls = document.querySelector('#videoPlayer .videoControls');
var videoElement = document.querySelector('#videoPlayer #videoElement'); var videoElement = document.querySelector('#videoPlayer #videoElement');
$('#video-playButton', videoControls).hide(); videoControls.querySelector('#video-playButton').classList.add('hide');
$('#video-pauseButton', videoControls).show(); videoControls.querySelector('#video-pauseButton').classList.remove('hide');
$("#play", videoElement).show().addClass("fadeOut");
var buttonToAnimate = videoElement.querySelector('#play');
buttonToAnimate.classList.remove('hide');
buttonToAnimate.classList.add('fadeOut');
setTimeout(function () { setTimeout(function () {
$("#play", videoElement).hide().removeClass("fadeOut"); buttonToAnimate.classList.add('hide');
buttonToAnimate.classList.remove('fadeOut');
}, 300); }, 300);
} }
@ -1181,11 +1196,16 @@
var videoControls = document.querySelector('#videoPlayer .videoControls'); var videoControls = document.querySelector('#videoPlayer .videoControls');
var videoElement = document.querySelector('#videoPlayer #videoElement'); var videoElement = document.querySelector('#videoPlayer #videoElement');
$('#video-playButton', videoControls).show(); videoControls.querySelector('#video-playButton').classList.remove('hide');
$('#video-pauseButton', videoControls).hide(); videoControls.querySelector('#video-pauseButton').classList.add('hide');
$("#pause", videoElement).show().addClass("fadeOut");
var buttonToAnimate = videoElement.querySelector('#pause');
buttonToAnimate.classList.remove('hide');
buttonToAnimate.classList.add('fadeOut');
setTimeout(function () { setTimeout(function () {
$("#pause", videoElement).hide().removeClass("fadeOut"); buttonToAnimate.classList.add('hide');
buttonToAnimate.classList.remove('fadeOut');
}, 300); }, 300);
} }
@ -1251,7 +1271,7 @@
} }
if (length < 2) { if (length < 2) {
$('.videoTrackControl').addClass('hide'); document.querySelector('.videoTrackControl').classList.add('hide');
return; return;
} }
@ -1273,8 +1293,8 @@
nextTrackButton.removeAttribute('disabled'); nextTrackButton.removeAttribute('disabled');
} }
$(previousTrackButton).removeClass('hide'); previousTrackButton.classList.remove('hide');
$(nextTrackButton).removeClass('hide'); nextTrackButton.classList.remove('hide');
}; };
} }

2
dashboard-ui/scripts/mediaplayer.js
View file

@ -293,7 +293,7 @@ define(['appSettings', 'userSettings', 'appStorage', 'datetime'], function (appS
} }
if (currentTimeElement) { if (currentTimeElement) {
currentTimeElement.html(timeText); currentTimeElement.innerHTML = timeText;
} }
var state = self.getPlayerStateInternal(mediaRenderer, self.currentItem, self.currentMediaSource); var state = self.getPlayerStateInternal(mediaRenderer, self.currentItem, self.currentMediaSource);

4
dashboard-ui/scripts/registrationservices.js
View file

@ -1,4 +1,4 @@
define(['appStorage', 'jQuery'], function (appStorage, $) { define(['appStorage'], function (appStorage) {
var supporterPlaybackKey = 'lastSupporterPlaybackMessage4'; var supporterPlaybackKey = 'lastSupporterPlaybackMessage4';
@ -188,6 +188,7 @@
renderPluginInfo: function (page, pkg, pluginSecurityInfo) { renderPluginInfo: function (page, pkg, pluginSecurityInfo) {
require(['jQuery'], function ($) {
if (pkg.isPremium) { if (pkg.isPremium) {
$('.premiumPackage', page).show(); $('.premiumPackage', page).show();
@ -272,6 +273,7 @@
} else { } else {
$('.premiumPackage', page).hide(); $('.premiumPackage', page).hide();
} }
});
}, },
validateFeature: function (name) { validateFeature: function (name) {

18
dashboard-ui/streamingsettings.html
View file

@ -1,27 +1,23 @@
<div id="streamingSettingsPage" data-role="page" class="page type-interior playbackConfigurationPage withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Streaming" data-require="scripts/streamingsettings,paper-input,emby-button"> <div id="streamingSettingsPage" data-role="page" class="page type-interior playbackConfigurationPage withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Streaming" data-require="scripts/streamingsettings,emby-input,emby-button,emby-select">
<div data-role="content"> <div data-role="content">
<div class="content-primary"> <div class="content-primary">
<form class="streamingSettingsForm"> <form class="streamingSettingsForm">
<ul data-role="listview" class="ulForm"> <div class="inputContainer">
<li> <input is="emby-input" type="number" id="txtRemoteClientBitrateLimit" pattern="[0-9]*" min="0" step=".25" label="${LabelRemoteClientBitrateLimit}"/>
<paper-input type="number" id="txtRemoteClientBitrateLimit" pattern="[0-9]*" min="0" step=".25" label="${LabelRemoteClientBitrateLimit}"></paper-input>
<div class="fieldDescription">${LabelRemoteClientBitrateLimitHelp}</div> <div class="fieldDescription">${LabelRemoteClientBitrateLimitHelp}</div>
</li> </div>
<li> <div class="selectContainer">
<br /> <select is="emby-select" id="selectChannelResolution" label="${LabelChannelStreamQuality}">
<label for="selectChannelResolution" class="selectLabel">${LabelChannelStreamQuality}</label>
<select id="selectChannelResolution" data-mini="true">
<option value="">${OptionBestAvailableStreamQuality}</option> <option value="">${OptionBestAvailableStreamQuality}</option>
<option value="1920">1080p</option> <option value="1920">1080p</option>
<option value="1280">720p</option> <option value="1280">720p</option>
<option value="720">480p</option> <option value="720">480p</option>
</select> </select>
<div class="fieldDescription">${LabelChannelStreamQualityHelp}</div> <div class="fieldDescription">${LabelChannelStreamQualityHelp}</div>
</li> </div>
</ul>
<button is="emby-button" type="submit" class="raised submit block"><iron-icon icon="check"></iron-icon><span>${ButtonSave}</span></button> <button is="emby-button" type="submit" class="raised submit block"><iron-icon icon="check"></iron-icon><span>${ButtonSave}</span></button>
</form> </form>
</div> </div>

4
dashboard-ui/thirdparty/paper-button-style.css vendored
View file

@ -362,7 +362,7 @@ paper-input label, paper-textarea label {
} }
.ui-body-a .inputLabel { .ui-body-a .inputLabel {
color: #656565; color: #555;
} }
.ui-body-a .inputLabel.focused:not(.blank) { .ui-body-a .inputLabel.focused:not(.blank) {
@ -374,7 +374,7 @@ paper-input label, paper-textarea label {
} }
.ui-body-a .paper-input-container-0 .input-content.paper-input-container label, .ui-body-a .paper-input-container-0 .input-content.paper-input-container .paper-input-label, .ui-body-a paper-textarea label, .ui-body-a .selectLabel, .ui-body-a .paperListLabel, .ui-body-a .fieldDescription { .ui-body-a .paper-input-container-0 .input-content.paper-input-container label, .ui-body-a .paper-input-container-0 .input-content.paper-input-container .paper-input-label, .ui-body-a paper-textarea label, .ui-body-a .selectLabel, .ui-body-a .paperListLabel, .ui-body-a .fieldDescription {
color: #656565; color: #555;
} }
.ui-body-a .paper-input-container-0 .input-content.label-is-highlighted.paper-input-container label, .ui-body-a .paper-input-container-0 .input-content.label-is-highlighted.paper-input-container .paper-input-label { .ui-body-a .paper-input-container-0 .input-content.label-is-highlighted.paper-input-container label, .ui-body-a .paper-input-container-0 .input-content.label-is-highlighted.paper-input-container .paper-input-label {

17
dashboard-ui/useredit.html
View file

@ -1,4 +1,4 @@
<div id="editUserPage" data-role="page" class="page type-interior userProfilesPage" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Users" data-require="scripts/useredit,paper-input,paper-checkbox,emby-button"> <div id="editUserPage" data-role="page" class="page type-interior userProfilesPage" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Users" data-require="scripts/useredit,emby-input,paper-checkbox,emby-button">
<div data-role="content"> <div data-role="content">
<div class="content-primary"> <div class="content-primary">
@ -14,31 +14,32 @@
</p> </p>
<form class="editUserProfileForm"> <form class="editUserProfileForm">
<div class="disabledUserBanner" style="display:none;"> <div class="disabledUserBanner" style="display: none;">
<div class="btn btnDarkAccent btnStatic"> <div class="btn btnDarkAccent btnStatic">
<div> <div>
${HeaderThisUserIsCurrentlyDisabled} ${HeaderThisUserIsCurrentlyDisabled}
</div> </div>
<div style="margin-top:5px;"> <div style="margin-top: 5px;">
${MessageReenableUser} ${MessageReenableUser}
</div> </div>
</div> </div>
</div> </div>
<div id="fldUserName" class="inputContainer">
<input is="emby-input" id="txtUserName" required type="text" label="${LabelName}" />
</div>
<ul data-role="listview" class="ulForm"> <ul data-role="listview" class="ulForm">
<li id="fldUserName">
<paper-input id="txtUserName" required type="text" label="${LabelName}"></paper-input>
</li>
<li id="fldConnectInfo" style="display: none;"> <li id="fldConnectInfo" style="display: none;">
<div class="paperList" style="padding: 1em; border-radius: 5px;"> <div class="paperList" style="padding: 1em; border-radius: 5px;">
<paper-input id="txtConnectUserName" type="text" label="${LabelConnectUserName}"></paper-input> <div class="inputContainer">
<input is="emby-input" id="txtConnectUserName" type="text" label="${LabelConnectUserName}" />
<div class="fieldDescription"> <div class="fieldDescription">
<div>${LabelConnectUserNameHelp}</div> <div>${LabelConnectUserNameHelp}</div>
<div style="margin-top: .75em;"> <div style="margin-top: .75em;">
<a href="http://emby.media/connect" target="_blank">${ButtonLearnMoreAboutEmbyConnect}</a> <a href="http://emby.media/connect" target="_blank">${ButtonLearnMoreAboutEmbyConnect}</a>
</div> </div>
</div> </div>
<br /> </div>
</div> </div>
</li> </li>
<li> <li>