- 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

View file

@ -345,8 +345,10 @@ $(document).ready(function() {
var c = new Group({
children: [
//play button
new Path.Rectangle({
new Group({
name: 'play_btn',
children: [
new Path.Rectangle({
point: [vssw * 0.8, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.5, vssw * 0.7],
@ -355,6 +357,9 @@ $(document).ready(function() {
saturation: 1,
brightness: 1
}),
}),
plus.clone()
],
onMouseDown: function(event) {
var par = this.parent;
par._players.push(par._player.start()._source); // start playbacks and collect their '_source's..
@ -384,8 +389,10 @@ $(document).ready(function() {
fontWeight: 'bold'
}),
//stop button
new Path.Rectangle({
new Group({
name: 'stop_btn',
children: [
new Path.Rectangle({
point: [vssw * 2.9, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.6, vssw * 0.7],
@ -394,6 +401,9 @@ $(document).ready(function() {
saturation: 1,
brightness: 1
}),
}),
minus.clone()
],
onMouseDown: function() {
var par = this.parent;
if (par._players.length > 0) {
@ -413,8 +423,10 @@ $(document).ready(function() {
}
}),
//faster button
new Path.Rectangle({
new Group({
name: 'faster_btn',
children: [
new Path.Rectangle({
point: [vssw * 5.0, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.6, vssw * 0.7],
@ -424,6 +436,10 @@ $(document).ready(function() {
brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
faster.clone()
],
onMouseDown: function() {
var par = this.parent;
if (par._players.length > 0) {
@ -453,8 +469,10 @@ $(document).ready(function() {
fontWeight: 'bold'
}),
//slower button
new Path.Rectangle({
new Group({
name: 'slower_btn',
children: [
new Path.Rectangle({
point: [vssw * 7.8, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.6, vssw * 0.7],
@ -464,10 +482,17 @@ $(document).ready(function() {
brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
slower.clone()
],
onMouseDown: function() {
var par = this.parent;
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);
}
//
@ -487,19 +512,15 @@ $(document).ready(function() {
_init: function() {
this._player.loop = true;
this._player.retrigger = true;
// iconifying...
var fast = faster.clone().addTo(project);
fast.fitBounds(this.children.faster_btn.bounds);
fast.fillColor = "orange";
var slow = slower.clone().addTo(project);
slow.fitBounds(this.children.slower_btn.bounds);
slow.fillColor = "lime";
var player_increase = plus.clone().addTo(project);
player_increase.fitBounds(this.children.play_btn.bounds);
player_increase.fillColor = "#555";
var player_decrease = minus.clone().addTo(project);
player_decrease.fitBounds(this.children.stop_btn.bounds);
player_decrease.fillColor = "#555";
// set icons
this.children.play_btn.children[1].fitBounds(this.children.play_btn.children[0].bounds);
this.children.play_btn.children[1].fillColor = "#555";
this.children.stop_btn.children[1].fitBounds(this.children.stop_btn.children[0].bounds);
this.children.stop_btn.children[1].fillColor = "#555";
this.children.faster_btn.children[1].fitBounds(this.children.faster_btn.children[0].bounds);
this.children.faster_btn.children[1].fillColor = "orange";
this.children.slower_btn.children[1].fitBounds(this.children.slower_btn.children[0].bounds);
this.children.slower_btn.children[1].fillColor = "lime";
// positioning numberboxes...
this.children.playcounter.fitBounds(this.children.playcounterbox.bounds);
this.children.speedcounter.fitBounds(this.children.speedcounterbox.bounds);
@ -529,7 +550,10 @@ $(document).ready(function() {
}
} else if (msg.action == 'slower') {
if (that._players.length > 0) {
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);
}
}
@ -572,8 +596,10 @@ $(document).ready(function() {
var c = new Group({
children: [
//play button
new Path.Rectangle({
new Group({
name: 'play_btn',
children: [
new Path.Rectangle({
point: [vssw * 0.8, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.5, vssw * 0.7],
@ -582,6 +608,9 @@ $(document).ready(function() {
saturation: 1,
brightness: 1
}),
}),
plus.clone()
],
onMouseDown: function(event) {
var par = this.parent;
par._players.push(par._player.start()._source); // start playbacks and collect their '_source's..
@ -611,8 +640,10 @@ $(document).ready(function() {
fontWeight: 'bold'
}),
//stop button
new Path.Rectangle({
new Group({
name: 'stop_btn',
children: [
new Path.Rectangle({
point: [vssw * 2.9, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.6, vssw * 0.7],
@ -621,6 +652,9 @@ $(document).ready(function() {
saturation: 1,
brightness: 1
}),
}),
minus.clone()
],
onMouseDown: function() {
var par = this.parent;
if (par._players.length > 0) {
@ -640,8 +674,10 @@ $(document).ready(function() {
}
}),
//faster button
new Path.Rectangle({
new Group({
name: 'faster_btn',
children: [
new Path.Rectangle({
point: [vssw * 5.0, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.6, vssw * 0.7],
@ -651,6 +687,10 @@ $(document).ready(function() {
brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
faster.clone()
],
onMouseDown: function() {
var par = this.parent;
if (par._players.length > 0) {
@ -680,8 +720,10 @@ $(document).ready(function() {
fontWeight: 'bold'
}),
//slower button
new Path.Rectangle({
new Group({
name: 'slower_btn',
children: [
new Path.Rectangle({
point: [vssw * 7.8, row * vssw * 1.4 + vssw * 3.5],
radius: vssw * 0.4,
size: [vssw * 1.6, vssw * 0.7],
@ -691,10 +733,17 @@ $(document).ready(function() {
brightness: 1
}),
strokeWidth : vssw * 0.03,
fillColor: "#555"
}),
slower.clone()
],
onMouseDown: function() {
var par = this.parent;
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);
}
//
@ -714,19 +763,15 @@ $(document).ready(function() {
_init: function() {
this._player.loop = true;
this._player.retrigger = true;
// iconifying...
var fast = faster.clone().addTo(project);
fast.fitBounds(this.children.faster_btn.bounds);
fast.fillColor = "orange";
var slow = slower.clone().addTo(project);
slow.fitBounds(this.children.slower_btn.bounds);
slow.fillColor = "lime";
var player_increase = plus.clone().addTo(project);
player_increase.fitBounds(this.children.play_btn.bounds);
player_increase.fillColor = "#555";
var player_decrease = minus.clone().addTo(project);
player_decrease.fitBounds(this.children.stop_btn.bounds);
player_decrease.fillColor = "#555";
// set icons
this.children.play_btn.children[1].fitBounds(this.children.play_btn.children[0].bounds);
this.children.play_btn.children[1].fillColor = "#555";
this.children.stop_btn.children[1].fitBounds(this.children.stop_btn.children[0].bounds);
this.children.stop_btn.children[1].fillColor = "#555";
this.children.faster_btn.children[1].fitBounds(this.children.faster_btn.children[0].bounds);
this.children.faster_btn.children[1].fillColor = "orange";
this.children.slower_btn.children[1].fitBounds(this.children.slower_btn.children[0].bounds);
this.children.slower_btn.children[1].fillColor = "lime";
// positioning numberboxes...
this.children.playcounter.fitBounds(this.children.playcounterbox.bounds);
this.children.speedcounter.fitBounds(this.children.speedcounterbox.bounds);
@ -756,7 +801,10 @@ $(document).ready(function() {
}
} else if (msg.action == 'slower') {
if (that._players.length > 0) {
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);
}
}