{"id":150,"date":"2016-12-23T11:59:41","date_gmt":"2016-12-23T19:59:41","guid":{"rendered":"http:\/\/deftek.net\/?p=150"},"modified":"2025-11-27T12:45:11","modified_gmt":"2025-11-27T20:45:11","slug":"trillbrix","status":"publish","type":"post","link":"https:\/\/deftek.net\/?p=150","title":{"rendered":"Trillbrix"},"content":{"rendered":"\n<figure class=\"wp-block-image\"><a href=\"http:\/\/deftek.net\/wp-content\/uploads\/2016\/12\/15683570_10154306111108865_880487649_n.jpg\" rel=\"attachment wp-att-151\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"300\" src=\"http:\/\/deftek.net\/wp-content\/uploads\/2016\/12\/15683570_10154306111108865_880487649_n-300x300.jpg\" alt=\"15683570_10154306111108865_880487649_n\" class=\"wp-image-151\" srcset=\"https:\/\/deftek.net\/wp-content\/uploads\/2016\/12\/15683570_10154306111108865_880487649_n-300x300.jpg 300w, https:\/\/deftek.net\/wp-content\/uploads\/2016\/12\/15683570_10154306111108865_880487649_n-150x150.jpg 150w, https:\/\/deftek.net\/wp-content\/uploads\/2016\/12\/15683570_10154306111108865_880487649_n.jpg 600w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/figure>\n\n\n        <div id=\"mp3-player-69e1f9b8ddff1\" class=\"mp3-directory-player\">\n            <div class=\"player-container\">\n                <canvas id=\"mp3-player-69e1f9b8ddff1-canvas\" class=\"visualizer\"><\/canvas>\n                <div class=\"player-controls\">\n                    <div class=\"current-track\">No track selected<\/div>\n                    <div class=\"control-buttons\">\n                        <button class=\"btn-prev\" title=\"Previous\">\u23ee<\/button>\n                        <button class=\"btn-play\" title=\"Play\">\u25b6<\/button>\n                        <button class=\"btn-next\" title=\"Next\">\u23ed<\/button>\n                    <\/div>\n                    <div class=\"progress-container\">\n                        <div class=\"time-display\">\n                            <span class=\"current-time\">0:00<\/span>\n                            <span class=\"duration\">0:00<\/span>\n                        <\/div>\n                        <input type=\"range\" class=\"progress-bar\" min=\"0\" max=\"100\" value=\"0\">\n                    <\/div>\n                    <div class=\"volume-container\">\n                        <span class=\"volume-icon\">\ud83d\udd0a<\/span>\n                        <input type=\"range\" class=\"volume-bar\" min=\"0\" max=\"100\" value=\"70\">\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <div class=\"playlist\">\n                <ul class=\"track-list\">\n                                            <li class=\"track-item\" data-index=\"0\" data-url=\"https:\/\/deftek.net\/tendo\/mp3\/DJ%20Tendo%20-%20Trillbrix\/dj_tendo-trillbrix.mp3\">\n                            <span class=\"track-number\">1<\/span>\n                            <span class=\"track-name\">Dj Tendo Trillbrix<\/span>\n                            <span class=\"track-duration\">--:--<\/span>\n                            <a href=\"https:\/\/deftek.net\/tendo\/mp3\/DJ%20Tendo%20-%20Trillbrix\/dj_tendo-trillbrix.mp3\" download class=\"track-download\" title=\"Download\">\u2b07<\/a>\n                        <\/li>\n                                    <\/ul>\n            <\/div>\n        <\/div>\n        \n        <style>\n            .mp3-directory-player {\n                font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n                max-width: 800px;\n                margin: 20px auto;\n                background: #2c3e50;\n                border-radius: 12px;\n                padding: 20px;\n                box-shadow: 0 10px 40px rgba(0,0,0,0.3);\n            }\n            \n            .player-container {\n                background: #34495e;\n                border-radius: 8px;\n                padding: 20px;\n                margin-bottom: 20px;\n            }\n            \n            .visualizer {\n                width: 100%;\n                height: 120px;\n                border-radius: 8px;\n                background: rgba(0,0,0,0.3);\n                margin-bottom: 15px;\n            }\n            \n            .current-track {\n                color: white;\n                font-size: 18px;\n                font-weight: 600;\n                margin-bottom: 15px;\n                text-align: center;\n                text-shadow: 0 2px 4px rgba(0,0,0,0.3);\n            }\n            \n            .control-buttons {\n                display: flex;\n                justify-content: center;\n                gap: 15px;\n                margin-bottom: 15px;\n            }\n            \n            .control-buttons button {\n                background: #3498db;\n                border: none;\n                color: white;\n                font-size: 20px;\n                width: 50px;\n                height: 50px;\n                border-radius: 6px;\n                cursor: pointer;\n                transition: all 0.3s ease;\n                box-shadow: 0 4px 6px rgba(0,0,0,0.3);\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                line-height: 1;\n            }\n            \n            .control-buttons button:hover {\n                background: #2980b9;\n                transform: translateY(-2px);\n                box-shadow: 0 6px 8px rgba(0,0,0,0.4);\n            }\n            \n            .control-buttons button:active {\n                transform: translateY(0);\n                box-shadow: 0 2px 4px rgba(0,0,0,0.3);\n            }\n            \n            .btn-play {\n                width: 60px;\n                height: 60px;\n                font-size: 24px;\n                background: #e74c3c;\n            }\n            \n            .btn-play:hover {\n                background: #c0392b;\n            }\n            \n            .progress-container {\n                margin-bottom: 10px;\n            }\n            \n            .time-display {\n                display: flex;\n                justify-content: space-between;\n                color: rgba(255,255,255,0.8);\n                font-size: 12px;\n                margin-bottom: 5px;\n            }\n            \n            .progress-bar, .volume-bar {\n                width: 100%;\n                height: 6px;\n                -webkit-appearance: none;\n                appearance: none;\n                background: rgba(255,255,255,0.2);\n                border-radius: 3px;\n                outline: none;\n            }\n            \n            .progress-bar::-webkit-slider-thumb, .volume-bar::-webkit-slider-thumb {\n                -webkit-appearance: none;\n                appearance: none;\n                width: 16px;\n                height: 16px;\n                background: #3498db;\n                border-radius: 50%;\n                cursor: pointer;\n                box-shadow: 0 2px 4px rgba(0,0,0,0.3);\n            }\n            \n            .volume-container {\n                display: flex;\n                align-items: center;\n                gap: 10px;\n            }\n            \n            .volume-icon {\n                font-size: 20px;\n            }\n            \n            .volume-bar {\n                width: 100px;\n            }\n            \n            .playlist {\n                background: rgba(255,255,255,0.95);\n                border-radius: 8px;\n                padding: 15px;\n            }\n            \n            .track-list {\n                list-style: none;\n                padding: 0;\n                margin: 0;\n                max-height: 300px;\n                overflow-y: auto;\n            }\n            \n            .track-item {\n                display: flex;\n                align-items: center;\n                padding: 10px;\n                margin-bottom: 5px;\n                border-radius: 6px;\n                cursor: pointer;\n                transition: background 0.2s;\n            }\n            \n            .track-item:hover {\n                background: #3498db;\n                color: white;\n            }\n            \n            .track-item.active {\n                background: #2980b9;\n                color: white;\n                font-weight: 600;\n            }\n            \n            .track-item.active .track-number,\n            .track-item.active .track-duration,\n            .track-item:hover .track-number,\n            .track-item:hover .track-duration {\n                color: rgba(255,255,255,0.9);\n            }\n            \n            .track-number {\n                width: 30px;\n                color: #666;\n                font-size: 14px;\n            }\n            \n            .track-name {\n                flex: 1;\n                color: #333;\n            }\n            \n            .track-duration {\n                color: #999;\n                font-size: 14px;\n                margin-right: 10px;\n            }\n            \n            .track-download {\n                color: #3498db;\n                text-decoration: none;\n                font-size: 18px;\n                padding: 5px 10px;\n                border-radius: 4px;\n                transition: all 0.2s;\n                display: flex;\n                align-items: center;\n                justify-content: center;\n            }\n            \n            .track-download:hover {\n                background: #3498db;\n                color: white;\n            }\n            \n            .track-item:hover .track-download {\n                color: white;\n            }\n            \n            .track-item:hover .track-download:hover {\n                background: rgba(255,255,255,0.2);\n            }\n        <\/style>\n        \n        <script>\n        (function() {\n            const player = document.getElementById('mp3-player-69e1f9b8ddff1');\n            const canvas = player.querySelector('.visualizer');\n            const ctx = canvas.getContext('2d');\n            const playBtn = player.querySelector('.btn-play');\n            const prevBtn = player.querySelector('.btn-prev');\n            const nextBtn = player.querySelector('.btn-next');\n            const progressBar = player.querySelector('.progress-bar');\n            const volumeBar = player.querySelector('.volume-bar');\n            const currentTimeEl = player.querySelector('.current-time');\n            const durationEl = player.querySelector('.duration');\n            const currentTrackEl = player.querySelector('.current-track');\n            const trackItems = player.querySelectorAll('.track-item');\n            \n            let audio = new Audio();\n            let currentTrackIndex = -1;\n            let audioContext, analyser, source, dataArray;\n            let isPlaying = false;\n            \n            \/\/ Set canvas size\n            canvas.width = canvas.offsetWidth;\n            canvas.height = canvas.offsetHeight;\n            \n            \/\/ Initialize audio context for visualization\n            function initAudioContext() {\n                if (!audioContext) {\n                    audioContext = new (window.AudioContext || window.webkitAudioContext)();\n                    analyser = audioContext.createAnalyser();\n                    analyser.fftSize = 256;\n                    \n                    source = audioContext.createMediaElementSource(audio);\n                    source.connect(analyser);\n                    analyser.connect(audioContext.destination);\n                    \n                    const bufferLength = analyser.frequencyBinCount;\n                    dataArray = new Uint8Array(bufferLength);\n                }\n            }\n            \n            \/\/ Visualization animation\n            function visualize() {\n                requestAnimationFrame(visualize);\n                \n                if (!analyser) return;\n                \n                analyser.getByteFrequencyData(dataArray);\n                \n                ctx.fillStyle = 'rgba(0, 0, 0, 0.3)';\n                ctx.fillRect(0, 0, canvas.width, canvas.height);\n                \n                const barWidth = (canvas.width \/ dataArray.length) * 2;\n                let x = 0;\n                \n                for (let i = 0; i < dataArray.length; i++) {\n                    const barHeight = (dataArray[i] \/ 255) * canvas.height;\n                    \n                    \/\/ Solid blue bars\n                    ctx.fillStyle = '#3498db';\n                    ctx.fillRect(x, canvas.height - barHeight, barWidth, barHeight);\n                    \n                    x += barWidth + 1;\n                }\n            }\n            \n            visualize();\n            \n            \/\/ Format time\n            function formatTime(seconds) {\n                const mins = Math.floor(seconds \/ 60);\n                const secs = Math.floor(seconds % 60);\n                return `${mins}:${secs.toString().padStart(2, '0')}`;\n            }\n            \n            \/\/ Load track\n            function loadTrack(index) {\n                if (index < 0 || index >= trackItems.length) return;\n                \n                const track = trackItems[index];\n                const url = track.dataset.url;\n                const name = track.querySelector('.track-name').textContent;\n                \n                audio.src = url;\n                currentTrackIndex = index;\n                currentTrackEl.textContent = name;\n                \n                \/\/ Update active state\n                trackItems.forEach(item => item.classList.remove('active'));\n                track.classList.add('active');\n                \n                \/\/ Load metadata\n                audio.addEventListener('loadedmetadata', function() {\n                    durationEl.textContent = formatTime(audio.duration);\n                    track.querySelector('.track-duration').textContent = formatTime(audio.duration);\n                }, { once: true });\n            }\n            \n            \/\/ Play\/Pause\n            function togglePlay() {\n                if (currentTrackIndex === -1) {\n                    loadTrack(0);\n                }\n                \n                initAudioContext();\n                \n                if (isPlaying) {\n                    audio.pause();\n                    playBtn.textContent = '\u25b6';\n                } else {\n                    audio.play();\n                    playBtn.textContent = '\u23f8';\n                }\n                isPlaying = !isPlaying;\n            }\n            \n            \/\/ Event listeners\n            playBtn.addEventListener('click', togglePlay);\n            \n            prevBtn.addEventListener('click', () => {\n                const newIndex = currentTrackIndex - 1;\n                if (newIndex >= 0) {\n                    loadTrack(newIndex);\n                    if (isPlaying) audio.play();\n                }\n            });\n            \n            nextBtn.addEventListener('click', () => {\n                const newIndex = currentTrackIndex + 1;\n                if (newIndex < trackItems.length) {\n                    loadTrack(newIndex);\n                    if (isPlaying) audio.play();\n                }\n            });\n            \n            audio.addEventListener('timeupdate', () => {\n                if (audio.duration) {\n                    const progress = (audio.currentTime \/ audio.duration) * 100;\n                    progressBar.value = progress;\n                    currentTimeEl.textContent = formatTime(audio.currentTime);\n                }\n            });\n            \n            audio.addEventListener('ended', () => {\n                const nextIndex = currentTrackIndex + 1;\n                if (nextIndex < trackItems.length) {\n                    loadTrack(nextIndex);\n                    audio.play();\n                } else {\n                    isPlaying = false;\n                    playBtn.textContent = '\u25b6';\n                }\n            });\n            \n            progressBar.addEventListener('input', () => {\n                const time = (progressBar.value \/ 100) * audio.duration;\n                audio.currentTime = time;\n            });\n            \n            volumeBar.addEventListener('input', () => {\n                audio.volume = volumeBar.value \/ 100;\n            });\n            \n            \/\/ Set initial volume\n            audio.volume = 0.7;\n            \n            \/\/ Track item clicks\n            trackItems.forEach((item, index) => {\n                item.addEventListener('click', (e) => {\n                    \/\/ Don't play if clicking the download button\n                    if (e.target.classList.contains('track-download')) {\n                        return;\n                    }\n                    loadTrack(index);\n                    if (!isPlaying) togglePlay();\n                });\n            });\n            \n            \/\/ Autoplay first track\n            if (trackItems.length > 0) {\n                loadTrack(0);\n                initAudioContext();\n                audio.play().then(() => {\n                    isPlaying = true;\n                    playBtn.textContent = '\u23f8';\n                }).catch(err => {\n                    \/\/ Autoplay blocked by browser, user will need to click play\n                    console.log('Autoplay prevented:', err);\n                });\n            }\n        })();\n        <\/script>\n        \n\n\n\n<p>Format: 320kbps mp3<br>\nOriginal Release:&nbsp;2016<\/p>\n\n\n\n<p><a href=\"https:\/\/www.discogs.com\/Deru-Say-Goodbye-To-Useless\/master\/305918\" target=\"_blank\">deru &#8211; i would like<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Dirty-Art-Club-Vermilion\/release\/4480212\" target=\"_blank\">dirty art club &#8211; hemlock<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Kourosh-Yaghmaei-Gole-Yakh-Del-Dareh-Pir-Misheh\/release\/3449187\" target=\"_blank\">kourosh yaghmael &#8211; gole yak<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/RIVKA-Faded\/release\/4655873\" target=\"_blank\">rivka &#8211; drift<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Sweet-Valley-Eternal-Champ\/release\/4145540\" target=\"_blank\">sweet valley &#8211; eternal champ<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Deaths-Dynamic-Shroudwmv-Ill-Try-Living-Like-This\/master\/841495\" target=\"_blank\">death&#8217;s dynamic shroud &#8211; i&#8217;ll try living like this<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Lockah-Only-Built-4-Neon-Nites\/release\/4626422\" target=\"_blank\">lockah &#8211; platinum blonde<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/My-Brightest-Diamond-A-Thousand-Sharks-Teeth\/master\/71107\" target=\"_blank\">my brightest diamond &#8211; to pluto&#8217;s moon<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Groundislava-Frozen-Throne\/master\/765246\" target=\"_blank\">groundislava &#8211; the descent<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Burial-Young-Death-Nightmarket\/release\/9412422\" target=\"_blank\">burial &#8211; nightmarket<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Balam-Acab-Wander-Wonder\/master\/364275\" target=\"_blank\">balam acab &#8211; apart<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Arca-Stretch-2\/master\/472196\" target=\"_blank\">arca &#8211; manners<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Navvi-Omni\/release\/8962821\" target=\"_blank\">navvi &#8211; polychrome<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Disasterpeace-Hyper-Light-Drifter\/master\/1030698\" target=\"_blank\">disasterpeace &#8211; vignette: visions<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/DJ-Shadow-The-Mountain-Will-Fall\/master\/1019338\" target=\"_blank\">dj shadow &#8211; the mountain will fall<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Kuedo-Slow-Knife\/master\/1077037\" target=\"_blank\">kuedo &#8211; in your sleep<\/a><br>\n<a href=\"https:\/\/www.discogs.com\/Oneohtrix-Point-Never-Replica\/master\/383751\" target=\"_blank\">oneohtrix point never, daniel lopatin &#8211; submersible<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Format: 320kbps mp3 Original Release:&nbsp;2016 deru &#8211; i would like dirty art club &#8211; hemlock kourosh yaghmael &#8211; gole yak rivka &#8211; drift sweet valley &#8211; eternal champ death&#8217;s dynamic shroud &#8211; i&#8217;ll try living like this lockah &#8211; platinum blonde my brightest diamond &#8211; to pluto&#8217;s moon groundislava &#8211; the descent burial &#8211; nightmarket [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":154,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-150","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tendoboxen"],"_links":{"self":[{"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts\/150","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=150"}],"version-history":[{"count":5,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts\/150\/revisions"}],"predecessor-version":[{"id":294,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts\/150\/revisions\/294"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/media\/154"}],"wp:attachment":[{"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=150"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=150"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}