cletusw

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
  <defs>
    <mask id="walkthrough-backdrop-mask">
      <rect width="100%" height="100%" x="0" y="0" fill="white"></rect>
      <ellipse class="hole" ng-attr-cx="{{cutoutCenterX}}" ng-attr-cy="{{cutoutCenterY}}" ng-attr-rx="{{cutoutRadiusX}}" ng-attr-ry="{{cutoutRadiusY}}" fill="black"></ellipse>
    </mask>
  </defs>

  <rect width="100%" height="100%" x="0" y="0" fill="black" fill-opacity="0.75" mask="url(#walkthrough-backdrop-mask)"></rect>
</svg>

cletusw

ffmpeg -i "$1" -c:v libx264 -preset veryslow -crf 35 -c:a copy "${1:0: -4} low.mp4"

cletusw

View live: http://bl.ocks.org/cletusw/64a0e8fda34eba1b8cd1

TODO: Make dynamic (adding or removing the attribute adds or removes the functionality)

cletusw

<link rel="import" href="../core-icon-button/core-icon-button.html">
<link rel="import" href="../core-toolbar/core-toolbar.html">
<link rel="import" href="../core-scroll-header-panel/core-scroll-header-panel.html">

<polymer-element name="my-element">

  <template>
    <style>    
      :host {
        position: absolute;