jschaufuss/DiceCloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Polymer

Browse Source
This commit is contained in:
Thaum
2014-11-26 10:18:35 +00:00
parent 5eea4714b2
commit 3408ba9e8d
1210 changed files with 394645 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
rpg-docs/public/bower_components/paper-dropdown-menu/.bower.json vendored Normal file
View File

@@ -0,0 +1,27 @@
{
"name": "paper-dropdown-menu",
"private": false,
"dependencies": {
"polymer": "Polymer/polymer#^0.5.0",
"core-a11y-keys": "Polymer/core-a11y-keys#^0.5.0",
"core-collapse": "Polymer/core-collapse#^0.5.0",
"core-focusable": "Polymer/core-focusable#^0.5.0",
"core-icon": "Polymer/core-icon#^0.5.0",
"core-icons": "Polymer/core-icons#^0.5.0",
"core-menu": "Polymer/core-menu#^0.5.0",
"paper-dropdown": "Polymer/paper-dropdown#^0.5.0",
"paper-item": "Polymer/paper-item#^0.5.0",
"paper-shadow": "Polymer/paper-shadow#^0.5.0"
},
"version": "0.5.1",
"homepage": "https://github.com/Polymer/paper-dropdown-menu",
"_release": "0.5.1",
"_resolution": {
"type": "version",
"tag": "0.5.1",
"commit": "5e6c955c08ea8c45aff3fd0e6bbd3309a9db1ac4"
},
"_source": "git://github.com/Polymer/paper-dropdown-menu.git",
"_target": "^0.5.0",
"_originalSource": "Polymer/paper-dropdown-menu"
}

6
rpg-docs/public/bower_components/paper-dropdown-menu/README.md vendored Normal file
View File

@@ -0,0 +1,6 @@
paper-dropdown-menu
===================
owner: @morethanreal
See the [component page](https://www.polymer-project.org/docs/elements/paper-elements.html#paper-dropdown-menu) for more information.

17
rpg-docs/public/bower_components/paper-dropdown-menu/bower.json vendored Normal file
View File

@@ -0,0 +1,17 @@
{
"name": "paper-dropdown-menu",
"private": false,
"dependencies": {
"polymer": "Polymer/polymer#^0.5.0",
"core-a11y-keys": "Polymer/core-a11y-keys#^0.5.0",
"core-collapse": "Polymer/core-collapse#^0.5.0",
"core-focusable": "Polymer/core-focusable#^0.5.0",
"core-icon": "Polymer/core-icon#^0.5.0",
"core-icons": "Polymer/core-icons#^0.5.0",
"core-menu": "Polymer/core-menu#^0.5.0",
"paper-dropdown": "Polymer/paper-dropdown#^0.5.0",
"paper-item": "Polymer/paper-item#^0.5.0",
"paper-shadow": "Polymer/paper-shadow#^0.5.0"
},
"version": "0.5.1"
}

189
rpg-docs/public/bower_components/paper-dropdown-menu/demo.html vendored Normal file
View File

@@ -0,0 +1,189 @@
<!doctype html>
<!--
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
-->
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>paper-dropdown-menu</title>
<script src="../webcomponentsjs/webcomponents.js"></script>
<link href="../core-collapse/core-collapse.html" rel="import">
<link href="../core-menu/core-menu.html" rel="import">
<link href="../paper-dropdown/paper-dropdown.html" rel="import">
<link href="../paper-item/paper-item.html" rel="import">
<link href="paper-dropdown-menu.html" rel="import">
<style shim-shadowdom>
body {
font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
font-size: 14px;
margin: 0;
padding: 24px;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-touch-callout: none;
}
section {
padding: 20px 0;
}
section > div {
padding: 14px;
font-size: 16px;
}
html /deep/ paper-dropdown-menu {
box-sizing: border-box;
width: 170px;
}
html /deep/ core-menu {
box-sizing: border-box;
width: 170px;
}
paper-item {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
html /deep/ core-collapse {
border: 1px solid #ccc;
padding: 8px;
}
.constrained-height {
height: 150px;
}
.colored {
color: #0f9d58;
}
.dropdown.colored::shadow #ripple,
.dropdown.colored::shadow #background {
border: 1px solid #0f9d58;
background-color: #b7e1cd;
}
</style>
</head>
<body>
<template is="auto-binding">
<section>
<div>Absolutely positioned dropdowns</div>
<paper-dropdown-menu label="Your favorite pastry">
<paper-dropdown class="dropdown">
<core-menu class="menu">
<template repeat="{{pastries}}">
<paper-item>{{}}</paper-item>
</template>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<br><br>
<paper-dropdown-menu label="Disabled" disabled>
<paper-dropdown class="dropdown">
<core-menu class="menu">
<paper-item>Should not see this</paper-item>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
</section>
<section>
<div>Layered dropdowns</div>
<button onclick="document.getElementById('collapse').toggle()">toggle core-collapse</button>
<br>
<core-collapse id="collapse">
<paper-dropdown-menu label="Your favorite pastry">
<paper-dropdown layered class="dropdown">
<core-menu class="menu">
<template repeat="{{pastries}}">
<paper-item>{{}}</paper-item>
</template>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
</core-collapse>
</section>
<section>
<div>Custom styling</div>
<paper-dropdown-menu label="Constrained height">
<paper-dropdown class="dropdown constrained-height">
<core-menu class="menu">
<template repeat="{{pastries}}">
<paper-item>{{}}</paper-item>
</template>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<br><br>
<paper-dropdown-menu label="Colored">
<paper-dropdown class="dropdown colored">
<core-menu class="menu">
<template repeat="{{pastries}}">
<paper-item>{{}}</paper-item>
</template>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
</section>
</template>
<script>
scope = document.querySelector('template[is=auto-binding]');
scope.pastries = [
'Apple fritter',
'Croissant',
'Donut',
'Financier',
'Jello',
'Madeleine',
'Pound cake',
'Pretzel',
'Sfogliatelle'
];
</script>
</body>
</html>

22
rpg-docs/public/bower_components/paper-dropdown-menu/index.html vendored Normal file
View File

@@ -0,0 +1,22 @@
<!doctype html>
<!--
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
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>
<script src="../webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="../core-component-page/core-component-page.html">
</head>
<body unresolved>
<core-component-page></core-component-page>
</body>
</html>

44
rpg-docs/public/bower_components/paper-dropdown-menu/paper-dropdown-menu.css vendored Normal file
View File

@@ -0,0 +1,44 @@
/*
* @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
*/
:host {
position: relative;
display: inline-block;
background-color: #fff;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
cursor: pointer;
padding: 0.75em 0;
}
#control {
box-sizing: border-box;
max-height: 2em;
color: #757575;
border-bottom: 1px solid #757575;
}
#control[selected] {
color: #000;
}
#control > div {
padding: 0.5em 0 0.25em;
overflow: hidden;
/* FIXME not working for some reason */
white-space: nowrap;
text-overflow: ellipsis;
}
core-icon {
margin: 0.3em 0 0.2em 0.25em;
}

