-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
94 lines (89 loc) · 5.35 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Joy Meter | can-do-ology.com</title>
<link href="css/main.css?v=1" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="container">
<div class="header">
<img src="img/header.png" />
<div class="intro">
<p>The <strong>Joy Meter™</strong> is designed to assist you in identifying the activities, tasks, or experiences that fill you with the most joy, guiding your decisions. It quantifies joy across three phases: before, during, and after the task, offering a comprehensive insight into the sources of your happiness. Each phase is scored, culminating in an overall joy rating for each activity, task, or experience.</p>
<p>To utilize the <strong>Joy Meter™</strong> (below), select an activity, task, or experience and record it in the initial column of the Joy Meter™. Then, observe and evaluate your feelings at the three different stages of the activity. Assign a score of 1 if you feel depleted, 5 if you feel profoundly joyful, or any number <strong>between 1 and 5</strong> that best reflects your level of joy. After entering your scores, the Joy Meter will compute your cumulative joy score to help you decide where to put your energy moving forward. </p>
</div>
</div>
<div class="content">
<table>
<tr valign="top" class="header-row">
<td class="label-col">What</td>
<td>Energy to Prep</td>
<td>Energy to Deliver</td>
<td>Energy After</td>
<td class="score-col">Score</td>
</tr>
<tr valign="top" class="calc-row">
<td class="label-col">
<textarea placeholder="Example: One-on one leadership coaching"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Building a standard program and models to use with every person was draining."></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Loved the live setting and troubleshooting. Taking a random call."></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Felt great and the participant couldn't wait for the next call."></textarea>
</td>
<td class="score-col"><div class="score"></div></td>
</tr>
<tr valign="top" class="calc-row">
<td class="label-col">
<textarea placeholder="Example: Facilitate a mastermind group"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Enjoyed building the framework and getting consensus among participants"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Fun working in the live environment and keeping the group on track and offering some thought leadership as well"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Six months with a positive outcome for all. I also learned from the others"></textarea>
</td>
<td class="score-col"><div class="score"></div></td>
</tr>
<tr valign="top" class="calc-row">
<td class="label-col">
<textarea placeholder="Example: Deliver a keynote at a conference (following an astronaut)"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Customized the material and my colleague Trish was on-site too"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Loved threading together previous speaker content into mine and the purpose of the conference"></textarea>
</td>
<td>
<input type="number" value="3" class="field" />
<textarea placeholder="Example: Initially exhausted. Then energized to work with other associations, organizations, and referrals"></textarea>
</td>
<td class="score-col"><div class="score"></div></td>
</tr>
</table>
</div>
<div class="footer">
<img src="img/footer.png" />
</div>
</div>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
</body>
</html>