Congegni/sintonia
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

CC-2301 : waveform editors are now in their own separate pop up. controls working for fades/cues. should add more specific states for fade editor.

Browse source
This commit is contained in:
Naomi 2013-04-16 17:24:30 -04:00
parent 13c8e5f146
commit 0385285741
3 changed files with 58 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

8
airtime_mvc/application/layouts/scripts/layout.phtml
View file

@ -57,6 +57,14 @@
<script id="tmpl-pl-fades" type="text/template"> <script id="tmpl-pl-fades" type="text/template">
<div class="waveform-fades"> <div class="waveform-fades">
<div class="playlist-tracks"></div> <div class="playlist-tracks"></div>
<div>
<span class="btn_play ui-state-default">Play</span>
<span class="btn_stop ui-state-default">Stop</span>
</div>
<div>
<span class="btn_select ui-state-default" data-state="select">Select</span>
<span class="btn_shift ui-state-default" data-state="shift">Shift</span>
</div>
</div> </div>
</script> </script>
</body> </body>

28
airtime_mvc/public/js/airtime/library/spl.js
View file

@ -1064,10 +1064,6 @@ var AIRTIME = (function(AIRTIME){
mod.showFadesWaveform = function(e) { mod.showFadesWaveform = function(e) {
var $el = $(e.target), var $el = $(e.target),
$parent = $el.parent(), $parent = $el.parent(),
trackEditor = new TrackEditor(),
audioControls = new AudioControls(),
trackElem,
config,
$html = $($("#tmpl-pl-fades").html()), $html = $($("#tmpl-pl-fades").html()),
tracks = [ tracks = [
{ {
@ -1078,8 +1074,6 @@ var AIRTIME = (function(AIRTIME){
} }
]; ];
//$el.replaceWith(html);
$html.dialog({ $html.dialog({
modal: true, modal: true,
title: "Fade Editor", title: "Fade Editor",
@ -1090,10 +1084,10 @@ var AIRTIME = (function(AIRTIME){
buttons: [ buttons: [
//{text: "Submit", click: function() {doSomething()}}, //{text: "Submit", click: function() {doSomething()}},
{text: "Cancel", click: function() {$(this).dialog("close");}} {text: "Cancel", click: function() {$(this).dialog("close");}}
] ],
}); open: function (event, ui) {
config = new Config({ var config = new Config({
resolution: 15000, resolution: 15000,
state: "shift", state: "shift",
mono: true, mono: true,
@ -1105,23 +1099,19 @@ var AIRTIME = (function(AIRTIME){
var playlistEditor = new PlaylistEditor(); var playlistEditor = new PlaylistEditor();
playlistEditor.setConfig(config); playlistEditor.setConfig(config);
playlistEditor.init(tracks); playlistEditor.init(tracks);
}
});
}; };
mod.showCuesWaveform = function(e) { mod.showCuesWaveform = function(e) {
var $el = $(e.target), var $el = $(e.target),
$parent = $el.parent(), $parent = $el.parent(),
uri = $parent.data("uri"), uri = $parent.data("uri"),
trackEditor = new TrackEditor(),
audioControls = new AudioControls(),
trackElem,
config,
$html = $($("#tmpl-pl-cues").html()), $html = $($("#tmpl-pl-cues").html()),
tracks = [{ tracks = [{
src: uri src: uri
}]; }];
//$el.replaceWith(html);
$html.dialog({ $html.dialog({
modal: true, modal: true,
title: "Cue Editor", title: "Cue Editor",
@ -1132,10 +1122,10 @@ var AIRTIME = (function(AIRTIME){
buttons: [ buttons: [
//{text: "Submit", click: function() {doSomething()}}, //{text: "Submit", click: function() {doSomething()}},
{text: "Cancel", click: function() {$(this).dialog("close");}} {text: "Cancel", click: function() {$(this).dialog("close");}}
] ],
}); open: function (event, ui) {
config = new Config({ var config = new Config({
resolution: 15000, resolution: 15000,
mono: true, mono: true,
waveHeight: 80, waveHeight: 80,
@ -1146,6 +1136,8 @@ var AIRTIME = (function(AIRTIME){
var playlistEditor = new PlaylistEditor(); var playlistEditor = new PlaylistEditor();
playlistEditor.setConfig(config); playlistEditor.setConfig(config);
playlistEditor.init(tracks); playlistEditor.init(tracks);
}
});
}; };
mod.init = function() { mod.init = function() {

25
airtime_mvc/public/js/waveformplaylist/controls.js vendored
View file

@ -202,10 +202,10 @@ AudioControls.prototype.init = function(config) {
container = this.config.getContainer(); container = this.config.getContainer();
state = this.config.getState(); state = this.config.getState();
tmpBtn = document.getElementById("btn_"+state); tmpBtn = document.getElementsByClassName("btn_"+state)[0];
if (tmpBtn) { if (tmpBtn) {
tmpBtn.className = this.classes["btn-state-active"]; this.activateButton(tmpBtn);
} }
for (className in events) { for (className in events) {
@ -388,18 +388,27 @@ AudioControls.prototype.stopAudio = function() {
this.fire('stopaudio', this); this.fire('stopaudio', this);
}; };
AudioControls.prototype.setButtonState = function(el, classname) { AudioControls.prototype.activateButton = function(el) {
el && el.className = this.classes[classname]; if (el) {
el.classList.remove(this.classes["disabled"]);
el.classList.add(this.classes["active"]);
}
};
AudioControls.prototype.disableButton = function(el) {
if (el) {
el.classList.add(this.classes["disabled"]);
el.classList.remove(this.classes["active"]);
}
}; };
AudioControls.prototype.changeState = function(e) { AudioControls.prototype.changeState = function(e) {
var el = e.currentTarget, var el = e.currentTarget,
prevEl = el.parentElement.getElementsByClassName('active')[0],
state = el.dataset.state; state = el.dataset.state;
this.el.getElementsByClassName('active')[0].className = classes["btn-state-default"]; this.disableButton(prevEl);
this.activateButton(el);
this.setButtonState("btn-state-default");
this.setButtonState(el, "btn-state-active");
this.config.setState(state); this.config.setState(state);
this.fire('changestate', this); this.fire('changestate', this);