Mega Code Archive
Create a spreadsheet
<![CDATA[
<!--
Apache License, Version 2.0
Revised from Rico 2.0 demo code.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Rico Spreadsheet</title>
<script src="rico21/src/prototype.js" type="text/javascript"></script>
<script src="rico21/src/rico.js" type="text/javascript"></script>
<link href="rico21/examples/client/css/demo.css" type="text/css" rel="stylesheet" />
<script type='text/javascript'>
Rico.loadModule('CustomMenu', 'SpreadSheet', 'ColorPicker');
var grid,cp;
Rico.onLoad( function() {
var opts = {
numRows: 50
};
grid = new Rico.SpreadSheet ('ss', opts);
var fmtmenu=new Rico.Menu('7em');
grid.registerScrollMenu(fmtmenu);
fmtmenu.addMenuItem('Number...',grid.openFormatNumber.bind(grid));
//fmtmenu.addMenuItem('Date/Time...',formatDate);
//fmtmenu.addMenuItem('Text...',formatText);
//fmtmenu.addMenuItem('Boolean...',formatBoolean);
grid.menu.addSubMenuItem('Format as', fmtmenu);
var alignmenu=new Rico.Menu('7em');
grid.registerScrollMenu(alignmenu);
alignmenu.addMenuItem('Left',grid.textalign.bind(grid,'left'));
alignmenu.addMenuItem('Center',grid.textalign.bind(grid,'center'));
alignmenu.addMenuItem('Right',grid.textalign.bind(grid,'right'));
alignmenu.addMenuItem('Word Wrap',grid.textwrap.bind(grid));
grid.menu.addSubMenuItem('Align', alignmenu);
var clrmenu=new Rico.Menu('7em');
grid.registerScrollMenu(clrmenu);
clrmenu.addMenuItem('All',grid.clearSelection.bind(grid,'all'));
clrmenu.addMenuItem('Formats',grid.clearSelection.bind(grid,'formats'));
clrmenu.addMenuItem('Formulas',grid.clearSelection.bind(grid,'formulas'));
clrmenu.addMenuItem('Values',grid.clearSelection.bind(grid,'values'));
grid.menu.addSubMenuItem('Clear', clrmenu);
cp=new Rico.ColorPicker('colorpick');
cp.atLoad();
cp.returnValue=this.returnColor.bind(this);
Event.observe(window,'keydown',chkEscape,false);
Event.observe('help_button','click',grid.showHelp.bindAsEventListener(grid),false);
document.getElementsByTagName('body')[0].focus();
});
function chkEscape(e) {
e=e || event;
if (e.keyCode==27) cp.close();
}
function returnColor(newcolor) {
grid.updateSelectionStyle(cp.attribute,newcolor);
}
function pickcolor(e,attr) {
if (cp.container.style.display!='none' && cp.attribute==attr) {
cp.close();
} else {
var elem=Event.element(e);
cp.attribute=attr;
RicoUtil.positionCtlOverIcon(cp.container,elem);
cp.open();
}
Event.stop(e);
}
</script>
</head>
<body>
<table border='0' class='toolbar'><tr>
<td><img src="rico21/examples/client/images/sheet/bold.gif" onclick="grid.toggleAttr('font-weight', 'normal', Prototype.Browser.Opera ? '700' : 'bold')" title="bold"></td>
<td><img src="rico21/examples/client/images/sheet/italics.gif" onclick="grid.toggleAttr('font-style','normal','italic')" title="italic"></td>
<td><img src="rico21/examples/client/images/sheet/underline.gif" onclick="grid.toggleAttr('text-decoration','none','underline')" title="underline"></td>
<td><img src="rico21/examples/client/images/sheet/alignleft.gif" onclick="grid.textalign('left')" title="align left"></td>
<td><img src="rico21/examples/client/images/sheet/aligncenter.gif" onclick="grid.textalign('center')" title="align center"></td>
<td><img src="rico21/examples/client/images/sheet/alignright.gif" onclick="grid.textalign('right')" title="align right"></td>
<td><img src="rico21/examples/client/images/sheet/backcolor.gif" onclick="pickcolor(event,'background-color')" title="background color"></td>
<td><img src="rico21/examples/client/images/sheet/textcolor.gif" onclick="pickcolor(event,'color')" title="text color"></td>
<td><img src="rico21/examples/client/images/sheet/cut.gif" onclick="grid.clip=grid.cutSelection()" title="cut"></td>
<td><img src="rico21/examples/client/images/sheet/copy.gif" onclick="grid.clip=grid.copySelection()" title="copy"></td>
<td><img src="rico21/examples/client/images/sheet/paste.gif" onclick="grid.pasteSelection(grid.clip)" title="paste"></td>
<td><img src="rico21/examples/client/images/sheet/paste_formats.gif" onclick="grid.pasteSelection(grid.clip,'formats')" title="paste formats"></td>
<td><img src="rico21/examples/client/images/sheet/help.gif" id="help_button" title="help" style='padding-left:1em;'></td>
</tr></table>
<div id='ss_outerDiv'></div>
</body>
</html>
]]>