Skip to content

Commit

Permalink
Updated samples.
Browse files Browse the repository at this point in the history
Added multileg sample.
Added samples index page.
Added simple proof of concept javascript ledger
  • Loading branch information
pelle committed Oct 24, 2008
1 parent 9145067 commit b5c8e9e
Show file tree
Hide file tree
Showing 7 changed files with 462 additions and 64 deletions.
182 changes: 182 additions & 0 deletions css/boilerplate.css
@@ -0,0 +1,182 @@
/* CSS BoilerPlate http://code.google.com/p/css-boilerplate/ */
/* --------------------------------------------------------------
Reset
-------------------------------------------------------------- */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
body { line-height: 1.5; background: #fff; margin: 1.5em 0; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: none; }
input,textarea { margin: 0; }

/* Removes Firefox imposed outline */
a { outline: none; }

/* Clearing floats without extra markup */
.wrapper { display: inline-block; }
.wrapper:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .wrapper { height: 1%; }
.wrapper { display: block; }


#container {
width: 800px;
margin: 0 auto; }


/* --------------------------------------------------------------
Typography
-------------------------------------------------------------- */

/* This is where you set your desired font size. The line-heights
and vertical margins are automatically calculated from this.
The percentage is of 16px (0.75 * 16px = 12px). */
body { font-size: 75%; }


/* Default fonts and colors. */
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,input,textarea { font-family: Helvetica, Arial, sans-serif; }


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-weight: bold; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; margin-bottom: 1.5em; }
h6 { font-size: 1em; }


/* Text elements
-------------------------------------------------------------- */

p { margin: 0 0 1.5em; }

ul, ol { margin: 0 1.5em 1.5em 1.5em; }
ul { list-style-type: circle; }
ol { list-style-type: decimal; }

dl { margin: 0 0 1.5em 0; }
dl dt { font-weight: bold; }
dl dd { margin-left: 1.5em; }

