mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update polymer
This commit is contained in:
parent
6825ae319e
commit
2d53ff29c5
106 changed files with 3070 additions and 1567 deletions
|
@ -19,8 +19,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|||
<link rel="import" href="../iron-icons/iron-icons.html">
|
||||
<link rel="import" href="../iron-icon/iron-icon.html">
|
||||
<link rel="import" href="../iron-selector/iron-selectable.html">
|
||||
<link rel="import" href="../iron-form-element-behavior/iron-form-element-behavior.html">
|
||||
<link rel="import" href="../iron-validatable-behavior/iron-validatable-behavior.html">
|
||||
|
||||
<!--
|
||||
Material design: [Dropdown menus](https://www.google.com/design/spec/components/buttons.html#buttons-dropdown-buttons)
|
||||
|
||||
`paper-dropdown-menu` is similar to a native browser select element.
|
||||
`paper-dropdown-menu` works with selectable content. The currently selected
|
||||
item is displayed in the control. If no item is selected, the `label` is
|
||||
|
@ -108,16 +112,17 @@ respectively.
|
|||
}
|
||||
|
||||
paper-ripple {
|
||||
top: 20px;
|
||||
left: 8px;
|
||||
bottom: 16px;
|
||||
right: 8px;
|
||||
top: 12px;
|
||||
left: 0px;
|
||||
bottom: 8px;
|
||||
right: 0px;
|
||||
|
||||
@apply(--paper-dropdown-menu-ripple);
|
||||
}
|
||||
|
||||
paper-menu-button {
|
||||
display: block;
|
||||
padding: 0;
|
||||
@apply(--paper-dropdown-menu-button);
|
||||
}
|
||||
|
||||
|
@ -146,6 +151,7 @@ respectively.
|
|||
<div class="dropdown-trigger">
|
||||
<paper-ripple></paper-ripple>
|
||||
<paper-input
|
||||
invalid="[[invalid]]"
|
||||
readonly
|
||||
disabled="[[disabled]]"
|
||||
value="[[selectedItemLabel]]"
|
||||
|
@ -181,7 +187,9 @@ respectively.
|
|||
|
||||
behaviors: [
|
||||
Polymer.IronControlState,
|
||||
Polymer.IronButtonState
|
||||
Polymer.IronButtonState,
|
||||
Polymer.IronFormElementBehavior,
|
||||
Polymer.IronValidatableBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
|
@ -193,7 +201,7 @@ respectively.
|
|||
selectedItemLabel: {
|
||||
type: String,
|
||||
notify: true,
|
||||
computed: '_computeSelectedItemLabel(selectedItem)'
|
||||
readOnly: true
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -209,6 +217,17 @@ respectively.
|
|||
readOnly: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The value for this element that will be used when submitting in
|
||||
* a form. It is read only, and will always have the same value
|
||||
* as `selectedItemLabel`.
|
||||
*/
|
||||
value: {
|
||||
type: String,
|
||||
notify: true,
|
||||
readOnly: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The label for the dropdown.
|
||||
*/
|
||||
|
@ -275,6 +294,10 @@ respectively.
|
|||
'aria-haspopup': 'true'
|
||||
},
|
||||
|
||||
observers: [
|
||||
'_selectedItemChanged(selectedItem)'
|
||||
],
|
||||
|
||||
attached: function() {
|
||||
// NOTE(cdata): Due to timing, a preselected value in a `IronSelectable`
|
||||
// child will cause an `iron-select` event to fire while the element is
|
||||
|
@ -342,12 +365,16 @@ respectively.
|
|||
* @param {Element} selectedItem A selected Element item, with an
|
||||
* optional `label` property.
|
||||
*/
|
||||
_computeSelectedItemLabel: function(selectedItem) {
|
||||
_selectedItemChanged: function(selectedItem) {
|
||||
var value = '';
|
||||
if (!selectedItem) {
|
||||
return '';
|
||||
value = '';
|
||||
} else {
|
||||
value = selectedItem.label || selectedItem.textContent.trim();
|
||||
}
|
||||
|
||||
return selectedItem.label || selectedItem.textContent.trim();
|
||||
this._setValue(value);
|
||||
this._setSelectedItemLabel(value);
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -362,7 +389,17 @@ respectively.
|
|||
// derived from the metrics of elements internal to `paper-input`'s
|
||||
// template. The metrics will change depending on whether or not the
|
||||
// input has a floating label.
|
||||
return noLabelFloat ? -4 : 16;
|
||||
return noLabelFloat ? -4 : 8;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns false if the element is required and does not have a selection,
|
||||
* and true otherwise.
|
||||
* @return {Boolean} true if `required` is false, or if `required` is true
|
||||
* and the element has a valid selection.
|
||||
*/
|
||||
_getValidity: function() {
|
||||
return this.disabled || !this.required || (this.required && this.value);
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue