├── .vscode └── settings.json ├── ddb.jpg ├── LOGO.jpg ├── image.png ├── mein.css ├── index.html └── mein.js /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5501 3 | } -------------------------------------------------------------------------------- /ddb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HumoyunMamasodiqov/voice-presentation/HEAD/ddb.jpg -------------------------------------------------------------------------------- /LOGO.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HumoyunMamasodiqov/voice-presentation/HEAD/LOGO.jpg -------------------------------------------------------------------------------- /image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/HumoyunMamasodiqov/voice-presentation/HEAD/image.png -------------------------------------------------------------------------------- /mein.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Rasmli Taqdimot 7 | 8 | 9 | 10 |

Rasmli Taqdimot Vositasi

11 | 12 |

13 | 14 | 15 | 16 | 17 |

Holat: To'xtatilgan

18 |

19 | 20 |

21 |

22 |

23 | 24 |

25 | 26 |

27 |

28 |

29 |

30 | 🎤 Slide 1: Title Slide – What to Say “Assalamu alaykum everyone. 32 | 33 | 34 | Today, I will be talking about the Holy Qur’an – the final 35 | revelation in Islam. 37 | 38 | This book is very important for Muslims around the world, and I 39 | hope to share with you why it is so special.” 41 |

42 |

43 |

44 |

45 | 46 |

47 |

48 |

49 | Machine Learning - bu sun'iy intellektning bir bo'limi 50 | Ushbu texnologiya orqali mashinalar ma'lumotlardan 52 | o'rganadi 54 | Deep Learning esa Machine Learningning yanada rivojlangan turi 56 | hisoblanadi 58 |

59 |

Machine Learning

60 |

61 |

62 | 63 |

64 |

65 |

66 | JavaScript - bu veb-dasturlashning asosiy tillaridan biri 69 | Web Speech API yordamida brauzerda nutqni taniy olamiz 70 | Bu imkoniyatlar dasturchilar uchun keng imkoniyatlar ochib 72 | beradi 74 |

75 |

JavaScript

76 |

77 |

78 | 79 |

80 |

81 |

82 | Web Speech API - bu brauzerda nutqni taniydigan va nutqga 84 | aylantiradigan interfeys 86 | Bu texnologiya virtual yordamchilar, ovozli boshqaruv va boshqa 88 | qiziqarli ilovalar yaratish imkonini beradi 90 |

91 |

92 |

93 |

94 |

