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
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
|
<!doctype html>
<html lang="en-CA">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>WATnow: every Learn deadline, kept up to date</title>
<meta name="description" content="Stop wasting hours every term manually building and updating a calendar. WATnow is a free Chrome extension that reads and updates your deadlines from Learn. Join the waitlist.">
<meta name="color-scheme" content="light">
<meta name="theme-color" content="#DDE6F3">
<link rel="canonical" href="https://watnow.ugmi.ca/">
<meta property="og:type" content="website">
<meta property="og:site_name" content="WATnow">
<meta property="og:url" content="https://watnow.ugmi.ca/">
<meta property="og:title" content="Every Learn deadline, kept up to date when profs move them">
<meta property="og:description" content="Stop wasting hours every term manually building and updating a calendar. WATnow is a free Chrome extension that reads and updates your deadlines from Learn.">
<meta property="og:image" content="https://watnow.ugmi.ca/og-image.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="The WATnow side panel with CS 341 Assignment 1 moved to Tuesday, Sep 22. The old date, Thursday, Sep 17, is crossed out in red.">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Every Learn deadline, kept up to date when profs move them">
<meta name="twitter:description" content="Stop wasting hours every term manually building and updating a calendar. WATnow is a free Chrome extension that reads and updates your deadlines from Learn.">
<meta name="twitter:image" content="https://watnow.ugmi.ca/og-image.png">
<link rel="icon" href="favicon.svg" type="image/svg+xml">
<link rel="icon" href="favicon-32.png" type="image/png" sizes="32x32">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<link rel="preload" href="fonts/bricolage-latin-opsz-wght.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="fonts/figtree-latin-wght.woff2" as="font" type="font/woff2" crossorigin>
<link rel="stylesheet" href="styles.css">
<script>
// Light is the default. A visitor who picked dark mode before gets it back before first paint.
try {
if (localStorage.getItem('whatnow-theme') === 'dark') {
document.documentElement.setAttribute('data-theme', 'dark');
document.querySelector('meta[name="theme-color"]').setAttribute('content', '#1A1E2C');
}
} catch (err) {}
// The hero demo starts from the "before" state only when motion is allowed and JS runs.
// Everyone else sees the finished state, with the moved date already highlighted.
if (window.matchMedia && !window.matchMedia('(prefers-reduced-motion: reduce)').matches && 'animate' in document.documentElement) {
document.documentElement.classList.add('anim');
}
</script>
<script src="main.js" defer></script>
</head>
<body>
<svg width="0" height="0" style="position:absolute" aria-hidden="true" focusable="false">
<symbol id="i-dropbox" viewBox="0 0 20 20"><path d="M3.5 11h3.6l1.1 2h3.6l1.1-2h3.6"/><path d="M3.5 11v3.5A2 2 0 0 0 5.5 16.5h9a2 2 0 0 0 2-2V11l-2.1-5.3a1.8 1.8 0 0 0-1.7-1.2H7.3a1.8 1.8 0 0 0-1.7 1.2z"/></symbol>
<symbol id="i-flask" viewBox="0 0 20 20"><path d="M8 3.5h4"/><path d="M8.8 3.5v4.3l-4.1 7a1.2 1.2 0 0 0 1 1.7h8.6a1.2 1.2 0 0 0 1-1.7l-4.1-7V3.5"/><path d="M6.4 12.5h7.2"/></symbol>
<symbol id="i-quiz" viewBox="0 0 20 20"><rect x="3.5" y="3.5" width="13" height="13" rx="2"/><path d="M6.6 8.1l1.2 1.2 2.2-2.3"/><path d="M11.8 8.2h1.9"/><path d="M6.6 12.9h1.9"/><path d="M11.8 12.9h1.9"/></symbol>
<symbol id="i-check" viewBox="0 0 20 20"><path d="M5 10.4l3.2 3.1L15 6.6"/></symbol>
<symbol id="i-puzzle" viewBox="0 0 20 20"><path d="M9.4 6.2V5a1.8 1.8 0 1 1 3.6 0v1.2h2.2a1 1 0 0 1 1 1v2.2H15a1.8 1.8 0 1 0 0 3.6h1.2v2.2a1 1 0 0 1-1 1h-2.2V15a1.8 1.8 0 1 0-3.6 0v1.2H7.2a1 1 0 0 1-1-1v-2.2H5a1.8 1.8 0 1 1 0-3.6h1.2V7.2a1 1 0 0 1 1-1z"/></symbol>
<symbol id="i-sync" viewBox="0 0 20 20"><path d="M15.8 8.4A6 6 0 0 0 5.4 6"/><path d="M16.2 4.4v4h-4"/><path d="M4.2 11.6a6 6 0 0 0 10.4 2.4"/><path d="M3.8 15.6v-4h4"/></symbol>
<symbol id="i-tag" viewBox="0 0 20 20"><path d="M10.4 3.4h5.2a1 1 0 0 1 1 1v5.2a1 1 0 0 1-.3.7l-6 6a1 1 0 0 1-1.4 0l-5.2-5.2a1 1 0 0 1 0-1.4l6-6a1 1 0 0 1 .7-.3z"/><path d="M13.3 6.7v.01"/></symbol>
<symbol id="i-shield" viewBox="0 0 20 20"><path d="M10 3.2l5.4 2.2v4.2c0 3.2-2.1 5.6-5.4 6.9-3.3-1.3-5.4-3.7-5.4-6.9V5.4z"/><path d="M10 8.2v3"/></symbol>
<symbol id="i-sliders" viewBox="0 0 20 20"><path d="M3.6 6.4h5.3M12.5 6.4h3.9"/><circle cx="10.7" cy="6.4" r="1.8"/><path d="M3.6 13.6h3.9M11.1 13.6h5.3"/><circle cx="9.3" cy="13.6" r="1.8"/></symbol>
<symbol id="i-bell-off" viewBox="0 0 20 20"><path d="M14.4 10.4V9a4.4 4.4 0 0 0-8.8 0c0 3.2-1.2 4.4-1.2 4.4h11.2"/><path d="M8.3 15.7a1.9 1.9 0 0 0 3.4 0"/><path d="M4.2 4.2l11.6 11.6"/></symbol>
<symbol id="i-arrow" viewBox="0 0 20 20"><path d="M4 10h11"/><path d="M11 6l4 4-4 4"/></symbol>
<symbol id="i-clock" viewBox="0 0 20 20"><circle cx="10" cy="10" r="6.75"/><path d="M10 6.4V10l2.4 1.6"/></symbol>
<symbol id="i-info" viewBox="0 0 20 20"><circle cx="10" cy="10" r="6.75"/><path d="M10 9.2v4.2"/><path d="M10 6.6v.1"/></symbol>
<symbol id="i-moon" viewBox="0 0 20 20"><path d="M15.8 12.6A6.5 6.5 0 0 1 7.4 4.2a6.5 6.5 0 1 0 8.4 8.4z"/></symbol>
<symbol id="i-sun" viewBox="0 0 20 20"><circle cx="10" cy="10" r="3.4"/><path d="M10 2.8v1.6M10 15.6v1.6M2.8 10h1.6M15.6 10h1.6M4.9 4.9l1.1 1.1M14 14l1.1 1.1M4.9 15.1 6 14M14 6l1.1-1.1"/></symbol>
<symbol id="mark" viewBox="0 0 200 200"><g transform="translate(13 47.6) scale(0.87)"><path fill="currentColor" d="M53.52 0L71.86 35.78L89.3 0L110.7 0L128.14 34.24L115.9 52.28L99.7 22.92L69.12 80.42L40.36 20.18L27.82 20.18L67.88 100.6L89 63L98.78 80.72L100 83.78L80.12 119.56L55.66 119.56L0 0ZM192.96 0L200 0L144.64 119.56L120.18 119.56Z"/><path fill="var(--yellow)" d="M159.64 0L181.96 0L130.58 78.58L120.18 59.32ZM100 43.12L131.5 99.08L120.18 119.56L89.3 63.3Z"/></g></symbol>
</svg>
<header class="site-header wrap">
<a class="logo" href="./" aria-label="WATnow home">
<span class="mark-tile" aria-hidden="true"><svg class="logo-mark" width="26" height="26" focusable="false"><use href="#mark"/></svg></span>
<span class="wordmark" aria-hidden="true">WATnow</span>
</a>
<div class="header-actions">
<button type="button" class="theme-toggle" data-theme-toggle aria-pressed="false" aria-label="Dark mode">
<svg class="ico i-moon" width="22" height="22" aria-hidden="true"><use href="#i-moon"/></svg>
<svg class="ico i-sun" width="22" height="22" aria-hidden="true"><use href="#i-sun"/></svg>
</button>
<a class="btn btn-quiet btn-sm" href="#waitlist" data-umami-event="waitlist-cta-header">Join the waitlist</a>
</div>
</header>
<main>
<section class="hero wrap" aria-labelledby="hero-title">
<div class="hero-copy">
<h1 id="hero-title">Every Learn deadline, <span class="hl">kept up to date</span> when profs move them.</h1>
<p class="lede">Stop wasting hours every term manually building and updating a calendar.</p>
<ul class="check-list hero-points">
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-puzzle"/></svg>An extension for UW students, on Chrome and Edge</li>
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-sync"/></svg>Reads and updates your deadlines from Learn while you’re on the page</li>
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-tag"/></svg>100% free</li>
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-shield"/></svg>No personal information required</li>
</ul>
<a class="btn btn-primary btn-lg hero-cta" href="#waitlist" data-umami-event="waitlist-cta-hero">Join 400 students on the waitlist<svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-arrow"/></svg></a>
</div>
<figure class="demo" id="hero-demo" data-demo role="img" aria-label="Example of the WATnow side panel. CS 341 Assignment 1 was due Thursday. The prof moves it, the old date gets crossed out in red, and the assignment moves down to next week with its new date, Tuesday, highlighted.">
<div class="panel" aria-hidden="true">
<div class="p-bar">
<span class="mark-tile mark-tile-sm"><svg class="p-mark" width="24" height="24" focusable="false"><use href="#mark"/></svg></span>
<span class="p-name">WATnow</span>
</div>
<div class="p-list">
<p class="gh o-h1"><span>This week</span><span class="gh-sub" data-day="1" data-to="6" data-fmt="range">Sep 15 to 20</span><span class="gh-count"><span class="n-start">2</span><span class="n-end">1</span></span></p>
<div class="row o-quiz">
<span class="ring"></span>
<div class="row-body">
<div class="row-main">
<span class="meta"><span class="chip hl-green">MATH 239</span><span class="type"><svg class="ico" width="16" height="16"><use href="#i-quiz"/></svg>Quiz</span></span>
<span class="title">Quiz 1: Counting</span>
</div>
<div class="due"><span class="due-top" data-day="1" data-fmt="wd">Tue</span><span class="due-bottom">10:00 am</span></div>
</div>
</div>
<div class="row o-a1 rule is-moved" data-mover>
<span class="ring"></span>
<div class="row-body">
<div class="row-main">
<span class="meta"><span class="chip hl-pink">CS 341</span><span class="type"><svg class="ico" width="16" height="16"><use href="#i-dropbox"/></svg>Assignment</span></span>
<span class="title">Assignment 1</span>
<span class="moved"><svg class="ico" width="16" height="16"><use href="#i-arrow"/></svg><span>Moved from <span class="was" data-day="3" data-fmt="wmd">Thu, Sep 17</span></span></span>
</div>
<div class="due">
<span class="due-top"><span class="d-start" data-day="3" data-fmt="wd">Thu</span><span class="d-end" data-day="8" data-fmt="wmd">Tue, Sep 22</span></span>
<span class="due-bottom">11:59 pm</span>
</div>
</div>
</div>
<p class="gh o-h2"><span>Next week</span><span class="gh-sub" data-day="7" data-to="13" data-fmt="range">Sep 21 to 27</span><span class="gh-count"><span class="n-start">2</span><span class="n-end">3</span></span></p>
<div class="row o-psych">
<span class="ring"></span>
<div class="row-body">
<div class="row-main">
<span class="meta"><span class="chip hl-violet">PSYCH 101</span><span class="type"><svg class="ico" width="16" height="16"><use href="#i-quiz"/></svg>Quiz</span></span>
<span class="title">Chapter 2 Quiz</span>
</div>
<div class="due"><span class="due-top" data-day="7" data-fmt="wmd">Mon, Sep 21</span><span class="due-bottom">11:59 pm</span></div>
</div>
</div>
<div class="row o-lab rule">
<span class="ring"></span>
<div class="row-body">
<div class="row-main">
<span class="meta"><span class="chip hl-orange">STAT 230</span><span class="type"><svg class="ico" width="16" height="16"><use href="#i-flask"/></svg>Lab</span></span>
<span class="title">Lab 2: Discrete Distributions</span>
</div>
<div class="due"><span class="due-top" data-day="9" data-fmt="wmd">Wed, Sep 23</span><span class="due-bottom">11:59 pm</span></div>
</div>
</div>
</div>
</div>
<div class="marker" aria-hidden="true"><span class="m-tip"></span><span class="m-body"></span><span class="m-band"></span><span class="m-cap"></span></div>
</figure>
</section>
<section class="section dates" aria-labelledby="dates-title">
<div class="wrap">
<div class="dates-copy">
<h2 id="dates-title">When a prof changes a due date on Learn, your list shows the new one.</h2>
<p class="scan-lede">When a date changes on Learn, WATnow crosses out the old one in red and moves the assignment to the week it’s due now, even if you missed the prof’s announcement.</p>
</div>
</div>
</section>
<section class="section scan" aria-labelledby="scan-title">
<div class="wrap">
<div class="scan-copy">
<h2 id="scan-title">No need to upload ANYTHING</h2>
<p class="scan-lede">WATnow is synced to Learn, meaning you don’t need to upload a syllabus, or course outline, or your calendar for it to work.</p>
</div>
<figure class="found">
<div class="sheet found-sheet" role="img" aria-label="Example first scan. CS 341 has 4, MATH 239 has 5, STAT 230 has 5, ECON 101 has 4 and PSYCH 101 has 5.">
<ol class="found-list" aria-hidden="true">
<li class="course hl-pink"><span class="chip">CS 341</span><span class="c-name">Algorithms</span><span class="c-count"><svg class="ico" width="16" height="16"><use href="#i-check"/></svg>4 deadlines</span></li>
<li class="course hl-green"><span class="chip">MATH 239</span><span class="c-name">Introduction to Combinatorics</span><span class="c-count"><svg class="ico" width="16" height="16"><use href="#i-check"/></svg>5 deadlines</span></li>
<li class="course hl-orange"><span class="chip">STAT 230</span><span class="c-name">Probability</span><span class="c-count"><svg class="ico" width="16" height="16"><use href="#i-check"/></svg>5 deadlines</span></li>
<li class="course hl-blue"><span class="chip">ECON 101</span><span class="c-name">Introduction to Microeconomics</span><span class="c-count"><svg class="ico" width="16" height="16"><use href="#i-check"/></svg>4 deadlines</span></li>
<li class="course hl-violet"><span class="chip">PSYCH 101</span><span class="c-name">Introductory Psychology</span><span class="c-count"><svg class="ico" width="16" height="16"><use href="#i-check"/></svg>5 deadlines</span></li>
</ol>
</div>
</figure>
<a class="btn btn-primary mid-cta" href="#waitlist" data-umami-event="waitlist-cta-scan">Join the waitlist</a>
</div>
</section>
<section class="section reminders" aria-labelledby="reminders-title">
<div class="wrap split">
<div class="rem-copy">
<h2 id="reminders-title">Customize your reminders</h2>
<ul class="check-list rem-points">
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-sliders"/></svg>Assignments, labs, quizzes, discussions and other items each get their own slider, set anywhere from 7 days before the due date to the morning it’s due.</li>
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-tag"/></svg>You can switch off a whole course, or a whole deadline type, and nothing in it reminds you again.</li>
<li><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-bell-off"/></svg>Reminders for an item stop once Learn shows your submission, or once you check it off in WATnow.</li>
</ul>
</div>
<figure class="rem-visual" role="img" aria-label="Example reminder: CS 341 Assignment 1 is due in 2 days. It’s due Thursday at 11:59 pm and you haven’t submitted it yet. Below it, the reminder settings, with one slider per deadline type: assignments 2 days before, labs 3 days before, quizzes 7 days before, discussions 1 day before, other items the morning of.">
<div class="notif" aria-hidden="true">
<span class="mark-tile"><svg class="notif-mark" width="30" height="30" focusable="false"><use href="#mark"/></svg></span>
<div>
<p class="notif-app">WATnow</p>
<p class="notif-title">CS 341 Assignment 1 is due in 2 days</p>
<p class="notif-body">It’s due Thursday at 11:59 pm and you haven’t submitted it yet.</p>
</div>
</div>
<div class="sheet rem-sheet" aria-hidden="true">
<p class="rs-title">Reminders</p>
<ul class="rs-list">
<li class="rs-row"><span class="rs-name">Assignments</span><span class="rs-val">2 days before</span><span class="sw is-on"></span><span class="rs-slider" style="--p:0.7143"><span class="rs-thumb"></span></span></li>
<li class="rs-row"><span class="rs-name">Labs</span><span class="rs-val">3 days before</span><span class="sw is-on"></span><span class="rs-slider" style="--p:0.5714"><span class="rs-thumb"></span></span></li>
<li class="rs-row"><span class="rs-name">Quizzes</span><span class="rs-val">7 days before</span><span class="sw is-on"></span><span class="rs-slider" style="--p:0"><span class="rs-thumb"></span></span></li>
<li class="rs-row"><span class="rs-name">Discussions</span><span class="rs-val">1 day before</span><span class="sw is-on"></span><span class="rs-slider" style="--p:0.8571"><span class="rs-thumb"></span></span></li>
<li class="rs-row"><span class="rs-name">Other items</span><span class="rs-val">Morning of</span><span class="sw is-on"></span><span class="rs-slider" style="--p:1"><span class="rs-thumb"></span></span></li>
</ul>
</div>
</figure>
</div>
</section>
<section id="waitlist" class="section waitlist" aria-labelledby="waitlist-title">
<div class="wrap waitlist-inner">
<div class="waitlist-copy">
<h2 id="waitlist-title">Join the waitlist</h2>
<p>Leave your email and I’ll message you when there’s a version you can try on your own courses.</p>
<p class="note browser-note"><svg class="ico" width="20" height="20" aria-hidden="true"><use href="#i-info"/></svg><span>The first version works in <strong>Chrome and Edge</strong>. Firefox and Safari are planned after that. Sign up either way and I’ll email you when yours is ready.</span></p>
</div>
<div class="form-slot" data-form-slot data-state="placeholder">
<div class="form-sheet">
<div class="form-fallback" role="status">
<p class="fallback-title">The waitlist opens soon</p>
<p>The form isn’t up yet. Open this page again later and it will be here.</p>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="site-footer wrap">
<a class="logo logo-small" href="./" aria-label="WATnow home">
<span class="mark-tile" aria-hidden="true"><svg class="logo-mark" width="24" height="24" focusable="false"><use href="#mark"/></svg></span>
<span class="wordmark" aria-hidden="true">WATnow</span>
</a>
<p>WATnow is not affiliated with or endorsed by D2L or the University of Waterloo. Learn is the University of Waterloo’s name for its D2L Brightspace course site.</p>
</footer>
</body>
</html>
|
