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

update dialogs

This commit is contained in:
Luke Pulverenti 2016-09-07 01:48:14 -04:00
parent 411bc43282
commit 74e43e1346
20 changed files with 122 additions and 83 deletions

View file

@ -14,12 +14,12 @@
}, },
"devDependencies": {}, "devDependencies": {},
"ignore": [], "ignore": [],
"version": "1.4.222", "version": "1.4.223",
"_release": "1.4.222", "_release": "1.4.223",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "1.4.222", "tag": "1.4.223",
"commit": "29a8d9be1a6c3bb59bddb54c721c64a8664f9724" "commit": "e3fce0848cb9f7839d98090ea55c80f0a5ff672d"
}, },
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git", "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.1", "_target": "^1.2.1",

View file

@ -166,8 +166,8 @@
// newCollectionInfo // newCollectionInfo
html += '</div>'; html += '</div>';
html += '<div>'; html += '<div class="formDialogFooter">';
html += '<button is="emby-button" type="submit" class="raised btnSubmit block">' + globalize.translate('sharedcomponents#ButtonOk') + '</button>'; html += '<button is="emby-button" type="submit" class="raised btnSubmit block formDialogFooterItem">' + globalize.translate('sharedcomponents#ButtonOk') + '</button>';
html += '</div>'; html += '</div>';
html += '<input type="hidden" class="fldSelectedItemIds" />'; html += '<input type="hidden" class="fldSelectedItemIds" />';

View file

