log = console.log

Drawing = window.Drawing

coffeeElementSetup(class AdjustersCanvas extends Polymer.mixinBehaviors([Polymer.IronResizableBehavior], Polymer.Element)

  @is: 'light9-adjusters-canvas'

  @getter_properties:

    adjs: { type: Object, notify: true }, # adjId: Adjustable

  @getter_observers: [

    'updateAllCoords(adjs)'

  ]

  ready: ->

    super.ready()

    @addEventListener('iron-resize', @resizeUpdate.bind(@))

    @ctx = @$.canvas.getContext('2d')

    @redraw()

  onDown: (ev) ->

    if ev.buttons == 1

      ev.stopPropagation()

      start = $V([ev.x, ev.y])

      adj = @_adjAtPoint(start)

      if adj

        @currentDrag = {start: start, adj: adj}

        adj.startDrag()

  onMove: (ev) ->

  _adjAtPoint: (pt) ->

    nearest = @qt.find(pt.e(1), pt.e(2))

    if not nearest? or nearest.distanceFrom(pt) > 50

      return null

    return nearest?.adj

  resizeUpdate: (ev) ->

    @$.canvas.width = ev.target.offsetWidth

    @$.canvas.height = ev.target.offsetHeight

    @redraw()

  _throttledRedraw: () ->

    return unless @ctx?

    console.time('adjs redraw')

    @_layoutCenters()

    @ctx.clearRect(0, 0, @$.canvas.width, @$.canvas.height)

    for adjId, adj of @adjs

      ctr = adj.getCenter()

      target = adj.getTarget()

      @_drawConnector(ctr, target)

</dom-module>

<script src="/lib/async/dist/async.js"></script>

<script src="/lib/knockout/dist/knockout.js"></script>

<script src="/lib/shortcut/index.js"></script>

<script src="/lib/sylvester/sylvester.js"></script>

<script src="/lib/underscore/underscore-min.js"></script>

<script src="/node_modules/d3/dist/d3.min.js"></script>

<script src="/node_modules/n3/n3-browser.js"></script> 

<script src="/node_modules/pixi.js/dist/pixi.min.js"></script>

<script src="../coffee_element.js"></script>

<script src="viewstate.js"></script>

<script src="adjustable.js"></script>

<script src="adjusters.js"></script>

<script src="timeline.js"></script>

<script src="cursor_canvas.js"></script>