{"id":205,"date":"2020-02-21T11:14:14","date_gmt":"2020-02-21T19:14:14","guid":{"rendered":"http:\/\/deftek.net\/?p=205"},"modified":"2025-11-27T12:49:43","modified_gmt":"2025-11-27T20:49:43","slug":"oversaturation-part-three-transhumanism","status":"publish","type":"post","link":"https:\/\/deftek.net\/?p=205","title":{"rendered":"OVERSATURATION Part Three: Transhumanism"},"content":{"rendered":"<ol style=\"margin-left: .375in; direction: ltr; unicode-bidi: embed; margin-top: 0in; margin-bottom: 0in; font-family: Calibri; font-size: 11.0pt; font-weight: normal; font-style: normal;\" type=\"1\">\n        <div id=\"mp3-player-69e318009226d\" class=\"mp3-directory-player\">\n            <div class=\"player-container\">\n                <canvas id=\"mp3-player-69e318009226d-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-%20Oversaturation%20Part%20Three%20-%20Transhumanism\/dj_tendo-transhumanism(oversaturation_part_three).mp3\">\n                            <span class=\"track-number\">1<\/span>\n                            <span class=\"track-name\">Dj Tendo Transhumanism(oversaturation Part Three)<\/span>\n                            <span class=\"track-duration\">--:--<\/span>\n                            <a href=\"https:\/\/deftek.net\/tendo\/mp3\/DJ%20Tendo%20-%20Oversaturation%20Part%20Three%20-%20Transhumanism\/dj_tendo-transhumanism(oversaturation_part_three).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-69e318009226d');\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        <\/p>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\" value=\"1\"><span style=\"font-family: Calibri; font-size: 11.0pt; font-weight: normal; font-style: normal;\">Bladerunner &#8211; Main Titles<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Jj &#8211; Still<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Flying Lotus &#8211; Zodiac Shit<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Mini Mansions &#8211; Kiddie Hypnogogia<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Emika &#8211; Pretend<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Christ. &#8211; Balaam<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">James Blake &#8211; I Mind<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Altered Natives &#8211; Strings Of Altered<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Kavinsky &#8211; Nightcall (Feat. Lovefoxxx)<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Com Truise &#8211; Norkuy<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Nero &#8211; Reaching Out<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Neon Indian &#8211; Sleep Paralysist (Com Truise &#8216;Eyelid&#8217; Remix)<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">J Dilla &#8211; Reality TV (Featuring Black Thought)<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Novisad &#8211; Sommersonnenschein<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Autechre &#8211; Eutow<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Bersarin Quartett &#8211; Inversion<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Zero 7 Feat. MF Doom &#8211; Somersault (Danger Mouse Remix)<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">SLEEP \u221e OVER &#8211; Your World Is Night<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Rednose Distrikt &#8211; N.Y. Boom (Sneeze-A-Pella)<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Scuba &#8211; Twitch (Jamie Vex&#8217;d Remix)<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">King Tubby &#8211; Lambs Bread Herb<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">Paavoharju &#8211; Sumuvirsi<\/span><\/li>\n<li style=\"margin-top: 0; margin-bottom: 0; vertical-align: middle;\"><span style=\"font-family: Calibri; font-size: 11.0pt;\">DJ Food &#8211; The Sky At Night<\/span><\/li>\n<\/ol>\n<p><a class=\"hoverZoomLink\" href=\"http:\/\/deftek.net\/wp-content\/uploads\/2020\/02\/dj_tendo-transhumanismoversaturation_part_three.jpg\" rel=\"attachment wp-att-206\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-206 hoverZoomLink\" src=\"http:\/\/deftek.net\/wp-content\/uploads\/2020\/02\/dj_tendo-transhumanismoversaturation_part_three-300x300.jpg\" alt=\"dj_tendo-transhumanism(oversaturation_part_three)\" width=\"300\" height=\"300\" srcset=\"https:\/\/deftek.net\/wp-content\/uploads\/2020\/02\/dj_tendo-transhumanismoversaturation_part_three-300x300.jpg 300w, https:\/\/deftek.net\/wp-content\/uploads\/2020\/02\/dj_tendo-transhumanismoversaturation_part_three-150x150.jpg 150w, https:\/\/deftek.net\/wp-content\/uploads\/2020\/02\/dj_tendo-transhumanismoversaturation_part_three-768x768.jpg 768w, https:\/\/deftek.net\/wp-content\/uploads\/2020\/02\/dj_tendo-transhumanismoversaturation_part_three.jpg 800w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<div id=\"hzImg\" style=\"border: 1px solid #ffffff; line-height: 0; overflow: hidden; padding: 2px; margin: 0px; position: absolute; z-index: 2147483647; border-radius: 3px; box-shadow: rgba(0, 0, 0, 0.33) 3px 3px 9px 5px; opacity: 1; top: 96px; left: 0px; background-color: #ffffff; cursor: pointer; pointer-events: none; display: none;\"><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Bladerunner &#8211; Main Titles Jj &#8211; Still Flying Lotus &#8211; Zodiac Shit Mini Mansions &#8211; Kiddie Hypnogogia Emika &#8211; Pretend Christ. &#8211; Balaam James Blake &#8211; I Mind Altered Natives &#8211; Strings Of Altered Kavinsky &#8211; Nightcall (Feat. Lovefoxxx) Com Truise &#8211; Norkuy Nero &#8211; Reaching Out Neon Indian &#8211; Sleep Paralysist (Com Truise &#8216;Eyelid&#8217; [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":206,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,3],"tags":[],"class_list":["post-205","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-oversaturation","category-tendoboxen"],"_links":{"self":[{"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts\/205","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=205"}],"version-history":[{"count":4,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts\/205\/revisions"}],"predecessor-version":[{"id":297,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/posts\/205\/revisions\/297"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=\/wp\/v2\/media\/206"}],"wp:attachment":[{"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=205"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=205"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/deftek.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=205"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}