log = console.log

RDF = 'http://www.w3.org/1999/02/22-rdf-syntax-ns#'

# polymer dom-repeat is happy to shuffle children by swapping their

# attribute values, and it's hard to correctly setup/teardown your

# side effects if your attributes are changing before the detach

# call. This alternative to dom-repeat never reassigns

# attributes. But, it can't set up property bindings.

updateChildren = (parent, newUris, makeChild) ->

  childUris = []

  childByUri = {}

  for e in parent.children

    childUris.push(e.uri)

    childByUri[e.uri] = e

    zoomInX: {type: Object, notify: true}

  width: ko.observable(1)

  listeners:

    'iron-resize': '_onIronResize'

  observers: [

    'setSong(playerSong, followPlayerSong)'

    ]

  _onIronResize: ->

    @width(@offsetWidth)

  _onSongTime: (t) ->

    @viewState.cursor.t(t)

  _onSongDuration: (d) ->

    @viewState.zoomSpec.duration(d)

  setSong: (s) ->

    @song = @playerSong if @followPlayerSong

  ready: ->

    window.debug_zoomOrLayoutChangedCount = 0

    window.debug_adjUpdateDisplay = 0

    @viewState =

      zoomSpec:

        duration: ko.observable(100)

        t1: ko.observable(0) # need validation to stay in bounds and not go too close

    # not working yet

    #if @patchCouldAffectMe(patch)

    #  return

    if @isDetached?

      log('skipping update', @uri)

      return 

    # update our note DOM and SVG elements based on the graph

    U = (x) -> @graph.Uri(x)

    yForV = (v) => @offsetTop + (1 - v) * @offsetHeight

    originTime = @graph.floatValue(@uri, U(':originTime'))

    for curve in @graph.objects(@uri, U(':curve'))

      if @graph.uriValue(curve, U(':attr')) == U(':strength')

    U = (x) -> @graph.Uri(x)

    worldPts = getCurvePoints(@graph, curve, originTime) # (song time, value)

    curveWidth = =>

      tMin = @graph.floatValue(worldPts[0].uri, U(':time'))

      tMax = @graph.floatValue(worldPts[3].uri, U(':time'))

      tMax - tMin            

    screenPts = ($V([@zoomInX(pt.e(1)), @offsetTop + (1 - pt.e(2)) * @offsetHeight]) for pt in worldPts)

    @dia.setNote(@uri, screenPts, label)

    leftX = Math.max(2, screenPts[1].e(1) + 5)

    rightX = screenPts[2].e(1) - 5

    w = 114

    h = 80

    @inlineRect = {

      left: leftX,

      top: @offsetTop + @offsetHeight - h - 5,

      width: w,

      height: h,

      display: if rightX - leftX > w then 'block' else 'none'

      }

      @clearAdjusters()

      # also kill their connectors

      return

    @makeCurveAdjusters(curveWidth, yForV, worldPts)

  makeCurveAdjusters: (curveWidth, yForV, worldPts) ->

    U = (x) -> @graph.Uri(x)

    if 0

      @adjusterIds[@uri+'/offset'] = true

      @setAdjuster(@uri+'/offset', => new AdjustableFloatObject({

    for suff in suffixes

      elem = @elemById[uri+suff]

      if elem

        elem.remove()

        delete @elemById[uri+suff]

  anyPointsInView: (pts) ->

    for pt in pts

      if pt.e(1) > -100 && pt.e(1) < 2500

        return true

    return false

    areaId = uri + '/area'

    labelId = uri + '/label'

    if not @anyPointsInView(curvePts)

      @clearElem(uri, ['/area', '/label'])

      return

    # for now these need to be pretty transparent since they're

    # drawing on top of the inline-attrs widget :(

    elem = @getOrCreateElem(areaId, 'notes', 'path',

    elem.setAttribute('d', svgPathFromPoints(curvePts))

    #elem = @getOrCreateElem(uri+'/label', 'noteLabels', 'text', {style: "font-size:13px;line-height:125%;font-family:'Verana Sans';text-align:start;text-anchor:start;fill:#000000;"})

    #elem.setAttribute('x', curvePts[0].e(1)+20)

    #elem.setAttribute('y', curvePts[0].e(2)-10)

    #elem.innerHTML = effectLabel;

  setCursor: (y1, h1, y2, h2, fullZoomX, zoomInX, cursor) ->

    @cursorPath =

      top: @querySelector('#cursor1')

      mid: @querySelector('#cursor2')

      bot: @querySelector('#cursor3')