# HG changeset patch
# User drewp@bigasterisk.com
# Date 2018-04-26 05:40:12
# Node ID 53f751982ddfac80bd01a6190717767aaeaa87b8
# Parent 6fa4288da8a69e7983f749e0fdbfa7726fdceb55
WIP polymer2 upgrade, timeline rewrite
Ignore-this: 73b86663c0dcb783c9c6e65f6be901a
diff --git a/light9/web/edit-choice-demo.html b/light9/web/edit-choice-demo.html
new file mode 100644
--- /dev/null
+++ b/light9/web/edit-choice-demo.html
@@ -0,0 +1,29 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ edit-choice:
+
+
+ this has a label
+
+
+
+
diff --git a/light9/web/edit-choice.coffee b/light9/web/edit-choice.coffee
--- a/light9/web/edit-choice.coffee
+++ b/light9/web/edit-choice.coffee
@@ -34,7 +34,10 @@ window.setupDrop = (senseElem, highlight
else
null
- onDrop(uri, pos)
+ try
+ onDrop(uri, pos)
+ catch e
+ console.log(e)
unhighlight()
diff --git a/light9/web/lib/bower.json b/light9/web/lib/bower.json
--- a/light9/web/lib/bower.json
+++ b/light9/web/lib/bower.json
@@ -1,14 +1,14 @@
{
"name": "3rd-party libs",
"dependencies": {
- "polymer": "~1.4.0",
- "paper-slider": "PolymerElements/paper-slider#~1.0.11",
- "iron-ajax": "PolymerElements/iron-ajax#~1.2.0",
- "jquery": "^3.2.1",
+ "polymer": "2.6.0",
+ "paper-slider": "PolymerElements/paper-slider#~2.0.6",
+ "iron-ajax": "PolymerElements/iron-ajax#~2.1.3",
+ "jquery": "^3.3.1",
"underscore": "~1.8.3",
"jquery-ui": "~1.11.4",
"QueryString": "http://unixpapa.com/js/QueryString.js",
- "knockout": "knockoutjs#^3.4.0",
+ "knockout": "knockoutjs#^3.4.2",
"sylvester": "~0.1.3",
"d3": "https://github.com/d3/d3.git#e7194db33090a0afc06c77a959594361ffb949df",
"rdflib.js": "https://github.com/linkeddata/rdflib.js.git#920e59fe37",
@@ -16,24 +16,26 @@
"N3.js": "https://github.com/RubenVerborgh/N3.js.git#04f4e21f4ccb351587dc00a3f26340b28d4bb10f",
"shortcut": "http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js",
"async": "https://github.com/caolan/async.git#^1.5.2",
- "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.3",
- "paper-radio-button": "PolymerElements/paper-radio-button#^1.2.2",
- "paper-button": "PolymerElements/paper-button#^1.0.12",
- "paper-dialog": "PolymerElements/paper-dialog#^1.0.4",
- "paper-radio-group": "PolymerElements/paper-radio-group#^1.2.2",
+ "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^2.1.0",
+ "paper-radio-button": "PolymerElements/paper-radio-button#^2.1.0",
+ "paper-button": "PolymerElements/paper-button#^2.1.0",
+ "paper-dialog": "PolymerElements/paper-dialog#^2.1.0",
+ "paper-radio-group": "PolymerElements/paper-radio-group#^2.1.0",
"color": "https://github.com/One-com/one-color.git#^3.0.4",
- "paper-listbox": "PolymerElements/paper-listbox#1.1.3",
- "paper-item": "PolymerElements/paper-item#1.2.2",
+ "paper-listbox": "PolymerElements/paper-listbox#2.1.0",
+ "paper-item": "PolymerElements/paper-item#2.1.0",
+ "paper-styles": "PolymerElements/paper-styles#^2.1.0",
"isotope": "^3.0.4",
"isotope-fit-columns": "^1.1.3",
"jquery.columnizer": "https://github.com/adamwulf/Columnizer-jQuery-Plugin.git#^1.6.2"
},
"resolutions": {
- "paper-styles": "^1.1.4",
"rdflib.js": "920e59fe37",
"d3": "e7194db33090a0afc06c77a959594361ffb949df",
- "webcomponentsjs": "^0.7.24",
- "polymer": "^1.2.1",
- "jquery": "^3.2.1"
+ "jquery": "^3.2.1",
+ "webcomponentsjs": "^v1.1.0",
+ "paper-radio-button": "^2.1.0",
+ "iron-resizable-behavior": "^2.1.0",
+ "polymer": "2.6.0"
}
}
diff --git a/light9/web/resource-display.html b/light9/web/resource-display.html
--- a/light9/web/resource-display.html
+++ b/light9/web/resource-display.html
@@ -54,6 +54,7 @@
return minor ? 'resource minor' : 'resource';
},
onUri: function(graph, uri) {
+ if (!this.graph) return;
this.graph.runHandler(this.setLabel.bind(this), `label ${this.uri}`);
},
setLabel: function() {
diff --git a/light9/web/timeline/timeline-elements.html b/light9/web/timeline/timeline-elements.html
--- a/light9/web/timeline/timeline-elements.html
+++ b/light9/web/timeline/timeline-elements.html
@@ -29,6 +29,9 @@
light9-timeline-time-zoomed {
flex-grow: 1;
}
+ #coveredByDiagram {
+ position: relative;
+ }
#dia, #adjusters, #cursorCanvas, #adjustersCanvas {
position: absolute;
left: 0; top: 0; right: 0; bottom: 0;
@@ -52,24 +55,26 @@
[[debug]]
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
@@ -107,17 +112,6 @@
zoom="{{zoomFlattened}}">
-
-
-
-
@@ -212,19 +206,6 @@
-
-
-
-
-
-
-
-
-
+
diff --git a/light9/web/timeline/timeline.coffee b/light9/web/timeline/timeline.coffee
--- a/light9/web/timeline/timeline.coffee
+++ b/light9/web/timeline/timeline.coffee
@@ -3,24 +3,6 @@ RDF = 'http://www.w3.org/1999/02/22-rdf-
Drawing = window.Drawing
ROW_COUNT = 7
-# 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
-
- for uri in _.difference(childUris, newUris)
- childByUri[uri].detached()
- ko.removeNode(childByUri[uri])
- for uri in _.difference(newUris, childUris)
- parent.appendChild(makeChild(uri))
-
Polymer
is: 'light9-timeline-editor'
@@ -287,9 +269,11 @@ Polymer
dia: { type: Object, notify: true }
song: { type: String, notify: true }
zoomInX: { type: Object, notify: true }
- rows: { value: [0...ROW_COUNT] }
zoom: { type: Object, notify: true, observer: 'onZoom' } # viewState.zoomSpec
zoomFlattened: { type: Object, notify: true }
+ observers: [
+ 'onGraph(graph, dia, setAdjuster, song, zoomInX)'
+ ]
onZoom: ->
updateZoomFlattened = ->
log('updateZoomFlattened')
@@ -297,6 +281,17 @@ Polymer
ko.computed(updateZoomFlattened.bind(@))
ready: ->
+ onGraph: ->
+ U = (x) => @graph.Uri(x)
+ log('assign rows',@song)
+
+ 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)
+
+ @rows = (new NoteRow(@graph, @dia, @song, @zoomInX, @noteUris, i, @selection) for i in [0...ROW_COUNT])
+
attached: ->
root = @closest('light9-timeline-editor')
@@ -389,24 +384,15 @@ Polymer
# light9-timeline-editor does our drawing work.
-Polymer
- is: 'light9-timeline-graph-row'
- behaviors: [ Polymer.IronResizableBehavior ]
- properties:
- graph: { type: Object, notify: true }
- dia: { type: Object, notify: true }
- song: { type: String, notify: true }
- zoomInX: { type: Object, notify: true }
- noteUris: { type: Array, notify: true }
- rowIndex: { type: Object, notify: true }
- selection: { type: Object, notify: true }
+class NoteRow
+ constructor: (@graph, @dia, @song, @zoomInX, @noteUris, @rowIndex, @selection) ->
+ @graph.runHandler(@update.bind(@), "row notes #{@rowIndex}")
+
observers: [
- 'onGraph(graph, dia, setAdjuster, song, zoomInX)'
'observedUpdate(graph, song, rowIndex)'
'onZoom(zoomInX)'
]
- onGraph: ->
- @graph.runHandler(@update.bind(@), "row notes #{@rowIndex}")
+
observedUpdate: (graph, song, rowIndex) ->
@update() # old behavior
@@ -422,26 +408,19 @@ Polymer
notesForThisRow.push(n)
i++
- updateChildren @, notesForThisRow, (newUri) =>
- child = document.createElement('light9-timeline-note')
- child.graph = @graph
- child.selection = @selection
- child.dia = @dia
- child.uri = newUri
- child.setAdjuster = @setAdjuster
- child.song = @song # could change, but all the notes will be rebuilt
- child.zoomInX = @zoomInX # missing binding; see onZoom
- return child
+ for newUri in notesForThisRow
+ #should only make new ones
+ child = new Note(@graph, @selection, @dia, newUri, @setAdjuster, @song, @zoomInX)
onZoom: ->
for e in @children
e.zoomInX = @zoomInX
-
-Polymer
+class Note
+ constructor: (@graph, @selection, @dia, @uri, @setAdjuster, @song, @zoomInX)->0
is: 'light9-timeline-note'
behaviors: [ Polymer.IronResizableBehavior ]
- listeners: 'iron-resize': 'update'
+ listeners: 'iron-resize': 'update' #move to parent elem
properties:
graph: { type: Object, notify: true }
selection: { type: Object, notify: true }