<title>Custom Plunker</title>

     <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">

     <link rel="stylesheet" href="http://127.0.0.1:8080/Home/bootstrap/bootstrap.css">

     <link rel="stylesheet" href="http://127.0.0.1:8080/Home/bootstrap/StyleSheet.css">

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

     <!--<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script>-->

     <script src="http://127.0.0.1:8080/Home/js/bootstrap.min.js" ></script>

     <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.4.0.js"></script>

     <script src="http://127.0.0.1:8080/Home/js/NestedReal.js"></script>

<!-- START TABLE -->
    <div class="span12">
        <!--<table class="table table-hover table-condensed table-striped">-->
        <table class="table table-hover table-condensed table-striped">
            <thead>
                <tr>
                    <th>Store ID</th>
                    <th>Name</th>
                    <th>Address</th>
                    <th>City</th>
                    <th>Cost</th>
                    <th>Sales</th>
                    <th>Revenue</th>
                    <th>Employees</th>
                    <th>Employees H-sum</th>
                </tr>
            </thead>
            <tbody data-ng-repeat="storedata in storeDataModel.storedata">
                <tr id="storedata.store.storeId" class="clickableRow" title="Click to toggle collapse/expand day summaries for this store." data-ng-click="selectTableRow($index, storedata.store.storeId)">
                    <td>{{storedata.store.storeId}}</td>
                    <td>{{storedata.store.storeName}}</td>
                    <td>{{storedata.store.storeAddress}}</td>
                    <td>{{storedata.store.storeCity}}</td>
                    <td>{{storedata.data.costTotal}}</td>
                    <td>{{storedata.data.salesTotal}}</td>
                    <td>{{storedata.data.revenueTotal}}</td>
                    <td>{{storedata.data.averageEmployees}}</td>
                    <td>{{storedata.data.averageEmployeesHours}}</td>
                </tr>
                <tr">
                    <td colspan="1">&nbsp;</td>
                    <td colspan="7">
                        <div collapse="dayDataCollapse[$index]">
                            <div class="span12 pull-right">
                                <table class="table table-hover table-condensed table-striped">
                                    <thead>
                                        <tr>
                                            <th></th>
                                            <th>Date </th>
                                            <th>Cost</th>
                                            <th>Sales</th>
                                            <th>Revenue</th>
                                            <th>Employees</th>
                                            <th>Employees H-sum</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr data-ng-repeat="dayData in storeDataModel.storedata[$index].data.dayData">
                                            <td class="pullright">
                                            <td>{{dayData.date}}</td>
                                            <td>{{dayData.cost}}</td>
                                            <td>{{dayData.sales}}</td>
                                            <td>{{dayData.revenue}}</td>
                                            <td>{{dayData.employees}}</td>
                                            <td>{{dayData.employeesHoursSum}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <!-- END TABLE -->
</div>

$scope.tableRowExpanded = false;
$scope.tableRowIndexCurrExpanded = "";
$scope.tableRowIndexPrevExpanded = "";
$scope.storeIdExpanded = "";
$scope.dayDataCollapse = [true, true, true, true, true, true];

$scope.dayDataCollapseFn = function () {
    for (var i = 0; storeDataModel.storedata.length - 1; i += 1) {
        $scope.dayDataCollapse.append('true');
    }
};



$scope.selectTableRow = function (index, storeId) {
    if ($scope.dayDataCollapse === 'undefined') {
        $scope.dayDataCollapse = $scope.dayDataCollapseFn();
    } else {

        if ($scope.tableRowExpanded === false && $scope.tableRowIndexCurrExpanded === "" && $scope.storeIdExpanded === "") {
            $scope.tableRowIndexPrevExpanded = "";
            $scope.tableRowExpanded = true;
            $scope.tableRowIndexCurrExpanded = index;
            $scope.storeIdExpanded = storeId;
            $scope.dayDataCollapse[index] = false;
        } else if ($scope.tableRowExpanded === true) {
            if ($scope.tableRowIndexCurrExpanded === index && $scope.storeIdExpanded === storeId) {
                $scope.tableRowExpanded = false;
                $scope.tableRowIndexCurrExpanded = "";
                $scope.storeIdExpanded = "";
                $scope.dayDataCollapse[index] = true;
            } else {
                $scope.tableRowIndexPrevExpanded = $scope.tableRowIndexCurrExpanded;
                $scope.tableRowIndexCurrExpanded = index;
                $scope.storeIdExpanded = storeId;
                $scope.dayDataCollapse[$scope.tableRowIndexPrevExpanded] = true;
                $scope.dayDataCollapse[$scope.tableRowIndexCurrExpanded] = false;
            }
        }
    }
};

$scope.storeDataModel = {
    "metadata": {
        "storesInTotal": "25",
        "storesInRepresentation": "6"
    },
    "storedata": [{
        "store": {
            "storeId": "1000",
                "storeName": "Store 1",
                "storePhone": "+46 31 1234567",
                "storeAddress": "Avenyn 1",
                "storeCity": "Gothenburg"
        },
        "data": {
            "startDate": "2013-07-01",
            "endDate": "2013-07-02",
            "costTotal": "100000",
            "salesTotal": "150000",
            "revenueTotal": "50000",
            "averageEmployees": "3.5",
            "averageEmployeesHours": "26.5",
            "dayData": [{
                "date": "2013-07-01",
                "cost": "50000",
                "sales": "71000",
                "revenue": "21000",
                "employees": "3",
                "employeesHoursSum": "24"
            }, {
                "date": "2013-07-02",
                "cost": "50000",
                "sales": "79000",
                "revenue": "29000",
                "employees": "4",
                "employeesHoursSum": "29"
            }]
        }
    }, {
        "store": {
            "storeId": "2000",
            "storeName": "Store 2",
            "storePhone": "+46 8 9876543",
            "storeAddress": "Drottninggatan 100",
            "storeCity": "Stockholm"
        },
        "data": {
            "startDate": "2013-07-01",
            "endDate": "2013-07-02",
            "costTotal": "170000",
            "salesTotal": "250000",
            "revenueTotal": "80000",
            "averageEmployees": "4.5",
            "averageEmployeesHours": "35",
            "dayData": [{
                "date": "2013-07-01",
                "cost": "85000",
                "sales": "120000",
                "revenue": "35000",
                "employees": "5",
                "employeesHoursSum": "38"
            }, {
                "date": "2013-07-02",
                "cost": "85000",
                "sales": "130000",
                "revenue": "45000",
                "employees": "4",
                "employeesHoursSum": "32"
            }]
        }
    }, {
        "store": {
            "storeId": "3000",
            "storeName": "Store 3",
            "storePhone": "+1 99 555-1234567",
            "storeAddress": "Elm Street",
            "storeCity": "New York"
        },
        "data": {
            "startDate": "2013-07-01",
            "endDate": "2013-07-02",
            "costTotal": "2400000",
            "salesTotal": "3800000",
            "revenueTotal": "1400000",
            "averageEmployees": "25.5",
            "averageEmployeesHours": "42",
            "dayData": [{
                "date": "2013-07-01",
                "cost": "1200000",
                "sales": "1600000",
                "revenue": "400000",
                "employees": "23",
                "employeesHoursSum": "41"
            }, {
                "date": "2013-07-02",
                "cost": "1200000",
                "sales": "2200000",
                "revenue": "1000000",
                "employees": "28",
                "employeesHoursSum": "43"
            }]
        }
    }, {
        "store": {
            "storeId": "4000",
            "storeName": "Store 4",
            "storePhone": "0044 34 123-45678",
            "storeAddress": "Churchill avenue",
            "storeCity": "London"
        },
        "data": {
            "startDate": "2013-07-01",
            "endDate": "2013-07-02",
            "costTotal": "1700000",
            "salesTotal": "2300000",
            "revenueTotal": "600000",
            "averageEmployees": "13.0",
            "averageEmployeesHours": "39",
            "dayData": [{
                "date": "2013-07-01",
                "cost": "850000",
                "sales": "1170000",
                "revenue": "320000",
                "employees": "14",
                "employeesHoursSum": "39"
            }, {
                "date": "2013-07-02",
                "cost": "850000",
                "sales": "1130000",
                "revenue": "280000",
                "employees": "12",
                "employeesHoursSum": "39"
            }]
        }
    }, {
        "store": {
            "storeId": "5000",
            "storeName": "Store 5",
            "storePhone": "+33 78 432-98765",
            "storeAddress": "Le Big Mac Rue",
            "storeCity": "Paris"
        },
        "data": {
            "startDate": "2013-07-01",
            "endDate": "2013-07-02",
            "costTotal": "1900000",
            "salesTotal": "2500000",
            "revenueTotal": "600000",
            "averageEmployees": "16.0",
            "averageEmployeesHours": "37",
            "dayData": [{
                "date": "2013-07-01",
                "cost": "950000",
                "sales": "1280000",
                "revenue": "330000",
                "employees": "16",
                "employeesHoursSum": "37"
            }, {
                "date": "2013-07-02",
                "cost": "950000",
                "sales": "1220000",
                "revenue": "270000",
                "employees": "16",
                "employeesHoursSum": "37"
            }]
        }
    }, {
        "store": {
            "storeId": "6000",
            "storeName": "Store 6",
            "storePhone": "+49 54 7624214",
            "storeAddress": "Bier strasse",
            "storeCity": "Berlin"
        },
        "data": {
            "startDate": "2013-07-01",
            "endDate": "2013-07-02",
            "costTotal": "1800000",
            "salesTotal": "2200000",
            "revenueTotal": "400000",
            "averageEmployees": "11.0",
            "averageEmployeesHours": "39",
            "dayData": [{
                "date": "2013-07-01",
                "cost": "900000",
                "sales": "1100000",
                "revenue": "200000",
                "employees": "12",
                "employeesHoursSum": "39"
            }, {
                "date": "2013-07-02",
                "cost": "900000",
                "sales": "1100000",
                "revenue": "200000",
                "employees": "10",
                "employeesHoursSum": "39"
            }]
        }
    }],
        "_links": {
        "self": {
            "href": "/storedata/between/2013-07-01/2013-07-02"
        }
    }
};