Files
djAudiovisualizaerPi/svg/woman-dancing-light-skin-tone-svgrepo-com.svg
T
lucianoandClaude Opus 4.8 b94c787231 DJ Visualizer Pi: standalone Node+WebSocket server with mobile PWA remote
New separate project (the Electron Mac app stays untouched). Reuses the visual
engine (WebGL shaders, effect catalog, Web Audio) verbatim and replaces Electron
IPC with a Node HTTP+WebSocket server:

- server.js: serves the kiosk output page + mobile control PWA, relays the same
  ctl/rpt JSON protocol over WebSocket, plus REST for media library/upload,
  JSON state (pads), waveform peaks and MP4 recording (ffmpeg).
- public/js/net.js: window.djv shim over WebSocket+HTTP so output.js runs intact.
- public/index.html + control.js: touch-first mobile remote (effects, media/queue,
  ticker, pads, audio/EQ, fullscreen + recording).
- PWA (manifest + service worker + generated icons).
- scripts/: Chromium kiosk launcher + install-pi.sh (systemd units for Pi 5).

Verified: REST endpoints, WebSocket relay both directions, control PWA loads the
2958-effect catalog and renders. (Headless WebGL output not testable without GPU.)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-29 13:06:15 +02:00

158 lines
13 KiB
XML

