At the EBI we need to set an EBI proxy server if we want to use a proxy. For the PHP proxy used in BioJS we do something like ...

$proxy = "http://wwwcache.ebi.ac.uk:3128/";
curl_setopt($ch, CURLOPT_PROXY, "$proxy");

Here the code of this proxy ...
https://github.com/biojs/biojs/blob/master/src/main/resources/dependencies/proxy/proxy.php

If you want the EBI registry to be able to use the Kegg proxy ....

https://github.com/biojs/biojs/blob/master/src/main/resources/dependencies/proxy/proxyKegg.php

... we would need a similar way to provide such proxy server.

http://cdnjs.com (https://github.com/cdnjs/cdnjs) allows free CDN hosting for popular JS libraries via a pull request on github.

Depends on: "Create a single minimized/uglified version of BioJS"

http://localhost/git/biojs/biojs/target/biojs/dependencies/graphics/raphael-2.1.2.js 404 (Not Found) Biojs.SimpleFeatureViewer.html:68

It think it would be nice to create several examples of how to use BioJS with jsFiddle. Here an example of a loading screen in jsFiddle ...

http://jsfiddle.net/TGcv5/

Maybe we could add one or more than one of this links with BioJS examples in the registry.

Reported by rajido, Jun 17, 2012 (Google code -> Github migration)

(meta bug to track all open issues for the next big release: biojs 2.0)

• Events.json
• review tutorial
• more migrated components
• visualization guides? (e.g. edu)
• getting started for lazy dev
• Event system?
• Gold standard
• Example projects
• integration guides

https://github.com/orgs/biojs/teams

• What is the difference between Owner and Contributor?
• How does one get Owner or Contributor ?

In short we should have a short, clear and open policy about our different github groups.

For the education pages I suggested that everyone who made a successful pull request, gets write access, that is why there is an additional "edu" group.

Cannot find anything as of now: http://registry.biojs.net/client/#/

Would be great to have an example project following all the standards. Then people can download and get started!

Other projects' examples:

• http://html5boilerplate.com
• https://github.com/backbone-boilerplate/backbone-boilerplate

The idea is to have a JS playground (like JSFiddle) for the components aimed at newbies and as well as normal users.

For each component we want to generate automatically a sandbox.
The approach would be to do this generation during the maven build process.
As backend (jsbin uses PHP or NodeJS) we would use our BioJS.net-Server.
A quick and dirty solution could be insert to insert the code directly to the "sandbox" SQL table.

From my point the daily run of our scripts is a tricky part. We could simply delete all sandbox files of this specific users (e.g. autobiojs).

Other solutions and suggestions to this issue are highly encouraged.

Libraries for the sandbox could be

• http://jsbin.com/ (probably the best open source library?)
• http://cssdesk.com/
• using the JSFiddle API (not ideal, leading to dependency on a commercial third-party)

If one accesses the demo page at https://www.ebi.ac.uk/Tools/biojs/registry/Biojs.DNAContentViewer.html via HTTPS (which seems to be the default if you get there via Google) the demo will not load due to D3.js being loaded via HTTP and therefore blocked on HTTPS pages.

It will be same for other components using D3

we should tell people how to make their component easy to integrate via the BioJS event object

• angularjs
• jquery
• vanilla
• polymer

In the new registry, in the components table, would be possible to add a column with the latest updated date? Maybe it would be better to sort by date so the newest widgets get at the top.

Reported by rajido, Jun 19, 2012 (Google code -> Github migration)

There are WARNINGS about members of src/main/javascript/Biojs.Kegg.js already documented in other component Biojs.Cytoscape.

[WARNING] JSDoc Toolkit: Trying to document ready as a member of undocumented symbol options.
[WARNING] JSDoc Toolkit: Trying to document constructor as a member of undocumented symbol Biojs.Kegg.
[WARNING] JSDoc Toolkit: Trying to document opt as a member of undocumented symbol Biojs.Kegg.
[WARNING] JSDoc Toolkit: Trying to document eventTypes as a member of undocumented symbol Biojs.Kegg.

Reported by johncar, Jul 17, 2012 (Google code -> Github migration)

What steps will reproduce the problem?

1. Open the sequence component
2. Select fasta format
3. compare it with a fasta format somewhere else, e.g., UniProt

What is the expected output? What do you see instead?
I expect to see a plain fasta format, no extra spaces added.

Reported by leylajael, Mar 12, 2013

Felix's is great. We could fork it

• short: just the important stuff (and ppl will read)
• high quality: better than airbnb's

One meta packages could bundle all npm bio* parsers.

This bundled file could be used to deploy it on

• CDN #51
• Bower #38

Would be worth exploring how to make components we could plug to visualise outputs from Galaxy?

This is an open discussion issue. Feel free to share your opinion with us.

Problem

If one wants to combine two BioJS components that is moderately easy with events.
However this glue layer doesn't scale (in my eyes).

• With > 2 components it gets very hard to maintain and debug
  (see the examples below for an example)
• one can experience ping-pong events (a component backfires an event -> loop)
• a user will always be forced to write glue code

-> imho there should be only one model for the same data so that it is very easy to combine those components and the views only update itself on changes of the model.

Technical aspects

• Object.observe() (suggested by @mhelvens) Object.observe allows to listen to changes of any JS object. It is native in Chrome > 36 + part of the ES 6 (with a polyfill for older browsers).
• Backbone models. Backbone models use a set method for every change operation. On this set method all events are executed.

In the examples below you can see that whether the on method is provided by an model framework (e.g. Backbone) or one uses Object.observe(selection) isn't so important as long as there is a common model.

A list of more approaches to data binding can be found on Wikipedia.

Tricky (open): finding/agreeing on a common model

• Would you find it useful to agree on a model?
• Would you have (implementation) problems?
• Do you see problems for the the future or in your use cases?
• Do you like the current event system?
• Do you see a better solution?

-> share you opinion/experience with us.

Example depicting the different approaches

1. using events

(for simplicity we assume the existence of setSelection method).

msa.on("change:selection", function(seqs){
  tree.setSelection(seqs); 
  seqLogo.setSelection(seqs);
});

seqLogo.on("change:selection", function(seqs){
  msa.setSelection(seqs); 
  tree.setSelection(seqs); 
});

tree.on("change:selection", function(seqs){
  msa.setSelection(seqs); 
  seqLogo.setSelection(seqs); 
});

2. Using a common model

a) with a JS model framework (e.g. backbone)

selection.on("change", function(seqs){
  // one might translate the event here for different components
  msa.setSelection(selection.seqs); 
  tree.setSelection(selection.seqs); 
  seqLogo.setSelection(seqs);
});

b) with Object.observe

Object.observe(selection, function(changes){
  // one might translate the event here for different components
  msa.setSelection(selection.seqs); 
  tree.setSelection(selection.seqs); 
  seqLogo.setSelection(seqs);
});

Is it interesting for anyone to have a BioJS "menubuilder". The task of this module would be to help creating an interactive example menu for the demonstration of component features.
Please vote (+1) / comment on this (feel free to give additional feedback).

I know that there are many menu building tools at there, but this one should focus on making it very easy within the BioJS enviroment.

An example for a menu builder can be found at
https://github.com/greenify/biojs-vis-msa/tree/master/src/menu

The live example of this menu can be found at e.g.

http://workmen.biojs.net/demo/biojs-vis-msa/msa_show_menu

The component is not rendering properly, the console shows that the variable instance is not defined.

This would be a useful addition to the biojs parsers package
https://github.com/genentech/uniprot-js

It seems like the maven plugin that wraps JSdoc2 does not work well on windows since files are always located in the root of the generated folder.

It seems that the plugin is no longer being supported and outdated since it uses jsdoc2 instead of jsdoc3.

The registry link in the markdown is a dead link.

from this section of the readme
https://github.com/biojs/biojs#why-is-nothing-in-this-repo

just e.g's:

1. readme
2. docs
3. tests
4. biojs events documented

Pass the original jQuery event to the #onAnnotationClicked() event handler

Reported by pureza, Apr 17, 2013 (Google code -> Github migration)

Hello, first of all congratulations for your project. I hope it will grow and develop with the time. But right now I'm receiving a lot of errors. For example, when I try to open this link (http://www.ebi.ac.uk/Tools/biojs/registry/Biojs.Protein3D.html) on Chrome (the most used browser http://www.w3schools.com/browsers/browsers_stats.asp) I receive the following message:
"""
Sorry!

Your browser does not support AJAX!
please use another browser e.g. firefox, opera, MSIE(on Windows PC only)."""

Sometimes I get the message in firefox and chrome:
XML parser, the element type META must be terminated by the matching ... for file string ...

Opening this link(http://www.ebi.ac.uk/Tools/biojs/registry/Biojs.InteractionsTable.html) in Firefox i receive the error:
DataTables warning (table id = 'biojs_Table_0'): Requested unknown parameter '2' from the data source for row 0

Instead of focusing on visualization, you should focus on case studies explaning people why this visualization tool can help people to understand and interpret better their data.

If you guys are really serious about convincing people to join your project to contribute and help to fix this kind of problems you should consider moving it to Github.

I'm very impressed by the features, you just have to make it more appealing like the ones on this link: http://selection.datavisualization.ch/

Last thing, Google Code is not very friendly for Social Coding ...

Good luck with your project!

Reported by raonyguimaraes, Apr 6, 2013 (Google code -> Github migration)

There is a small typo in line 120 of Biojs.ExpressionAtlasBaselineSummary.js

It would be nice to have a 'biojs2-compliant' badge added to the README of the components.
This badge may be based on the checklist shown for each project in the registry (README, Demos, JsDocs, Build, Tests...) (and if it uses a correct event system?)

The benefit of this may be...
i) ... biojs2 discovery: linking the badge with the biojs2 page for that project
ii) ... component quality metrics: not only on the registry, but also in the component repo
iii) ... Motivate component developers to higher standards

For #51 (deployment of BioJS) to a CDN we need to submit a single compressed file. Ideally we would create this via our maven build

Are all these branches still in development?

• DNAContentViewer
• HeatmapViewer
• RB-1.0.0_beta
• pr/45
• rheaction
• rheaction-1.1.0
• trunk
• wigExplorer

It would be cool to have a comment system for the different components. Just an idea!

Reported by gustavoadolfo.salazar, Jun 15, 2012 (Google code -> Github migration)

Currently, the Sequence component receives an ID for the target element where the component will be rendered.

In my application, I need to create an arbitrary number of Sequence components, so this forces me to generate many unique IDs.

I think it would be more flexible if the Sequence component accepted an arbitrary jQuery selector as a target, so that I could use other attributes in identifying the element besides the ID.

Reported by pureza, Apr 19, 2013 (Google code -> Github migration)

When a web page integrates two different services, each needing authentication, then the AJAX calls should pass credentials. I understand that most bioinformatic services are public, but BioMedBridges is dealing with information about individual humans. Unlike other eukaryotes, we have privacy concerns!

I'm afraid I don't have a suggestion about how to implement this. Here are some complications.

The solution must not complicate the job of the service provider too much.

Apache Rave has similar goals to BioJS, and supports OAuth. Unfortunately OAuth2 seems to be in trouble: http://hueniverse.com/2012/07/26/oauth-2-0-and-the-road-to-hell/.

There are currently several European projects offering "Single" Sign on to researchers, and adding another one might be a problem.

It seems we have an issue with the interactionTable component. It seems the same problem reported a while ago. John I remember you fixed this problem a while ago, wouldn't you mind to have a look ... https://code.google.com/p/biojs/issues/detail?id=27&can=1&q=table&colspec=ID%20Type%20Status%20Priority%20Reporter%20Owner%20Summary

Support and document a simple json in the root directory where all events the component can broadcast are specified.
Very useful for the registry-workmen and the registry.

do we want to something like this where people can easily back a bug that is important to them?

reported by @keiono

Also, if when I use BioJS scaffolding tool (slush), I can see "lib"
directory instead of "src" and template JS file is in it. However, in
tutorial documents, it is recommended to use "src" directory for JS
source files. Which one should I use for general JavaScript code, lib
or src? My impression to BioJS 2 is a collection of design
conventions, so formalizing basic directory structure seems
important...

@emepyc

My gut feeling is that it would make more sense to do it as "src".

Explanation from @greenify

The historic reason why the tutorial uses "src" is that
(1) I use "src" in my CoffeeScript project (where the sources compiled to "lib" using a node prepublish hook) and
(2) people from the Java world a more familiar to name it src

The NodeJS convention is to name it "lib", but frankly it doesn't matter you specify the starting point in your index.js or (if you don't use a main index.js) directly in your package.json.

• However you are totally right the tutorial and the scaffolding should be consistent.

(this issue is about whether we should use src or lib and also for the archive)

Is it possible to compile via mvn only the widget you are working on?
something like:
mvn compile myWidget
mvn jsdoctk:jsdoc myWidget

The component is not rendering properly, the console shows that the variable printsdata[pid] is undefined.

Is it possible to add some kind of unique identifier to the annotations in the Sequence component? When I use onAnnotationClicked event, it doesn't tell me exactly which annotation was clicked -- it only gives me the annotation's name and position, but that is not enough to uniquely determine which annotation was clicked, because it is theoretically possible to have two annotations with the same name and position...

It seems like an ID (either set by me on addAnnotation() or the just index) would be more adequate.

Reported by rajido, Mar 28, 2013 (Google code -> Github migration)

We could use something like the SlushJS generators or yeoman. This would be more convenient than cloning our template.

Moreover we could have different templates, e.g. "io" and "vis".
For a visualization template running tests with PhantomJS makes sense, for normal parser it is unnecessary overhead.

Open link https://www.npmjs.org/package/biojs-template
In 'FAQ' chapter, we can see

We realised that a custom (buggy) implentation of the Observer pattern is too hard to maintain. For more info see our wiki

How do I create a new package?

We have a beginners guide.

Both of these two links are broken

In the sequence component, whenever the user passes over any highlight, should be nice to have both the user selection (in yellow color) and the attenuated highlight color, instead of override it completely.

Reported by johncar, May 22, 2012 (Google code -> Github migration)

On http://biojs.net/get_involved.html, there is a line saying

Otherwise you can simply create your own component and add it to our registry.

However, the two links are broken

Could anyone have a check? Thank you.

UniProt provides another sequence format that is worth to have as an option for the sequence component

Reported by leylajael, Mar 12, 2013 (Google code -> Github migration)

What steps will reproduce the problem?

1. Go to the sequence component
2. Add a couple of highlights that overlap one to each other

What is the expected output? What do you see instead?
I expect to see something similar to what happens in Dasty, i.e., some transparency in the highlights so the overlapping zone is a mixed of the colours making easier to identify that more than one highlight is happening there.

Instead, one of the highlights will totally hide the other. This is not just because the opacity/transparency thing. Further investigation is required.

Not so sure why it is not yet supported as that is central to Dasty, one of the sources of requirements for Biojs Sequence

Reported by leylajael, Mar 12, 2013 (Google code -> Github migration)

Have you thought about adding biojs components to bower.io to make them more easy to find/install and solve dependencies automatically? There's already a lot of popular javascript libraries there (jQuery, d3, etc.).

QUnit seems like a pretty mature JS test framework: https://qunitjs.com/ and a good fit for our problem

Goals:

• cover as much errors as possible (-> test should fail if the code breaks)
  • complex functions
  • creation of DOM elements, events
• encourage the use of testing for existing as as well as new components
• create a style guide for further BioJS components
• All tests should automatically be executed on every commit + pull request (= have to be in our maven build file)

Possible maven plugins: qunit-maven-plugin, qunit-mojo or phantomjs-qunit-runner

The Sequence component creates elements with its own IDs, such as

<span class=​"sequence" id=​"8" style=​"cursor:​ pointer;​">​D​</span>​

The problem is that if I have multiple Sequence components on the same page, I will have multiple elements with duplicate IDs and some things go wrong.

For example, due to this problem I am unable to display annotations in all but the first Sequence component.

Reported by pureza, Apr 19, 2013 (Google code -> Github migration)