forked from amoghgarg/spreadsheet-client
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
95 lines (83 loc) · 2.88 KB
/
index.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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<html>
<head>
<script src="./script.js">
</script>
<script src="https://apis.google.com/js/client.js?onload=checkAuth">
</script>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="container">
<div class="header">Expenses</div>
<div class="form-content">
<div id="authorize-div" style="display: none">
<span>Authorize access to Google Sheets API</span>
<!--Button for the user to click to initiate auth sequence -->
<button id="authorize-button" onclick="handleAuthClick(event)">
Authorize
</button>
</div>
<div class="form-item input-container date">
<input class="formInput" id="date" type="date" required="required" placeholder="Date" />
</div>
<div class="form-item amount">
<div class="placeholder">AMOUNT</div>
<input class="formInput" id="amount" type="number" />
</div>
<div class="form-item input-container">
<select class="formInput" id="category">
<option value="Lunch">Lunch</option>
<option value="Dinner">Dinner</option>
<option value="Grocery">Grocery</option>
<option value="Entertainment">Entertainment</option>
<option value="Transport">Transport</option>
<option value="Toiletries">Toiletries</option>
<option value="Soft Drink, Coffee">Soft Drink, Coffee</option>
<option value="Alcohol">Alcohol</option>
<option value="Conbini">Conbini</option>
<option value="Other">Other</option>
<option value="Bills, Rent">Bills, Rent</option>
<option value="Fitness">Fitness</option>
</select>
</div>
<div class="form-item input-container">
<select class="formInput" id="paymentType">
<option value="Cash">Cash</option>
<option value="Visa SMBC">Visa SMBC</option>
<option value="Rakuten Visa">Rakuten Visa</option>
<option value="Splitwise">Splitwise</option>
</select>
</div>
<div class="form-item comment-box">
<input class="formInput" id="comment" type="text" placeholder="Comment, if any" />
</div>
<div id="addDiv" class="form-item btn-container hidden-element">
<button id="Add" onclick="handleAddExpense(event)">
Add Expense
</button>
</div>
</div>
<div id="spinner" class="spinner">
<div class="rect1"></div>
<div class="rect2"></div>
<div class="rect3"></div>
<div class="rect4"></div>
<div class="rect5"></div>
</div>
<div id="summary-container"></div>
<table class="recent-entries">
<thead>
<tr>
<th>Date</th>
<th>Amount</th>
<th>Category</th>
<th>Comment</th>
<th>Payment Type</th>
</tr>
<tbody id="entries-body">
</tbody>
</thead>
</table>
</div>
</body>
</html>