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

use shared image loader

This commit is contained in:
Luke Pulverenti 2016-01-16 13:29:08 -05:00
parent a08a1c37ec
commit ad1f82dbaf
17 changed files with 570 additions and 347 deletions

View file

@ -32,7 +32,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
*/
/**
* The label for this input. Bind this to `<label>`'s content and `hidden` property, e.g.
* The label for this input. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* `<label>`'s content and `hidden` property, e.g.
* `<label hidden$="[[!label]]">[[label]]</label>` in your `template`
*/
label: {
@ -40,7 +42,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* The value for this input. Bind this to the `<input is="iron-input">`'s `bindValue`
* The value for this input. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<input is="iron-input">`'s `bindValue`
* property, or the value property of your input that is `notify:true`.
*/
value: {
@ -49,8 +53,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Set to true to disable this input. Bind this to both the `<paper-input-container>`'s
* and the input's `disabled` property.
* Set to true to disable this input. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* both the `<paper-input-container>`'s and the input's `disabled` property.
*/
disabled: {
type: Boolean,
@ -58,9 +63,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Returns true if the value is invalid. Bind this to both the `<paper-input-container>`'s
* and the input's `invalid` property.
*
* Returns true if the value is invalid. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to both the
* `<paper-input-container>`'s and the input's `invalid` property.
*
* If `autoValidate` is true, the `invalid` attribute is managed automatically,
* which can clobber attempts to manage it manually.
*/
@ -71,48 +77,55 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Set to true to prevent the user from entering invalid input. Bind this to the
* `<input is="iron-input">`'s `preventInvalidInput` property.
* Set to true to prevent the user from entering invalid input. If you're
* using PaperInputBehavior to implement your own paper-input-like element,
* bind this to `<input is="iron-input">`'s `preventInvalidInput` property.
*/
preventInvalidInput: {
type: Boolean
},
/**
* Set this to specify the pattern allowed by `preventInvalidInput`. Bind this to the
* `<input is="iron-input">`'s `allowedPattern` property.
* Set this to specify the pattern allowed by `preventInvalidInput`. If
* you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `allowedPattern`
* property.
*/
allowedPattern: {
type: String
},
/**
* The type of the input. The supported types are `text`, `number` and `password`. Bind this
* to the `<input is="iron-input">`'s `type` property.
* The type of the input. The supported types are `text`, `number` and `password`.
* If you're using PaperInputBehavior to implement your own paper-input-like element,
* bind this to the `<input is="iron-input">`'s `type` property.
*/
type: {
type: String
},
/**
* The datalist of the input (if any). This should match the id of an existing `<datalist>`. Bind this
* to the `<input is="iron-input">`'s `list` property.
* The datalist of the input (if any). This should match the id of an existing `<datalist>`.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `list` property.
*/
list: {
type: String
},
/**
* A pattern to validate the `input` with. Bind this to the `<input is="iron-input">`'s
* `pattern` property.
* A pattern to validate the `input` with. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<input is="iron-input">`'s `pattern` property.
*/
pattern: {
type: String
},
/**
* Set to true to mark the input as required. Bind this to the `<input is="iron-input">`'s
* `required` property.
* Set to true to mark the input as required. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<input is="iron-input">`'s `required` property.
*/
required: {
type: Boolean,
@ -120,8 +133,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* The error message to display when the input is invalid. Bind this to the
* `<paper-input-error>`'s content, if using.
* The error message to display when the input is invalid. If you're using
* PaperInputBehavior to implement your own paper-input-like element,
* bind this to the `<paper-input-error>`'s content, if using.
*/
errorMessage: {
type: String
@ -136,8 +150,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Set to true to disable the floating label. Bind this to the `<paper-input-container>`'s
* `noLabelFloat` property.
* Set to true to disable the floating label. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<paper-input-container>`'s `noLabelFloat` property.
*/
noLabelFloat: {
type: Boolean,
@ -145,8 +160,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Set to true to always float the label. Bind this to the `<paper-input-container>`'s
* `alwaysFloatLabel` property.
* Set to true to always float the label. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<paper-input-container>`'s `alwaysFloatLabel` property.
*/
alwaysFloatLabel: {
type: Boolean,
@ -154,8 +170,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Set to true to auto-validate the input value. Bind this to the `<paper-input-container>`'s
* `autoValidate` property.
* Set to true to auto-validate the input value. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<paper-input-container>`'s `autoValidate` property.
*/
autoValidate: {
type: Boolean,
@ -163,8 +180,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Name of the validator to use. Bind this to the `<input is="iron-input">`'s `validator`
* property.
* Name of the validator to use. If you're using PaperInputBehavior to
* implement your own paper-input-like element, bind this to
* the `<input is="iron-input">`'s `validator` property.
*/
validator: {
type: String
@ -173,7 +191,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// HTMLInputElement attributes for binding if needed
/**
* Bind this to the `<input is="iron-input">`'s `autocomplete` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `autocomplete` property.
*/
autocomplete: {
type: String,
@ -181,29 +200,34 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Bind this to the `<input is="iron-input">`'s `autofocus` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `autofocus` property.
*/
autofocus: {
type: Boolean
},
/**
* Bind this to the `<input is="iron-input">`'s `inputmode` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `inputmode` property.
*/
inputmode: {
type: String
},
/**
* Bind this to the `<input is="iron-input">`'s `minlength` property.
* The minimum length of the input value.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `minlength` property.
*/
minlength: {
type: Number
},
/**
* The maximum length of the input value. Bind this to the `<input is="iron-input">`'s
* `maxlength` property.
* The maximum length of the input value.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `maxlength` property.
*/
maxlength: {
type: Number
@ -211,7 +235,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
/**
* The minimum (numeric or date-time) input value.
* Bind this to the `<input is="iron-input">`'s `min` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `min` property.
*/
min: {
type: String
@ -220,7 +245,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
/**
* The maximum (numeric or date-time) input value.
* Can be a String (e.g. `"2000-1-1"`) or a Number (e.g. `2`).
* Bind this to the `<input is="iron-input">`'s `max` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `max` property.
*/
max: {
type: String
@ -228,14 +254,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
/**
* Limits the numeric or date-time increments.
* Bind this to the `<input is="iron-input">`'s `step` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `step` property.
*/
step: {
type: String
},
/**
* Bind this to the `<input is="iron-input">`'s `name` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `name` property.
*/
name: {
type: String
@ -251,7 +279,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Bind this to the `<input is="iron-input">`'s `readonly` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `readonly` property.
*/
readonly: {
type: Boolean,
@ -259,7 +288,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Bind this to the `<input is="iron-input">`'s `size` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `size` property.
*/
size: {
type: Number
@ -268,7 +298,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// Nonstandard attributes for binding if needed
/**
* Bind this to the `<input is="iron-input">`'s `autocapitalize` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `autocapitalize` property.
*/
autocapitalize: {
type: String,
@ -276,7 +307,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Bind this to the `<input is="iron-input">`'s `autocorrect` property.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `autocorrect` property.
*/
autocorrect: {
type: String,
@ -284,28 +316,36 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
/**
* Bind this to the `<input is="iron-input">`'s `autosave` property, used with type=search.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `autosave` property,
* used with type=search.
*/
autosave: {
type: String
},
/**
* Bind this to the `<input is="iron-input">`'s `results` property, used with type=search.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `results` property,
* used with type=search.
*/
results: {
type: Number
},
/**
* Bind this to the `<input is="iron-input">`'s `accept` property, used with type=file.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the `<input is="iron-input">`'s `accept` property,
* used with type=file.
*/
accept: {
type: String
},
/**
* Bind this to the `<input is="iron-input">`'s `multiple` property, used with type=file.
* If you're using PaperInputBehavior to implement your own paper-input-like
* element, bind this to the`<input is="iron-input">`'s `multiple` property,
* used with type=file.
*/
multiple: {
type: Boolean
@ -354,8 +394,20 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
return this.inputElement;
},
registered: function() {
// These types have some default placeholder text; overlapping
// the label on top of it looks terrible. Auto-float the label in this case.
this._typesThatHaveText = ["date", "datetime", "datetime-local", "month",
"time", "week", "file"];
},
attached: function() {
this._updateAriaLabelledBy();
if (this.inputElement &&
this._typesThatHaveText.indexOf(this.inputElement.type) !== -1) {
this.alwaysFloatLabel = true;
}
},
_appendStringWithSpace: function(str, more) {