GitHub PullRequestReviewCommentEvent at 2014-05-07 21:53:05
Repository: gaia
Actor: KevinGrandon
Payload: {"comment":{"url":"https://api.github.com/repos/mozilla-b2g/gaia/pulls/comments/12405174","id":12405174,"diff_hunk":"@@ -0,0 +1,123 @@\n+\n+window.GaiaHeader = (function() {\n+  'use strict';\n+\n+  // Extend from the HTMLElement prototype\n+  var proto = Object.create(HTMLElement.prototype);\n+\n+  /**\n+   * Called when the element is first created.\n+   *\n+   * Here we create the shadow-root and\n+   * inject our template into it.\n+   *\n+   * @private\n+   */\n+  proto.createdCallback = function() {\n+    var shadow = this.createShadowRoot();\n+\n+    this.template = template.content.cloneNode(true);\n+    this.configureActionButton();\n+    this.configureSkin();\n+    this.styleHack();\n+\n+    shadow.appendChild(this.template);\n+  };\n+\n+  /**\n+   * We clone the scoped stylesheet and append\n+   * it outside the shadow-root so that we can\n+   * style projected <content> without the need\n+   * of the :content selector.\n+   *\n+   * When the :content selector lands, we won't\n+   * need this hack anymore and can style projected\n+   * <content> from stylesheets within the shadow root.\n+   *\n+   * BUG:992249\n+   *\n+   * @private\n+   */\n+  proto.styleHack = function() {\n+    var style = this.template.querySelector('style');\n+    this.appendChild(style.cloneNode(true));\n+  };\n+\n+  /**\n+   * Configure the action button based\n+   * on the value of the `data-action`\n+   * attribute.\n+   *\n+   * @private\n+   */\n+  proto.configureActionButton = function() {\n+    var inner = this.template.getElementById('action-button-inner');\n+    var button = this.template.getElementById('action-button');\n+    var type = this.dataset.action;\n+\n+    if (!type) {\n+      button.style.display = 'none';\n+      return;\n+    }\n+\n+    button.dataset.action = type;\n+    inner.classList.add('icon-' + type);\n+    button.addEventListener('click', proto.onActionButtonClick.bind(this));\n+  };\n+\n+  /**\n+   * Configure the skin based on the\n+   * `data-skin` attribute.\n+   *\n+   * @private\n+   */\n+  proto.configureSkin = function() {\n+    var skin = this.dataset.skin;\n+    if (skin) {\n+      var header = this.template.getElementById('header');\n+      header.parentNode.classList.add('skin-' + skin);\n+    }\n+  };\n+\n+  /**\n+   * Handle clicks on the action button.\n+   *\n+   * UNKNOWN: Why is the callback fired async?\n+   *\n+   * @param  {Event} e\n+   * @private\n+   */\n+  proto.onActionButtonClick = function(e) {\n+    var config = { detail: { type: this.dataset.action } };\n+    var actionEvent = new CustomEvent('action', config);\n+    setTimeout(this.dispatchEvent.bind(this, actionEvent));\n+  };\n+\n+  // HACK: Create a <template> in memory at runtime.\n+  // When the custom-element is created we clone\n+  // this template and inject into the shadow-root.\n+  // Prior to this we would have had to copy/paste\n+  // the template into the <head> of every app that\n+  // wanted to use <gaia-header>, this would make\n+  // markup changes complicated, and could lead to\n+  // things getting out of sync. This is a short-term\n+  // hack until we can import entire custom-elements\n+  // using HTML Imports (bug 877072).","path":"shared/web_components/gaia-header/js/component.js","position":105,"original_position":105,"commit_id":"e9a4eadf11bbf516418da429259cdeab45a25b46","original_commit_id":"e9a4eadf11bbf516418da429259cdeab45a25b46","user":{"login":"KevinGrandon","id":122602,"avatar_url":"https://avatars.githubusercontent.com/u/122602?","gravatar_id":"cf3541775f9060d370587dc1bcfcac9b","url":"https://api.github.com/users/KevinGrandon","html_url":"https://github.com/KevinGrandon","followers_url":"https://api.github.com/users/KevinGrandon/followers","following_url":"https://api.github.com/users/KevinGrandon/following{/other_user}","gists_url":"https://api.github.com/users/KevinGrandon/gists{/gist_id}","starred_url":"https://api.github.com/users/KevinGrandon/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KevinGrandon/subscriptions","organizations_url":"https://api.github.com/users/KevinGrandon/orgs","repos_url":"https://api.github.com/users/KevinGrandon/repos","events_url":"https://api.github.com/users/KevinGrandon/events{/privacy}","received_events_url":"https://api.github.com/users/KevinGrandon/received_events","type":"User","site_admin":false},"body":"We already have a polyfill for HTML imports. Should we just use it?\r\nhttps://github.com/mozilla-b2g/gaia/blob/master/apps/settings/index.html#L85","created_at":"2014-05-07T21:53:05Z","updated_at":"2014-05-07T21:53:05Z","html_url":"https://github.com/mozilla-b2g/gaia/pull/19034#discussion_r12405174","pull_request_url":"https://api.github.com/repos/mozilla-b2g/gaia/pulls/19034","_links":{"self":{"href":"https://api.github.com/repos/mozilla-b2g/gaia/pulls/comments/12405174"},"html":{"href":"https://github.com/mozilla-b2g/gaia/pull/19034#discussion_r12405174"},"pull_request":{"href":"https://api.github.com/repos/mozilla-b2g/gaia/pulls/19034"}}}}