-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
266 lines (227 loc) · 22.6 KB
/
script.js
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
257
258
259
260
261
262
263
264
265
266
//Initializing global data object, which will safe current task list
const data = (localStorage.getItem('tasksList'))
? JSON.parse(localStorage.getItem('tasksList'))
: {
uncompleted: [],
completed: [],
date: ['false']
};
//Initialize svg icons
const removeSVG = '<svg class="fill remove" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20pt" height="20pt" viewBox="0 0 20 20" version="1.1"><g><path d="M 17.882812 3.789062 C 17.882812 2.882812 17.148438 2.148438 16.242188 2.148438 L 12.261719 2.148438 L 12.261719 1.40625 C 12.261719 0.609375 11.613281 -0.0390625 10.816406 -0.0390625 L 9.175781 -0.0390625 C 8.378906 -0.0390625 7.730469 0.609375 7.730469 1.40625 L 7.730469 2.148438 L 3.75 2.148438 C 2.84375 2.148438 2.109375 2.882812 2.109375 3.789062 C 2.109375 4.453125 2.507812 5.023438 3.074219 5.28125 L 3.074219 17.949219 C 3.074219 19.054688 3.972656 19.953125 5.078125 19.953125 L 14.914062 19.953125 C 16.019531 19.953125 16.917969 19.054688 16.917969 17.949219 L 16.917969 10.671875 C 16.917969 10.457031 16.742188 10.28125 16.527344 10.28125 C 16.308594 10.28125 16.136719 10.457031 16.136719 10.671875 L 16.136719 17.949219 C 16.136719 18.625 15.585938 19.171875 14.914062 19.171875 L 5.078125 19.171875 C 4.40625 19.171875 3.855469 18.625 3.855469 17.949219 L 3.855469 5.429688 L 5.625 5.429688 L 9.824219 9.632812 C 9.902344 9.707031 10 9.746094 10.101562 9.746094 C 10.203125 9.746094 10.300781 9.707031 10.378906 9.632812 L 12.371094 7.640625 L 12.703125 7.972656 C 12.78125 8.046875 12.882812 8.085938 12.980469 8.085938 C 13.082031 8.085938 13.179688 8.046875 13.257812 7.972656 L 15.800781 5.429688 L 16.136719 5.429688 L 16.136719 7.695312 C 16.136719 7.914062 16.308594 8.085938 16.527344 8.085938 C 16.742188 8.085938 16.917969 7.914062 16.917969 7.695312 L 16.917969 5.28125 C 17.484375 5.023438 17.882812 4.453125 17.882812 3.789062 Z M 8.511719 1.40625 C 8.511719 1.039062 8.808594 0.742188 9.175781 0.742188 L 10.816406 0.742188 C 11.183594 0.742188 11.480469 1.039062 11.480469 1.40625 L 11.480469 2.148438 L 8.511719 2.148438 Z M 10.101562 8.800781 L 6.730469 5.429688 L 10.164062 5.429688 L 11.820312 7.085938 Z M 12.980469 7.144531 L 11.265625 5.429688 L 14.695312 5.429688 Z M 16.242188 4.648438 L 3.75 4.648438 C 3.273438 4.648438 2.890625 4.261719 2.890625 3.789062 C 2.890625 3.3125 3.273438 2.929688 3.75 2.929688 L 16.242188 2.929688 C 16.71875 2.929688 17.101562 3.3125 17.101562 3.789062 C 17.101562 4.261719 16.71875 4.648438 16.242188 4.648438 Z M 16.242188 4.648438 "/> <path d="M 16.25 8.78125 C 16.175781 8.855469 16.136719 8.957031 16.136719 9.058594 C 16.136719 9.160156 16.175781 9.261719 16.25 9.335938 C 16.320312 9.40625 16.421875 9.449219 16.527344 9.449219 C 16.628906 9.449219 16.730469 9.40625 16.800781 9.335938 C 16.875 9.261719 16.914062 9.160156 16.914062 9.058594 C 16.914062 8.957031 16.875 8.855469 16.800781 8.78125 C 16.730469 8.710938 16.628906 8.667969 16.527344 8.667969 C 16.421875 8.667969 16.320312 8.710938 16.25 8.78125 Z M 16.25 8.78125 "/> <path d="M 13.214844 9.058594 L 13.214844 17.027344 C 13.214844 17.242188 13.390625 17.417969 13.605469 17.417969 C 13.820312 17.417969 13.996094 17.242188 13.996094 17.027344 L 13.996094 9.058594 C 13.996094 8.84375 13.820312 8.667969 13.605469 8.667969 C 13.390625 8.667969 13.214844 8.84375 13.214844 9.058594 Z M 13.214844 9.058594 "/> <path d="M 9.605469 13.171875 L 9.605469 17.027344 C 9.605469 17.242188 9.78125 17.417969 9.996094 17.417969 C 10.210938 17.417969 10.386719 17.242188 10.386719 17.027344 L 10.386719 13.171875 C 10.386719 12.957031 10.210938 12.78125 9.996094 12.78125 C 9.78125 12.78125 9.605469 12.957031 9.605469 13.171875 Z M 9.605469 13.171875 "/> <path d="M 5.996094 8.082031 L 5.996094 17.027344 C 5.996094 17.242188 6.171875 17.417969 6.386719 17.417969 C 6.601562 17.417969 6.777344 17.242188 6.777344 17.027344 L 6.777344 8.082031 C 6.777344 7.867188 6.601562 7.691406 6.386719 7.691406 C 6.171875 7.691406 5.996094 7.867188 5.996094 8.082031 Z M 5.996094 8.082031 "/> <path d="M 10.273438 11.101562 C 10.199219 11.027344 10.097656 10.984375 9.996094 10.984375 C 9.894531 10.984375 9.792969 11.027344 9.71875 11.101562 C 9.648438 11.171875 9.605469 11.273438 9.605469 11.375 C 9.605469 11.480469 9.648438 11.578125 9.71875 11.652344 C 9.792969 11.726562 9.894531 11.765625 9.996094 11.765625 C 10.097656 11.765625 10.199219 11.726562 10.273438 11.652344 C 10.34375 11.578125 10.386719 11.480469 10.386719 11.375 C 10.386719 11.273438 10.34375 11.171875 10.273438 11.101562 Z M 10.273438 11.101562 "/></g></svg>';
const doneSVG = '<svg class="fill done" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20pt" height="20pt" viewBox="0 0 20 20" version="1.1"><g style="stroke-width: 2px"><path d="M 8.792969 13.261719 C 8.851562 13.308594 8.925781 13.332031 9 13.332031 C 9.09375 13.332031 9.183594 13.296875 9.25 13.222656 L 14.582031 7.222656 C 14.703125 7.085938 14.691406 6.871094 14.554688 6.75 C 14.417969 6.628906 14.207031 6.640625 14.085938 6.777344 L 8.960938 12.542969 L 5.875 10.074219 C 5.730469 9.957031 5.519531 9.980469 5.40625 10.125 C 5.292969 10.269531 5.316406 10.480469 5.457031 10.59375 Z M 8.792969 13.261719 "/></g></svg>';
// const importantSVG = '<svg class="fill important" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20pt" height="20pt" viewBox="0 0 20 20" version="1.1"><g><path d="M 17.085938 8.390625 C 17.039062 8.273438 16.921875 8.199219 16.796875 8.207031 C 16.667969 8.21875 16.566406 8.3125 16.539062 8.433594 C 16.464844 8.804688 16.152344 9.839844 15.636719 10.167969 C 15.550781 10.222656 15.488281 10.171875 15.464844 10.148438 C 15.433594 10.121094 15.394531 10.058594 15.445312 9.980469 C 15.769531 9.476562 15.96875 8.972656 16.03125 8.480469 C 16.300781 6.339844 14.847656 4.453125 14.785156 4.375 C 14.710938 4.28125 14.582031 4.242188 14.46875 4.28125 C 14.351562 4.320312 14.277344 4.429688 14.277344 4.550781 C 14.277344 6.109375 13.140625 7.441406 12.574219 7.511719 C 12.511719 7.519531 12.449219 7.527344 12.410156 7.367188 C 12.316406 7.003906 12.558594 6.503906 12.835938 5.925781 C 13.300781 4.96875 13.875 3.777344 13.289062 2.410156 C 12.894531 1.488281 12.195312 0.78125 11.261719 0.359375 C 10.5625 0.046875 9.976562 0.00390625 9.953125 0 C 9.824219 -0.0078125 9.703125 0.0742188 9.664062 0.195312 C 9.625 0.320312 9.671875 0.457031 9.78125 0.527344 C 9.847656 0.566406 11.324219 1.519531 10.582031 2.785156 C 10.285156 3.296875 9.695312 3.699219 9.019531 4.160156 C 7.933594 4.898438 6.703125 5.738281 6.1875 7.367188 C 6.164062 7.433594 6.109375 7.453125 6.085938 7.457031 C 6.0625 7.464844 6.011719 7.464844 5.96875 7.421875 L 5.964844 7.417969 C 5.664062 7.105469 6.003906 6.335938 6.144531 6.09375 C 6.207031 5.988281 6.195312 5.859375 6.121094 5.769531 C 6.042969 5.675781 5.917969 5.640625 5.804688 5.679688 C 5.777344 5.691406 5.1875 5.902344 4.636719 6.464844 C 4.125 6.984375 3.554688 7.910156 3.730469 9.363281 C 3.742188 9.457031 3.757812 9.546875 3.773438 9.636719 C 3.027344 10.738281 2.632812 12.023438 2.632812 13.359375 C 2.632812 17.019531 5.609375 20 9.273438 20 C 11.035156 20 12.695312 19.316406 13.945312 18.078125 C 15.160156 16.875 15.855469 15.28125 15.910156 13.578125 C 16.246094 13.328125 16.539062 12.972656 16.785156 12.523438 C 17.867188 10.5 17.117188 8.476562 17.085938 8.390625 Z M 16.28125 12.253906 C 16.054688 12.675781 15.785156 12.988281 15.472656 13.183594 C 15.394531 13.238281 15.34375 13.324219 15.34375 13.421875 C 15.328125 15.03125 14.6875 16.539062 13.542969 17.671875 C 12.398438 18.804688 10.882812 19.429688 9.273438 19.429688 C 5.925781 19.429688 3.203125 16.707031 3.203125 13.359375 C 3.203125 12.097656 3.585938 10.890625 4.308594 9.863281 C 4.351562 9.800781 4.371094 9.71875 4.355469 9.640625 C 4.332031 9.53125 4.3125 9.414062 4.296875 9.296875 C 4.121094 7.851562 4.785156 7.027344 5.332031 6.601562 C 5.234375 7.003906 5.230469 7.472656 5.554688 7.8125 C 5.554688 7.8125 5.554688 7.816406 5.554688 7.816406 L 5.558594 7.820312 C 5.730469 7.996094 5.976562 8.070312 6.214844 8.011719 C 6.460938 7.957031 6.652344 7.777344 6.730469 7.539062 C 7.1875 6.097656 8.332031 5.320312 9.339844 4.632812 C 10.042969 4.152344 10.710938 3.699219 11.074219 3.074219 C 11.5 2.347656 11.457031 1.582031 10.949219 0.871094 C 10.941406 0.859375 10.933594 0.847656 10.925781 0.835938 C 10.964844 0.851562 11.003906 0.871094 11.046875 0.890625 C 11.847656 1.253906 12.425781 1.84375 12.765625 2.632812 C 13.25 3.761719 12.757812 4.78125 12.324219 5.679688 C 12.007812 6.332031 11.710938 6.945312 11.855469 7.511719 C 11.960938 7.910156 12.261719 8.125 12.644531 8.078125 C 13.378906 7.984375 14.445312 6.851562 14.757812 5.382812 C 15.136719 6.070312 15.617188 7.210938 15.464844 8.410156 C 15.414062 8.8125 15.246094 9.238281 14.964844 9.671875 C 14.78125 9.957031 14.820312 10.308594 15.058594 10.550781 C 15.300781 10.792969 15.65625 10.832031 15.945312 10.648438 C 16.3125 10.410156 16.582031 9.984375 16.765625 9.574219 C 16.84375 10.28125 16.804688 11.273438 16.28125 12.253906 Z M 16.28125 12.253906 "/><path d="M 14.730469 12.535156 C 14.523438 11.269531 13.871094 10.113281 12.890625 9.277344 C 11.902344 8.429688 10.636719 7.960938 9.335938 7.960938 C 8.027344 7.960938 6.761719 8.429688 5.773438 9.28125 C 4.792969 10.121094 4.140625 11.28125 3.933594 12.550781 C 3.910156 12.707031 4.015625 12.851562 4.167969 12.875 C 4.183594 12.878906 4.199219 12.878906 4.214844 12.878906 C 4.351562 12.878906 4.472656 12.78125 4.496094 12.640625 C 4.679688 11.507812 5.265625 10.464844 6.144531 9.710938 C 7.03125 8.953125 8.164062 8.53125 9.335938 8.53125 C 10.503906 8.53125 11.632812 8.949219 12.519531 9.707031 C 13.398438 10.460938 13.984375 11.496094 14.167969 12.628906 C 14.195312 12.785156 14.34375 12.886719 14.496094 12.863281 C 14.652344 12.835938 14.757812 12.691406 14.730469 12.535156 Z M 14.730469 12.535156 "/><path d="M 14.445312 14.359375 C 14.292969 14.324219 14.140625 14.417969 14.101562 14.570312 C 13.851562 15.625 13.246094 16.582031 12.394531 17.261719 C 11.515625 17.964844 10.460938 18.335938 9.335938 18.335938 C 8.207031 18.335938 7.148438 17.960938 6.269531 17.257812 C 5.417969 16.574219 4.8125 15.617188 4.5625 14.558594 C 4.527344 14.40625 4.375 14.3125 4.21875 14.347656 C 4.066406 14.382812 3.972656 14.535156 4.007812 14.691406 C 4.285156 15.871094 4.960938 16.941406 5.914062 17.703125 C 6.878906 18.476562 8.09375 18.90625 9.335938 18.90625 C 10.570312 18.90625 11.785156 18.480469 12.75 17.707031 C 13.699219 16.949219 14.378906 15.878906 14.65625 14.703125 C 14.695312 14.550781 14.597656 14.398438 14.445312 14.359375 Z M 14.445312 14.359375 "/></g></svg>';
// const activeImportantSVG = '<svg class="fill important active" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20pt" height="20pt" viewBox="0 0 20 20" version="1.1"><g><path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,29.803922%,29.803922%);fill-opacity:1;" d="M 16.820312 8.492188 C 16.820312 8.492188 16.519531 9.941406 15.789062 10.410156 C 15.40625 10.652344 14.960938 10.207031 15.207031 9.824219 C 15.480469 9.398438 15.683594 8.933594 15.746094 8.445312 C 16.007812 6.394531 14.558594 4.550781 14.558594 4.550781 C 14.558594 6.792969 12.429688 8.59375 12.132812 7.4375 C 11.835938 6.285156 13.921875 4.605469 13.027344 2.519531 C 12.132812 0.433594 9.933594 0.285156 9.933594 0.285156 C 9.933594 0.285156 11.722656 1.402344 10.828125 2.929688 C 9.992188 4.359375 7.265625 4.910156 6.457031 7.453125 C 6.363281 7.75 5.984375 7.847656 5.765625 7.621094 C 5.761719 7.621094 5.761719 7.617188 5.757812 7.613281 C 5.242188 7.070312 5.898438 5.949219 5.898438 5.949219 C 5.898438 5.949219 3.699219 6.730469 4.015625 9.332031 C 4.03125 9.460938 4.050781 9.582031 4.074219 9.699219 C 3.34375 10.734375 2.917969 11.996094 2.917969 13.359375 C 2.917969 16.871094 5.761719 19.714844 9.273438 19.714844 C 12.761719 19.714844 15.59375 16.90625 15.628906 13.425781 C 15.941406 13.226562 16.257812 12.898438 16.53125 12.386719 C 17.570312 10.457031 16.820312 8.492188 16.820312 8.492188 Z M 16.820312 8.492188 "/><path style=" stroke:none;fill-rule:nonzero;fill:rgb(95.294118%,22.352941%,22.352941%);fill-opacity:1;" d="M 14.726562 8.78125 C 14.664062 9.269531 14.460938 9.734375 14.1875 10.160156 C 13.9375 10.542969 14.386719 10.988281 14.769531 10.746094 C 14.941406 10.636719 15.085938 10.472656 15.210938 10.289062 C 15.121094 10.160156 15.101562 9.988281 15.207031 9.824219 C 15.480469 9.398438 15.683594 8.933594 15.746094 8.445312 C 16.007812 6.394531 14.558594 4.550781 14.558594 4.550781 C 14.558594 5.097656 14.433594 5.621094 14.238281 6.078125 C 14.5625 6.792969 14.855469 7.761719 14.726562 8.78125 Z M 14.726562 8.78125 "/><path style=" stroke:none;fill-rule:nonzero;fill:rgb(95.294118%,22.352941%,22.352941%);fill-opacity:1;" d="M 10.957031 1.460938 C 11.359375 1.789062 11.742188 2.238281 12.007812 2.855469 C 12.902344 4.945312 10.816406 6.621094 11.113281 7.773438 C 11.25 8.308594 11.78125 8.210938 12.308594 7.730469 C 12.230469 7.671875 12.167969 7.578125 12.132812 7.4375 C 11.835938 6.285156 13.921875 4.605469 13.027344 2.519531 C 12.132812 0.433594 9.933594 0.285156 9.933594 0.285156 C 9.933594 0.285156 10.660156 0.738281 10.957031 1.460938 Z M 10.957031 1.460938 "/><path style=" stroke:none;fill-rule:nonzero;fill:rgb(95.294118%,22.352941%,22.352941%);fill-opacity:1;" d="M 13.929688 13.425781 C 13.898438 16.617188 11.511719 19.246094 8.425781 19.660156 C 8.558594 19.675781 8.691406 19.691406 8.828125 19.699219 C 8.84375 19.699219 8.855469 19.699219 8.867188 19.703125 C 8.921875 19.707031 8.972656 19.707031 9.027344 19.710938 C 9.042969 19.710938 9.058594 19.710938 9.074219 19.710938 C 9.140625 19.714844 9.207031 19.714844 9.273438 19.714844 C 9.335938 19.714844 9.398438 19.714844 9.460938 19.710938 C 9.476562 19.710938 9.496094 19.710938 9.515625 19.710938 C 9.5625 19.707031 9.605469 19.707031 9.648438 19.703125 C 9.667969 19.703125 9.691406 19.703125 9.710938 19.699219 C 9.753906 19.695312 9.800781 19.691406 9.84375 19.6875 C 9.859375 19.6875 9.878906 19.6875 9.894531 19.683594 C 9.957031 19.679688 10.019531 19.671875 10.078125 19.664062 C 10.082031 19.664062 10.082031 19.664062 10.082031 19.664062 C 10.140625 19.65625 10.203125 19.648438 10.261719 19.636719 C 10.277344 19.636719 10.292969 19.632812 10.3125 19.628906 C 10.355469 19.621094 10.398438 19.613281 10.445312 19.605469 C 10.460938 19.605469 10.480469 19.601562 10.5 19.597656 C 10.542969 19.585938 10.589844 19.578125 10.636719 19.566406 C 10.648438 19.566406 10.664062 19.5625 10.675781 19.558594 C 10.738281 19.546875 10.796875 19.53125 10.855469 19.515625 C 13.578125 18.816406 15.597656 16.359375 15.628906 13.425781 C 15.941406 13.226562 16.257812 12.898438 16.53125 12.386719 C 17.570312 10.457031 16.820312 8.492188 16.820312 8.492188 C 16.820312 8.492188 16.519531 9.941406 15.789062 10.410156 C 15.789062 10.410156 15.953125 11.960938 13.929688 13.425781 Z M 13.929688 13.425781 "/><path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,69.411765%,14.509804%);fill-opacity:1;" d="M 14.519531 13.433594 C 14.519531 16.296875 12.199219 18.621094 9.335938 18.621094 C 6.46875 18.621094 4.148438 16.296875 4.148438 13.433594 C 4.148438 10.570312 6.46875 8.246094 9.335938 8.246094 C 12.199219 8.246094 14.519531 10.570312 14.519531 13.433594 Z M 14.519531 13.433594 "/><path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,56.470588%,11.372549%);fill-opacity:1;" d="M 9.335938 8.246094 C 9.03125 8.246094 8.738281 8.273438 8.449219 8.324219 C 10.894531 8.742188 12.753906 10.871094 12.753906 13.433594 C 12.753906 15.996094 10.894531 18.125 8.449219 18.542969 C 8.738281 18.59375 9.03125 18.621094 9.335938 18.621094 C 12.199219 18.621094 14.519531 16.296875 14.519531 13.433594 C 14.519531 10.570312 12.199219 8.246094 9.335938 8.246094 Z M 9.335938 8.246094 "/></g></svg>';
// Initialize current date, adding taskDateBlock, creating translateDate function
//get current date
let taskDate = new Date();
//Initialize 2 arrays with week days russian names and month russian names
const rusMonths = ['Января','Февраля','Мара','Апреля','Мая','Июня','Июля','Августа','Сентября','Октября','Ноября','Декабря'];
const rusWeekDays = ['Понедельник','Вторник','Среда','Четверг','Пятница','Суббота','Воскресение'];
let dateStr = taskDate.toString();
let rusMonth = dateStr.slice(4,7);
let rusWeekDay = dateStr.slice(0,3);
let day = dateStr.slice(8,10);
//translate month and week day to russian language
function translateDate() {
switch (rusMonth) {
case 'Jan' : rusMonth = rusMonths[0];
break;
case 'Feb' : rusMonth = rusMonths[1];
break;
case 'Mar' : rusMonth = rusMonths[2];
break;
case 'Apr' : rusMonth = rusMonths[3];
break;
case 'May' : rusMonth = rusMonths[4];
break;
case 'Jun' : rusMonth = rusMonths[5];
break;
case 'Jul' : rusMonth = rusMonths[6];
break;
case 'Aug' : rusMonth = rusMonths[7];
break;
case 'Sep' : rusMonth = rusMonths[8];
break;
case 'Oct' : rusMonth = rusMonths[9];
break;
case 'Nov' : rusMonth = rusMonths[10];
break;
case 'Dec' : rusMonth = rusMonths[11];
break;
}
switch (rusWeekDay) {
case 'Mon' : rusWeekDay = rusWeekDays[0];
break;
case 'Tue' : rusWeekDay = rusWeekDays[1];
break;
case 'Wed' : rusWeekDay = rusWeekDays[2];
break;
case 'Thu' : rusWeekDay = rusWeekDays[3];
break;
case 'Fri' : rusWeekDay = rusWeekDays[4];
break;
case 'Sat' : rusWeekDay = rusWeekDays[5];
break;
case 'Sun' : rusWeekDay = rusWeekDays[6];
break;
}
taskDate = rusWeekDay + ', ' + dateStr.slice(8,10) + ' ' + rusMonth + ' ' + dateStr.slice(11,15);
}
//IF (first start) date has default value -> create current date and create 'day' variable = current day -> adding date-block on the page
//ELSE (retry start) create date-block, IF 'day' === data.day (obj) -> call renderTasks(), else localstorage.clear();
//first start
if(data.date === 'false') {
translateDate();
let taskDateBlock = document.createElement('div');
taskDateBlock.classList.add('tasks-date-block');
taskDateBlock.innerHTML = taskDate;
document.body.insertBefore(taskDateBlock, document.body.childNodes[3] );
data.date = day;
//current day
} else if(data.date === day) {
renderTasks(data);
//clear the storage
} else {
localStorage.clear();
translateDate();
let taskDateBlock = document.createElement('div');
taskDateBlock.classList.add('tasks-date-block');
taskDateBlock.innerHTML = taskDate;
document.body.insertBefore(taskDateBlock, document.body.childNodes[3] );
data.date = day;
}
//add eventlistener for addTask button
document.getElementById('add-new-task-btn').addEventListener('click', function() {
let value = document.getElementById('item').value;
if (value) {
addTask(value);
document.getElementById('item').value = '';
data.uncompleted.push(value);
console.log(data);
} else {
//change the placeholder if input is clear
function change() {
if (item.placeholder === 'Введите задачу...') {
item.placeholder = 'Новая задача...';
} else if (item.placeholder === 'Новая задача...') {
item.placeholder = 'Добавить задачу...';
} else if (item.placeholder === 'Добавить задачу...') {
item.placeholder = 'Введите задачу...';
}
}
change();
}
//update data object
dataObjectUpdate();
});
//Creatin function for render localStorage data to html
function renderTasks() {
//for uncomleted tasks
for (let i = 0; i < data.uncompleted.length; i++) {
let value = data.uncompleted[i];
addTask(value);
}
//for completed tasks
for (let j = 0; j < data.completed.length; j++) {
let value = data.completed[j];
addTask(value, true);
}
}
//creating dataObjectUpdate function for push changes to localStorage
function dataObjectUpdate() {
localStorage.setItem('tasksList', JSON.stringify(data));
}
function removeTask() {
let content = this.parentNode.parentNode.parentNode;
let task = this.parentNode.parentNode;
let id = content.id;
let value = task.innerText;
if(id === 'uncompleted') {
data.uncompleted.splice(data.uncompleted.indexOf(value), 1);
} else {
data.completed.splice(data.completed.indexOf(value), 1);
}
content.removeChild(task);
dataObjectUpdate();
}
function doneTask() {
let content = this.parentNode.parentNode.parentNode;
let task = this.parentNode.parentNode;
let id = content.id;
let target;
let icon = this;
let value = task.innerText;
if(id === 'uncompleted') {
data.uncompleted.splice(data.uncompleted.indexOf(value), 1);
data.completed.push(value);
} else {
data.completed.splice(data.completed.indexOf(value), 1);
data.uncompleted.push(value);
}
if(id === 'uncompleted') {
target = document.getElementById('completed');
icon.classList.add('done');
} else {
target = document.getElementById('uncompleted');
icon.classList.remove('done');
}
content.removeChild(task);
target.insertBefore(task, target.childNodes[0]);
//remove the hint welcome text
let welcomeText = document.getElementById('welcome-done-text');
if(welcomeText) {
welcomeText.remove();
}
dataObjectUpdate();
}
function addTask(text, completed) {
let content = (completed) ? document.getElementById('completed') : document.getElementById('uncompleted');
let task = document.createElement('div')
task.innerHTML = text;
task.classList.add('task');
let taskButtons = document.createElement('div');
taskButtons.classList.add('task-buttons');
let remove = document.createElement('button');
remove.classList.add('button');
remove.innerHTML = removeSVG;
remove.addEventListener('click', removeTask);
let done = document.createElement('button');
done.classList.add('button');
done.innerHTML = doneSVG;
done.addEventListener('click', doneTask);
task.appendChild(taskButtons);
taskButtons.appendChild(done);
taskButtons.appendChild(remove);
content.insertBefore(task, content.childNodes[0]);
let welcomeText = document.getElementById('welcome-current-text');
if(welcomeText) {
welcomeText.remove();
}
//add function which will add eventlisteners for touches
eventList();
}
function eventList() {
let start;
let end;
let currentWindowTasksList = document.getElementsByClassName('task');
for (let i = 0; i < currentWindowTasksList.length; i++) {
let button = document.getElementsByClassName('button')[i];
currentWindowTasksList[i].addEventListener('touchstart', function(e) {
start = e.changedTouches[0].clientX;
})
currentWindowTasksList[i].addEventListener('touchend', function(e) {
end = e.changedTouches[0].clientX;
if(start - end >= 50) {
removeTask.call(button);
} else if (end - start >= 50) {
let id = button.parentNode.parentNode.parentNode.id;
let value = button.parentNode.parentNode.innerText;
if(id === 'completed') {
doneTask.call(button, value, completed);
} else {
doneTask.call(button, value)
}
}
})
}
}