Merge pull request #17 from Polymer/master

8/1 master -> stable

.gitignore

@@ -1 +1,4 @@
 /node_modules
+/docs
+
+/build.bat

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "tools"]
+	path = tools
+	url = https://github.com/Polymer/tools.git

gruntfile.js

@@ -0,0 +1,35 @@
+/*
+ * Copyright 2013 The Polymer Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style
+ * license that can be found in the LICENSE file.
+ */
+module.exports = function(grunt) {
+  grunt.initConfig({
+    pkg: grunt.file.readJSON('package.json'),
+    yuidoc: {
+      compile: {
+        name: '<%= pkg.name %>',
+        description: '<%= pkg.description %>',
+        version: '<%= pkg.version %>',
+        url: '<%= pkg.homepage %>',
+        options: {
+          exclude: 'docs',
+          extension: '.js,.html',
+          paths: '.',
+          outdir: 'docs',
+          linkNatives: 'true',
+          tabtospace: 2,
+          themedir: 'tools/doc/themes/footstrap'
+        }
+      }
+    }
+  });
+
+  // plugins
+  grunt.loadNpmTasks('grunt-contrib-yuidoc');
+
+  // tasks
+  grunt.registerTask('default', ['yuidoc']);
+  grunt.registerTask('docs', ['yuidoc']);
+};
+

manifest.xml

@@ -0,0 +1,22 @@
+<?xml version="1.0"?>
+<meta>
+  <polymer-element-meta name="polymer-ajax"></polymer-element-meta>
+  <polymer-element-meta name="polymer-animation"></polymer-element-meta>
+  <polymer-element-meta name="polymer-collapse"></polymer-element-meta>
+  <polymer-element-meta name="polymer-file"></polymer-element-meta>
+  <polymer-element-meta name="polymer-flex-layout"></polymer-element-meta>
+  <polymer-element-meta name="polymer-google-jsapi"></polymer-element-meta>
+  <polymer-element-meta name="polymer-grid-layout"></polymer-element-meta>
+  <polymer-element-meta name="polymer-flex-layout"></polymer-element-meta>
+  <polymer-element-meta name="polymer-jsonp"></polymer-element-meta>
+  <polymer-element-meta name="polymer-key-helper"></polymer-element-meta>
+  <polymer-element-meta name="polymer-layout"></polymer-element-meta>
+  <polymer-element-meta name="polymer-localstorage"></polymer-element-meta>
+  <polymer-element-meta name="polymer-media-query"></polymer-element-meta>
+  <polymer-element-meta name="polymer-meta"></polymer-element-meta>
+  <polymer-element-meta name="polymer-overlay"></polymer-element-meta>
+  <polymer-element-meta name="polymer-page"></polymer-element-meta>
+  <polymer-element-meta name="polymer-selector"></polymer-element-meta>
+  <polymer-element-meta name="polymer-shared-lib"></polymer-element-meta>
+  <polymer-element-meta name="polymer-view-source-link"></polymer-element-meta>
+</meta>

package.json

@@ -2,15 +2,7 @@
   "name": "PolymerElements",
   "version": "0.0.1",
   "devDependencies": {
-    "mocha": "*",
-    "chai": "*",
     "grunt": "*",
-    "grunt-contrib-uglify": "*",
-    "grunt-contrib-yuidoc": "*",
-    "grunt-karma-0.9.1": "~0.4.3",
-    "karma-mocha": "*",
-    "karma-browserstack-launcher": "*",
-    "karma-script-launcher": "*",
-    "karma-crbot-reporter": "*"
+    "grunt-contrib-yuidoc": "*"
   }
 }

polymer-ajax/polymer-xhr.html

@@ -79,10 +79,10 @@
         if (params && method == 'GET') {
           url += (url.indexOf('?') > 0 ? '&' : '?') + params;
         }
+        xhr.open(method, url, async);
         if (options.responseType) {
           xhr.responseType = options.responseType;
         }
-        xhr.open(method, url, async);
         this.makeReadyStateHandler(xhr, options.callback);
         this.setRequestHeaders(options.headers);
         xhr.send(method == 'POST' ? (options.body || params) : null);

polymer-animation/index.html

@@ -40,46 +40,71 @@
     <div class="animations">
 			<polymer-animation duration="1">
 				raw
