youtubeIdからyoutubeを表示するカスタムエレメント（レスポンシブ）

youtube-element.html

<dom-module name="youtube-element" id="youtube-element">
<template>
  <style>
    .youtube-wrap{
      width:100%;
      height:0;
      padding-bottom:56.25%;
      position:relative;
    }
    .youtube-wrap iframe{
      width:100%;
      height:100%;
      top:0;
      left:0;
      position:absolute;
    } 
  </style>
    <div class="youtube-wrap">
      <iframe width="560" height="315" src$="{{youtubeUrl}}" frameborder="0" allowfullscreen></iframe>
    </div>
  </template>
  <script>
    Polymer({
      is:"youtube-element",
      properties:{
        youtubeId:String,
        youtubeUrl:{
          type:String,
          computed:'getYoutubeUrl(youtubeId)'
        }
      },
      getYoutubeUrl:function(youtubeId){
        return "https://www.youtube.com/embed/"+youtubeId;
      }
    });
  </script>
</dom-module>

こんな感じで呼び出せます
<youtube-element youtube-id="D8_iafVEIZU"></youtube-element>