Kh\u00f3a h\u1ecdc Video<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;600&display=swap\" rel=\"stylesheet\">\n <style>\n .video-container-wrapper {\n display: flex;\n height: 100vh;\n margin-top: 15px;\n overflow: hidden;\n }\n\n .video-content {\n flex: 3;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0px;\n background: white;\n box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);\n }\n\n .video-frame {\n width: 100%;\n height: 100vh;\n border: none;\n box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.2);\n\n }\n\n .video-course-list {\n flex: 1;\n background: #f3f3f3;\n padding: 15px;\n overflow-y: auto;\n border-left: 3px solid #ddd;\n transition: all 0.3s ease-in-out;\n }\n\n .video-course-list h3 {\n margin-bottom: 15px;\n font-size: 20px;\n color: #004080;\n text-align: left;\n }\n\n .video-course-item {\n padding: 10px;\n background: white;\n border-radius: 5px;\n margin-bottom: 5px;\n cursor: pointer;\n color: #7a9c59;\n transition: background 0.3s;\n position: relative; \/* Th\u00eam position relative \u0111\u1ec3 pseudo-element ho\u1ea1t \u0111\u1ed9ng *\/\n }\n\n .video-course-item:hover {\n background: #ddd;\n }\n\n .video-course-item {\n padding: 12px;\n margin-bottom: 8px;\n background: #f9f9f9;\n border-radius: 5px;\n cursor: pointer;\n color: #333;\n transition: background 0.3s, transform 0.2s;\n }\n\n .video-course-item:hover {\n background: #e0f3ff;\n transform: scale(1.02);\n }\n\n \/* Video \u0111ang ph\u00e1t *\/\n .video-course-item.active {\n background: #0f2819;\n color: white;\n font-weight: bold;\n border-left: 5px solid #ffcc00;\n box-shadow: 2px 2px 10px rgba(0, 64, 128, 0.3);\n }\n\n .video-navigation {\n display: flex;\n justify-content: center;\n margin-top: 20px;\n gap: 15px;\n }\n\n .video-nav-button {\n padding: 10px 15px;\n border: none;\n border-radius: 25px;\n font-size: 16px;\n cursor: pointer;\n transition: all 0.3s;\n }\n\n .video-prev {\n background: white;\n border: 2px solid #0f2819;\n color: #0f2819;\n }\n\n .video-next {\n background: #0f2819;\n color: white;\n }\n\n \/* Responsive cho thi\u1ebft b\u1ecb di \u0111\u1ed9ng v\u00e0 tablet *\/\n @media screen and (max-width: 1024px) {\n .video-container-wrapper {\n flex-direction: column;\n height: auto;\n }\n\n .video-content {\n width: 100%;\n padding: 5px;\n height: auto;\n }\n\n .video-frame {\n width: 100%;\n height: 300px;\n }\n\n .video-course-list {\n display: none;\n }\n\n .mobile-menu-button {\n display: block;\n background: #0f2819;\n color: white;\n padding: 12px;\n text-align: left;\n cursor: pointer;\n }\n\n .mobile-course-list {\n display: none;\n width: 100%;\n background: #f8f8f8;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-height: 300px;\n overflow-y: auto;\n }\n\n .mobile-course-list.show {\n display: block;\n }\n }\n\n @media screen and (min-width: 1025px) {\n .mobile-menu-button, .mobile-course-list {\n display: none;\n }\n }\n .video-course-item.completed::after {\n content: \"\u2714\";\n color: #4CAF50;\n font-size: 16px;\n position: absolute;\n right: 10px;\n top: 50%;\n transform: translateY(-50%);\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"mobile-menu-button\" onclick=\"toggleMobileMenu()\">\u2630 Danh s\u00e1ch b\u00e0i gi\u1ea3ng<\/div>\n <div class=\"mobile-course-list\" id=\"mobileCourseList\">\n \n <div class=\"video-course-item\" data-index=\"0\">1. An to\u00e0n v\u1ec7 sinh<\/div>\n <div class=\"video-course-item\" data-index=\"1\">2. Ch\u1ebf bi\u1ebfn<\/div>\n <div class=\"video-course-item\" data-index=\"2\">3. Ti\u1ebfp kh\u00e1ch<\/div>\n <div class=\"video-course-item\" data-index=\"3\">4. Qu\u1ea3n l\u00fd<\/div>\n <\/div>\n\n <div class=\"video-container-wrapper\">\n <div class=\"video-content\">\n <div id=\"videoPlayer\" class=\"video-frame\"><\/div>\n <div class=\"video-navigation\">\n <button class=\"video-nav-button video-prev\" onclick=\"prevVideo()\">\u276e B\u00e0i tr\u01b0\u1edbc<\/button>\n <button class=\"video-nav-button video-next\" onclick=\"nextVideo()\">B\u00e0i ti\u1ebfp theo \u276f<\/button>\n <\/div>\n <\/div>\n\n <div class=\"video-course-list\">\n <h3>\ud83d\udcd6 Danh s\u00e1ch b\u00e0i gi\u1ea3ng<\/h3>\n \n <div class=\"video-course-item\" data-index=\"0\">1. An to\u00e0n v\u1ec7 sinh<\/div>\n <div class=\"video-course-item\" data-index=\"1\">2. Ch\u1ebf bi\u1ebfn<\/div>\n <div class=\"video-course-item\" data-index=\"2\">3. Ti\u1ebfp kh\u00e1ch<\/div>\n <div class=\"video-course-item\" data-index=\"3\">4. Qu\u1ea3n l\u00fd<\/div>\n <\/div>\n <\/div>\n\n <script>\n const videoIds = [\n \"p0MEzzHks58\",\n \"nTN93NOmuu0\",\n \"IQBT0FDY-i0\",\n \"DKzQ6Ulmujg\"\n ];\n\n let player;\n let currentVideoIndex = 0;\n const mobileCourseList = document.getElementById(\"mobileCourseList\");\n\n \/\/ Load YouTube IFrame API\n function onYouTubeIframeAPIReady() {\n player = new YT.Player('videoPlayer', {\n height: '100%',\n width: '100%',\n videoId: videoIds[currentVideoIndex],\n playerVars: {\n 'autoplay': 1,\n 'controls': 1,\n 'rel': 0,\n 'modestbranding': 0,\n 'showinfo': 0\n },\n events: {\n 'onReady': onPlayerReady,\n 'onStateChange': onPlayerStateChange\n }\n });\n }\n\n function onPlayerReady(event) {\n \/\/ Kh\u00f4i ph\u1ee5c tr\u1ea1ng th\u00e1i video t\u1eeb localStorage\n const savedVideoIndex = localStorage.getItem('lastNghenhgino2VideoIndex');\n const savedVideoTime = localStorage.getItem('lastNghenhgino2VideoTime');\n\n if (savedVideoIndex !== null && savedVideoTime !== null) {\n currentVideoIndex = parseInt(savedVideoIndex, 10);\n changeVideo(currentVideoIndex);\n event.target.seekTo(parseFloat(savedVideoTime));\n }\n\n \/\/ Kh\u00f4i ph\u1ee5c tr\u1ea1ng th\u00e1i \u0111\u00e3 xem t\u1eeb localStorage\n videoIds.forEach((videoId, index) => {\n const isCompleted = localStorage.getItem(`nghenhGino2videoCompleted_${index}`);\n if (isCompleted === \"true\") {\n markVideoAsCompleted(index);\n }\n });\n }\n\n function onPlayerStateChange(event) {\n if (event.data === YT.PlayerState.PAUSED || event.data === YT.PlayerState.ENDED) {\n const currentTime = player.getCurrentTime();\n localStorage.setItem('lastNghenhgino2VideoTime', currentTime);\n\n \/\/ Ki\u1ec3m tra xem ng\u01b0\u1eddi d\u00f9ng \u0111\u00e3 xem h\u1ebft 95% video ch\u01b0a\n const duration = player.getDuration();\n if (currentTime \/ duration >= 0.95) {\n markVideoAsCompleted(currentVideoIndex);\n localStorage.setItem(`nghenhGino2videoCompleted_${currentVideoIndex}`, \"true\");\n }\n\n \/\/ T\u1ef1 \u0111\u1ed9ng ph\u00e1t video ti\u1ebfp theo khi video k\u1ebft th\u00fac\n if (event.data === YT.PlayerState.ENDED) {\n nextVideo();\n }\n }\n }\n\n function markVideoAsCompleted(index) {\n const videoItems = document.querySelectorAll(\".video-course-item\");\n videoItems.forEach(item => {\n if (parseInt(item.getAttribute(\"data-index\"), 10) === index) {\n item.classList.add(\"completed\");\n }\n });\n }\n\n function changeVideo(index) {\n if (index >= 0 && index < videoIds.length) {\n document.querySelectorAll(\".video-course-item\").forEach(item => {\n item.classList.remove(\"active\");\n });\n\n document.querySelectorAll(\".video-course-item\").forEach(item => {\n if (parseInt(item.getAttribute(\"data-index\"), 10) === index) {\n item.classList.add(\"active\");\n }\n });\n\n player.loadVideoById(videoIds[index]);\n currentVideoIndex = index;\n localStorage.setItem('lastNghenhgino2VideoIndex', currentVideoIndex);\n }\n }\n\n function prevVideo() {\n if (currentVideoIndex > 0) {\n changeVideo(currentVideoIndex - 1);\n }\n }\n\n function nextVideo() {\n const currentTime = player.getCurrentTime();\n const duration = player.getDuration();\n\n \/\/ Ki\u1ec3m tra xem video \u0111\u00e3 xem qu\u00e1 95% ch\u01b0a\n if (currentTime \/ duration >= 0.95) {\n markVideoAsCompleted(currentVideoIndex);\n localStorage.setItem(`nghenhGino2videoCompleted_${currentVideoIndex}`, \"true\");\n }\n\n \/\/ Chuy\u1ec3n sang video ti\u1ebfp theo\n if (currentVideoIndex < videoIds.length - 1) {\n changeVideo(currentVideoIndex + 1);\n }\n }\n\n function toggleMobileMenu() {\n mobileCourseList.classList.toggle(\"show\");\n }\n\n document.querySelectorAll(\".video-course-item\").forEach(item => {\n item.addEventListener(\"click\", () => {\n const index = parseInt(item.getAttribute(\"data-index\"), 10);\n changeVideo(index);\n if (window.innerWidth <= 1024) {\n toggleMobileMenu();\n }\n });\n });\n\n document.addEventListener(\"DOMContentLoaded\", () => {\n changeVideo(0);\n });\n <\/script>\n\n \n <script src=\"https:\/\/www.youtube.com\/iframe_api\"><\/script>\n\n<style>ruby.tmy-fg rt { font-size: 0.55em; font-weight: normal; }<\/style>\n<script>\n(function () {\n var KJ = \"\u3400-\u9fff\u3005\u30f6\", HI = \"\u3041-\u309f\";\n var PAREN = new RegExp(\"([\" + KJ + HI + \"]+)[(\uff08]([\" + HI + \"\u30fc]+)[)\uff09]\", \"g\");\n var ISK = new RegExp(\"[\" + KJ + \"]\");\n var PARTS = new RegExp(\"[\" + KJ + \"]+|[\" + HI + \"]+\", \"g\");\n var GRAM = \/\u3055\u305b|\u3044\u305f\u3060|\u307e\u3059$|\u307e\u305b\u3093$|\u307e\u3057\u305f$|\u304f\u3060\u3055\u3044$|\u3057\u308d$\/;\n var SKIP = { SCRIPT: 1, STYLE: 1, TEXTAREA: 1, INPUT: 1, SELECT: 1, OPTION: 1, RUBY: 1, RT: 1, RP: 1, CODE: 1, PRE: 1, NOSCRIPT: 1 };\n \/* gh\u00e9p phi\u00ean \u00e2m v\u1edbi ch\u1eef (H\u00e1n + kana \u0111i k\u00e8m): m\u1ed7i \u0111o\u1ea1n ch\u1eef H\u00e1n 1-3 kana m\u1ed7i ch\u1eef (+2), kana \u0111i k\u00e8m ph\u1ea3i tr\u00f9ng *\/\n function align(base, reading) {\n var parts = base.match(PARTS);\n if (!parts) return null;\n if (!ISK.test(parts[0].charAt(0))) return null;\n var rx = \"\";\n parts.forEach(function (p) { rx += ISK.test(p.charAt(0)) ? \"(.+?)\" : p; });\n var m = new RegExp(\"^\" + rx + \"$\").exec(reading);\n if (!m) return null;\n var out = [], g = 0, ok = true;\n parts.forEach(function (p) {\n if (ISK.test(p.charAt(0))) {\n g++;\n var r = m[g];\n if (r.length < p.length) ok = false;\n if (r.length > 3 * p.length + 2) ok = false;\n out.push([p, r]);\n } else out.push([p, null]);\n });\n return ok ? out : null;\n }\n \/* m\u1ed9t \u0111o\u1ea1n ch\u1eef -> danh s\u00e1ch [ch\u1eef, phi\u00ean \u00e2m ho\u1eb7c null]; null n\u1ebfu kh\u00f4ng c\u00f3 g\u00ec \u0111\u1ed5i *\/\n function convert(t) {\n var segs = [], last = 0, changed = false, m;\n PAREN.lastIndex = 0;\n while ((m = PAREN.exec(t)) !== null) {\n var cand = m[1], reading = m[2], done = null;\n if (!GRAM.test(reading)) {\n for (var i = 0; i < cand.length; i++) {\n if (!ISK.test(cand.charAt(i))) continue;\n if (i > 0) { if (ISK.test(cand.charAt(i - 1))) continue; }\n var al = align(cand.slice(i), reading);\n if (al) { done = [[cand.slice(0, i), null]].concat(al); break; }\n }\n }\n segs.push([t.slice(last, m.index), null]);\n if (done) { segs = segs.concat(done); changed = true; } else segs.push([m[0], null]);\n last = m.index + m[0].length;\n }\n if (!changed) return null;\n segs.push([t.slice(last), null]);\n return segs;\n }\n function fix(node) {\n var t = node.nodeValue;\n if (t.indexOf(\"(\") < 0) { if (t.indexOf(\"\uff08\") < 0) return; }\n var segs = convert(t);\n if (!segs) return;\n var frag = document.createDocumentFragment();\n segs.forEach(function (s) {\n if (!s[0]) return;\n if (s[1] === null) { frag.appendChild(document.createTextNode(s[0])); return; }\n var rb = document.createElement(\"ruby\"), rt = document.createElement(\"rt\");\n rb.className = \"tmy-fg\";\n rb.appendChild(document.createTextNode(s[0]));\n rt.textContent = s[1];\n rb.appendChild(rt);\n frag.appendChild(rb);\n });\n node.parentNode.replaceChild(frag, node);\n }\n function walk(n) {\n if (n.nodeType === 3) { if (n.parentNode) { if (!SKIP[n.parentNode.nodeName]) fix(n); } return; }\n if (n.nodeType !== 1) return;\n if (SKIP[n.nodeName]) return;\n if (n.isContentEditable) return;\n if (n.closest) { if (n.closest(\"ruby\")) return; }\n Array.prototype.slice.call(n.childNodes).forEach(walk);\n }\n function start() {\n walk(document.body);\n new MutationObserver(function (list) {\n list.forEach(function (mu) {\n Array.prototype.forEach.call(mu.addedNodes, function (n) {\n if (n.parentNode) { if (!(n.parentNode.closest ? n.parentNode.closest(\"ruby\") : null)) walk(n); }\n });\n });\n }).observe(document.body, { childList: true, subtree: true });\n }\n window.tmyFurigana = convert;\n if (document.body) start(); else document.addEventListener(\"DOMContentLoaded\", start);\n})();\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Kh\u00f3a h\u1ecdc Video \u2630 Danh s\u00e1ch b\u00e0i gi\u1ea3ng 1. An to\u00e0n v\u1ec7 sinh 2. Ch\u1ebf bi\u1ebfn 3. Ti\u1ebfp kh\u00e1ch 4. Qu\u1ea3n l\u00fd \u276e B\u00e0i tr\u01b0\u1edbc B\u00e0i ti\u1ebfp theo \u276f \ud83d\udcd6 Danh s\u00e1ch b\u00e0i gi\u1ea3ng 1. An to\u00e0n v\u1ec7 sinh 2. Ch\u1ebf bi\u1ebfn 3. Ti\u1ebfp kh\u00e1ch 4. Qu\u1ea3n l\u00fd<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-6625","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages\/6625","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/comments?post=6625"}],"version-history":[{"count":3,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages\/6625\/revisions"}],"predecessor-version":[{"id":8730,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages\/6625\/revisions\/8730"}],"wp:attachment":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/media?parent=6625"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":6625,"date":"2025-07-11T11:00:47","date_gmt":"2025-07-11T04:00:47","guid":{"rendered":"https:\/\/tokuteigino.vn\/?page_id=6625"},"modified":"2026-10-27T10:47:10","modified_gmt":"2026-10-27T03:47:10","slug":"hoc-thu-nghe-tu-vung-nha-hang-gino2","status":"publish","type":"page","link":"https:\/\/tokuteigino.vn\/vi\/hoc-thu-nghe-tu-vung-nha-hang-gino2\/","title":{"rendered":"H\u1ecdc th\u1eed – nghe t\u1eeb v\u1ef1ng nh\u00e0 h\u00e0ng gino2"},"content":{"rendered":"\n\n\n\n \n \n Kh\u00f3a h\u1ecdc Video<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;600&display=swap\" rel=\"stylesheet\">\n <style>\n .video-container-wrapper {\n display: flex;\n height: 100vh;\n margin-top: 15px;\n overflow: hidden;\n }\n\n .video-content {\n flex: 3;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0px;\n background: white;\n box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);\n }\n\n .video-frame {\n width: 100%;\n height: 100vh;\n border: none;\n box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.2);\n\n }\n\n .video-course-list {\n flex: 1;\n background: #f3f3f3;\n padding: 15px;\n overflow-y: auto;\n border-left: 3px solid #ddd;\n transition: all 0.3s ease-in-out;\n }\n\n .video-course-list h3 {\n margin-bottom: 15px;\n font-size: 20px;\n color: #004080;\n text-align: left;\n }\n\n .video-course-item {\n padding: 10px;\n background: white;\n border-radius: 5px;\n margin-bottom: 5px;\n cursor: pointer;\n color: #7a9c59;\n transition: background 0.3s;\n position: relative; \/* Th\u00eam position relative \u0111\u1ec3 pseudo-element ho\u1ea1t \u0111\u1ed9ng *\/\n }\n\n .video-course-item:hover {\n background: #ddd;\n }\n\n .video-course-item {\n padding: 12px;\n margin-bottom: 8px;\n background: #f9f9f9;\n border-radius: 5px;\n cursor: pointer;\n color: #333;\n transition: background 0.3s, transform 0.2s;\n }\n\n .video-course-item:hover {\n background: #e0f3ff;\n transform: scale(1.02);\n }\n\n \/* Video \u0111ang ph\u00e1t *\/\n .video-course-item.active {\n background: #0f2819;\n color: white;\n font-weight: bold;\n border-left: 5px solid #ffcc00;\n box-shadow: 2px 2px 10px rgba(0, 64, 128, 0.3);\n }\n\n .video-navigation {\n display: flex;\n justify-content: center;\n margin-top: 20px;\n gap: 15px;\n }\n\n .video-nav-button {\n padding: 10px 15px;\n border: none;\n border-radius: 25px;\n font-size: 16px;\n cursor: pointer;\n transition: all 0.3s;\n }\n\n .video-prev {\n background: white;\n border: 2px solid #0f2819;\n color: #0f2819;\n }\n\n .video-next {\n background: #0f2819;\n color: white;\n }\n\n \/* Responsive cho thi\u1ebft b\u1ecb di \u0111\u1ed9ng v\u00e0 tablet *\/\n @media screen and (max-width: 1024px) {\n .video-container-wrapper {\n flex-direction: column;\n height: auto;\n }\n\n .video-content {\n width: 100%;\n padding: 5px;\n height: auto;\n }\n\n .video-frame {\n width: 100%;\n height: 300px;\n }\n\n .video-course-list {\n display: none;\n }\n\n .mobile-menu-button {\n display: block;\n background: #0f2819;\n color: white;\n padding: 12px;\n text-align: left;\n cursor: pointer;\n }\n\n .mobile-course-list {\n display: none;\n width: 100%;\n background: #f8f8f8;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-height: 300px;\n overflow-y: auto;\n }\n\n .mobile-course-list.show {\n display: block;\n }\n }\n\n @media screen and (min-width: 1025px) {\n .mobile-menu-button, .mobile-course-list {\n display: none;\n }\n }\n .video-course-item.completed::after {\n content: \"\u2714\";\n color: #4CAF50;\n font-size: 16px;\n position: absolute;\n right: 10px;\n top: 50%;\n transform: translateY(-50%);\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"mobile-menu-button\" onclick=\"toggleMobileMenu()\">\u2630 Danh s\u00e1ch b\u00e0i gi\u1ea3ng<\/div>\n <div class=\"mobile-course-list\" id=\"mobileCourseList\">\n \n <div class=\"video-course-item\" data-index=\"0\">1. An to\u00e0n v\u1ec7 sinh<\/div>\n <div class=\"video-course-item\" data-index=\"1\">2. Ch\u1ebf bi\u1ebfn<\/div>\n <div class=\"video-course-item\" data-index=\"2\">3. Ti\u1ebfp kh\u00e1ch<\/div>\n <div class=\"video-course-item\" data-index=\"3\">4. Qu\u1ea3n l\u00fd<\/div>\n <\/div>\n\n <div class=\"video-container-wrapper\">\n <div class=\"video-content\">\n <div id=\"videoPlayer\" class=\"video-frame\"><\/div>\n <div class=\"video-navigation\">\n <button class=\"video-nav-button video-prev\" onclick=\"prevVideo()\">\u276e B\u00e0i tr\u01b0\u1edbc<\/button>\n <button class=\"video-nav-button video-next\" onclick=\"nextVideo()\">B\u00e0i ti\u1ebfp theo \u276f<\/button>\n <\/div>\n <\/div>\n\n <div class=\"video-course-list\">\n <h3>\ud83d\udcd6 Danh s\u00e1ch b\u00e0i gi\u1ea3ng<\/h3>\n \n <div class=\"video-course-item\" data-index=\"0\">1. An to\u00e0n v\u1ec7 sinh<\/div>\n <div class=\"video-course-item\" data-index=\"1\">2. Ch\u1ebf bi\u1ebfn<\/div>\n <div class=\"video-course-item\" data-index=\"2\">3. Ti\u1ebfp kh\u00e1ch<\/div>\n <div class=\"video-course-item\" data-index=\"3\">4. Qu\u1ea3n l\u00fd<\/div>\n <\/div>\n <\/div>\n\n <script>\n const videoIds = [\n \"p0MEzzHks58\",\n \"nTN93NOmuu0\",\n \"IQBT0FDY-i0\",\n \"DKzQ6Ulmujg\"\n ];\n\n let player;\n let currentVideoIndex = 0;\n const mobileCourseList = document.getElementById(\"mobileCourseList\");\n\n \/\/ Load YouTube IFrame API\n function onYouTubeIframeAPIReady() {\n player = new YT.Player('videoPlayer', {\n height: '100%',\n width: '100%',\n videoId: videoIds[currentVideoIndex],\n playerVars: {\n 'autoplay': 1,\n 'controls': 1,\n 'rel': 0,\n 'modestbranding': 0,\n 'showinfo': 0\n },\n events: {\n 'onReady': onPlayerReady,\n 'onStateChange': onPlayerStateChange\n }\n });\n }\n\n function onPlayerReady(event) {\n \/\/ Kh\u00f4i ph\u1ee5c tr\u1ea1ng th\u00e1i video t\u1eeb localStorage\n const savedVideoIndex = localStorage.getItem('lastNghenhgino2VideoIndex');\n const savedVideoTime = localStorage.getItem('lastNghenhgino2VideoTime');\n\n if (savedVideoIndex !== null && savedVideoTime !== null) {\n currentVideoIndex = parseInt(savedVideoIndex, 10);\n changeVideo(currentVideoIndex);\n event.target.seekTo(parseFloat(savedVideoTime));\n }\n\n \/\/ Kh\u00f4i ph\u1ee5c tr\u1ea1ng th\u00e1i \u0111\u00e3 xem t\u1eeb localStorage\n videoIds.forEach((videoId, index) => {\n const isCompleted = localStorage.getItem(`nghenhGino2videoCompleted_${index}`);\n if (isCompleted === \"true\") {\n markVideoAsCompleted(index);\n }\n });\n }\n\n function onPlayerStateChange(event) {\n if (event.data === YT.PlayerState.PAUSED || event.data === YT.PlayerState.ENDED) {\n const currentTime = player.getCurrentTime();\n localStorage.setItem('lastNghenhgino2VideoTime', currentTime);\n\n \/\/ Ki\u1ec3m tra xem ng\u01b0\u1eddi d\u00f9ng \u0111\u00e3 xem h\u1ebft 95% video ch\u01b0a\n const duration = player.getDuration();\n if (currentTime \/ duration >= 0.95) {\n markVideoAsCompleted(currentVideoIndex);\n localStorage.setItem(`nghenhGino2videoCompleted_${currentVideoIndex}`, \"true\");\n }\n\n \/\/ T\u1ef1 \u0111\u1ed9ng ph\u00e1t video ti\u1ebfp theo khi video k\u1ebft th\u00fac\n if (event.data === YT.PlayerState.ENDED) {\n nextVideo();\n }\n }\n }\n\n function markVideoAsCompleted(index) {\n const videoItems = document.querySelectorAll(\".video-course-item\");\n videoItems.forEach(item => {\n if (parseInt(item.getAttribute(\"data-index\"), 10) === index) {\n item.classList.add(\"completed\");\n }\n });\n }\n\n function changeVideo(index) {\n if (index >= 0 && index < videoIds.length) {\n document.querySelectorAll(\".video-course-item\").forEach(item => {\n item.classList.remove(\"active\");\n });\n\n document.querySelectorAll(\".video-course-item\").forEach(item => {\n if (parseInt(item.getAttribute(\"data-index\"), 10) === index) {\n item.classList.add(\"active\");\n }\n });\n\n player.loadVideoById(videoIds[index]);\n currentVideoIndex = index;\n localStorage.setItem('lastNghenhgino2VideoIndex', currentVideoIndex);\n }\n }\n\n function prevVideo() {\n if (currentVideoIndex > 0) {\n changeVideo(currentVideoIndex - 1);\n }\n }\n\n function nextVideo() {\n const currentTime = player.getCurrentTime();\n const duration = player.getDuration();\n\n \/\/ Ki\u1ec3m tra xem video \u0111\u00e3 xem qu\u00e1 95% ch\u01b0a\n if (currentTime \/ duration >= 0.95) {\n markVideoAsCompleted(currentVideoIndex);\n localStorage.setItem(`nghenhGino2videoCompleted_${currentVideoIndex}`, \"true\");\n }\n\n \/\/ Chuy\u1ec3n sang video ti\u1ebfp theo\n if (currentVideoIndex < videoIds.length - 1) {\n changeVideo(currentVideoIndex + 1);\n }\n }\n\n function toggleMobileMenu() {\n mobileCourseList.classList.toggle(\"show\");\n }\n\n document.querySelectorAll(\".video-course-item\").forEach(item => {\n item.addEventListener(\"click\", () => {\n const index = parseInt(item.getAttribute(\"data-index\"), 10);\n changeVideo(index);\n if (window.innerWidth <= 1024) {\n toggleMobileMenu();\n }\n });\n });\n\n document.addEventListener(\"DOMContentLoaded\", () => {\n changeVideo(0);\n });\n <\/script>\n\n \n <script src=\"https:\/\/www.youtube.com\/iframe_api\"><\/script>\n\n<style>ruby.tmy-fg rt { font-size: 0.55em; font-weight: normal; }<\/style>\n<script>\n(function () {\n var KJ = \"\u3400-\u9fff\u3005\u30f6\", HI = \"\u3041-\u309f\";\n var PAREN = new RegExp(\"([\" + KJ + HI + \"]+)[(\uff08]([\" + HI + \"\u30fc]+)[)\uff09]\", \"g\");\n var ISK = new RegExp(\"[\" + KJ + \"]\");\n var PARTS = new RegExp(\"[\" + KJ + \"]+|[\" + HI + \"]+\", \"g\");\n var GRAM = \/\u3055\u305b|\u3044\u305f\u3060|\u307e\u3059$|\u307e\u305b\u3093$|\u307e\u3057\u305f$|\u304f\u3060\u3055\u3044$|\u3057\u308d$\/;\n var SKIP = { SCRIPT: 1, STYLE: 1, TEXTAREA: 1, INPUT: 1, SELECT: 1, OPTION: 1, RUBY: 1, RT: 1, RP: 1, CODE: 1, PRE: 1, NOSCRIPT: 1 };\n \/* gh\u00e9p phi\u00ean \u00e2m v\u1edbi ch\u1eef (H\u00e1n + kana \u0111i k\u00e8m): m\u1ed7i \u0111o\u1ea1n ch\u1eef H\u00e1n 1-3 kana m\u1ed7i ch\u1eef (+2), kana \u0111i k\u00e8m ph\u1ea3i tr\u00f9ng *\/\n function align(base, reading) {\n var parts = base.match(PARTS);\n if (!parts) return null;\n if (!ISK.test(parts[0].charAt(0))) return null;\n var rx = \"\";\n parts.forEach(function (p) { rx += ISK.test(p.charAt(0)) ? \"(.+?)\" : p; });\n var m = new RegExp(\"^\" + rx + \"$\").exec(reading);\n if (!m) return null;\n var out = [], g = 0, ok = true;\n parts.forEach(function (p) {\n if (ISK.test(p.charAt(0))) {\n g++;\n var r = m[g];\n if (r.length < p.length) ok = false;\n if (r.length > 3 * p.length + 2) ok = false;\n out.push([p, r]);\n } else out.push([p, null]);\n });\n return ok ? out : null;\n }\n \/* m\u1ed9t \u0111o\u1ea1n ch\u1eef -> danh s\u00e1ch [ch\u1eef, phi\u00ean \u00e2m ho\u1eb7c null]; null n\u1ebfu kh\u00f4ng c\u00f3 g\u00ec \u0111\u1ed5i *\/\n function convert(t) {\n var segs = [], last = 0, changed = false, m;\n PAREN.lastIndex = 0;\n while ((m = PAREN.exec(t)) !== null) {\n var cand = m[1], reading = m[2], done = null;\n if (!GRAM.test(reading)) {\n for (var i = 0; i < cand.length; i++) {\n if (!ISK.test(cand.charAt(i))) continue;\n if (i > 0) { if (ISK.test(cand.charAt(i - 1))) continue; }\n var al = align(cand.slice(i), reading);\n if (al) { done = [[cand.slice(0, i), null]].concat(al); break; }\n }\n }\n segs.push([t.slice(last, m.index), null]);\n if (done) { segs = segs.concat(done); changed = true; } else segs.push([m[0], null]);\n last = m.index + m[0].length;\n }\n if (!changed) return null;\n segs.push([t.slice(last), null]);\n return segs;\n }\n function fix(node) {\n var t = node.nodeValue;\n if (t.indexOf(\"(\") < 0) { if (t.indexOf(\"\uff08\") < 0) return; }\n var segs = convert(t);\n if (!segs) return;\n var frag = document.createDocumentFragment();\n segs.forEach(function (s) {\n if (!s[0]) return;\n if (s[1] === null) { frag.appendChild(document.createTextNode(s[0])); return; }\n var rb = document.createElement(\"ruby\"), rt = document.createElement(\"rt\");\n rb.className = \"tmy-fg\";\n rb.appendChild(document.createTextNode(s[0]));\n rt.textContent = s[1];\n rb.appendChild(rt);\n frag.appendChild(rb);\n });\n node.parentNode.replaceChild(frag, node);\n }\n function walk(n) {\n if (n.nodeType === 3) { if (n.parentNode) { if (!SKIP[n.parentNode.nodeName]) fix(n); } return; }\n if (n.nodeType !== 1) return;\n if (SKIP[n.nodeName]) return;\n if (n.isContentEditable) return;\n if (n.closest) { if (n.closest(\"ruby\")) return; }\n Array.prototype.slice.call(n.childNodes).forEach(walk);\n }\n function start() {\n walk(document.body);\n new MutationObserver(function (list) {\n list.forEach(function (mu) {\n Array.prototype.forEach.call(mu.addedNodes, function (n) {\n if (n.parentNode) { if (!(n.parentNode.closest ? n.parentNode.closest(\"ruby\") : null)) walk(n); }\n });\n });\n }).observe(document.body, { childList: true, subtree: true });\n }\n window.tmyFurigana = convert;\n if (document.body) start(); else document.addEventListener(\"DOMContentLoaded\", start);\n})();\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Kh\u00f3a h\u1ecdc Video \u2630 Danh s\u00e1ch b\u00e0i gi\u1ea3ng 1. An to\u00e0n v\u1ec7 sinh 2. Ch\u1ebf bi\u1ebfn 3. Ti\u1ebfp kh\u00e1ch 4. Qu\u1ea3n l\u00fd \u276e B\u00e0i tr\u01b0\u1edbc B\u00e0i ti\u1ebfp theo \u276f \ud83d\udcd6 Danh s\u00e1ch b\u00e0i gi\u1ea3ng 1. An to\u00e0n v\u1ec7 sinh 2. Ch\u1ebf bi\u1ebfn 3. Ti\u1ebfp kh\u00e1ch 4. Qu\u1ea3n l\u00fd<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-6625","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages\/6625","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/comments?post=6625"}],"version-history":[{"count":3,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages\/6625\/revisions"}],"predecessor-version":[{"id":8730,"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/pages\/6625\/revisions\/8730"}],"wp:attachment":[{"href":"https:\/\/tokuteigino.vn\/vi\/wp-json\/wp\/v2\/media?parent=6625"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}