-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtaskmin.html
150 lines (142 loc) · 6.06 KB
/
taskmin.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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!--
* FILE NAME: taskmin.html
* WRITTEN BY: Professor Anderson
* DATE: 5/1/20
* PURPOSE: CS204 Taskmin
-->
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="style.css">
<meta name=author content="Alina Zheng">
<title>Taskmin</title>
</head>
<body>
<article>
<h1>Taskmin</h1>
<nav>
<ul>
<li><button class="nav dropButton" type="button">Add</button>
<div id="addTaskDropDown" class="dropClickContent">
<form id="addTask">
<h2>Add Task</h2>
<p><label for="taskText">Description</label></p>
<textarea id="taskText" name="taskText" required
rows=4 cols=60></textarea>
<p><label>priority
<select name="taskPriority">
<option>low</option>
<option selected>medium</option>
<option>high</option>
</select>
</label></p>
<p><label>Due Date
<input id="taskDueDate" name="taskDueDate"
type="text">
</label></p>
<p>tag:</p>
<div id="tags">
<label><input type="radio" name="tag" value="work">
work</label>
<label><input type="radio" name="tag" value="personal">
personal</label>
</div>
<button id="addTaskButton" type="button">add</button>
<button id="cancelAddTask" type="button">cancel</button>
</form>
</div>
</li>
<li><button class="nav dropButton" type="button">Sort</button>
<div class="dropContent">
<button id="sortIdButton" type="button">by Id</button>
<button id="sortTagButton" type="button">by Tag</button>
<button id="sortDueDateButton" type="button">by Due Date</button>
<button id="sortPriorityButton" type="button">by Priority</button>
</div>
</li>
<li><button class="nav dropButton" type="button">Local</button>
<div class="dropContent">
<button id="saveButton" type="button">Save</button>
<button id="loadButton" type="button">Load</button>
<button id="resetButton" type="button">Reset</button>
</div>
</li>
<li><button class="nav dropButton" type="button">Tags</button>
<div id="tagDropDown" class="dropClickContent">
<h2>Manage Tags</h2>
<div>
<h3>Current Tags</h3>
<ul id="currentTags">
<li>
<button type="button" class="delete">✖</button>
<span class="tagName">work</span>
</li>
<li>
<button type="button" class="delete">✖</button>
<span class="tagName">personal</span>
</li>
</ul>
<h3>Add Tag</h3>
<form id="addTagForm">
<label>name <input type="text" name="tagName"></label>
<label>color <input type="color" name="tagColor" value="#ffffff"></label>
<p><button>submit</button></p>
</form>
</div>
</div>
</li>
</ul>
</nav>
<ul id="theTasks">
<!-- this is just an example; you'll remove it dynamically -->
<li class="task" style="background-color: lightskyblue" data-taskId="">
<span class="due">May May 15 2020</span>
<span class="priority">high</span>
<span class="tag">work</span>
<p class="text">Finish Taskmin by 4pm</p>
<button type="button" id = "test-but" class="markDone">✔</button>
<button type="button" class="delete">✖</button>
<button type="button" class="more">✚</button>
</li>
<!-- end of example task -->
</ul>
</article>
<ul class="template" id="task_elt_template">
<li class="task" style="background-color: lightskyblue" data-taskId="">
<span class="due">Fri Dec 20 2019</span>
<span class="priority">high</span>
<span class="tag">work</span>
<p class="text">Finish Taskmin by 4pm</p>
<button type="button" class="markDone">✔</button>
<button type="button" class="delete">✖</button>
<button type="button" class="more">✚</button>
</li>
</ul>
<footer>
<ul class="validation_icons">
<li><a href="//validator.w3.org/check?uri=referer"><img
src="//cs.wellesley.edu/~cs204/Icons/valid-html5v2.png"
alt="Valid HTML 5"
title="Valid HTML 5"
height="31" width="88"/></a></li>
<li><a href="//jigsaw.w3.org/css-validator/check/referer"><img
style="border:0;width:88px;height:31px"
src="//cs.wellesley.edu/~cs204/Icons/vcss.gif"
alt="Valid CSS!"/></a></li>
</ul>
</footer>
<!-- JavaScript at the bottom -->
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cs.wellesley.edu/~anderson/js/bounds/bounds-plugin.js"></script>
<script src="https://cs.wellesley.edu/~cs204/assignments/project/example.js"></script>
<script src="dynamic-tags.js"></script>
<script src="Task.js"></script>
<script src="TaskList.js"></script>
<script src="dropdowns.js"></script>
<script src="main.js"></script>
</body>