The Objectsheet: Download/Try

The Objectsheet A casual, object-oriented data analysis tool

Function Reference

Download and Try

There are three ways you can use the Objectsheet. Each has a specific purpose. They are:

Desktop or Web Application

The Objectsheet is self contained in a single html file. You can download objectsheet.html and use it on your PC or Mac. Once downloaded, you can load and save files to your local hard drive.

Open the following file and then select "Save As..." in the browser. Or, right click the link and select "Save As" or "Save Target As":

objectsheet.html

Note: You can also specify a file for the Objectsheet to automatically load. e.g.: http://richk.net/os/objectsheet.html?file=sheets/todo.os

Note: The file above is stripped of comments to save space. See "Desktop Application with Commented Source Code" version below for full source code.

Desktop Application with Commented Source Code and Examples

The Objectsheet source is hosted on SourceForge at sourceforge.net/projects/objectsheet. You can download the entire commented source, along with examples and other support utilities.

Once downloaded, extract the files anywhere on your local harddrive. Double-click on the file called "os.html". There are example Objectsheets stored in ./sheets. This is also the default directory for opening and saving files. The utility './test_support/AggregateFiles.html' converts the source files into objectsheet.html.

Embedded Within a Webpage

From your own webpage, you can point to the Objectsheet engine and stylesheet at richk.net (os.js and os.css*) or you can upload these files to your own web server. You can then embed Objectsheet Sections in a webpage. These sections can interact with each other and with other HTML elements on the webpage. This the approach used in the Objectsheet tutorial pages. A good starting point is to download one of the Objectsheet HTML files (objectsheet.html or osc.html) and modify it with your own HTML.

* Note: os.js and os.css are aggregated and comment-stripped versions of the original source code.

Instructions: Within any webpage, you can create a basic Objectsheet table using the following HTML:

<head>
<link rel="stylesheet" type="text/css" href="http://richk.net/os/os.css" />
<script language="javascript" src="http://richk.net/os/os.js"></script>
</head><body>
<script>
table1 = new TableSection("table1", "", 3,3).draw().calc();
</script>
</body>

Note: The link tag goes in the <head> section of the webpage, while the script tag that creates the TableSection goes in the <body> part. The tag that loads os.js can go either in the <head> or the <body> of the webpage.

The syntax of the TableSection constructor is:

TableSection(name, options, rowCount, columnCount)
or
TableSection(name, options, data)

name is the name of the section, in quotes. If an empty name ("") is supplied, a unique name will be automatically created.
options is an associated array (e.g., {canMove:1,lockTemplate:1}). It lets you control how the section is displayed:
- 'canMove:0' makes the section unmoveable
- 'lockTemplate:1' makes the Template uneditable by the user.
- 'canMinimize:0' removes the ability to show only the titlebar (i.e., "windowshade") the section
- 'resizeable:X' where X = 'h' for horizontal resize only, 'v' for vertical resize only, and 'hv' for both horizontal and vertical resize.
- Any of the above can be undone by setting the data element directly and redrawing the section, e.g., section._view.panel.lockTemplate = 1;section.draw();
data is a Javascript data structure that lets you specify initial objects (rows) or column properties for the Table. This parameter is of the form, {us:objects, prop:column_properties}.
- For objects, you can specify either a simple number (causing that many blank rows to be generated), an array of objects, or a nested array of values.
- For column_properties, you can either a simple number (causing that many columns to be generated), or an array of objects specifying the attributes of each column.

For instance, if you want to create a table with four columns with the numbers 2, 4, 6, and 8 in the first row and 3, 5, 7, 9 in the second row, you can use either of the following:

new TableSection("", "", [[2,4,6,8],[3,5,7,9]])
new TableSection("", "", [{a:2,b:4,c:6,d:8},{b:5,d:9}])

In each case, the Table will grow to fill the array you specify; in this case, it will grow to 4 columns.

After creating the new Section with new TableSection(...), the .draw() method displays it in the browser, and the .calc() method calculates and updates the display (many ObjectSheet methods return "this" so you can chain method calls).

All of the tutorial examples use the above technique for creating and displaying Objectsheet Sections within a webpage. To see more examples of the above, go to one of the tutorial pages and from your Browser menu, select View > Source or View > Page Source.