mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-18 11:28:23 -07:00
85 lines
2.2 KiB
HTML
85 lines
2.2 KiB
HTML
<!--
|
|
@license
|
|
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
|
|
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
|
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
|
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
|
Code distributed by Google as part of the polymer project is also
|
|
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
|
-->
|
|
|
|
<link rel="import" href="../polymer/polymer.html">
|
|
<link rel="import" href="../paper-styles/typography.html">
|
|
<link rel="import" href="paper-input-addon-behavior.html">
|
|
|
|
<!--
|
|
`<paper-input-char-counter>` is a character counter for use with `<paper-input-container>`. It
|
|
shows the number of characters entered in the input and the max length if it is specified.
|
|
|
|
<paper-input-container>
|
|
<input is="iron-input" maxlength="20">
|
|
<paper-input-char-counter></paper-input-char-counter>
|
|
</paper-input-container>
|
|
|
|
### Styling
|
|
|
|
The following mixin is available for styling:
|
|
|
|
Custom property | Description | Default
|
|
----------------|-------------|----------
|
|
`--paper-input-char-counter` | Mixin applied to the element | `{}`
|
|
-->
|
|
|
|
<dom-module id="paper-input-char-counter">
|
|
<template>
|
|
<style>
|
|
:host {
|
|
display: inline-block;
|
|
float: right;
|
|
|
|
@apply(--paper-font-caption);
|
|
@apply(--paper-input-char-counter);
|
|
}
|
|
|
|
:host-context([dir="rtl"]) {
|
|
float: left;
|
|
}
|
|
</style>
|
|
|
|
<span>[[_charCounterStr]]</span>
|
|
</template>
|
|
</dom-module>
|
|
|
|
<script>
|
|
Polymer({
|
|
is: 'paper-input-char-counter',
|
|
|
|
behaviors: [
|
|
Polymer.PaperInputAddonBehavior
|
|
],
|
|
|
|
properties: {
|
|
_charCounterStr: {
|
|
type: String,
|
|
value: '0'
|
|
}
|
|
},
|
|
|
|
update: function(state) {
|
|
if (!state.inputElement) {
|
|
return;
|
|
}
|
|
|
|
state.value = state.value || '';
|
|
|
|
// Account for the textarea's new lines.
|
|
var str = state.value.replace(/(\r\n|\n|\r)/g, '--').length;
|
|
|
|
if (state.inputElement.hasAttribute('maxlength')) {
|
|
str += '/' + state.inputElement.getAttribute('maxlength');
|
|
}
|
|
this._charCounterStr = str;
|
|
}
|
|
});
|
|
</script>
|