{"id":375,"date":"2026-05-18T14:34:07","date_gmt":"2026-05-18T12:34:07","guid":{"rendered":"https:\/\/areagrennland-dub-techno-459.rostiapp.cz\/?page_id=375"},"modified":"2026-05-22T16:34:43","modified_gmt":"2026-05-22T14:34:43","slug":"namixuj-si-dj-set","status":"publish","type":"page","link":"https:\/\/dubtechno.co\/?page_id=375","title":{"rendered":"Namixuj si  Dj-set :)"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n\/* Hlavn\u00ed obal cel\u00e9ho p\u0159ehr\u00e1va\u010de *\/\n.dj-player-wrapper { \n  background: #ffffff !important; \n  padding: 40px 20px; \n  width: 100%; \n  box-sizing: border-box; \n}\n\n\/* Hlavn\u00ed \u0161as\u00ed pultu - nov\u011b kompletn\u011b b\u00edl\u00e9 *\/\n.dj-hardware-mixer.dark-blue-neon-theme { \n  background: #ffffff; \n  border: 3px solid #b0b8c0; \/* \u0160ed\u00fd okraj \u0161as\u00ed *\/\n  border-radius: 16px; \n  padding: 25px; \n  max-width: 950px; \n  margin: 0 auto; \n  color: #111111; \/* Texty se p\u0159epnuly do \u010dern\u00e9, aby byly na b\u00edl\u00e9 vid\u011bt *\/\n  font-family: monospace; \n  \/* Tmav\u011b modr\u00e9 neonov\u00e9 podsv\u00edcen\u00ed pod pultem *\/\n  box-shadow: 0 15px 50px rgba(0, 11, 102, 0.4), 0 0 25px rgba(0, 34, 204, 0.2); \n  user-select: none; \n  box-sizing: border-box; \n}\n\n\/* Zna\u010dka \/ titulek pultu s tmav\u011b modr\u00fdm neonem *\/\n.mixer-brand { \n  text-align: center; \n  font-size: 20px; \n  color: #0011aa; \n  font-weight: bold; \n  letter-spacing: 5px; \n  margin-bottom: 25px; \n  text-shadow: 0 0 10px rgba(0, 34, 255, 0.5); \n}\n\n\/* Uspo\u0159\u00e1d\u00e1n\u00ed vnit\u0159ku konzole *\/\n.main-console { \n  display: flex; \n  justify-content: space-between; \n  gap: 15px; \n}\n\n\/* Jednotliv\u00e9 stanice (Decky) - b\u00edl\u00e9 pozad\u00ed odd\u011blen\u00e9 \u0161ed\u00fdmi pruhy *\/\n.deck-station { \n  flex: 1.4; \n  background: #ffffff; \n  border-radius: 8px; \n  padding: 15px; \n  text-align: center; \n  \/* \u0160ed\u00fd odd\u011blovac\u00ed pruh \/ okraj *\/\n  border: 2px solid #d0d5dd; \n  box-shadow: inset 0 0 10px rgba(0,0,0,0.03);\n}\n\n.deck-header { \n  font-size: 14px; \n  font-weight: bold; \n  color: #0022cc; \/* Tmav\u011b modr\u00e1 pro nadpisy *\/\n  letter-spacing: 2px; \n  margin-bottom: 5px; \n}\n\n\/* Displej s n\u00e1zvem skladby *\/\n.track-display { \n  background: #f4f6f8; \n  color: #0011aa; \/* Tmav\u011b modr\u00e9 p\u00edsmo na displeji *\/\n  padding: 6px; \n  font-size: 11px; \n  border-radius: 4px; \n  border: 1px solid #d0d5dd; \n  height: 18px; \n  overflow: hidden; \n  text-overflow: ellipsis; \n  white-space: nowrap; \n  font-weight: bold;\n}\n\n\/* \u017div\u00e9 BPM podsv\u00edcen\u00e9 tmav\u011b mod\u0159e *\/\n.live-bpm { \n  font-size: 18px; \n  color: #0022cc; \n  text-shadow: 0 0 5px rgba(0, 34, 255, 0.3); \n  margin: 8px 0; \n  font-weight: bold; \n}\n\n.deck-interaction-zone { \n  display: flex; \n  align-items: center; \n  justify-content: center; \n  gap: 15px; \n  margin-bottom: 15px; \n}\n\n.vinyl-container { \n  position: relative; \n  width: 140px; \n  height: 140px; \n}\n\n\/* Vinylov\u00fd tal\u00ed\u0159 - zachov\u00e1n vinylov\u00fd vzhled s \u0161ed\u00fdm lemov\u00e1n\u00edm *\/\n.vinyl-platter { \n  width: 140px; \n  height: 140px; \n  background: radial-gradient(circle, #f0f2f5 24%, #111111 25%, #222222 100%); \n  border-radius: 50%; \n  border: 4px solid #b0b8c0; \/* \u0160ed\u00fd okraj desky *\/\n  position: relative; \n  cursor: grab; \n  transform: rotate(0deg); \n  touch-action: none; \n  box-shadow: 0 4px 10px rgba(0,0,0,0.15);\n}\n\n\/* Zna\u010dka na desce - lad\u011bn\u00e1 do tmav\u011b modr\u00e9 *\/\n.vinyl-marker { \n  position: absolute; \n  top: 10px; \n  left: 50%; \n  width: 6px; \n  height: 25px; \n  background: #0022cc; \n  transform: translateX(-50%); \n  border-radius: 2px; \n  box-shadow: 0 0 6px #0022cc; \n}\n\n.vinyl-platter::after { \n  content: ''; \n  position: absolute; \n  top: 50%; \n  left: 50%; \n  width: 20px; \n  height: 20px; \n  background: #b0b8c0; \n  border-radius: 50%; \n  transform: translate(-50%, -50%); \n}\n\n.pitch-container { \n  display: flex; \n  flex-direction: column; \n  align-items: center; \n}\n\n.pitch-container label { \n  font-size: 9px; \n  color: #555555; \n  margin-bottom: 5px; \n}\n\n.pitch-slider { \n  height: 110px !important; \n}\n\n\/* Tla\u010d\u00edtka PLAY \/ PAUSE - sv\u011btl\u00e1 s tmav\u011b modr\u00fdm neonov\u00fdm aktivn\u00edm stavem *\/\n.deck-btn { \n  width: 100%; \n  padding: 12px; \n  font-weight: bold; \n  border: 2px solid #d0d5dd; \n  border-radius: 4px; \n  cursor: pointer; \n  background: #ffffff; \n  color: #444444; \n  transition: all 0.2s ease; \n}\n\n.deck-btn:hover {\n  background: #f4f6f8;\n  border-color: #b0b8c0;\n}\n\n\/* Aktivn\u00ed stav po stisknut\u00ed PLAY - tmav\u011b modr\u00e9 neonov\u00e9 podsv\u00edcen\u00ed *\/\n.deck-btn.play.active { \n  background: #0022cc; \n  color: #ffffff; \n  box-shadow: 0 0 15px rgba(0, 34, 255, 0.6); \n  border-color: #0011aa; \n}\n\n\/* St\u0159edov\u00fd mix\u00e1\u017en\u00ed pruh - b\u00edl\u00fd ohrani\u010den\u00fd \u0161ed\u00fdmi pruhy *\/\n.mixer-strip { \n  flex: 1; \n  background: #ffffff; \n  border-radius: 8px; \n  padding: 15px; \n  display: flex; \n  flex-direction: column; \n  justify-content: space-between; \n  border: 2px solid #d0d5dd; \n}\n\n.mixer-section-title { \n  text-align: center; \n  font-size: 11px; \n  color: #0022cc; \n  letter-spacing: 2px; \n  font-weight: bold;\n}\n\n.eq-grid { \n  display: flex; \n  justify-content: space-around; \n  margin: 15px 0; \n}\n\n.eq-knob-box { \n  text-align: center; \n}\n\n.eq-knob-box label { \n  font-size: 9px; \n  color: #555555; \n  display: block; \n  margin-bottom: 5px; \n}\n\n\/* Posuvn\u00edky (Filtry) p\u0159epnut\u00e9 do tmav\u011b modr\u00e9 barvy *\/\n.vertical-range { \n  writing-mode: bt-lr; \n  appearance: slider-vertical; \n  width: 20px; \n  height: 110px; \n  background: #e4e7eb; \n  accent-color: #0022cc; \n}\n\n.knob-labels { \n  display: flex; \n  justify-content: space-between; \n  font-size: 8px; \n  color: #777777; \n  margin-top: 2px; \n}\n\n.crossfader-section { \n  text-align: center; \n  margin-top: auto; \n  padding-top: 10px; \n  border-top: 2px solid #e4e7eb; \n}\n\n.crossfader-section label { \n  font-size: 9px; \n  color: #555555; \n}\n\n#crossfader { \n  width: 100%; \n  accent-color: #0022cc; \n  margin-top: 5px; \n}\n\n.xfader-labels { \n  display: flex; \n  justify-content: space-between; \n  font-size: 9px; \n  color: #777777; \n}\n\n\/* Hudebn\u00ed knihovna pod pultem *\/\n.music-browser { \n  margin-top: 25px; \n  background: #ffffff; \n  border-radius: 8px; \n  padding: 15px; \n  border: 2px solid #d0d5dd; \n}\n\n.browser-header { \n  font-size: 12px; \n  color: #0022cc; \n  font-weight: bold;\n  margin-bottom: 10px; \n  border-bottom: 2px solid #e4e7eb; \n  padding-bottom: 5px; \n}\n\n.track-table { \n  width: 100%; \n  border-collapse: collapse; \n  font-size: 12px; \n}\n\n.track-table th { \n  text-align: left; \n  color: #0022cc; \n  padding-bottom: 5px; \n}\n\n.track-table td { \n  padding: 8px 0; \n  border-bottom: 1px solid #e4e7eb; \n}\n\n.track-title { \n  color: #111111; \n  font-weight: bold; \n}\n\n\/* Zobrazen\u00ed BPM v tabulce *\/\n.track-bpm { \n  color: #0022cc; \n  background: #f4f6f8; \n  padding: 2px 6px; \n  border-radius: 3px; \n  border: 1px solid #d0d5dd; \n}\n\n\/* Tla\u010d\u00edtka pro na\u010dten\u00ed skladeb *\/\n.load-btn { \n  border: 2px solid #d0d5dd; \n  padding: 4px 8px; \n  border-radius: 3px; \n  cursor: pointer; \n  font-size: 10px; \n  background: #ffffff; \n  color: #444444; \n  font-weight: bold;\n  transition: all 0.2s ease; \n}\n\n.load-btn:hover { \n  background: #0022cc; \n  color: #ffffff; \n  border-color: #0011aa; \n  box-shadow: 0 0 8px rgba(0, 34, 255, 0.4);\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n(function() {\n  let audioCtx = null;\n\n  const decks = {\n    a: { audio: new Audio(), isPlaying: false, baseBPM: 120, currentBPM: 120, rotation: 0, isDragging: false, lastAngle: 0, lastMoveTime: 0, source: null, filterNode: null, gainNode: null },\n    b: { audio: new Audio(), isPlaying: false, baseBPM: 120, currentBPM: 120, rotation: 0, isDragging: false, lastAngle: 0, lastMoveTime: 0, source: null, filterNode: null, gainNode: null }\n  };\n\n  \/\/ CORS nastaven\u00ed pro oba decky\n  decks.a.audio.crossOrigin = \"anonymous\";\n  decks.b.audio.crossOrigin = \"anonymous\";\n  decks.a.audio.loop = true;\n  decks.b.audio.loop = true;\n\n  function initAudioRouting(deck) {\n    if (!audioCtx) {\n      audioCtx = new (window.AudioContext || window.webkitAudioContext)();\n    }\n    \n    if (audioCtx.state === 'suspended') {\n      audioCtx.resume();\n    }\n\n    const d = decks[deck];\n    if (d.source) return;\n\n    try {\n      d.source = audioCtx.createMediaElementSource(d.audio);\n      d.filterNode = audioCtx.createBiquadFilter();\n      d.gainNode = audioCtx.createGain();\n\n      d.filterNode.type = \"allpass\";\n      d.gainNode.gain.setValueAtTime(1.0, audioCtx.currentTime);\n\n      d.source.connect(d.filterNode);\n      d.filterNode.connect(d.gainNode);\n      d.gainNode.connect(audioCtx.destination);\n    } catch (e) {\n      console.error(\"Chyba inicializace audio cesty pro deck \" + deck + \":\", e);\n    }\n  }\n\n  function getAngle(e, element) {\n    const rect = element.getBoundingClientRect();\n    const clientX = e.touches ? e.touches[0].clientX : e.clientX;\n    const clientY = e.touches ? e.touches[0].clientY : e.clientY;\n    return Math.atan2(\n      clientY - (rect.top + rect.height \/ 2),\n      clientX - (rect.left + rect.width \/ 2)\n    );\n  }\n\n  function loadTrack(deck, url, title, bpm) {\n    const d = decks[deck];\n    const display = document.getElementById(`display-${deck}`);\n    \n    if (d.isPlaying) {\n      d.audio.pause();\n      d.isPlaying = false;\n      resetPlayButton(deck);\n    }\n\n    if (display) display.innerText = \"Na\u010d\u00edt\u00e1m...\";\n    d.baseBPM = parseFloat(bpm) || 120;\n    d.currentBPM = d.baseBPM;\n\n    if (url.indexOf('http') === 0) {\n      d.audio.crossOrigin = \"anonymous\";\n    } else {\n      d.audio.removeAttribute(\"crossOrigin\");\n    }\n\n    d.audio.src = url;\n    d.audio.load();\n\n    initAudioRouting(deck);\n\n    const slider = document.getElementById(`pitch-${deck}`);\n    if (slider) {\n      slider.min = Math.floor(d.baseBPM * 0.9);\n      slider.max = Math.ceil(d.baseBPM * 1.1);\n      slider.value = d.baseBPM;\n    }\n    \n    const bpmDisplay = document.getElementById(`live-bpm-${deck}`);\n    if (bpmDisplay) bpmDisplay.innerText = d.baseBPM.toFixed(1) + \" BPM\";\n    if (display) display.innerText = title;\n    \n    const filterSlider = document.getElementById(`filter-${deck}`);\n    if (filterSlider) filterSlider.value = 0;\n\n    updateMixer();\n  }\n\n  function togglePlay(deck) {\n    initAudioRouting(deck);\n    const d = decks[deck];\n    \n    if (!d.audio.src || d.audio.src === window.location.href) {\n      alert(\"Nejd\u0159\u00edve na\u010dt\u011bte p\u00edsni\u010dku z knihovny.\");\n      return;\n    }\n\n    const btn = document.getElementById(`btn-play-${deck}`);\n\n    if (!d.isPlaying) {\n      d.audio.playbackRate = d.currentBPM \/ d.baseBPM;\n      updateMixer();\n      \n      d.audio.play().then(() => {\n        d.isPlaying = true;\n        if (btn) {\n          btn.innerText = \"PAUSE\";\n          btn.classList.add('active');\n        }\n      }).catch(err => {\n        console.log(\"CORS nouzov\u00fd re\u017eim pro p\u0159ehr\u00e1v\u00e1n\u00ed.\");\n        d.audio.removeAttribute(\"crossOrigin\");\n        d.audio.play();\n        d.isPlaying = true;\n        if (btn) {\n          btn.innerText = \"PAUSE\";\n          btn.classList.add('active');\n        }\n      });\n    } else {\n      d.audio.pause();\n      d.isPlaying = false;\n      if (btn) {\n        btn.innerText = \"PLAY\";\n        btn.classList.remove('active');\n      }\n    }\n  }\n\n  function applyFilter(deck, value) {\n    initAudioRouting(deck);\n    const d = decks[deck];\n    if (!d.filterNode || !audioCtx) return;\n\n    const val = parseFloat(value);\n\n    if (val < -5) {\n      d.filterNode.type = \"lowpass\";\n      const norm = (val + 100) \/ 95; \n      const freq = 40 + (norm * norm * 19960);\n      d.filterNode.frequency.setValueAtTime(freq, audioCtx.currentTime);\n    } else if (val > 5) {\n      d.filterNode.type = \"highpass\";\n      const norm = (val - 5) \/ 95; \n      const freq = 20 + (norm * norm * 14980);\n      d.filterNode.frequency.setValueAtTime(freq, audioCtx.currentTime);\n    } else {\n      d.filterNode.type = \"allpass\";\n    }\n  }\n\n  function updateMixer() {\n    const fader = document.getElementById('crossfader');\n    const faderVal = fader ? parseFloat(fader.value) : 50;\n\n    const x = faderVal \/ 100;\n    const volA = Math.cos(x * Math.PI * 0.5);\n    const volB = Math.sin(x * Math.PI * 0.5);\n\n    if (decks.a.gainNode && audioCtx) {\n      decks.a.gainNode.gain.setValueAtTime(volA, audioCtx.currentTime);\n    } else {\n      decks.a.audio.volume = volA;\n    }\n\n    if (decks.b.gainNode && audioCtx) {\n      decks.b.gainNode.gain.setValueAtTime(volB, audioCtx.currentTime);\n    } else {\n      decks.b.audio.volume = volB;\n    }\n  }\n\n  function updatePitch(deck) {\n    const d = decks[deck];\n    const slider = document.getElementById(`pitch-${deck}`);\n    if (!slider || d.isDragging) return;\n\n    const targetBPM = parseFloat(slider.value);\n    d.currentBPM = targetBPM;\n    \n    const bpmDisplay = document.getElementById(`live-bpm-${deck}`);\n    if (bpmDisplay) bpmDisplay.innerText = targetBPM.toFixed(1) + \" BPM\";\n    \n    d.audio.playbackRate = targetBPM \/ d.baseBPM;\n  }\n\n  function resetPlayButton(deck) {\n    const btn = document.getElementById(`btn-play-${deck}`);\n    if (btn) {\n      btn.innerText = \"PLAY\";\n      btn.classList.remove('active');\n    }\n  }\n\n  function setupPlatterInteraction(deck) {\n    const platter = document.getElementById(`platter-${deck}`);\n    if (!platter) return;\n\n    const startDrag = (e) => {\n      initAudioRouting(deck);\n      const d = decks[deck];\n      if (!d.audio.src || d.audio.src === window.location.href) return;\n      \n      d.isDragging = true;\n      d.lastAngle = getAngle(e, platter);\n      d.lastMoveTime = performance.now();\n      d.wasPlayingBeforeDrag = d.isPlaying;\n    };\n\n    const doDrag = (e) => {\n      const d = decks[deck];\n      if (!d.isDragging) return;\n      \n      const currentTime = performance.now();\n      const currentAngle = getAngle(e, platter);\n      \n      let angleDiff = currentAngle - d.lastAngle;\n      let timeDiff = currentTime - d.lastMoveTime;\n\n      if (angleDiff > Math.PI) angleDiff -= Math.PI * 2;\n      if (angleDiff < -Math.PI) angleDiff += Math.PI * 2;\n\n      d.rotation += angleDiff * (180 \/ Math.PI);\n      platter.style.transform = `rotate(${d.rotation}deg)`;\n\n      if (timeDiff > 0) {\n        try {\n          let timeChange = angleDiff * 1.2; \n          let newTime = d.audio.currentTime + timeChange;\n          \n          if (newTime >= 0 && newTime <= d.audio.duration) {\n            d.audio.currentTime = newTime;\n          }\n          \n          const angularVelocity = angleDiff \/ (timeDiff \/ 1000);\n          d.audio.playbackRate = Math.min(Math.max(Math.abs(angularVelocity * 0.3), 0.2), 3.0);\n        } catch (err) {}\n      }\n\n      d.lastAngle = currentAngle;\n      d.lastMoveTime = currentTime;\n    };\n\n    const stopDrag = () => {\n      const d = decks[deck];\n      if (!d.isDragging) return;\n      d.isDragging = false;\n      \n      const slider = document.getElementById(`pitch-${deck}`);\n      const targetBPM = slider ? parseFloat(slider.value) : d.baseBPM;\n      \n      if (d.wasPlayingBeforeDrag) {\n        d.audio.playbackRate = targetBPM \/ d.baseBPM;\n        d.audio.play();\n      } else {\n        d.audio.pause();\n        d.audio.playbackRate = 1.0;\n      }\n    };\n\n    platter.addEventListener('mousedown', startDrag);\n    window.addEventListener('mousemove', doDrag);\n    window.addEventListener('mouseup', stopDrag);\n\n    platter.addEventListener('touchstart', startDrag, { passive: true });\n    window.addEventListener('touchmove', doDrag, { passive: false });\n    window.addEventListener('touchend', stopDrag);\n  }\n\n  function animate() {\n    if (decks.a.isPlaying && !decks.a.isDragging) {\n      decks.a.rotation += (decks.a.currentBPM \/ decks.a.baseBPM) * 2;\n      const pA = document.getElementById('platter-a');\n      if (pA) pA.style.transform = `rotate(${decks.a.rotation}deg)`;\n    }\n    if (decks.b.isPlaying && !decks.b.isDragging) {\n      decks.b.rotation += (decks.b.currentBPM \/ decks.b.baseBPM) * 2;\n      const pB = document.getElementById('platter-b');\n      if (pB) pB.style.transform = `rotate(${decks.b.rotation}deg)`;\n    }\n    requestAnimationFrame(animate);\n  }\n\n  document.addEventListener(\"DOMContentLoaded\", function() {\n    animate();\n    setupPlatterInteraction('a');\n    setupPlatterInteraction('b');\n\n    updateMixer();\n\n    document.body.addEventListener('click', function(e) {\n      if (e.target && e.target.classList.contains('load-btn')) {\n        loadTrack(e.target.dataset.deck, e.target.dataset.url, e.target.dataset.title, e.target.dataset.bpm);\n      }\n    });\n\n    const btnA = document.getElementById('btn-play-a');\n    const btnB = document.getElementById('btn-play-b');\n    if (btnA) btnA.addEventListener('click', () => togglePlay('a'));\n    if (btnB) btnB.addEventListener('click', () => togglePlay('b'));\n\n    const pitchA = document.getElementById('pitch-a');\n    const pitchB = document.getElementById('pitch-b');\n    if (pitchA) pitchA.addEventListener('input', () => updatePitch('a'));\n    if (pitchB) pitchB.addEventListener('input', () => updatePitch('b'));\n\n    const filterA = document.getElementById('filter-a');\n    const filterB = document.getElementById('filter-b');\n    if (filterA) filterA.addEventListener('input', (e) => applyFilter('a', e.target.value));\n    if (filterB) filterB.addEventListener('input', (e) => applyFilter('b', e.target.value));\n\n    \/\/ NOV\u00dd K\u00d3D: Reset obou filtr\u016f na dvojit\u00e9 kliknut\u00ed (Double click)\n    if (filterA) {\n      filterA.addEventListener('dblclick', function() {\n        this.value = 0;\n        applyFilter('a', 0);\n      });\n    }\n\n    if (filterB) {\n      filterB.addEventListener('dblclick', function() {\n        this.value = 0;\n        applyFilter('b', 0);\n      });\n    }\n\n    const xFader = document.getElementById('crossfader');\n    if (xFader) xFader.addEventListener('input', updateMixer);\n  });\n})();\n<\/script>\n\n<div class=\"dj-player-wrapper\">\n  <div class=\"dj-hardware-mixer dark-blue-neon-theme\">\n    <div class=\"mixer-brand\">DJ MIX \u2022 AGL TRACK<\/div>\n    \n    <div class=\"main-console\">\n      <!-- LEV\u00dd DECK (A) -->\n      <div class=\"deck-station\" id=\"station-a\">\n        <div class=\"deck-header\">DECK A<\/div>\n        <div class=\"track-display\" id=\"display-a\">\u017d\u00e1dn\u00e1 p\u00edsni\u010dka<\/div>\n        <div class=\"live-bpm\" id=\"live-bpm-a\">&#8211;.- BPM<\/div>\n        \n        <div class=\"deck-interaction-zone\">\n          <div class=\"vinyl-container\">\n            <div class=\"vinyl-platter\" id=\"platter-a\">\n              <div class=\"vinyl-marker\"><\/div>\n            <\/div>\n          <\/div>\n          <div class=\"pitch-container\">\n            <label>PITCH<\/label>\n            <input type=\"range\" class=\"vertical-range pitch-slider\" id=\"pitch-a\" min=\"100\" max=\"140\" step=\"0.1\" value=\"120\">\n          <\/div>\n        <\/div>\n        <button class=\"deck-btn play\" id=\"btn-play-a\">PLAY<\/button>\n      <\/div>\n\n      <!-- ST\u0158EDOV\u00dd MIX\u00c1\u017dN\u00cd PULT -->\n      <div class=\"mixer-strip\">\n        <div class=\"mixer-section-title\">DSP MIXER<\/div>\n        <div class=\"eq-grid\">\n          <div class=\"eq-knob-box\">\n            <label>FILTER A<\/label>\n            <input type=\"range\" class=\"vertical-range\" id=\"filter-a\" min=\"-100\" max=\"100\" value=\"0\">\n            <div class=\"knob-labels\"><span>LPF<\/span><span>HPF<\/span><\/div>\n          <\/div>\n          <div class=\"eq-knob-box\">\n            <label>FILTER B<\/label>\n            <input type=\"range\" class=\"vertical-range\" id=\"filter-b\" min=\"-100\" max=\"100\" value=\"0\">\n            <div class=\"knob-labels\"><span>LPF<\/span><span>HPF<\/span><\/div>\n          <\/div>\n        <\/div>\n        <div class=\"crossfader-section\">\n          <label>CROSSFADER<\/label>\n          <input type=\"range\" id=\"crossfader\" min=\"0\" max=\"100\" value=\"50\">\n          <div class=\"xfader-labels\"><span>A<\/span><span>CENTER<\/span><span>B<\/span><\/div>\n        <\/div>\n      <\/div>\n\n      <!-- PRAV\u00dd DECK (B) -->\n      <div class=\"deck-station\" id=\"station-b\">\n        <div class=\"deck-header\">DECK B<\/div>\n        <div class=\"track-display\" id=\"display-b\">\u017d\u00e1dn\u00e1 p\u00edsni\u010dka<\/div>\n        <div class=\"live-bpm\" id=\"live-bpm-b\">&#8211;.- BPM<\/div>\n        \n        <div class=\"deck-interaction-zone\">\n          <div class=\"vinyl-container\">\n            <div class=\"vinyl-platter\" id=\"platter-b\">\n              <div class=\"vinyl-marker\"><\/div>\n            <\/div>\n          <\/div>\n          <div class=\"pitch-container\">\n            <label>PITCH<\/label>\n            <input type=\"range\" class=\"vertical-range pitch-slider\" id=\"pitch-b\" min=\"100\" max=\"140\" step=\"0.1\" value=\"120\">\n          <\/div>\n        <\/div>\n        <button class=\"deck-btn play\" id=\"btn-play-b\">PLAY<\/button>\n      <\/div>\n    <\/div>\n\n    <!-- HUDEBN\u00cd KNIHOVNA -->\n    <div class=\"music-browser\">\n      <div class=\"browser-header\">HIGH-FIDELITY AUDIO LIBRARY<\/div>\n      <table class=\"track-table\">\n        <thead>\n          <tr>\n            <th>N\u00e1zev skladby<\/th>\n            <th>P\u016fvodn\u00ed BPM<\/th>\n            <th style=\"text-align: right;\">Na\u010d\u00edst do pultu<\/th>\n          <\/tr>\n        <\/thead>\n        <tbody>\n          <tr>\n          <td><span class=\"track-title\">Thc MESSING-Live<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"119.659\">119.659 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/SUBTHUNDER-AGL0032T.mp3\" data-title=\"THC MESSING-Live\" data-bpm=\"119.659\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/SUBTHUNDER-AGL0032T.mp3\" data-title=\"ThcMESSING-Live\" data-bpm=\"119.659\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n          <td><span class=\"track-title\">Thc MESSING-AGL102<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"131.625\">131.625 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Thc-Messing-AGL002B2.mp3\" data-title=\"THC MESSING-AGL102\" data-bpm=\"131.625\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Thc-Messing-AGL002B2.mp3\" data-title=\"ThcMESSING-102\" data-bpm=\"131.625\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n          <td><span class=\"track-title\">Thc MESSING-AGL027<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"117\">117 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/AGL0027MP3.mp3\" data-title=\"Thc MESSING-AGL027\" data-bpm=\"117\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/AGL0027MP3.mp3\" data-title=\"Thc MESSING-AGL027\" data-bpm=\"117\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n          <td><span class=\"track-title\">Thc MESSING-AGL0025<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"117\">117 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/AGL0025MP3.mp3\" data-title=\"THC MESSING-AGL0025\" data-bpm=\"117\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/AGL0025MP3.mp3\" data-title=\"ThcMESSING-AGL0025\" data-bpm=\"117\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n          <td><span class=\"track-title\">FWS-Healing Vibration<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"119.66\">119.66 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Fox-With-Stock-Healing-Vibrations.mp3\" data-title=\"FWS-Healing Vibrationd\" data-bpm=\"119.66\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Fox-With-Stock-Healing-Vibrations.mp3\" data-title=\"FWS-Healing Vibrationd\" data-bpm=\"119.66\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n          <td><span class=\"track-title\">SUBTHUNDER-Native<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"119.659\">119.659 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Subthunder-Native.mp3\" data-title=\"Subthunder-NATIVE\" data-bpm=\"119.659\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Subthunder-Native.mp3\" data-title=\"Subthunder-Native\" data-bpm=\"119.659\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n          <td><span class=\"track-title\">FWS-AGL101<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"131.625\">131.625 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Fox-With-Stock-AGL002B1.mp3\" data-title=\"FWS-AGL101\" data-bpm=\"131.625\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Fox-With-Stock-AGL002B1.mp3\" data-title=\"FWS-AGL101\" data-bpm=\"131.625\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n            <td><span class=\"track-title\">Thc MESSING-AGL102<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"131.625\">131.625 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Thc-Messing-AGL002B2.mp3\" data-title=\"THC MESSING-AGL102\" data-bpm=\"131.625\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Thc-Messing-AGL002B2.mp3\" data-title=\"ThcMESSING-102\" data-bpm=\"131.625\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n            <td><span class=\"track-title\">THC MESSIN-Clearness<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"117\">117 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Thc-Messing-Clearness.mp3\" data-title=\"Thc Messing -Clearness\" data-bpm=\"117\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"https:\/\/dubtechno.co\/wp-content\/uploads\/2026\/05\/Thc-Messing-Clearness.mp3\" data-title=\"Thc MESSING-Clearness\" data-bpm=\"117\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n          <tr>\n            <td><span class=\"track-title\">Dj-Trava-BetterChange<\/span><\/td>\n            <td><span class=\"track-bpm\" data-bpm=\"117\">117 BPM<\/span><\/td>\n            <td style=\"text-align: right;\">\n              <!-- OPRAVEN\u00c1 URL ADRESA PRO SKLADBU (Relativn\u00ed cesta) -->\n              <button class=\"load-btn load-a\" data-deck=\"a\" data-url=\"\/wp-content\/uploads\/2026\/05\/Dj-Trava-BetterChange.mp3\" data-title=\"Dj-Trava-BetterChange\" data-bpm=\"117\">Na\u010d\u00edst do A<\/button>\n              <button class=\"load-btn load-b\" data-deck=\"b\" data-url=\"\/wp-content\/uploads\/2026\/05\/Dj-Trava-BetterChange.mp3\" data-title=\"Dj-Trava-BetterChange\" data-bpm=\"117\">Na\u010d\u00edst do B<\/button>\n            <\/td>\n          <\/tr>\n        <\/tbody>\n      <\/table>\n    <\/div>\n  <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>DJ MIX \u2022 AGL TRACK DECK A \u017d\u00e1dn\u00e1 p\u00edsni\u010dka &#8211;.- BPM PITCH PLAY DSP MIXER FILTER A LPFHPF FILTER B LPFHPF CROSSFADER ACENTERB DECK B \u017d\u00e1dn\u00e1 p\u00edsni\u010dka &#8211;.- BPM PITCH PLAY HIGH-FIDELITY AUDIO LIBRARY N\u00e1zev skladby P\u016fvodn\u00ed BPM Na\u010d\u00edst do pultu Thc MESSING-Live 119.659 BPM Na\u010d\u00edst do A Na\u010d\u00edst do B Thc MESSING-AGL102 131.625 BPM [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","footnotes":""},"class_list":["post-375","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"woocommerce_thumbnail":false,"woocommerce_single":false,"woocommerce_gallery_thumbnail":false,"audioigniter_cover":false},"uagb_author_info":{"display_name":"subthunder","author_link":"https:\/\/dubtechno.co\/?author=1"},"uagb_comment_info":0,"uagb_excerpt":"DJ MIX \u2022 AGL TRACK DECK A \u017d\u00e1dn\u00e1 p\u00edsni\u010dka &#8211;.- BPM PITCH PLAY DSP MIXER FILTER A LPFHPF FILTER B LPFHPF CROSSFADER ACENTERB DECK B \u017d\u00e1dn\u00e1 p\u00edsni\u010dka &#8211;.- BPM PITCH PLAY HIGH-FIDELITY AUDIO LIBRARY N\u00e1zev skladby P\u016fvodn\u00ed BPM Na\u010d\u00edst do pultu Thc MESSING-Live 119.659 BPM Na\u010d\u00edst do A Na\u010d\u00edst do B Thc MESSING-AGL102 131.625 BPM&hellip;","_links":{"self":[{"href":"https:\/\/dubtechno.co\/index.php?rest_route=\/wp\/v2\/pages\/375","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dubtechno.co\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dubtechno.co\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dubtechno.co\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dubtechno.co\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=375"}],"version-history":[{"count":61,"href":"https:\/\/dubtechno.co\/index.php?rest_route=\/wp\/v2\/pages\/375\/revisions"}],"predecessor-version":[{"id":645,"href":"https:\/\/dubtechno.co\/index.php?rest_route=\/wp\/v2\/pages\/375\/revisions\/645"}],"wp:attachment":[{"href":"https:\/\/dubtechno.co\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=375"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}