Hugging Face's logo

Spaces:
vertalius
/
rude-russian-clock
Running

App Files Community
vertalius commited on
Commit
fc1e752
·
verified ·
1 Parent(s): 5fbb7ab

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +120 -63
  2. prompts.txt +1 -0
index.html CHANGED
@@ -36,6 +36,7 @@
36
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
37
  border-radius: 20px;
38
  overflow: hidden;
 
39
  }
40
 
41
  .digital-clock {
@@ -46,6 +47,12 @@
46
  .rude-text {
47
  min-height: 100px;
48
  border-left: 5px solid #ff4757;
 
 
 
 
 
 
49
  }
50
 
51
  .btn {
@@ -70,12 +77,78 @@
70
  0%, 100% { opacity: 1; }
71
  50% { opacity: 0.5; }
72
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
73
  </style>
74
  </head>
75
  <body class="min-h-screen flex items-center justify-center p-4 night">
76
  <div class="clock-container bg-gray-900 bg-opacity-80 w-full max-w-2xl">
77
  <div class="p-8">
78
- <h1 class="text-3xl font-bold text-center mb-6 text-red-400">
79
  <i class="fas fa-clock mr-2"></i> Матюкливые часы
80
  </h1>
81
 
@@ -88,7 +161,7 @@
88
  </div>
89
  </div>
90
 
91
- <div class="rude-text bg-gray-800 p-6 rounded-lg mb-6 text-2xl text-center font-medium text-yellow-300">
92
  Нажми кнопку, чтобы узнать время, придурок!
93
  </div>
94
 
@@ -173,34 +246,6 @@
173
  13: "первого"
174
  };
175
 
176
- const minutesInWords = {
177
- 1: "минута",
178
- 2: "минуты",
179
- 3: "минуты",
180
- 4: "минуты",
181
- 5: "минут",
182
- 6: "минут",
183
- 7: "минут",
184
- 8: "минут",
185
- 9: "минут",
186
- 10: "минут"
187
- };
188
-
189
- const hoursInWords = {
190
- 1: "час",
191
- 2: "часа",
192
- 3: "часа",
193
- 4: "часа",
194
- 5: "часов",
195
- 6: "часов",
196
- 7: "часов",
197
- 8: "часов",
198
- 9: "часов",
199
- 10: "часов",
200
- 11: "часов",
201
- 12: "часов"
202
- };
203
-
204
  // Функции для преобразования чисел в слова
205
  function numberToWords(num) {
206
  if (num <= 20 || num % 10 === 0) {
@@ -256,6 +301,34 @@
256
  return arr[Math.floor(Math.random() * arr.length)];
257
  }
258
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
259
  // Основная функция для генерации грубого времени
260
  function generateRudeTime() {
261
  const now = new Date();
@@ -307,43 +380,12 @@
307
  } else if (minutes >= 40 && minutes <= 59) {
308
  // Схема для минут от 40 до 59
309
  const minutesLeft = 60 - minutes;
310
- let minutesLeftText;
311
-
312
- if (minutesLeft === 1) {
313
- minutesLeftText = "одной";
314
- } else if (minutesLeft === 2) {
315
- minutesLeftText = "двух";
316
- } else if (minutesLeft === 3) {
317
- minutesLeftText = "трёх";
318
- } else if (minutesLeft === 4) {
319
- minutesLeftText = "четырёх";
320
- } else if (minutesLeft === 8) {
321
- minutesLeftText = "восьми";
322
- } else {
323
- minutesLeftText = numberToWords(minutesLeft);
324
- // Простое преобразование в родительный падеж (не идеальное, но для демонстрации)
325
- if (minutesLeft >= 5 && minutesLeft <= 20) {
326
- minutesLeftText += "и";
327
- } else if (minutesLeft % 10 === 0) {
328
- minutesLeftText = minutesLeftText.replace("дцать", "дцати");
329
- } else {
330
- const tens = Math.floor(minutesLeft / 10) * 10;
331
- const units = minutesLeft % 10;
332
- if (tens === 20) {
333
- minutesLeftText = `двадцати ${numberToWords(units)}`;
334
- } else if (tens === 30) {
335
- minutesLeftText = `тридцати ${numberToWords(units)}`;
336
- } else if (tens === 40) {
337
- minutesLeftText = `сорока ${numberToWords(units)}`;
338
- } else if (tens === 50) {
339
- minutesLeftText = `пятидесяти ${numberToWords(units)}`;
340
- }
341
- }
342
- }
343
 
344
  const epithet = getRandomElement(rudeWords.epithets);
345
  const connector = getRandomElement(rudeWords.connectors);
346
 
 
347
  rudeTime = `Без ${minutesLeftText} ${epithet} минут ${numberToWords(nextHour)}, ${connector}!`;
348
  }
349
 
@@ -417,11 +459,26 @@
417
  document.getElementById('tellTimeBtn').addEventListener('click', () => {
418
  const rudeTime = generateRudeTime();
419
  document.querySelector('.rude-text').textContent = rudeTime;
 
 
 
 
 
 
 
420
  });
421
 
422
  document.getElementById('speakBtn').addEventListener('click', () => {
423
  const rudeTime = generateRudeTime();
424
  document.querySelector('.rude-text').textContent = rudeTime;
 
 
 
 
 
 
 
 
425
  speakText(rudeTime);
426
  });
427
 
 
36
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
37
  border-radius: 20px;
38
  overflow: hidden;
39
+ backdrop-filter: blur(10px);
40
  }
41
 
42
  .digital-clock {
 
47
  .rude-text {
48
  min-height: 100px;
49
  border-left: 5px solid #ff4757;
50
+ transition: all 0.3s;
51
+ }
52
+
53
+ .rude-text:hover {
54
+ transform: scale(1.01);
55
+ box-shadow: 0 5px 15px rgba(255, 71, 87, 0.3);
56
  }
57
 
58
  .btn {
 
77
  0%, 100% { opacity: 1; }
78
  50% { opacity: 0.5; }
79
  }
80
+
81
+ .pulse {
82
+ animation: pulse 2s infinite;
83
+ }
84
+
85
+ @keyframes pulse {
86
+ 0% { transform: scale(1); }
87
+ 50% { transform: scale(1.05); }
88
+ 100% { transform: scale(1); }
89
+ }
90
+
91
+ .glitch {
92
+ position: relative;
93
+ }
94
+
95
+ .glitch::before, .glitch::after {
96
+ content: attr(data-text);
97
+ position: absolute;
98
+ top: 0;
99
+ left: 0;
100
+ width: 100%;
101
+ height: 100%;
102
+ background: transparent;
103
+ }
104
+
105
+ .glitch::before {
106
+ left: 2px;
107
+ text-shadow: -2px 0 #ff00ff;
108
+ clip: rect(44px, 450px, 56px, 0);
109
+ animation: glitch-anim 5s infinite linear alternate-reverse;
110
+ }
111
+
112
+ .glitch::after {
113
+ left: -2px;
114
+ text-shadow: -2px 0 #00ffff;
115
+ clip: rect(44px, 450px, 56px, 0);
116
+ animation: glitch-anim2 5s infinite linear alternate-reverse;
117
+ }
118
+
119
+ @keyframes glitch-anim {
120
+ 0% { clip: rect(31px, 9999px, 94px, 0); }
121
+ 10% { clip: rect(112px, 9999px, 76px, 0); }
122
+ 20% { clip: rect(85px, 9999px, 77px, 0); }
123
+ 30% { clip: rect(27px, 9999px, 97px, 0); }
124
+ 40% { clip: rect(64px, 9999px, 98px, 0); }
125
+ 50% { clip: rect(61px, 9999px, 85px, 0); }
126
+ 60% { clip: rect(99px, 9999px, 114px, 0); }
127
+ 70% { clip: rect(34px, 9999px, 115px, 0); }
128
+ 80% { clip: rect(98px, 9999px, 129px, 0); }
129
+ 90% { clip: rect(43px, 9999px, 96px, 0); }
130
+ 100% { clip: rect(82px, 9999px, 64px, 0); }
131
+ }
132
+
133
+ @keyframes glitch-anim2 {
134
+ 0% { clip: rect(65px, 9999px, 119px, 0); }
135
+ 10% { clip: rect(79px, 9999px, 66px, 0); }
136
+ 20% { clip: rect(75px, 9999px, 117px, 0); }
137
+ 30% { clip: rect(46px, 9999px, 113px, 0); }
138
+ 40% { clip: rect(115px, 9999px, 74px, 0); }
139
+ 50% { clip: rect(52px, 9999px, 61px, 0); }
140
+ 60% { clip: rect(44px, 9999px, 127px, 0); }
141
+ 70% { clip: rect(101px, 9999px, 91px, 0); }
142
+ 80% { clip: rect(127px, 9999px, 100px, 0); }
143
+ 90% { clip: rect(59px, 9999px, 74px, 0); }
144
+ 100% { clip: rect(84px, 9999px, 126px, 0); }
145
+ }
146
  </style>
147
  </head>
148
  <body class="min-h-screen flex items-center justify-center p-4 night">
149
  <div class="clock-container bg-gray-900 bg-opacity-80 w-full max-w-2xl">
150
  <div class="p-8">
151
+ <h1 class="text-3xl font-bold text-center mb-6 text-red-400 pulse">
152
  <i class="fas fa-clock mr-2"></i> Матюкливые часы
153
  </h1>
154
 
 
161
  </div>
162
  </div>
163
 
164
+ <div class="rude-text bg-gray-800 p-6 rounded-lg mb-6 text-2xl text-center font-medium text-yellow-300 glitch" data-text="Нажми кнопку, чтобы узнать время, придурок!">
165
  Нажми кнопку, чтобы узнать время, придурок!
166
  </div>
167
 
 
246
  13: "первого"
247
  };
248
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
249
  // Функции для преобразования чисел в слова
250
  function numberToWords(num) {
251
  if (num <= 20 || num % 10 === 0) {
 
301
  return arr[Math.floor(Math.random() * arr.length)];
302
  }
303
 
304
+ // Функция для правильного склонения числительных
305
+ function getMinutesLeftText(minutesLeft) {
306
+ if (minutesLeft === 1) return "одной";
307
+ if (minutesLeft === 2) return "двух";
308
+ if (minutesLeft === 3) return "трёх";
309
+ if (minutesLeft === 4) return "четырёх";
310
+ if (minutesLeft === 8) return "восьми";
311
+
312
+ // Для чисел 5-20 и 25, 35, 45
313
+ if (minutesLeft >= 5 && minutesLeft <= 20) {
314
+ return numberToWords(minutesLeft).replace('ь', 'и').replace('ть', 'ти');
315
+ }
316
+
317
+ // Для чисел 21-24, 26-29, 31-34, 36-39, 41-44, 46-49
318
+ const tens = Math.floor(minutesLeft / 10) * 10;
319
+ const units = minutesLeft % 10;
320
+
321
+ if (tens === 20) {
322
+ return `двадцати ${units === 0 ? '' : numberToWords(units)}`;
323
+ } else if (tens === 30) {
324
+ return `тридцати ${units === 0 ? '' : numberToWords(units)}`;
325
+ } else if (tens === 40) {
326
+ return `сорока ${units === 0 ? '' : numberToWords(units)}`;
327
+ }
328
+
329
+ return numberToWords(minutesLeft);
330
+ }
331
+
332
  // Основная функция для генерации грубого времени
333
  function generateRudeTime() {
334
  const now = new Date();
 
380
  } else if (minutes >= 40 && minutes <= 59) {
381
  // Схема для минут от 40 до 59
382
  const minutesLeft = 60 - minutes;
383
+ const minutesLeftText = getMinutesLeftText(minutesLeft);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
384
 
385
  const epithet = getRandomElement(rudeWords.epithets);
386
  const connector = getRandomElement(rudeWords.connectors);
387
 
388
+ // Исправлено "Без пятьи" на "Без пяти"
389
  rudeTime = `Без ${minutesLeftText} ${epithet} минут ${numberToWords(nextHour)}, ${connector}!`;
390
  }
391
 
 
459
  document.getElementById('tellTimeBtn').addEventListener('click', () => {
460
  const rudeTime = generateRudeTime();
461
  document.querySelector('.rude-text').textContent = rudeTime;
462
+
463
+ // Анимация при нажатии
464
+ const rudeTextElement = document.querySelector('.rude-text');
465
+ rudeTextElement.classList.add('animate-pulse');
466
+ setTimeout(() => {
467
+ rudeTextElement.classList.remove('animate-pulse');
468
+ }, 500);
469
  });
470
 
471
  document.getElementById('speakBtn').addEventListener('click', () => {
472
  const rudeTime = generateRudeTime();
473
  document.querySelector('.rude-text').textContent = rudeTime;
474
+
475
+ // Анимация при нажатии
476
+ const rudeTextElement = document.querySelector('.rude-text');
477
+ rudeTextElement.classList.add('animate-pulse');
478
+ setTimeout(() => {
479
+ rudeTextElement.classList.remove('animate-pulse');
480
+ }, 500);
481
+
482
  speakText(rudeTime);
483
  });
484
 
prompts.txt CHANGED
@@ -0,0 +1 @@
 
 
1
+ "Без пятьи" is wrong, needs to be "Без пяти". Check all the code for such mistakes and fix them