|
| 1: Download Ortho | |
| Download the current Ortho distribution.
This includes the current version of Prototype but you can also fetch that directly from http://prototypejs.org | |
| Unpack the gzipped tar file into a suitable directory. | |
| 2: Link to the Libraries and Stylesheet | |
| Add links to the Prototype and Ortho library files and the Ortho stylesheet in your web page. | |
<link rel='stylesheet' href='ortho.css' type='text/css' /> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="ortho_core.js"></script> | |
| 3: Write Code | |
| Create an empty <div> in the body of your page and give a unique id | |
<div id="mypanel"></div> | |
| Create a <script> block in the <head> of the page for your code. In that, define a function called 'main()' in which you create an orthoPanel and several Ortho objects to be drawn inside it. | |
<script type="text/javascript">
orthoImage.loadImages('images/ortho_logo_32.png');
function main() {
var panel = new orthoPanel('mypanel', 0, 0, 500, 100);
var rect = new orthoRectangle(panel, 75, 25, 50, 50);
var hline = new orthoLine(panel, 175, 50, 50, 0);
var vline = new orthoLine(panel, 200, 25, 0, 50);
var label = new orthoLabel(panel, 300, 50, 'Ortho', 'center');
var image = new orthoImage(panel, 400, 50, 'ortho_logo_32.png', 'center');
}
</script>
| |
| Call the function ortho.init() when the page loads, which in turn calls your main() function. | |
<body onload="ortho.init()"> | |
| Click Here to see what that page should look like. | |
| 4: Next Steps | |
| Read the Ortho documentation and look at the Examples. | |
| Learn about Prototype and Scriptaculous. | |
| Get a copy of Firebug, a great JavaScript debugger, to help you resolve any problems you encounter. Install it in your page by including this line: | |
<script type="text/javascript" src="firebug/firebug.js"></script> | |
| Finally, enjoy the software and please give me Feedback on Ortho and examples of how you use it. | |
 |
Ortho © 2007 Robert Jones | Freely Distributable (MIT License) |
 |
Craic Computing LLC Seattle, WA, USA |