Portfolio Snapshot

by homer2

HTML

<script src="http://github.com/downloads/SteveSanderson/knockout/jquery.tmpl.js"></script>
<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-1.3.0beta.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/start/jquery-ui.css">
Select
<textarea rows='3'></textarea><br/><br/>
Copy
<textarea rows='3'></textarea><br/>
<input type="button" value="IE Copy to Clipboard" id="copy" />
<input type="button" value="IE Paste from Clipboard" id="paste" />
<input type="button" value="Show Data" id="showData" />
<hr>
double click to edit<br/>
red is locked from edit<br/>
click and drag to select click copy button to copy to clipboard<p>
PortfolioSnapshot.Id: <span data-bind="text: portfolioSnapshot.id"> </span><br/>
PortfolioSnapshot.WorkPackages().length: <span data-bind="text: portfolioSnapshot.workPackages().length"> </span><br/>

<p>
<button>load</button>
<table border="1" id="table1">
    <thead>
        <tr>
        <th>WorkPackage</th>
            <!-- ko foreach: portfolioSnapshot.workPackages()[0].year.months() -->
                <th data-bind="text: name()"></th>
            <!-- /ko -->        
            <th data-bind="text: portfolioSnapshot.workPackages()[0].year.yearValue"></th>
        </tr>
    </thead>
    <tbody>
        <tr data-bind="foreach: portfolioSnapshot.workPackages">
            <td data-bind="text: workPackageDescription"></td>
            <!-- ko foreach: year.months -->
                <td data-bind="text: monthAmount()"></td>
            <!-- /ko -->
            <td data-bind="text: 'total'"></td>
        <!-- /ko -->        
        </tr>
    </tbody>
</table>

CSS

td.locked{background:#cc3232}
td input,td textarea{position:absolute;width:100px;height:100px}
.ui-selecting,.ui-selecting input{background:#cfe!important}
.ui-selected,.ui-selected input{background:#cef!important}

thead tr
{
    background: blue;
    color: white;
}
tbody tr
{
    background: #fff017;
}

td.edittable
{
    background: #77bfc7;
}

th
{
 white-space:nowrap;   
}

td.desc
{
    white-space:nowrap;   
}

JavaScript

var dataFromServer = {"PortfolioSnapshot":{"CreatedDate":"2012-02-03T00:00:00-06:00","RevisionNumber":"9","Id":"111","WorkPackages":{"WorkPackage":[{"WorkPackageId":"C010018","WorkPackageDescription":"Civ-Rdwy & Prkng, 06J- (NH3 Sys) SCR-1-4","Id":"96139","Years":{"Year":{"YearValue":"2012","Id":"873309","Months":{"Month":[{"MonthValue":"1","MonthAmount":"0","Id":"10815336","OrigAmount":"0"},{"MonthValue":"2","MonthAmount":"0","Id":"10815337","OrigAmount":"0"},{"MonthValue":"3","MonthAmount":"0","Id":"10815338","OrigAmount":"0"},{"MonthValue":"4","MonthAmount":"0","Id":"10815339","OrigAmount":"0"},{"MonthValue":"5","MonthAmount":"0","Id":"10815340","OrigAmount":"0"},{"MonthValue":"6","MonthAmount":"0","Id":"10815341","OrigAmount":"0"},{"MonthValue":"7","MonthAmount":"0","Id":"10815342","OrigAmount":"0"},{"MonthValue":"8","MonthAmount":"0","Id":"10815343","OrigAmount":"0"},{"MonthValue":"9","MonthAmount":"0","Id":"10815344","OrigAmount":"0"},{"MonthValue":"10","MonthAmount":"0","Id":"10815345","OrigAmount":"0"},{"MonthValue":"11","MonthAmount":"0","Id":"10815346","OrigAmount":"0"},{"MonthValue":"12","MonthAmount":"0","Id":"10815347","OrigAmount":"0"}]}}}}]}}};
    
//alert(dataFromServer);
//alert(dataFromServer.spreads[0].id);

var selectionData;

function GetData(table) {
    var result = {
        "RowCount": 0,
        "ColumnCount": 0,
        "StartRow": 0,
        "StartColumn": 0,
        "Data": new Array(),
        "MultiData": new Array(),
        "ExcelText": ""
    };

    var $table = $(table);
    var $firstCell = $table.find(".ui-selected:first");
    result.StartColumn = $firstCell.prevAll().length;
    result.StartRow = $firstCell.parent('tr').prevAll().length;
    result.RowCount = $table.find("tr:has(.ui-selected)").length;
    result.ColumnCount = $firstCell.nextAll(".ui-selected").length + 1;

    var temp = new Array();
    $table.find("tr:has(.ui-selected)").each(function(i) {
        var cells = new Array();
       ...