sup39/pianometer
1
0
Fork 0
Code Issues Pull requests Activity

chore: format

Browse source
This commit is contained in:
sup39 2024-01-11 02:41:58 +09:00
parent 165fb6134c
commit 94646d36fc
Signed by: sup39
GPG key ID: 111C00916C1641E5
2 changed files with 82 additions and 96 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

161
globals.js
View file

@ -39,110 +39,109 @@ let notePressedCount = 0;
let notePressedCountHistory = []; let notePressedCountHistory = [];
WebMidi.enable(function (err) { //check if WebMidi.js is enabled WebMidi.enable(function (err) { //check if WebMidi.js is enabled
if (err) { if (err) {
console.log("WebMidi could not be enabled.", err); console.log("WebMidi could not be enabled.", err);
} else { } else {
console.log("WebMidi enabled!"); console.log("WebMidi enabled!");
} }
//name our visible MIDI input and output ports //name our visible MIDI input and output ports
console.log("---"); console.log("---");
console.log("Inputs Ports: "); console.log("Inputs Ports: ");
for (i = 0; i < WebMidi.inputs.length; i++) { for (i = 0; i < WebMidi.inputs.length; i++) {
console.log(i + ": " + WebMidi.inputs[i].name); console.log(i + ": " + WebMidi.inputs[i].name);
} }
console.log("---"); console.log("---");
console.log("Output Ports: "); console.log("Output Ports: ");
for (i = 0; i < WebMidi.outputs.length; i++) { for (i = 0; i < WebMidi.outputs.length; i++) {
console.log(i + ": " + WebMidi.outputs[i].name); console.log(i + ": " + WebMidi.outputs[i].name);
} }
midiSelectSlider = select("#slider"); midiSelectSlider = select("#slider");
midiSelectSlider.attribute("max", WebMidi.inputs.length - 1); midiSelectSlider.attribute("max", WebMidi.inputs.length - 1);
midiSelectSlider.input(inputChanged); midiSelectSlider.input(inputChanged);
midiIn = WebMidi.inputs[midiSelectSlider.value()] midiIn = WebMidi.inputs[midiSelectSlider.value()]
inputChanged(); inputChanged();
}); });
function inputChanged() { function inputChanged() {
isKeyOn.fill(0); isKeyOn.fill(0);
controllerChange(64, 0); controllerChange(64, 0);
controllerChange(67, 0); controllerChange(67, 0);
midiIn.removeListener(); midiIn.removeListener();
midiIn = WebMidi.inputs[midiSelectSlider.value()]; midiIn = WebMidi.inputs[midiSelectSlider.value()];
midiIn.addListener('noteon', "all", function (e) { midiIn.addListener('noteon', "all", function (e) {
console.log("Received 'noteon' message (" + e.note.number + ", " + e.velocity + ")."); console.log("Received 'noteon' message (" + e.note.number + ", " + e.velocity + ").");
noteOn(e.note.number, e.velocity); noteOn(e.note.number, e.velocity);
}); });
midiIn.addListener('noteoff', "all", function (e) { midiIn.addListener('noteoff', "all", function (e) {
console.log("Received 'noteoff' message (" + e.note.number + ", " + e.velocity + ")."); console.log("Received 'noteoff' message (" + e.note.number + ", " + e.velocity + ").");
noteOff(e.note.number, e.velocity); noteOff(e.note.number, e.velocity);
}) })
midiIn.addListener('controlchange', 'all', function(e) { midiIn.addListener('controlchange', 'all', function(e) {
console.log("Received control change message:", e.controller.number, e.value); console.log("Received control change message:", e.controller.number, e.value);
controllerChange(e.controller.number, e.value) controllerChange(e.controller.number, e.value)
}); });
console.log(midiIn.name); console.log(midiIn.name);
select("#device").html(midiIn.name); select("#device").html(midiIn.name);
}; };
function noteOn(pitch, velocity) { function noteOn(pitch, velocity) {
totalNotesPlayed++; totalNotesPlayed++;
notesThisFrame++; notesThisFrame++;
totalIntensityScore += velocity; totalIntensityScore += velocity;
// piano visualizer // piano visualizer
isKeyOn[pitch] = velocity; isKeyOn[pitch] = velocity;
if (nowPedaling) { if (nowPedaling) {
isPedaled[pitch] = velocity; isPedaled[pitch] = velocity;
} }
} }
function noteOff(pitch, velocity) { function noteOff(pitch, _velocity) {
isKeyOn[pitch] = 0; isKeyOn[pitch] = 0;
} }
function controllerChange(number, value) { function controllerChange(number, value) {
// Receive a controllerChange // Receive a controllerChange
if (number == 64) { if (number == 64) {
cc64now = value; cc64now = value;
if (value >= 64) { if (value >= 64) {
nowPedaling = true; nowPedaling = true;
for (let i = 0; i < 128; i++) { for (let i = 0; i < 128; i++) {
// copy key on to pedal // copy key on to pedal
isPedaled[i] = isKeyOn[i]; isPedaled[i] = isKeyOn[i];
} }
} else if (value < 64) { } else if (value < 64) {
nowPedaling = false; nowPedaling = false;
for (let i = 0; i < 128; i++) { for (let i = 0; i < 128; i++) {
// reset isPedaled // reset isPedaled
isPedaled[i] = 0; isPedaled[i] = 0;
} }
}
} }
}
if (number == 67) { if (number == 67) {
cc67now = value; cc67now = value;
}
}
} }
function toggleRainbowMode(cb) { function toggleRainbowMode(cb) {
rainbowMode = cb.checked; rainbowMode = cb.checked;
if (rainbowMode) if (rainbowMode)
select('#colorpicker').attribute('disabled', true) select('#colorpicker').attribute('disabled', true)
else else
select('#colorpicker').removeAttribute('disabled') select('#colorpicker').removeAttribute('disabled')
} }
function toggleVelocityMode(cb) { function toggleVelocityMode(cb) {
velocityMode = cb.checked; velocityMode = cb.checked;
} }
function changeColor() { function changeColor() {
keyOnColor = color(select('#colorpicker').value()); keyOnColor = color(select('#colorpicker').value());
let darkenedColor = keyOnColor.levels.map(x => floor(x * .7)); let darkenedColor = keyOnColor.levels.map(x => floor(x * .7));
pedaledColor = color(`rgb(${darkenedColor[0]}, ${darkenedColor[1]}, ${darkenedColor[2]})`); pedaledColor = color(`rgb(${darkenedColor[0]}, ${darkenedColor[1]}, ${darkenedColor[2]})`);
} }

