Skip to content

Commit d6233f3

Browse files
committed
refactor: move result html into its own file
1 parent 765ca95 commit d6233f3

File tree

2 files changed

+318
-317
lines changed

2 files changed

+318
-317
lines changed
Lines changed: 317 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,317 @@
1+
<div id="result" class="content-grid full-width hidden" tabindex="-1">
2+
<div class="wrapper">
3+
<div class="stats">
4+
<!-- <div class="info">words 10<br>punctuation</div> -->
5+
6+
<div class="group wpm">
7+
<div class="top">
8+
<div class="text">wpm</div>
9+
<div
10+
class="crown hidden"
11+
aria-label=""
12+
data-balloon-pos="up"
13+
data-balloon-length="medium"
14+
>
15+
<i class="fas fa-question"></i>
16+
<i class="fas fa-crown"></i>
17+
<i class="fas fa-slash"></i>
18+
<i class="fas fa-exclamation-triangle"></i>
19+
</div>
20+
</div>
21+
<div class="bottom" aria-label="" data-balloon-pos="up">-</div>
22+
</div>
23+
<div class="group acc">
24+
<div class="top">acc</div>
25+
<div class="bottom" aria-label="" data-balloon-pos="up">-</div>
26+
</div>
27+
</div>
28+
<div class="stats morestats">
29+
<div class="group testType">
30+
<div class="top">test type</div>
31+
<div class="bottom">-</div>
32+
<div class="tags hidden" style="margin-top: 0.5rem">
33+
<div class="top">
34+
<span>tags</span>
35+
<div
36+
class="textButton editTagsButton"
37+
result-id=""
38+
active-tag-ids=""
39+
aria-label="Edit tags"
40+
role="button"
41+
data-balloon-pos="right"
42+
>
43+
<i class="fas fa-pen fa-fw"></i>
44+
</div>
45+
</div>
46+
<div class="bottom">-</div>
47+
</div>
48+
</div>
49+
<!-- <div class="group infoAndTags"> -->
50+
<div class="group info">
51+
<div class="top">other</div>
52+
<div class="bottom">-</div>
53+
</div>
54+
55+
<!-- </div> -->
56+
<!-- <div class="subgroup"> -->
57+
<div class="group raw">
58+
<div class="top">raw</div>
59+
<div class="bottom" aria-label="" data-balloon-pos="up">-</div>
60+
</div>
61+
<div class="group key">
62+
<div class="top">characters</div>
63+
<div
64+
class="bottom"
65+
aria-label="correct&NewLine;incorrect&NewLine;extra&NewLine;missed"
66+
data-balloon-break=""
67+
data-balloon-pos="up"
68+
>
69+
-
70+
</div>
71+
</div>
72+
73+
<!-- </div> -->
74+
75+
<!-- <div class="subgroup"> -->
76+
<div class="group flat consistency">
77+
<div class="top">consistency</div>
78+
<div class="bottom" aria-label="" data-balloon-pos="up">2 -</div>
79+
</div>
80+
<div class="group time">
81+
<div class="top">time</div>
82+
<div class="bottom" aria-label="" data-balloon-pos="up">
83+
<div class="text">-</div>
84+
<div class="afk"></div>
85+
<div class="timeToday"></div>
86+
</div>
87+
</div>
88+
<!-- </div> -->
89+
90+
<div class="group dailyLeaderboard hidden">
91+
<div class="top">daily leaderboard</div>
92+
<div
93+
id="dailyLeaderboardRank"
94+
aria-label="Show daily leaderboard"
95+
data-balloon-pos="up"
96+
class="bottom"
97+
>
98+
-
99+
</div>
100+
</div>
101+
102+
<div class="group source hidden">
103+
<div class="top">
104+
<span style="margin-right: 0.5em">source</span>
105+
<span
106+
id="reportQuoteButton"
107+
class="textButton hidden"
108+
aria-label="Report quote"
109+
data-balloon-pos="up"
110+
style="display: inline-block"
111+
>
112+
<i class="icon fas fa-fw fa-flag"></i>
113+
</span>
114+
<span
115+
id="favoriteQuoteButton"
116+
class="textButton hidden"
117+
aria-label="Favorite quote"
118+
data-balloon-pos="up"
119+
style="display: inline-block"
120+
>
121+
<i class="icon far fa-fw fa-heart"></i>
122+
</span>
123+
<span
124+
id="rateQuoteButton"
125+
class="textButton hidden"
126+
aria-label="Rate quote"
127+
data-balloon-pos="up"
128+
>
129+
<i class="icon far fa-fw fa-star"></i>
130+
<span class="rating"></span>
131+
</span>
132+
</div>
133+
<div class="bottom">-</div>
134+
</div>
135+
</div>
136+
<div class="chart">
137+
<div class="chartLegend">
138+
<button class="text" tabindex="-1" data-id="pbLine">
139+
<i class="fas fa-crown"></i>
140+
<div class="text">pb</div>
141+
</button>
142+
<button class="text" tabindex="-1" data-id="tagPbLine">
143+
<i class="fas fa-tag"></i>
144+
<div class="text">tag pb</div>
145+
</button>
146+
<button class="text" tabindex="-1" data-id="raw">
147+
<div class="line dashed"></div>
148+
<div class="text">raw</div>
149+
</button>
150+
<button class="text" tabindex="-1" data-id="burst">
151+
<div class="line"></div>
152+
<div class="text">burst</div>
153+
</button>
154+
<button class="text" tabindex="-1" data-id="errors">
155+
<!-- <div class="line"></div> -->
156+
<i class="fas fa-times"></i>
157+
<div class="text">errors</div>
158+
</button>
159+
</div>
160+
<!-- <div class="title">wpm over time</div> -->
161+
<canvas id="wpmChart"></canvas>
162+
</div>
163+
<div class="bottom">
164+
<div id="resultWordsHistory" class="hidden">
165+
<div class="title">
166+
<span>input history</span>
167+
<button
168+
id="copyWordsListButton"
169+
class="textButton"
170+
aria-label="Copy words list"
171+
data-balloon-pos="up"
172+
style="display: inline-block"
173+
tabindex="-1"
174+
>
175+
<i class="fas fa-fw fa-align-left"></i>
176+
</button>
177+
<button
178+
id="copyMissedWordsListButton"
179+
class="textButton"
180+
aria-label="Copy missed words list"
181+
data-balloon-pos="up"
182+
tabindex="-1"
183+
>
184+
<i class="fas fa-fw fa-times"></i>
185+
</button>
186+
<button
187+
id="toggleBurstHeatmap"
188+
class="textButton"
189+
aria-label="Toggle burst heatmap"
190+
data-balloon-pos="up"
191+
style="display: inline-block"
192+
tabindex="-1"
193+
>
194+
<i class="fas fa-fw fa-fire-alt"></i>
195+
</button>
196+
<div class="heatmapLegend hidden">
197+
<div class="boxes">
198+
<div class="box box0"></div>
199+
<div class="box box1"></div>
200+
<div class="box box2"></div>
201+
<div class="box box3"></div>
202+
<div class="box box4"></div>
203+
</div>
204+
</div>
205+
</div>
206+
<div class="words"></div>
207+
</div>
208+
<div id="resultReplay" class="hidden">
209+
<div class="title">
210+
watch replay
211+
<button
212+
id="playpauseReplayButton"
213+
class="textButton"
214+
aria-label="Start replay"
215+
data-balloon-pos="up"
216+
style="display: inline-block"
217+
tabindex="-1"
218+
>
219+
<i class="fas fa-play"></i>
220+
</button>
221+
<p id="replayStats">0s</p>
222+
</div>
223+
<div id="replayWordsWrapper">
224+
<div id="replayWords" class="words"></div>
225+
</div>
226+
</div>
227+
<button id="retrySavingResultButton" class="danger hidden">
228+
<i class="fas fa-redo"></i>
229+
Retry saving result
230+
</button>
231+
<div class="buttons">
232+
<button
233+
class="text"
234+
id="nextTestButton"
235+
aria-label="Next test"
236+
role="button"
237+
data-balloon-pos="down"
238+
>
239+
<i class="fas fa-fw fa-chevron-right"></i>
240+
</button>
241+
<button
242+
class="text"
243+
id="restartTestButtonWithSameWordset"
244+
aria-label="Repeat test"
245+
role="button"
246+
data-balloon-pos="down"
247+
>
248+
<i class="fas fa-fw fa-sync-alt"></i>
249+
</button>
250+
<button
251+
class="text"
252+
id="practiseWordsButton"
253+
aria-label="Practice words"
254+
role="button"
255+
data-balloon-pos="down"
256+
>
257+
<i class="fas fa-fw fa-exclamation-triangle"></i>
258+
</button>
259+
<button
260+
class="text"
261+
id="showWordHistoryButton"
262+
aria-label="Toggle words history"
263+
role="button"
264+
data-balloon-pos="down"
265+
>
266+
<i class="fas fa-fw fa-align-left"></i>
267+
</button>
268+
<button
269+
class="text"
270+
id="watchReplayButton"
271+
aria-label="Watch replay"
272+
role="button"
273+
data-balloon-pos="down"
274+
>
275+
<i class="fas fa-fw fa-backward"></i>
276+
</button>
277+
<button
278+
class="text"
279+
id="saveScreenshotButton"
280+
aria-label="Copy screenshot to clipboard&#10;(shift click to download)"
281+
role="button"
282+
data-balloon-pos="down"
283+
data-balloon-break
284+
>
285+
<i class="far fa-fw fa-image"></i>
286+
</button>
287+
<!-- <button
288+
class="text"
289+
id="watchVideoAdButton"
290+
aria-label="Watch video ad"
291+
role="button"
292+
data-balloon-pos="down"
293+
>
294+
<i class="fas fa-fw fa-ad"></i>
295+
</button> -->
296+
</div>
297+
</div>
298+
<div class="loginTip">
299+
<a href="/login" router-link>Sign in</a>
300+
to save your result
301+
</div>
302+
<div class="ssWatermark hidden">monkeytype.com</div>
303+
</div>
304+
<div class="full-width" style="margin-top: 1rem">
305+
<div id="ad-result-wrapper" class="ad full-width advertisement ad-h">
306+
<div class="iconAndText">
307+
<div class="icon"><i class="fas fa-ad"></i></div>
308+
<div class="text textRight"></div>
309+
</div>
310+
<div id="ad-result"></div>
311+
</div>
312+
<div id="ad-result-small-wrapper" class="ad advertisement ad-h-s">
313+
<div class="icon small"><i class="fas fa-ad"></i></div>
314+
<div id="ad-result-small"></div>
315+
</div>
316+
</div>
317+
</div>

0 commit comments

Comments
 (0)