13
0
livetrax/share/web_surfaces/builtin/mixer/js/tkwidget.js

347 lines
6.7 KiB
JavaScript
Raw Normal View History

2020-06-21 17:29:27 -04:00
/*
* Copyright © 2020 Luciano Iam <lucianito@gmail.com>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 2 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License along
* with this program; if not, write to the Free Software Foundation, Inc.,
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
*/
import loadToolkit from './tkloader.js';
import { BaseWidget, BaseContainer, BaseDialog, BaseControl } from './widget.js';
export async function createRootContainer () {
await loadToolkit();
const root = new Container();
root.tk = new TK.Root({id: 'root'});
document.body.appendChild(root.element);
return root;
}
2020-09-05 07:12:04 -04:00
class TkWidget extends BaseWidget {
constructor (tk) {
super();
this.tk = tk;
}
get element () {
return this.tk.element;
}
}
2020-09-05 07:12:04 -04:00
class TkControl extends BaseControl {
2020-06-21 17:29:27 -04:00
constructor (tk) {
super();
this.tk = tk;
}
2020-06-21 17:29:27 -04:00
get element () {
return this.tk.element;
}
}
2020-09-05 07:12:04 -04:00
class TkRangeControl extends TkControl {
2020-06-21 17:29:27 -04:00
constructor (tk) {
super(tk);
2020-06-21 17:29:27 -04:00
this.tk = tk;
this.lastValue = NaN;
this.tk.add_event('useraction', (name, value) => {
if ((name == 'value') && (this.lastValue != value)) {
this.lastValue = value;
this.callback(value);
}
});
}
get value () {
return this.tk.get('value');
}
set value (val) {
this.tk.set('value', val);
}
}
2020-09-05 07:12:04 -04:00
class TkKnob extends TkRangeControl {
2020-06-21 17:29:27 -04:00
constructor (options) {
super(new TK.Knob(options));
}
}
2020-09-05 07:12:04 -04:00
class TkFader extends TkRangeControl {
constructor (options) {
super(new TK.Fader(options));
}
}
class TkMeter extends TkRangeControl {
constructor (options) {
super(new TK.LevelMeter(options));
}
set value (val) {
this.tk.set('value', val);
}
}
export class Label extends TkWidget {
constructor () {
super(new TK.Label());
}
set text (text) {
this.tk.set('label', text);
}
}
2020-06-21 17:29:27 -04:00
export class Container extends BaseContainer {
constructor () {
super();
this.tk = new TK.Container();
}
get element () {
return this.tk.element;
}
appendChild (child) {
super.appendChild(child);
this.tk.append_child(child.tk);
}
}
export class Dialog extends BaseDialog {
constructor () {
super();
this.tk = new TK.Dialog({
anchor: 'center', // center v&h
auto_close: true,
auto_remove: true,
showing_duration: 10,
hiding_duration: 10,
container: document.getElementById('root')
});
}
get element () {
return this.tk.element;
}
set closeButton (button) {
button.callback = () => this.close();
this.appendChild(button);
}
appendChild (child) {
super.appendChild(child);
this.tk.append_child(child.tk);
}
show () {
// opening a TK.Dialog with auto_close=true from a TK.Button callback
// fails otherwise ev.stopPropagation() is called in the button event
// handler or setTimeout() is used here
setTimeout(() => {
this.tk.set('display_state', 'show');
this.tk.add_event('close', (ev) => this.onClose(ev));
}, 0);
}
close () {
this.tk.close();
}
}
2020-09-05 07:12:04 -04:00
export class Button extends TkControl {
constructor () {
super(new TK.Button());
this.tk.add_event('click', (ev) => this.callback(ev));
}
set text (text) {
this.tk.set('label', text);
}
set icon (icon) {
// see toolkit/styles/Toolkit.html
this.tk.set('icon', icon);
this.element.style.border = 'none';
}
}
2020-09-05 07:12:04 -04:00
export class Toggle extends TkControl {
2020-06-21 17:29:27 -04:00
constructor () {
super(new TK.Toggle());
this.tk.add_event('toggled', (state) => this.callback(state));
}
set text (text) {
this.tk.set('label', text);
}
2020-06-21 17:29:27 -04:00
get value () {
return this.tk.get('state');
}
set value (val) {
this.tk.set('state', val);
}
setIcons (inactive, active) {
this.tk.set('icon', inactive);
this.tk.set('icon_active', active);
this.element.style.border = 'none';
}
2020-06-21 17:29:27 -04:00
}
2020-09-05 07:12:04 -04:00
export class AudioStripGainFader extends TkFader {
2020-06-21 17:29:27 -04:00
constructor () {
2020-09-05 07:12:04 -04:00
super({
2020-06-21 17:29:27 -04:00
scale: 'decibel',
2020-09-05 07:12:04 -04:00
labels: TK.FORMAT("%d"),
2020-06-21 17:29:27 -04:00
min: -58.0,
max: 6.0
2020-09-05 07:12:04 -04:00
});
2020-06-21 17:29:27 -04:00
}
}
2020-09-05 07:12:04 -04:00
export class MidiStripGainFader extends TkFader {
2020-06-21 17:29:27 -04:00
constructor () {
2020-09-05 07:12:04 -04:00
super({
scale: 'linear',
labels: TK.FORMAT("%d"),
min: 0,
max: 127
});
}
}
export class AudioStripMeter extends TkMeter {
constructor () {
super({
2020-06-21 17:29:27 -04:00
show_scale: false,
scale: 'decibel',
min: -58.0,
max: 6.0
2020-09-05 07:12:04 -04:00
});
2020-06-21 17:29:27 -04:00
}
2020-09-05 07:12:04 -04:00
}
export class MidiStripMeter extends TkMeter {
constructor () {
super({
show_scale: false,
scale: 'linear',
min: 0,
max: 127
});
2020-06-21 17:29:27 -04:00
}
}
2020-09-05 07:12:04 -04:00
export class LinearKnob extends TkKnob {
2020-06-21 17:29:27 -04:00
constructor (min, max) {
super({
scale: 'linear',
min: min,
max: max,
hand: {
width: 5,
length: 15
}
2020-06-21 17:29:27 -04:00
});
}
}
2020-09-05 07:12:04 -04:00
export class LogKnob extends TkKnob {
2020-06-21 17:29:27 -04:00
constructor (min, max) {
super({
scale: 'frequency',
2020-06-21 17:29:27 -04:00
min: min,
max: max,
hand: {
width: 5,
length: 15
}
2020-06-21 17:29:27 -04:00
});
}
}
2020-09-05 07:12:04 -04:00
export class DiscreteKnob extends TkKnob {
2020-06-21 17:29:27 -04:00
constructor (min, max, step) {
super({
scale: 'linear',
min: min,
max: max,
snap: step || 1,
hand: {
width: 5,
length: 15
}
2020-06-21 17:29:27 -04:00
});
}
}
2020-09-05 07:12:04 -04:00
export class PanKnob extends TkKnob {
2020-06-21 17:29:27 -04:00
constructor () {
super({
//scale: 'linear',
scale: (k) => 1.0 - k,
min: 0,
max: 1.0,
hand: {
width: 5,
length: 15
}
2020-06-21 17:29:27 -04:00
});
}
}