RubyGems - polymer-gold-rails - Versions diffs - 1.0.0.pre.rc.1 - Mend

polymer-gold-rails 1.0.0.pre.rc.1

Files changed (202) hide show

data/app/assets/components/iron-validatable-behavior/index.html ADDED Viewed

@@ -0,0 +1,30 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
+  <title>iron-validatable-behavior</title>
+  <script src="../webcomponentsjs/webcomponents-lite.js"></script>
+  <link rel="import" href="../polymer/polymer.html">
+  <link rel="import" href="../iron-component-page/iron-component-page.html">
+</head>
+<body>
+  <iron-component-page></iron-component-page>
+</body>
+</html>

data/app/assets/components/iron-validatable-behavior/iron-validatable-behavior.html ADDED Viewed

@@ -0,0 +1,101 @@
+<!--
+@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-meta/iron-meta.html">
+<script>
+  /**
+   * Use `Polymer.IronValidatableBehavior` to implement an element that validates user input.
+   *
+   * ### Accessiblity
+   *
+   * Changing the `invalid` property, either manually or by calling `validate()` will update the
+   * `aria-invalid` attribute.
+   *
+   * @demo demo/index.html
+   * @polymerBehavior
+   */
+  Polymer.IronValidatableBehavior = {
+    properties: {
+      /**
+       * Namespace for this validator.
+       */
+      validatorType: {
+        type: String,
+        value: 'validator'
+      },
+      /**
+       * Name of the validator to use.
+       */
+      validator: {
+        type: String
+      },
+      /**
+       * True if the last call to `validate` is invalid.
+       */
+      invalid: {
+        notify: true,
+        reflectToAttribute: true,
+        type: Boolean,
+        value: false
+      },
+      _validatorMeta: {
+        type: Object
+      }
+    },
+    observers: [
+      '_invalidChanged(invalid)'
+    ],
+    get _validator() {
+      return this._validatorMeta && this._validatorMeta.byKey(this.validator);
+    },
+    ready: function() {
+      this._validatorMeta = new Polymer.IronMeta({type: this.validatorType});
+    },
+    _invalidChanged: function() {
+      if (this.invalid) {
+        this.setAttribute('aria-invalid', 'true');
+      } else {
+        this.removeAttribute('aria-invalid');
+      }
+    },
+    /**
+     * @return {boolean} True if the validator `validator` exists.
+     */
+    hasValidator: function() {
+      return this._validator != null;
+    },
+    /**
+     * @param {Object} values Passed to the validator's `validate()` function.
+     * @return {boolean} True if `values` is valid.
+     */
+    validate: function(values) {
+      var valid = this._validator && this._validator.validate(values);
+      this.invalid = !valid;
+      return valid;
+    }
+  };
+</script>

data/app/assets/components/iron-validatable-behavior/test/index.html ADDED Viewed

@@ -0,0 +1,35 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+  <head>
+    <title>paper-validatable-behavior tests</title>
+    <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, user-scalable=yes">
+    <script src="../../web-component-tester/browser.js"></script>
+  </head>
+  <body>
+    <script>
+      /* no tests */
+      WCT.loadSuites([
+        'iron-validatable-behavior.html'
+      ]);
+    </script>
+  </body>
+</html>

data/app/assets/components/iron-validatable-behavior/test/iron-validatable-behavior.html ADDED Viewed

@@ -0,0 +1,52 @@
+<!doctype html>
+<!--
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <title>iron-validatable-behavior tests</title>
+  <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, user-scalable=yes">
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+  <script src="../../web-component-tester/browser.js"></script>
+  <script src="../../test-fixture/test-fixture-mocha.js"></script>
+  <link rel="import" href="../../test-fixture/test-fixture.html">
+  <link rel="import" href="test-validatable.html">
+</head>
+<body>
+  <test-fixture id="basic">
+    <template>
+      <test-validatable></test-validatable>
+    </template>
+  </test-fixture>
+  <script>
+    suite('basic', function() {
+      test('setting `invalid` sets `aria-invalid=true`', function() {
+        var node = fixture('basic');
+        node.invalid = true;
+        assert.equal(node.getAttribute('aria-invalid'), 'true', 'aria-invalid is set');
+        node.invalid = false;
+        assert.isFalse(node.hasAttribute('aria-invalid'), 'aria-invalid is unset');
+      });
+    });
+  </script>
+</body>

data/app/assets/components/iron-validatable-behavior/test/test-validatable.html ADDED Viewed

@@ -0,0 +1,28 @@
+<!--
+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-validatable-behavior.html">
+<dom-module id="test-validatable">
+  <template>
+    <content></content>
+  </template>
+</dom-module>
+<script>
+  Polymer({
+    is: 'test-validatable',
+    behaviors: [
+      Polymer.IronValidatableBehavior
+    ]
+  });
+</script>

data/app/assets/components/iron-validator-behavior/README.md ADDED Viewed

@@ -0,0 +1,4 @@
+# iron-validator-behavior
+Use `Polymer.IronValidatorBehavior` to implement a custom input/form validator. Element instances
+implementing this behavior will be registered for use in elements that implement
+`Polymer.IronValidatableBehavior`.

