On top of spaghetti…
As a bit of variety from working on the server side of Seki I’ve been looking at a bit of client code. One thing I want to be able to do is create outlines, very much like Workflowy (I’ve been using that for a while now, very handy). It is part of a bigger picture, more on that later, but the immediate problem was to be able to make outlines in the browser and represent them in RDF.
I actually worked on something very similar nearly 10 years ago : XOW. That time around I worked with the DOM and serialised to RDF/XML using XSLT on the XHTML result.
This time I’ve been using HTML5, jQuery and Turtle. I’m pretty new to jQuery so it’s been slow progress, but I progress I have made. Still loads more UI work to do but I just tried a serialisation. Here’s the sample outline:
which on a first pass at serialisation looks like this:
@prefix dc: <http://purl.org/dc/terms/> .
@prefix ts: <http://hyperdata.org/trellis/> . <http://hyperdata.org/nid-2013-11-06-17-46-54-255-0369> a ts:Node;
dc:title "Add priority number to each line 1-5" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-255-0000> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-261-8067> a ts:Node;
dc:title "Add copy and paste" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-255-0000> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-265-8865> a ts:Node;
dc:title "Three" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-261-8067> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-265-5134> a ts:Node;
dc:title "Four" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-265-8865> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-266-1939> a ts:Node;
dc:title "Five" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-265-8865> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-266-7852> a ts:Node;
dc:title "Six" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-265-8865> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-267-2310> a ts:Node;
dc:title "Seven" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-261-8067> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-268-9847> a ts:Node;
dc:title "Eight" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-261-8067> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-268-7935> a ts:Node;
dc:title "Nine" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-255-0000> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-269-7831> a ts:Node;
dc:title "Ten" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-268-7935> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-269-7830> a ts:Node;
dc:title "Eleven" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-268-7935> .
<http://hyperdata.org/nid-2013-11-06-17-46-54-269-7829> a ts:Node;
dc:title "Twelve" ;
ts:parent <http://hyperdata.org/nid-2013-11-06-17-46-54-268-7935> .
Hmm. So how do I check it, being lazy? Ran it through a Turtle-RDF/XML converter/validator, then into the W3C’s validator to get a visual.
Hmm. Guess I’ll check the Turtle after all.
It’s easy to see why people might get put off RDF, it does look pretty monstrous. But to get the same addressability e.g. using JSON would need pretty much an identical level of complexity, without the potentially for reusability without building from scratch.
Whatever, I haven’t yet decided on how ultimately I’ll do comms with the server. Workflowy appears to poll for changes then pushes diffs as JSON over a POST. I might well end up doing that too (though more likely as JSON-LD, or perhaps even RDFa) but did need to sort out the RDF representation.
