<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Korg Radias Random Patch Generator</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Arial', sans-serif;
background: linear-gradient(135deg, #1a1a2e, #16213e, #0f3460);
color: #fff;
min-height: 100vh;
padding: 20px;
}
.container {
max-width: 1200px;
margin: 0 auto;
}
.header {
text-align: center;
margin-bottom: 30px;
padding: 20px;
background: rgba(255, 255, 255, 0.1);
border-radius: 15px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.header h1 {
font-size: 2.5rem;
margin-bottom: 10px;
background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.controls {
text-align: center;
margin-bottom: 30px;
}
.generate-btn {
background: linear-gradient(45deg, #ff6b6b, #4ecdc4);
border: none;
color: white;
padding: 15px 40px;
font-size: 1.2rem;
border-radius: 50px;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 8px 25px rgba(255, 107, 107, 0.3);
margin: 0 10px;
}
.generate-btn:hover {
transform: translateY(-3px);
box-shadow: 0 12px 35px rgba(255, 107, 107, 0.4);
}
.export-btn {
background: linear-gradient(45deg, #45b7d1, #96c93d);
border: none;
color: white;
padding: 12px 25px;
font-size: 1rem;
border-radius: 25px;
cursor: pointer;
transition: all 0.3s ease;
margin: 0 5px;
}
.export-btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(69, 183, 209, 0.3);
}
.patch-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 20px;
margin-bottom: 30px;
}
.section {
background: rgba(255, 255, 255, 0.1);
border-radius: 15px;
padding: 20px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
}
.section:hover {
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}
.section h3 {
color: #4ecdc4;
margin-bottom: 15px;
font-size: 1.3rem;
text-align: center;
text-transform: uppercase;
letter-spacing: 1px;
}
.param {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
padding: 8px 12px;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
transition: all 0.2s ease;
}
.param:hover {
background: rgba(255, 255, 255, 0.1);
}
.param-name {
font-weight: bold;
color: #fff;
font-size: 0.9rem;
}
.param-value {
color: #4ecdc4;
font-weight: bold;
font-size: 0.9rem;
}
.patch-name {
text-align: center;
margin-bottom: 20px;
font-size: 1.5rem;
color: #ff6b6b;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 2px;
}
.footer {
text-align: center;
margin-top: 30px;
color: rgba(255, 255, 255, 0.7);
padding: 20px;
}
@keyframes glow {
0%, 100% { box-shadow: 0 0 20px rgba(78, 205, 196, 0.3); }
50% { box-shadow: 0 0 30px rgba(78, 205, 196, 0.6); }
}
.section.highlight {
animation: glow 2s infinite;
}
</style>
</head>
<body>
<div class="container">
<div class="header">
<h1>🎹 Korg Radias Random Patch Generator</h1>
<p>Genera patch casuali per il tuo sintetizzatore Korg Radias</p>
</div>
<div class="controls">
<button class="generate-btn" onclick="generateRandomPatch()">🎲 Genera Nuova Patch</button>
<button class="export-btn" onclick="exportPatch()">💾 Esporta JSON</button>
<button class="export-btn" onclick="copyToClipboard()">📋 Copia</button>
</div>
<div class="patch-name" id="patchName">INIT PATCH</div>
<div class="patch-grid" id="patchGrid">
<!-- Le sezioni verranno generate dinamicamente -->
</div>
<div class="footer">
<p>🎵 Generatore di patch per Korg Radias - Esplora nuovi suoni!</p>
</div>
</div>
<script>
let currentPatch = {};
// Definizione dei parametri del Korg Radias
const radiasParameters = {
oscillator1: {
name: "Oscillatore 1",
params: {
waveform: { name: "Forma d'onda", values: ["Saw", "Square", "Triangle", "Sine", "Noise", "Multi", "Dwgs"] },
octave: { name: "Ottava", min: -3, max: 3 },
semitone: { name: "Semitono", min: -12, max: 12 },
tune: { name: "Accordatura fine", min: -50, max: 50 },
level: { name: "Livello", min: 0, max: 127 },
panpot: { name: "Pan", min: -64, max: 63 }
}
},
oscillator2: {
name: "Oscillatore 2",
params: {
waveform: { name: "Forma d'onda", values: ["Saw", "Square", "Triangle", "Sine", "Noise", "Multi", "Dwgs"] },
octave: { name: "Ottava", min: -3, max: 3 },
semitone: { name: "Semitono", min: -12, max: 12 },
tune: { name: "Accordatura fine", min: -50, max: 50 },
level: { name: "Livello", min: 0, max: 127 },
panpot: { name: "Pan", min: -64, max: 63 }
}
},
filter: {
name: "Filtro",
params: {
type: { name: "Tipo", values: ["LPF", "HPF", "BPF", "BRF", "LP+HP"] },
cutoff: { name: "Cutoff", min: 0, max: 127 },
resonance: { name: "Risonanza", min: 0, max: 127 },
egIntensity: { name: "EG Intensity", min: -64, max: 63 },
velocitySens: { name: "Velocity Sens", min: -64, max: 63 },
keyboardTrack: { name: "Keyboard Track", min: -64, max: 63 }
}
},
amplifier: {
name: "Amplificatore",
params: {
level: { name: "Livello", min: 0, max: 127 },
panpot: { name: "Pan", min: -64, max: 63 },
velocitySens: { name: "Velocity Sens", min: -64, max: 63 },
keyboardTrack: { name: "Keyboard Track", min: -64, max: 63 }
}
},
filterEG: {
name: "Filter EG",
params: {
attack: { name: "Attack", min: 0, max: 127 },
decay: { name: "Decay", min: 0, max: 127 },
sustain: { name: "Sustain", min: 0, max: 127 },
release: { name: "Release", min: 0, max: 127 }
}
},
ampEG: {
name: "Amp EG",
params: {
attack: { name: "Attack", min: 0, max: 127 },
decay: { name: "Decay", min: 0, max: 127 },
sustain: { name: "Sustain", min: 0, max: 127 },
release: { name: "Release", min: 0, max: 127 }
}
},
lfo1: {
name: "LFO 1",
params: {
waveform: { name: "Forma d'onda", values: ["Triangle", "Saw Down", "Saw Up", "Square", "Random", "Sample&Hold"] },
frequency: { name: "Frequenza", min: 0, max: 127 },
fadeTime: { name: "Fade Time", min: 0, max: 127 },
keySync: { name: "Key Sync", values: ["Off", "On"] },
tempoSync: { name: "Tempo Sync", values: ["Off", "On"] }
}
},
lfo2: {
name: "LFO 2",
params: {
waveform: { name: "Forma d'onda", values: ["Triangle", "Saw Down", "Saw Up", "Square", "Random", "Sample&Hold"] },
frequency: { name: "Frequenza", min: 0, max: 127 },
fadeTime: { name: "Fade Time", min: 0, max: 127 },
keySync: { name: "Key Sync", values: ["Off", "On"] },
tempoSync: { name: "Tempo Sync", values: ["Off", "On"] }
}
},
effects: {
name: "Effetti",
params: {
modFxType: { name: "Mod FX Type", values: ["Chorus", "Ensemble", "Phaser", "Flanger", "Rotary", "Auto Pan", "Tremolo", "Ring Mod"] },
modFxIntensity: { name: "Mod FX Intensity", min: 0, max: 127 },
delayTime: { name: "Delay Time", min: 0, max: 127 },
delayFeedback: { name: "Delay Feedback", min: 0, max: 127 },
delayLevel: { name: "Delay Level", min: 0, max: 127 },
reverbType: { name: "Reverb Type", values: ["Hall", "Room", "Plate", "Spring"] },
reverbLevel: { name: "Reverb Level", min: 0, max: 127 }
}
}
};
// Nomi di patch creativi
const patchNames = [
"COSMIC DREAM", "BASS MONSTER", "LEAD FIRE", "PAD HEAVEN", "SYNC MAGIC",
"RETRO WAVE", "FUTURE BASS", "ANALOG WARM", "DIGITAL ICE", "WOBBLE BASS",
"SPACE ECHO", "NEON LIGHTS", "CYBER PUNK", "VINTAGE KEYS", "MODERN CLASSIC",
"DEEP HOUSE", "TRANCE LEAD", "AMBIENT FLOW", "PERCUSSIONI", "VOCODER TALK",
"ARP DANCE", "PLUCK HEAVEN", "DRONE SPACE", "FILTER SWEEP", "DELAY MAGIC"
];
function getRandomValue(param) {
if (param.values) {
return param.values[Math.floor(Math.random() * param.values.length)];
} else {
return Math.floor(Math.random() * (param.max - param.min + 1)) + param.min;
}
}
function generateRandomPatch() {
currentPatch = {};
// Genera valori casuali per tutti i parametri
for (const [sectionKey, section] of Object.entries(radiasParameters)) {
currentPatch[sectionKey] = {};
for (const [paramKey, param] of Object.entries(section.params)) {
currentPatch[sectionKey][paramKey] = getRandomValue(param);
}
}
// Genera un nome casuale per la patch
const randomName = patchNames[Math.floor(Math.random() * patchNames.length)];
currentPatch.name = randomName;
displayPatch();
animateSections();
}
function displayPatch() {
const patchGrid = document.getElementById('patchGrid');
const patchNameElement = document.getElementById('patchName');
patchNameElement.textContent = currentPatch.name || 'INIT PATCH';
patchGrid.innerHTML = '';
for (const [sectionKey, section] of Object.entries(radiasParameters)) {
const sectionDiv = document.createElement('div');
sectionDiv.className = 'section';
sectionDiv.innerHTML = `
<h3>${section.name}</h3>
${Object.entries(section.params).map(([paramKey, param]) => `
<div class="param">
<span class="param-name">${param.name}</span>
<span class="param-value">${currentPatch[sectionKey]?.[paramKey] || 'N/A'}</span>
</div>
`).join('')}
`;
patchGrid.appendChild(sectionDiv);
}
}
function animateSections() {
const sections = document.querySelectorAll('.section');
sections.forEach((section, index) => {
setTimeout(() => {
section.classList.add('highlight');
setTimeout(() => {
section.classList.remove('highlight');
}, 1000);
}, index * 100);
});
}
function exportPatch() {
if (Object.keys(currentPatch).length === 0) {
alert('Genera prima una patch!');
return;
}
const jsonData = JSON.stringify(currentPatch, null, 2);
const blob = new Blob([jsonData], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = `${currentPatch.name.replace(/\s+/g, '_')}_patch.json`;
a.click();
URL.revokeObjectURL(url);
}
function copyToClipboard() {
if (Object.keys(currentPatch).length === 0) {
alert('Genera prima una patch!');
return;
}
const jsonData = JSON.stringify(currentPatch, null, 2);
navigator.clipboard.writeText(jsonData).then(() => {
alert('Patch copiata negli appunti!');
}).catch(() => {
alert('Errore nella copia negli appunti');
});
}
// Genera una patch iniziale
generateRandomPatch();
</script>
</body>
</html>