data/app/assets/components/iron-validator-behavior/bower.json ADDED Viewed

@@ -0,0 +1,34 @@
+{
+  "name": "iron-validator-behavior",
+  "version": "1.0.1",
+  "description": "Implements a input validator",
+  "authors": "The Polymer Authors",
+  "keywords": [
+    "web-components",
+    "polymer",
+    "iron",
+    "behavior"
+  ],
+  "main": [
+    "iron-validator-behavior.html"
+  ],
+  "private": true,
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/PolymerElements/iron-validator-behavior.git"
+  },
+  "license": "http://polymer.github.io/LICENSE.txt",
+  "homepage": "https://github.com/PolymerElements/iron-validator-behavior",
+  "ignore": [],
+  "dependencies": {
+    "iron-meta": "PolymerElements/iron-meta#^1.0.0",
+    "polymer": "Polymer/polymer#^1.0.0"
+  },
+  "devDependencies": {
+    "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
+    "paper-styles": "PolymerElements/paper-styles#^1.0.0",
+    "test-fixture": "PolymerElements/test-fixture#^1.0.0",
+    "web-component-tester": "*",
+    "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
+  }
+}

data/app/assets/components/iron-validator-behavior/demo/cats-only.html ADDED Viewed

@@ -0,0 +1,46 @@
+<!--
+@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-validator-behavior.html">
+<script>
+  Polymer({
+    is: 'cats-only',
+    behaviors: [
+      Polymer.IronValidatorBehavior
+    ],
+    validateObject: function(obj) {
+      var valid = true;
+      for (key in obj) {
+        if (obj[key] !== 'cats') {
+          valid = false;
+          break;
+        }
+      }
+      return valid;
+    },
+    validate: function(values) {
+      if (typeof values === 'object') {
+        return this.validateObject(values);
+      } else {
+        var value = Array.isArray(values) ? values.join('') : values;
+        return value.match(/^(c|ca|cat|cats)?$/) !== null;
+      }
+    }
+  });
+</script>

data/app/assets/components/iron-validator-behavior/demo/index.html ADDED Viewed

@@ -0,0 +1,144 @@
+<!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 http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
+  <title>iron-validator-behavior demo</title>
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+  <link rel="import" href="../../iron-meta/iron-meta.html">
+  <link rel="import" href="../../paper-styles/paper-styles.html">
+  <link rel="import" href="cats-only.html">
+  <link rel="stylesheet" href="../../paper-styles/demo.css">
+  <style>
+    .valid {
+      color: limegreen;
+    }
+    .invalid {
+      color: red;
+    }
+  </style>
+</head>
+<body>
+  <template is="dom-bind">
+    <cats-only></cats-only>
+    <section>
+      <p>
+        only type <code>cats</code>:
+        <input on-input="_onInput">
+        <span class="valid" hidden$="[[!valid]]">valid</span>
+        <span class="invalid" hidden$="[[valid]]">invalid</span>
+      </p>
+    </section>
+    <section>
+      <p>
+        only type <code>cats</code> across both input fields:
+        <span on-input="_onInputMulti">
+          <input>
+          <input>
+        </span>
+        <span class="valid" hidden$="[[!validMulti]]">valid</span>
+        <span class="invalid" hidden$="[[validMulti]]">invalid</span>
+      </p>
+    </section>
+    <section>
+      <p>
+        only type <code>cats</code> in the form:
+        <form on-submit="_onSubmit">
+          <label>
+            Type something: <input name="something">
+          </label>
+          <br>
+          <label>
+            Your favorite pet:
+            <select name="pet">
+              <option>iguanas</option>
+              <option>cats</option>
+              <option>pancakes</option>
+            </select>
+          </label>
+          <br>
+          <button type="submit">submit!</button>
+          <span class="valid" hidden$="[[!validForm]]">valid</span>
+          <span class="invalid" hidden$="[[validForm]]">invalid</span>
+        </form>
+      </p>
+    </section>
+  </template>
+  <script>
+    document.addEventListener('WebComponentsReady', function() {
+      var validator = new Polymer.IronMeta({type: 'validator'}).byKey('cats-only');
+      var scope = document.querySelector('template[is=dom-bind]');
+      scope.valid = scope.validMulti = scope.validForm = true;
+      scope._onInput = function(event) {
+        this.valid = validator.validate(event.target.value);
+      };
+      scope._onInputMulti = function(event) {
+        var values = [];
+        var nodes = Polymer.dom(event.currentTarget).querySelectorAll('input');
+        for (var node, i = 0; node = nodes[i]; i++) {
+          values.push(node.value);
+        }
+        this.validMulti = validator.validate(values);
+      };
+      scope._onSubmit = function(event) {
+        event.preventDefault();
+        var data = {};
+        for (var el, i = 0; el = event.target.elements[i]; i++) {
+          if (el.name) {
+            data[el.name] = el.value;
+          }
+        }
+        this.validForm = validator.validate(data);
+      };
+    });
+  </script>
+</body>