mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-17 19:08:18 -07:00
update tv config
This commit is contained in:
Luke Pulverenti
parent
66d87717d9
commit
74fad00abe
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "iron-pages",
|
||||
"version": "1.0.2",
|
||||
"version": "1.0.3",
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"description": "Organizes a set of pages and shows one at a time",
|
||||
"main": "iron-pages.html",
|
||||
@ -30,14 +30,13 @@
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"homepage": "https://github.com/PolymerElements/iron-pages",
|
||||
"_release": "1.0.2",
|
||||
"_release": "1.0.3",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.2",
|
||||
"commit": "061e9ea95b58880f0f992b081c52a06665b553c9"
|
||||
"tag": "v1.0.3",
|
||||
"commit": "ca6e7892786d60d8cb6935d8376b27c3851fdbf5"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/iron-pages.git",
|
||||
"_target": "~1.0.2",
|
||||
"_originalSource": "PolymerElements/iron-pages",
|
||||
"_direct": true
|
||||
"_originalSource": "PolymerElements/iron-pages"
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "iron-pages",
|
||||
"version": "1.0.2",
|
||||
"version": "1.0.3",
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"description": "Organizes a set of pages and shows one at a time",
|
||||
"main": "iron-pages.html",
|
||||
|
||||
@ -78,6 +78,7 @@ Example:
|
||||
// handler attempts to change the page and the activateEvent
|
||||
// handler immediately changes it back
|
||||
activateEvent: {
|
||||
type: String,
|
||||
value: null
|
||||
}
|
||||
|
||||
|
||||
@ -27,14 +27,14 @@
|
||||
"web-component-tester": "*",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"homepage": "https://github.com/polymerelements/iron-resizable-behavior",
|
||||
"homepage": "https://github.com/PolymerElements/iron-resizable-behavior",
|
||||
"_release": "1.0.2",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.2",
|
||||
"commit": "85de8ba28be2bf17c81d6436ef1119022b003674"
|
||||
},
|
||||
"_source": "git://github.com/polymerelements/iron-resizable-behavior.git",
|
||||
"_source": "git://github.com/PolymerElements/iron-resizable-behavior.git",
|
||||
"_target": "^1.0.0",
|
||||
"_originalSource": "polymerelements/iron-resizable-behavior"
|
||||
"_originalSource": "PolymerElements/iron-resizable-behavior"
|
||||
}
|
||||
@ -28,14 +28,14 @@
|
||||
"web-component-tester": "*",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"homepage": "https://github.com/polymerelements/iron-selector",
|
||||
"homepage": "https://github.com/PolymerElements/iron-selector",
|
||||
"_release": "1.0.2",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.2",
|
||||
"commit": "ea22d91d11ba6f72c01faa952d5e600f9d1773cf"
|
||||
},
|
||||
"_source": "git://github.com/polymerelements/iron-selector.git",
|
||||
"_source": "git://github.com/PolymerElements/iron-selector.git",
|
||||
"_target": "^1.0.0",
|
||||
"_originalSource": "polymerelements/iron-selector"
|
||||
"_originalSource": "PolymerElements/iron-selector"
|
||||
}
|
||||
47
dashboard-ui/bower_components/paper-checkbox/.bower.json
vendored
Normal file
47
dashboard-ui/bower_components/paper-checkbox/.bower.json
vendored
Normal file
@ -0,0 +1,47 @@
|
||||
{
|
||||
"name": "paper-checkbox",
|
||||
"version": "1.0.5",
|
||||
"description": "A material design checkbox",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"paper",
|
||||
"checkbox",
|
||||
"control"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-checkbox"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-checkbox",
|
||||
"ignore": [],
|
||||
"devDependencies": {
|
||||
"web-component-tester": "*",
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"paper-ripple": "PolymerElements/paper-ripple#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"_release": "1.0.5",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.5",
|
||||
"commit": "af864401daab761d2fb7e6eadddb3cd659be8f85"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/paper-checkbox.git",
|
||||
"_target": "~1.0.5",
|
||||
"_originalSource": "PolymerElements/paper-checkbox",
|
||||
"_direct": true
|
||||
}
|
||||
1
dashboard-ui/bower_components/paper-checkbox/.gitignore
vendored
Normal file
1
dashboard-ui/bower_components/paper-checkbox/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
||||
37
dashboard-ui/bower_components/paper-checkbox/bower.json
vendored
Normal file
37
dashboard-ui/bower_components/paper-checkbox/bower.json
vendored
Normal file
@ -0,0 +1,37 @@
|
||||
{
|
||||
"name": "paper-checkbox",
|
||||
"version": "1.0.5",
|
||||
"description": "A material design checkbox",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"paper",
|
||||
"checkbox",
|
||||
"control"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-checkbox"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-checkbox",
|
||||
"ignore": [],
|
||||
"devDependencies": {
|
||||
"web-component-tester": "*",
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"paper-ripple": "PolymerElements/paper-ripple#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
}
|
||||
}
|
||||
93
dashboard-ui/bower_components/paper-checkbox/demo/index.html
vendored
Normal file
93
dashboard-ui/bower_components/paper-checkbox/demo/index.html
vendored
Normal file
@ -0,0 +1,93 @@
|
||||
<!doctype 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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title>paper-checkbox demo</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
<link rel="import" href="../paper-checkbox.html">
|
||||
|
||||
<style is="custom-style">
|
||||
|
||||
paper-checkbox {
|
||||
display: block;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
paper-checkbox.blue {
|
||||
--paper-checkbox-checked-color: var(--paper-light-blue-500);
|
||||
--paper-checkbox-checked-ink-color: var(--paper-light-blue-500);
|
||||
--paper-checkbox-unchecked-color: var(--paper-light-blue-900);
|
||||
--paper-checkbox-unchecked-ink-color: var(--paper-light-blue-900);
|
||||
}
|
||||
|
||||
paper-checkbox.red {
|
||||
--paper-checkbox-checked-color: var(--paper-red-500);
|
||||
--paper-checkbox-checked-ink-color: var(--paper-red-500);
|
||||
--paper-checkbox-unchecked-color: var(--paper-red-900);
|
||||
--paper-checkbox-unchecked-ink-color: var(--paper-red-900);
|
||||
}
|
||||
|
||||
paper-checkbox.green {
|
||||
--paper-checkbox-checked-color: var(--paper-green-500);
|
||||
--paper-checkbox-checked-ink-color: var(--paper-green-500);
|
||||
--paper-checkbox-unchecked-color: var(--paper-green-900);
|
||||
--paper-checkbox-unchecked-ink-color: var(--paper-green-900);
|
||||
}
|
||||
|
||||
paper-checkbox.orange {
|
||||
--paper-checkbox-checked-color: var(--paper-orange-500);
|
||||
--paper-checkbox-checked-ink-color: var(--paper-orange-500);
|
||||
--paper-checkbox-unchecked-color: var(--paper-orange-900);
|
||||
--paper-checkbox-unchecked-ink-color: var(--paper-orange-900);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body unresolved>
|
||||
<div class="horizontal-section-container">
|
||||
<div>
|
||||
<h4>Enabled</h4>
|
||||
<div class="horizontal-section">
|
||||
<paper-checkbox>Oxygen</paper-checkbox>
|
||||
<paper-checkbox>Carbon</paper-checkbox>
|
||||
<paper-checkbox checked>Hydrogen</paper-checkbox>
|
||||
<paper-checkbox checked>Nitrogen</paper-checkbox>
|
||||
<paper-checkbox checked>Calcium</paper-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Disabled</h4>
|
||||
<div class="horizontal-section">
|
||||
<paper-checkbox disabled>Oxygen</paper-checkbox>
|
||||
<paper-checkbox disabled>Carbon</paper-checkbox>
|
||||
<paper-checkbox checked disabled>Hydrogen</paper-checkbox>
|
||||
<paper-checkbox checked disabled>Nitrogen</paper-checkbox>
|
||||
<paper-checkbox checked disabled>Calcium</paper-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Color</h4>
|
||||
<div class="horizontal-section">
|
||||
<paper-checkbox class="blue" checked>Oxygen</paper-checkbox>
|
||||
<paper-checkbox class="red" checked>Carbon</paper-checkbox>
|
||||
<paper-checkbox class="orange" checked>Hydrogen</paper-checkbox>
|
||||
<paper-checkbox class="green" checked>Nitrogen</paper-checkbox>
|
||||
<paper-checkbox class="blue" checked>Calcium</paper-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
30
dashboard-ui/bower_components/paper-checkbox/index.html
vendored
Normal file
30
dashboard-ui/bower_components/paper-checkbox/index.html
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
<!doctype 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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
|
||||
<title>paper-checkbox</title>
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
17
dashboard-ui/bower_components/paper-checkbox/metadata.html
vendored
Normal file
17
dashboard-ui/bower_components/paper-checkbox/metadata.html
vendored
Normal file
@ -0,0 +1,17 @@
|
||||
<!--
|
||||
@license
|
||||
Copyright (c) 2014 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
|
||||
-->
|
||||
<x-meta id="paper-checkbox" label="Checkbox" group="Paper">
|
||||
<template>
|
||||
<paper-checkbox label="click me"></paper-checkbox>
|
||||
</template>
|
||||
<template id="imports">
|
||||
<link rel="import" href="paper-checkbox.html">
|
||||
</template>
|
||||
</x-meta>
|
||||
151
dashboard-ui/bower_components/paper-checkbox/paper-checkbox.css
vendored
Normal file
151
dashboard-ui/bower_components/paper-checkbox/paper-checkbox.css
vendored
Normal file
@ -0,0 +1,151 @@
|
||||
/*
|
||||
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
|
||||
*/
|
||||
|
||||
:host {
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
:host(:focus) {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#checkboxContainer {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
vertical-align: middle;
|
||||
background-color: var(--paper-checkbox-unchecked-background-color, transparent);
|
||||
}
|
||||
|
||||
:host #ink {
|
||||
position: absolute;
|
||||
top: -15px;
|
||||
left: -15px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
color: var(--paper-checkbox-unchecked-ink-color, --primary-text-color);
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host #ink[checked] {
|
||||
color: var(--paper-checkbox-checked-ink-color, --default-primary-color);
|
||||
}
|
||||
|
||||
:host #checkbox {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
border: solid 2px;
|
||||
border-color: var(--paper-checkbox-unchecked-color, --primary-text-color);
|
||||
border-radius: 2px;
|
||||
pointer-events: none;
|
||||
-webkit-transition: background-color 140ms, border-color 140ms;
|
||||
transition: background-color 140ms, border-color 140ms;
|
||||
}
|
||||
|
||||
/* checkbox checked animations */
|
||||
#checkbox.checked #checkmark {
|
||||
-webkit-animation: checkmark-expand 140ms ease-out forwards;
|
||||
animation: checkmark-expand 140ms ease-out forwards;
|
||||
}
|
||||
|
||||
@-webkit-keyframes checkmark-expand {
|
||||
0% {
|
||||
top: 9px;
|
||||
left: 6px;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
100% {
|
||||
top: -1px;
|
||||
left: 4px;
|
||||
width: 5px;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes checkmark-expand {
|
||||
0% {
|
||||
top: 9px;
|
||||
left: 6px;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
100% {
|
||||
top: -1px;
|
||||
left: 4px;
|
||||
width: 5px;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
:host #checkbox.checked {
|
||||
background-color: var(--paper-checkbox-checked-color, --default-primary-color);
|
||||
border-color: var(--paper-checkbox-checked-color, --default-primary-color);
|
||||
}
|
||||
|
||||
:host #checkmark {
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: 4px;
|
||||
width: 5px;
|
||||
height: 10px;
|
||||
border-style: solid;
|
||||
border-top: none;
|
||||
border-left: none;
|
||||
border-right-width: 2px;
|
||||
border-bottom-width: 2px;
|
||||
border-color: var(--paper-checkbox-checkmark-color, white);
|
||||
}
|
||||
|
||||
/* label */
|
||||
#checkboxLabel {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
padding-left: 8px;
|
||||
white-space: normal;
|
||||
pointer-events: none;
|
||||
color: var(--paper-checkbox-label-color, --primary-text-color);
|
||||
}
|
||||
|
||||
#checkboxLabel[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* disabled state */
|
||||
:host([disabled]) {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host([disabled]) #checkbox {
|
||||
opacity: 0.5;
|
||||
border-color: var(--paper-checkbox-unchecked-color, --primary-text-color);
|
||||
}
|
||||
|
||||
:host([disabled][checked]) #checkbox {
|
||||
background-color: var(--paper-checkbox-unchecked-color, --primary-text-color);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
:host([disabled]) #checkboxLabel {
|
||||
opacity: 0.65;
|
||||
}
|
||||
153
dashboard-ui/bower_components/paper-checkbox/paper-checkbox.html
vendored
Normal file
153
dashboard-ui/bower_components/paper-checkbox/paper-checkbox.html
vendored
Normal file
@ -0,0 +1,153 @@
|
||||
<!--
|
||||
@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-ripple/paper-ripple.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-behaviors/paper-inky-focus-behavior.html">
|
||||
|
||||
<!--
|
||||
|
||||
`paper-checkbox` is a button that can be either checked or unchecked. User
|
||||
can tap the checkbox to check or uncheck it. Usually you use checkboxes
|
||||
to allow user to select multiple options from a set. If you have a single
|
||||
ON/OFF option, avoid using a single checkbox and use `paper-toggle-button`
|
||||
instead.
|
||||
|
||||
Example:
|
||||
|
||||
<paper-checkbox>label</paper-checkbox>
|
||||
|
||||
<paper-checkbox checked> label</paper-checkbox>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-checkbox-unchecked-background-color` | Checkbox background color when the input is not checked | `transparent`
|
||||
`--paper-checkbox-unchecked-color` | Checkbox border color when the input is not checked | `--primary-text-color`
|
||||
`--paper-checkbox-unchecked-ink-color` | Selected/focus ripple color when the input is not checked | `--primary-text-color`
|
||||
`--paper-checkbox-checked-color` | Checkbox color when the input is checked | `--default-primary-color`
|
||||
`--paper-checkbox-checked-ink-color` | Selected/focus ripple color when the input is checked | `--default-primary-color`
|
||||
`--paper-checkbox-checkmark-color` | Checkmark color | `white`
|
||||
`--paper-checkbox-label-color` | Label color | `--primary-text-color`
|
||||
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="paper-checkbox">
|
||||
<link rel="import" type="css" href="paper-checkbox.css">
|
||||
|
||||
<template>
|
||||
|
||||
<div id="checkboxContainer">
|
||||
<paper-ripple id="ink" class="circle" center checked$="[[checked]]"></paper-ripple>
|
||||
<div id="checkbox" class$="[[_computeCheckboxClass(checked)]]">
|
||||
<div id="checkmark" class$="[[_computeCheckmarkClass(checked)]]"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="checkboxLabel" aria-hidden="true"><content></content></div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-checkbox',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperInkyFocusBehavior
|
||||
],
|
||||
|
||||
hostAttributes: {
|
||||
role: 'checkbox',
|
||||
'aria-checked': false,
|
||||
tabindex: 0
|
||||
},
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* Fired when the checked state changes due to user interaction.
|
||||
*
|
||||
* @event change
|
||||
*/
|
||||
|
||||
/**
|
||||
* Fired when the checked state changes.
|
||||
*
|
||||
* @event iron-change
|
||||
*/
|
||||
|
||||
/**
|
||||
* Gets or sets the state, `true` is checked and `false` is unchecked.
|
||||
*/
|
||||
checked: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
reflectToAttribute: true,
|
||||
notify: true,
|
||||
observer: '_checkedChanged'
|
||||
},
|
||||
|
||||
/**
|
||||
* If true, the button toggles the active state with each tap or press
|
||||
* of the spacebar.
|
||||
*/
|
||||
toggles: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
reflectToAttribute: true
|
||||
}
|
||||
},
|
||||
|
||||
ready: function() {
|
||||
if (Polymer.dom(this).textContent == '') {
|
||||
this.$.checkboxLabel.hidden = true;
|
||||
} else {
|
||||
this.setAttribute('aria-label', Polymer.dom(this).textContent);
|
||||
}
|
||||
this._isReady = true;
|
||||
},
|
||||
|
||||
// button-behavior hook
|
||||
_buttonStateChanged: function() {
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
if (this._isReady) {
|
||||
this.checked = this.active;
|
||||
}
|
||||
},
|
||||
|
||||
_checkedChanged: function(checked) {
|
||||
this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
|
||||
this.active = this.checked;
|
||||
this.fire('iron-change');
|
||||
},
|
||||
|
||||
_computeCheckboxClass: function(checked) {
|
||||
if (checked) {
|
||||
return 'checked';
|
||||
}
|
||||
return '';
|
||||
},
|
||||
|
||||
_computeCheckmarkClass: function(checked) {
|
||||
if (!checked) {
|
||||
return 'hidden';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
</dom-module>
|
||||
99
dashboard-ui/bower_components/paper-checkbox/test/basic.html
vendored
Normal file
99
dashboard-ui/bower_components/paper-checkbox/test/basic.html
vendored
Normal file
@ -0,0 +1,99 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>paper-checkbox basic tests</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../test-fixture/test-fixture-mocha.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../../test-fixture/test-fixture.html">
|
||||
<link rel="import" href="../paper-checkbox.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="NoLabel">
|
||||
<template>
|
||||
<paper-checkbox id="check1"></paper-checkbox>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="WithLabel">
|
||||
<template>
|
||||
<paper-checkbox id="check2">Batman</paper-checkbox>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
suite('defaults', function() {
|
||||
var c1;
|
||||
|
||||
setup(function() {
|
||||
c1 = fixture('NoLabel');
|
||||
});
|
||||
|
||||
test('check checkbox via click', function() {
|
||||
c1.addEventListener('click', function() {
|
||||
assert.isTrue(c1.getAttribute('aria-checked') == 'true');
|
||||
assert.isTrue(c1.checked);
|
||||
});
|
||||
MockInteractions.tap(c1);
|
||||
});
|
||||
|
||||
test('toggle checkbox via click', function() {
|
||||
c1.checked = true;
|
||||
c1.addEventListener('click', function() {
|
||||
assert.isFalse(c1.getAttribute('aria-checked') != 'false');
|
||||
assert.isFalse(c1.checked);
|
||||
});
|
||||
MockInteractions.tap(c1);
|
||||
});
|
||||
|
||||
test('disabled checkbox cannot be clicked', function() {
|
||||
c1.disabled = true;
|
||||
c1.checked = true;
|
||||
c1.addEventListener('click', function() {
|
||||
assert.isTrue(c1.getAttribute('aria-checked') == 'true');
|
||||
assert.isTrue(c1.checked);
|
||||
});
|
||||
MockInteractions.tap(c1);
|
||||
});
|
||||
});
|
||||
|
||||
suite('a11y', function() {
|
||||
var c1;
|
||||
var c2;
|
||||
|
||||
setup(function() {
|
||||
c1 = fixture('NoLabel');
|
||||
c2 = fixture('WithLabel');
|
||||
});
|
||||
|
||||
test('has aria role "checkbox"', function() {
|
||||
assert.isTrue(c1.getAttribute('role') == 'checkbox');
|
||||
assert.isTrue(c2.getAttribute('role') == 'checkbox');
|
||||
});
|
||||
|
||||
test('checkbox with no label has no aria label', function() {
|
||||
assert.isTrue(!c1.getAttribute('aria-label'));
|
||||
});
|
||||
|
||||
test('checkbox with a label sets an aria label', function() {
|
||||
assert.isTrue(c2.getAttribute('aria-label') == "Batman");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
24
dashboard-ui/bower_components/paper-checkbox/test/index.html
vendored
Normal file
24
dashboard-ui/bower_components/paper-checkbox/test/index.html
vendored
Normal file
@ -0,0 +1,24 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>paper-checkbox tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'basic.html'
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "paper-progress",
|
||||
"version": "1.0.1",
|
||||
"version": "1.0.2",
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"description": "A material design progress bar",
|
||||
"authors": "The Polymer Authors",
|
||||
@ -29,11 +29,11 @@
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"homepage": "https://github.com/PolymerElements/paper-progress",
|
||||
"_release": "1.0.1",
|
||||
"_release": "1.0.2",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.1",
|
||||
"commit": "5171a785bd63e9687473d4b708f1b82137d4d9a5"
|
||||
"tag": "v1.0.2",
|
||||
"commit": "f4db2254c41f21d7df2bd8533d16f929507f823e"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/paper-progress.git",
|
||||
"_target": "^1.0.0",
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "paper-progress",
|
||||
"version": "1.0.1",
|
||||
"version": "1.0.2",
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"description": "A material design progress bar",
|
||||
"authors": "The Polymer Authors",
|
||||
|
||||
@ -29,7 +29,7 @@ Example:
|
||||
|
||||
<paper-progress value="10" secondary-progress="30"></paper-progress>
|
||||
|
||||
Styling progress bar:
|
||||
### Styling progress bar:
|
||||
|
||||
To change the active progress bar color:
|
||||
|
||||
@ -49,6 +49,26 @@ To change the progress bar background color:
|
||||
--paper-progress-container-color: #64ffda;
|
||||
}
|
||||
|
||||
Add the class `transiting` to a paper-progress to animate the progress bar when
|
||||
the value changed. You can also customize the transition:
|
||||
|
||||
paper-progress {
|
||||
--paper-progress-transition-duration: 0.08s;
|
||||
--paper-progress-transition-timing-function: ease;
|
||||
--paper-progress-transition-transition-delay: 0s;
|
||||
}
|
||||
|
||||
The following mixins are available for styling:
|
||||
|
||||
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-progress-container` | Mixin applied to container | `{}`
|
||||
|
||||
|
||||
|
||||
|
||||
@group Paper Elements
|
||||
@element paper-progress
|
||||
@hero hero.svg
|
||||
@ -63,11 +83,33 @@ To change the progress bar background color:
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
:host(.transiting) #activeProgress,
|
||||
:host(.transiting) #secondaryProgress {
|
||||
-webkit-transition-property: -webkit-transform;
|
||||
transition-property: transform;
|
||||
|
||||
/* Duration */
|
||||
-webkit-transition-duration: var(--paper-progress-transition-duration, 0.08s);
|
||||
transition-duration: var(--paper-progress-transition-duration, 0.08s);
|
||||
|
||||
/* Timing function */
|
||||
-webkit-transition-timing-function: var(--paper-progress-transition-timing-function, ease);
|
||||
transition-timing-function: var(--paper-progress-transition-timing-function, ease);
|
||||
|
||||
/* Delay */
|
||||
-webkit-transition-delay: var(--paper-progress-transition-delay, 0s);
|
||||
transition-delay: var(--paper-progress-transition-delay, 0s);
|
||||
}
|
||||
|
||||
#progressContainer {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
background-color: var(--paper-progress-container-color, --google-grey-300);
|
||||
overflow: hidden;
|
||||
@apply(--paper-progress-container);
|
||||
}
|
||||
|
||||
#progressContainer, #indeterminateSplitter {
|
||||
background-color: var(--paper-progress-container-color, --google-grey-300);
|
||||
}
|
||||
|
||||
#activeProgress,
|
||||
@ -86,34 +128,86 @@ To change the progress bar background color:
|
||||
background-color: var(--paper-progress-secondary-color, --google-green-100);
|
||||
}
|
||||
|
||||
#indeterminateSplitter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#activeProgress.indeterminate {
|
||||
-webkit-transform-origin: right center;
|
||||
transform-origin: right center;
|
||||
-webkit-animation: indeterminate-bar 2s linear infinite;
|
||||
animation: indeterminate-bar 2s linear infinite;
|
||||
}
|
||||
|
||||
#indeterminateSplitter.indeterminate {
|
||||
display: block;
|
||||
-webkit-transform-origin: center center;
|
||||
transform-origin: center center;
|
||||
-webkit-animation: indeterminate-bar 1s linear infinite;
|
||||
animation: indeterminate-bar 1s linear infinite;
|
||||
-webkit-animation: indeterminate-splitter 2s linear infinite;
|
||||
animation: indeterminate-splitter 2s linear infinite;
|
||||
}
|
||||
|
||||
@-webkit-keyframes indeterminate-bar {
|
||||
0% {
|
||||
-webkit-transform: translate(-50%) scaleX(0);
|
||||
-webkit-transform: scaleX(1) translateX(-100%);
|
||||
}
|
||||
50% {
|
||||
-webkit-transform: translate(0%) scaleX(0.3);
|
||||
-webkit-transform: scaleX(1) translateX(0%);
|
||||
}
|
||||
75% {
|
||||
-webkit-transform: scaleX(1) translateX(0%);
|
||||
-webkit-animation-timing-function: cubic-bezier(.28,.62,.37,.91);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translate(50%) scaleX(0);
|
||||
-webkit-transform: scaleX(0) translateX(0%);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes indeterminate-splitter {
|
||||
0% {
|
||||
-webkit-transform: scaleX(.75) translateX(-125%);
|
||||
}
|
||||
30% {
|
||||
-webkit-transform: scaleX(.75) translateX(-125%);
|
||||
-webkit-animation-timing-function: cubic-bezier(.42,0,.6,.8);
|
||||
}
|
||||
90% {
|
||||
-webkit-transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes indeterminate-bar {
|
||||
0% {
|
||||
transform: translate(-50%) scaleX(0);
|
||||
transform: scaleX(1) translateX(-100%);
|
||||
}
|
||||
50% {
|
||||
transform: translate(0%) scaleX(0.3);
|
||||
transform: scaleX(1) translateX(0%);
|
||||
}
|
||||
75% {
|
||||
transform: scaleX(1) translateX(0%);
|
||||
animation-timing-function: cubic-bezier(.28,.62,.37,.91);
|
||||
}
|
||||
100% {
|
||||
transform: translate(50%) scaleX(0);
|
||||
transform: scaleX(0) translateX(0%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes indeterminate-splitter {
|
||||
0% {
|
||||
transform: scaleX(.75) translateX(-125%);
|
||||
}
|
||||
30% {
|
||||
transform: scaleX(.75) translateX(-125%);
|
||||
animation-timing-function: cubic-bezier(.42,0,.6,.8);
|
||||
}
|
||||
90% {
|
||||
transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
100% {
|
||||
transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -121,6 +215,7 @@ To change the progress bar background color:
|
||||
<div id="progressContainer" role="progressbar" aria-valuenow$="{{value}}" aria-valuemin$="{{min}}" aria-valuemax$="{{max}}">
|
||||
<div id="secondaryProgress" class="fit"></div>
|
||||
<div id="activeProgress" class="fit"></div>
|
||||
<div id="indeterminateSplitter" class="fit"></div>
|
||||
</div>
|
||||
</template>
|
||||
</dom-module>
|
||||
@ -175,6 +270,7 @@ To change the progress bar background color:
|
||||
// If we use attribute/class binding, the animation sometimes doesn't translate properly
|
||||
// on Safari 7.1. So instead, we toggle the class here in the update method.
|
||||
this.toggleClass('indeterminate', this.indeterminate, this.$.activeProgress);
|
||||
this.toggleClass('indeterminate', this.indeterminate, this.$.indeterminateSplitter);
|
||||
},
|
||||
|
||||
_transformProgress: function(progress, ratio) {
|
||||
|
||||
46
dashboard-ui/bower_components/paper-toggle-button/.bower.json
vendored
Normal file
46
dashboard-ui/bower_components/paper-toggle-button/.bower.json
vendored
Normal file
@ -0,0 +1,46 @@
|
||||
{
|
||||
"name": "paper-toggle-button",
|
||||
"version": "1.0.5",
|
||||
"description": "A material design toggle button control",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"toggle",
|
||||
"control"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-toggle-button"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-toggle-button",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"paper-ripple": "PolymerElements/paper-ripple#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"web-component-tester": "*",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"_release": "1.0.5",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.5",
|
||||
"commit": "9891ee6a4af756b198290c14137498f78d97593d"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/paper-toggle-button.git",
|
||||
"_target": "~1.0.5",
|
||||
"_originalSource": "PolymerElements/paper-toggle-button",
|
||||
"_direct": true
|
||||
}
|
||||
1
dashboard-ui/bower_components/paper-toggle-button/.gitignore
vendored
Normal file
1
dashboard-ui/bower_components/paper-toggle-button/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
bower_components
|
||||
36
dashboard-ui/bower_components/paper-toggle-button/bower.json
vendored
Normal file
36
dashboard-ui/bower_components/paper-toggle-button/bower.json
vendored
Normal file
@ -0,0 +1,36 @@
|
||||
{
|
||||
"name": "paper-toggle-button",
|
||||
"version": "1.0.5",
|
||||
"description": "A material design toggle button control",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"toggle",
|
||||
"control"
|
||||
],
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-toggle-button"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-toggle-button",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"paper-ripple": "PolymerElements/paper-ripple#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"web-component-tester": "*",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
|
||||
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
}
|
||||
}
|
||||
105
dashboard-ui/bower_components/paper-toggle-button/demo/index.html
vendored
Normal file
105
dashboard-ui/bower_components/paper-toggle-button/demo/index.html
vendored
Normal file
@ -0,0 +1,105 @@
|
||||
<!doctype 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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<title>paper-toggle-button demo</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
<link rel="import" href="../paper-toggle-button.html">
|
||||
|
||||
<style is="custom-style">
|
||||
.line {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.line span {
|
||||
margin-left: 24px;
|
||||
}
|
||||
|
||||
paper-toggle-button.blue {
|
||||
--paper-toggle-button-checked-bar-color: var(--paper-light-blue-500);
|
||||
--paper-toggle-button-checked-button-color: var(--paper-light-blue-500);
|
||||
--paper-toggle-button-checked-ink-color: var(--paper-light-blue-500);
|
||||
--paper-toggle-button-unchecked-bar-color: var(--paper-light-blue-900);
|
||||
--paper-toggle-button-unchecked-button-color: var(--paper-light-blue-900);
|
||||
--paper-toggle-button-unchecked-ink-color: var(--paper-light-blue-900);
|
||||
}
|
||||
|
||||
paper-toggle-button.red {
|
||||
--paper-toggle-button-checked-bar-color: var(--paper-red-500);
|
||||
--paper-toggle-button-checked-button-color: var(--paper-red-500);
|
||||
--paper-toggle-button-checked-ink-color: var(--paper-red-500);
|
||||
--paper-toggle-button-unchecked-bar-color: var(--paper-red-900);
|
||||
--paper-toggle-button-unchecked-button-color: var(--paper-red-900);
|
||||
--paper-toggle-button-unchecked-ink-color: var(--paper-red-900);
|
||||
}
|
||||
|
||||
paper-toggle-button.green {
|
||||
--paper-toggle-button-checked-bar-color: var(--paper-green-500);
|
||||
--paper-toggle-button-checked-button-color: var(--paper-green-500);
|
||||
--paper-toggle-button-checked-ink-color: var(--paper-green-500);
|
||||
--paper-toggle-button-unchecked-bar-color: var(--paper-green-900);
|
||||
--paper-toggle-button-unchecked-button-color: var(--paper-green-900);
|
||||
--paper-toggle-button-unchecked-ink-color: var(--paper-green-900);
|
||||
}
|
||||
|
||||
paper-toggle-button.orange {
|
||||
--paper-toggle-button-checked-bar-color: var(--paper-orange-500);
|
||||
--paper-toggle-button-checked-button-color: var(--paper-orange-500);
|
||||
--paper-toggle-button-checked-ink-color: var(--paper-orange-500);
|
||||
--paper-toggle-button-unchecked-bar-color: var(--paper-orange-900);
|
||||
--paper-toggle-button-unchecked-button-color: var(--paper-orange-900);
|
||||
--paper-toggle-button-unchecked-ink-color: var(--paper-orange-900);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body unresolved>
|
||||
<div class="horizontal-section-container">
|
||||
<div>
|
||||
<h4>Enabled</h4>
|
||||
<div class="horizontal-section">
|
||||
<div class="line"><paper-toggle-button></paper-toggle-button><span>Oxygen</span></div>
|
||||
<div class="line"><paper-toggle-button></paper-toggle-button><span>Carbon</span></div>
|
||||
<div class="line"><paper-toggle-button checked></paper-toggle-button><span>Hydrogen</span></div>
|
||||
<div class="line"><paper-toggle-button checked></paper-toggle-button><span>Nitrogen</span></div>
|
||||
<div class="line"><paper-toggle-button checked></paper-toggle-button><span>Calcium</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4>Disabled</h4>
|
||||
<div class="horizontal-section">
|
||||
<div class="line"><paper-toggle-button disabled></paper-toggle-button><span>Oxygen</span></div>
|
||||
<div class="line"><paper-toggle-button disabled></paper-toggle-button><span>Carbon</span></div>
|
||||
<div class="line"><paper-toggle-button checked disabled></paper-toggle-button><span>Hydrogen</span></div>
|
||||
<div class="line"><paper-toggle-button checked disabled></paper-toggle-button><span>Nitrogen</span></div>
|
||||
<div class="line"><paper-toggle-button checked disabled></paper-toggle-button><span>Calcium</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4>Color</h4>
|
||||
<div class="horizontal-section">
|
||||
<div class="line"><paper-toggle-button class="blue"></paper-toggle-button><span>Oxygen</span></div>
|
||||
<div class="line"><paper-toggle-button class="red"></paper-toggle-button><span>Carbon</span></div>
|
||||
<div class="line"><paper-toggle-button checked class="orange"></paper-toggle-button><span>Hydrogen</span></div>
|
||||
<div class="line"><paper-toggle-button checked class="green"></paper-toggle-button><span>Nitrogen</span></div>
|
||||
<div class="line"><paper-toggle-button checked class="blue"></paper-toggle-button><span>Calcium</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
22
dashboard-ui/bower_components/paper-toggle-button/hero.svg
vendored
Normal file
22
dashboard-ui/bower_components/paper-toggle-button/hero.svg
vendored
Normal file
@ -0,0 +1,22 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 225 126" enable-background="new 0 0 225 126" xml:space="preserve">
|
||||
<g id="background" display="none">
|
||||
<rect display="inline" fill="#B0BEC5" width="225" height="126"/>
|
||||
</g>
|
||||
<g id="label">
|
||||
</g>
|
||||
<g id="art">
|
||||
<g>
|
||||
<circle cx="123.8" cy="63" r="15.7"/>
|
||||
<path d="M123,77H98.5c-7.7,0-14-6.3-14-14s6.3-14,14-14H123c7.7,0,14,6.3,14,14S130.7,77,123,77z M98.5,51c-6.6,0-12,5.4-12,12
|
||||
s5.4,12,12,12H123c6.6,0,12-5.4,12-12s-5.4-12-12-12H98.5z"/>
|
||||
</g>
|
||||
<g id="ic_x5F_add_x0D_">
|
||||
</g>
|
||||
</g>
|
||||
<g id="Guides">
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 872 B |
26
dashboard-ui/bower_components/paper-toggle-button/index.html
vendored
Normal file
26
dashboard-ui/bower_components/paper-toggle-button/index.html
vendored
Normal file
@ -0,0 +1,26 @@
|
||||
<!doctype 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
|
||||
The complete set of authors may be found at http://polymer.github.io/AUTHORS
|
||||
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
|
||||
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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
109
dashboard-ui/bower_components/paper-toggle-button/paper-toggle-button.css
vendored
Normal file
109
dashboard-ui/bower_components/paper-toggle-button/paper-toggle-button.css
vendored
Normal file
@ -0,0 +1,109 @@
|
||||
/*
|
||||
@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
|
||||
*/
|
||||
|
||||
:host {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
:host([disabled]) {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host(:focus) {
|
||||
outline:none;
|
||||
}
|
||||
|
||||
:host .toggle-bar {
|
||||
background-color: var(--paper-toggle-button-unchecked-bar-color, #000000);
|
||||
}
|
||||
|
||||
:host .toggle-button {
|
||||
background-color: var(--paper-toggle-button-unchecked-button-color, --paper-grey-50);
|
||||
}
|
||||
|
||||
:host([checked]) .toggle-bar {
|
||||
background-color: var(--paper-toggle-button-checked-bar-color, --google-green-500);
|
||||
}
|
||||
|
||||
:host([checked]) .toggle-button {
|
||||
background-color: var(--paper-toggle-button-checked-button-color, --google-green-500);
|
||||
}
|
||||
|
||||
:host .toggle-ink {
|
||||
color: var(--paper-toggle-button-unchecked-ink-color, --primary-text-color);
|
||||
}
|
||||
|
||||
:host([checked]) .toggle-ink {
|
||||
color: var(--paper-toggle-button-checked-ink-color, --google-green-500);
|
||||
}
|
||||
|
||||
/* ID selectors should not be overriden by users. */
|
||||
|
||||
#toggleContainer {
|
||||
position: relative;
|
||||
width: 36px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
#toggleBar {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border-radius: 8px;
|
||||
pointer-events: none;
|
||||
opacity: 0.4;
|
||||
transition: background-color linear .08s;
|
||||
}
|
||||
|
||||
:host([checked]) #toggleBar {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
:host([disabled]) #toggleBar {
|
||||
background-color: #000;
|
||||
opacity: 0.12;
|
||||
}
|
||||
|
||||
#toggleButton {
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.6);
|
||||
transition: -webkit-transform linear .08s, background-color linear .08s;
|
||||
transition: transform linear .08s, background-color linear .08s;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
#toggleButton.dragging {
|
||||
-webkit-transition: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
:host([checked]) #toggleButton {
|
||||
-webkit-transform: translate(16px, 0);
|
||||
transform: translate(16px, 0);
|
||||
}
|
||||
|
||||
:host([disabled]) #toggleButton {
|
||||
background-color: #bdbdbd;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#ink {
|
||||
position: absolute;
|
||||
top: -14px;
|
||||
left: -14px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
174
dashboard-ui/bower_components/paper-toggle-button/paper-toggle-button.html
vendored
Normal file
174
dashboard-ui/bower_components/paper-toggle-button/paper-toggle-button.html
vendored
Normal file
@ -0,0 +1,174 @@
|
||||
<!--
|
||||
@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/color.html">
|
||||
<link rel="import" href="../paper-styles/default-theme.html">
|
||||
<link rel="import" href="../paper-ripple/paper-ripple.html">
|
||||
<link rel="import" href="../paper-behaviors/paper-inky-focus-behavior.html">
|
||||
|
||||
<!--
|
||||
`paper-toggle-button` provides a ON/OFF switch that user can toggle the state
|
||||
by tapping or by dragging the switch.
|
||||
|
||||
Example:
|
||||
|
||||
<paper-toggle-button></paper-toggle-button>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-toggle-button-unchecked-bar-color` | Slider color when the input is not checked | `#000000`
|
||||
`--paper-toggle-button-unchecked-button-color` | Button color when the input is not checked | `--paper-grey-50`
|
||||
`--paper-toggle-button-unchecked-ink-color` | Selected/focus ripple color when the input is not checked | `--dark-primary-color`
|
||||
`--paper-toggle-button-checked-bar-color` | Slider button color when the input is checked | `--google-green-500`
|
||||
`--paper-toggle-button-checked-button-color` | Button color when the input is checked | `--google-green-500`
|
||||
`--paper-toggle-button-checked-ink-color` | Selected/focus ripple color when the input is checked | `--google-green-500`
|
||||
|
||||
@group Paper Elements
|
||||
@element paper-toggle-button
|
||||
@hero hero.svg
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="paper-toggle-button">
|
||||
|
||||
<link rel="import" type="css" href="paper-toggle-button.css">
|
||||
|
||||
<template>
|
||||
|
||||
<div id="toggleContainer">
|
||||
<div id="toggleBar" class="toggle-bar"></div>
|
||||
<div id="toggleButton" class="toggle-button">
|
||||
<paper-ripple id="ink" class="toggle-ink circle" recenters></paper-ripple>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-toggle-button',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperInkyFocusBehavior
|
||||
],
|
||||
|
||||
hostAttributes: {
|
||||
role: 'button',
|
||||
'aria-pressed': 'false',
|
||||
tabindex: 0
|
||||
},
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* Fired when the checked state changes due to user interaction.
|
||||
*
|
||||
* @event change
|
||||
*/
|
||||
/**
|
||||
* Fired when the checked state changes.
|
||||
*
|
||||
* @event iron-change
|
||||
*/
|
||||
/**
|
||||
* Gets or sets the state, `true` is checked and `false` is unchecked.
|
||||
*
|
||||
* @attribute checked
|
||||
* @type boolean
|
||||
* @default false
|
||||
*/
|
||||
checked: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
reflectToAttribute: true,
|
||||
notify: true,
|
||||
observer: '_checkedChanged'
|
||||
},
|
||||
|
||||
/**
|
||||
* If true, the button toggles the active state with each tap or press
|
||||
* of the spacebar.
|
||||
*
|
||||
* @attribute toggles
|
||||
* @type boolean
|
||||
* @default true
|
||||
*/
|
||||
toggles: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
reflectToAttribute: true
|
||||
}
|
||||
},
|
||||
|
||||
listeners: {
|
||||
track: '_ontrack'
|
||||
},
|
||||
|
||||
ready: function() {
|
||||
this._isReady = true;
|
||||
},
|
||||
|
||||
// button-behavior hook
|
||||
_buttonStateChanged: function() {
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
if (this._isReady) {
|
||||
this.checked = this.active;
|
||||
}
|
||||
},
|
||||
|
||||
_checkedChanged: function(checked) {
|
||||
this.active = this.checked;
|
||||
this.fire('iron-change');
|
||||
},
|
||||
|
||||
_ontrack: function(event) {
|
||||
var track = event.detail;
|
||||
if (track.state === 'start') {
|
||||
this._trackStart(track);
|
||||
} else if (track.state === 'track') {
|
||||
this._trackMove(track);
|
||||
} else if (track.state === 'end') {
|
||||
this._trackEnd(track);
|
||||
}
|
||||
},
|
||||
|
||||
_trackStart: function(track) {
|
||||
this._width = this.$.toggleBar.offsetWidth / 2;
|
||||
/*
|
||||
* keep an track-only check state to keep the dragging behavior smooth
|
||||
* while toggling activations
|
||||
*/
|
||||
this._trackChecked = this.checked;
|
||||
this.$.toggleButton.classList.add('dragging');
|
||||
},
|
||||
|
||||
_trackMove: function(track) {
|
||||
var dx = track.dx;
|
||||
this._x = Math.min(this._width,
|
||||
Math.max(0, this._trackChecked ? this._width + dx : dx));
|
||||
this.translate3d(this._x + 'px', 0, 0, this.$.toggleButton);
|
||||
this._userActivate(this._x > (this._width / 2));
|
||||
},
|
||||
|
||||
_trackEnd: function(track) {
|
||||
this.$.toggleButton.classList.remove('dragging');
|
||||
this.transform('', this.$.toggleButton);
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
</dom-module>
|
||||
86
dashboard-ui/bower_components/paper-toggle-button/test/basic.html
vendored
Normal file
86
dashboard-ui/bower_components/paper-toggle-button/test/basic.html
vendored
Normal file
@ -0,0 +1,86 @@
|
||||
<!doctype 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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>paper-toggle-button basic tests</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../test-fixture/test-fixture-mocha.js"></script>
|
||||
<script src="../../iron-test-helpers/mock-interactions.js"></script>
|
||||
|
||||
<link rel="import" href="../../test-fixture/test-fixture.html">
|
||||
<link rel="import" href="../paper-toggle-button.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="Basic">
|
||||
<template>
|
||||
<paper-toggle-button id="button"></paper-toggle-button>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
suite('defaults', function() {
|
||||
var b1;
|
||||
|
||||
setup(function() {
|
||||
b1 = fixture('Basic');
|
||||
});
|
||||
|
||||
test('check button via click', function() {
|
||||
b1.addEventListener('click', function() {
|
||||
assert.isTrue(b1.getAttribute('aria-checked'));
|
||||
assert.isTrue(b1.checked);
|
||||
done();
|
||||
});
|
||||
MockInteractions.down(b1);
|
||||
});
|
||||
|
||||
test('toggle button via click', function() {
|
||||
b1.checked = true;
|
||||
b1.addEventListener('click', function() {
|
||||
assert.isFalse(b1.getAttribute('aria-checked'));
|
||||
assert.isFalse(b1.checked);
|
||||
done();
|
||||
});
|
||||
MockInteractions.down(b1);
|
||||
});
|
||||
|
||||
test('disabled button cannot be clicked', function() {
|
||||
b1.disabled = true;
|
||||
b1.addEventListener('click', function() {
|
||||
assert.isTrue(b1.getAttribute('aria-checked'));
|
||||
assert.isTrue(b1.checked);
|
||||
done();
|
||||
});
|
||||
MockInteractions.down(b1);
|
||||
});
|
||||
});
|
||||
|
||||
suite('a11y', function() {
|
||||
var b1;
|
||||
|
||||
setup(function() {
|
||||
b1 = fixture('Basic');
|
||||
});
|
||||
|
||||
test('has aria role "button"', function() {
|
||||
console.log(b1.getAttribute('role'));
|
||||
assert.isTrue(b1.getAttribute('role') == 'button');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
25
dashboard-ui/bower_components/paper-toggle-button/test/index.html
vendored
Normal file
25
dashboard-ui/bower_components/paper-toggle-button/test/index.html
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
<!doctype 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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>paper-toggle-button tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'basic.html'
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -657,6 +657,11 @@ h1 .imageLink {
|
||||
white-space: normal !important;
|
||||
}
|
||||
|
||||
.paperCheckboxFieldDescription {
|
||||
padding-left: 30px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.warningFieldDescription {
|
||||
padding: 5px;
|
||||
border: 1px solid #f4c63f;
|
||||
|
||||
@ -26,14 +26,10 @@
|
||||
<form class="formLogin">
|
||||
<div>
|
||||
<div>
|
||||
<br />
|
||||
<label for="txtUser">${LabelUsername}</label>
|
||||
<input type="text" id="txtUser" required="required" autocomplete="off" />
|
||||
<paper-input class="txtUser" label="${LabelUsername}" required="required" autocomplete="off"></paper-input>
|
||||
</div>
|
||||
<div>
|
||||
<br />
|
||||
<label for="txtPass">${LabelPassword}</label>
|
||||
<input type="password" id="txtPass" required="required" autocomplete="off" />
|
||||
<paper-input class="txtPass" label="${LabelPassword}" required="required" autocomplete="off" type="password"></paper-input>
|
||||
</div>
|
||||
<div>
|
||||
<button type="submit" data-role="none" class="clearButton">
|
||||
@ -60,9 +56,7 @@
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<br />
|
||||
<label for="txtZipCode">${LabelZipCode}</label>
|
||||
<input type="text" id="txtZipCode" required="required" />
|
||||
<paper-input class="txtZipCode" label="${LabelZipCode}" required="required"></paper-input>
|
||||
</div>
|
||||
<div>
|
||||
<br />
|
||||
|
||||
@ -22,15 +22,12 @@
|
||||
<form>
|
||||
<div>
|
||||
<div>
|
||||
<br />
|
||||
<label for="txtDevicePath">${LabelTunerIpAddress}</label>
|
||||
<input type="text" id="txtDevicePath" required="required" />
|
||||
<paper-input class="txtDevicePath" label="${LabelPath}" required="required"></paper-input>
|
||||
</div>
|
||||
<div>
|
||||
<br />
|
||||
<label for="chkFavorite">${LabelImportOnlyFavoriteChannels}</label>
|
||||
<input type="checkbox" id="chkFavorite" data-mini="true" />
|
||||
<div class="fieldDescription">${ImportFavoriteChannelsHelp}</div>
|
||||
<paper-checkbox class="chkFavorite">${LabelImportOnlyFavoriteChannels}</paper-checkbox>
|
||||
<div class="fieldDescription paperCheckboxFieldDescription">${ImportFavoriteChannelsHelp}</div>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
|
||||
@ -22,9 +22,7 @@
|
||||
<form>
|
||||
<div>
|
||||
<div>
|
||||
<br />
|
||||
<label for="txtDevicePath">${LabelPath}</label>
|
||||
<input type="text" id="txtDevicePath" required="required" />
|
||||
<paper-input class="txtDevicePath" label="${LabelPath}" required="required"></paper-input>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
|
||||
@ -13,8 +13,10 @@
|
||||
listingsId = info.ListingsId;
|
||||
$('#selectListing', page).val(info.ListingsId || '').selectmenu('refresh');
|
||||
$('#selectCountry', page).val(info.Country || '').selectmenu('refresh');
|
||||
$('#txtZipCode', page).val(info.ZipCode || '').trigger('change');
|
||||
$('#txtUser', page).val(info.Username || '');
|
||||
page.querySelector('.txtZipCode').value = info.ZipCode || '';
|
||||
$(page.querySelector('.txtZipCode')).trigger('change');
|
||||
page.querySelector('.txtUser').value = info.Username || '';
|
||||
page.querySelector('.txtPass').value = info.Username || '';
|
||||
|
||||
});
|
||||
}
|
||||
@ -25,8 +27,8 @@
|
||||
|
||||
var info = {
|
||||
Type: 'SchedulesDirect',
|
||||
Username: $('#txtUser', page).val(),
|
||||
Password: CryptoJS.SHA1($('#txtPass', page).val()).toString()
|
||||
Username: page.querySelector('.txtUser').value,
|
||||
Password: CryptoJS.SHA1(page.querySelector('.txtPass').value).toString()
|
||||
};
|
||||
|
||||
var providerId = getParameterByName('id');
|
||||
@ -79,7 +81,7 @@
|
||||
return i.Id == id;
|
||||
})[0];
|
||||
|
||||
info.ZipCode = $('#txtZipCode', page).val();
|
||||
info.ZipCode = page.querySelector('.txtZipCode').value;
|
||||
info.Country = $('#selectCountry', page).val();
|
||||
info.ListingsId = selectedListingsId;
|
||||
|
||||
@ -164,7 +166,7 @@
|
||||
return false;
|
||||
});
|
||||
|
||||
$('#txtZipCode', page).on('change', function () {
|
||||
$('.txtZipCode', page).on('change', function () {
|
||||
refreshListings(page, this.value);
|
||||
});
|
||||
|
||||
|
||||
@ -2,8 +2,8 @@
|
||||
|
||||
function reload(page, providerId) {
|
||||
|
||||
$('#txtDevicePath', page).val('');
|
||||
$('#chkFavorite', page).checked(false).checkboxradio('refresh');
|
||||
page.querySelector('.txtDevicePath').value = '';
|
||||
page.querySelector('.chkFavorite').checked = false;
|
||||
|
||||
if (providerId) {
|
||||
ApiClient.getNamedConfiguration("livetv").done(function (config) {
|
||||
@ -12,8 +12,8 @@
|
||||
return i.Id == providerId;
|
||||
})[0];
|
||||
|
||||
$('#txtDevicePath', page).val(info.Url || '');
|
||||
$('#chkFavorite', page).checked(info.ImportFavoritesOnly).checkboxradio('refresh');
|
||||
page.querySelector('.txtDevicePath').value = info.Url || '';
|
||||
page.querySelector('.chkFavorite').checked = info.ImportFavoritesOnly;
|
||||
|
||||
});
|
||||
}
|
||||
@ -25,8 +25,8 @@
|
||||
|
||||
var info = {
|
||||
Type: 'hdhomerun',
|
||||
Url: $('#txtDevicePath', page).val(),
|
||||
ImportFavoritesOnly: $('#chkFavorite', page).checked()
|
||||
Url: page.querySelector('.txtDevicePath').value,
|
||||
ImportFavoritesOnly: page.querySelector('.chkFavorite').checked
|
||||
};
|
||||
|
||||
var id = getParameterByName('id');
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
function reload(page, providerId) {
|
||||
|
||||
$('#txtDevicePath', page).val('');
|
||||
page.querySelector('.txtDevicePath').value = '';
|
||||
|
||||
if (providerId) {
|
||||
ApiClient.getNamedConfiguration("livetv").done(function (config) {
|
||||
@ -11,7 +11,7 @@
|
||||
return i.Id == providerId;
|
||||
})[0];
|
||||
|
||||
$('#txtDevicePath', page).val(info.Url || '');
|
||||
page.querySelector('.txtDevicePath').value = info.Url || '';
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -22,8 +22,7 @@
|
||||
|
||||
var info = {
|
||||
Type: 'm3u',
|
||||
Url: $('#txtDevicePath', page).val(),
|
||||
ImportFavoritesOnly: $('#chkFavorite', page).checked()
|
||||
Url: page.querySelector('.txtDevicePath').value
|
||||
};
|
||||
|
||||
var id = getParameterByName('id');
|
||||
|
||||
@ -18,4 +18,5 @@
|
||||
<link rel="import" href="bower_components/paper-slider/paper-slider.html">
|
||||
<link rel="import" href="bower_components/paper-menu/paper-menu.html">
|
||||
<link rel="import" href="bower_components/paper-input/paper-input.html">
|
||||
<link rel="import" href="bower_components/paper-checkbox/paper-checkbox.html">
|
||||
<link rel="import" href="thirdparty/emby-icons.html">
|
||||
@ -12314,6 +12314,8 @@ is separate from validation, and `allowed-pattern` does not affect how the input
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</head><body><div hidden="" by-vulcanize=""><dom-module id="paper-material" assetpath="bower_components/paper-material/">
|
||||
<style>
|
||||
:host {
|
||||
@ -15855,11 +15857,33 @@ iron-selector:not(.narrow-layout) #main ::content [paper-drawer-toggle] {
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
:host(.transiting) #activeProgress,
|
||||
:host(.transiting) #secondaryProgress {
|
||||
-webkit-transition-property: -webkit-transform;
|
||||
transition-property: transform;
|
||||
|
||||
/* Duration */
|
||||
-webkit-transition-duration: var(--paper-progress-transition-duration, 0.08s);
|
||||
transition-duration: var(--paper-progress-transition-duration, 0.08s);
|
||||
|
||||
/* Timing function */
|
||||
-webkit-transition-timing-function: var(--paper-progress-transition-timing-function, ease);
|
||||
transition-timing-function: var(--paper-progress-transition-timing-function, ease);
|
||||
|
||||
/* Delay */
|
||||
-webkit-transition-delay: var(--paper-progress-transition-delay, 0s);
|
||||
transition-delay: var(--paper-progress-transition-delay, 0s);
|
||||
}
|
||||
|
||||
#progressContainer {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
background-color: var(--paper-progress-container-color, --google-grey-300);
|
||||
overflow: hidden;
|
||||
@apply(--paper-progress-container);
|
||||
}
|
||||
|
||||
#progressContainer, #indeterminateSplitter {
|
||||
background-color: var(--paper-progress-container-color, --google-grey-300);
|
||||
}
|
||||
|
||||
#activeProgress,
|
||||
@ -15878,34 +15902,86 @@ iron-selector:not(.narrow-layout) #main ::content [paper-drawer-toggle] {
|
||||
background-color: var(--paper-progress-secondary-color, --google-green-100);
|
||||
}
|
||||
|
||||
#indeterminateSplitter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#activeProgress.indeterminate {
|
||||
-webkit-transform-origin: right center;
|
||||
transform-origin: right center;
|
||||
-webkit-animation: indeterminate-bar 2s linear infinite;
|
||||
animation: indeterminate-bar 2s linear infinite;
|
||||
}
|
||||
|
||||
#indeterminateSplitter.indeterminate {
|
||||
display: block;
|
||||
-webkit-transform-origin: center center;
|
||||
transform-origin: center center;
|
||||
-webkit-animation: indeterminate-bar 1s linear infinite;
|
||||
animation: indeterminate-bar 1s linear infinite;
|
||||
-webkit-animation: indeterminate-splitter 2s linear infinite;
|
||||
animation: indeterminate-splitter 2s linear infinite;
|
||||
}
|
||||
|
||||
@-webkit-keyframes indeterminate-bar {
|
||||
0% {
|
||||
-webkit-transform: translate(-50%) scaleX(0);
|
||||
-webkit-transform: scaleX(1) translateX(-100%);
|
||||
}
|
||||
50% {
|
||||
-webkit-transform: translate(0%) scaleX(0.3);
|
||||
-webkit-transform: scaleX(1) translateX(0%);
|
||||
}
|
||||
75% {
|
||||
-webkit-transform: scaleX(1) translateX(0%);
|
||||
-webkit-animation-timing-function: cubic-bezier(.28,.62,.37,.91);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translate(50%) scaleX(0);
|
||||
-webkit-transform: scaleX(0) translateX(0%);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes indeterminate-splitter {
|
||||
0% {
|
||||
-webkit-transform: scaleX(.75) translateX(-125%);
|
||||
}
|
||||
30% {
|
||||
-webkit-transform: scaleX(.75) translateX(-125%);
|
||||
-webkit-animation-timing-function: cubic-bezier(.42,0,.6,.8);
|
||||
}
|
||||
90% {
|
||||
-webkit-transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes indeterminate-bar {
|
||||
0% {
|
||||
transform: translate(-50%) scaleX(0);
|
||||
transform: scaleX(1) translateX(-100%);
|
||||
}
|
||||
50% {
|
||||
transform: translate(0%) scaleX(0.3);
|
||||
transform: scaleX(1) translateX(0%);
|
||||
}
|
||||
75% {
|
||||
transform: scaleX(1) translateX(0%);
|
||||
animation-timing-function: cubic-bezier(.28,.62,.37,.91);
|
||||
}
|
||||
100% {
|
||||
transform: translate(50%) scaleX(0);
|
||||
transform: scaleX(0) translateX(0%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes indeterminate-splitter {
|
||||
0% {
|
||||
transform: scaleX(.75) translateX(-125%);
|
||||
}
|
||||
30% {
|
||||
transform: scaleX(.75) translateX(-125%);
|
||||
animation-timing-function: cubic-bezier(.42,0,.6,.8);
|
||||
}
|
||||
90% {
|
||||
transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
100% {
|
||||
transform: scaleX(.75) translateX(125%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -15913,6 +15989,7 @@ iron-selector:not(.narrow-layout) #main ::content [paper-drawer-toggle] {
|
||||
<div id="progressContainer" role="progressbar" aria-valuenow$="{{value}}" aria-valuemin$="{{min}}" aria-valuemax$="{{max}}">
|
||||
<div id="secondaryProgress" class="fit"></div>
|
||||
<div id="activeProgress" class="fit"></div>
|
||||
<div id="indeterminateSplitter" class="fit"></div>
|
||||
</div>
|
||||
</template>
|
||||
</dom-module>
|
||||
@ -15967,6 +16044,7 @@ iron-selector:not(.narrow-layout) #main ::content [paper-drawer-toggle] {
|
||||
// If we use attribute/class binding, the animation sometimes doesn't translate properly
|
||||
// on Safari 7.1. So instead, we toggle the class here in the update method.
|
||||
this.toggleClass('indeterminate', this.indeterminate, this.$.activeProgress);
|
||||
this.toggleClass('indeterminate', this.indeterminate, this.$.indeterminateSplitter);
|
||||
},
|
||||
|
||||
_transformProgress: function(progress, ratio) {
|
||||
@ -17374,6 +17452,266 @@ paper-ripple {
|
||||
})();
|
||||
|
||||
</script>
|
||||
<dom-module id="paper-checkbox" assetpath="bower_components/paper-checkbox/">
|
||||
<style>
|
||||
/*
|
||||
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
|
||||
*/
|
||||
|
||||
:host {
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
:host(:focus) {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#checkboxContainer {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
vertical-align: middle;
|
||||
background-color: var(--paper-checkbox-unchecked-background-color, transparent);
|
||||
}
|
||||
|
||||
:host #ink {
|
||||
position: absolute;
|
||||
top: -15px;
|
||||
left: -15px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
color: var(--paper-checkbox-unchecked-ink-color, --primary-text-color);
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host #ink[checked] {
|
||||
color: var(--paper-checkbox-checked-ink-color, --default-primary-color);
|
||||
}
|
||||
|
||||
:host #checkbox {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
border: solid 2px;
|
||||
border-color: var(--paper-checkbox-unchecked-color, --primary-text-color);
|
||||
border-radius: 2px;
|
||||
pointer-events: none;
|
||||
-webkit-transition: background-color 140ms, border-color 140ms;
|
||||
transition: background-color 140ms, border-color 140ms;
|
||||
}
|
||||
|
||||
/* checkbox checked animations */
|
||||
#checkbox.checked #checkmark {
|
||||
-webkit-animation: checkmark-expand 140ms ease-out forwards;
|
||||
animation: checkmark-expand 140ms ease-out forwards;
|
||||
}
|
||||
|
||||
@-webkit-keyframes checkmark-expand {
|
||||
0% {
|
||||
top: 9px;
|
||||
left: 6px;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
100% {
|
||||
top: -1px;
|
||||
left: 4px;
|
||||
width: 5px;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes checkmark-expand {
|
||||
0% {
|
||||
top: 9px;
|
||||
left: 6px;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
100% {
|
||||
top: -1px;
|
||||
left: 4px;
|
||||
width: 5px;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
:host #checkbox.checked {
|
||||
background-color: var(--paper-checkbox-checked-color, --default-primary-color);
|
||||
border-color: var(--paper-checkbox-checked-color, --default-primary-color);
|
||||
}
|
||||
|
||||
:host #checkmark {
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: 4px;
|
||||
width: 5px;
|
||||
height: 10px;
|
||||
border-style: solid;
|
||||
border-top: none;
|
||||
border-left: none;
|
||||
border-right-width: 2px;
|
||||
border-bottom-width: 2px;
|
||||
border-color: var(--paper-checkbox-checkmark-color, white);
|
||||
}
|
||||
|
||||
/* label */
|
||||
#checkboxLabel {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
padding-left: 8px;
|
||||
white-space: normal;
|
||||
pointer-events: none;
|
||||
color: var(--paper-checkbox-label-color, --primary-text-color);
|
||||
}
|
||||
|
||||
#checkboxLabel[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* disabled state */
|
||||
:host([disabled]) {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
:host([disabled]) #checkbox {
|
||||
opacity: 0.5;
|
||||
border-color: var(--paper-checkbox-unchecked-color, --primary-text-color);
|
||||
}
|
||||
|
||||
:host([disabled][checked]) #checkbox {
|
||||
background-color: var(--paper-checkbox-unchecked-color, --primary-text-color);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
:host([disabled]) #checkboxLabel {
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<template>
|
||||
|
||||
<div id="checkboxContainer">
|
||||
<paper-ripple id="ink" class="circle" center="" checked$="[[checked]]"></paper-ripple>
|
||||
<div id="checkbox" class$="[[_computeCheckboxClass(checked)]]">
|
||||
<div id="checkmark" class$="[[_computeCheckmarkClass(checked)]]"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="checkboxLabel" aria-hidden="true"><content></content></div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'paper-checkbox',
|
||||
|
||||
behaviors: [
|
||||
Polymer.PaperInkyFocusBehavior
|
||||
],
|
||||
|
||||
hostAttributes: {
|
||||
role: 'checkbox',
|
||||
'aria-checked': false,
|
||||
tabindex: 0
|
||||
},
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* Fired when the checked state changes due to user interaction.
|
||||
*
|
||||
* @event change
|
||||
*/
|
||||
|
||||
/**
|
||||
* Fired when the checked state changes.
|
||||
*
|
||||
* @event iron-change
|
||||
*/
|
||||
|
||||
/**
|
||||
* Gets or sets the state, `true` is checked and `false` is unchecked.
|
||||
*/
|
||||
checked: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
reflectToAttribute: true,
|
||||
notify: true,
|
||||
observer: '_checkedChanged'
|
||||
},
|
||||
|
||||
/**
|
||||
* If true, the button toggles the active state with each tap or press
|
||||
* of the spacebar.
|
||||
*/
|
||||
toggles: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
reflectToAttribute: true
|
||||
}
|
||||
},
|
||||
|
||||
ready: function() {
|
||||
if (Polymer.dom(this).textContent == '') {
|
||||
this.$.checkboxLabel.hidden = true;
|
||||
} else {
|
||||
this.setAttribute('aria-label', Polymer.dom(this).textContent);
|
||||
}
|
||||
this._isReady = true;
|
||||
},
|
||||
|
||||
// button-behavior hook
|
||||
_buttonStateChanged: function() {
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
if (this._isReady) {
|
||||
this.checked = this.active;
|
||||
}
|
||||
},
|
||||
|
||||
_checkedChanged: function(checked) {
|
||||
this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
|
||||
this.active = this.checked;
|
||||
this.fire('iron-change');
|
||||
},
|
||||
|
||||
_computeCheckboxClass: function(checked) {
|
||||
if (checked) {
|
||||
return 'checked';
|
||||
}
|
||||
return '';
|
||||
},
|
||||
|
||||
_computeCheckmarkClass: function(checked) {
|
||||
if (!checked) {
|
||||
return 'hidden';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
</dom-module>
|
||||
<iron-iconset-svg name="icons" size="24">
|
||||
<svg>
|
||||
<defs>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user