sky/framework/sky-element/sky-element.sky

<!--
// Copyright 2014 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
-->
<import src="TemplateBinding.sky" />
<script>
var templates = new Map();

class SkyElement extends HTMLElement {

  static register() {
    var wrapper = document.currentScript.parentNode;

    if (wrapper.localName !== 'sky-element')
      throw new Error('No <sky-element>.');

    var tagName = wrapper.getAttribute("name");
    if (!tagName)
      throw new Error('<sky-element> must have a name.');

    var template = wrapper.querySelector('template');
    if (template)
      templates.set(tagName, template);

    return document.registerElement(tagName, {
      prototype: this.prototype,
    });
  }

  created() {
    // override
  }

  attached() {
    // override
  }

  dettached() {
    // override
  }

  attributeChanged(attrName, oldValue, newValue) {
    // override
  }

  createdCallback() {
    this.created();
  }

  attachedCallback() {
    if (!this.shadowRoot) {
      var template = templates.get(this.localName);
      if (template) {
        var shadow = this.ensureShadowRoot();
        shadow.appendChild(template.createInstance(this));
      }
    }
    this.attached();
  }

  dettachedCallback() {
    this.dettached();
  }

  attributeChangedCallback(attrName, oldValue, newValue) {
    // reserved for canonical behavior
    this.attributeChanged(attrName, oldValue, newValue);
  }
};

module.exports = SkyElement;
</script>