95 | 96 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /mein.js: -------------------------------------------------------------------------------- 1 | 2 | document.addEventListener("DOMContentLoaded", function () { 3 | const slides = document.querySelectorAll(".slide"); 4 | const startBtn = document.getElementById("startBtn"); 5 | const stopBtn = document.getElementById("stopBtn"); 6 | const nextBtn = document.getElementById("nextBtn"); 7 | const prevBtn = document.getElementById("prevBtn"); 8 | const statusDiv = document.getElementById("status"); 9 | const transcriptDiv = document.getElementById("transcript"); 10 | const progressBar = document.getElementById("progressBar"); 11 | 12 | let currentSlide = 0; 13 | let currentSpan = 0; 14 | let currentChar = 0; 15 | let recognition; 16 | let slideInterval; 17 | let highlightInterval; 18 | const SLIDE_INTERVAL = 5000000; 19 | 20 | function showSlide(n) { 21 | currentSlide = (n + slides.length) % slides.length; 22 | 23 | slides.forEach((slide) => slide.classList.remove("active")); 24 | 25 | slides[currentSlide].classList.add("active"); 26 | 27 | updateProgressBar(); 28 | 29 | clearHighlight(); 30 | resetTracking(); 31 | 32 | resetSlideTimer(); 33 | } 34 | 35 | function updateProgressBar() { 36 | const progress = ((currentSlide + 1) / slides.length) * 100; 37 | progressBar.style.width = progress + "%"; 38 | } 39 | 40 | function nextSlide() { 41 | showSlide(currentSlide + 1); 42 | } 43 | function prevSlide() { 44 | showSlide(currentSlide - 1); 45 | } 46 | 47 | function resetSlideTimer() { 48 | clearInterval(slideInterval); 49 | slideInterval = setInterval(nextSlide, SLIDE_INTERVAL); 50 | } 51 | 52 | function resetTracking() { 53 | currentSpan = 0; 54 | currentChar = 0; 55 | prepareSpansForHighlight(); 56 | } 57 | 58 | function prepareSpansForHighlight() { 59 | const activeSlide = slides[currentSlide]; 60 | const spans = activeSlide.querySelectorAll(".slide-text span"); 61 | 62 | spans.forEach((span) => { 63 | if (!span.dataset.original) { 64 | span.dataset.original = span.textContent; 65 | span.innerHTML = span.textContent 66 | .split("") 67 | .map((char) => `${char}`) 68 | .join(""); 69 | } 70 | }); 71 | } 72 | 73 | function clearHighlight() { 74 | document 75 | .querySelectorAll(".highlight, .current-char") 76 | .forEach((el) => { 77 | el.classList.remove("highlight", "current-char"); 78 | }); 79 | } 80 | 81 | function highlightNextChar() { 82 | const activeSlide = slides[currentSlide]; 83 | const spans = activeSlide.querySelectorAll(".slide-text span"); 84 | 85 | if (currentSpan >= spans.length) return; 86 | 87 | const span = spans[currentSpan]; 88 | const chars = span.querySelectorAll(".char"); 89 | 90 | document.querySelectorAll(".current-char").forEach((el) => { 91 | el.classList.remove("current-char"); 92 | el.classList.add("highlight"); 93 | }); 94 | 95 | if (currentChar < chars.length) { 96 | chars[currentChar].classList.add("current-char"); 97 | chars[currentChar].scrollIntoView({ 98 | behavior: "smooth", 99 | block: "center", 100 | inline: "nearest", 101 | }); 102 | currentChar++; 103 | } else { 104 | currentSpan++; 105 | currentChar = 0; 106 | } 107 | } 108 | 109 | function startRecognition() { 110 | if (!("webkitSpeechRecognition" in window)) { 111 | statusDiv.textContent = 112 | "Holat: Brauzeringiz nutqni aniqlashni qo'llab-quvvatlamaydi"; 113 | return; 114 | } 115 | 116 | recognition = new webkitSpeechRecognition(); 117 | recognition.continuous = true; 118 | recognition.interimResults = true; 119 | recognition.lang = "uz-UZ"; 120 | 121 | recognition.onstart = () => { 122 | statusDiv.textContent = "Holat: Tinglanmoqda..."; 123 | transcriptDiv.textContent = ""; 124 | }; 125 | 126 | recognition.onerror = (event) => { 127 | statusDiv.textContent = "Holat: Xatolik: " + event.error; 128 | }; 129 | 130 | recognition.onend = () => { 131 | statusDiv.textContent = "Holat: To'xtatilgan"; 132 | }; 133 | 134 | recognition.onresult = (event) => { 135 | let interim = ""; 136 | let final = ""; 137 | 138 | for (let i = event.resultIndex; i < event.results.length; i++) { 139 | const transcript = event.results[i][0].transcript; 140 | if (event.results[i].isFinal) { 141 | final += transcript; 142 | } else { 143 | interim += transcript; 144 | } 145 | } 146 | 147 | transcriptDiv.textContent = final || interim; 148 | 149 | if ( 150 | final.toLowerCase().includes("salom") || 151 | final.toLowerCase().includes("next page") || 152 | final.toLowerCase().includes("next slide") || 153 | final.toLowerCase().includes("keyingi") 154 | ) { 155 | nextSlide(); 156 | } else if ( 157 | final.toLowerCase().includes("oldingi slayd") || 158 | final.toLowerCase().includes("previous page") || 159 | final.toLowerCase().includes("prev slide") || 160 | final.toLowerCase().includes("oldingi") 161 | ) { 162 | prevSlide(); 163 | } else if (final) { 164 | checkText(final); 165 | } else if (interim) { 166 | checkPartialText(interim); 167 | } 168 | }; 169 | 170 | recognition.start(); 171 | resetSlideTimer(); 172 | } 173 | 174 | function stopRecognition() { 175 | if (recognition) { 176 | recognition.stop(); 177 | } 178 | clearInterval(slideInterval); 179 | clearInterval(highlightInterval); 180 | statusDiv.textContent = "Holat: To'xtatilgan"; 181 | } 182 | 183 | function checkText(text) { 184 | const activeSlide = slides[currentSlide]; 185 | const spans = activeSlide.querySelectorAll(".slide-text span"); 186 | const lowerText = text.toLowerCase(); 187 | 188 | spans.forEach((span, spanIndex) => { 189 | const spanText = span.dataset.original.toLowerCase(); 190 | if (lowerText.includes(spanText)) { 191 | currentSpan = spanIndex; 192 | currentChar = spanText.length; 193 | highlightCurrentState(); 194 | } 195 | }); 196 | } 197 | 198 | function checkPartialText(text) { 199 | const activeSlide = slides[currentSlide]; 200 | const spans = activeSlide.querySelectorAll(".slide-text span"); 201 | const lowerText = text.toLowerCase(); 202 | 203 | if (currentSpan < spans.length) { 204 | const currentSpanText = 205 | spans[currentSpan].dataset.original.toLowerCase(); 206 | const currentPart = currentSpanText.substring(0, currentChar); 207 | 208 | if (lowerText.startsWith(currentPart)) { 209 | const newPos = lowerText.length; 210 | if (newPos > currentChar) { 211 | currentChar = newPos; 212 | highlightCurrentState(); 213 | } 214 | } 215 | } 216 | 217 | spans.forEach((span, spanIndex) => { 218 | const spanText = span.dataset.original.toLowerCase(); 219 | if (lowerText.startsWith(spanText.substring(0, 3))) { 220 | currentSpan = spanIndex; 221 | currentChar = 0; 222 | highlightCurrentState(); 223 | } 224 | }); 225 | } 226 | function highlightCurrentState() { 227 | clearInterval(highlightInterval); 228 | highlightInterval = setInterval(highlightNextChar, 100); 229 | } 230 | startBtn.addEventListener("click", startRecognition); 231 | stopBtn.addEventListener("click", stopRecognition); 232 | nextBtn.addEventListener("click", nextSlide); 233 | prevBtn.addEventListener("click", prevSlide); 234 | 235 | document.addEventListener("keydown", (event) => { 236 | if (event.key === "ArrowRight") { 237 | nextSlide(); 238 | } else if (event.key === "ArrowLeft") { 239 | prevSlide(); 240 | } 241 | }); 242 | }); 243 | --------------------------------------------------------------------------------