Skip to content

Commit

Permalink
Fixed piano roll canvas resize (#60).
Browse files Browse the repository at this point in the history
  • Loading branch information
@gogins
gogins committed Mar 13, 2024
1 parent adf0001 commit ceedc6c
Show file tree
Hide file tree
Showing 2 changed files with 66 additions and 67 deletions.
21 changes: 10 additions & 11 deletions music/NYCEMF-2024/Silencio.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -803,18 +803,17 @@ if (typeof console === 'undefined') {
this.scene.add(light);
var light2 = new THREE.AmbientLight(0x404040, 0.5);
this.scene.add(light2);
var onResize = function() {
canvas.width = canvas.clientWidth;
canvas.height = canvas.clientHeight;
this.renderer.setViewport(0, 0, canvas.clientWidth, canvas.clientHeight);
this.camera.aspect = canvas.clientWidth / canvas.clientHeight;
this.controls.handleResize();
this.camera.updateProjectionMatrix();
this.renderer.render(this.scene, this.camera);
};
window.addEventListener('resize', onResize, false);
window.addEventListener('resize', ((event) => this.onResize(event)), false);
};
onResize = function(event) {
this.canvas.width = this.canvas.clientWidth;
this.canvas.height = this.canvas.clientHeight;
this.renderer.setViewport(0, 0, this.canvas.clientWidth, this.canvas.clientHeight);
this.camera.aspect = this.canvas.clientWidth / this.canvas.clientHeight;
this.controls.handleResize();
this.camera.updateProjectionMatrix();
this.renderer.render(this.scene, this.camera);
};

/**
* Adds the note to the 3D scene. Can be used with a fixed or a real-time score.
*/
Expand Down
112 changes: 56 additions & 56 deletions music/NYCEMF-2024/cloud-5.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -220,77 +220,77 @@ class Cloud5Piece extends HTMLElement {
host.csound_message_callback(message);
}
let menu_item_play = document.querySelector('#menu_item_play');
menu_item_play.onclick = function (event) {
menu_item_play.onclick = ((event) => {
console.log("menu_item_play click...");
host.show(host.piano_roll_overlay)
host.hide(host.strudel_overlay);
// host.hide(host.shader_overlay);
host.hide(host.log_overlay);
host.hide(host.about_overlay);
host.render(false);
};
this.show(host.piano_roll_overlay)
this.hide(this.strudel_overlay);
// this.hide(this.shader_overlay);
this.hide(this.log_overlay);
this.hide(this.about_overlay);
this.render(false);
});
let menu_item_render = document.querySelector('#menu_item_render');
menu_item_render.onclick = function (event) {
menu_item_render.onclick = ((event) => {
console.log("menu_item_render click...");
host.show(host.piano_roll_overlay)
host.hide(host.strudel_overlay);
// host.hide(host.shader_overlay);
host.hide(host.log_overlay);
host.hide(host.about_overlay);
host.render(true);
};
this.show(this.piano_roll_overlay)
this.hide(this.strudel_overlay);
// this.hide(this.shader_overlay);
this.hide(this.log_overlay);
this.hide(this.about_overlay);
this.render(true);
});
let menu_item_stop = document.querySelector('#menu_item_stop');
menu_item_stop.onclick = function (event) {
menu_item_stop.onclick = ((event) => {
console.log("menu_item_stop click...");
host.stop();
};
this.stop();
});
let menu_item_fullscreen = document.querySelector('#menu_item_fullscreen');
menu_item_fullscreen.onclick = function (event) {
menu_item_fullscreen.onclick = ((event) => {
console.log("menu_item_fullscreen click...");
if (host.piano_roll_overlay.requestFullscreen) {
host.piano_roll_overlay.requestFullscreen();
} else if (host.piano_roll_overlay.webkitRequestFullscreen) {
host.piano_roll_overlay.webkitRequestFullscreen();
if (this.piano_roll_overlay.requestFullscreen) {
this.piano_roll_overlay.requestFullscreen();
} else if (this.piano_roll_overlay.webkitRequestFullscreen) {
this.piano_roll_overlay.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) {
host.piano_roll_overlay.msRequestFullscreen();
}
};
this.piano_roll_overlay.msRequestFullscreen();
};
});
let menu_item_strudel = document.querySelector('#menu_item_strudel');
menu_item_strudel.onclick = function (event) {
menu_item_strudel.onclick = ((event) => {
console.log("menu_item_strudel click...");
host.hide(host.piano_roll_overlay)
host.toggle(host.strudel_overlay);
// host.hide(host.shader_overlay);
// host.hide(host.log_overlay);
host.hide(host.about_overlay);
};
this.hide(this.piano_roll_overlay)
this.toggle(this.strudel_overlay);
// this.hide(this.shader_overlay);
// this.hide(this.log_overlay);
this.hide(this.about_overlay);
});
let menu_item_piano_roll = document.querySelector('#menu_item_piano_roll');
menu_item_piano_roll.onclick = function (event) {
menu_item_piano_roll.onclick = ((evemt) => {
console.log("menu_item_piano_roll click...");
host.toggle(host.piano_roll_overlay)
host.hide(host.strudel_overlay);
// host.hide(host.shader_overlay);
// host.hide(host.log_overlay);
host.hide(host.about_overlay);
};
this.toggle(this.piano_roll_overlay)
this.hide(this.strudel_overlay);
// this.hide(this.shader_overlay);
// this.hide(this.log_overlay);
this.hide(this.about_overlay);
});
let menu_item_log = document.querySelector('#menu_item_log');
menu_item_log.onclick = function (event) {
menu_item_log.onclick = ((event) => {
console.log("menu_item_log click...");
//host.show(host.piano_roll_overlay)
host.hide(host.strudel_overlay);
//host.hide(host.shader_overlay);
host.toggle(host.log_overlay);
host.hide(host.about_overlay);
};
//this.show(this.piano_roll_overlay)
this.hide(this.strudel_overlay);
//this.hide(this.shader_overlay);
this.toggle(this.log_overlay);
this.hide(this.about_overlay);
});
let menu_item_about = document.querySelector('#menu_item_about');
menu_item_about.onclick = function (event) {
menu_item_about.onclick = ((event) => {
console.log("menu_item_about click...");
host.hide(host.piano_roll_overlay)
host.hide(host.strudel_overlay);
///host.hide(host.shader_overlay);
host.hide(host.log_overlay);
host.toggle(host.about_overlay);
};
this.hide(this.piano_roll_overlay)
this.hide(this.strudel_overlay);
///this.hide(this.shader_overlay);
this.hide(this.log_overlay);
this.toggle(this.about_overlay);
});
// Ensure that the dat.gui controls are children of the _Controls_ button.
let dat_gui_parameters = { autoPlace: false, closeOnTop: true, closed: true, width: 400, useLocalStorage: false };
this.gui = new dat.GUI(dat_gui_parameters);
Expand Down Expand Up @@ -857,7 +857,7 @@ class Cloud5ShaderToy extends HTMLElement {
this.gl.enable(this.gl.DEPTH_TEST);
this.gl.clearColor(0.0, 0.0, 0.0, 1.0);
///write_audio_texture(analyser, channel0_texture_unit, channel0_texture, channel0_sampler);
window.onresize = this.resize;
window.onresize = ((event) => this.resize(event));
this.resize();
requestAnimationFrame((milliseconds) => this.render_frame(milliseconds));
}
Expand Down

0 comments on commit ceedc6c

Please sign in to comment.