181
rpg-docs/public/bower_components/paper-dropdown-menu/paper-dropdown-menu.html vendored Normal file
View File

@@ -0,0 +1,181 @@
<!--
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
-->
<!--
`paper-dropdown-menu` works together with `paper-dropdown` and `core-menu` to
implement a drop-down menu. The currently selected item is displayed in the
control. If no item is selected, the `label` is displayed instead.
The child element with the class `dropdown` will be used as the drop-down
menu. It should be a `paper-dropdown` or other overlay element. You should
also provide a `core-selector` or other selector element, such as `core-menu`,
in the drop-down. You should apply the class `menu` to the selector element.
Example:
<paper-dropdown-menu label="Your favorite pastry">
<paper-dropdown class="dropdown">
<core-menu class="menu">
<paper-item>Croissant</paper-item>
<paper-item>Donut</paper-item>
<paper-item>Financier</paper-item>
<paper-item>Madeleine</paper-item>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
This example renders a drop-down menu with 4 options.
@group Paper Elements
@element paper-dropdown-menu
@extends core-dropdown-base
@status unstable
@homepage github.io
-->
<!--
Fired when an item's selection state is changed. This event is fired both
when an item is selected or deselected. The `isSelected` detail property
contains the selection state.
@event core-select
@param {Object} detail
@param {boolean} detail.isSelected true for selection and false for deselection
@param {Object} detail.item the item element
-->
<link href="../polymer/polymer.html" rel="import">
<link href="../core-a11y-keys/core-a11y-keys.html" rel="import">
<link href="../core-dropdown/core-dropdown-base.html" rel="import">
<link href="../core-focusable/core-focusable.html" rel="import">
<link href="../core-icon/core-icon.html" rel="import">
<link href="../core-icons/core-icons.html" rel="import">
<link href="../paper-shadow/paper-shadow.html" rel="import">
<style shim-shadowdom>
html /deep/ #paper-dropdown-menu-dropdown {
margin: 12px;
overflow: visible;
}
html /deep/ #paper-dropdown-menu-dropdown #menu {
padding: 8px 0;
margin: 0;
}
html /deep/ #paper-dropdown-menu-dropdown .menu-container {
overflow: auto;
max-height: 100%;
max-width: 100%;
}
</style>
<polymer-element name="paper-dropdown-menu" extends="core-dropdown-base" relative layout inline horizontal center tabindex="0">
<template>
<style>
:host {
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
cursor: pointer;
padding: 0.5em 0 0.25em;
margin: 0.75em 0;
border-bottom: 1px solid #757575;
outline: none;
}
#label, #arrow {
color: #757575;
}
#label {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
</style>
<core-a11y-keys target="{{}}" keys="enter space" on-keys-pressed="{{toggleOverlay}}"></core-a11y-keys>
<div flex auto id="label">{{selectedItemLabel || label}}</div>
<core-icon id="arrow" icon="{{opened ? openedIcon : closedIcon}}"></core-icon>
<content></content>
</template>
<script>
(function() {
var p = {
publish: {
/**
* A label for the control. The label is displayed if no item is selected.
*
* @attribute label
* @type string
* @default 'Select an item'
*/
label: 'Select an item',
/**
* The icon to display when the drop-down is opened.
*
* @attribute openedIcon
* @type string
* @default 'arrow-drop-up'
*/
openedIcon: 'arrow-drop-up',
/**
* The icon to display when the drop-down is closed.
*
* @attribute closedIcon
* @type string
* @default 'arrow-drop-down'
*/
closedIcon: 'arrow-drop-down'
},
selectedItemLabel: '',
overlayListeners: {
'core-overlay-open': 'openAction',
'core-activate': 'activateAction',
'core-select': 'selectAction'
},
activateAction: function(e) {
this.opened = false;
},
selectAction: function(e) {
var detail = e.detail;
if (detail.isSelected) {
this.selectedItemLabel = detail.item.label || detail.item.textContent;
} else {
this.selectedItemLabel = '';
}
}
};
Polymer.mixin2(p, Polymer.CoreFocusable);
Polymer(p);
})();
</script>
</polymer-element>