17
piano-visualizer.js
View file

@ -1,12 +1,11 @@
function setup() { function setup() {
createCanvas(1098, 118).parent('piano-visualizer'); createCanvas(1098, 118).parent('piano-visualizer');
colorMode(HSB, 360, 100, 100, 100); colorMode(HSB, 360, 100, 100, 100);
keyOnColor = color(326, 100, 100, 100); // <---- 編輯這裡換「按下時」的顏色！[HSB Color Mode] keyOnColor = color(326, 100, 100, 100); // <---- 編輯這裡換「按下時」的顏色！[HSB Color Mode]
pedaledColor = color(326, 100, 70, 100); // <---- 編輯這裡換「踏板踩住」的顏色！[HSB Color Mode] pedaledColor = color(326, 100, 70, 100); // <---- 編輯這裡換「踏板踩住」的顏色！[HSB Color Mode]
smooth(2); smooth(2);
frameRate(60); frameRate(60);
initKeys(); initKeys();
} }
function draw() { function draw() {
@ -14,9 +13,6 @@ function draw() {
pushHistories(); pushHistories();
drawWhiteKeys(); drawWhiteKeys();
drawBlackKeys(); drawBlackKeys();
// drawPedalLines();
// drawNotes();
drawTexts(); drawTexts();
} }
@ -93,12 +89,6 @@ function drawBlackKeys() {
if (isBlack[i % 12] > 0) { if (isBlack[i % 12] > 0) {
// it's a black key // it's a black key
if (velocityMode) { if (velocityMode) {
// let m = max(isKeyOn[i], isPedaled[i]) * .9 + .1;
// if ((isKeyOn[i] || isPedaled[i]) && !rainbowMode) {
// let darkenedColor = keyOnColor.levels.map(x => floor(x * m));
// fill(`rgb(${darkenedColor[0]}, ${darkenedColor[1]}, ${darkenedColor[2]})`); // keypressed
// } else if ((isKeyOn[i] || isPedaled[i]) && rainbowMode) {
// fill(map(i, 21, 108, 0, 1080) % 360, 100, 100 * m, 100); // rainbowMode
let m = max(isKeyOn[i], isPedaled[i]) * .9 + .1; let m = max(isKeyOn[i], isPedaled[i]) * .9 + .1;
if ((isKeyOn[i] || isPedaled[i]) && !rainbowMode) { if ((isKeyOn[i] || isPedaled[i]) && !rainbowMode) {
let whitenedColor = keyOnColor.levels.map(x => floor(x * m + 255 * (1 - m))); let whitenedColor = keyOnColor.levels.map(x => floor(x * m + 255 * (1 - m)));
@ -179,8 +169,6 @@ function pushHistories() {
notesThisFrame = 0; notesThisFrame = 0;
legatoHistory.push(isKeyOn.reduce((accumulator, currentValue) => accumulator + !!currentValue, 0)); legatoHistory.push(isKeyOn.reduce((accumulator, currentValue) => accumulator + !!currentValue, 0));
legatoHistory.shift(); legatoHistory.shift();
} }
function convertNumberToBars(number) { function convertNumberToBars(number) {
@ -236,7 +224,6 @@ function getPressedKeys(returnString = true) {
} else { } else {
return pressedKeys; return pressedKeys;
} }
} }
function truncateString(str, maxLength = 40) { function truncateString(str, maxLength = 40) {
@ -280,7 +267,7 @@ function mouseClicked() {
} }
if (mouseX > 441 && mouseX < 841) { if (mouseX > 441 && mouseX < 841) {
flatNames = !flatNames; // toggle flat flatNames = !flatNames; // toggle flat
} }
} }
console.log(mouseX, mouseY); console.log(mouseX, mouseY);