abbr, acronym { border-bottom: 1px dotted #000; }
address { margin-top: 1.5em; font-style: italic; }
del { color: #000; }

a { color: #009; text-decoration: none; }
a:hover { text-decoration: underline; }

blockquote { margin: 1.5em; }
strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
pre, code { margin: 1.5em 0; white-space: pre; }
pre, code, tt { font: 1em monospace; line-height: 1.5; }
tt { display: block; margin: 1.5em 0; line-height: 1.5; }


/* Tables
-------------------------------------------------------------- */

table { margin-bottom: 1.4em; }
th { border-bottom: 2px solid #ddd; font-weight: bold; }
td { border-bottom: 1px solid #ddd; }
th,td { padding: 4px 10px 4px 0; }
tfoot { font-style: italic; }
caption { background: #ffc; }


/* Some default classes
-------------------------------------------------------------- */

.small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.quiet { color: #999; }

.hide { display: none; }
.highlight { background: #ffc; }

.top { margin-top: 0; padding-top: 0; }
.bottom { margin-bottom: 0; padding-bottom: 0; }




/* --------------------------------------------------------------
Forms
-------------------------------------------------------------- */

label { font-weight: bold; }

/* Fieldsets */
fieldset { padding: 1.4em; margin: 0 0 1.5em 0; border: 1px solid #ddd; }
legend { padding: 0 .4em; font-weight: bold; font-size: 1.2em; }

/* Textareas */
textarea { margin: 0.5em 0.5em 0 0; }
textarea { padding: .4em; }


/* hForm
-------------------------------------------------------------- */
form.hform p { margin: 0 0 .5em; }
form.hform p label { float: left; width: 100px; }

form.hform p input { width: 200px; }
form.hform p select { width: 200px; }

form.hform p input.button { width: auto; }
form.hform p input.checkbox { width: auto; }
form.hform p input.radio { width: auto; }

form.hform p.checkbox { margin-left: 100px; }
form.hform p.checkbox label { float: none; }
form.hform p.checkbox input { width: auto; }


/* vForm
-------------------------------------------------------------- */
form.vform p { margin: 0 0 .5em; }
form.vform p label { display: block; }

form.vform p.checkbox label { display: inline; }

/* --------------------------------------------------------------
Tabs
-------------------------------------------------------------- */

ul.tabs { margin: 0; padding: 0; }
ul.tabs li { float: left; list-style: none; margin: 0; padding: 0; }
ul.tabs li a { float: left; display: block; }

/* Clearing floats without extra markup */
ul.tabs { display: inline-block; }
ul.tabs:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html ul.tabs { height: 1%; }
ul.tabs { display: block; }
ul.tabs li {margin-right:0.5em;}

/* WideLedger */
.summary {
font-size:1.2em;
background:#DDF;
padding: 0.5em 1em;
}
.summary .widel-balance {
font-size:2em;
display:block;
}
.recalculate {
font-size:0.9em;
color:green;
font-style:italic;
font-weight:normal;
}
30 changes: 30 additions & 0 deletions javascript/ledger.js
@@ -0,0 +1,30 @@
$(document).ready(function() {
balanceLedger();

$('a.recalculate').click(function(){
balanceLedger();
});
});

function balanceLedger(){
$('.widel-ledger').each(function(){
var balance=0;
$(this).find('.widel-amount').each(function(){balance+=parseAmount($(this).text())});
$(this).find('.widel-balance').text('$'+formatCurrency(balance));
});
}
function parseAmount(string){
var matches=string.match(/(-?)\$?(\d{1,3},?(\d{3},?)*\d{3}(\.\d{0,2})?|\d{1,3}(\.\d{0,2})?|\.\d{1,2}?)/)
if (matches){
var positive=parseFloat(matches[2]);
if (matches[1])
return -positive;
else
return positive;
} else
return 0;
}
function formatCurrency(num) {
num = isNaN(num) || num === '' ? 0.00 : num;
return parseFloat(num).toFixed(2);
}
38 changes: 38 additions & 0 deletions samples/index.html
@@ -0,0 +1,38 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Sales for BasePack</title>
<link rel="stylesheet" href="../css/boilerplate.css" type="text/css" media="screen" title="no title" charset="utf-8"/>
</head>
<body>
<div id="container">
<ul class="tabs">
<li><a href="/">Home</a></li>
<li><a href="http://github.com/pelle/wideledger/tree/master">GitHub</a></li>
</ul>
<h1>WideLedger Samples</h1>

<table>
<tr><th>Type</th><th>Description</th><th>Formats</th></tr>
<tr>
<td>Sales Feed</td>
<td>Sales Book for a web service. This could be subscribed to by the site operators accounting software.</td>
<td><a href="sales.html">html</a></td>
</tr>
<tr>
<td>Invoice Feed</td>
<td>Feed of invoices for a customer of a web service. This could be subscribed by the customers accounting software.</td>
<td><a href="invoices.html">html</a></td>
</tr>
<tr>
<td>Statement Feed</td>
<td>Full statement with multileg transactions for a customer of a web service. This could be subscribed by the customers accounting software.</td>
<td><a href="multileg.html">html</a></td>
</tr>
</table>

</div>
</body>
</html>
64 changes: 64 additions & 0 deletions samples/invoices.html
@@ -0,0 +1,64 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Your BasePack invoices</title>
<link rel="stylesheet" href="../css/boilerplate.css" type="text/css" media="screen" title="no title" charset="utf-8"/>
</head>
<body>
<div id="container">
<ul class="tabs">
<li><a href="/">Home</a></li>
<li><a href="index.html">All Samples</a></li>
<li><a href="http://github.com/pelle/wideledger/tree/master">GitHub</a></li>
</ul>

<h1>Invoices for XYZ LLC</h1>
<table class="widel-ledger">
<tr><th>Invoice</th><th>Account</th><th>Date</th><th>Service</th><th>Currency</th><th>Amount</th><th>Description</th></tr>
<tr class="widel-entry">
<td><a href="http://basepack.inv/invoices/1101" class="widel-entry-id">101</a></td>
<td><a href="http://basepack.inv/accounts/10" class="widel-account">XYZ LLC</a></td>
<td class="widel-timestamp" title="2008-08-11T14:03:33Z">08/11/2008</td>
<td><a href="http://basepack.inv/plans/pro" class="widel-type">Pro Subscription</a></td>
<td class="widel-currency">USD</td>
<td class="widel-amount">$49.00</td>
<td class="widel-memo">August Subscription</td>
</tr>
<tr class="widel-entry">
<td><a href="http://basepack.inv/invoices/112" class="widel-entry-id">112</a></td>
<td><a href="http://basepack.inv/accounts/10" class="widel-account">XYZ LLC</a></td>
<td class="widel-timestamp" title="2008-09-11T14:03:33Z">09/11/2008</td>
<td><a href="http://basepack.inv/plans/pro" class="widel-type">Pro Subscription</a></td>
<td class="widel-currency">USD</td>
<td class="widel-amount">$49.00</td>
<td class="widel-memo">September Subscription</td>
</tr>
<tr class="widel-entry">
<td><a href="http://basepack.inv/invoices/123" class="widel-entry-id">123</a></td>
<td><a href="http://basepack.inv/accounts/10" class="widel-account">XYZ LLC</a></td>
<td class="widel-timestamp" title="2008-10-11T14:03:33Z">10/11/2008</td>
<td><a href="http://basepack.inv/plans/pro" class="widel-type">Pro Subscription</a></td>
<td class="widel-currency">USD</td>
<td class="widel-amount">$49.00</td>
<td class="widel-memo">October Subscription</td>
</tr>
<tfoot>
<tr>
<th colspan="2">Total</th>
<th>8/1/2008-10/31/2008</th>
<th>&nbsp;</th>
<th>USD</th>
<th class="widel-balance">$147.00</th>
<th><a href="#" class="recalculate">Recalculate</a></th>
</tfoot>

</table>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="../javascript/ledger.js"></script>


</body>
</html>

0 comments on commit b5c8e9e

Please sign in to comment.