<?xml version="1.0" encoding="utf-8"?>
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg width="800px" height="800px" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--noto" preserveAspectRatio="xMidYMid meet">
<path d="M64.65 10.66c-2.74-4.14-7.7-6.38-12.94-5.85c-5.24.53-9.65 3.73-11.51 8.34c-1.13 2.81-1.51 6.17-1.14 10.29c.34 3.88.17 4.9-2.45 6.84c-3.87 2.89-5.44 6.86-4.1 10.37c1.27 3.34 4.84 5.37 9.27 5.37c.43 0 .87-.02 1.32-.06c9.36-.82 16.22-5.08 20.4-12.66c.11-.19.19-.34.25-.45c3.65-5.88 5.22-15.66.9-22.19z" fill="#312d2d">
</path>
<radialGradient id="IconifyId17ecdb2904d178eab22463" cx="50.336" cy="96.724" r="20.267" gradientTransform="matrix(-.8404 .542 .3471 .5383 59.067 -48.072)" gradientUnits="userSpaceOnUse">
<stop offset=".782" stop-color="#454140" stop-opacity="0">
</stop>
<stop offset="1" stop-color="#454140">
</stop>
</radialGradient>
<path d="M66.99 23.71c-.33 3.66-2.34 7.71-3.25 9.15c-.06.11-.14.26-.25.45c-4.18 7.58-11.04 11.84-20.4 12.66c-.44.04-.88.06-1.31.06c-4.44 0-8.14-1.98-9.27-5.37c-1.54-4.62 1.39-8.31 3.18-9.62c2.75-2.01 3.85-2.98 3.46-6.89c2.24 14.84 27.2 3.32 27.74.23c.04-.22.08-.45.1-.67z" fill="url(#IconifyId17ecdb2904d178eab22463)">
</path>
<linearGradient id="IconifyId17ecdb2904d178eab22464" gradientUnits="userSpaceOnUse" x1="57.038" y1="78.035" x2="55.712" y2="92.477" gradientTransform="matrix(1 0 0 -1 0 128)">
<stop offset=".074" stop-color="#f9ddbd">
</stop>
<stop offset="1" stop-color="#ffd29c">
</stop>
</linearGradient>
<path d="M68.44 33.74c-1.81 1.1-4.12 1.51-5.93 1.51c-.61 0-1.17-.05-1.62-.13c-1.83-.34-3.51-.48-5.05-.48c-8.68 0-12.93 4.51-12.93 4.51l5.91 9.2c2.86.88 5.84 1.37 8.43 1.37c1.3 0 2.5-.12 3.55-.38c5.94-1.47 8.77-5.94 8.77-5.94l-1.13-9.66z" fill="url(#IconifyId17ecdb2904d178eab22464)">
</path>
<linearGradient id="IconifyId17ecdb2904d178eab22465" gradientUnits="userSpaceOnUse" x1="75.801" y1="103.969" x2="67.708" y2="98.574" gradientTransform="matrix(1 0 0 -1 0 128)">
<stop offset=".232" stop-color="#f9ddbd">
</stop>
<stop offset="1" stop-color="#ffd29c">
</stop>
</linearGradient>
<path d="M84.92 27.89h.01c-2.11-6.35-5.38-9.88-7.45-14.86c-.03-.09-.06-.15-.09-.24c.42-.38.87-.8 1.42-1.32c0 0 2.87-3.1 5.01-4.71c.44-.34.23-1.19-.4-1.19h-.06c-1.49.29-5.02 3.31-5.02 3.31c-.16-.46-.49-.63-.85-.63c-.55 0-1.2.38-1.6.73l-3.05 2.69c-.84.74-.87 1.72-.47 2.43c.03.14.07.29.13.46l3.38 10.22c.34 1.07.65 2.16.93 3.25c-3.65 2.58-12.08 7.51-12.08 7.51S67.09 43 67.92 43h.05c1.08 0 2.98-.62 3.82-1.28c4.7-3.65 9.63-7.67 11.93-9.57l-.01.01c.59-.45 1.05-1.05 1.29-1.81c.27-.84.21-1.69-.08-2.46z" fill="url(#IconifyId17ecdb2904d178eab22465)">
</path>
<linearGradient id="IconifyId17ecdb2904d178eab22466" gradientUnits="userSpaceOnUse" x1="37.269" y1="64.39" x2="48.432" y2="75.367" gradientTransform="matrix(1 0 0 -1 0 128)">
<stop offset=".232" stop-color="#f9ddbd">
</stop>
<stop offset="1" stop-color="#ffd29c">
</stop>
</linearGradient>
<path d="M47.75 64.44c-.01-.03-.03-.05-.05-.08l-.41.3c-.01-.01-.01-.01-.01-.02l.42-.28c-.03-.05-.06-.09-.1-.14a1.07 1.07 0 0 0-.14-.16c-.06-.08-.11-.14-.19-.23l-7.29-7.92c-.48-.53-.93-1.08-1.39-1.63c3.55-3.15 10.36-8.34 10.36-8.34S45.72 39 44.87 39h-.02c-1.07 0-2.9.93-3.66 1.7c-4.2 4.22-8.57 8.8-10.61 10.98l.01-.03c-.52.52-.9 1.17-1.05 1.95c-.22 1.2.17 2.35.93 3.18h-.01l.11.11c.01.01.02.03.04.04c4.48 4.8 8.68 6.59 12.58 10.25c.14.14.28.25.43.34c-.12.58-.25 1.23-.39 2.02c0 0-.48 4.19-1.25 6.76c-.13.42.25.85.66.85c.14 0 .28-.05.4-.16c1.03-1.11 2.09-5.64 2.09-5.64c.19.13.38.19.55.19c.72 0 1.22-1.02 1.37-1.72l.87-3.97c.05-.25.06-.48.04-.69c.02-.22-.05-.46-.21-.72z" fill="url(#IconifyId17ecdb2904d178eab22466)">
</path>
<linearGradient id="IconifyId17ecdb2904d178eab22467" gradientUnits="userSpaceOnUse" x1="94.337" y1="60.937" x2="93.667" y2="60.491" gradientTransform="matrix(1 0 0 -1 0 128)">
<stop offset="0" stop-color="#bc1b00">
</stop>
<stop offset=".29" stop-color="#e31c00">
</stop>
<stop offset=".693" stop-color="#bc1b00">
</stop>
<stop offset=".914" stop-color="#dd1c00">
</stop>
</linearGradient>
<path d="M94.05 67.05l.02.39c.24-.21.24-.37-.02-.39z" fill="url(#IconifyId17ecdb2904d178eab22467)">
</path>
<linearGradient id="IconifyId17ecdb2904d178eab22468" gradientUnits="userSpaceOnUse" x1="50.577" y1="88.063" x2="58.64" y2="47.189" gradientTransform="matrix(1 0 0 -1 0 128)">
<stop offset="0" stop-color="#bc1b00">
</stop>
<stop offset=".213" stop-color="#e31c00">
</stop>
<stop offset=".507" stop-color="#bc1b00">
</stop>
<stop offset=".875" stop-color="#dd1c00">
</stop>
</linearGradient>
<path d="M94.07 67.44c-1.27 1.15-9.31 4.05-19.65-1.7c-4-2.22-6.48-5.38-7.01-9.01s1.85-5.97 2.1-9.25c.08-1.08-.02-1.98-.25-2.74c1.54-.74 3.31-2.2 3.32-2.56c.07-1.47-.68-2.85-1.47-4.08c-.85-1.33-1.81-2.61-3.08-3.54c-.33-.24-1.07-.68-1.47-.56c-3.34 1-3.97.93-6.89.93l-.9-.11c1.58 1.83 5.33 9.87 1.7 11.56S48.91 35.72 48.91 35.72c-2.46.68-7.59 3.63-10.03 6.47c-.15.17.09.45.2.65c1.25 2.37 3.45 4.71 5.55 6.38c.22.18.46.36.73.41c.24.05 1.09-.5 1.69-.93c1.37 1.58 2.61 3.08 3.35 4.11c.84 1.04 3.06 5.01 2.25 8.28c-5.88 12.36-.26 14.76.37 19.07c1.29 8.85-9.04 30.6-26.54 30.6l8.25 4.75l15.67-1.03l8.66-7.45l11.9-1.78l4.2-8.61L79.33 85L94.5 75l-.43-7.56z" fill="url(#IconifyId17ecdb2904d178eab22468)">
</path>
<defs>
<path id="IconifyId17ecdb2904d178eab22469" d="M94.05 67.05c1.67.16-7.35 5.52-19.63-1.31c-4-2.22-6.48-5.38-7.01-9.01s1.85-5.97 2.1-9.25c.41-5.28-3.55-6.24-5.53-8.54c-1.98-2.29-4.36-4.58-4.36-4.58h-1.19c1.58 1.83 5.67 10.31 2.04 12.01S48.74 35.46 48.74 35.46l-1.44.42c-3.58 1.21-7.17 4.54-7.12 4.9c.06.41 7.8 8.67 10.22 12.03c.84 1.04 3.06 5.01 2.25 8.28c-5.88 12.36-.26 14.76.37 19.07c1.29 8.85-9.04 30.6-26.54 30.6l8.25 4.75l15.67-1.03l8.66-7.45l11.9-1.78l4.2-8.61L79.33 85L94.5 75l-.45-7.95z">
</path>
</defs>
<clipPath id="IconifyId17ecdb2904d178eab22470">
<use xlink:href="#IconifyId17ecdb2904d178eab22469" overflow="visible">
</use>
</clipPath>
<g clip-path="url(#IconifyId17ecdb2904d178eab22470)">
<path d="M53.22 96.57c-1.4.82-2.87 2.35-4.38 4.9c-1.31 2.21-4.43 7.82-6.84 8.28c-2.25.43-5.39-.61-6.52-2.67l-.48-.87l-1.75.96l.48.88c1.35 2.47 4.32 3.59 6.99 3.59c.57 0 1.12-.05 1.64-.15c3.44-.66 6.07-6.02 7.37-8.27c.96-1.66 1.93-2.82 2.92-3.61c-.09-.97.12-2.02.57-3.04z" fill="#ff8f00">
</path>
<path d="M73.99 70.34c2.17-.12 4.13.53 4.13.53l-.75-.5c-1.17-.56-3.69-1.83-5.92-1.67c.74.9 1.72 1.24 2.54 1.64z" fill="#ff8f00">
</path>
<path d="M65.75 85c2.01 4.69 5.68 12.84 2.33 15.17c-.67.47-2.14.23-4.08-.79c-1.49-.78-3.13-2.06-4.9-2.87c.24.79.46 1.59.54 2.37c1.41.56 2.75 1.35 3.98 2c2.22 1.17 4 1.78 5.7.32c4.3-3.69.18-9.96-1.82-14.98c-1.93-4.83-1.76-8.36-.23-11.12c-.82-.23-1.59-.51-2.33-.77c-1.24 3.23-.72 7.1.81 10.67z" fill="#ff8f00">
</path>
<path d="M70.5 71.5c1.02-.79 2.29-1.09 3.49-1.16c-.83-.4-1.8-.74-2.53-1.64c-.55.04-1.09.16-1.58.41c-2.55 1.29-4.11 3.12-4.93 5.22c.73.26 1.51.54 2.33.77c.76-1.37 1.86-2.55 3.22-3.6z" fill="#ffb600">
</path>
<path d="M53.22 96.57c-.46 1.02-.66 2.08-.58 3.04c2.36-1.89 4.76-1.62 7-.73c-.09-.78-.3-1.58-.54-2.37c-1.82-.84-3.78-1.17-5.88.06z" fill="#ffb600">
</path>
</g>
<g>
<defs>
<path id="IconifyId17ecdb2904d178eab22471" d="M94.05 67.05c1.67.16-7.35 5.52-19.63-1.31c-4-2.22-6.48-5.38-7.01-9.01s1.85-5.97 2.1-9.25c.41-5.28-3.55-6.24-5.53-8.54c-1.98-2.29-4.36-4.58-4.36-4.58h-1.19c1.58 1.83 5.67 10.31 2.04 12.01S48.74 35.46 48.74 35.46l-1.44.42c-3.58 1.21-7.17 4.54-7.12 4.9c.06.41 7.8 8.67 10.22 12.03c.84 1.04 3.06 5.01 2.25 8.28c-5.88 12.36-.26 14.76.37 19.07c1.29 8.85-9.04 30.6-26.54 30.6l8.25 4.75l15.67-1.03l8.66-7.45l11.9-1.78l4.2-8.61L79.33 85L94.5 75l-.45-7.95z">
</path>
</defs>
<clipPath id="IconifyId17ecdb2904d178eab22472">
<use xlink:href="#IconifyId17ecdb2904d178eab22471" overflow="visible">
</use>
</clipPath>
<g clip-path="url(#IconifyId17ecdb2904d178eab22472)">
<path d="M85 74.31v-.49c3.07-.57 2.12-4.61 2.01-5.28l1.91-.34c.06.37.66 3.62-1.01 5.39c-.48.51-2.91.75-2.91.72z" fill="#ff8f00">
</path>
</g>
</g>
<radialGradient id="IconifyId17ecdb2904d178eab22473" cx="67.245" cy="-633.194" r="47.355" gradientTransform="matrix(1 0 0 -1 0 -534)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#892002">
</stop>
<stop offset=".537" stop-color="#b42002">
</stop>
<stop offset="1" stop-color="#892002">
</stop>
</radialGradient>
<path d="M97.91 64.4c5.55-.68 9.85 5.23 7.83 10.48c-.67 1.73-1.9 2.77-3.24 3.29c-.01.01-.03.01-.04.02c-1.03.42-.91 1.96.16 2.27c.81.24 2.14-.58 3.51.18c1.56.86 2.8 2.2 2.76 4.64c-.05 2.76-1.21 5.44-3.76 6.12c-3.81 1-4.62 4.45-4.75 8.74c-.05 1.72-.49 4.42-2.65 5.91c-7.39 5.11-12.17-1.95-17.82 1.08c-9.77 5.23-3.73 16.1-28.34 8.81c-5.86-1.73-15.57 10.5-23.99 5.39c-6.7-4.07-4.69-9.06-2.09-10.82c5.22-3.51 6.08 3.65 17.75 3c6.06-.34 4.6-10.55 12.75-13c6.43-1.93 9.08 7.28 14 3c7.75-6.75-3.5-17.25-.5-24.75c1.86-4.66 5.75-7.25 9.75-6.25s3.67 4.08 6.25 4.83c2.83.83 4.56-1.95 5.17-4c1.02-3.43 1.75-8.26 7.25-8.94z" fill="url(#IconifyId17ecdb2904d178eab22473)">
</path>
<g>
<path d="M100.23 115.59c1.62 1.02 4.79 4.18 5.66 5.88c.25.49.48 1.68.15 2.11c-.28.36-6.55.73-11.05-1.82c-.39-.22-.89-1.04-1.05-1.36c-.3-.6-.75-.67-.82-.04c-.59-.03-1.01.02-1.6-.01c-.42-4.09-1.12-3.64-1.05-6.51c.06-2.33 1.66-2.83 2.29-3.07c.1-.04 5.08 3.06 7.47 4.82z" fill="#dd2c00">
</path>
</g>
<linearGradient id="IconifyId17ecdb2904d178eab22474" gradientUnits="userSpaceOnUse" x1="83.441" y1="40.549" x2="95.348" y2="18.13" gradientTransform="matrix(1 0 0 -1 0 128)">
<stop offset="0" stop-color="#ffd29c">
</stop>
<stop offset=".401" stop-color="#f9ddbd">
</stop>
</linearGradient>
<path d="M100.27 113.64c-.88-2.1-1.77-4.21-2.65-6.31c-3.5-8.34-5.11-11.96-9.02-20.12c-.37-.81-1.06-1.12-1.87-1.12c-1.14 0-2.53.61-3.67 1.31c-2.03 1.25-3.86 2.42-2.45 4.66c2.83 4.47 9.18 11.73 11.37 16.55c1.2 2.64 1.2 5.43 3.13 7.58c.86.96 1.48 1.61 2.75 1.83c.43.08.87.13 1.28.13c.92 0 1.69-.27 1.85-1.15c.15-.81-.4-2.6-.72-3.36z" fill="url(#IconifyId17ecdb2904d178eab22474)">
</path>
<g>
<path d="M60.09 121.36c-.42-2.54-2.56-6.71-4.87-6.71s-4.64 4.17-5.06 6.71c-.06.34-.08 1.44-.08 1.71c0 .01.01.02.01.02c.02.38.43.9 1.01.9c1.4 0 2.71 0 4.01.01c1.3 0 2.61-.01 4.01-.01c.61 0 1.03-.57 1.01-.95v-.01c0-.26.01-1.34-.04-1.67z" fill="#b41301">
</path>
</g>
<path d="M57.55 107.62c-1.21 0-2.29.28-2.45.88c-.37 1.41-1.47 5.1-1.84 7.13c-.57 2 .13 2.75 2.17 3.13c.22.04.42.06.61.06c1.33 0 1.89-1.01 2.34-2.54l2.78-6.84c.36-1.17-1.77-1.82-3.61-1.82z" fill="#edbd82">
</path>
<g>
<path d="M57.61 33.13l-5.94.52l.29 3.26c.12 1.39 1.3 2.44 2.69 2.44c.08 0 .16 0 .24-.01l.54-.05a2.69 2.69 0 0 0 2.46-2.91l-.28-3.25z" fill="#edc391">
</path>
<path d="M64.5 21.29c-.74-8.35-5.72-12.14-11-12.14c-.32 0-.65.01-.98.04c-5.62.49-10.46 5.13-9.68 13.99c.62 7.13 5.41 10.95 9.37 11.97c.73.19 1.43.28 2.07.28c.18 0 .36-.01.54-.02c.78-.07 1.65-.31 2.54-.71c3.72-1.69 7.76-6.29 7.14-13.41z" fill="#f9ddbd">
</path>
<path d="M52.77 26.3c.03-.02.07-.03.1-.04l2.28-.2c.04 0 .07.01.11.02c.21.07.35.27.27.51s-.48.92-1.39 1c-.92.08-1.43-.52-1.54-.74c-.13-.22-.03-.45.17-.55z" fill="#dba689">
</path>
<g fill="#312d2d">
<ellipse transform="rotate(-4.997 59.065 22.722)" cx="59.06" cy="22.73" rx="1.6" ry="1.65">
</ellipse>
<ellipse transform="rotate(-4.997 48.444 23.654)" cx="48.44" cy="23.66" rx="1.6" ry="1.65">
</ellipse>
</g>
<g fill="#454140">
<path d="M56.44 19.98c.27-.43.92-1.07 2.28-1.19s2.11.4 2.45.78c.15.17.13.37.05.51c-.08.12-.32.25-.61.18s-.86-.31-1.78-.23c-.92.09-1.44.42-1.72.54c-.27.12-.54.04-.63-.07a.43.43 0 0 1-.04-.52z">
</path>
<path d="M45.82 20.91c.27-.43.92-1.07 2.28-1.19s2.11.4 2.45.78c.15.17.13.37.05.51c-.08.12-.32.25-.61.18s-.86-.31-1.78-.23c-.92.09-1.44.42-1.72.54c-.27.12-.54.04-.63-.07c-.1-.13-.16-.34-.04-.52z">
</path>
</g>
<path d="M51.53 29.07c1.08.52 4.45.23 5.43-.47c.56-.4 1.21.08 1.01.64c-.19.55-1.93 1.93-3.52 2.07s-3.51-.93-3.8-1.43c-.29-.52.26-1.11.88-.81z" fill="#444">
</path>
</g>
<g>
<path d="M40.57 27.54c.47-5.01-.18-6.73-.04-8.56c.12-1.55.62-11.75 11.72-12.72C64.94 5.15 65.67 16.8 65.67 16.8l.31 4.15s-.09 2.48-1.19 5.48c-1.11 3.01-1.98 4.13-1.68 2.62c.33-1.67.62-3.95.43-6.12c-.08-.95-.09-4.51-2.12-4.78c-7.45-1-11.92-4.52-11.92-4.52c-.87 2.44-4.03 5.03-5.16 6c-.93.8-.53 3.73-.4 4.98l.95 5.69c-1.26-.66-3.57-1.5-4.32-2.76z" fill="#312d2d">
</path>
<radialGradient id="IconifyId17ecdb2904d178eab22475" cx="52.678" cy="105.826" r="17.741" gradientTransform="matrix(0 1 .9172 0 -44.385 -30.503)" gradientUnits="userSpaceOnUse">
<stop offset=".869" stop-color="#454140" stop-opacity="0">
</stop>
<stop offset="1" stop-color="#454140">
</stop>
</radialGradient>
<path d="M67 23.66c0 .02 0 .03-.01.05c-.02.22-.06.45-.1.67c-.54 3.09-25.5 14.61-27.74-.23c-.04-.23-.07-.47-.09-.71c-.01-.09-.02-.18-.02-.26c-.02-.17-.03-.33-.03-.49c-.3-3.77.13-6.9 1.2-9.54c1.85-4.61 6.26-7.81 11.5-8.34s10.19 1.71 12.94 5.85c2.46 3.72 3.01 8.49 2.35 13z" fill="url(#IconifyId17ecdb2904d178eab22475)">
</path>
</g>
</svg>