index.html

﻿<!DOCTYPE html>

<html ng-app="myApp" lang="en" xmlns="http://www.w3.org/1999/xhtml" class="pageRoot">
<head>
    <meta charset="utf-8" />
    <link href="styles.css" rel="stylesheet" />
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js" ></script>
    <script src="https://rawgit.com/a8m/angular-filter/master/dist/angular-filter.js" ></script>
    <script src="scripts.js" ></script>
    <title></title>
</head>
<body ng-controller="CalendarItemsCtrl" class="layoutRoot">
    <div class="contentRoot">
        <header>
            <h1>Upcoming events</h1>
        </header>
        <div class="leftColumn Col">
            <div class="event" ng-repeat="items in CalendarItemsLeft | groupBy: 'date' | toArray:true">
                <h2 class="eventTitle">{{items.$key}}</h2>
                <div class="eventDetails" ng-repeat="item in items">
                   <span>{{item.event}}</span>
                </div>            
            </div>
        </div>
        <div class="rightColumn Col">
            <div class="event" ng-repeat="items in CalendarItemsRight | groupBy: 'date' | toArray:true">
                <h2 class="eventTitle">{{items.$key}}</h2>
                <div class="eventDetails" ng-repeat="item in items">
                   <span>{{item.event}}</span>
                </div>            
            </div>
        </div>
    </div>
</body>
</html>