standalone javascript library

[MrTomRod]

Hello!

I'm building a software called OpenGenomeBrowser, which has a MSA feature (example). Currently, I use MSAViewer, but I'm thinking about replacing it with something better that can also display phylogenetic trees.

Your tools (/fna-viewer) seems to be what I'm looking for. Can your library be used as standalone library or does it only work with node/yarn?

Best, MrTomRod

[stephenshank]

Dear @MrTomRod,

Thanks for your interest in alignment.js!

Can you clarify exactly what you mean by standalone library? Since you are seeking to avoid node/yarn, and also from looking at the link you provided, I assume you are developing a more classical web application. As such, this will require bundled JavaScript and CSS files that can be accessed via script and link tags, respectively.

If so, this is actually something I was working on earlier this week and am near finished. I'd be happy to bump it up in priority and organize a release with some documentation of the features that you'll need.

It also seems like you'll want an amino-acid alignment with a phylogenetic tree. All these features are there, they just need to be put together.

Please let me know your exact use case, I am happy to chat further and believe this project could suit your needs.

Best,
Stephen

[MrTomRod]

That sounds fantastic!

No need to hurry, I don't have too much time at the moment. Of course, if I end up using your library, I will cite your work.

My requirements

• visualize nucleic acid and protein alignments (e.g. multi-fasta format)
• visualize phylogenetic tree (e.g. Newick format)
• ability to scroll in the MSA horizontally without specialized mouse (add scroll bar to canvas?)
• ideally: control the looks (width of the plot, font size, size of the nucleic acid/protein boxes)
• fix small bug, see below (Top: Chrome, bottom: Firefox)

What I meant with standalone library

CSS files that can be accessed via script and link tags, respectively

I think you have the right idea. My software is based on Django. This is, more or less, how I use my current library:

<link rel="stylesheet" type="text/css" href="/alignment-js.css">
<script src="/alignment-js.js"></script>
<script>
const targetDiv = document.getElementById ('target')
alignmentJs({
    data: {
      alignment:  /* some alignment file, e.g. in aligned FASTA format */
        ">A\nAAAGAG..AATCC...",
      newick: "(A:0.1,B:0.2,(C:0.3,D:0.4):0.5);"
      }
    },
    config: {
      parent: targetDiv
    }
})
</script>

Something similar would be great. I don't think I can use your library as a node component via Django. (?)

Thanks a lot for your time,
MrTomRod