-				<polymer-animation-prop name="opacity" easing="ease-in-out">
-					<polymer-animation-keyframe value="1"></polymer-animation-keyframe>
-					<polymer-animation-keyframe value="0.3"></polymer-animation-keyframe>
-					<polymer-animation-keyframe value="1"></polymer-animation-keyframe>
-				</polymer-animation-prop>
+        <polymer-animation-keyframe>
+          <polymer-animation-prop name="opacity" value="1">
+          </polymer-animation-prop>
+				</polymer-animation-keyframe>
+        <polymer-animation-keyframe>
+          <polymer-animation-prop name="opacity" value="0.3">
+          </polymer-animation-prop>
+				</polymer-animation-keyframe>
+        <polymer-animation-keyframe>
+          <polymer-animation-prop name="opacity" value="1">
+          </polymer-animation-prop>
+				</polymer-animation-keyframe>
 			</polymer-animation>
 			<polymer-animation-group type="seq">
 				raw group
 				<polymer-animation duration="0.3">
-					<polymer-animation-prop name="opacity" easing="ease-in-out">
-						<polymer-animation-keyframe value="1"></polymer-animation-keyframe>
-						<polymer-animation-keyframe value="0.3"></polymer-animation-keyframe>
-						<polymer-animation-keyframe value="1"></polymer-animation-keyframe>
-					</polymer-animation-prop>
+          <polymer-animation-keyframe>
+            <polymer-animation-prop name="opacity" value="1">
+            </polymer-animation-prop>
+          </polymer-animation-keyframe>
+          <polymer-animation-keyframe>
+            <polymer-animation-prop name="opacity" value="0.3">
+            </polymer-animation-prop>
+          </polymer-animation-keyframe>
+          <polymer-animation-keyframe>
+            <polymer-animation-prop name="opacity" value="1">
+            </polymer-animation-prop>
+          </polymer-animation-keyframe>
 				</polymer-animation>
 				<polymer-animation duration="0.3">
-					<polymer-animation-prop name="transform" easing="ease-in-out">
-						<polymer-animation-keyframe value="scale(1)"></polymer-animation-keyframe>
-						<polymer-animation-keyframe value="scale(1.2)"></polymer-animation-keyframe>
-						<polymer-animation-keyframe value="scale(1)"></polymer-animation-keyframe>
-					</polymer-animation-prop>
+          <polymer-animation-keyframe>
+            <polymer-animation-prop name="transform" value="scale(1)">
+            </polymer-animation-prop>
+          </polymer-animation-keyframe>
+          <polymer-animation-keyframe>
+            <polymer-animation-prop name="transform" value="scale(1.2)">
+            </polymer-animation-prop>
+          </polymer-animation-keyframe>
+          <polymer-animation-keyframe>
+            <polymer-animation-prop name="transform" value="scale(1)">
+            </polymer-animation-prop>
+          </polymer-animation-keyframe>
 				</polymer-animation>
 			</polymer-animation-group>
       <polymer-bounce duration="1">bounce</polymer-bounce>
       <polymer-shake>shake</polymer-shake>
-      <polymer-shake duration="Infinity">shake forever</polymer-shake>
+      <!--<polymer-shake duration="Infinity">shake forever</polymer-shake>//-->
       <polymer-flip>flip X</polymer-flip>
       <polymer-flip axis="y">flip Y</polymer-flip>
       <polymer-blink>blink</polymer-blink>
       <polymer-fadein>fade in</polymer-fadein>
-      <polymer-fadeout>fade out</polymer-fadeout>
+      <polymer-fadeout>fade out (with event)</polymer-fadeout>
     </div>
     <script>
       document.addEventListener('WebComponentsReady', function() {
         document.querySelector('.animations').addEventListener('click',
-            function(e) {
-              var animation = e.target;
-              animation.target = target;
-              animation.play();
-            });
+					function(e) {
+						var animation = e.target;
+						animation.target = target;
+						animation.play();
+					});
+					document.querySelector('polymer-fadeout').addEventListener(
+						'complete', function(e) {
+							alert('complete!');
+						});
       });
     </script>
   </body>

polymer-animation/polymer-animation-group.html

