123 lines
3.5 KiB
JavaScript
123 lines
3.5 KiB
JavaScript
/* global Tone Nexus */
|
|
|
|
function Sample(arg) {
|
|
//ui
|
|
this.div = document.getElementById(arg.ui);
|
|
this.div.innerHTML += `
|
|
<div style="float:left">
|
|
<div nexus-ui="button" id="${arg.ui}-playbutton" style="width:80px;height:70px;margin-top:10px;"></div>
|
|
<div class="label" style="width:80px;margin-top:10px;">${arg.label}</div>
|
|
</div>
|
|
<div style="float:left">
|
|
<div nexus-ui="dial" id="${arg.ui}-volume" style="width:80px;height:70px;margin-top:10px;"></div>
|
|
<div class="label" style="width:80px;margin-top:10px;">볼륨</div>
|
|
<!--<div nexus-ui="number" id="${arg.ui}-volumenumber" style="width:60px;margin:10px;"></div>-->
|
|
</div>
|
|
<div style="float:left">
|
|
<div nexus-ui="dial" id="${arg.ui}-reverb" style="width:80px;height:70px;margin-top:10px;"></div>
|
|
<div class="label" style="width:80px;margin-top:10px;">리버브</div>
|
|
<!--<div nexus-ui="number" id="${arg.ui}-reverbnumber" style="width:60px;margin:10px;"></div>-->
|
|
</div>
|
|
`;
|
|
|
|
//build the rack
|
|
this.rack = new Nexus.Rack(arg.ui);
|
|
//recollect components
|
|
this.button = this.rack[arg.ui + '-playbutton'];
|
|
this.volume = this.rack[arg.ui + '-volume'];
|
|
// this.volumenumber = this.rack[arg.ui + '-volumenumber'];
|
|
this.reverb = this.rack[arg.ui + '-reverb'];
|
|
// this.reverbnumber = this.rack[arg.ui + '-reverbnumber'];
|
|
|
|
//presets
|
|
this.button.mode = "toggle";
|
|
this.button.state = false;
|
|
this.volume.min = -20;
|
|
this.volume.max = 0;
|
|
this.volume.value = -20;
|
|
this.volume.interaction = "vertical"; // this doesn't work. TBD.. sth. is wrong!
|
|
// this.volumenumber.link(this.volume);
|
|
this.reverb.min = 0;
|
|
this.reverb.max = 1;
|
|
this.reverb.value = 0;
|
|
this.reverb.interaction = "vertical"; // this doesn't work. TBD.. sth. is wrong!
|
|
// this.reverbnumber.link(this.reverb);
|
|
|
|
//colors
|
|
this.rack.colorize("accent","#00DCD8");
|
|
this.rack.colorize("fill","#2B5EA3");
|
|
|
|
// states
|
|
if (arg.type == 'loop') {
|
|
this.loop = true;
|
|
this.autostart = true;
|
|
} else if (arg.type == 'oneshot') {
|
|
this.loop = false;
|
|
this.autostart = false;
|
|
}
|
|
|
|
// volume(gain) -> [Main output]
|
|
this.vol = new Tone.Volume().toDestination();
|
|
this.vol.mute = true;
|
|
this.volume.on(
|
|
"change",
|
|
function (v) {
|
|
this.vol.volume.value = v;
|
|
if (v == -20) this.vol.mute = true;
|
|
else this.vol.mute = false;
|
|
}.bind(this)
|
|
);
|
|
|
|
// reverb(fx) -> volume(gain)
|
|
this.rev = new Tone.Reverb().connect(this.vol);
|
|
this.rev.wet.value = 0;
|
|
this.reverb.on(
|
|
"change",
|
|
function (v) {
|
|
this.rev.wet.value = v;
|
|
}.bind(this)
|
|
);
|
|
|
|
// source -> reverb(fx)
|
|
if (this.autostart) this.button.turnOn();
|
|
this.player = new Tone.Player({
|
|
url: arg.url,
|
|
loop: this.loop,
|
|
autostart: this.autostart,
|
|
fadeIn: 5,
|
|
fadeOut: 5,
|
|
onstop: () => this.button.turnOff()
|
|
}).connect(this.rev);
|
|
this.button.on(
|
|
"change",
|
|
function (v) {
|
|
if (v) this.player.start();
|
|
else this.player.stop();
|
|
}.bind(this)
|
|
);
|
|
}
|
|
|
|
//script
|
|
|
|
var samplers = [];
|
|
|
|
//index - 0
|
|
samplers.push(new Sample({
|
|
label: "1층 로비",
|
|
ui: "ambience-lobby",
|
|
type: 'loop',
|
|
url: "https://cdn.glitch.com/d050ca58-b6d2-4626-bc1e-2bf21f831cec%2F1%20mercury%20per.mp3?v=1629789592780",
|
|
}));
|
|
|
|
//index - 1
|
|
samplers.push(new Sample({
|
|
label: "1층 전시실",
|
|
ui: "ambience-exhibit-hall1",
|
|
type: 'oneshot',
|
|
url: "https://cdn.glitch.com/d050ca58-b6d2-4626-bc1e-2bf21f831cec%2F4%20jupiter%20arp.mp3?v=1629789594247",
|
|
}));
|
|
|
|
//live scripts
|
|
samplers[0].volume.value = -10;
|
|
samplers[1].volume.value = -10;
|