Biojs.ChEBICompound showcase
PLEASE NOTE: the above example is being affected by the CSS rules of this site. Click on 'view in window' to see the component by using its own CSS stylesheet(s) only.
View in windowOverview
Version
1.0.0.
To get the above Biojs.ChEBICompound to work on your page, you need to do the following:
- Include the file Biojs.ChEBICompound.js and its dependencies to your page header.
Biojs scripts
<script language="JavaScript" type="text/javascript" src="src/Biojs.js">
External script(s)
<script language="JavaScript" type="text/javascript" src="../biojs/dependencies/jquery/jquery-1.6.4.js">
CSS stylesheet(s)
<link href="../biojs/css/biojs.ChEBICompound.css" rel="stylesheet" type="text/css" />
- Create a div tag which holds an unique identifier.
<body> ... <div id="YourOwnDivId" /> ... </body> - Create a code snippet within a <script> tag and instance Biojs.ChEBICompound into.
window.onload = function() { var instance = new Biojs.ChEBICompound({ target: 'YourOwnDivId', id: 'CHEBI:2922', width: 700, height: 400 }); };
Required Parameters
-
id | {string}
ChEBI identifier of the compound to be displayed (i.e. '4991').
Optional Parameters
-
imageUrl | {string}
Url of the web service in order to require the compound image. To get a compound image, 'imageUrl + id' will be used as URI.
Default: "http://www.ebi.ac.uk/chebi/displayImage.do" -
height | {int}
The height in pixels of how big this component should be displayed. If it's not specified, the CSS value will be used instead.
Default: undefined -
width | {int}
The width in pixels of how big this image should be displayed. If it's not specified, the CSS value will be used instead.
Default: undefined
getHTML
setId
Set the identifier of the chemical component. Shows both information and image for the new identifier.
Parameters:
-
{string} chebiId
Chemical EBI's identifier for the compound to be displayed.
Example 1:
instance.setId('CHEBI:4991');
Example 2:
// No image available
instance.setId('CHEBI:60004');
onImageLoaded
Parameters:
-
{function} actionPerformed
An function which receives an Biojs.Event object as argument.
Returned data in the Biojs.Event object:
-
{Object}
source
The component which did triggered the event. -
{string}
id
The identifier of the loaded file.
Example :
instance.onImageLoaded(
function( e ) {
alert( e.id + " loaded." );
}
);
onRequestError
Parameters:
-
{function} actionPerformed
An function which receives an Biojs.Event object as argument.
Returned data in the Biojs.Event object:
-
{Object}
source
The component which did triggered the event. -
{string}
file
The name of the loaded file. -
{string}
result
A string with either value 'success' or 'failure'. -
{string}
message
Error message in case of result be 'failure'.
Example :
instance.onRequestError(
function( e ) {
alert( e.message );
}
);