Biojs.HelloWorld 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
This is the description of the HelloWorld component. Here you can set any HTML text
for putting on the generated documentation.
Version
1.0.0.
To get the above Biojs.HelloWorld to work on your page, you need to do the following:
- Include the file Biojs.HelloWorld.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.min.js">
- 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.HelloWorld into.
window.onload = function() { var instance = new Biojs.HelloWorld({ target : "YourOwnDivId", selectionBackgroundColor : '#99FF00' }); };
Required Parameters
-
target | {string}
Identifier of the DIV tag where the component should be displayed.
Optional Parameters
-
fontFamily | {string}
mono", courier, monospace'] Font list to be applied to the component content.
Default: '"Andale -
fontColor | {string}
HTML color code for the font.
Default: "white" -
backgroundColor | {string}
Background color for the entire div content.
Default: "#7BBFE9" -
selectionFontColor | {Object}
This color will be used to change the font color of selected text.
Default: "white" -
| {Object}
selectionBackgroundColor="yellow"] This color will be used to change the background of selected text.
setSize
Change the font size. Do nothing it no value is provided.
Parameters:
-
{string} size
Optional
The new font size in pixels.
Example :
instance.setSize("72px");
onClick
Parameters:
-
{function} actionPerformed
A 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}
type
The name of the event. -
{int}
selected
Selected character.
Example :
instance.onClick(
function( objEvent ) {
alert("The character " + objEvent.selected + " was clicked.");
}
);
onHelloSelected
Parameters:
-
{function} actionPerformed
A 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}
type
The name of the event. -
{int}
textSelected
Selected text, will be 'Hello' obviously.
Example :
instance.onHelloSelected(
function( objEvent ) {
alert("The word " + objEvent.textSelected + " was selected.");
}
);