I/O parsers

[wilzbach]

I found a bit of time to play with different ways to integrate BioJS I/O parser as web components: https://github.com/greenify/biojs3-parser-test

This is not (yet) a nice library that can be reused, but the following already works:

(for simplicity I have used just a whitespace splitter and not a real FASTA parser)

Basic custom elements

Using the url attribute

<biojs-vis-msa>
    <biojs-io-fasta url="./foo.fasta" />
</biojs-vis-msa>

Note: custom elements always need to be closed.
However once the parent gets closed, they will be closed too :)

Using textContent

<biojs-vis-msa>
    <biojs-io-fasta>
       some inner text
    </biojs-io-fasta>
</biojs-vis-msa>

Data binding between components (with Polymer)

Putting the parser as child of one visualization

<template is="dom-bind">
    <biojs-vis-msa id="msa1" seqs="{{seqs}}">
        <biojs-io-fasta url="./foo.fasta" />
    </biojs-vis-msa>

    <biojs-vis-msa id="msa2" seqs="{{seqs}}"></biojs-vis-msa>
</template>

Having the parser on the same level

<template is="dom-bind">

    <biojs-vis-msa id="msa1" seqs="{{seqs}}"></biojs-vis-msa>
    <biojs-vis-msa id="msa2" seqs="{{seqs}}"></biojs-vis-msa>

    <biojs-io-fasta url="./foo.fasta" data="{{seqs}}"/>
</template>

What is missing?

• handling of output (aka "reverse-parsing")
• making it more generic (as a Polymer behavior, a normal factory, ...)
• wrapping the same functionality of the original parser
• maybe using iron-async instead of xhr
• adding as setup to distribute the parser on bower as well as npm
• maybe we can create the io parser lib without Polymer
• maybe for convenience we want to support url directly in the component (e.g. msa)