-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
172 lines (164 loc) · 8.6 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
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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pomodoro Timer</title>
<meta name="description" content="Simple Pomodoro Timer.">
<meta name="author" content="Konstantin Morenko">
<meta property="og:title" content="Pomodoro Timer">
<meta property="og:type" content="website">
<meta property="og:url" content="">
<meta property="og:description" content="Simple Pomodoro Timer">
<meta property="og:image" content="timer.png">
<link rel="icon" href="/favicon.ico">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="main.css">
<script src="script.js"></script>
</head>
<body>
<div id="timer">
<header>Pomodoro Timer <sup title="Build: {{ 'now' | date: '%Y-%m-%d' }}">1.6</sup></header>
<div id="timer-panel">
<div id="timer-intervals" class="button-panel">
<button id="button-work" onclick="user.work()">Работа</button>
<button id="button-short" onclick="user.short()">Перерыв</button>
<button id="button-long" onclick="user.long()">Отдых</button>
</div>
<div id="timer-counter">
<div id="timer-counter-digital">
00:00
</div>
</div>
<div id="timer-counter-scale">
<div id="timer-counter-progress" style="width: 50%"></div>
</div>
<div id="timer-control" class="button-panel">
<button id="button-start" onclick="user.start()">Старт</button>
<button id="button-pause" onclick="user.pause()">Пауза</button>
<button id="button-reset" onclick="user.reset()">Сброс</button>
<button onclick="user.end()">Конец</button>
</div>
</div>
</div>
<div id="keybindings">
<header>Горячие клавиши</header>
<p>Все клавиши работают во всех раскладках и со всеми
клавишами-модификаторами.</p>
<p>Для настройки интервалов времени переключите на нужный таймер и
используйте клавиши <kbd>+</kbd> и <kbd>-</kbd> на клавиатуре.
Значения сохраняются.</p>
<p>Для корректировки текущего таймера без сохранения (когда нужно временно скорректировать таймер), используйте <kbd>[</kbd> и <kbd>]</kbd>. Изменения не сохраняются.</p>
<ul>
<li><kbd>1</kbd> Работа</li>
<li><kbd>2</kbd> Перерыв</li>
<li><kbd>3</kbd> Отдых</li>
<li><kbd>q</kbd> Остановить сигнал</li>
<li><kbd>a</kbd> Старт</li>
<li><kbd>s</kbd> Пауза</li>
<li><kbd>d</kbd> Сброс</li>
<li><kbd>f</kbd> Конец</li>
<li><kbd>Пробел</kbd> (Остановить сигнал) Переключить таймер в режимы Старт/Пауза, в диалоговом окне — подтвердить выбор</li>
<li><kbd>+</kbd> [В режиме "Сброс"] Увеличить текущий таймер и сохранить значение</li>
<li><kbd>-</kbd> [В режиме "Сброс"] Уменьшить текущий таймер и сохранить значение</li>
<li><kbd>[</kbd> Увеличить текущий таймер, но не сохранять значение (действует до конца отсчета или сброса)
<li><kbd>]</kbd> Уменьшить текущий таймер, но не сохранять значение (действует до конца отсчета или сброса)
</ul>
</div>
<div id="preferences">
<header>Настройки</header>
<div id="preferences-panel">
<div class="button-panel">
<button id="button-wipe-all" onclick="user.wipe_all()">Сбросить все настройки</button>
<button id="button-check-alarm" onclick="user.check_alarm()">Проверить сигнал</button>
<button id="button-check-notification" onclick="user.check_notification()">Проверить уведомление</button>
</div>
<div class="adjust-panel">
<div class="label">
Громкость всех звуков
</div>
<div class="adjust">
<button onclick="user.volume_dec()">-</button>
<div id="volume_value" class="value"></div>
<button onclick="user.volume_inc()">+</button>
</div>
</div>
<div class="adjust-panel">
<div class="label">
Уведомление перед окончанием рабочего интервала
</div>
<div class="adjust">
<button onclick="user.prenotify_dec()">-</button>
<div id="pre_notification" class="value"></div>
<button onclick="user.prenotify_inc()">+</button>
</div>
</div>
</div>
<div id="preferences-message">
<div style="text-align: center; margin: 16px auto;">Настройки доступны только когда таймер находится в режиме «Сброс»</div>
</div>
</div>
<div id="method">
<header>Метод Pomodoro</header>
<ol>
<li>Выберите задачу</li>
<li>Устраните все отвлекающие факторы</li>
<li>Запустите таймер «Работа», сконцентрируйтесь и работайте</li>
<li>По окончании таймера запустите таймер «Перерыв», отвлекитесь от работы</li>
<li>По окончании таймера возвращайтесь к работе</li>
<li>После нескольких повторений запустите таймер «Отдых», отдохните</li>
<li>Работайте не более пяти часов в день</li>
</ol>
<p>«Перерыв» означает короткий перерыв между рабочими интервалами,
«Отдых» означает длинный перерыв после серии рабочих
интервалов.</p>
<p>Основная кнопка на клавиатуре — «Пробел» — она прекращает
сигнал, запускает и останавливает таймер. Таймеры переключаются
автоматически. Кнопка «Конец» досрочно завершает текущий интервал
«как есть».</p>
<p>Более подробно об этом методе работы можно прочитать в моей книге
«<a href="https://konstantin-morenko.ru/#books">Ритмичная работа</a>»</p>
</div>
<div id="about">
<header>О таймере</header>
<p>На сервере хранится только исходный код таймера. Все настройки
хранятся в вашем браузере. Данные не переносятся между
браузерами.</p>
<p>Программист: <a href="https://konstantin-morenko.ru">Константин Моренко</a></p>
<p>Для отзывов и предложений:
<ul style="list-style-type: none;">
<li><a href="mailto:[email protected]">[email protected]</a></li>
<li><a href="https://github.com/konstantin-morenko/web-pomodoro/issues">GitHub Issues</a></li>
</ul>
</p>
<p>Исходный код: <a href="https://github.com/konstantin-morenko/web-pomodoro">GitHub</a></p>
</div>
<script>
init();
document.addEventListener('keypress', keypress);
window.addEventListener("beforeunload", function(e) {
status = countdown.status();
if(status == "active" || status == "paused") {
e.preventDefault();
}
});
update_parameters();
</script>
<!-- Yandex.Metrika counter -->
<script type="text/javascript" >
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
m[i].l=1*new Date();
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
ym(92017731, "init", {
clickmap:true,
trackLinks:true,
accurateTrackBounce:true
});
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/92017731" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->
</body>
</html>