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.
This commit is contained in:
parent
13c8e5f146
commit
0385285741
3 changed files with 58 additions and 49 deletions
|
@ -57,6 +57,14 @@
|
|||
<script id="tmpl-pl-fades" type="text/template">
|
||||
<div class="waveform-fades">
|
||||
<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>
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
@ -1064,10 +1064,6 @@ var AIRTIME = (function(AIRTIME){
|
|||
mod.showFadesWaveform = function(e) {
|
||||
var $el = $(e.target),
|
||||
$parent = $el.parent(),
|
||||
trackEditor = new TrackEditor(),
|
||||
audioControls = new AudioControls(),
|
||||
trackElem,
|
||||
config,
|
||||
$html = $($("#tmpl-pl-fades").html()),
|
||||
tracks = [
|
||||
{
|
||||
|
@ -1078,8 +1074,6 @@ var AIRTIME = (function(AIRTIME){
|
|||
}
|
||||
];
|
||||
|
||||
//$el.replaceWith(html);
|
||||
|
||||
$html.dialog({
|
||||
modal: true,
|
||||
title: "Fade Editor",
|
||||
|
@ -1090,10 +1084,10 @@ var AIRTIME = (function(AIRTIME){
|
|||
buttons: [
|
||||
//{text: "Submit", click: function() {doSomething()}},
|
||||
{text: "Cancel", click: function() {$(this).dialog("close");}}
|
||||
]
|
||||
});
|
||||
],
|
||||
open: function (event, ui) {
|
||||
|
||||
config = new Config({
|
||||
var config = new Config({
|
||||
resolution: 15000,
|
||||
state: "shift",
|
||||
mono: true,
|
||||
|
@ -1105,23 +1099,19 @@ var AIRTIME = (function(AIRTIME){
|
|||
var playlistEditor = new PlaylistEditor();
|
||||
playlistEditor.setConfig(config);
|
||||
playlistEditor.init(tracks);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
mod.showCuesWaveform = function(e) {
|
||||
var $el = $(e.target),
|
||||
$parent = $el.parent(),
|
||||
uri = $parent.data("uri"),
|
||||
trackEditor = new TrackEditor(),
|
||||
audioControls = new AudioControls(),
|
||||
trackElem,
|
||||
config,
|
||||
$html = $($("#tmpl-pl-cues").html()),
|
||||
tracks = [{
|
||||
src: uri
|
||||
}];
|
||||
|
||||
//$el.replaceWith(html);
|
||||
|
||||
$html.dialog({
|
||||
modal: true,
|
||||
title: "Cue Editor",
|
||||
|
@ -1132,10 +1122,10 @@ var AIRTIME = (function(AIRTIME){
|
|||
buttons: [
|
||||
//{text: "Submit", click: function() {doSomething()}},
|
||||
{text: "Cancel", click: function() {$(this).dialog("close");}}
|
||||
]
|
||||
});
|
||||
],
|
||||
open: function (event, ui) {
|
||||
|
||||
config = new Config({
|
||||
var config = new Config({
|
||||
resolution: 15000,
|
||||
mono: true,
|
||||
waveHeight: 80,
|
||||
|
@ -1146,6 +1136,8 @@ var AIRTIME = (function(AIRTIME){
|
|||
var playlistEditor = new PlaylistEditor();
|
||||
playlistEditor.setConfig(config);
|
||||
playlistEditor.init(tracks);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
mod.init = function() {
|
||||
|
|
|
@ -202,10 +202,10 @@ AudioControls.prototype.init = function(config) {
|
|||
container = this.config.getContainer();
|
||||
state = this.config.getState();
|
||||
|
||||
tmpBtn = document.getElementById("btn_"+state);
|
||||
tmpBtn = document.getElementsByClassName("btn_"+state)[0];
|
||||
|
||||
if (tmpBtn) {
|
||||
tmpBtn.className = this.classes["btn-state-active"];
|
||||
this.activateButton(tmpBtn);
|
||||
}
|
||||
|
||||
for (className in events) {
|
||||
|
@ -388,18 +388,27 @@ AudioControls.prototype.stopAudio = function() {
|
|||
this.fire('stopaudio', this);
|
||||
};
|
||||
|
||||
AudioControls.prototype.setButtonState = function(el, classname) {
|
||||
el && el.className = this.classes[classname];
|
||||
AudioControls.prototype.activateButton = function(el) {
|
||||
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) {
|
||||
var el = e.currentTarget,
|
||||
prevEl = el.parentElement.getElementsByClassName('active')[0],
|
||||
state = el.dataset.state;
|
||||
|
||||
this.el.getElementsByClassName('active')[0].className = classes["btn-state-default"];
|
||||
|
||||
this.setButtonState("btn-state-default");
|
||||
this.setButtonState(el, "btn-state-active");
|
||||
this.disableButton(prevEl);
|
||||
this.activateButton(el);
|
||||
|
||||
this.config.setState(state);
|
||||
this.fire('changestate', this);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue