mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update translations
This commit is contained in:
Luke Pulverenti
parent
d65219f9f8
commit
dbf135beac
114 changed files with 3331 additions and 93 deletions
47
dashboard-ui/bower_components/iron-dropdown/.bower.json
vendored
Normal file
47
dashboard-ui/bower_components/iron-dropdown/.bower.json
vendored
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
{
|
||||
"name": "iron-dropdown",
|
||||
"version": "1.0.4",
|
||||
"description": "",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"web-component",
|
||||
"polymer"
|
||||
],
|
||||
"main": "iron-dropdown.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-dropdown"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/iron-dropdown",
|
||||
"dependencies": {
|
||||
"polymer": "polymer/polymer#^1.0.0",
|
||||
"iron-behaviors": "polymerelements/iron-behaviors#^1.0.0",
|
||||
"iron-overlay-behavior": "polymerelements/iron-overlay-behavior#^1.0.0",
|
||||
"iron-resizable-behavior": "polymerelements/iron-resizable-behavior#^1.0.0",
|
||||
"neon-animation": "polymerelements/neon-animation#^1.0.0",
|
||||
"iron-a11y-keys-behavior": "polymerelements/iron-a11y-keys-behavior#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"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",
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"web-component-tester": "*",
|
||||
"iron-image": "polymerelements/iron-image#^1.0.0"
|
||||
},
|
||||
"_release": "1.0.4",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.4",
|
||||
"commit": "9a09e5ed5a4c6ee9643caba74022a01135c7878b"
|
||||
},
|
||||
"_source": "git://github.com/polymerelements/iron-dropdown.git",
|
||||
"_target": "^1.0.0",
|
||||
"_originalSource": "polymerelements/iron-dropdown"
|
||||
}
|
||||
1
dashboard-ui/bower_components/iron-dropdown/.gitignore
vendored
Normal file
1
dashboard-ui/bower_components/iron-dropdown/.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
bower_components
|
||||
38
dashboard-ui/bower_components/iron-dropdown/bower.json
vendored
Normal file
38
dashboard-ui/bower_components/iron-dropdown/bower.json
vendored
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
{
|
||||
"name": "iron-dropdown",
|
||||
"version": "1.0.4",
|
||||
"description": "",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"web-component",
|
||||
"polymer"
|
||||
],
|
||||
"main": "iron-dropdown.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/iron-dropdown"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/iron-dropdown",
|
||||
"dependencies": {
|
||||
"polymer": "polymer/polymer#^1.0.0",
|
||||
"iron-behaviors": "polymerelements/iron-behaviors#^1.0.0",
|
||||
"iron-overlay-behavior": "polymerelements/iron-overlay-behavior#^1.0.0",
|
||||
"iron-resizable-behavior": "polymerelements/iron-resizable-behavior#^1.0.0",
|
||||
"neon-animation": "polymerelements/neon-animation#^1.0.0",
|
||||
"iron-a11y-keys-behavior": "polymerelements/iron-a11y-keys-behavior#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"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",
|
||||
"paper-styles": "polymerelements/paper-styles#^1.0.0",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
|
||||
"web-component-tester": "*",
|
||||
"iron-image": "polymerelements/iron-image#^1.0.0"
|
||||
}
|
||||
}
|
||||
36
dashboard-ui/bower_components/iron-dropdown/demo/grow-height-animation.html
vendored
Normal file
36
dashboard-ui/bower_components/iron-dropdown/demo/grow-height-animation.html
vendored
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
<!--
|
||||
@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="../../neon-animation/neon-animation-behavior.html">
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'expand-animation',
|
||||
|
||||
behaviors: [
|
||||
Polymer.NeonAnimationBehavior
|
||||
],
|
||||
|
||||
configure: function(config) {
|
||||
var node = config.node;
|
||||
|
||||
var height = node.getBoundingClientRect().height;
|
||||
|
||||
this._effect = new KeyframeEffect(node, [{
|
||||
height: (height / 2) + 'px'
|
||||
}, {
|
||||
height: height + 'px'
|
||||
}], this.timingFromConfig(config));
|
||||
|
||||
return this._effect;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
163
dashboard-ui/bower_components/iron-dropdown/demo/index.html
vendored
Normal file
163
dashboard-ui/bower_components/iron-dropdown/demo/index.html
vendored
Normal file
|
|
@ -0,0 +1,163 @@
|
|||
<!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>iron-dropdown</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
<link rel="import" href="../../iron-image/iron-image.html">
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
<link rel="import" href="x-select.html">
|
||||
<style>
|
||||
|
||||
ul {
|
||||
display: block;
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 2px 6px #ccc;
|
||||
margin: 0.25em 0;
|
||||
padding: 0.25em;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
[vertical-align="top"] ul {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
[vertical-align="bottom"] ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
display: block;
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 1em;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
li:not(:last-of-type) {
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
button {
|
||||
border: 1px solid #ccc;
|
||||
background-color: #eee;
|
||||
padding: 1em;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
outline: none;
|
||||
border-color: blue;
|
||||
}
|
||||
|
||||
iron-image {
|
||||
padding: 1em;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 2px 6px #ccc;
|
||||
border-radius: 3px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<template is="dom-bind" id="Demo">
|
||||
<div class="horizontal-section flex layout horizontal">
|
||||
<x-select>
|
||||
<button class="dropdown-trigger">Basic</button>
|
||||
<ul class="dropdown-content">
|
||||
<template is="dom-repeat" items="[[letters]]">
|
||||
<li><a href="javascript:void(0)">[[item]]</a></li>
|
||||
</template>
|
||||
</ul>
|
||||
</x-select>
|
||||
<x-select>
|
||||
<button class="dropdown-trigger">Overflowing</button>
|
||||
<ul class="dropdown-content" tabindex="0">
|
||||
<template is="dom-repeat" items="[[dinosaurs]]">
|
||||
<li><a href="javascript:void(0)">[[item]]</a></li>
|
||||
</template>
|
||||
</ul>
|
||||
</x-select>
|
||||
<x-select vertical-align="bottom">
|
||||
<button class="dropdown-trigger">Bottom-left Aligned</button>
|
||||
<ul class="dropdown-content">
|
||||
<template is="dom-repeat" items="[[letters]]">
|
||||
<li><a href="javascript:void(0)">[[item]]</a></li>
|
||||
</template>
|
||||
</ul>
|
||||
</x-select>
|
||||
<x-select horizontal-align="right" vertical-align="top">
|
||||
<button class="dropdown-trigger">Top-right Aligned</button>
|
||||
<ul class="dropdown-content">
|
||||
<template is="dom-repeat" items="[[dinosaurs]]">
|
||||
<li><a href="javascript:void(0)">[[item]]</a></li>
|
||||
</template>
|
||||
</ul>
|
||||
</x-select>
|
||||
<x-select horizontal-align="left" vertical-align="top">
|
||||
<button class="dropdown-trigger">Alternate Content</button>
|
||||
<iron-image class="dropdown-content" src="../../iron-image/demo/polymer.svg"></iron-image>
|
||||
</x-select>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Demo.letters = [
|
||||
'alpha',
|
||||
'beta',
|
||||
'gamma',
|
||||
'delta',
|
||||
'epsilon'
|
||||
];
|
||||
Demo.dinosaurs = [
|
||||
'allosaurus',
|
||||
'brontosaurus',
|
||||
'carcharodontosaurus',
|
||||
'diplodocus',
|
||||
'ekrixinatosaurus',
|
||||
'fukuiraptor',
|
||||
'gallimimus',
|
||||
'hadrosaurus',
|
||||
'iguanodon',
|
||||
'jainosaurus',
|
||||
'kritosaurus',
|
||||
'liaoceratops',
|
||||
'megalosaurus',
|
||||
'nemegtosaurus',
|
||||
'ornithomimus',
|
||||
'protoceratops',
|
||||
'quetecsaurus',
|
||||
'rajasaurus',
|
||||
'stegosaurus',
|
||||
'triceratops',
|
||||
'utahraptor',
|
||||
'vulcanodon',
|
||||
'wannanosaurus',
|
||||
'xenoceratops',
|
||||
'yandusaurus',
|
||||
'zephyrosaurus'
|
||||
];
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
80
dashboard-ui/bower_components/iron-dropdown/demo/x-select.html
vendored
Normal file
80
dashboard-ui/bower_components/iron-dropdown/demo/x-select.html
vendored
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
<!--
|
||||
@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="../iron-dropdown.html">
|
||||
<link rel="import" href="../../neon-animation/neon-animations.html">
|
||||
<link rel="import" href="grow-height-animation.html">
|
||||
|
||||
<dom-module id="x-select">
|
||||
<style>
|
||||
:host {
|
||||
display: inline-block;
|
||||
margin: 1em;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<div on-tap="open">
|
||||
<content select=".dropdown-trigger"></content>
|
||||
</div>
|
||||
<iron-dropdown id="dropdown"
|
||||
vertical-align="[[verticalAlign]]"
|
||||
horizontal-align="[[horizontalAlign]]"
|
||||
disabled="[[disabled]]"
|
||||
open-animation-config="[[openAnimationConfig]]"
|
||||
close-animation-config="[[closeAnimationConfig]]">
|
||||
<content select=".dropdown-content"></content>
|
||||
</iron-dropdown>
|
||||
</template>
|
||||
<script>
|
||||
Polymer({
|
||||
is: 'x-select',
|
||||
|
||||
properties: {
|
||||
verticalAlign: String,
|
||||
horizontalAlign: String,
|
||||
disabled: Boolean,
|
||||
openAnimationConfig: {
|
||||
type: Array,
|
||||
value: function() {
|
||||
return [{
|
||||
name: 'fade-in-animation',
|
||||
timing: {
|
||||
delay: 150,
|
||||
duration: 50
|
||||
}
|
||||
}, {
|
||||
name: 'expand-animation',
|
||||
timing: {
|
||||
delay: 150,
|
||||
duration: 200
|
||||
}
|
||||
}];
|
||||
}
|
||||
},
|
||||
|
||||
closeAnimationConfig: {
|
||||
type: Array,
|
||||
value: function() {
|
||||
return [{
|
||||
name: 'fade-out-animation',
|
||||
timing: {
|
||||
duration: 200
|
||||
}
|
||||
}];
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
open: function() {
|
||||
this.$.dropdown.open();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</dom-module>
|
||||
24
dashboard-ui/bower_components/iron-dropdown/index.html
vendored
Normal file
24
dashboard-ui/bower_components/iron-dropdown/index.html
vendored
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
<!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>
|
||||
|
||||
<title>iron-dropdown</title>
|
||||
<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>
|
||||
222
dashboard-ui/bower_components/iron-dropdown/iron-dropdown-scroll-manager.html
vendored
Normal file
222
dashboard-ui/bower_components/iron-dropdown/iron-dropdown-scroll-manager.html
vendored
Normal file
|
|
@ -0,0 +1,222 @@
|
|||
<!--
|
||||
@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="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
/**
|
||||
* The IronDropdownScrollManager is intended to provide a central source
|
||||
* of authority and control over which elements in a document are currently
|
||||
* allowed to scroll.
|
||||
*/
|
||||
|
||||
Polymer.IronDropdownScrollManager = {
|
||||
|
||||
/**
|
||||
* The current element that defines the DOM boundaries of the
|
||||
* scroll lock. This is always the most recently locking element.
|
||||
*/
|
||||
get currentLockingElement() {
|
||||
return this._lockingElements[this._lockingElements.length - 1];
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Returns true if the provided element is "scroll locked," which is to
|
||||
* say that it cannot be scrolled via pointer or keyboard interactions.
|
||||
*
|
||||
* @param {HTMLElement} element An HTML element instance which may or may
|
||||
* not be scroll locked.
|
||||
*/
|
||||
elementIsScrollLocked: function(element) {
|
||||
var currentLockingElement = this.currentLockingElement;
|
||||
var scrollLocked;
|
||||
|
||||
if (this._hasCachedLockedElement(element)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (this._hasCachedUnlockedElement(element)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
scrollLocked = !!currentLockingElement &&
|
||||
currentLockingElement !== element &&
|
||||
!this._composedTreeContains(currentLockingElement, element);
|
||||
|
||||
if (scrollLocked) {
|
||||
this._lockedElementCache.push(element);
|
||||
} else {
|
||||
this._unlockedElementCache.push(element);
|
||||
}
|
||||
|
||||
return scrollLocked;
|
||||
},
|
||||
|
||||
/**
|
||||
* Push an element onto the current scroll lock stack. The most recently
|
||||
* pushed element and its children will be considered scrollable. All
|
||||
* other elements will not be scrollable.
|
||||
*
|
||||
* Scroll locking is implemented as a stack so that cases such as
|
||||
* dropdowns within dropdowns are handled well.
|
||||
*
|
||||
* @param {HTMLElement} element The element that should lock scroll.
|
||||
*/
|
||||
pushScrollLock: function(element) {
|
||||
if (this._lockingElements.length === 0) {
|
||||
this._lockScrollInteractions();
|
||||
}
|
||||
|
||||
this._lockingElements.push(element);
|
||||
|
||||
this._lockedElementCache = [];
|
||||
this._unlockedElementCache = [];
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove an element from the scroll lock stack. The element being
|
||||
* removed does not need to be the most recently pushed element. However,
|
||||
* the scroll lock constraints only change when the most recently pushed
|
||||
* element is removed.
|
||||
*
|
||||
* @param {HTMLElement} element The element to remove from the scroll
|
||||
* lock stack.
|
||||
*/
|
||||
removeScrollLock: function(element) {
|
||||
var index = this._lockingElements.indexOf(element);
|
||||
|
||||
if (index === -1) {
|
||||
return;
|
||||
}
|
||||
|
||||
this._lockingElements.splice(index, 1);
|
||||
|
||||
this._lockedElementCache = [];
|
||||
this._unlockedElementCache = [];
|
||||
|
||||
if (this._lockingElements.length === 0) {
|
||||
this._unlockScrollInteractions();
|
||||
}
|
||||
},
|
||||
|
||||
_lockingElements: [],
|
||||
|
||||
_lockedElementCache: null,
|
||||
|
||||
_unlockedElementCache: null,
|
||||
|
||||
_originalBodyStyles: {},
|
||||
|
||||
_isScrollingKeypress: function(event) {
|
||||
return Polymer.IronA11yKeysBehavior.keyboardEventMatchesKeys(
|
||||
event, 'pageup pagedown home end up left down right');
|
||||
},
|
||||
|
||||
_hasCachedLockedElement: function(element) {
|
||||
return this._lockedElementCache.indexOf(element) > -1;
|
||||
},
|
||||
|
||||
_hasCachedUnlockedElement: function(element) {
|
||||
return this._unlockedElementCache.indexOf(element) > -1;
|
||||
},
|
||||
|
||||
_composedTreeContains: function(element, child) {
|
||||
// NOTE(cdata): This method iterates over content elements and their
|
||||
// corresponding distributed nodes to implement a contains-like method
|
||||
// that pierces through the composed tree of the ShadowDOM. Results of
|
||||
// this operation are cached (elsewhere) on a per-scroll-lock basis, to
|
||||
// guard against potentially expensive lookups happening repeatedly as
|
||||
// a user scrolls / touchmoves.
|
||||
var contentElements;
|
||||
var distributedNodes;
|
||||
var contentIndex;
|
||||
var nodeIndex;
|
||||
|
||||
if (element.contains(child)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
contentElements = Polymer.dom(element).querySelectorAll('content');
|
||||
|
||||
for (contentIndex = 0; contentIndex < contentElements.length; ++contentIndex) {
|
||||
|
||||
distributedNodes = Polymer.dom(contentElements[contentIndex]).getDistributedNodes();
|
||||
|
||||
for (nodeIndex = 0; nodeIndex < distributedNodes.length; ++nodeIndex) {
|
||||
|
||||
if (this._composedTreeContains(distributedNodes[nodeIndex], child)) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_scrollInteractionHandler: function(event) {
|
||||
if (Polymer
|
||||
.IronDropdownScrollManager
|
||||
.elementIsScrollLocked(event.target)) {
|
||||
if (event.type === 'keydown' &&
|
||||
!Polymer.IronDropdownScrollManager._isScrollingKeypress(event)) {
|
||||
return;
|
||||
}
|
||||
|
||||
event.preventDefault();
|
||||
}
|
||||
},
|
||||
|
||||
_lockScrollInteractions: function() {
|
||||
// Memoize body inline styles:
|
||||
this._originalBodyStyles.overflow = document.body.style.overflow;
|
||||
this._originalBodyStyles.overflowX = document.body.style.overflowX;
|
||||
this._originalBodyStyles.overflowY = document.body.style.overflowY;
|
||||
|
||||
// Disable overflow scrolling on body:
|
||||
// TODO(cdata): It is technically not sufficient to hide overflow on
|
||||
// body alone. A better solution might be to traverse all ancestors of
|
||||
// the current scroll locking element and hide overflow on them. This
|
||||
// becomes expensive, though, as it would have to be redone every time
|
||||
// a new scroll locking element is added.
|
||||
document.body.style.overflow = 'hidden';
|
||||
document.body.style.overflowX = 'hidden';
|
||||
document.body.style.overflowY = 'hidden';
|
||||
|
||||
// Modern `wheel` event for mouse wheel scrolling:
|
||||
window.addEventListener('wheel', this._scrollInteractionHandler, true);
|
||||
// Older, non-standard `mousewheel` event for some FF:
|
||||
window.addEventListener('mousewheel', this._scrollInteractionHandler, true);
|
||||
// IE:
|
||||
window.addEventListener('DOMMouseScroll', this._scrollInteractionHandler, true);
|
||||
// Mobile devices can scroll on touch move:
|
||||
window.addEventListener('touchmove', this._scrollInteractionHandler, true);
|
||||
// Capture keydown to prevent scrolling keys (pageup, pagedown etc.)
|
||||
document.addEventListener('keydown', this._scrollInteractionHandler, true);
|
||||
},
|
||||
|
||||
_unlockScrollInteractions: function() {
|
||||
document.body.style.overflow = this._originalBodyStyles.overflow;
|
||||
document.body.style.overflowX = this._originalBodyStyles.overflowX;
|
||||
document.body.style.overflowY = this._originalBodyStyles.overflowY;
|
||||
|
||||
window.removeEventListener('wheel', this._scrollInteractionHandler, true);
|
||||
window.removeEventListener('mousewheel', this._scrollInteractionHandler, true);
|
||||
window.removeEventListener('DOMMouseScroll', this._scrollInteractionHandler, true);
|
||||
window.removeEventListener('touchmove', this._scrollInteractionHandler, true);
|
||||
document.removeEventListener('keydown', this._scrollInteractionHandler, true);
|
||||
}
|
||||
};
|
||||
})();
|
||||
</script>
|
||||
371
dashboard-ui/bower_components/iron-dropdown/iron-dropdown.html
vendored
Normal file
371
dashboard-ui/bower_components/iron-dropdown/iron-dropdown.html
vendored
Normal file
|
|
@ -0,0 +1,371 @@
|
|||
<!--
|
||||
@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="../iron-resizable-behavior/iron-resizable-behavior.html">
|
||||
<link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
|
||||
<link rel="import" href="../iron-behaviors/iron-control-state.html">
|
||||
<link rel="import" href="../iron-overlay-behavior/iron-overlay-behavior.html">
|
||||
<link rel="import" href="../neon-animation/neon-animation-runner-behavior.html">
|
||||
<link rel="import" href="../neon-animation/animations/opaque-animation.html">
|
||||
<link rel="import" href="iron-dropdown-scroll-manager.html">
|
||||
|
||||
<!--
|
||||
`<iron-dropdown>` is a generalized element that is useful when you have
|
||||
hidden content (`.dropdown-content`) that is revealed due to some change in
|
||||
state that should cause it to do so.
|
||||
|
||||
Note that this is a low-level element intended to be used as part of other
|
||||
composite elements that cause dropdowns to be revealed.
|
||||
|
||||
Examples of elements that might be implemented using an `iron-dropdown`
|
||||
include comboboxes, menubuttons, selects. The list goes on.
|
||||
|
||||
The `<iron-dropdown>` element exposes attributes that allow the position
|
||||
of the `.dropdown-content` relative to the `.dropdown-trigger` to be
|
||||
configured.
|
||||
|
||||
<iron-dropdown horizontal-align="right" vertical-align="top">
|
||||
<div class="dropdown-content">Hello!</div>
|
||||
</iron-dropdown>
|
||||
|
||||
In the above example, the `<div>` with class `.dropdown-content` will be
|
||||
hidden until the dropdown element has `opened` set to true, or when the `open`
|
||||
method is called on the element.
|
||||
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="iron-dropdown">
|
||||
<style>
|
||||
:host {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
#contentWrapper ::content > * {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#contentWrapper.animating ::content > * {
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<div id="contentWrapper">
|
||||
<content id="content" select=".dropdown-content"></content>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
Polymer({
|
||||
is: 'iron-dropdown',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronControlState,
|
||||
Polymer.IronA11yKeysBehavior,
|
||||
Polymer.IronOverlayBehavior,
|
||||
Polymer.NeonAnimationRunnerBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
/**
|
||||
* The orientation against which to align the dropdown content
|
||||
* horizontally relative to the dropdown trigger.
|
||||
*/
|
||||
horizontalAlign: {
|
||||
type: String,
|
||||
value: 'left',
|
||||
reflectToAttribute: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The orientation against which to align the dropdown content
|
||||
* vertically relative to the dropdown trigger.
|
||||
*/
|
||||
verticalAlign: {
|
||||
type: String,
|
||||
value: 'top',
|
||||
reflectToAttribute: true
|
||||
},
|
||||
|
||||
/**
|
||||
* A pixel value that will be added to the position calculated for the
|
||||
* given `horizontalAlign`. Use a negative value to offset to the
|
||||
* left, or a positive value to offset to the right.
|
||||
*/
|
||||
horizontalOffset: {
|
||||
type: Number,
|
||||
value: 0,
|
||||
notify: true
|
||||
},
|
||||
|
||||
/**
|
||||
* A pixel value that will be added to the position calculated for the
|
||||
* given `verticalAlign`. Use a negative value to offset towards the
|
||||
* top, or a positive value to offset towards the bottom.
|
||||
*/
|
||||
verticalOffset: {
|
||||
type: Number,
|
||||
value: 0,
|
||||
notify: true
|
||||
},
|
||||
|
||||
/**
|
||||
* The element that should be used to position the dropdown when
|
||||
* it is opened.
|
||||
*/
|
||||
positionTarget: {
|
||||
type: Object,
|
||||
observer: '_positionTargetChanged'
|
||||
},
|
||||
|
||||
/**
|
||||
* An animation config. If provided, this will be used to animate the
|
||||
* opening of the dropdown.
|
||||
*/
|
||||
openAnimationConfig: {
|
||||
type: Object
|
||||
},
|
||||
|
||||
/**
|
||||
* An animation config. If provided, this will be used to animate the
|
||||
* closing of the dropdown.
|
||||
*/
|
||||
closeAnimationConfig: {
|
||||
type: Object
|
||||
},
|
||||
|
||||
/**
|
||||
* Set to true to disable animations when opening and closing the
|
||||
* dropdown.
|
||||
*/
|
||||
noAnimations: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
},
|
||||
|
||||
/**
|
||||
* We memoize the positionTarget bounding rectangle so that we can
|
||||
* limit the number of times it is queried per resize / relayout.
|
||||
* @type {?Object}
|
||||
*/
|
||||
_positionRectMemo: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
|
||||
listeners: {
|
||||
'neon-animation-finish': '_onNeonAnimationFinish'
|
||||
},
|
||||
|
||||
observers: [
|
||||
'_updateOverlayPosition(verticalAlign, horizontalAlign, verticalOffset, horizontalOffset)'
|
||||
],
|
||||
|
||||
attached: function() {
|
||||
if (this.positionTarget === undefined) {
|
||||
this.positionTarget = this._defaultPositionTarget;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* The element that is contained by the dropdown, if any.
|
||||
*/
|
||||
get containedElement() {
|
||||
return Polymer.dom(this.$.content).getDistributedNodes()[0];
|
||||
},
|
||||
|
||||
get _defaultPositionTarget() {
|
||||
var parent = Polymer.dom(this).parentNode;
|
||||
|
||||
if (parent.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
|
||||
parent = parent.host;
|
||||
}
|
||||
|
||||
return parent;
|
||||
},
|
||||
|
||||
get _positionRect() {
|
||||
if (!this._positionRectMemo && this.positionTarget) {
|
||||
this._positionRectMemo = this.positionTarget.getBoundingClientRect();
|
||||
}
|
||||
|
||||
return this._positionRectMemo;
|
||||
},
|
||||
|
||||
get _horizontalAlignTargetValue() {
|
||||
var target;
|
||||
|
||||
if (this.horizontalAlign === 'right') {
|
||||
target = document.documentElement.clientWidth - this._positionRect.right;
|
||||
} else {
|
||||
target = this._positionRect.left;
|
||||
}
|
||||
|
||||
target += this.horizontalOffset;
|
||||
|
||||
return Math.max(target, 0);
|
||||
},
|
||||
|
||||
get _verticalAlignTargetValue() {
|
||||
var target;
|
||||
|
||||
if (this.verticalAlign === 'bottom') {
|
||||
target = document.documentElement.clientHeight - this._positionRect.bottom;
|
||||
} else {
|
||||
target = this._positionRect.top;
|
||||
}
|
||||
|
||||
target += this.verticalOffset;
|
||||
|
||||
return Math.max(target, 0);
|
||||
},
|
||||
|
||||
_openedChanged: function(opened) {
|
||||
if (opened && this.disabled) {
|
||||
this.cancel();
|
||||
} else {
|
||||
this._cancelAnimations();
|
||||
this._prepareDropdown();
|
||||
Polymer.IronOverlayBehaviorImpl._openedChanged.apply(this, arguments);
|
||||
}
|
||||
},
|
||||
|
||||
_renderOpened: function() {
|
||||
Polymer.IronDropdownScrollManager.pushScrollLock(this);
|
||||
if (!this.noAnimations && this.animationConfig && this.animationConfig.open) {
|
||||
this.$.contentWrapper.classList.add('animating');
|
||||
this.playAnimation('open');
|
||||
} else {
|
||||
this._focusContent();
|
||||
Polymer.IronOverlayBehaviorImpl._renderOpened.apply(this, arguments);
|
||||
}
|
||||
},
|
||||
|
||||
_renderClosed: function() {
|
||||
Polymer.IronDropdownScrollManager.removeScrollLock(this);
|
||||
if (!this.noAnimations && this.animationConfig && this.animationConfig.close) {
|
||||
this.$.contentWrapper.classList.add('animating');
|
||||
this.playAnimation('close');
|
||||
} else {
|
||||
Polymer.IronOverlayBehaviorImpl._renderClosed.apply(this, arguments);
|
||||
}
|
||||
},
|
||||
|
||||
_onNeonAnimationFinish: function() {
|
||||
this.$.contentWrapper.classList.remove('animating');
|
||||
if (this.opened) {
|
||||
Polymer.IronOverlayBehaviorImpl._renderOpened.apply(this);
|
||||
} else {
|
||||
Polymer.IronOverlayBehaviorImpl._renderClosed.apply(this);
|
||||
}
|
||||
},
|
||||
|
||||
_onIronResize: function() {
|
||||
var containedElement = this.containedElement;
|
||||
var scrollTop;
|
||||
var scrollLeft;
|
||||
|
||||
if (containedElement) {
|
||||
scrollTop = containedElement.scrollTop;
|
||||
scrollLeft = containedElement.scrollLeft;
|
||||
}
|
||||
|
||||
if (this.opened) {
|
||||
this._updateOverlayPosition();
|
||||
}
|
||||
|
||||
Polymer.IronOverlayBehaviorImpl._onIronResize.apply(this, arguments);
|
||||
|
||||
if (containedElement) {
|
||||
containedElement.scrollTop = scrollTop;
|
||||
containedElement.scrollLeft = scrollLeft;
|
||||
}
|
||||
},
|
||||
|
||||
_positionTargetChanged: function() {
|
||||
this._updateOverlayPosition();
|
||||
},
|
||||
|
||||
_cancelAnimations: function() {
|
||||
this.cancelAnimation();
|
||||
},
|
||||
|
||||
_updateAnimationConfig: function() {
|
||||
var animationConfig = {};
|
||||
var animations = [];
|
||||
|
||||
if (this.openAnimationConfig) {
|
||||
// NOTE(cdata): When making `display:none` elements visible in Safari,
|
||||
// the element will paint once in a fully visible state, causing the
|
||||
// dropdown to flash before it fades in. We prepend an
|
||||
// `opaque-animation` to fix this problem:
|
||||
animationConfig.open = [{
|
||||
name: 'opaque-animation',
|
||||
}].concat(this.openAnimationConfig);
|
||||
animations = animations.concat(animationConfig.open);
|
||||
}
|
||||
|
||||
if (this.closeAnimationConfig) {
|
||||
animationConfig.close = this.closeAnimationConfig;
|
||||
animations = animations.concat(animationConfig.close);
|
||||
}
|
||||
|
||||
animations.forEach(function(animation) {
|
||||
animation.node = this.containedElement;
|
||||
}, this);
|
||||
|
||||
this.animationConfig = animationConfig;
|
||||
},
|
||||
|
||||
_prepareDropdown: function() {
|
||||
this.sizingTarget = this.containedElement || this.sizingTarget;
|
||||
this._updateAnimationConfig();
|
||||
this._updateOverlayPosition();
|
||||
},
|
||||
|
||||
_updateOverlayPosition: function() {
|
||||
this._positionRectMemo = null;
|
||||
|
||||
if (!this.positionTarget) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.style[this.horizontalAlign] =
|
||||
this._horizontalAlignTargetValue + 'px';
|
||||
|
||||
this.style[this.verticalAlign] =
|
||||
this._verticalAlignTargetValue + 'px';
|
||||
|
||||
// NOTE(cdata): We re-memoize inline styles here, otherwise
|
||||
// calling `refit` from `IronFitBehavior` will reset inline styles
|
||||
// to whatever they were when the dropdown first opened.
|
||||
if (this._fitInfo) {
|
||||
this._fitInfo.inlineStyle[this.horizontalAlign] =
|
||||
this.style[this.horizontalAlign];
|
||||
|
||||
this._fitInfo.inlineStyle[this.verticalAlign] =
|
||||
this.style[this.verticalAlign];
|
||||
}
|
||||
},
|
||||
|
||||
_focusContent: function() {
|
||||
if (this.containedElement) {
|
||||
this.containedElement.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</dom-module>
|
||||
|
||||
26
dashboard-ui/bower_components/iron-dropdown/test/index.html
vendored
Normal file
26
dashboard-ui/bower_components/iron-dropdown/test/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.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>iron-dropdown tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'iron-dropdown.html',
|
||||
'iron-dropdown-scroll-manager.html'
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
106
dashboard-ui/bower_components/iron-dropdown/test/iron-dropdown-scroll-manager.html
vendored
Normal file
106
dashboard-ui/bower_components/iron-dropdown/test/iron-dropdown-scroll-manager.html
vendored
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
<!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>iron-dropdown-scroll-manager 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="../iron-dropdown-scroll-manager.html">
|
||||
<link rel="import" href="../../test-fixture/test-fixture.html">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="DOMSubtree">
|
||||
<template>
|
||||
<div id="Parent">
|
||||
<div id="ChildOne">
|
||||
<div id="GrandchildOne"></div>
|
||||
</div>
|
||||
<div id="ChildTwo">
|
||||
<div id="GrandchildTwo"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
<script>
|
||||
suite('IronDropdownScrollManager', function() {
|
||||
var parent;
|
||||
var childOne;
|
||||
var childTwo;
|
||||
var grandchildOne;
|
||||
var grandchildTwo;
|
||||
var ancestor;
|
||||
|
||||
setup(function() {
|
||||
parent = fixture('DOMSubtree');
|
||||
childOne = parent.querySelector('#ChildOne');
|
||||
childTwo = parent.querySelector('#ChildTwo');
|
||||
grandChildOne = parent.querySelector('#GrandchildOne');
|
||||
grandChildTwo = parent.querySelector('#GrandchildTwo');
|
||||
ancestor = document.body;
|
||||
});
|
||||
|
||||
suite('contraining scroll in the DOM', function() {
|
||||
setup(function() {
|
||||
Polymer.IronDropdownScrollManager.pushScrollLock(childOne);
|
||||
});
|
||||
|
||||
teardown(function() {
|
||||
Polymer.IronDropdownScrollManager.removeScrollLock(childOne);
|
||||
});
|
||||
|
||||
test('recognizes sibling as locked', function() {
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(childTwo))
|
||||
.to.be.equal(true);
|
||||
});
|
||||
|
||||
test('recognizes neice as locked', function() {
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(grandChildTwo))
|
||||
.to.be.equal(true);
|
||||
});
|
||||
|
||||
test('recognizes parent as locked', function() {
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(parent))
|
||||
.to.be.equal(true);
|
||||
});
|
||||
|
||||
test('recognizes ancestor as locked', function() {
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(ancestor))
|
||||
.to.be.equal(true);
|
||||
});
|
||||
|
||||
test('recognizes locking child as unlocked', function() {
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(childOne))
|
||||
.to.be.equal(false);
|
||||
});
|
||||
|
||||
test('recognizes descendant of locking child as unlocked', function() {
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(grandChildOne))
|
||||
.to.be.equal(false);
|
||||
});
|
||||
|
||||
test('unlocks locked elements when there are no locking elements', function() {
|
||||
Polymer.IronDropdownScrollManager.removeScrollLock(childOne);
|
||||
|
||||
expect(Polymer.IronDropdownScrollManager.elementIsScrollLocked(parent))
|
||||
.to.be.equal(false);
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
169
dashboard-ui/bower_components/iron-dropdown/test/iron-dropdown.html
vendored
Normal file
169
dashboard-ui/bower_components/iron-dropdown/test/iron-dropdown.html
vendored
Normal file
|
|
@ -0,0 +1,169 @@
|
|||
<!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>iron-dropdown 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="../iron-dropdown.html">
|
||||
<link rel="import" href="../../test-fixture/test-fixture.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="TrivialDropdown">
|
||||
<template>
|
||||
<iron-dropdown>
|
||||
<div class="dropdown-content">Hello!</div>
|
||||
</iron-dropdown>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<test-fixture id="AlignedDropdown">
|
||||
<template>
|
||||
<div style="display: block; position: relative; width: 100px; height: 100px;">
|
||||
<iron-dropdown horizontal-align="right" vertical-align="top">
|
||||
<div class="dropdown-content">Hello!</div>
|
||||
</iron-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
function elementIsVisible(element) {
|
||||
var contentRect = element.getBoundingClientRect();
|
||||
var computedStyle = window.getComputedStyle(element);
|
||||
|
||||
return computedStyle.display !== 'none' &&
|
||||
contentRect.width > 0 &&
|
||||
contentRect.height > 0;
|
||||
}
|
||||
|
||||
suite('<iron-dropdown>', function() {
|
||||
var dropdown;
|
||||
suite('basic', function() {
|
||||
setup(function() {
|
||||
dropdown = fixture('TrivialDropdown');
|
||||
});
|
||||
|
||||
test('effectively hides the dropdown content', function() {
|
||||
var content = dropdown.querySelector('.dropdown-content');
|
||||
|
||||
expect(elementIsVisible(content)).to.be.equal(false);
|
||||
});
|
||||
|
||||
test('shows dropdown content when opened', function(done) {
|
||||
var content = dropdown.querySelector('.dropdown-content');
|
||||
|
||||
dropdown.open();
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
expect(elementIsVisible(content)).to.be.equal(true);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
test('hides dropdown content when outside is clicked', function(done) {
|
||||
var content = dropdown.querySelector('.dropdown-content');
|
||||
|
||||
dropdown.open();
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
expect(elementIsVisible(content)).to.be.equal(true);
|
||||
|
||||
MockInteractions.downAndUp(document.body, function() {
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
expect(elementIsVisible(content)).to.be.equal(false);
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
suite('aligned dropdown', function() {
|
||||
var parent;
|
||||
setup(function() {
|
||||
parent = fixture('AlignedDropdown');
|
||||
dropdown = parent.querySelector('iron-dropdown');
|
||||
});
|
||||
|
||||
test('can be re-aligned to the right and the top', function(done) {
|
||||
var parentRect;
|
||||
var dropdownRect;
|
||||
|
||||
dropdown.opened = true;
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
dropdownRect = dropdown.getBoundingClientRect();
|
||||
parentRect = parent.getBoundingClientRect();
|
||||
|
||||
// NOTE(cdata): IE10 / 11 have minor rounding errors in this case,
|
||||
// so we assert with `closeTo` and a tight threshold:
|
||||
expect(dropdownRect.top).to.be.closeTo(parentRect.top, 0.1);
|
||||
expect(dropdownRect.right).to.be.closeTo(parentRect.right, 0.1);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
|
||||
test('can be re-aligned to the bottom', function(done) {
|
||||
var parentRect;
|
||||
var dropdownRect;
|
||||
|
||||
dropdown.verticalAlign = 'bottom';
|
||||
dropdown.opened = true;
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
parentRect = parent.getBoundingClientRect();
|
||||
dropdownRect = dropdown.getBoundingClientRect();
|
||||
|
||||
// NOTE(cdata): IE10 / 11 have minor rounding errors in this case,
|
||||
// so we assert with `closeTo` and a tight threshold:
|
||||
expect(dropdownRect.bottom).to.be.closeTo(parentRect.bottom, 0.1);
|
||||
expect(dropdownRect.right).to.be.closeTo(parentRect.right, 0.1);
|
||||
done();
|
||||
}, 1);
|
||||
});
|
||||
|
||||
suite('with an offset', function() {
|
||||
test('is offset by the offset value when open', function() {
|
||||
var dropdownRect;
|
||||
var offsetDropdownRect;
|
||||
|
||||
dropdown.opened = true;
|
||||
|
||||
Polymer.Base.async(function() {
|
||||
dropdownRect = dropdown.getBoundingClientRect();
|
||||
|
||||
dropdownRect.verticalOffset = 10;
|
||||
dropdownRect.horizontalOffset = -10;
|
||||
|
||||
offsetDropdownRect = dropdown.getBoundingClientRect();
|
||||
|
||||
expect(dropdownRect.top).to.be.equal(offsetDropdownRect.top - 10);
|
||||
expect(dropdownRect.left).to.be.equal(offsetDropdownRect.left + 10);
|
||||
}, 1);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue