Friday, 29 August 2014

Problems with Github...

With all the local dependencies, the box of files is very large.

I shouldn't really have to send all of these to Git but I don't know how to keep it separate. In retrospect I probably shouldn't have committed them since I don't change them!

Can I uncommit?

I tried and ended up deleting everything.


ARGGHHH!!!

myFavouriteProtein...

So it's been an interesting day.
I have made contact with the BioJS people and I think that's a good start.

I think I can probably write a BioJS tutorial about how to interface BioJS and bootstrap.

I can certainly contribute that.

Some key points:
    I probably need to simplify it a bit and work out how to make the components plug together a bit better.
    The index2.html page has some issues.
         ProteinPortafolio is not displaying the text information that it should. Don't know why!

    I also can't get the Biojs.Protein3DUniprot component to work.

myFavourite Protein - two module displayed.

So good news is that I can display two BioJS modules on the same page.

It works if you code in the same script.

Some problems:
The Biojs.ProteinPortafolio script seems to return 3D structures for reasons I don't understand and I don't think should be my fault.

This needs checking!

Limitations:
Sequence module is hard coded!
The two bits are showing different proteins - NOT GOOD!


OK so I have improved it now.
Two modules displayed.
Both displaying NF-kappaB and both searching the Uniprot ID.

Good!

myFavouriteProtein page - back to the tutorial!

I have to look back at my previous notes with this...

Tracking my work on myFavouriteProtein page - try sequence component....

I couldn't get the ProteinPortfolio to work first time so I am going to try the Sequence component.

It requires some different scripts:
<script language="JavaScript" type="text/javascript" src="src/Biojs.Tooltip.js"></script>

and different external scripts.

So I have made this work:


Let's try DasProteinFeatureViewer

Obviously it requires different scripts and style sheets:

Mmm, I think it also requires me to make Biojs.FeatureViewer work too. 

Mmm, more error messages and some frustration. 

Also the second script seems to force out the stuff from the first script for reasons I don't understand. 





Tracking my work on myFavouriteProtein - a webpage to use BioJS components Part 2 - getting all the other required stuff...

Checking out the websites, I need to gather the following dependencies...

Protein Portfolio
https://www.ebi.ac.uk/Tools/biojs/registry/Biojs.ProteinPortafolio.html

Clicking on Installation Tab:

Biojs scripts

1
2
3
4
5
6
<script language="JavaScript" type="text/javascript" src="src/Biojs.js">
<script language="JavaScript" type="text/javascript" src="../biojs/Biojs.PDBLogos.js"></script>
<script language="JavaScript" type="text/javascript" src="../biojs/Biojs.Sequence.js"></script>
<script language="JavaScript" type="text/javascript" src="../biojs/Biojs.Protein3D.js"></script>
<script language="JavaScript" type="text/javascript" src="../biojs/Biojs.Protein3DWS.js"></script>
<script language="JavaScript" type="text/javascript" src="src/Biojs.ProteinPortafolio.js"></script>

External script(s)

1
2
3
<script language="JavaScript" type="text/javascript" src="../biojs/dependencies/jquery/jquery-1.6.4.js">
<script language="JavaScript" type="text/javascript" src="../biojs/dependencies/graphics/raphael-2.1.0.js"></script>
<script language="JavaScript" type="text/javascript" src="../biojs/dependencies/jmol-12.0.48/Jmol.js"></script>

CSS stylesheet(s)

1
2
<link href="../biojs/css/biojs.Protein3D.css" rel="stylesheet" type="text/css" />
<link href="../biojs/css/biojs.ProteinPortafolio.css" rel="stylesheet" type="text/css">




Probably the easiest thing is just to download all of the Biojs scripts and put them in a folder.
Where do I get these from?
Github, of course. But where exactly?

To get something secure and stable, it's probably best to go to the release page on Github:
https://github.com/biojs/biojs/releases


Press the source code button to download the zip file.
Then open it on your computer. 

Sadly this doesn't have everything or maybe it does. I down loaded other stuff too so I'm a bit confused. 

Let's assume, this did download everything. I will check again on a different computer to ensure. 

I am going to create a separate biojs folder in my dist folder. 
In my biojs folder, I am creating a css and a js folder. 
Then I am going to put all the necessary bits in there. 

I didn't need to create the folders. Just copy them in paste them into the Aptana folder structure.
Copy dependencies folder into the dist. 
Copy the js folder into biojs.
I think everything is there. 
Some testing required to be sure. 
First, have a look. 
Yes, everything seems to be in place although slightly differently organised. 
Let's cut and paste in the code and organise the files and that will be a good start. 

I added the code in a script box and tried to get it to work but it hasn't. 
Error messages include:
"
Consider using 'dppx' units, as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query expression: (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) tweet_button.1409007440.html:1
Requesting features for 'P99999' Biojs.js:181
Failed to load resource: net::ERR_FILE_NOT_FOUND file:///Users/paulbrennan/Documents/Aptana%20Studio%203%20Workspace/biojs/d…%2Fdas-srv%2Funiprot%2Fdas%2Funiprot-summary%2Ffeatures%3Fsegment%3DP99999
Error requesting features for P99999 Biojs.js:181
SUCCESS: data received Biojs.js:181
_createOptions: <option value="3NWV.D (2..105)">3NWV.D (2..105)</option><option value="3ZOO.D (2..105)">3ZOO.D (2..105)</option><option value="3ZOO.A (2..105)">3ZOO.A (2..105)</option><option value="3NWV.A (2..105)">3NWV.A (2..105)</option><option value="3NWV.B (2..105)">3NWV.B (2..105)</option><option value="3NWV.C (2..105)">3NWV.C (2..105)</option><option value="3ZCF.D (2..105)">3ZCF.D (2..105)</option><option value="3ZOO.C (2..105)">3ZOO.C (2..105)</option><option value="3ZCF.A (2..105)">3ZCF.A (2..105)</option><option value="3ZCF.B (2..105)">3ZCF.B (2..105)</option><option value="3ZCF.C (2..105)">3ZCF.C (2..105)</option><option value="1J3S.A (2..105)">1J3S.A (2..105)</option><option value="3ZOO.B (2..105)">3ZOO.B (2..105)</option> Biojs.js:181
Alignments for pdb 3NWV.D Biojs.js:181
Object Biojs.js:181
Current alignment Biojs.js:181
Object Biojs.js:181
Uncaught TypeError: undefined is not a function Biojs.ProteinPortafolio.js:294"

UGGHH!