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

update dialogs

Browse source
This commit is contained in:
Luke Pulverenti 2016-09-07 03:08:20 -04:00
parent 48cce38282
commit 4ffca7a9df
11 changed files with 193 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

4
dashboard-ui/bower_components/emby-webcomponents/guide/guide-settings.js vendored
View file

@ -73,6 +73,10 @@
}
});
dlg.querySelector('.btnCancel').addEventListener('click', function () {
dialogHelper.close(dlg);
});
if (layoutManager.tv) {
scrollHelper.centerFocus.on(dlg.querySelector('.formDialogContent'), false);
}

64
dashboard-ui/bower_components/emby-webcomponents/guide/guide.css vendored
View file

@ -44,19 +44,30 @@
color: #fff;
}
.newTvProgram {
color: yellow;
.guideProgramIndicator {
text-transform: uppercase;
border-radius: .3em;
margin-right: .5em;
color: #fff;
font-size: 82%;
padding: .25em;
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
color: #fff;
}
.newTvProgram {
background: #64A239;
}
.liveTvProgram {
color: #64A239;
text-transform: uppercase;
background: #2196F3;
}
.premiereTvProgram {
color: orange;
text-transform: uppercase;
background: #EF6C00;
}
.programAccent {
@ -226,6 +237,47 @@
font-weight: normal;
}
.btnSelectDateContent {
display: flex;
align-items: center;
justify-content: center;
}
.guideDateText {
font-size: 80%;
}
@media all and (min-width: 1600px) {
.guideDateText {
display: flex;
}
.guideDateTextDate {
margin-left: .25em;
}
}
.btnGuideViewSettings {
margin: 0;
flex-shrink: 0;
}
.btnGuideViewSettingsIcon {
font-size: 1.5em !important;
}
@media all and (max-width: 1280px) {
.btnGuideViewSettings {
display: none;
}
}
.selectDateIcon {
flex-shrink: 0;
}
.channelHeaderCell {
border-bottom: .65vh solid #121212 !important;
background-size: auto 70%;

34
dashboard-ui/bower_components/emby-webcomponents/guide/guide.js vendored
View file

@ -182,6 +182,8 @@
if (channelsResult.TotalRecordCount > channelLimit) {
context.querySelector('.guideOptions').classList.remove('hide');
btnPreviousPage.classList.remove('hide');
btnNextPage.classList.remove('hide');
@ -198,8 +200,7 @@
}
} else {
btnPreviousPage.classList.add('hide');
btnNextPage.classList.add('hide');
context.querySelector('.guideOptions').classList.add('hide');
}
apiClient.getLiveTvPrograms({
@ -373,13 +374,13 @@
html += '<div class="' + guideProgramNameClass + '">';
if (program.IsLive && options.showLiveIndicator) {
html += '<span class="liveTvProgram">' + globalize.translate('sharedcomponents#AttributeLive') + '&nbsp;</span>';
html += '<span class="liveTvProgram guideProgramIndicator">' + globalize.translate('sharedcomponents#AttributeLive') + '</span>';
}
else if (program.IsPremiere && options.showPremiereIndicator) {
html += '<span class="premiereTvProgram">' + globalize.translate('sharedcomponents#AttributePremiere') + '&nbsp;</span>';
html += '<span class="premiereTvProgram guideProgramIndicator">' + globalize.translate('sharedcomponents#AttributePremiere') + '</span>';
}
else if (program.IsSeries && !program.IsRepeat && options.showNewIndicator) {
html += '<span class="newTvProgram">' + globalize.translate('sharedcomponents#AttributeNew') + '&nbsp;</span>';
html += '<span class="newTvProgram guideProgramIndicator">' + globalize.translate('sharedcomponents#AttributeNew') + '</span>';
}
html += program.Name;
@ -424,7 +425,7 @@
// Normally we'd want to just let responsive css handle this,
// but since mobile browsers are often underpowered,
// it can help performance to get them out of the markup
var showIndicators = false;
var showIndicators = true;
var options = {
showHdIcon: showIndicators,
@ -637,11 +638,15 @@
var day = weekday[date.getDay()];
date = datetime.toLocaleDateString(date);
var parts = [];
if (date.toLowerCase().indexOf(day.toLowerCase()) == -1) {
return day + " " + date;
parts.push(day);
}
return date;
parts.push(date);
return parts;
}
function changeDate(page, date) {
@ -653,7 +658,14 @@
reloadGuide(page, newStartDate);
page.querySelector('.dateText').innerHTML = getFutureDateText(date);
var dateText = getFutureDateText(date);
if (dateText.length == 1) {
dateText = dateText[0];
} else {
dateText = '<div>' + dateText[0] + '</div><div class="guideDateTextDate">' + dateText[1] + '</div>';
}
page.querySelector('.guideDateText').innerHTML = dateText;
}
var dateOptions = [];
@ -680,7 +692,7 @@
while (start <= end) {
dateOptions.push({
name: getFutureDateText(start),
name: getFutureDateText(start).join(' '),
id: start.getTime()
});
@ -880,7 +892,7 @@
reloadPage(context);
});
context.querySelector('.btnViewSettings').addEventListener('click', function () {
context.querySelector('.btnGuideViewSettings').addEventListener('click', function () {
showViewSettings(self);
});

37
dashboard-ui/bower_components/emby-webcomponents/guide/tvguide.template.html vendored
View file

@ -1,21 +1,15 @@
<div class="guideOptions">
<button is="emby-button" type="button" class="btnSelectDate">
<i class="md-icon">&#xE916;</i>
<span class="dateText"></span>
</button>
<button is="paper-icon-button-light" type="button" class="btnViewSettings">
<i class="md-icon">&#xE42A;</i>
</button>
<button is="paper-icon-button-light" type="button" class="btnPreviousPage hide">
<i class="md-icon">&#xE5C4;</i>
</button>
<button is="paper-icon-button-light" type="button" class="btnNextPage hide">
<i class="md-icon">&#xE5C8;</i>
</button>
</div>
<div class="tvGuideHeader">
<div class="tvGuideHeader">
<div class="channelTimeslotHeader">
<button is="emby-button" type="button" class="btnSelectDate block">
<div class="btnSelectDateContent">
<div class="guideDateText">
</div>
<i class="md-icon selectDateIcon">&#xE5C5;</i>
</div>
</button>
<button is="paper-icon-button-light" type="button" class="btnGuideViewSettings">
<i class="md-icon btnGuideViewSettingsIcon">&#xE42A;</i>
</button>
</div>
<div class="timeslotHeaders smoothScrollX guideScroller" style="scroll-behavior: auto;"></div>
</div>
@ -33,4 +27,13 @@
<i class="md-icon">check</i>
<span>${UnlockGuide}</span>
</button>
</div>
<div class="guideOptions hide">
<button is="paper-icon-button-light" type="button" class="btnPreviousPage">
<i class="md-icon">&#xE5C4;</i>
</button>
<button is="paper-icon-button-light" type="button" class="btnNextPage">
<i class="md-icon">&#xE5C8;</i>
</button>
</div>