orov-horizon-test.html

<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../orov-behaviors/orov-behavior.html">
<link rel="import" href="orov-horizon-behavior.html">
<link rel="import" href="../iron-resizable-behavior/iron-resizable-behavior.html">

<dom-module id="orov-horizon-test">
  <style type="text/css">
      .hidden { display: none }
      .horizon {
          width:100%;
          height:100%;
          position:absolute;
          top:0px;
          left:0px;
      }
      #container {
          width:100%;
          height:100%;
          position:relative;
          display:block;
      }      
    </style>
  <template>
  <div id="container">
  <!--canvas id="static"></canvas-->
  <canvas id="horizon" style="display:none:" class="horizon"></canvas>
  <canvas id="horizonxform" class="horizon"></canvas>  
    </div>
  </template>

  <script>
      (function () {    
      Polymer({
        is: 'orov-horizon-test',
        properties: {
        },
        behaviors: [namespace('behaviors').oROVStandard,namespace('behaviors').orovhorizon,Polymer.IronResizableBehavior],          
        listeners: {
        'iron-resize': '_onIronResize'
        },
        _onIronResize: function(){
            this._drawCrossHair();
        },         
        attached: function(){
            this._drawCrossHair();
        },
        _drawCrossHair: function(){
        },
        draw: function(orientation){
          if (!this.horizon){
              return;
          }
        }
      });
    }());
  </script>
</dom-module>