@@ -12,22 +12,6 @@
       /**
        * Component for a group of animations.
        *
-       * A fade in and move animation in sequence:
-       *
-       *     <polymer-animation-group type="seq">
-       *       <polymer-animation>
-       *         <polymer-animation-prop name="opacity">
-       *           <polymer-animation-keyframe value="0.5" offset="0"></polymer-animation-keyframe>
-       *           <polymer-animation-keyframe value="1" offset="1"></polymer-animation-keyframe>
-       *         <polymer-animation-prop>
-       *       </polymer-animation>
-       *       <polymer-animation>
-       *         <polymer-animation-prop name="transform">
-       *           <polymer-animation-keyframe value="translateX(0)" offset="0"></polymer-animation-keyframe>
-       *           <polymer-animation-keyframe value="translateX(100px)" offset="1"></polymer-animation-keyframe>
-       *         <polymer-animation-prop>
-       *       </polymer-animation>
-       *     </polymer-animation-group>
        * @class polymer-animation-group
        */
       Polymer('polymer-animation-group', {
@@ -55,6 +39,13 @@
         makeAnimation: function() {
           return new ANIMATION_GROUPS[this.type](this.childAnimations, this.timingProps);
         },
+        doOnChildren: function(inFn) {
+          var children = this.children;
+          if (!children.length) {
+            children = this.webkitShadowRoot ? this.webkitShadowRoot.childNodes : [];
+          }
+          Array.prototype.forEach.call(children, inFn, this);
+        },
         completeApply: function() {
           this.doOnChildren(function(c) {
             c.completeApply();

polymer-animation/polymer-animation-keyframe.html

@@ -1,39 +1,28 @@
 <polymer-element name="polymer-animation-keyframe" attributes="offset value easing">
 	<script>
 		/**
-		 * Defines the value at a keyframe for the containing `polymer-animation-prop`.
+     * Defines a keyframe in an animation. Its children should be
+     * `<polymer-animation-prop>` elements specifying the css
+     * property value at the keyframe.
+     *
 		 * @class polymer-animation-keyframe
 		 */
 		/**
 		 * From 0 to 1.
 		 * @property offset
 		 * @type Number
-		 * @required
-		 */
-		/**
-		 * Property value at the animation offset.
-		 * @property value
-		 * @type String
-		 * @required
-		 */
-		/**
-		 * @property easing
-		 * @type String
 		 */
 		Polymer('polymer-animation-keyframe', {
 			get properties() {
-				var props = {
-					// TODO bug in webanimations polyfill
-					value: String(this.value) || "",
-				};
-				var more = this.offset !== null || this.easing;
+        var props = {};
+        var children = this.querySelectorAll('polymer-animation-prop');
+        Array.prototype.forEach.call(children, function(c) {
+          props[c.name] = c.value;
+        });
 				if (this.offset !== null) {
 					props.offset = this.offset;
 				}
-				if (this.easing) {
-					props.timingFunction = this.easing;
-				}
-				return more ? props : String(this.value);
+				return props;
 			}
 		});
 	</script>

polymer-animation/polymer-animation-prop.html

@@ -1,17 +1,8 @@
-<link rel="import" href="polymer-animation-keyframe.html">
-<polymer-element name="polymer-animation-prop" attributes="name">
+<polymer-element name="polymer-animation-prop" attributes="name value">
   <script>
     /**
-     * An animated property. Its children should be `<polymer-animation-keyframe>`
-     * elements specifying the keyframe values.
+     * A CSS property and value to use in a `<polymer-animation-keyframe>`.
      *
-     * Declaring an property to move down and then right:
-     *
-     *     <polymer-animation-prop name="transform">
-     *       <polymer-animation-keyframe offset="0" value="translate(0,0)"></polymer-animation-keyframe>
-     *       <polymer-animation-keyframe offset="0.5" value="translate(0,100px)"></polymer-animation-keyframe>
-     *       <polymer-animation-keyframe offset="1" value="translate(100px,100px)"></polymer-animation-keyframe>
-     *     </polymer-animation-prop>
      * @class polymer-animation-prop
      */
 		/**
@@ -20,6 +11,11 @@
 		 * @type String
 		 * @required
 		 */
-    Polymer('polymer-animation-prop');
+     /**
+      * CSS property value.
+      * @property value
+      * @required
+      */
+      Polymer('polymer-animation-prop');
   </script>
 </polymer-element>