Simple Spreadsheet is a web-based Spreadsheet program similar to MS Excel, OpenOffice Spreadsheet and Google Spreadsheets.

The idea behind Simple Spreadsheet was to write a web-based spreadsheet application which uses all kinds of standards that are available around the web.

Therefore Simple Spreadsheet only uses Javascript, HTML and CSS. Generating charts is done with PHP. So if you don't need charts, you can work locally without Apache/PHP. Things like ActiveX, Java or Flash are not required.

Loading / saving documents:

In Simple Spreadsheet, spreadsheets are stored and loaded by using copy-paste. That means that the documents are not stored on the server. In order to start a new empty spreadsheet, click the "New" link at the upper left corner, make the text box empty and press the load button. When you're finished, click the "Save" link at the upper left corner and copy / paste the data in the text box to your favorite text editor. Simple Spreadsheet doesn't use a binary data format, so the data is always represented as Javascript code. Loading an existing document can be done by pasting the code in the text box.

Doing formulas:

Simple Spreadsheet doesn't contain its own language for building formulas. Instead pure Javascript is used for building them. Javascript is highly standardized and supported by all common webbrowsers. Also it is easy to learn and there are many books available, telling you how to write it.
So you can use all Javascript functions in your formulas. Similar to macros you can define more functions with Javascript.
All formulas are evaluated (see eval in the code), so if one fails, you get a message box telling which one failed.
The general syntax for formulas is similar to other spreadsheets programs:

=value or =function(value,value)

A "=" at the beginning of a value makes it a formula. Inside the formulas you can use references to cells:

=A1
or
=Math.round(A1+A2)

You can also mix numbers and strings since Javascript is loosely-typed. That way Javascript chooses the right type for you. But you can override this using parseInt(A1), parseFloat(A1) or A1+'' to do explicit conversions. If you need to define a range of cells or an Array with some cells, use:

=sum(A1:A10)
or
=sum([A1,A3,A5])

To build an Array in Javascript, simply but some brackets "[]" around your values. Mixing cells and numbers also works as expected:

=A1*10
or
=A1*1.25

Doing charts:

As learned in the formulas section, you can easily define graphs with a formula:

=graph('bar','My Grpah',[1,2,3,4],['Jan','Feb','Mar','Apr'],
'quarter','value')

=graph(type,title,data,keys,x-axis description,y-axis description)

For more examples, see the example sheet included in the release.

Doing formats:

For every cell you can define two things: value or formula and the style. The style is set of rules to format the cell. These rules are based on Cascading Style Sheets (CSS), so you can use every CSS style for your cells. Additionally there are some Simple Spreadsheet specific styles that are not included in the CSS standards.

color:red;
background-color:lightgrey;
font-weight:bold;
font-size:20px;

colspan:2;       (merges the cell with the next 2 cells at the right)
rowspan:3;       (merges the cell with the next 3 cells below)
readonly:true;   (makes the cell read-only)

format:euro;     (e.g. 10.50 ?)
format:dollar;   (e.g. $10.50)
format:number;   (e.g. 10.50)
format:percent;  (e.g. 10.50%)

format:date;     (e.g. 6/14/2006)
format:time;     (e.g. 2:12:12 pm)
format:datetime; (e.g. 6/14/2006 2:12:12 pm)
format:datefull; (e.g. Tuesday, June 14 2006)
format:datefulltime; (e.g. Tuesday, June 14 2006, 2:12:12 pm)

Simple Spreadsheet data format:

Simple Spreadsheet was designed to use the standards around the web to build up a powerful spreadsheet application. Therefore Javascript was chosen as the default data format against other binary formats like OpenDocument or MS Excel.
The hello world document looks like this:

dbCells = [
  [0,0,"Hello World!",""]
];

So you define a Javascript Array of Cells and assign it to the variable dbCells. Every cell is defined like this:

[column,row,value,style]

Column and row numbers start with 0. Smaller numbers like -1 or -2 are reserved for column headers, row headers and column groups.
Important: Each item of a Javascript Array is separated with a comma ",". (If you forget the comma, your webbrowser may produce strange error messages):

dbCells = [
  [0,0,"Hello World!",""],
  [1,0,"This is the B1 Cell",""]
];

To make this format better readable you can use Javascript comments to make the relation between columns/rows and the alphanumeric notation more obvious:

dbCells = [
  [0,0,"Hello World!",""], // A1
  [1,0,"This is the B1 Cell",""] // B1
];

To make the first cell bold and the second one bigger, use:

dbCells = [
  [0,0,"Hello World!","font-weight:bold;"], // A1
  [1,0,"This is the B1 Cell","font-size:20px;"] // B1
];

To add a currency number spanned over two columns, use:

dbCells = [
  [0,0,"Hello World!","font-weight:bold;"], // A1
  [1,0,"This is the B1 Cell","font-size:20px;"], // B1
  [0,1,"10.50","format:euro; colspan:2;"] // A2
];

Note: The order in which you define your cells in the array is not relevant and may be freely chosen.

Doing macros and custom functions:

Custom functions and macros are also defined using Javascript. In order to add custom functions, you need to define an Array called registerFuncs containing the names of the functions:

registerFuncs = ["customCalc"];

function customCalc(num) {
  return num * 2.5;
}

If you want to refer to a cell inside a function, you can use the function showCell(). Important: The first parameter is the row, the second one is the column:

registerFuncs = ["customCalc2"];

function customCalc2(num) {
  return num * 2.5 * showCell(1,2); // num * 2.5 * C2
}

A complete definition of a spreadsheet document using the two custom functions would look like this:

dbCells = [
  [0,0,"Hello World!","font-weight:bold;"], // A1
  [1,0,"This is the B1 Cell","font-size:20px;"], // B1
  [0,1,"10.50","format:euro; colspan:2;"], // A2
  [0,1,"=customCalc(10.50)",""], // A2
  [0,2,"=customCalc2(2)",""] // A3
];

registerFuncs = ["customCalc","customCalc2"];

function customCalc(num) {
  return num * 2.5;
}

function customCalc2(num) {
  return num * 2.5 * showCell(1,0); // num * 2.5 * A2
}

Here the cell A2 is calculated with the customCalc() function. Cell A3 uses customCalc2() and inside customCalc2() the result from A2 is used.

How charts work: (technical description)

All charts are generated with PHP and the JpGraph library. This library is called from "graphs.php".
This file receives some parameters from the URL, generates the chart, saves it to cache/ and redirects the browser to that file. The filename of the chart is a hash that contains the parameters from the URL and the time of the last modification of "graphs.php". This way every unique chart is only generated once. Also when downloading it again, Apache can send special HTTP headers telling the browser that the file hasn't changed.
The URL parameters can contain title, width, height, values for the x-axis, the type of the graph, the values to display in the chart and many more.