Changeset - e0e5f2dce1a6
Parent rev.
Child rev.
[Not reviewed]
default
0 1 0
Drew Perttula - 7 years ago 2018-05-08 06:24:37
drewp@bigasterisk.com
get some notes drawing, barely
Ignore-this: c4c667e1edab798c28c0a7416ffe2e09
1 file changed with 34 insertions and 27 deletions:
light9/web/timeline/timeline.coffee
34
27
0 comments (0 inline, 0 general)
light9/web/timeline/timeline.coffee
➞
Show inline comments
 
@@ -70,14 +70,15 @@ class Project
 
    @graph.applyAndSendPatch(patch)
 
 
  getCurvePoints: (curve, xOffset) ->
 
    worldPts = []
 
    uris = @graph.objects(curve, @graph.Uri(':point'))
 
    for pt in uris
 
      v = $V([xOffset + @graph.floatValue(pt, @graph.Uri(':time')),
 
              @graph.floatValue(pt, @graph.Uri(':value'))])
 
      tm = @graph.floatValue(pt, @graph.Uri(':time'))
 
      val = @graph.floatValue(pt, @graph.Uri(':value'))
 
      v = $V([xOffset + tm, val])
 
      v.uri = pt
 
      worldPts.push(v)
 
    worldPts.sort((a,b) -> a.e(1) > b.e(1))
 
    return [uris, worldPts]
 

			




	
	
	
		
 
  curveWidth: (worldPts) ->

			




	
	
		
 
@@ -95,12 +96,13 @@ class TimelineEditor extends Polymer.Ele

			




	
	
	
		
 
  @is: 'light9-timeline-editor'

			




	
	
	
		
 
  @behaviors: [ Polymer.IronResizableBehavior ]

			




	
	
	
		
 
  @properties:

			




	
	
	
		
 
    viewState: { type: Object }

			




	
	
	
		
 
    debug: {type: String}

			




	
	
	
		
 
    graph: {type: Object, notify: true}

			




	
	
	
		
 
    project: {type: Object}

			




	
	
	
		
 
    setAdjuster: {type: Function, notify: true}

			




	
	
	
		
 
    playerSong: {type: String, notify: true}

			




	
	
	
		
 
    followPlayerSong: {type: Boolean, notify: true, value: true}

			




	
	
	
		
 
    song: {type: String, notify: true}

			




	
	
	
		
 
    show: {value: 'http://light9.bigasterisk.com/show/dance2017'}

			




	
	
	
		
 
    songTime: {type: Number, notify: true, observer: '_onSongTime'}

			




	
	
		
 
@@ -110,24 +112,26 @@ class TimelineEditor extends Polymer.Ele

			




	
	
	
		
 
    zoomInX: {type: Object, notify: true}

			




	
	
	
		
 
    selection: {type: Object, notify: true}

			




	
	
	
		
 
  width: ko.observable(1)

			




	
	
	
		
 
  @listeners:

			




	
	
	
		
 
    'iron-resize': '_onIronResize'

			




	
	
	
		
 
  @observers: [

			




	
	
	
		
 
    'setSong(playerSong, followPlayerSong)'

			




	
	
	
		
 
    'setSong(playerSong, followPlayerSong)',

			




	
	
	
		
 
    'onGraph(graph)',

			




	
	
	
		
 
    ]

			




	
	
	
		
 
  _onIronResize: ->

			




	
	
	
		
 
    @width(@offsetWidth)

			




	
	
	
		
 
  _onSongTime: (t) ->

			




	
	
	
		
 
    @viewState.cursor.t(t)

			




	
	
	
		
 
    #@viewState.cursor.t(t)

			




	
	
	
		
 
  _onSongDuration: (d) ->

			




	
	
	
		
 
    d = 700 if d < 1 # bug is that asco isn't giving duration, but 0 makes the scale corrupt

			




	
	
	
		
 
    @viewState.zoomSpec.duration(d)

			




	
	
	
		
 
    #@viewState.zoomSpec.duration(d)

			




	
	
	
		
 
  setSong: (s) ->

			




	
	
	
		
 
    @song = @playerSong if @followPlayerSong

			




	
	
	
		
 

			




	
	
	
		
 
  onGraph: (graph) ->

			




	
	
	
		
 
    @project = new Project(graph)

			




	
	
	
		
 
  connectedCallback: ->

			




	
	
	
		
 
    super.connectedCallback()

			




	
	
	
		
 
    ko.options.deferUpdates = true;

			




	
	
	
		
 
    @selection = {hover: ko.observable(null), selected: ko.observable([])}

			




	
	
	
		
 

			




	
	
	
		
 
    window.debug_zoomOrLayoutChangedCount = 0

			




	
	
		
 
@@ -161,19 +165,20 @@ class TimelineEditor extends Polymer.Ele

			




	
	
	
		
 
     #{elemCount('light9-timeline-graph-row')} rows,

			




	
	
	
		
 
     #{window.debug_adjsCount} adjuster items registered,

			




	
	
	
		
 
     #{window.debug_adjUpdateDisplay} adjuster updateDisplay calls,

			




	
	
	
		
 
    "

			




	
	
	
		
 
    

			




	
	
	
		
 
  attached: ->

			




	
	
	
		
 
    super()

			




	
	
	
		
 
    @dia = @$.dia

			




	
	
	
		
 
    ko.computed(@zoomOrLayoutChanged.bind(@))

			




	
	
	
		
 
    ko.computed(@songTimeChanged.bind(@))

			




	
	
	
		
 

			




	
	
	
		
 
    @trackMouse()

			




	
	
	
		
 
    @bindKeys()

			




	
	
	
		
 
    @bindWheelZoom(@dia.querySelector('svg'))

			




	
	
	
		
 
    @bindWheelZoom(@dia)

			




	
	
	
		
 
    @forwardMouseEventsToAdjustersCanvas()

			




	
	
	
		
 

			




	
	
	
		
 
    @makeZoomAdjs()

			




	
	
	
		
 

			




	
	
	
		
 
    zoomed = @$.zoomed

			




	
	
	
		
 
    setupDrop(@$.dia.querySelector('svg'), zoomed.$.rows, @, zoomed.onDrop.bind(zoomed))

			




	
	
		
 
@@ -360,48 +365,49 @@ class TimeZoomed extends Polymer.Element

			




	
	
	
		
 
    dia: { type: Object, notify: true }

			




	
	
	
		
 
    song: { type: String, notify: true }

			




	
	
	
		
 
    zoomInX: { type: Object, notify: true }

			




	
	
	
		
 
    zoom: { type: Object, notify: true, observer: 'onZoom' } # viewState.zoomSpec

			




	
	
	
		
 
    zoomFlattened: { type: Object, notify: true }

			




	
	
	
		
 
  @observers: [

			




	
	
	
		
 
    'onGraph(graph, setAdjuster, song, zoomInX)'

			




	
	
	
		
 
    'onGraph(graph, setAdjuster, song, zoomInX, project)'

			




	
	
	
		
 
  ]

			




	
	
	
		
 
  @listeners: {'iron-resize': 'update'}

			




	
	
	
		
 
  update: ->

			




	
	
	
		
 
    @renderer.resize(@clientWidth, @clientHeight)

			




	
	
	
		
 
    @renderer.render(@stage)

			




	
	
	
		
 

			




	
	
	
		
 
  onZoom: ->

			




	
	
	
		
 
    updateZoomFlattened = ->

			




	
	
	
		
 
      log('updateZoomFlattened')

			




	
	
	
		
 
      @zoomFlattened = ko.toJS(@zoom)

			




	
	
	
		
 
    ko.computed(updateZoomFlattened.bind(@))

			




	
	
	
		
 

			




	
	
	
		
 
  constructor: ->

			




	
	
	
		
 
    super()

			




	
	
	
		
 
    @stage = new PIXI.Container()

			




	
	
	
		
 
    

			




	
	
	
		
 
  connectedCallback: ->

			




	
	
	
		
 
     super.connectedCallback()

			




	
	
	
		
 

			




	
	
	
		
 
     @stage = new PIXI.Container()

			




	
	
	
		
 
     

			




	
	
	
		
 
     @renderer = PIXI.autoDetectRenderer({

			




	
	
	
		
 
    @renderer = PIXI.autoDetectRenderer({

			




	
	
	
		
 
         backgroundColor: 0xff6060,

			




	
	
	
		
 
  

			




	
	
	
		
 
     })

			




	
	
	
		
 
    })

			




	
	
	
		
 
     

			




	
	
	
		
 
  connectedCallback: ->

			




	
	
	
		
 
    super.connectedCallback()

			




	
	
	
		
 
     

			




	
	
	
		
 
     @$.rows.appendChild(@renderer.view);

			




	
	
	
		
 
   

			




	
	
	
		
 

			




	
	
	
		
 
     # iron-resize should be doing this but it never fires

			




	
	
	
		
 
     setInterval(@update.bind(@), 1000)

			




	
	
	
		
 
    @$.rows.appendChild(@renderer.view);

			




	
	
	
		
 
  

			




	
	
	
		
 
    # iron-resize should be doing this but it never fires

			




	
	
	
		
 
    setInterval(@update.bind(@), 1000)

			




	
	
	
		
 
    

			




	
	
	
		
 
  onGraph: ->

			




	
	
	
		
 
    @graph.runHandler(@gatherNotes.bind(@), 'zoom notes')

			




	
	
	
		
 
  gatherNotes: ->

			




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

			




	
	
	
		
 

			




	
	
	
		
 
    log('assign rows',@song, 'graph has', @graph.quads().length)

			




	
	
	
		
 
    graphics = new PIXI.Graphics()

			




	
	
	
		
 
    graphics = new PIXI.Graphics({nativeLines: true})

			




	
	
	
		
 

			




	
	
	
		
 
    for uri in _.sortBy(@graph.objects(@song, U(':note')), 'uri')

			




	
	
	
		
 
      #should only make new ones

			




	
	
	
		
 
      # 

			




	
	
	
		
 
      child = new Note(@graph, @selection, @dia, uri, @setAdjuster, @song, @zoomInX)

			




	
	
	
		
 
      log('note ',uri)

			




	
	
		
 
