EQDT - Eq Discovery Tool<\/title>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2canvas\/1.4.1\/html2canvas.min.js\"><\/script>\n <style>\n * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n body {\n background-color: #232323;\n color: #ffffff;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n min-height: 100vh;\n overflow-x: hidden;\n }\n\n #eqdt-root {\n background-color: #232323;\n color: #ffffff;\n min-height: 100vh;\n width: 100%;\n padding: 35px 50px;\n position: relative;\n user-select: none;\n display: flex;\n flex-direction: column;\n }\n\n .eqdt-topbar {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n }\n\n .eqdt-logo {\n display: flex;\n flex-direction: column;\n }\n\n .logo-text {\n font-size: 2.5rem;\n font-weight: 700;\n letter-spacing: 2px;\n line-height: 1;\n }\n\n .logo-subline {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 6px;\n }\n\n .logo-subline .line {\n width: 14px;\n height: 1px;\n background-color: #777;\n }\n\n .logo-subline .subtext {\n font-size: 0.65rem;\n color: #8a8a8a;\n letter-spacing: 1px;\n }\n\n .about-btn {\n background-color: #63676a;\n color: #f1f1f1;\n border: none;\n border-radius: 12px;\n padding: 12px 28px;\n font-size: 1.05rem;\n cursor: pointer;\n }\n\n .eqdt-center-area {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 45px;\n }\n\n .start-btn {\n background-color: #686c6f;\n color: #ffffff;\n border: none;\n border-radius: 32px;\n padding: 26px 60px;\n font-size: 2.2rem;\n cursor: pointer;\n box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);\n }\n\n .eq-visual-wrapper {\n width: 100%;\n max-width: 320px;\n }\n\n .small-eq {\n max-width: 250px;\n margin-top: 20px;\n }\n\n .eq-svg {\n width: 100%;\n height: auto;\n }\n\n .modal-backdrop {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.82);\n backdrop-filter: blur(5px);\n z-index: 99999;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .popup-box {\n width: 80vw;\n height: 80vh;\n background: #232323;\n border-radius: 20px;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.85);\n position: relative;\n padding: 35px 50px;\n display: flex;\n flex-direction: column;\n }\n\n .scrollable-popup {\n overflow-y: auto;\n overflow-x: hidden;\n scroll-behavior: smooth;\n }\n\n .scrollable-popup::-webkit-scrollbar {\n width: 8px;\n }\n\n .scrollable-popup::-webkit-scrollbar-thumb {\n background: #444;\n border-radius: 4px;\n }\n\n .modal-close {\n position: absolute;\n top: 20px;\n right: 25px;\n background: transparent;\n border: none;\n color: #777;\n font-size: 2rem;\n cursor: pointer;\n z-index: 10;\n line-height: 1;\n }\n\n .modal-close:hover {\n color: #fff;\n }\n\n .popup-body {\n flex: 1;\n width: 100%;\n position: relative;\n }\n\n .center-flex {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 30px;\n }\n\n .hidden {\n display: none !important;\n }\n\n .pill-btn {\n background-color: #686c6f;\n color: #ffffff;\n border: none;\n border-radius: 20px;\n cursor: pointer;\n font-weight: 500;\n }\n\n .large-pill {\n padding: 16px 54px;\n font-size: 1.8rem;\n box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);\n }\n\n .alert-card {\n background-color: #ff4d4d;\n border-radius: 20px;\n width: 85%;\n max-width: 650px;\n padding: 40px 30px;\n text-align: center;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 20px;\n }\n\n .alert-title {\n font-size: 1.8rem;\n margin: 0;\n color: #ffffff;\n }\n\n .alert-p {\n font-size: 1.15rem;\n line-height: 1.5;\n margin: 0;\n color: #ffffff;\n }\n\n .bold-p {\n font-weight: 500;\n }\n\n .confirm-btn {\n background-color: #55d852;\n color: #0b2e0b;\n border: none;\n border-radius: 12px;\n padding: 14px 28px;\n font-size: 1.15rem;\n font-weight: 600;\n cursor: pointer;\n }\n\n .test-layout {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .test-instructions {\n max-width: 240px;\n font-size: 0.95rem;\n line-height: 1.45;\n color: #d8d8d8;\n }\n\n .strong-inst {\n font-size: 1.15rem;\n font-weight: 600;\n color: #ffffff;\n }\n\n .test-center {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 40px;\n }\n\n .test-actions {\n display: flex;\n gap: 30px;\n }\n\n .action-pill {\n padding: 14px 38px;\n font-size: 1.6rem;\n }\n\n .freq-axis-container {\n width: 90%;\n max-width: 680px;\n display: flex;\n flex-direction: column;\n position: relative;\n }\n\n .freq-axis-track {\n width: 100%;\n height: 2px;\n background-color: #ffffff;\n position: relative;\n }\n\n .freq-pointer {\n position: absolute;\n top: -14px;\n left: 0px;\n width: 0;\n height: 0;\n border-left: 9px solid transparent;\n border-right: 9px solid transparent;\n border-top: 14px solid #ffffff;\n transform: translateX(-50%);\n transition: left 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .freq-labels-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: 12px;\n width: 100%;\n }\n\n .freq-item-col {\n flex: 1;\n text-align: center;\n font-size: 0.9rem;\n color: #ffffff;\n cursor: default;\n }\n\n .active-hz-text {\n font-size: 1.1rem;\n color: #4ade80;\n font-weight: 600;\n }\n\n .test-right {\n width: 120px;\n display: flex;\n justify-content: center;\n }\n\n .gain-control {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n }\n\n .gain-label {\n font-size: 0.95rem;\n color: #4ade80;\n font-weight: 600;\n min-width: 55px;\n text-align: center;\n }\n\n #gain-slider {\n -webkit-appearance: none;\n appearance: none;\n width: 3px;\n height: 240px;\n background: #ffffff;\n outline: none;\n cursor: pointer;\n writing-mode: vertical-lr;\n direction: rtl;\n }\n\n #gain-slider::-webkit-slider-thumb {\n -webkit-appearance: none;\n width: 26px;\n height: 26px;\n border-radius: 50%;\n background: radial-gradient(circle at 35% 35%, #4ade80, #22c55e 55%, #15803d);\n cursor: pointer;\n }\n\n .result-section {\n min-height: calc(80vh - 70px);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding-bottom: 25px;\n box-sizing: border-box;\n }\n\n .result-header {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n }\n\n .eq-type-title {\n font-size: 1.8rem;\n font-weight: 500;\n margin: 0;\n color: #ffffff;\n }\n\n .chart-wrapper {\n display: flex;\n width: 95%;\n max-width: 900px;\n margin: 20px auto;\n align-items: flex-end;\n }\n\n .chart-labels-left {\n display: flex;\n flex-direction: column;\n width: 50px;\n margin-right: 15px;\n font-weight: 600;\n font-size: 0.95rem;\n text-align: left;\n }\n\n .spacer-track {\n height: 180px;\n }\n\n .label-hz {\n height: 28px;\n line-height: 28px;\n }\n\n .label-q {\n height: 28px;\n line-height: 28px;\n }\n\n .label-gain {\n height: 28px;\n line-height: 28px;\n }\n\n .chart-columns-grid {\n flex: 1;\n display: flex;\n justify-content: space-between;\n position: relative;\n align-items: flex-start;\n }\n\n .center-zero-line {\n position: absolute;\n left: -10px;\n right: -10px;\n top: 90px;\n height: 2px;\n background-color: #ffffff;\n transform: translateY(-50%);\n z-index: 1;\n }\n\n .eq-column-unit {\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 38px;\n z-index: 2;\n }\n\n .column-track-area {\n width: 100%;\n height: 180px;\n position: relative;\n display: flex;\n justify-content: center;\n }\n\n .column-v-line {\n width: 2px;\n height: 100%;\n background-color: #ffffff;\n }\n\n .eq-column-node {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: radial-gradient(circle at 35% 35%, #4ade80, #22c55e 55%, #15803d);\n position: absolute;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .eq-column-node::after {\n content: \"-\";\n color: #000;\n font-size: 13px;\n font-weight: bold;\n line-height: 1;\n }\n\n .column-hz-val {\n height: 28px;\n line-height: 28px;\n font-size: 0.85rem;\n text-align: center;\n width: 100%;\n color: #fff;\n }\n\n .column-q-val {\n height: 28px;\n line-height: 28px;\n font-size: 0.85rem;\n text-align: center;\n width: 100%;\n color: #bbb;\n }\n\n .column-gain-val {\n height: 28px;\n line-height: 28px;\n font-size: 0.85rem;\n text-align: center;\n width: 100%;\n color: #fff;\n }\n\n .result-actions {\n display: flex;\n justify-content: flex-end;\n gap: 20px;\n width: 100%;\n }\n\n .result-btn {\n background-color: #63676a;\n color: #ffffff;\n border: none;\n border-radius: 14px;\n padding: 12px 34px;\n font-size: 1.4rem;\n font-weight: 500;\n cursor: pointer;\n }\n\n .scroll-divider {\n text-align: center;\n color: #777;\n font-size: 0.85rem;\n padding: 15px 0;\n letter-spacing: 1px;\n }\n\n .eq-btn-squeeze {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n transition: transform 0.1s ease, filter 0.15s ease;\n transform-origin: center center;\n }\n\n .eq-btn-squeeze:active {\n transform: scale3d(0.88, 1.06, 1) !important;\n filter: brightness(1.1);\n }\n\n .eq-btn-squeeze.squeeze-release {\n animation: jellyRelease 0.42s cubic-bezier(0.25, 1.4, 0.45, 1) forwards;\n }\n\n @keyframes jellyRelease {\n 0% {\n transform: scale3d(0.88, 1.06, 1);\n }\n 40% {\n transform: scale3d(1.05, 0.94, 1);\n }\n 70% {\n transform: scale3d(0.98, 1.02, 1);\n }\n 100% {\n transform: scale3d(1, 1, 1);\n }\n }\n\n @media (max-width: 860px) {\n .popup-box {\n width: 95vw;\n height: 92vh;\n padding: 20px 15px;\n }\n .chart-wrapper {\n width: 100%;\n font-size: 0.75rem;\n }\n .eq-column-unit {\n width: 24px;\n }\n .eq-column-node {\n width: 16px;\n height: 16px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"eqdt-root\">\n \n <header class=\"eqdt-topbar\">\n <div class=\"eqdt-logo\">\n <span class=\"logo-text\">EQDT<\/span>\n <div class=\"logo-subline\">\n <span class=\"line\"><\/span>\n <span class=\"subtext\">Eq Discovery Tool<\/span>\n <span class=\"line\"><\/span>\n <\/div>\n <\/div>\n <button id=\"btn-about\" class=\"about-btn eq-btn-squeeze\" type=\"button\">Hakk\u0131m\u0131zda<\/button>\n <\/header>\n\n <main class=\"eqdt-center-area\">\n <button id=\"btn-open-flow\" class=\"start-btn eq-btn-squeeze\" type=\"button\">Ba\u015flamaya haz\u0131r m\u0131s\u0131n?<\/button>\n <div class=\"eq-visual-wrapper\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 340 220\" class=\"eq-svg\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n <defs>\n <radialGradient id=\"greenNodeGradLanding\" cx=\"35%\" cy=\"35%\" r=\"65%\">\n <stop offset=\"0%\" stop-color=\"#4ade80\" \/>\n <stop offset=\"55%\" stop-color=\"#22c55e\" \/>\n <stop offset=\"100%\" stop-color=\"#15803d\" \/>\n <\/radialGradient>\n <\/defs>\n <line x1=\"20\" y1=\"110\" x2=\"320\" y2=\"110\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"50\" y1=\"10\" x2=\"50\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"98\" y1=\"10\" x2=\"98\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"146\" y1=\"10\" x2=\"146\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"194\" y1=\"10\" x2=\"194\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"242\" y1=\"10\" x2=\"242\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"290\" y1=\"10\" x2=\"290\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <circle cx=\"50\" cy=\"85\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"45\" y1=\"85\" x2=\"55\" y2=\"85\" stroke=\"#000\" stroke-width=\"1.5\"\/>\n <circle cx=\"98\" cy=\"110\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"93\" y1=\"110\" x2=\"103\" y2=\"110\" stroke=\"#000\" stroke-width=\"1.5\"\/>\n <circle cx=\"146\" cy=\"135\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"141\" y1=\"135\" x2=\"151\" y2=\"135\" stroke=\"#000\" stroke-width=\"1.5\"\/>\n <circle cx=\"194\" cy=\"110\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"189\" y1=\"110\" x2=\"199\" y2=\"110\" stroke=\"#000\" stroke-width=\"1.5\"\/>\n <circle cx=\"242\" cy=\"85\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"237\" y1=\"85\" x2=\"247\" y2=\"85\" stroke=\"#000\" stroke-width=\"1.5\"\/>\n <circle cx=\"290\" cy=\"110\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"285\" y1=\"110\" x2=\"295\" y2=\"110\" stroke=\"#000\" stroke-width=\"1.5\"\/>\n <\/svg>\n <\/div>\n <\/main>\n\n \n <div id=\"eqdt-modal-overlay\" class=\"modal-backdrop hidden\">\n \n <div id=\"step-1-modal\" class=\"popup-box\">\n <button class=\"modal-close eq-btn-squeeze\" onclick=\"closeAllModals()\">×<\/button>\n <div class=\"popup-header\">\n <div class=\"eqdt-logo\">\n <span class=\"logo-text\">EQDT<\/span>\n <div class=\"logo-subline\"><span class=\"line\"><\/span><span class=\"subtext\">Eq Discovery Tool<\/span><span class=\"line\"><\/span><\/div>\n <\/div>\n <\/div>\n <div class=\"popup-body center-flex\">\n <button id=\"btn-modal-start\" class=\"pill-btn large-pill eq-btn-squeeze\" type=\"button\">Ba\u015flat<\/button>\n <div class=\"eq-visual-wrapper small-eq\">\n <svg viewBox=\"0 0 340 220\" class=\"eq-svg\">\n <use href=\"#greenNodeGradLanding\" \/>\n <line x1=\"20\" y1=\"110\" x2=\"320\" y2=\"110\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"50\" y1=\"10\" x2=\"50\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"98\" y1=\"10\" x2=\"98\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"146\" y1=\"10\" x2=\"146\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"194\" y1=\"10\" x2=\"194\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"242\" y1=\"10\" x2=\"242\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <line x1=\"290\" y1=\"10\" x2=\"290\" y2=\"210\" stroke=\"#ffffff\" stroke-width=\"2.5\" stroke-linecap=\"round\" \/>\n <circle cx=\"50\" cy=\"85\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"45\" y1=\"85\" x2=\"55\" y2=\"85\" stroke=\"#000\" stroke-width=\"1.5\" \/>\n <circle cx=\"98\" cy=\"110\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"93\" y1=\"110\" x2=\"103\" y2=\"110\" stroke=\"#000\" stroke-width=\"1.5\" \/>\n <circle cx=\"146\" cy=\"135\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"141\" y1=\"135\" x2=\"151\" y2=\"135\" stroke=\"#000\" stroke-width=\"1.5\" \/>\n <circle cx=\"194\" cy=\"110\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"189\" y1=\"110\" x2=\"199\" y2=\"110\" stroke=\"#000\" stroke-width=\"1.5\" \/>\n <circle cx=\"242\" cy=\"85\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"237\" y1=\"85\" x2=\"247\" y2=\"85\" stroke=\"#000\" stroke-width=\"1.5\" \/>\n <circle cx=\"290\" cy=\"110\" r=\"13\" fill=\"url(#greenNodeGradLanding)\" \/><line x1=\"285\" y1=\"110\" x2=\"295\" y2=\"110\" stroke=\"#000\" stroke-width=\"1.5\" \/>\n <\/svg>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"step-2-modal\" class=\"popup-box hidden\">\n <button class=\"modal-close eq-btn-squeeze\" onclick=\"closeAllModals()\">×<\/button>\n <div class=\"popup-header\">\n <div class=\"eqdt-logo\">\n <span class=\"logo-text\">EQDT<\/span>\n <div class=\"logo-subline\"><span class=\"line\"><\/span><span class=\"subtext\">Eq Discovery Tool<\/span><span class=\"line\"><\/span><\/div>\n <\/div>\n <\/div>\n <div class=\"popup-body center-flex\">\n <div class=\"alert-card\">\n <h2 class=\"alert-title\">D\u0130KKAT!<\/h2>\n <p class=\"alert-p bold-p\">Test s\u0131ras\u0131nda en uygun ses seviyesi i\u00e7in sistem sesini %65'e \u00e7ekin.<\/p>\n <p class=\"alert-p\">\n Bu ara\u00e7 sizi y\u00f6nlendirmek i\u00e7in tasarlanm\u0131\u015f olup, %100 do\u011frulu\u011fa sahip de\u011fildir.<br>\n EQDT; Equalizer'\u0131n karma\u015f\u0131k yap\u0131s\u0131n\u0131 ve do\u011fru frekans'\u0131 sizin yerinize bulur.<br>\n \u00d6zelle\u015ftirmek size d\u00fc\u015fer.\n <\/p>\n <button id=\"btn-accept-alert\" class=\"confirm-btn eq-btn-squeeze\" type=\"button\">Okudum, EQDT'yi Ba\u015flat.<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"step-3-modal\" class=\"popup-box hidden\">\n <button class=\"modal-close eq-btn-squeeze\" onclick=\"closeAllModals()\">×<\/button>\n <div class=\"popup-header\">\n <div class=\"eqdt-logo\">\n <span class=\"logo-text\">EQDT<\/span>\n <div class=\"logo-subline\"><span class=\"line\"><\/span><span class=\"subtext\">Eq Discovery Tool<\/span><span class=\"line\"><\/span><\/div>\n <\/div>\n <\/div>\n\n <div class=\"popup-body test-layout\">\n <div class=\"test-instructions\">\n <p>Kula\u011f\u0131n\u0131za fazla gelen frekanslarda durdurun,<\/p>\n <p>Ve gain \u00e7ubu\u011fu ile sesin rahats\u0131zl\u0131\u011f\u0131n\u0131 ayarlay\u0131n.<\/p>\n <p>E\u011fer art\u0131k frekans kula\u011f\u0131n\u0131za fazla gelmiyorsa,<\/p>\n <p class=\"strong-inst\">Orada durun ve test'e devam edin.<\/p>\n <\/div>\n\n <div class=\"test-center\">\n <div class=\"test-actions\">\n <button id=\"btn-pause\" class=\"pill-btn action-pill eq-btn-squeeze\" type=\"button\">Durdur<\/button>\n <button id=\"btn-finish\" class=\"pill-btn action-pill eq-btn-squeeze\" type=\"button\">Bitir<\/button>\n <\/div>\n\n <div class=\"freq-axis-container\">\n <div class=\"freq-axis-track\" id=\"freq-track\">\n <div id=\"freq-pointer\" class=\"freq-pointer\"><\/div>\n <\/div>\n <div class=\"freq-labels-row\" id=\"freq-labels-container\">\n <div class=\"freq-item-col\" data-idx=\"0\"><span>31<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"1\"><span>62<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"2\"><span>125<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"3\"><span>250<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"4\"><span>500<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"5\"><span>1k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"6\"><span>2k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"7\"><span>4k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"8\"><span>6k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"9\"><span>8k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"10\"><span>10k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"11\"><span>12k<\/span><\/div>\n <div class=\"freq-item-col\" data-idx=\"12\"><span>16k<\/span><\/div>\n <\/div>\n <\/div>\n <span id=\"current-hz-indicator\" class=\"active-hz-text\">Hz: 31<\/span>\n <\/div>\n\n <div class=\"test-right\">\n <div class=\"gain-control\">\n <input type=\"range\" id=\"gain-slider\" min=\"-12\" max=\"12\" value=\"0\" step=\"0.5\" orient=\"vertical\" \/>\n <span class=\"gain-label\" id=\"gain-val-label\">0 dB<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"step-4-modal\" class=\"popup-box scrollable-popup hidden\">\n <button class=\"modal-close eq-btn-squeeze\" onclick=\"closeAllModals()\">×<\/button>\n\n \n <section id=\"capture-graphic-eq\" class=\"result-section\">\n <div class=\"result-header\">\n <div class=\"eqdt-logo\">\n <span class=\"logo-text\">EQDT<\/span>\n <div class=\"logo-subline\"><span class=\"line\"><\/span><span class=\"subtext\">Eq Discovery Tool<\/span><span class=\"line\"><\/span><\/div>\n <\/div>\n <h3 class=\"eq-type-title\">Grafik EQ<\/h3>\n <\/div>\n\n <div class=\"chart-wrapper\">\n <div class=\"chart-labels-left\">\n <div class=\"spacer-track\"><\/div>\n <div class=\"label-hz\">hz<\/div>\n <div class=\"label-gain\">gain<\/div>\n <\/div>\n <div class=\"chart-columns-grid\" id=\"graphic-eq-grid\">\n <div class=\"center-zero-line\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"result-actions\">\n <button class=\"result-btn eq-btn-squeeze\" onclick=\"saveAsImage('capture-graphic-eq')\">Kaydet<\/button>\n <button class=\"result-btn eq-btn-squeeze\" onclick=\"downloadEqFile()\">\u0130ndir<\/button>\n <\/div>\n <\/section>\n\n <div class=\"scroll-divider\">\n <span>\u25bc Parametric EQ i\u00e7in a\u015fa\u011f\u0131 kayd\u0131r\u0131n \u25bc<\/span>\n <\/div>\n\n \n <section id=\"capture-parametric-eq\" class=\"result-section\">\n <div class=\"result-header\">\n <div class=\"eqdt-logo\">\n <span class=\"logo-text\">EQDT<\/span>\n <div class=\"logo-subline\"><span class=\"line\"><\/span><span class=\"subtext\">Eq Discovery Tool<\/span><span class=\"line\"><\/span><\/div>\n <\/div>\n <h3 class=\"eq-type-title\">Parametric EQ<\/h3>\n <\/div>\n\n <div class=\"chart-wrapper\">\n <div class=\"chart-labels-left\">\n <div class=\"spacer-track\"><\/div>\n <div class=\"label-hz\">hz<\/div>\n <div class=\"label-q\">Q<\/div>\n <div class=\"label-gain\">gain<\/div>\n <\/div>\n <div class=\"chart-columns-grid\" id=\"parametric-eq-grid\">\n <div class=\"center-zero-line\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"result-actions\">\n <button class=\"result-btn eq-btn-squeeze\" onclick=\"saveAsImage('capture-parametric-eq')\">Kaydet<\/button>\n <button class=\"result-btn eq-btn-squeeze\" onclick=\"downloadEqFile()\">\u0130ndir<\/button>\n <\/div>\n <\/section>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n const FREQS = [31, 62, 125, 250, 500, 1000, 2000, 4000, 6000, 8000, 10000, 12000, 16000];\n let testGains = new Array(FREQS.length).fill(0);\n let testQs = new Array(FREQS.length).fill(1.4);\n\n let currentFreqIdx = 0;\n let isTestPaused = false;\n let testInterval = null;\n\n let audioCtx = null;\n let oscillator = null;\n let gainNode = null;\n\n const modalOverlay = document.getElementById(\"eqdt-modal-overlay\");\n const step1 = document.getElementById(\"step-1-modal\");\n const step2 = document.getElementById(\"step-2-modal\");\n const step3 = document.getElementById(\"step-3-modal\");\n const step4 = document.getElementById(\"step-4-modal\");\n\n document.getElementById(\"btn-open-flow\").addEventListener(\"click\", () => {\n modalOverlay.classList.remove(\"hidden\");\n step1.classList.remove(\"hidden\");\n step2.classList.add(\"hidden\");\n step3.classList.add(\"hidden\");\n step4.classList.add(\"hidden\");\n });\n\n document.getElementById(\"btn-modal-start\").addEventListener(\"click\", () => {\n step1.classList.add(\"hidden\");\n step2.classList.remove(\"hidden\");\n });\n\n document.getElementById(\"btn-accept-alert\").addEventListener(\"click\", () => {\n step2.classList.add(\"hidden\");\n step3.classList.remove(\"hidden\");\n setTimeout(() => {\n startAudioTest();\n }, 50);\n });\n\n function closeAllModals() {\n stopAudio();\n clearInterval(testInterval);\n modalOverlay.classList.add(\"hidden\");\n step1.classList.add(\"hidden\");\n step2.classList.add(\"hidden\");\n step3.classList.add(\"hidden\");\n step4.classList.add(\"hidden\");\n }\n\n function initAudio() {\n if (!audioCtx) {\n audioCtx = new (window.AudioContext || window.webkitAudioContext)();\n }\n if (audioCtx.state === \"suspended\") {\n audioCtx.resume();\n }\n }\n\n function playCurrentFrequency() {\n initAudio();\n stopAudio();\n\n oscillator = audioCtx.createOscillator();\n gainNode = audioCtx.createGain();\n\n oscillator.type = \"sine\";\n const freq = FREQS[currentFreqIdx];\n oscillator.frequency.setValueAtTime(freq, audioCtx.currentTime);\n\n const currentGainDb = testGains[currentFreqIdx];\n const linearGain = Math.pow(10, currentGainDb \/ 20) * 0.1;\n gainNode.gain.setValueAtTime(linearGain, audioCtx.currentTime);\n\n oscillator.connect(gainNode);\n gainNode.connect(audioCtx.destination);\n oscillator.start();\n }\n\n function stopAudio() {\n if (oscillator) {\n try {\n oscillator.stop();\n } catch (e) {}\n oscillator.disconnect();\n oscillator = null;\n }\n }\n\n function alignPointerToCurrentFreq() {\n const items = document.querySelectorAll(\".freq-item-col\");\n const targetItem = items[currentFreqIdx];\n const track = document.getElementById(\"freq-track\");\n const pointer = document.getElementById(\"freq-pointer\");\n\n if (targetItem && track && pointer) {\n const trackRect = track.getBoundingClientRect();\n const itemRect = targetItem.getBoundingClientRect();\n const exactX = itemRect.left + itemRect.width \/ 2 - trackRect.left;\n pointer.style.left = `${exactX}px`;\n }\n }\n\n function updateUIState() {\n const freq = FREQS[currentFreqIdx];\n document.getElementById(\"current-hz-indicator\").innerText = `Hz: ${freq >= 1000 ? freq \/ 1000 + \"k\" : freq}`;\n alignPointerToCurrentFreq();\n }\n\n function startAudioTest() {\n currentFreqIdx = 0;\n isTestPaused = false;\n document.getElementById(\"btn-pause\").innerText = \"Durdur\";\n document.getElementById(\"gain-slider\").value = testGains[currentFreqIdx];\n document.getElementById(\"gain-val-label\").innerText = testGains[currentFreqIdx] + \" dB\";\n\n updateUIState();\n playCurrentFrequency();\n\n clearInterval(testInterval);\n testInterval = setInterval(() => {\n if (!isTestPaused) {\n currentFreqIdx++;\n if (currentFreqIdx >= FREQS.length) {\n stopAudio();\n clearInterval(testInterval);\n finishTest();\n } else {\n document.getElementById(\"gain-slider\").value = testGains[currentFreqIdx];\n document.getElementById(\"gain-val-label\").innerText = testGains[currentFreqIdx] + \" dB\";\n updateUIState();\n playCurrentFrequency();\n }\n }\n }, 3500);\n }\n\n document.getElementById(\"btn-pause\").addEventListener(\"click\", () => {\n isTestPaused = !isTestPaused;\n const btn = document.getElementById(\"btn-pause\");\n if (isTestPaused) {\n btn.innerText = \"Devam Et\";\n btn.style.backgroundColor = \"#4ade80\";\n btn.style.color = \"#000\";\n } else {\n btn.innerText = \"Durdur\";\n btn.style.backgroundColor = \"\";\n btn.style.color = \"\";\n currentFreqIdx++;\n if (currentFreqIdx >= FREQS.length) {\n finishTest();\n } else {\n document.getElementById(\"gain-slider\").value = testGains[currentFreqIdx];\n document.getElementById(\"gain-val-label\").innerText = testGains[currentFreqIdx] + \" dB\";\n updateUIState();\n playCurrentFrequency();\n }\n }\n });\n\n const gainSlider = document.getElementById(\"gain-slider\");\n gainSlider.addEventListener(\"input\", (e) => {\n const val = parseFloat(e.target.value);\n testGains[currentFreqIdx] = val;\n document.getElementById(\"gain-val-label\").innerText = val + \" dB\";\n\n if (gainNode && audioCtx) {\n const linearGain = Math.pow(10, val \/ 20) * 0.1;\n gainNode.gain.setValueAtTime(linearGain, audioCtx.currentTime);\n }\n });\n\n document.getElementById(\"btn-finish\").addEventListener(\"click\", finishTest);\n\n function finishTest() {\n stopAudio();\n clearInterval(testInterval);\n step3.classList.add(\"hidden\");\n step4.classList.remove(\"hidden\");\n renderResultCharts();\n }\n\n function renderResultCharts() {\n buildColumnGrid(\"graphic-eq-grid\", false);\n buildColumnGrid(\"parametric-eq-grid\", true);\n }\n\n function buildColumnGrid(containerId, isParametric) {\n const grid = document.getElementById(containerId);\n grid.innerHTML = '<div class=\"center-zero-line\"><\/div>';\n\n FREQS.forEach((f, idx) => {\n const g = testGains[idx];\n const q = testQs[idx];\n const formattedHz = f >= 1000 ? f \/ 1000 + \"k\" : f;\n\n const col = document.createElement(\"div\");\n col.className = \"eq-column-unit\";\n\n const topOffset = 90 - (g \/ 12) * 70;\n\n let innerHtml = `\n <div class=\"column-track-area\">\n <div class=\"column-v-line\"><\/div>\n <div class=\"eq-column-node\" style=\"top: ${topOffset}px;\"><\/div>\n <\/div>\n <div class=\"column-hz-val\">${formattedHz}<\/div>\n `;\n\n if (isParametric) {\n innerHtml += `<div class=\"column-q-val\">${q}<\/div>`;\n }\n\n innerHtml += `<div class=\"column-gain-val\">${g}<\/div>`;\n\n col.innerHTML = innerHtml;\n grid.appendChild(col);\n });\n }\n\n function downloadEqFile() {\n let apoText = \"GraphicEQ: \";\n FREQS.forEach((f, idx) => {\n apoText += `${f} ${testGains[idx]}; `;\n });\n const blob = new Blob([apoText.trim()], { type: \"text\/plain;charset=utf-8\" });\n const link = document.createElement(\"a\");\n link.href = URL.createObjectURL(blob);\n link.download = \"EQDT_Profile.txt\";\n link.click();\n URL.revokeObjectURL(link.href);\n }\n\n function saveAsImage(sectionId) {\n const targetElement = document.getElementById(sectionId);\n html2canvas(targetElement, {\n backgroundColor: \"#232323\",\n scale: 2\n }).then((canvas) => {\n const link = document.createElement(\"a\");\n link.download = `${sectionId}.png`;\n link.href = canvas.toDataURL(\"image\/png\");\n link.click();\n });\n }\n\n document.addEventListener(\"pointerup\", function (e) {\n const btn = e.target.closest(\".eq-btn-squeeze\");\n if (!btn) return;\n\n btn.classList.remove(\"squeeze-release\");\n void btn.offsetWidth;\n btn.classList.add(\"squeeze-release\");\n\n setTimeout(() => {\n btn.classList.remove(\"squeeze-release\");\n }, 450);\n });\n\n window.addEventListener(\"resize\", () => {\n if (!step3.classList.contains(\"hidden\")) {\n alignPointerToCurrentFreq();\n }\n });\n <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>EQDT EQDT – Eq Discovery Tool EQDT Eq Discovery Tool Hakk\u0131m\u0131zda Ba\u015flamaya haz\u0131r m\u0131s\u0131n? × EQDT Eq Discovery Tool Ba\u015flat […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_kadence_starter_templates_imported_post":false,"footnotes":""},"class_list":["post-724","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/pages\/724","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/comments?post=724"}],"version-history":[{"count":3,"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/pages\/724\/revisions"}],"predecessor-version":[{"id":1028,"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/pages\/724\/revisions\/1028"}],"wp:attachment":[{"href":"https:\/\/www.skylesaudio.com.tr\/skylesaudio.com.tr\/wp-json\/wp\/v2\/media?parent=724"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}