@ -41,6 +41,13 @@
right: 10% !important; right: 10% !important;
} }
.dialog-medium-tall {
top: 5% !important;
bottom: 5% !important;
left: 10% !important;
right: 10% !important;
}
.dialog-small { .dialog-small {
top: 10% !important; top: 10% !important;
bottom: 10% !important; bottom: 10% !important;

View file

@ -7,10 +7,13 @@
padding: .8em .5em; padding: .8em .5em;
display: flex; display: flex;
align-items: center; align-items: center;
background-color: #222326;
flex-shrink: 0; flex-shrink: 0;
} }
.formDialogHeader, .formDialogFooter {
background-color: #222326;
}
.formDialogHeaderTitle { .formDialogHeaderTitle {
margin-left: .5em; margin-left: .5em;
} }
@ -32,8 +35,39 @@
margin-top: 1em; margin-top: 1em;
} }
.formDialogFooter {
position: absolute;
bottom: 0;
left: 0;
right: 0;
display: flex;
padding: 1.5em;
/* Without this emby-checkbox is able to appear on top */
z-index: 1;
align-items: center;
justify-content: center;
}
.formDialogFooterItem {
margin-left: .5em !important;
margin-right: .5em !important;
flex-grow: 1;
text-align: center;
}
@media all and (min-width: 800px) {
.formDialogFooterItem {
max-width: 80%;
}
}
@media all and (min-width: 1280px) { @media all and (min-width: 1280px) {
.formDialogFooterItem {
max-width: 70%;
}
.dialogContentInner { .dialogContentInner {
padding-left: 2em; padding-left: 2em;
padding-right: 2em; padding-right: 2em;

View file

@ -20,12 +20,12 @@
<div class="identifyProviderIds"> <div class="identifyProviderIds">
</div> </div>
<p> <div class="formDialogFooter">
<button is="emby-button" type="submit" class="raised submit block"> <button is="emby-button" type="submit" class="raised submit block formDialogFooterItem">
<i class="md-icon">search</i> <i class="md-icon">search</i>
<span>${Search}</span> <span>${Search}</span>
</button> </button>
</p> </div>
</form> </form>
<div class="identificationSearchResults hide"> <div class="identificationSearchResults hide">
@ -42,10 +42,13 @@
<input type="checkbox" is="emby-checkbox" id="chkIdentifyReplaceImages" /> <input type="checkbox" is="emby-checkbox" id="chkIdentifyReplaceImages" />
<span>${ReplaceExistingImages}</span> <span>${ReplaceExistingImages}</span>
</label> </label>
<button is="emby-button" type="submit" class="raised submit block btnSubmit">
<i class="md-icon">check</i> <div class="formDialogFooter">
<span>${ButtonOk}</span> <button is="emby-button" type="submit" class="raised submit block btnSubmit formDialogFooterItem">
</button> <i class="md-icon">check</i>
<span>${ButtonOk}</span>
</button>
</div>
</form> </form>
</div> </div>
</div> </div>

View file

@ -357,11 +357,6 @@
}); });
context.querySelector('.btnHeaderSave').addEventListener('click', function (e) {
context.querySelector('.btnSave').click();
});
context.querySelector('#chkLockData').addEventListener('click', function (e) { context.querySelector('#chkLockData').addEventListener('click', function (e) {
if (!e.target.checked) { if (!e.target.checked) {
@ -1161,7 +1156,7 @@
if (layoutManager.tv) { if (layoutManager.tv) {
dialogOptions.size = 'fullscreen'; dialogOptions.size = 'fullscreen';
} else { } else {
dialogOptions.size = 'medium'; dialogOptions.size = 'medium-tall';
} }
var dlg = dialogHelper.createDialog(dialogOptions); var dlg = dialogHelper.createDialog(dialogOptions);

View file

@ -4,10 +4,6 @@
${Edit} ${Edit}
</div> </div>
<div style="margin-left: auto; display: flex; align-items: center; justify-content: center;"> <div style="margin-left: auto; display: flex; align-items: center; justify-content: center;">
<button is="emby-button" type="button" class="btnHeaderSave accent autoSize" tabindex="-1">
<i class="md-icon">check</i>
<span>${Save}</span>
</button>
<button is="paper-icon-button-light" class="btnMore autoSize" tabindex="-1"> <button is="paper-icon-button-light" class="btnMore autoSize" tabindex="-1">
<i class="md-icon">more_vert</i> <i class="md-icon">more_vert</i>
</button> </button>
@ -308,9 +304,12 @@
</div> </div>
</div> </div>
<br /> <br />
<button is="emby-button" type="submit" class="raised submit block btnSave"> <div class="formDialogFooter">
<span>${Save}</span> <button is="emby-button" type="submit" class="raised submit block btnSave formDialogFooterItem">
</button> <span>${Save}</span>
</button>
</div>
</div> </div>
<br /> <br />
<br /> <br />

View file

@ -27,9 +27,13 @@
<input is="emby-input" type="text" class="txtPersonRole" label="${LabelPersonRole}" /> <input is="emby-input" type="text" class="txtPersonRole" label="${LabelPersonRole}" />
<div class="fieldDescription">${LabelPersonRoleHelp}</div> <div class="fieldDescription">${LabelPersonRoleHelp}</div>
</div> </div>
<button is="emby-button" type="submit" class="raised submit block">
<i class="md-icon">check</i> <div class="formDialogFooter">
<span>${Save}</span> <button is="emby-button" type="submit" class="raised submit block formDialogFooterItem">
</button> <i class="md-icon">check</i>
<span>${Save}</span>
</button>
</div>
</form> </form>
</div> </div>

View file

@ -154,8 +154,8 @@
// newPlaylistInfo // newPlaylistInfo
html += '</div>'; html += '</div>';
html += '<div>'; html += '<div class="formDialogFooter">';
html += '<button is="emby-button" type="submit" class="raised btnSubmit block">' + globalize.translate('sharedcomponents#ButtonOk') + '</button>'; html += '<button is="emby-button" type="submit" class="raised btnSubmit block formDialogFooterItem">' + globalize.translate('sharedcomponents#ButtonOk') + '</button>';
html += '</div>'; html += '</div>';
html += '<input type="hidden" class="fldSelectedItemIds" />'; html += '<input type="hidden" class="fldSelectedItemIds" />';

View file

@ -141,25 +141,13 @@
getRegistration(apiClient).then(function (regInfo) { getRegistration(apiClient).then(function (regInfo) {
if (regInfo.IsValid) {
context.querySelector('.btnSubmit').classList.remove('hide');
} else {
context.querySelector('.btnSubmit').classList.add('hide');
}
if (regInfo.IsRegistered) { if (regInfo.IsRegistered) {
context.querySelector('.btnSubmit').classList.remove('hide');
context.querySelector('.supporterContainer').classList.add('hide'); context.querySelector('.supporterContainer').classList.add('hide');
} else { } else {
context.querySelector('.supporterContainer').classList.remove('hide'); context.querySelector('.supporterContainer').classList.remove('hide');
context.querySelector('.btnSubmit').classList.add('hide');
if (regInfo.TrialVersion) {
context.querySelector('.supporterTrial').classList.remove('hide');
} else {
context.querySelector('.supporterTrial').classList.add('hide');
}
} }
}); });
} }

View file

@ -97,16 +97,15 @@
<br /> <br />
</div> </div>
<br /> <br />
<div> <div class="formDialogFooter">
<div class="supporterContainer hide"> <div class="supporterContainer hide formDialogFooterItem">
<p>${MessageActiveSubscriptionRequiredSeriesRecordings}</p> <p>${MessageActiveSubscriptionRequiredSeriesRecordings}</p>
<p class="supporterTrial hide">${HeaderEnjoyDayTrial}</p> <button is="emby-button" type="button" class="btnSupporter hide raised accent block">
<button is="emby-button" type="button" raised class="btnSupporter hide raised accent block">
<i class="md-icon">check</i> <i class="md-icon">check</i>
<span>${HeaderBecomeProjectSupporter}</span> <span>${HeaderBecomeProjectSupporter}</span>
</button> </button>
</div> </div>
<button is="emby-button" type="submit" class="raised btnSubmit block"> <button is="emby-button" type="submit" class="raised btnSubmit block formDialogFooterItem">
<i class="md-icon recordingDialogSubmitIcon">fiber_manual_record</i> <i class="md-icon recordingDialogSubmitIcon">fiber_manual_record</i>
<span>${Record}</span> <span>${Record}</span>
</button> </button>

View file

@ -31,10 +31,14 @@
<input is="emby-input" type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPostPaddingMinutes}" /> <input is="emby-input" type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" step="1" label="${LabelPostPaddingMinutes}" />
</div> </div>
<br /> <br />
<button is="emby-button" type="submit" class="raised btnSubmit block" autofocus>
<i class="md-icon recordingDialogSubmitIcon">fiber_manual_record</i> <div class="formDialogFooter">
<span>${Save}</span> <button is="emby-button" type="submit" class="raised btnSubmit block formDialogFooterItem" autofocus>
</button> <i class="md-icon recordingDialogSubmitIcon">fiber_manual_record</i>
<span>${Save}</span>
</button>
</div>
</form> </form>
</div> </div>
</div> </div>

View file

@ -37,13 +37,13 @@
html += globalize.translate('sharedcomponents#RefreshDialogHelp'); html += globalize.translate('sharedcomponents#RefreshDialogHelp');
html += '</div>'; html += '</div>';
html += '<br />';
html += '<div>';
html += '<button is="emby-button" type="submit" class="raised btnSubmit block" autofocus>' + globalize.translate('sharedcomponents#ButtonOk') + '</button>';
html += '</div>';
html += '<input type="hidden" class="fldSelectedItemIds" />'; html += '<input type="hidden" class="fldSelectedItemIds" />';
html += '<br />';
html += '<div class="formDialogFooter">';
html += '<button is="emby-button" type="submit" class="raised btnSubmit block formDialogFooterItem">' + globalize.translate('sharedcomponents#ButtonOk') + '</button>';
html += '</div>';
html += '</form>'; html += '</form>';
html += '</div>'; html += '</div>';
html += '</div>'; html += '</div>';

View file

@ -45,7 +45,6 @@
"RecordAnytime": "Record at any time", "RecordAnytime": "Record at any time",
"RecordOnlyNewEpisodes": "Record only new episodes", "RecordOnlyNewEpisodes": "Record only new episodes",
"HeaderBecomeProjectSupporter": "Get Emby Premiere", "HeaderBecomeProjectSupporter": "Get Emby Premiere",
"HeaderEnjoyDayTrial": "Enjoy a 14 Day Free Trial",
"MessageActiveSubscriptionRequiredSeriesRecordings": "An active Emby Premiere subscription is required in order to create automated series recordings.", "MessageActiveSubscriptionRequiredSeriesRecordings": "An active Emby Premiere subscription is required in order to create automated series recordings.",
"OptionConvertRecordingsToStreamingFormat": "Automatically convert recordings to a streaming friendly format", "OptionConvertRecordingsToStreamingFormat": "Automatically convert recordings to a streaming friendly format",
"OptionConvertRecordingsToStreamingFormatHelp": "Recordings will be converted on the fly to MP4 for easy playback on your devices.", "OptionConvertRecordingsToStreamingFormatHelp": "Recordings will be converted on the fly to MP4 for easy playback on your devices.",

View file

@ -408,9 +408,9 @@
html += '<div class="formFields"></div>'; html += '<div class="formFields"></div>';
html += '<p>'; html += '<div class="formDialogFooter">';
html += '<button is="emby-button" type="submit" class="raised submit block"><i class="md-icon">sync</i><span>' + globalize.translate('sharedcomponents#Sync') + '</span></button>'; html += '<button is="emby-button" type="submit" class="raised submit block formDialogFooterItem"><i class="md-icon">sync</i><span>' + globalize.translate('sharedcomponents#Sync') + '</span></button>';
html += '</p>'; html += '</div>';
html += '</form>'; html += '</form>';

View file

@ -32,14 +32,14 @@
"iron-component-page": "polymerElements/iron-component-page#^1.1.6" "iron-component-page": "polymerElements/iron-component-page#^1.1.6"
}, },
"private": true, "private": true,
"homepage": "https://github.com/Polymer/polymer", "homepage": "https://github.com/polymer/polymer",
"_release": "1.6.1", "_release": "1.6.1",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.6.1", "tag": "v1.6.1",
"commit": "1f197d9d7874b1e5808b2a5c26f34446a7d912fc" "commit": "1f197d9d7874b1e5808b2a5c26f34446a7d912fc"
}, },
"_source": "git://github.com/Polymer/polymer.git", "_source": "git://github.com/polymer/polymer.git",
"_target": "^1.1.0", "_target": "^1.1.0",
"_originalSource": "Polymer/polymer" "_originalSource": "polymer/polymer"
} }

