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 shared components

Browse source
This commit is contained in:
Luke Pulverenti 2016-08-03 00:30:22 -04:00
parent db0bac5a2b
commit ff0882ba79
18 changed files with 87 additions and 73 deletions
Download patch file Download diff file Expand all files Collapse all files

8
dashboard-ui/bower_components/emby-webcomponents/.bower.json vendored
View file

@ -14,12 +14,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.4.144",
"_release": "1.4.144",
"version": "1.4.145",
"_release": "1.4.145",
"_resolution": {
"type": "version",
"tag": "1.4.144",
"commit": "65443f540f435d1f89718aeef09a4587f5c1391b"
"tag": "1.4.145",
"commit": "d49d1e90cccfd1735bf18aa8e67d459439c9474b"
},
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.1",

18
dashboard-ui/bower_components/emby-webcomponents/alphapicker/alphapicker.js vendored
View file

@ -1,7 +1,9 @@
define(['focusManager', 'css!./style.css', 'clearButtonStyle', 'paper-icon-button-light', 'material-icons'], function (focusManager) {
var selectedButtonClass = 'alphaPickerButton-selected';
function focus() {
var selected = this.querySelector('.selected');
var selected = this.querySelector('.' + selectedButtonClass);
if (selected) {
focusManager.focus(selected);
@ -26,7 +28,7 @@ define(['focusManager', 'css!./style.css', 'clearButtonStyle', 'paper-icon-butto
if (options.mode == 'keyboard') {
// space_bar icon
html += '<button data-value=" " is="paper-icon-button-light" class="alphaPickerButton autoSize">\
<i class="md-icon">&#xE256;</i>\
<i class="md-icon alphaPickerButtonIcon">&#xE256;</i>\
</button>';
} else {
letters = ['#'];
@ -39,7 +41,7 @@ define(['focusManager', 'css!./style.css', 'clearButtonStyle', 'paper-icon-butto
if (options.mode == 'keyboard') {
// backspace icon
html += '<button data-value="backspace" is="paper-icon-button-light" class="alphaPickerButton autoSize">\
<i class="md-icon">&#xE14A;</i>\
<i class="md-icon alphaPickerButtonIcon">&#xE14A;</i>\
</button>';
html += '</div>';
@ -223,22 +225,22 @@ define(['focusManager', 'css!./style.css', 'clearButtonStyle', 'paper-icon-butto
currentValue = value;
if (options.mode != 'keyboard') {
selected = element.querySelector('.selected');
selected = element.querySelector('.' + selectedButtonClass);
btn = element.querySelector('.alphaPickerButton[data-value=\'' + value + '\']');
if (btn && btn != selected) {
btn.classList.add('selected');
btn.classList.add(selectedButtonClass);
}
if (selected && selected != btn) {
selected.classList.remove('selected');
selected.classList.remove(selectedButtonClass);
}
}
} else {
currentValue = value;
selected = element.querySelector('.selected');
selected = element.querySelector('.' + selectedButtonClass);
if (selected) {
selected.classList.remove('selected');
selected.classList.remove(selectedButtonClass);
}
}
}

20
dashboard-ui/bower_components/emby-webcomponents/alphapicker/style.css vendored
View file

@ -11,35 +11,31 @@
flex-direction: row;
}
.alphaPicker.vertical .alphaPickerRow {
.alphaPicker-vertical .alphaPickerRow {
flex-direction: column;
}
button.alphaPickerButton {
.alphaPickerButton {
min-width: initial;
margin: 0;
padding: .1em .4em !important;
width: auto;
border-radius: .1em;
font-weight: normal;
opacity: .25;
}
.vertical .alphaPickerButton {
padding: .25em .4em !important;
}
.layout-desktop .alphaPickerButton {
opacity: .7;
}
[is=paper-icon-button-light].alphaPickerButton i {
.alphaPicker-vertical .alphaPickerButton {
padding: .2em .4em !important;
}
.alphaPickerButtonIcon {
width: 3.3vh;
height: 3.3vh;
font-size: 3.3vh;
}
.alphaPickerButton.selected {
.alphaPickerButton-selected {
color: #000;
background-color: #bbb;
opacity: 1;

21
dashboard-ui/bower_components/emby-webcomponents/cardbuilder/card.css vendored
View file

@ -10,6 +10,7 @@
cursor: pointer;
contain: style;
flex-shrink: 0;
font-weight: inherit !important;
}
.itemsContainer {
@ -40,10 +41,6 @@
contain: layout style;
}
.card, .card:focus {
font-weight: inherit !important;
}
button.card {
border: 0 !important;
font-size: inherit !important;
@ -70,7 +67,7 @@ button.card {
padding-bottom: 18.5%;
}
.card .cardBox {
.cardBox {
padding: 0 !important;
margin: 0;
transition: none !important;
@ -79,7 +76,7 @@ button.card {
overflow: hidden;
}
.layout-tv .card .cardBox {
.layout-tv .cardBox {
will-change: transform;
}
@ -90,10 +87,6 @@ button.card {
}
}
button.cardContent {
display: block;
}
.round .cardBox {
border: .7em solid transparent;
}
@ -105,6 +98,7 @@ button.cardContent {
.card:focus {
position: relative !important;
z-index: 10 !important;
font-weight: inherit !important;
}
.card:focus .cardBox {
@ -140,11 +134,6 @@ button.cardContent {
margin: 0 !important;
}
/*.card[focused]:not(.noScale) .cardBox, .card:focus:not(.noScale) .cardBox {
animation:SHW .2s;
animation-fill-mode: both;
}*/
.dimunselected .card .cardImageContainer {
-webkit-filter: brightness(50%);
filter: brightness(50%);
@ -217,6 +206,8 @@ button.cardImageContainer {
left: 0;
right: 0;
bottom: 0;
/* Needed in case this is a button */
display: block;
}
.round .cardContent {

10
dashboard-ui/bower_components/emby-webcomponents/emby-checkbox/emby-checkbox.js vendored
View file

@ -31,7 +31,15 @@
labelElement.classList.add('mdl-js-ripple-effect');
var labelTextElement = labelElement.querySelector('span');
labelElement.insertAdjacentHTML('beforeend', '<span class="mdl-checkbox__focus-helper"></span><span class="checkboxOutline"><span class="mdl-checkbox__tick-outline"></span></span>');
var outlineClass = 'checkboxOutline';
var customClass = this.getAttribute('data-outlineclass');
if (customClass) {
outlineClass += ' ' + customClass;
}
labelElement.insertAdjacentHTML('beforeend', '<span class="mdl-checkbox__focus-helper"></span><span class="' + outlineClass + '"><span class="mdl-checkbox__tick-outline"></span></span>');
labelTextElement.classList.add('checkboxLabel');

14
dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.css vendored
View file

@ -1,4 +1,4 @@
[is="emby-input"] {
.emby-input {
display: block;
margin: 0;
margin-bottom: 0 !important;
@ -33,12 +33,12 @@
transition: all .2s ease-out;
}
.inputLabel.blank:not(.nofloat) {
transform-origin: left top;
transform: scale(1.3,1.3) translateY(86%);
}
.inputLabel-float {
transform-origin: left top;
transform: scale(1.3,1.3) translateY(86%);
}
.inputLabel.focused:not(.blank) {
.inputLabelFocused {
color: #52B54B;
}
@ -53,7 +53,7 @@
transform-origin: center center;
}
[is="emby-input"]:focus + .emby-input-selectionbar {
.emby-input:focus + .emby-input-selectionbar {
background-color: #52B54B;
transform: none;
}

21
dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.js vendored
View file

@ -36,20 +36,18 @@
EmbyInputPrototype.attachedCallback = function () {
if (this.getAttribute('data-embyinput') == 'true') {
if (this.classList.contains('emby-input')) {
return;
}
this.setAttribute('data-embyinput', 'true');
this.classList.add('emby-input');
var parentNode = this.parentNode;
var label = this.ownerDocument.createElement('label');
label.innerHTML = this.getAttribute('label') || '';
label.classList.add('inputLabel');
if (!supportsFloatingLabel || this.type == 'date') {
label.classList.add('nofloat');
}
var instanceSupportsFloat = supportsFloatingLabel && this.type != 'date';
label.htmlFor = this.id;
parentNode.insertBefore(label, this);
@ -60,19 +58,24 @@
function onChange() {
if (this.value) {
label.classList.remove('blank');
label.classList.remove('inputLabel-float');
} else {
label.classList.add('blank');
if (instanceSupportsFloat) {
label.classList.add('inputLabel-float');
}
}
}
this.addEventListener('focus', function () {
onChange.call(this);
label.classList.add('focused');
label.classList.add('inputLabelFocused');
label.classList.remove('inputLabelUnfocused');
});
this.addEventListener('blur', function () {
onChange.call(this);
label.classList.remove('focused');
label.classList.remove('inputLabelFocused');
label.classList.add('inputLabelUnfocused');
});
this.addEventListener('change', onChange);

4
dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.css vendored
View file

@ -41,6 +41,10 @@
font-size: 30px !important;
}
.withHoverMenu {
overflow: hidden;
}
@media all and (max-width: 1200px) {
.cardOverlayInner {

14
dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.js vendored
View file

@ -164,7 +164,17 @@
innerElem.classList.add('hide');
innerElem.classList.add('cardOverlayTarget');
var appendTo = dom.parentWithClass(elem, 'cardContent') || elem;
var appendTo = elem.querySelector('div.cardContent') || elem.querySelector('.cardScalable') || elem.querySelector('.cardBox');
//if (appendTo && appendTo.tagName == 'BUTTON') {
// appendTo = dom.parentWithClass(elem, 'cardScalable');
//}
if (!appendTo) {
appendTo = elem;
}
appendTo.classList.add('withHoverMenu');
appendTo.appendChild(innerElem);
}
@ -201,7 +211,7 @@
function onHoverIn(e) {
var elem = e.target;
var card = dom.parentWithClass(elem, 'cardImageContainer');
var card = dom.parentWithClass(elem, 'cardBox');
if (!card) {
return;

2
dashboard-ui/bower_components/emby-webcomponents/multiselect/multiselect.css vendored
View file

@ -30,7 +30,7 @@
padding-top: 1px;
}
.itemSelectionPanel .checkboxOutline {
.multiSelectCheckboxOutline {
top: 0 !important;
border-radius: 0 !important;
}

2
dashboard-ui/bower_components/emby-webcomponents/multiselect/multiselect.js vendored
View file

@ -134,7 +134,7 @@
cssClass += ' checkedInitial';
}
var checkedAttribute = isChecked ? ' checked' : '';
itemSelectionPanel.innerHTML = '<label class="checkboxContainer"><input type="checkbox" is="emby-checkbox" class="' + cssClass + '"' + checkedAttribute + '/><span></span></label>';
itemSelectionPanel.innerHTML = '<label class="checkboxContainer"><input type="checkbox" is="emby-checkbox" data-outlineclass="multiSelectCheckboxOutline" class="' + cssClass + '"' + checkedAttribute + '/><span></span></label>';
var chkItemSelect = itemSelectionPanel.querySelector('.chkItemSelect');
chkItemSelect.addEventListener('change', onSelectionChange);
}

4
dashboard-ui/css/librarybrowser.css
View file

@ -955,7 +955,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
@media all and (max-height: 700px) {
.vertical.alphabetPicker .alphaPickerButton {
.alphabetPicker-vertical .alphaPickerButton {
padding-top: 1px !important;
padding-bottom: 1px !important;
}
@ -963,7 +963,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
@media all and (max-height: 600px) {
.vertical.alphabetPicker .alphaPickerButton {
.alphabetPicker-vertical .alphaPickerButton {
padding-top: 0 !important;
padding-bottom: 0 !important;
}

4
dashboard-ui/css/site.css
View file

@ -649,11 +649,11 @@ progress {
background-color: #fff;
}
.ui-body-a .inputLabel, .ui-body-a .textareaLabel {
.ui-body-a .inputLabelUnfocused, .ui-body-a .textareaLabel {
color: #555;
}
.ui-body-a .inputLabel.focused:not(.blank), .ui-body-a .textareaLabelFocused, .ui-body-a .selectLabelFocused {
.ui-body-a .inputLabelFocused, .ui-body-a .textareaLabelFocused, .ui-body-a .selectLabelFocused {
color: green;
}

2
dashboard-ui/itemlist.html
View file

@ -1,5 +1,5 @@
<div id="itemListPage" data-role="page" class="page libraryPage folderListPage noSecondaryNavPage">
<div class="alphaPicker vertical alphabetPicker">
<div class="alphaPicker alphaPicker-vertical alphabetPicker">
</div>
<div data-role="content" class="itemListContent">

6
dashboard-ui/movies.html
View file

@ -52,7 +52,7 @@
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker">
@ -68,7 +68,7 @@
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker vertical-wrap">
@ -85,7 +85,7 @@
<button type="button" is="paper-icon-button-light" class="btnNewCollection autoSize"><i class="md-icon">add</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker centered" style="text-align:center;">

6
dashboard-ui/music.html
View file

@ -50,7 +50,7 @@
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker">
@ -66,7 +66,7 @@
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker">
@ -82,7 +82,7 @@
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker">

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

@ -157,7 +157,7 @@ button[is="emby-button"].notext {
background-color: #e57373 !important;
}
.ui-body-b .paperListLabel, .ui-body-b .fieldDescription, .ui-body-b .selectLabelUnfocused, .ui-body-b .inputLabel, .ui-body-b .textareaLabelUnfocused {
.ui-body-b .paperListLabel, .ui-body-b .fieldDescription, .ui-body-b .selectLabelUnfocused, .ui-body-b .inputLabelUnfocused, .ui-body-b .textareaLabelUnfocused {
color: #ccc;
}

2
dashboard-ui/tv.html
View file

@ -70,7 +70,7 @@
<button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
</div>
<div class="alphaPicker alphabetPicker vertical">
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
</div>
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker">