Added Polymer

2014-11-26 10:18:35 +00:00
parent 5eea4714b2
commit 3408ba9e8d
1210 changed files with 394645 additions and 47 deletions
--- a/rpg-docs/public/bower_components/core-toolbar/.bower.json
+++ b/rpg-docs/public/bower_components/core-toolbar/.bower.json
@@ -0,0 +1,19 @@
+{
+  "name": "core-toolbar",
+  "private": true,
+  "dependencies": {
+    "core-icon-button": "Polymer/core-icon-button#^0.5.0",
+    "core-media-query": "Polymer/core-media-query#^0.5.0"
+  },
+  "version": "0.5.1",
+  "homepage": "https://github.com/Polymer/core-toolbar",
+  "_release": "0.5.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.5.1",
+    "commit": "3c260d0434fb01963f18d3c9dba51fd9ee3260df"
+  },
+  "_source": "git://github.com/Polymer/core-toolbar.git",
+  "_target": "^0.5.0",
+  "_originalSource": "Polymer/core-toolbar"
+}
--- a/rpg-docs/public/bower_components/core-toolbar/README.md
+++ b/rpg-docs/public/bower_components/core-toolbar/README.md
@@ -0,0 +1,4 @@
+core-toolbar
+============
+
+See the [component page](http://polymer-project.org/docs/elements/core-elements.html#core-toolbar) for more information.
--- a/rpg-docs/public/bower_components/core-toolbar/bower.json
+++ b/rpg-docs/public/bower_components/core-toolbar/bower.json
@@ -0,0 +1,9 @@
+{
+  "name": "core-toolbar",
+  "private": true,
+  "dependencies": {
+    "core-icon-button": "Polymer/core-icon-button#^0.5.0",
+    "core-media-query": "Polymer/core-media-query#^0.5.0"
+  },
+  "version": "0.5.1"
+}
--- a/rpg-docs/public/bower_components/core-toolbar/core-toolbar.css
+++ b/rpg-docs/public/bower_components/core-toolbar/core-toolbar.css
@@ -0,0 +1,117 @@
+/*
+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 {
+  /* technical */
+  display: block;
+  position: relative;
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  /* size */
+  height: 64px;
+  /* typography */
+  font-size: 1.3em;
+  /* background */
+  background-color: #CFD8DC;
+}
+
+:host(.animate) {
+  /* transition */
+  transition: height 0.18s ease-in;
+}
+
+:host(.medium-tall) {
+  height: 128px;
+}
+
+:host(.tall) {
+  height: 192px;
+}
+
+.toolbar-tools {
+  position: relative;
+  height: 64px;
+  padding: 0 8px;
+  pointer-events: none;
+}
+
+/* narrow layout */
+:host(.core-narrow),
+:host-context(.core-narrow) {
+  height: 56px;
+}
+
+polyfill-next-selector { content: ':host.core-narrow.medium-tall, .core-narrow :host.medium-tall'; }
+:host(.core-narrow.medium-tall),
+:host-context(.core-narrow):host(.medium-tall) {
+  height: 112px;
+}
+
+polyfill-next-selector { content: ':host.core-narrow.tall, .core-narrow :host.tall'; }
+:host(.core-narrow.tall),
+:host-context(.core-narrow):host(.tall) {
+  height: 168px;
+}
+
+polyfill-next-selector { content: ':host.core-narrow .toolbar-tools, .core-narrow :host .toolbar-tools'; }
+:host(.core-narrow) .toolbar-tools,
+:host-context(.core-narrow) .toolbar-tools {
+  height: 56px;
+  padding: 0;
+}
+
+/* middle bar */
+#middleBar {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+}
+
+:host(.tall, .medium-tall) #middleBar {
+  -webkit-transform: translateY(100%);
+  transform: translateY(100%);
+}
+
+/* bottom bar */
+#bottomBar {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+/* make elements (e.g. buttons) respond to mouse/touch events */
+polyfill-next-selector { content: '.toolbar-tools > *:not([disabled])'; }
+::content > *:not([disabled]) {
+  pointer-events: auto;
+}
+
+/* elements spacing */
+polyfill-next-selector { content: '.toolbar-tools > *'; }
+::content > * {
+  margin: 0 8px;
+}
+
+/* misc helpers */
+polyfill-next-selector { content: '.toolbar-tools > .fit'; }
+::content > .fit {
+  position: absolute;
+  top: auto;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: auto;
+  margin: 0;
+}
+
+polyfill-next-selector { content: ':host .indent'; }
+::content > .indent {
+  margin-left: 60px;
+}
--- a/rpg-docs/public/bower_components/core-toolbar/core-toolbar.html
+++ b/rpg-docs/public/bower_components/core-toolbar/core-toolbar.html
@@ -0,0 +1,155 @@
+<!--
+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
+-->
+
+<!--
+`core-toolbar` is a horizontal bar containing items that can be used for
+label, navigation, search and actions.  The items place inside the 
+`core-toolbar` are projected into a `horizontal center layout` container inside of 
+`core-toolbar`'s Shadow DOM.  You can use flex attributes to control the items'
+sizing.
+
+Example:
+
+    <core-toolbar>
+      <core-icon-button icon="menu" on-tap="{{menuAction}}"></core-icon-button>
+      <div flex>Title</div>
+      <core-icon-button icon="more" on-tap="{{moreAction}}"></core-icon-button>
+    </core-toolbar>
+
+`core-toolbar` has a standard height, but can made be taller by setting `tall`
+class on the `core-toolbar`.  This will make the toolbar 3x the normal height.
+
+    <core-toolbar class="tall">
+      <core-icon-button icon="menu"></core-icon-button>
+    </core-toolbar>
+
+Apply `medium-tall` class to make the toolbar medium tall.  This will make the
+toolbar 2x the normal height.
+
+    <core-toolbar class="medium-tall">
+      <core-icon-button icon="menu"></core-icon-button>
+    </core-toolbar>
+
+When `tall`, items can pin to either the top (default), middle or bottom.  Use
+`middle` class for middle content and `bottom` class for bottom content.
+
+    <core-toolbar class="tall">
+      <core-icon-button icon="menu"></core-icon-button>
+      <div class="middle indent">Middle Title</div>
+      <div class="bottom indent">Bottom Title</div>
+    </core-toolbar>
+    
+For `medium-tall` toolbar, the middle and bottom contents overlap and are
+pinned to the bottom.  But `middleJustify` and `bottomJustify` attributes are 
+still honored separately.
+    
+To make an element completely fit at the bottom of the toolbar, use `fit` along
+with `bottom`.
+
+    <core-toolbar class="tall">
+      <div id="progressBar" class="bottom fit"></div>
+    </core-toolbar>
+
+`core-toolbar` adapts to mobile/narrow layout when there is a `core-narrow` class set
+on itself or any of its ancestors.
+
+@group Polymer Core Elements
+@element core-toolbar
+@homepage github.io
+-->
+
+<link rel="import" href="../polymer/polymer.html">
+
+<polymer-element name="core-toolbar" attributes="justify middleJustify bottomJustify">
+<template>
+
+  <link rel="stylesheet" href="core-toolbar.css">
+
+  <div id="bottomBar" class="toolbar-tools" center horizontal layout>
+    <content select=".bottom"></content>
+  </div>
+
+  <div id="middleBar" class="toolbar-tools" center horizontal layout>
+    <content select=".middle"></content>
+  </div>
+
+  <div id="topBar" class="toolbar-tools" center horizontal layout>
+    <content></content>
+  </div>
+
+</template>
+<script>
+
+(function() {
+
+  Polymer('core-toolbar', {
+    
+    /**
+     * Controls how the items are aligned horizontally.
+     * Options are `start`, `center`, `end`, `between` and `around`.
+     *
+     * @attribute justify
+     * @type string
+     * @default ''
+     */
+    justify: '',
+    
+    /**
+     * Controls how the items are aligned horizontally when they are placed
+     * in the middle.
+     * Options are `start`, `center`, `end`, `between` and `around`.
+     *
+     * @attribute middleJustify
+     * @type string
+     * @default ''
+     */
+    middleJustify: '',
+    
+    /**
+     * Controls how the items are aligned horizontally when they are placed
+     * at the bottom.
+     * Options are `start`, `center`, `end`, `between` and `around`.
+     *
+     * @attribute bottomJustify
+     * @type string
+     * @default ''
+     */
+    bottomJustify: '',
+    
+    justifyChanged: function(old) {
+      this.updateBarJustify(this.$.topBar, this.justify, old);
+    },
+    
+    middleJustifyChanged: function(old) {
+      this.updateBarJustify(this.$.middleBar, this.middleJustify, old);
+    },
+    
+    bottomJustifyChanged: function(old) {
+      this.updateBarJustify(this.$.bottomBar, this.bottomJustify, old);
+    },
+    
+    updateBarJustify: function(bar, justify, old) {
+      if (old) {
+        bar.removeAttribute(this.toLayoutAttrName(old));
+      }
+      if (this.justify) {
+        bar.setAttribute(this.toLayoutAttrName(justify), '');
+      }
+    },
+    
+    toLayoutAttrName: function(value) {
+      return value === 'between' ? 'justified' : value + '-justified';
+    }
+    
+  });
+
+})();
+
+</script>
+</polymer-element>
--- a/rpg-docs/public/bower_components/core-toolbar/demo.html
+++ b/rpg-docs/public/bower_components/core-toolbar/demo.html
@@ -0,0 +1,119 @@
+<!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>
+  <title>core-toolbar</title>
+
+  <script src="../webcomponentsjs/webcomponents.js"></script>
+
+  <link rel="import" href="core-toolbar.html">
+  <link rel="import" href="../core-icon-button/core-icon-button.html">
+  <link rel="import" href="../core-media-query/core-media-query.html">
+
+  <style shim-shadowdom>
+
+    body {
+      font-family: sans-serif;
+    }
+
+    core-toolbar {
+      background-color: #CFA0E9;
+    }
+
+    core-toolbar.dark-theme {
+      background-color: #7D25AC;
+      color: #f1f1f1;
+      fill: #f1f1f1;
+    }
+    
+  </style>
+
+</head>
+<body unresolved>
+
+  <core-toolbar>
+    <core-icon-button icon="menu"></core-icon-button>
+    <span flex>Toolbar</span>
+    <core-icon-button icon="refresh"></core-icon-button>
+    <core-icon-button icon="add"></core-icon-button>
+  </core-toolbar>
+
+  <br>
+
+  <core-toolbar class="dark-theme">
+    <core-icon-button icon="menu"></core-icon-button>
+    <span flex>Toolbar: dark-theme</span>
+    <core-icon-button icon="refresh"></core-icon-button>
+    <core-icon-button icon="add"></core-icon-button>
+  </core-toolbar>
+
+  <br>
+
+  <core-toolbar class="tall">
+    <core-icon-button icon="menu"></core-icon-button>
+    <span flex>Toolbar: tall</span>
+    <core-icon-button icon="refresh"></core-icon-button>
+    <core-icon-button icon="add"></core-icon-button>
+  </core-toolbar>
+
+  <br>
+
+  <core-toolbar class="tall">
+    <core-icon-button icon="menu" class="bottom"></core-icon-button>
+    <span flex class="bottom">Toolbar: tall with elements pin to the bottom</span>
+    <core-icon-button icon="refresh" class="bottom"></core-icon-button>
+    <core-icon-button icon="add" class="bottom"></core-icon-button>
+  </core-toolbar>
+  
+  <br>
+  
+  <core-toolbar class="medium-tall">
+    <core-icon-button icon="menu"></core-icon-button>
+    <span flex></span>
+    <core-icon-button icon="refresh"></core-icon-button>
+    <core-icon-button icon="add"></core-icon-button>
+    <span class="bottom indent">Toolbar: medium-tall with label aligns to the bottom</span>
+  </core-toolbar>
+
+  <br>
+  
+  <core-toolbar class="tall">
+    <core-icon-button icon="menu"></core-icon-button>
+    <div flex></div>
+    <core-icon-button icon="refresh"></core-icon-button>
+    <core-icon-button icon="add"></core-icon-button>
+    <div class="middle indent">label aligns to the middle</div>
+    <div class="bottom indent" style="color: #666; font-size: 18px;">some stuffs align to the bottom</div>
+  </core-toolbar>
+  
+  <br>
+  
+  <core-toolbar class="tall">
+    <core-icon-button icon="menu"></core-icon-button>
+    <div flex></div>
+    <core-icon-button icon="refresh"></core-icon-button>
+    <core-icon-button icon="add"></core-icon-button>
+    <div class="middle indent">element (e.g. progress) fits at the bottom of the toolbar</div>
+    <div class="bottom fit" style="height: 20px; background-color: #0f9d58;"></div>
+  </core-toolbar>
+  
+  <core-media-query id="mediaQuery" query="max-width: 640px"></core-media-query>
+  
+  <script>
+  
+    document.querySelector('#mediaQuery').addEventListener('core-media-change',
+      function(e) {
+        document.body.classList.toggle('core-narrow', e.detail.matches);
+      });
+  
+  </script>
+  
+</body>
+</html>
--- a/rpg-docs/public/bower_components/core-toolbar/index.html
+++ b/rpg-docs/public/bower_components/core-toolbar/index.html
@@ -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>
--- a/rpg-docs/public/bower_components/core-toolbar/metadata.html
+++ b/rpg-docs/public/bower_components/core-toolbar/metadata.html
@@ -0,0 +1,28 @@
+<!--
+    @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="core-toolbar" label="Toolbar" group="Core" isContainer>
+
+  <template>
+  
+    <core-toolbar style="right: 0px; left: 0px; background-color: #4F7DC9; color: #fff; fill: #fff;">
+      <core-icon-button icon="menu"></core-icon-button>
+      <div flex>Toolbar</div>
+    </core-toolbar>
+    
+  </template>
+
+  <template id="imports">
+  
+    <link rel="import" href="../core-icon-button/core-icon-button.html">
+    <link rel="import" href="core-toolbar.html">
+    
+  </template>
+
+</x-meta>
--- a/rpg-docs/public/bower_components/core-toolbar/test/basic.html
+++ b/rpg-docs/public/bower_components/core-toolbar/test/basic.html
@@ -0,0 +1,86 @@
+<!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>core-range-basic</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 rel="import" href="../core-toolbar.html">
+
+</head>
+<body>
+
+  <core-toolbar></core-toolbar>
+
+  <script>
+
+    var toolbar = document.querySelector('core-toolbar');
+
+    suite('basic', function() {
+      
+      test('check default height', function() {
+        assert.equal(toolbar.offsetHeight, 64);
+      });
+      
+      test('check medium-tall height', function(done) {
+        toolbar.classList.add('medium-tall');
+        asyncPlatformFlush(function() {
+          assert.equal(toolbar.offsetHeight, 128);
+          done();
+        });
+      });
+      
+      test('check tall height', function(done) {
+        toolbar.classList.add('tall');
+        asyncPlatformFlush(function() {
+          assert.equal(toolbar.offsetHeight, 192);
+          done();
+        });
+      });
+      
+      test('item at top', function(done) {
+        var item = document.createElement('div');
+        toolbar.appendChild(item)
+        asyncPlatformFlush(function() {
+          assert.equal(item.getDestinationInsertionPoints()[0].parentElement, toolbar.$.topBar);
+          done();
+        });
+      });
+      
+      test('item at middle', function(done) {
+        var item = document.createElement('div');
+        item.classList.add('middle');
+        toolbar.appendChild(item)
+        asyncPlatformFlush(function() {
+          assert.equal(item.getDestinationInsertionPoints()[0].parentElement, toolbar.$.middleBar);
+          done();
+        });
+      });
+      
+      test('item at bottom', function(done) {
+        var item = document.createElement('div');
+        item.classList.add('bottom');
+        toolbar.appendChild(item)
+        asyncPlatformFlush(function() {
+          assert.equal(item.getDestinationInsertionPoints()[0].parentElement, toolbar.$.bottomBar);
+          done();
+        });
+      });
+      
+    });
+
+  </script>
+
+</body>
+</html>
--- a/rpg-docs/public/bower_components/core-toolbar/test/index.html
+++ b/rpg-docs/public/bower_components/core-toolbar/test/index.html
@@ -0,0 +1,24 @@
+<!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 name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
+  <title>Tests</title>
+  <script src="../../web-component-tester/browser.js"></script>
+</head>
+<body>
+  <script>
+    WCT.loadSuites([
+      'basic.html'
+    ]);
+  </script>
+</body>
+</html>