{"id":620,"date":"2026-01-29T01:29:45","date_gmt":"2026-01-29T01:29:45","guid":{"rendered":"https:\/\/thevioletfrequency.com\/?page_id=620"},"modified":"2026-02-28T02:45:07","modified_gmt":"2026-02-28T02:45:07","slug":"musica","status":"publish","type":"page","link":"https:\/\/thevioletfrequency.com\/en\/musica\/","title":{"rendered":"Music"},"content":{"rendered":"<div class=\"et_pb_section_0 et_pb_section et_section_regular et_flex_section\">\n<div class=\"et_pb_row_0 et_pb_row et_flex_row\">\n<div class=\"et_pb_column_0 et_pb_column et-last-child et_flex_column et_pb_css_mix_blend_mode_passthrough et_flex_column_24_24 et_flex_column_24_24_tablet et_flex_column_24_24_phone\">\n\n<\/div>\n<\/div>\n\n<div class=\"et_pb_row_1 et_pb_row et_flex_row\">\n<div class=\"et_pb_column_1 et_pb_column et-last-child et_flex_column et_pb_css_mix_blend_mode_passthrough et_flex_column_24_24 et_flex_column_24_24_tablet et_flex_column_24_24_phone\">\n\n<\/div>\n<\/div>\n\n<div class=\"et_pb_row_2 et_pb_row et_flex_row\">\n<div class=\"et_pb_column_2 et_pb_column et-last-child et_flex_column et_pb_css_mix_blend_mode_passthrough et_flex_column_24_24 et_flex_column_24_24_tablet et_flex_column_24_24_phone\">\n<div class=\"et_pb_code_2 et_pb_code et_pb_module\"><div class=\"et_pb_code_inner\"><div class=\"vf-musicpage\" id=\"vfMusicPage\">\n\n  <!-- HERO \/ HEADER -->\n  <header class=\"vf-hero\">\n    <div class=\"vf-hero-title\"><\/div>\n    <div class=\"vf-hero-sub\">Tria un \u00e0lbum per carregar el reproductor<\/div>\n  <\/header>\n\n  <!-- HORIZONTAL ALBUM CAROUSEL -->\n  <section class=\"vf-carousel-wrap\">\n    <div class=\"vf-carousel\" id=\"vfCarousel\" aria-label=\"Album carousel\"><\/div>\n    <div class=\"vf-carousel-hint\">Scroll \u2192<\/div>\n  <\/section>\n\n  <!-- PLAYER -->\n  <section class=\"vf-player2\" id=\"vfPlayer\">\n\n    <!-- \u2705 SOLO COVER + TEXTOS (en m\u00f3vil a la derecha, en desktop como antes) -->\n    <div class=\"vf-head2\">\n      <img class=\"vf-cover2\" id=\"vfCover\" alt=\"Cover\">\n\n      <div class=\"vf-headmeta2\">\n        <div class=\"vf-album2\" id=\"vfAlbum\">\u2014<\/div>\n        <div class=\"vf-band2\" id=\"vfBand\">\u2014<\/div>\n\n        <div class=\"vf-now2\">\n          <div class=\"vf-nowlbl2\">Reproduint<\/div>\n          <div class=\"vf-tracktitle2\" id=\"vfTrackTitle\">Selecciona una can\u00e7\u00f3<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2705 TODO LO DEM\u00c1S ABAJO (wave + controles) -->\n    <div class=\"vf-body2\">\n      <canvas class=\"vf-wave2\" id=\"vfWave\"><\/canvas>\n\n      <div class=\"vf-controls2\">\n        <button class=\"vf-btn2 vf-prev\" type=\"button\">\u23ee<\/button>\n\n        <div class=\"vf-playwrap2\">\n          <button class=\"vf-btn2 vf-play\" type=\"button\" aria-label=\"Play \/ Pause\">\u25b6<\/button>\n          <div class=\"vf-waves2\" aria-hidden=\"true\">\n            <i><\/i><i><\/i><i><\/i><i><\/i><i><\/i>\n          <\/div>\n        <\/div>\n\n        <button class=\"vf-btn2 vf-next\" type=\"button\">\u23ed<\/button>\n\n        <div class=\"vf-progresswrap2\">\n          <span class=\"vf-time2 vf-current\">0:00<\/span>\n          <div class=\"vf-progress2\" id=\"vfProgress\"><div class=\"vf-bar2\" id=\"vfBar\"><\/div><\/div>\n          <span class=\"vf-time2 vf-duration\">0:00<\/span>\n        <\/div>\n\n        <div class=\"vf-volwrap2\">\n          \ud83d\udd0a <input type=\"range\" class=\"vf-vol2\" id=\"vfVolume\" min=\"0\" max=\"1\" step=\"0.01\" value=\"0.8\">\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- PLAYLIST (3 visibles + scroll resto) -->\n    <div class=\"vf-playlist2\" id=\"vfPlaylist\"><\/div>\n\n    <!-- LINKS (AL FINAL) -->\n    <div class=\"vf-links2\" id=\"vfLinks\">\n      <div class=\"vf-links2-title\">Escolta a:<\/div>\n      <div class=\"vf-links2-row\" id=\"vfLinksGrid\" aria-label=\"Platform links\"><\/div>\n    <\/div>\n\n    <audio class=\"vf-audio\" id=\"vfAudio\" crossorigin=\"anonymous\"><\/audio>\n  <\/section>\n<\/div>\n\n<style>\n\/* ========= EDITORIAL \/ MUSE-LIKE ========= *\/\n.vf-musicpage{\n  --bg:#07070a;\n  --text:#ffffff;\n  --muted:rgba(255,255,255,.68);\n  --stroke:rgba(255,255,255,.14);\n\n  max-width:1100px;\n  margin:0 auto;\n  padding:18px 10px 30px;\n  font-family:Inter,system-ui,sans-serif;\n  color:var(--text);\n}\n\n.vf-hero{padding:6px 2px 14px}\n.vf-hero-title{font-size:1.2rem;font-weight:900;letter-spacing:.02em}\n.vf-hero-sub{margin-top:4px;font-size:.78rem;color:var(--muted)}\n\n\/* ========= CAROUSEL ========= *\/\n.vf-carousel-wrap{position:relative;margin:10px 0 18px}\n.vf-carousel{\n  display:flex;\n  gap:14px;\n  overflow:auto;\n  padding:10px 2px 14px;\n  scroll-snap-type:x mandatory;\n  -webkit-overflow-scrolling:touch;\n}\n.vf-carousel::-webkit-scrollbar{height:10px}\n.vf-carousel::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}\n.vf-carousel::-webkit-scrollbar-track{background:transparent}\n.vf-carousel-hint{\n  position:absolute; right:8px; top:-6px;\n  font-size:.62rem; letter-spacing:.18em; text-transform:uppercase;\n  color:rgba(255,255,255,.55);\n  pointer-events:none;\n}\n.vf-albumcard2{scroll-snap-align:start; flex:0 0 180px; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:.18s ease;}\n@media(max-width:600px){ .vf-albumcard2{flex-basis:150px} }\n.vf-thumb2{\n  width:100%; aspect-ratio:1\/1; border-radius:0; object-fit:cover; display:block;\n  box-shadow:0 16px 34px rgba(0,0,0,.45);\n  border:1px solid rgba(255,255,255,.10);\n}\n.vf-albmeta2{margin-top:8px}\n.vf-albname2{font-size:.78rem;font-weight:850;line-height:1.15}\n.vf-albband2{font-size:.64rem;color:var(--muted);margin-top:2px;line-height:1.2}\n.vf-albumcard2:hover{transform:translateY(-2px)}\n.vf-albumcard2.active .vf-thumb2{border-color:rgba(255,255,255,.32); box-shadow:0 18px 40px rgba(0,0,0,.55)}\n\n\/* ========= PLAYER ========= *\/\n.vf-player2{border-top:1px solid rgba(255,255,255,.12); padding-top:18px}\n\n\/* \u2705 HEAD: cover + textos *\/\n.vf-head2{\n  display:grid;\n  grid-template-columns:240px 1fr;\n  gap:18px;\n  align-items:end;\n}\n@media(max-width:700px){\n  .vf-head2{\n    grid-template-columns:170px 1fr;\n    gap:12px;\n    align-items:center;\n  }\n}\n@media(max-width:420px){\n  .vf-head2{grid-template-columns:140px 1fr}\n}\n\n.vf-cover2{\n  width:240px;height:240px;\n  border-radius:0;\n  object-fit:cover;\n  box-shadow:0 18px 44px rgba(0,0,0,.55);\n  border:1px solid rgba(255,255,255,.10);\n}\n@media(max-width:700px){ .vf-cover2{width:170px;height:170px} }\n@media(max-width:420px){ .vf-cover2{width:140px;height:140px} }\n\n.vf-headmeta2{display:flex;flex-direction:column;gap:8px; min-width:0;}\n@media(max-width:700px){ .vf-headmeta2{gap:6px} }\n\n\/* \u2705 evita que el t\u00edtulo se salga: clamp + ellipsis *\/\n.vf-album2{\n  font-weight:900; letter-spacing:.01em;\n  font-size:1.05rem;\n  max-width:100%;\n  overflow:hidden;\n  text-overflow:ellipsis;\n  white-space:nowrap;\n}\n@media(max-width:700px){\n  .vf-album2{\n    font-size:clamp(.92rem, 3.8vw, 1.05rem);\n  }\n}\n\n.vf-band2{\n  font-size:.72rem;\n  color:var(--muted);\n  max-width:100%;\n  overflow:hidden;\n  text-overflow:ellipsis;\n  white-space:nowrap;\n}\n@media(max-width:700px){ .vf-band2{font-size:.70rem} }\n\n.vf-now2{margin-top:4px; min-width:0;}\n@media(max-width:700px){ .vf-now2{margin-top:0} }\n\n.vf-nowlbl2{\n  font-size:.6rem;\n  letter-spacing:.18em;\n  text-transform:uppercase;\n  color:rgba(255,255,255,.55);\n}\n.vf-tracktitle2{\n  margin-top:6px;\n  font-size:.82rem;\n  color:rgba(255,255,255,.92);\n  max-width:100%;\n  overflow:hidden;\n  text-overflow:ellipsis;\n  white-space:nowrap;\n}\n@media(max-width:700px){\n  .vf-tracktitle2{\n    margin-top:4px;\n    font-size:clamp(.72rem, 3.2vw, .82rem);\n  }\n}\n\n\/* \u2705 BODY: wave + controles SIEMPRE ABAJO *\/\n.vf-body2{margin-top:12px}\n@media(max-width:700px){ .vf-body2{margin-top:10px} }\n\n.vf-wave2{\n  width:100%;\n  height:54px;\n  border-radius:12px;\n  background:linear-gradient(180deg, rgba(255,255,255,.07), transparent);\n  border:1px solid rgba(255,255,255,.10);\n}\n@media(max-width:700px){ .vf-wave2{height:46px} }\n\n\/* controls *\/\n.vf-controls2{\n  margin-top:10px;\n  display:grid;\n  grid-template-columns:auto auto auto 1fr auto;\n  gap:12px;\n  align-items:center;\n}\n@media(max-width:700px){\n  .vf-controls2{grid-template-columns:auto auto auto 1fr}\n  .vf-volwrap2{display:none}\n}\n\n.vf-btn2{\n  background:transparent;\n  border:1px solid rgba(255,255,255,.18);\n  color:#fff;\n  border-radius:12px;\n  padding:7px 11px;\n  cursor:pointer;\n  font-size:.78rem;\n  transition:.18s ease;\n  -webkit-tap-highlight-color:transparent;\n  outline:none;\n}\n.vf-btn2:hover{background:rgba(255,255,255,.08)}\n.vf-btn2:focus,.vf-btn2:active,.vf-btn2:focus-visible{outline:none;box-shadow:none}\n\n.vf-playwrap2{position:relative;width:46px;height:38px;display:flex;align-items:center;justify-content:center}\n.vf-waves2{\n  position:absolute; inset:-7px;\n  border-radius:999px;\n  opacity:0; pointer-events:none;\n  transform:scale(.86);\n  transition:.25s ease;\n  display:flex; align-items:center; justify-content:center; gap:4px;\n  background:radial-gradient(circle, rgba(255,255,255,.22), rgba(255,255,255,.10) 55%, transparent 75%);\n}\n.vf-player2.is-playing .vf-waves2{opacity:1; transform:scale(1); animation:vfPulse2 2s ease-in-out infinite;}\n@keyframes vfPulse2{0%{box-shadow:0 0 0 0 rgba(255,255,255,.28)}70%{box-shadow:0 0 0 18px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}\n.vf-waves2 i{display:block;width:3px;height:6px;border-radius:999px;background:#fff;animation:vfBeat2 1.1s infinite ease-in-out}\n.vf-waves2 i:nth-child(2){animation-delay:.1s}\n.vf-waves2 i:nth-child(3){animation-delay:.2s}\n.vf-waves2 i:nth-child(4){animation-delay:.3s}\n.vf-waves2 i:nth-child(5){animation-delay:.4s}\n@keyframes vfBeat2{0%,100%{height:5px;opacity:.6}50%{height:13px;opacity:1}}\n\n.vf-progresswrap2{display:flex;align-items:center;gap:8px; min-width:0;}\n.vf-time2{font-size:.64rem;color:rgba(255,255,255,.65)}\n.vf-progress2{\n  flex:1;height:5px;border-radius:999px;overflow:hidden;cursor:pointer;\n  background:rgba(255,255,255,.14);\n  border:1px solid rgba(255,255,255,.10);\n}\n.vf-bar2{height:100%;width:0%;background:linear-gradient(90deg,#fff,#cfcfcf)}\n.vf-volwrap2{display:flex;align-items:center;gap:6px;font-size:.68rem;color:rgba(255,255,255,.7)}\n.vf-vol2{width:80px;height:2px;accent-color:#fff}\n\n\/* ===== PLAYLIST: solo 3 visibles + scroll resto ===== *\/\n.vf-playlist2{\n  margin-top:14px;\n  padding-top:12px;\n  border-top:1px solid rgba(255,255,255,.12);\n}\n.vf-playlist2.is-scroll{\n  max-height:176px;\n  overflow:auto;\n  padding-right:6px;\n}\n.vf-playlist2::-webkit-scrollbar{width:10px}\n.vf-playlist2::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}\n.vf-playlist2::-webkit-scrollbar-track{background:transparent}\n.vf-item2{\n  border:1px solid rgba(255,255,255,.10);\n  background:rgba(255,255,255,.03);\n  border-radius:14px;\n  overflow:hidden;\n  margin-bottom:8px;\n}\n.vf-row2{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px}\n.vf-trackbtn2{\n  flex:1;\n  text-align:left;\n  background:transparent;\n  border:none;\n  color:#fff;\n  font-size:.80rem;\n  cursor:pointer;\n  padding:6px 8px;\n  border-radius:10px;\n  transition:.15s;\n  -webkit-tap-highlight-color:transparent;\n}\n.vf-trackbtn2:hover{background:rgba(255,255,255,.08)}\n.vf-item2.active .vf-trackbtn2{background:rgba(255,255,255,.12);font-weight:800}\n\n\/* ===== LINKS: al final ===== *\/\n.vf-links2{margin-top:14px; padding-top:12px; border-top:1px solid rgba(255,255,255,.12)}\n.vf-links2-title{\n  font-size:.6rem;\n  letter-spacing:.18em;\n  text-transform:uppercase;\n  color:rgba(255,255,255,.6);\n  margin-bottom:10px\n}\n.vf-links2-row{\n  display:flex;\n  gap:10px;\n  overflow:auto;\n  padding:2px 2px 8px;\n  -webkit-overflow-scrolling:touch;\n  scroll-snap-type:x mandatory;\n}\n.vf-links2-row::-webkit-scrollbar{height:10px}\n.vf-links2-row::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}\n.vf-links2-row::-webkit-scrollbar-track{background:transparent}\n.vf-link2{\n  scroll-snap-align:start;\n  flex:0 0 auto;\n  width:42px;height:42px;\n  display:flex;align-items:center;justify-content:center;\n  padding:0;\n  border-radius:14px;\n  background:rgba(255,255,255,.06);\n  border:1px solid rgba(255,255,255,.14);\n  text-decoration:none;\n  transition:.18s ease;\n}\n.vf-link2:hover{background:rgba(255,255,255,.10);transform:translateY(-1px)}\n.vf-link2 img{width:20px;height:20px;object-fit:contain;display:block;background:transparent !important}\n\n\/* ===== FIX tama\u00f1os botones ===== *\/\n.vf-controls2 .vf-btn2{\n  width:40px;height:40px;padding:0;\n  display:flex;align-items:center;justify-content:center;\n  font-size:.78rem;line-height:1;\n}\n@media(max-width:700px){\n  .vf-controls2 .vf-btn2{width:36px;height:36px;font-size:.72rem}\n}\n\n\/* ===== FIX m\u00f3vil grid ===== *\/\n@media(max-width:700px){\n  .vf-controls2{grid-template-columns:36px 36px 36px 1fr; gap:10px}\n  .vf-playwrap2{width:36px !important; height:36px !important}\n  .vf-waves2{ inset:-6px !important; }\n}\n<\/style>\n\n<script>\n(function(){\n  const PLATFORM_ICONS = {\n    spotify:     \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/spotify2.png\",\n    apple:       \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/applemusic4.png\",\n    amazon:      \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/amazonmusic2.png\",\n    youtube:     \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/youtubemusic2.png\",\n    deezer:      \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/Deezer2.png\",\n    tidal:       \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/tidal2.png\",\n    soundcloud:  \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/soundcloud2.png\",\n    bandcamp:    \"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/bandcamp2.png\"\n  };\n\n  const ALBUMS = [\n    {\n      slug:\"the_party_of_mistakes\",\n      album:\"The Party of Mistakes\",\n      band:\"The Violet Frequency\",\n      cover:\"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/TVF-TPOM.jpg\",\n      platforms:[\n        {name:\"Spotify\",      url:\"#\", icon:PLATFORM_ICONS.spotify},\n        {name:\"Apple Music\",  url:\"#\", icon:PLATFORM_ICONS.apple},\n        {name:\"Amazon Music\", url:\"#\", icon:PLATFORM_ICONS.amazon},\n        {name:\"YouTube Music\",url:\"#\", icon:PLATFORM_ICONS.youtube},\n        {name:\"Deezer\",       url:\"#\", icon:PLATFORM_ICONS.deezer},\n        {name:\"Tidal\",        url:\"#\", icon:PLATFORM_ICONS.tidal},\n        {name:\"SoundCloud\",   url:\"#\", icon:PLATFORM_ICONS.soundcloud},\n        {name:\"Bandcamp\",     url:\"#\", icon:PLATFORM_ICONS.bandcamp}\n      ],\n      tracks:[\n        {title:\"01. The Party Of Mistakes\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/1.The-Violet-Frequency-The-Party-of-Mistakes.mp3\"},\n        {title:\"02. Confetty\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/2.The-Violet-Frequency-Confetty.mp3\"},\n        {title:\"03. Look Into Your Eyes\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/3.The-Violet-Frequency-When-I-Look-into-your-eyes.mp3\"},\n        {title:\"04. Therapy\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/4.The-Violet-Frequency-Therapy.mp3\"},\n        {title:\"05. Never Lose Control\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/5.The-Violet-Frequency-Never-lose-control.mp3\"},\n        {title:\"06. Hey Now!!!\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/6.The-Violet-Frequency-Hey-Now-Party-Version.mp3\"},\n        {title:\"07. Pop Corn & Ice\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/7.The-Violet-Frequency-Popcorn-Ice.mp3\"},\n        {title:\"08. Closer\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/8.The-Violet-Frequency-Closer.mp3\"},\n        {title:\"09. Galactic Wave\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/9.The-Violet-Frequency-Galactic-Wave.mp3\"},\n        {title:\"10. Dj & Chips\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/10.The-Violet-Frequency-DJ-Chips.mp3\"},\n        {title:\"11. Sorry Madonna\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/11.The-Violet-Frequency-Sorry-Madona-cover.mp3\"},\n        {title:\"12. Criminal\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/12.The-Violet-Frequency-Criminal.mp3\"},\n        {title:\"13. Fuzz\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/13.The-Violet-Frequency-Fuzz.mp3\"}\n      ]\n    },\n\n    {\n      slug:\"hangover_of_solutions\",\n      album:\"Hangover of Solutions\",\n      band:\"The Violet Frequency\",\n      cover:\"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/TVF-HOS.jpg\",\n      platforms:[\n        {name:\"Spotify\",      url:\"#\", icon:PLATFORM_ICONS.spotify},\n        {name:\"Apple Music\",  url:\"#\", icon:PLATFORM_ICONS.apple},\n        {name:\"Amazon Music\", url:\"#\", icon:PLATFORM_ICONS.amazon},\n        {name:\"YouTube Music\",url:\"#\", icon:PLATFORM_ICONS.youtube},\n        {name:\"Deezer\",       url:\"#\", icon:PLATFORM_ICONS.deezer},\n        {name:\"Tidal\",        url:\"#\", icon:PLATFORM_ICONS.tidal},\n        {name:\"SoundCloud\",   url:\"#\", icon:PLATFORM_ICONS.soundcloud},\n        {name:\"Bandcamp\",     url:\"#\", icon:PLATFORM_ICONS.bandcamp}\n      ],\n      tracks:[\n        {title:\"01. Spiders\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/01-The-Violet-Frequency-Spiders.mp3\"},\n        {title:\"02. Hey Now 2.2\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/02-The-Violet-Frequency-Hey-Now-2.2.mp3\"},\n        {title:\"03. Second Life\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/03-The-Violet-Frequency-Second-Life.mp3\"},\n        {title:\"04. New Year's Day\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/04-The-Violet-Frequency-New-Years-day-U2.mp3\"},\n        {title:\"05. Never Lose Control (Piano)\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/05-The-Violet-Frequency-Never-Lose-Control-Piano-version.mp3\"},\n        {title:\"06. Atomic Shiver\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/06-The-Violet-Frequency-Atomic-Shiver.mp3\"},\n        {title:\"07. Stories 4 Nasty Girls & Boys\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/07-The-Violet-Frequency-Stories-4-Nasty-Girls-Boys.mp3\"},\n        {title:\"08. Rock & Roll Stop\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/08-The-Violet-Frequency-Rock-Roll-Stop.mp3\"},\n        {title:\"09. Vienna Underground\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/09-The-Violet-Frequency-Vienna-Underground.mp3\"},\n        {title:\"10. The Way you Play\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/10-The-Violet-Frequency-The-Way-You-Play.mp3\"},\n        {title:\"11. Dj & Chips (remix)\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/11-The-Violet-Frequency-Dj-Chips-Remix.mp3\"}\n      ]\n    },\n\n    {\n      slug:\"whos_normal\",\n      album:\"Who's Normal?\",\n      band:\"The Violet Frequency\",\n      cover:\"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/TVF-WN.png\",\n      platforms:[\n        {name:\"Spotify\",      url:\"#\", icon:PLATFORM_ICONS.spotify},\n        {name:\"Apple Music\",  url:\"#\", icon:PLATFORM_ICONS.apple},\n        {name:\"Amazon Music\", url:\"#\", icon:PLATFORM_ICONS.amazon},\n        {name:\"YouTube Music\",url:\"#\", icon:PLATFORM_ICONS.youtube},\n        {name:\"Deezer\",       url:\"#\", icon:PLATFORM_ICONS.deezer},\n        {name:\"Tidal\",        url:\"#\", icon:PLATFORM_ICONS.tidal},\n        {name:\"SoundCloud\",   url:\"#\", icon:PLATFORM_ICONS.soundcloud},\n        {name:\"Bandcamp\",     url:\"#\", icon:PLATFORM_ICONS.bandcamp}\n      ],\n      tracks:[\n        {title:\"01. Who's Normal?\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/The-Violet-Frequency-Whos-normal_.mp3\"}\n      ]\n    },\n\n    {\n      slug:\"attica\",\n      album:\"Attica\",\n      band:\"The Violet Frequency\",\n      cover:\"https:\/\/mlxsmx7p57uf.i.optimole.com\/cb:rTMh.eac\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/The-Violet-Frequency-Attica.png\",\n      platforms:[\n        {name:\"Spotify\",      url:\"#\", icon:PLATFORM_ICONS.spotify},\n        {name:\"Apple Music\",  url:\"#\", icon:PLATFORM_ICONS.apple},\n        {name:\"Amazon Music\", url:\"#\", icon:PLATFORM_ICONS.amazon},\n        {name:\"YouTube Music\",url:\"#\", icon:PLATFORM_ICONS.youtube},\n        {name:\"Deezer\",       url:\"#\", icon:PLATFORM_ICONS.deezer},\n        {name:\"Tidal\",        url:\"#\", icon:PLATFORM_ICONS.tidal},\n        {name:\"SoundCloud\",   url:\"#\", icon:PLATFORM_ICONS.soundcloud},\n        {name:\"Bandcamp\",     url:\"#\", icon:PLATFORM_ICONS.bandcamp}\n      ],\n      tracks:[\n        {title:\"01. Attica\", src:\"https:\/\/thevioletfrequency.com\/wp-content\/uploads\/2026\/01\/Mastering-Attica-01.mp3\"}\n      ]\n    }\n  ];\n\n  const $ = (s,r=document)=>r.querySelector(s);\n  const $$ = (s,r=document)=>Array.from(r.querySelectorAll(s));\n\n  const carousel = $(\"#vfCarousel\");\n  const player = $(\"#vfPlayer\");\n  const audio = $(\"#vfAudio\");\n  const coverEl = $(\"#vfCover\");\n  const albumEl = $(\"#vfAlbum\");\n  const bandEl  = $(\"#vfBand\");\n  const titleEl = $(\"#vfTrackTitle\");\n\n  const btnPlay = $(\".vf-play\");\n  const btnPrev = $(\".vf-prev\");\n  const btnNext = $(\".vf-next\");\n\n  const bar = $(\"#vfBar\");\n  const progress = $(\"#vfProgress\");\n  const currentEl = $(\".vf-current\");\n  const durationEl = $(\".vf-duration\");\n  const volumeEl = $(\"#vfVolume\");\n\n  const linksGrid = $(\"#vfLinksGrid\");\n  const playlistEl = $(\"#vfPlaylist\");\n\n  const canvas = $(\"#vfWave\");\n  const ctx = canvas.getContext(\"2d\");\n\n  let state = { albumIndex:0, trackIndex:0, audioCtx:null, analyser:null, dataArray:null, rafOn:false };\n\n  function resizeCanvas(){ canvas.width=canvas.offsetWidth; canvas.height=canvas.offsetHeight; }\n  window.addEventListener(\"resize\", () => {\n    resizeCanvas();\n    limitPlaylistToThreeVisible();\n  });\n  resizeCanvas();\n\n  function initAnalyser(){\n    if(state.audioCtx) return;\n    state.audioCtx = new (window.AudioContext||window.webkitAudioContext)();\n    state.analyser = state.audioCtx.createAnalyser();\n    state.analyser.fftSize = 1024;\n    state.dataArray = new Uint8Array(state.analyser.fftSize);\n    const src = state.audioCtx.createMediaElementSource(audio);\n    src.connect(state.analyser);\n    state.analyser.connect(state.audioCtx.destination);\n  }\n\n  function drawWave(){\n    if(!state.analyser) return;\n    state.rafOn = true;\n\n    const minAmp = 0.06;\n    const smooth = 0.85;\n    const smoothed = new Float32Array(state.dataArray.length);\n\n    (function loop(){\n      if(!state.rafOn) return;\n      requestAnimationFrame(loop);\n\n      state.analyser.getByteTimeDomainData(state.dataArray);\n      ctx.clearRect(0,0,canvas.width,canvas.height);\n\n      const mid = canvas.height\/2;\n      const step = canvas.width\/(state.dataArray.length-1);\n\n      ctx.beginPath();\n      for(let i=0;i<state.dataArray.length;i++){\n        let v = (state.dataArray[i]-128)\/128; \/\/ -1..1\n        if(Math.abs(v) < minAmp) v = (v < 0 ? -minAmp : minAmp);\n        smoothed[i] = smooth*smoothed[i] + (1-smooth)*v;\n\n        const x = i*step;\n        const y = mid + smoothed[i]*mid*0.95;\n\n        if(i===0) ctx.moveTo(x,y);\n        else ctx.lineTo(x,y);\n      }\n      ctx.strokeStyle=\"rgba(255,255,255,.85)\";\n      ctx.lineWidth=2;\n      ctx.stroke();\n    })();\n  }\n\n  function formatTime(t){\n    if(isNaN(t)) return \"0:00\";\n    const m=Math.floor(t\/60), s=Math.floor(t%60);\n    return m+\":\"+(s<10?\"0\"+s:s);\n  }\n\n  function setPlayingUI(on){ player.classList.toggle(\"is-playing\", !!on); }\n\n  function setQueryAlbum(slug){\n    const url=new URL(window.location.href);\n    url.searchParams.set(\"album\", slug);\n    window.history.replaceState({}, \"\", url.toString());\n  }\n  function getQueryAlbum(){\n    try{ return new URL(window.location.href).searchParams.get(\"album\"); }catch(e){ return null; }\n  }\n\n  function renderCarousel(){\n    carousel.innerHTML = ALBUMS.map(a=>`\n      <div class=\"vf-albumcard2\" data-album=\"${a.slug}\">\n        <img decoding=\"async\" class=\"vf-thumb2\" src=\"${a.cover}\" alt=\"${a.album}\">\n        <div class=\"vf-albmeta2\">\n          <div class=\"vf-albname2\">${a.album}<\/div>\n          <div class=\"vf-albband2\">${a.band}<\/div>\n        <\/div>\n      <\/div>\n    `).join(\"\");\n  }\n\n  function renderLinks(album){\n    const links=(album.platforms||[]).filter(p=>p.url && p.icon);\n    linksGrid.innerHTML = links.map(p=>`\n      <a class=\"vf-link2\" href=\"${p.url}\" target=\"_blank\" rel=\"noopener\"\n         aria-label=\"${p.name}\" title=\"${p.name}\">\n        <img decoding=\"async\" src=\"${p.icon}\" alt=\"${p.name}\">\n      <\/a>\n    `).join(\"\");\n    $(\"#vfLinks\").style.display = links.length ? \"\" : \"none\";\n  }\n\n  function renderPlaylist(album){\n    playlistEl.innerHTML = album.tracks.map((t,i)=>`\n      <div class=\"vf-item2\" data-i=\"${i}\">\n        <div class=\"vf-row2\">\n          <button class=\"vf-trackbtn2\" type=\"button\">${t.title}<\/button>\n        <\/div>\n      <\/div>\n    `).join(\"\");\n\n    \/\/ \u2705 ajusta \u201c3 visibles\u201d + deja scroll arriba al cambiar \u00e1lbum\n    requestAnimationFrame(() => {\n      limitPlaylistToThreeVisible();\n      playlistEl.scrollTop = 0;\n    });\n  }\n\n  function limitPlaylistToThreeVisible(){\n    const items = $$(\".vf-item2\", playlistEl);\n\n    playlistEl.classList.remove(\"is-scroll\");\n    playlistEl.style.maxHeight = \"\";\n    playlistEl.style.overflow = \"\";\n\n    if(items.length <= 3) return;\n\n    const h1 = items[0].offsetHeight || 0;\n    const h2 = items[1].offsetHeight || h1;\n    const h3 = items[2].offsetHeight || h1;\n    const total = h1 + h2 + h3 + 16;\n\n    playlistEl.classList.add(\"is-scroll\");\n    playlistEl.style.maxHeight = total + \"px\";\n    playlistEl.style.overflow = \"auto\";\n  }\n\n  function setActiveTrack(i, autoplay){\n    const album=ALBUMS[state.albumIndex];\n    state.trackIndex=i;\n\n    $$(\".vf-item2\", playlistEl).forEach((it,idx)=>it.classList.toggle(\"active\", idx===i));\n\n    titleEl.textContent = album.tracks[i].title;\n    audio.src = album.tracks[i].src;\n\n    \/\/ \u2705 si est\u00e1s scrolleando, asegura que el activo se vea\n    requestAnimationFrame(() => {\n      const active = playlistEl.querySelector(\".vf-item2.active\");\n      if(active && playlistEl.classList.contains(\"is-scroll\")){\n        active.scrollIntoView({block:\"nearest\"});\n      }\n    });\n\n    if(autoplay) playCurrent();\n  }\n\n  function loadAlbum(idx){\n    state.albumIndex=idx;\n    const album=ALBUMS[idx];\n\n    coverEl.src=album.cover;\n    albumEl.textContent=album.album;\n    bandEl.textContent=\"by \"+album.band;\n\n    $$(\".vf-albumcard2\", carousel).forEach(c=>c.classList.toggle(\"active\", c.dataset.album===album.slug));\n\n    renderPlaylist(album);\n    renderLinks(album);\n\n    audio.pause();\n    setPlayingUI(false);\n    bar.style.width=\"0%\";\n    currentEl.textContent=\"0:00\";\n    durationEl.textContent=\"0:00\";\n\n    setQueryAlbum(album.slug);\n    setActiveTrack(0,false);\n  }\n\n  function playCurrent(){\n    if(!audio.src) setActiveTrack(0,false);\n    initAnalyser();\n    if(state.audioCtx && state.audioCtx.state===\"suspended\") state.audioCtx.resume();\n    audio.play();\n    setPlayingUI(true);\n    if(!state.rafOn) drawWave();\n  }\n  function pauseCurrent(){ audio.pause(); setPlayingUI(false); }\n\n  renderCarousel();\n  const q=getQueryAlbum();\n  const idxBySlug = q ? ALBUMS.findIndex(a=>a.slug===q) : -1;\n  loadAlbum(idxBySlug>=0 ? idxBySlug : 0);\n\n  carousel.addEventListener(\"click\", (e)=>{\n    const card=e.target.closest(\".vf-albumcard2\");\n    if(!card) return;\n    const idx=ALBUMS.findIndex(a=>a.slug===card.dataset.album);\n    if(idx>=0) loadAlbum(idx);\n  });\n\n  playlistEl.addEventListener(\"click\", (e)=>{\n    const btn = e.target.closest(\".vf-trackbtn2\");\n    if(!btn) return;\n    const item = e.target.closest(\".vf-item2\");\n    if(!item) return;\n    setActiveTrack(parseInt(item.dataset.i,10), true);\n  });\n\n  btnPlay.addEventListener(\"click\", ()=> audio.paused ? playCurrent() : pauseCurrent());\n  btnPrev.addEventListener(\"click\", ()=>{\n    const n=ALBUMS[state.albumIndex].tracks.length;\n    setActiveTrack((state.trackIndex-1+n)%n, true);\n  });\n  btnNext.addEventListener(\"click\", ()=>{\n    const n=ALBUMS[state.albumIndex].tracks.length;\n    setActiveTrack((state.trackIndex+1)%n, true);\n  });\n\n  progress.addEventListener(\"click\", (e)=>{\n    if(!audio.duration) return;\n    const r=progress.getBoundingClientRect();\n    audio.currentTime=((e.clientX-r.left)\/r.width)*audio.duration;\n  });\n\n  audio.addEventListener(\"timeupdate\", ()=>{\n    if(audio.duration){\n      bar.style.width=(audio.currentTime\/audio.duration)*100+\"%\";\n      currentEl.textContent=formatTime(audio.currentTime);\n      durationEl.textContent=formatTime(audio.duration);\n    }\n  });\n  audio.addEventListener(\"ended\", ()=>btnNext.click());\n  audio.addEventListener(\"pause\", ()=>setPlayingUI(false));\n  audio.addEventListener(\"play\", ()=>setPlayingUI(true));\n\n  volumeEl.addEventListener(\"input\", ()=> audio.volume=volumeEl.value);\n})();\n<\/script>\n<\/div><\/div>\n<\/div>\n<\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-620","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/pages\/620","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/comments?post=620"}],"version-history":[{"count":54,"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/pages\/620\/revisions"}],"predecessor-version":[{"id":864,"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/pages\/620\/revisions\/864"}],"wp:attachment":[{"href":"https:\/\/thevioletfrequency.com\/en\/wp-json\/wp\/v2\/media?parent=620"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}