doohoyi/sound-mixing-bowl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

bug fix.

Browse source 
- use Groups to make buttons work normal way
This commit is contained in:
Dooho Yi 2020-05-20 01:10:55 +09:00
parent b2c9cf843f
commit 910e8b807c
1 changed files with 154 additions and 106 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

260
public/a1/conductor/index.js
View file

@ -345,16 +345,21 @@ $(document).ready(function() {
var c = new Group({ var c = new Group({
children: [ children: [
//play button //play button
new Path.Rectangle({ new Group({
name: 'play_btn', name: 'play_btn',
point: [vssw * 0.8, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.5, vssw * 0.7], point: [vssw * 0.8, row * vssw * 1.4 + vssw * 3.5],
fillColor: new Color({ radius: vssw * 0.4,
hue: getRandom(20, 60), size: [vssw * 1.5, vssw * 0.7],
saturation: 1, fillColor: new Color({
brightness: 1 hue: getRandom(20, 60),
}), saturation: 1,
brightness: 1
}),
}),
plus.clone()
],
onMouseDown: function(event) { onMouseDown: function(event) {
var par = this.parent; var par = this.parent;
par._players.push(par._player.start()._source); // start playbacks and collect their '_source's.. par._players.push(par._player.start()._source); // start playbacks and collect their '_source's..
@ -384,16 +389,21 @@ $(document).ready(function() {
fontWeight: 'bold' fontWeight: 'bold'
}), }),
//stop button //stop button
new Path.Rectangle({ new Group({
name: 'stop_btn', name: 'stop_btn',
point: [vssw * 2.9, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.6, vssw * 0.7], point: [vssw * 2.9, row * vssw * 1.4 + vssw * 3.5],
fillColor: new Color({ radius: vssw * 0.4,
hue: getRandom(120, 180), size: [vssw * 1.6, vssw * 0.7],
saturation: 1, fillColor: new Color({
brightness: 1 hue: getRandom(120, 180),
}), saturation: 1,
brightness: 1
}),
}),
minus.clone()
],
onMouseDown: function() { onMouseDown: function() {
var par = this.parent; var par = this.parent;
if (par._players.length > 0) { if (par._players.length > 0) {
@ -413,17 +423,23 @@ $(document).ready(function() {
} }
}), }),
//faster button //faster button
new Path.Rectangle({ new Group({
name: 'faster_btn', name: 'faster_btn',
point: [vssw * 5.0, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.6, vssw * 0.7], point: [vssw * 5.0, row * vssw * 1.4 + vssw * 3.5],
strokeColor: new Color({ radius: vssw * 0.4,
hue: getRandom(20, 60), size: [vssw * 1.6, vssw * 0.7],
saturation: 1, strokeColor: new Color({
brightness: 1 hue: getRandom(20, 60),
}), saturation: 1,
strokeWidth : vssw * 0.03, brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
faster.clone()
],
onMouseDown: function() { onMouseDown: function() {
var par = this.parent; var par = this.parent;
if (par._players.length > 0) { if (par._players.length > 0) {
@ -453,21 +469,30 @@ $(document).ready(function() {
fontWeight: 'bold' fontWeight: 'bold'
}), }),
//slower button //slower button
new Path.Rectangle({ new Group({
name: 'slower_btn', name: 'slower_btn',
point: [vssw * 7.8, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.6, vssw * 0.7], point: [vssw * 7.8, row * vssw * 1.4 + vssw * 3.5],
strokeColor: new Color({ radius: vssw * 0.4,
hue: getRandom(120, 180), size: [vssw * 1.6, vssw * 0.7],
saturation: 1, strokeColor: new Color({
brightness: 1 hue: getRandom(120, 180),
}), saturation: 1,
strokeWidth : vssw * 0.03, brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
slower.clone()
],
onMouseDown: function() { onMouseDown: function() {
var par = this.parent; var par = this.parent;
if (par._players.length > 0) { if (par._players.length > 0) {
par._players[par._players.length - 1].playbackRate.value -= 0.2; var val = par._players[par._players.length - 1].playbackRate.value;
if (val > 0.2) {
par._players[par._players.length - 1].playbackRate.value = val - 0.2;
}
par.children.speedcounter.content = Number.parseFloat(par._players[par._players.length - 1].playbackRate.value).toFixed(1); par.children.speedcounter.content = Number.parseFloat(par._players[par._players.length - 1].playbackRate.value).toFixed(1);
} }
// //
@ -487,19 +512,15 @@ $(document).ready(function() {
_init: function() { _init: function() {
this._player.loop = true; this._player.loop = true;
this._player.retrigger = true; this._player.retrigger = true;
// iconifying... // set icons
var fast = faster.clone().addTo(project); this.children.play_btn.children[1].fitBounds(this.children.play_btn.children[0].bounds);
fast.fitBounds(this.children.faster_btn.bounds); this.children.play_btn.children[1].fillColor = "#555";
fast.fillColor = "orange"; this.children.stop_btn.children[1].fitBounds(this.children.stop_btn.children[0].bounds);
var slow = slower.clone().addTo(project); this.children.stop_btn.children[1].fillColor = "#555";
slow.fitBounds(this.children.slower_btn.bounds); this.children.faster_btn.children[1].fitBounds(this.children.faster_btn.children[0].bounds);
slow.fillColor = "lime"; this.children.faster_btn.children[1].fillColor = "orange";
var player_increase = plus.clone().addTo(project); this.children.slower_btn.children[1].fitBounds(this.children.slower_btn.children[0].bounds);
player_increase.fitBounds(this.children.play_btn.bounds); this.children.slower_btn.children[1].fillColor = "lime";
player_increase.fillColor = "#555";
var player_decrease = minus.clone().addTo(project);
player_decrease.fitBounds(this.children.stop_btn.bounds);
player_decrease.fillColor = "#555";
// positioning numberboxes... // positioning numberboxes...
this.children.playcounter.fitBounds(this.children.playcounterbox.bounds); this.children.playcounter.fitBounds(this.children.playcounterbox.bounds);
this.children.speedcounter.fitBounds(this.children.speedcounterbox.bounds); this.children.speedcounter.fitBounds(this.children.speedcounterbox.bounds);
@ -529,7 +550,10 @@ $(document).ready(function() {
} }
} else if (msg.action == 'slower') { } else if (msg.action == 'slower') {
if (that._players.length > 0) { if (that._players.length > 0) {
that._players[that._players.length - 1].playbackRate.value -= 0.2; var val = that._players[that._players.length - 1].playbackRate.value;
if (val > 0.2) {
that._players[that._players.length - 1].playbackRate.value -= 0.2;
}
that.children.speedcounter.content = Number.parseFloat(that._players[that._players.length - 1].playbackRate.value).toFixed(1); that.children.speedcounter.content = Number.parseFloat(that._players[that._players.length - 1].playbackRate.value).toFixed(1);
} }
} }
@ -572,16 +596,21 @@ $(document).ready(function() {
var c = new Group({ var c = new Group({
children: [ children: [
//play button //play button
new Path.Rectangle({ new Group({
name: 'play_btn', name: 'play_btn',
point: [vssw * 0.8, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.5, vssw * 0.7], point: [vssw * 0.8, row * vssw * 1.4 + vssw * 3.5],
fillColor: new Color({ radius: vssw * 0.4,
hue: getRandom(20, 60), size: [vssw * 1.5, vssw * 0.7],
saturation: 1, fillColor: new Color({
brightness: 1 hue: getRandom(20, 60),
}), saturation: 1,
brightness: 1
}),
}),
plus.clone()
],
onMouseDown: function(event) { onMouseDown: function(event) {
var par = this.parent; var par = this.parent;
par._players.push(par._player.start()._source); // start playbacks and collect their '_source's.. par._players.push(par._player.start()._source); // start playbacks and collect their '_source's..
@ -611,16 +640,21 @@ $(document).ready(function() {
fontWeight: 'bold' fontWeight: 'bold'
}), }),
//stop button //stop button
new Path.Rectangle({ new Group({
name: 'stop_btn', name: 'stop_btn',
point: [vssw * 2.9, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.6, vssw * 0.7], point: [vssw * 2.9, row * vssw * 1.4 + vssw * 3.5],
fillColor: new Color({ radius: vssw * 0.4,
hue: getRandom(120, 180), size: [vssw * 1.6, vssw * 0.7],
saturation: 1, fillColor: new Color({
brightness: 1 hue: getRandom(120, 180),
}), saturation: 1,
brightness: 1
}),
}),
minus.clone()
],
onMouseDown: function() { onMouseDown: function() {
var par = this.parent; var par = this.parent;
if (par._players.length > 0) { if (par._players.length > 0) {
@ -640,17 +674,23 @@ $(document).ready(function() {
} }
}), }),
//faster button //faster button
new Path.Rectangle({ new Group({
name: 'faster_btn', name: 'faster_btn',
point: [vssw * 5.0, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.6, vssw * 0.7], point: [vssw * 5.0, row * vssw * 1.4 + vssw * 3.5],
strokeColor: new Color({ radius: vssw * 0.4,
hue: getRandom(20, 60), size: [vssw * 1.6, vssw * 0.7],
saturation: 1, strokeColor: new Color({
brightness: 1 hue: getRandom(20, 60),
}), saturation: 1,
strokeWidth : vssw * 0.03, brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
faster.clone()
],
onMouseDown: function() { onMouseDown: function() {
var par = this.parent; var par = this.parent;
if (par._players.length > 0) { if (par._players.length > 0) {
@ -680,21 +720,30 @@ $(document).ready(function() {
fontWeight: 'bold' fontWeight: 'bold'
}), }),
//slower button //slower button
new Path.Rectangle({ new Group({
name: 'slower_btn', name: 'slower_btn',
point: [vssw * 7.8, row * vssw * 1.4 + vssw * 3.5], children: [
radius: vssw * 0.4, new Path.Rectangle({
size: [vssw * 1.6, vssw * 0.7], point: [vssw * 7.8, row * vssw * 1.4 + vssw * 3.5],
strokeColor: new Color({ radius: vssw * 0.4,
hue: getRandom(120, 180), size: [vssw * 1.6, vssw * 0.7],
saturation: 1, strokeColor: new Color({
brightness: 1 hue: getRandom(120, 180),
}), saturation: 1,
strokeWidth : vssw * 0.03, brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
slower.clone()
],
onMouseDown: function() { onMouseDown: function() {
var par = this.parent; var par = this.parent;
if (par._players.length > 0) { if (par._players.length > 0) {
par._players[par._players.length - 1].playbackRate.value -= 0.2; var val = par._players[par._players.length - 1].playbackRate.value;
if (val > 0.2) {
par._players[par._players.length - 1].playbackRate.value = val - 0.2;
}
par.children.speedcounter.content = Number.parseFloat(par._players[par._players.length - 1].playbackRate.value).toFixed(1); par.children.speedcounter.content = Number.parseFloat(par._players[par._players.length - 1].playbackRate.value).toFixed(1);
} }
// //
@ -714,19 +763,15 @@ $(document).ready(function() {
_init: function() { _init: function() {
this._player.loop = true; this._player.loop = true;
this._player.retrigger = true; this._player.retrigger = true;
// iconifying... // set icons
var fast = faster.clone().addTo(project); this.children.play_btn.children[1].fitBounds(this.children.play_btn.children[0].bounds);
fast.fitBounds(this.children.faster_btn.bounds); this.children.play_btn.children[1].fillColor = "#555";
fast.fillColor = "orange"; this.children.stop_btn.children[1].fitBounds(this.children.stop_btn.children[0].bounds);
var slow = slower.clone().addTo(project); this.children.stop_btn.children[1].fillColor = "#555";
slow.fitBounds(this.children.slower_btn.bounds); this.children.faster_btn.children[1].fitBounds(this.children.faster_btn.children[0].bounds);
slow.fillColor = "lime"; this.children.faster_btn.children[1].fillColor = "orange";
var player_increase = plus.clone().addTo(project); this.children.slower_btn.children[1].fitBounds(this.children.slower_btn.children[0].bounds);
player_increase.fitBounds(this.children.play_btn.bounds); this.children.slower_btn.children[1].fillColor = "lime";
player_increase.fillColor = "#555";
var player_decrease = minus.clone().addTo(project);
player_decrease.fitBounds(this.children.stop_btn.bounds);
player_decrease.fillColor = "#555";
// positioning numberboxes... // positioning numberboxes...
this.children.playcounter.fitBounds(this.children.playcounterbox.bounds); this.children.playcounter.fitBounds(this.children.playcounterbox.bounds);
this.children.speedcounter.fitBounds(this.children.speedcounterbox.bounds); this.children.speedcounter.fitBounds(this.children.speedcounterbox.bounds);
@ -756,7 +801,10 @@ $(document).ready(function() {
} }
} else if (msg.action == 'slower') { } else if (msg.action == 'slower') {
if (that._players.length > 0) { if (that._players.length > 0) {
that._players[that._players.length - 1].playbackRate.value -= 0.2; var val = that._players[that._players.length - 1].playbackRate.value;
if (val > 0.2) {
that._players[that._players.length - 1].playbackRate.value -= 0.2;
}
that.children.speedcounter.content = Number.parseFloat(that._players[that._players.length - 1].playbackRate.value).toFixed(1); that.children.speedcounter.content = Number.parseFloat(that._players[that._players.length - 1].playbackRate.value).toFixed(1);
} }
} }