Merge pull request #4 from Polymer/polymer-element

Switch to <polymer-element>
googlearchive · Jun 26, 2013 · fd99a44 · fd99a44
2 parents c99de0f + 7c74050
commit fd99a44
Show file tree

Hide file tree

Showing 38 changed files with 144 additions and 1,800 deletions.
diff --git a/assets/glass.png b/assets/glass.png
diff --git a/polymer-ui-clock/index.html b/polymer-ui-clock/index.html
diff --git a/polymer-ui-clock/polymer-ui-clock.css b/polymer-ui-clock/polymer-ui-clock.css
diff --git a/polymer-ui-clock/polymer-ui-clock.html b/polymer-ui-clock/polymer-ui-clock.html
diff --git a/polymer-ui-icon-button/polymer-ui-icon-button.html b/polymer-ui-icon-button/polymer-ui-icon-button.html
@@ -20,13 +20,13 @@
 
 <link rel="import" href="../polymer-ui-icon/polymer-ui-icon.html">
 
-<element name="polymer-ui-icon-button" attributes="src index icon active">
-  <link rel="stylesheet" href="polymer-ui-icon-button.css">
+<polymer-element name="polymer-ui-icon-button" attributes="src index icon active">
   <template>
+    <link rel="stylesheet" href="polymer-ui-icon-button.css">
     <polymer-ui-icon src="{{src}}" index="{{index}}" icon="{{icon}}"></polymer-ui-icon>
   </template>
   <script>
-    Polymer.register(this, {
+    Polymer('polymer-ui-icon-button', {
       /**
        * The URL of an image for the icon.
        *
@@ -59,4 +59,4 @@
       }
     });
   </script>
-</element>
+</polymer-element>
diff --git a/polymer-ui-icon/polymer-ui-icon.html b/polymer-ui-icon/polymer-ui-icon.html
@@ -26,65 +26,67 @@
 -->
 <link rel="import" href="../polymer-ui-theme-aware/polymer-ui-theme-aware.html">
 
-<element name="polymer-ui-icon" extends="polymer-ui-theme-aware" attributes="src size index icon">
-  <link rel="stylesheet" href="polymer-ui-icon.css">
+<polymer-element name="polymer-ui-icon" extends="polymer-ui-theme-aware" attributes="src size index icon">
   <template>
+    <link rel="stylesheet" href="polymer-ui-icon.css">
     <div id="icon"></div>
   </template>
   <script>
-    Polymer.register(this, {
-      /**
-       * The URL of an image for the icon.
-       *
-       * @attribute src
-       * @type string
-       * @default ''
-       */
-      src: '',
-      /**
-       * Specifies the size of the icon.
-       *
-       * @attribute size
-       * @type string
-       * @default 24
-       */
-      size: 24,
-      icon: '',
-      bx: 0,
-      by: 0,
-      iconChanged: function() {
-        this.index = this.icon in icons ? icons[this.icon] : -1;
-      },
-      indexChanged: function() {
-        this.$.icon.classList.add('polymer-ui-icons');
-        this.by = -this.size * this.index;
-        this.updateIcon();
-      },
-      srcChanged: function() {
-        this.$.icon.classList.remove('polymer-ui-icons');
-        this.$.icon.setAttribute('style', 'background:url(' + this.src + ') center;');
-      },
-      themeChanged: function(old) {
-        this.$.icon.style.backgroundPosition = '';
-        this.$.icon.classList.switch(old, this.theme);
-        this.asyncMethod('updateIcon');
-      },
-      updateIcon: function() {
-        this.bx = parseFloat(getComputedStyle(this.$.icon).backgroundPosition.split(' ').shift());
-        this.$.icon.style.backgroundPosition = (this.bx + 'px') + ' ' + (this.by + 'px');
-      }
-    });
-    var icons = {
-      drawer: 0,
-      menu: 1,
-      search: 2,
-      dropdown: 3,
-      close: 4,
-      add: 5,
-      trash: 6,
-      refresh: 7,
-      settings: 8,
-      dialog: 9
-    };
+    (function() {
+      Polymer('polymer-ui-icon', {
+        /**
+         * The URL of an image for the icon.
+         *
+         * @attribute src
+         * @type string
+         * @default ''
+         */
+        src: '',
+        /**
+         * Specifies the size of the icon.
+         *
+         * @attribute size
+         * @type string
+         * @default 24
+         */
+        size: 24,
+        icon: '',
+        bx: 0,
+        by: 0,
+        iconChanged: function() {
+          this.index = this.icon in icons ? icons[this.icon] : -1;
+        },
+        indexChanged: function() {
+          this.$.icon.classList.add('polymer-ui-icons');
+          this.by = -this.size * this.index;
+          this.updateIcon();
+        },
+        srcChanged: function() {
+          this.$.icon.classList.remove('polymer-ui-icons');
+          this.$.icon.setAttribute('style', 'background:url(' + this.src + ') center;');
+        },
+        themeChanged: function(old) {
+          this.$.icon.style.backgroundPosition = '';
+          this.$.icon.classList.switch(old, this.theme);
+          this.asyncMethod('updateIcon');
+        },
+        updateIcon: function() {
+          this.bx = parseFloat(getComputedStyle(this.$.icon).backgroundPosition.split(' ').shift());
+          this.$.icon.style.backgroundPosition = (this.bx + 'px') + ' ' + (this.by + 'px');
+        }
+      });
+      var icons = {
+        drawer: 0,
+        menu: 1,
+        search: 2,
+        dropdown: 3,
+        close: 4,
+        add: 5,
+        trash: 6,
+        refresh: 7,
+        settings: 8,
+        dialog: 9
+      };
+    })();
   </script>
-</element>
+</polymer-element>