View file

@ -246,7 +246,7 @@
itemBirthday.classList.add('hide'); itemBirthday.classList.add('hide');
} }
var itemDeathDate = page.querySelector('#itemBirthday'); var itemDeathDate = page.querySelector('#itemDeathDate');
if (item.Type == "Person" && item.EndDate) { if (item.Type == "Person" && item.EndDate) {
try { try {

View file

@ -27,6 +27,8 @@
var promise = params.type == 'Recordings' ? var promise = params.type == 'Recordings' ?
ApiClient.getLiveTvRecordings(query) : ApiClient.getLiveTvRecordings(query) :
params.type == 'RecordingSeries' ?
ApiClient.getLiveTvRecordingSeries(query) :
ApiClient.getLiveTvPrograms(query); ApiClient.getLiveTvPrograms(query);
promise.then(function (result) { promise.then(function (result) {
@ -46,15 +48,15 @@
html = cardBuilder.getCardsHtml({ html = cardBuilder.getCardsHtml({
items: result.Items, items: result.Items,
shape: query.IsMovie ? 'portrait' : "backdrop", shape: query.IsMovie || params.type == 'RecordingSeries' ? 'portrait' : "backdrop",
preferThumb: !query.IsMovie, preferThumb: !query.IsMovie && params.type != 'RecordingSeries',
context: 'livetv', context: 'livetv',
centerText: true, centerText: true,
lazy: true, lazy: true,
overlayText: false, overlayText: false,
showTitle: true, showTitle: true,
//showParentTitle: query.IsSeries !== false && !query.IsMovie, //showParentTitle: query.IsSeries !== false && !query.IsMovie,
showProgramAirInfo: params.type != 'Recordings', showProgramAirInfo: params.type != 'Recordings' && params.type != 'RecordingSeries',
overlayMoreButton: true, overlayMoreButton: true,
showYear: query.IsMovie && params.type == 'Recordings' showYear: query.IsMovie && params.type == 'Recordings'
}); });

View file

@ -195,7 +195,7 @@
Dashboard.navigate('livetvitems.html?type=Recordings&IsMovie=true'); Dashboard.navigate('livetvitems.html?type=Recordings&IsMovie=true');
break; break;
case 'episodes': case 'episodes':
Dashboard.navigate('livetvitems.html?type=Recordings&IsSeries=true'); Dashboard.navigate('livetvitems.html?type=RecordingSeries');
break; break;
case 'programs': case 'programs':
Dashboard.navigate('livetvitems.html?type=Recordings&IsSeries=false&IsMovie=false'); Dashboard.navigate('livetvitems.html?type=Recordings&IsSeries=false&IsMovie=false');

View file

@ -20,11 +20,25 @@ button.emby-button.submit {
color: #52B54B; color: #52B54B;
} }
button.emby-button.raised.submit, button.emby-button.raised:not(.subdued):not(.cancel):not(.more) { .ui-body-a .emby-button.raised {
background: #52B54B; background: #52B54B;
color: #fff; color: #fff;
} }
.ui-body-b .emby-button.raised {
background: #404040;
color: #fff;
}
.ui-body-a .emby-button.raised.subdued {
background: #fff;
color: inherit;
}
.ui-body-b .emby-button.raised.subdued {
background: #262626;
}
button.emby-button.more { button.emby-button.more {
color: #3388cc; color: #3388cc;
} }
@ -140,13 +154,4 @@ div.dialogHeader {
.ui-body-a .formDialogHeader a { .ui-body-a .formDialogHeader a {
color: #fff !important; color: #fff !important;
text-transform: uppercase; text-transform: uppercase;
}
.ui-body-b div.formDialogHeader {
background-color: #222326;
}
.formDialogHeader button {
margin-top: 0;
margin-bottom: 0;
} }