-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathinfiniteAgenda.html
54 lines (50 loc) · 2.79 KB
/
infiniteAgenda.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE html>
<html ng-app="infiniteApp">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta charset="utf-8"/>
<title>JS Assignment 15: Infinite Agenda</title>
<link rel="stylesheet" type="text/css" href="normalize.css"/>
<link rel="stylesheet" type="text/css" href="main.css"/>
<script type="text/javascript" src="jquery-1.11.3.js"></script>
<script type="text/javascript" src="angular.js"></script>
<script type="text/javascript" src="ng-infinite-scroll.js"></script>
</head>
<body ng-controller="troller" ng-keypress = "keyPress($event)">
<Header class="site-header">Steve's Nefarious Agenda</Header>
<div class="agenda-container" infinite-scroll="loadMore()">
<ul>
<li ng-repeat="(outerIndex, date) in dateArray">
<!-- setting scope variables to null here is the only way I could clear them. Doesn't work in JS file for some reason -->
<div ng-class-odd="'alternate-agenda'" class="day-entry">{{date.date}}<br/>
<ul>
<!-- date.appointment === array containing appointment objects -->
<!-- appointment in date.appointment refers to appointment object -->
<li ng-repeat="(innerIndex, appointment) in date.appointment">
<hr>
<div ng-click="editAppointmentClick(outerIndex, innerIndex)">
<label>What: </label><p ng-show="!appointment.editKey" ng-bind="appointment.whatKey"></p>
<input ng-show="appointment.editKey" ng-model="appointment.whatKey" value="{{appointment.whatKey}}"/>
<label>When: </label><p ng-show="!appointment.editKey" ng-bind="appointment.whenKey"></p>
<input ng-show="appointment.editKey" ng-model="appointment.whenKey" value="{{appointment.whenKey}}"/>
<label>Who: </label><p ng-show="!appointment.editKey" ng-bind="appointment.whoKey"></p>
<input ng-show="appointment.editKey" ng-model="appointment.whoKey" value="{{appointment.whoKey}}"/>
</div>
<button ng-click="submitAppointmentEdit(outerIndex, innerIndex)" ng-show="appointment.editKey" class="button load-more-button">Submit Edits</button>
</li>
</ul>
</div>
<button ng-click="[showForm($index), what=null, when=null, who=null]" class="button">Add an Appointment</button>
<div ng-show="date.showValue" class="hidden-form">
<label>What?</label><input class="input" value="What?" ng-model="what"><br/>
<label>When?</label><input class="input" value="WHEN?" ng-model="when"><br/>
<label>With Who?</label><input class="input" value="WITH WHO?!" ng-model="who"><br/>
<button ng-click="submitAppointment($index, what, when, who)" class="button">Submit Appointment</button>
</div>
</li>
</ul>
<button ng-click="loadMore()" class='button load-more-button'>Load More</button>
</div>
<script type="text/javascript" src="troller.js"></script>
</body>
</html>