115
rpg-docs/public/bower_components/paper-dropdown-menu/test/basic.html vendored Normal file
View File

@@ -0,0 +1,115 @@
<!doctype html>
<!--
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
-->
<html>
<head>
<meta charset="UTF-8">
<title>paper-dropdown-menu basic tests</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<script src="../../webcomponentsjs/webcomponents.js"></script>
<script src="../../web-component-tester/browser.js"></script>
<link href="../core-dropdown.html" rel="import">
<style>
body {
text-align: center;
margin-top: 200px;
}
</style>
</head>
<body>
<div relative id="trigger1">
tap
<core-dropdown id="dropdown1">Hello World!</core-dropdown>
</div>
<div relative id="trigger2">
tap
<core-dropdown id="dropdown2">Hello World!</core-dropdown>
</div>
<div relative id="trigger3">
tap
<core-dropdown id="dropdown3">Hello World!</core-dropdown>
</div>
<script>
function assertPosition(dropdown, trigger) {
var dr = dropdown.getBoundingClientRect();
var tr = trigger.getBoundingClientRect();
if (dropdown.halign === 'left') {
assert.equal(dr.left, tr.left);
} else {
assert.equal(dr.right, tr.right);
}
if (dropdown.valign === 'top') {
assert.equal(dr.top, tr.top);
} else {
assert.equal(dr.bottom, tr.bottom);
}
};
function flushLayoutAndRender(callback) {
flush(function() {
document.body.offsetTop;
requestAnimationFrame(function() {
callback();
});
});
}
var d1 = document.getElementById('dropdown1');
var t1 = document.getElementById('trigger1');
d1.relatedTarget = t1;
var d2 = document.getElementById('dropdown2');
var t2 = document.getElementById('trigger2');
d2.relatedTarget = t2;
var d3 = document.getElementById('dropdown3');
var t3 = document.getElementById('trigger3');
d3.relatedTarget = t3;
test('default', function(done) {
d1.opened = true;
flushLayoutAndRender(function() {
assertPosition(d1, t1);
done();
});
});
test('bottom alignment', function(done) {
d2.valign = 'bottom';
d2.opened = true;
flushLayoutAndRender(function() {
assertPosition(d2, t2);
done();
});
});
test('right alignment', function(done) {
d3.halign = 'right';
d3.opened = true;
flushLayoutAndRender(function() {
assertPosition(d3, t3);
done();
});
});
</script>
</body>
</html>