@@ -409,23 +415,23 @@ class TimeZoomed extends Polymer.Element

			




	
	
	
		
 
      effect = @graph.uriValue(uri, U(':effectClass'))

			




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

			




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

			




	
	
	
		
 

			




	
	
	
		
 
          [@pointUris, @worldPts] = @project.getCurvePoints(curve, originTime)

			




	
	
	
		
 
          curveWidthCalc = () => @_curveWidth(@worldPts)

			




	
	
	
		
 
      

			




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

			




	
	
	
		
 

			




	
	
	
		
 
          h = 150 #@offsetHeight

			




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

			




	
	
	
		
 

			




	
	
	
		
 
          graphics.beginFill(0xFF3300);

			




	
	
	
		
 
          graphics.lineStyle(2, 0xffd900, 1);

			




	
	
	
		
 
          graphics.lineStyle(4, 0xffd900, 1)

			




	
	
	
		
 

			




	
	
	
		
 
          graphics.moveTo(screenPts[0].e(1), screenPts[0].e(2))

			




	
	
	
		
 
          for p in screenPts

			




	
	
	
		
 
          for p in screenPts.slice(1)

			




	
	
	
		
 
            graphics.lineTo(p.e(1), p.e(2))

			




	
	
	
		
 
         graphics.endFill();

			




	
	
	
		
 
         graphics.endFill()

			




	
	
	
		
 
    

			




	
	
	
		
 
     @rows = []#(new NoteRow(@graph, @dia, @song, @zoomInX, @noteUris, i, @selection) for i in [0...ROW_COUNT])

			




	
	
	
		
 

			




	
	
	
		
 

			




	
	
	
		
 

			




	
	
	
		
 
     @stage.children.splice(0)

			




	
	
		
 
@@ -570,13 +576,14 @@ class Note

			




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

			




	
	
	
		
 

			




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

			




	
	
	
		
 
        @_updateAdjusters(screenPts, curveWidthCalc, yForV, U(@song))

			




	
	
	
		
 
        @_updateInlineAttrs(screenPts)

			




	
	
	
		
 
        

			




	
	
	
		
 
  _updateAdjusters: (screenPts, curveWidthCalc, yForV, ctx) ->   

			




	
	
	
		
 
    return

			




	
	
	
		
 
  _updateAdjusters: (screenPts, curveWidthCalc, yForV, ctx) ->

			




	
	
	
		
 
    if screenPts[screenPts.length - 1].e(1) - screenPts[0].e(1) < 100

			




	
	
	
		
 
      @clearAdjusters()

			




	
	
	
		
 
    else

			




	
	
	
		
 
      @_makeOffsetAdjuster(yForV, curveWidthCalc, ctx)

			




	
	
	
		
 
      @_makeCurvePointAdjusters(yForV, @worldPts, ctx)

			




	
	
	
		
 
      @_makeFadeAdjusters(yForV, ctx)

			




        

    



    


    



    



      

      





    
    0 comments (0 inline, 0 general)
    





    


  

  







  


    




    








    
        Server instance: kallithea-749ff669b6-v9g5f-75
    
    
        This site is powered by
            Kallithea 0.7.0,
        which is
        © 2010–2021 by various authors & licensed under GPLv3.
            – Support