<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs title="kaChing Portfolio" width="400" height="300" scrolling="false">
    <Require feature="dynamic-height"/>
  </ModulePrefs>
  <UserPref name="userid" display_name="User ID" datatype="string" required="true" />
  <Content type="html">
<![CDATA[
<style type="text/css">
  body,td,th {font-family:verdana,arial,sans-serif;font-size:8pt}
  body {text-align:center}
  img {border:0}
  #title {margin-top:6px}
  .pic {height:25px;width:auto;vertical-align:middle;border:none;margin-right:5px}
  table {margin:0 auto 5px}
  th,td {padding:2px 8px}
  th {background-color:#eee;color:#888;border-top:3px solid white}
  td.l {text-align:left}
  td.r {text-align:right}
  td.t {text-align:right;font-weight:bold;color:#555;padding-right:5px}
  .heading {font-weight:bold;color:#555;border-top:5px solid white}
  .even td {background-color:#f8f8f8}
  .icon {height:16px;width:16px;vertical-align:middle;margin-right:6px}
  .pos {color:green}
  .neg {color:#A03}
  .summary {margin:5px auto 8px}
  .faint {opacity:.5;filter:alpha(opacity=50)}
  #error div {margin-top:10px;color:#900}
  .badge {margin:7px 0 4px}
  .badge img {border:1px solid #aaa}
</style>
<script type="text/javascript" src="http://www.kaching.com/api/client.js"></script>
<script type="text/javascript">
  function $(id) {
    return document.getElementById(id);
  }
  function show(id) {
    $(id).style.display = "block";
  }
  function hide(id) {
    $(id).style.display = "none";
  }
  function getUserId() {
    try {
      return new gadgets.Prefs().getString('userid');
    } catch (e) {
      return new _IG_Prefs().getString('userid');
    }
  }
  function load() {
    $('content').innerHTML = 'Loading...';
    var userId = getUserId();
    kaching.fetch(kaching.user(userId), function(u) {
      $('title').innerHTML = [
        '<a href="', kaching.formatPortfolioUrl(userId), '" target="_blank">',
        '<img class="pic" src="', u.picture, '">',
        u.fullName, "'s Portfolio</a>",
        '<span id="refresh"></span>' ].join('');
      loadPortfolio(userId);
    });
  }
  function loadPortfolio(userId) {
    kaching.fetch(kaching.portfolio(userId), function(p) {
      $('content').innerHTML = formatContent(p);
      $('content').className = '';
      $('refresh').innerHTML = '&nbsp;(<a href="javascript:refresh()">refresh</a>)';
      try {
        gadgets.window.adjustHeight();
      } catch (e) {
        _IG_AdjustIFrameHeight();
      }
    });
  }
  function refresh() {
    $('refresh').innerHTML = '&nbsp;(<span style="color:#999">refresh</span>)';
    $('content').className = 'faint';
    loadPortfolio(getUserId());
  }
  function formatContent(p) {
    return [
      '<table cellpadding=0 cellspacing=0>',
      formatHoldings(p.longHoldings, 'Long Positions'),
      formatHoldings(p.shortHoldings, 'Short Positions', true),
      '</table>',
      '<table cellpadding=0 cellspacing=0 class="summary">',
      '<tr><td class="t">Available Cash:<td class="r">', kaching.formatDollars(p.availableCash),
      '<tr><td class="t">Short Collateral:<td class="r">', kaching.formatDollars(p.shortCollateral),
      '<tr><td class="t">Total Value:<td class="r">', kaching.formatDollars(p.totalValue),
      '</table>'].join('');
  }
  function formatHoldings(h, title, isShort) {
    if (isEmpty(h)) return '';
    var a = [
      '<tr><td class="heading" colspan="3">', title, '</tr>',
      '<tr><th>Stock<th>Shares<th>Value<th>Change</tr>' ];
    var even = false;
    for (symbol in h) {
      var item = h[symbol];
      a.push(
        '<tr',
        even ? ' class="even"' : '',
        '><td class="l">',
        '<img class="icon" src="',
        item.companyIconUrl || 'http://www.kaching.com/blank.gif',
        '">',
        kaching.formatQuoteLink(symbol, item.companyName),
        '<td class="r">',
        kaching.formatNumber(item.quantity),
        '<td class="r">',
        kaching.formatDollarsTo0(item.quantity * item.lastPrice),
        '<td class="r ', (isShort ? -1 : 1) * item.lastChange < 0 ? "neg" : "pos", '">',
        kaching.formatDollarsTo0(item.quantity * item.lastChange),
        '</tr>');
      even = !even;
    }
    return a.join('');
  }
  function isEmpty(o) { 
    for (k in o) { return false; }
    return true;
  }
  function showError(html) {
    $('error').innerHTML = ['<div>', html, '</div>'].join('');
    show('error');
    if (window.hideTO) clearTimeout(window.hideTO);
    window.hideTO = setTimeout(function() {hide('error')}, 5000);
  }
  try {
    gadgets.util.registerOnLoadHandler(load);
  } catch(e) {
    _IG_RegisterOnloadHandler(load);
  }
</script>
<div class="widget">
 <div id="title"></div>
 <div id="content"></div>
 <div id="error"></div>
 <div class="badge"><a target="_blank" href="http://www.kaching.com"><img src="http://kaching-api.googlecode.com/svn/wiki/badge52x26.png"></a></div>
</div>
  ]]>
  </Content>
</Module>







