116 lines
No EOL
4.1 KiB
TypeScript
116 lines
No EOL
4.1 KiB
TypeScript
import {createModal, Modal} from "../../ui/elements/Modal";
|
|
import {ClientEntry} from "../../tree/Client";
|
|
import {Slider, sliderfy} from "../../ui/elements/Slider";
|
|
import * as htmltags from "../../ui/htmltags";
|
|
import {VoicePlayerLatencySettings} from "../../voice/VoicePlayer";
|
|
|
|
let modalInstance: Modal;
|
|
export function spawnChangeLatency(client: ClientEntry, current: VoicePlayerLatencySettings, reset: () => VoicePlayerLatencySettings, apply: (settings: VoicePlayerLatencySettings) => void, callback_flush?: () => any) {
|
|
if(modalInstance) {
|
|
modalInstance.close();
|
|
}
|
|
|
|
const begin = Object.assign({}, current);
|
|
current = Object.assign({}, current);
|
|
|
|
modalInstance = createModal({
|
|
header: tr("Change playback latency"),
|
|
body: function () {
|
|
let tag = $("#tmpl_change_latency").renderTag({
|
|
client: htmltags.generate_client_object({
|
|
add_braces: false,
|
|
client_name: client.clientNickName(),
|
|
client_unique_id: client.properties.client_unique_identifier,
|
|
client_id: client.clientId()
|
|
}),
|
|
|
|
have_flush: (typeof(callback_flush) === "function")
|
|
});
|
|
|
|
const update_value = () => {
|
|
const valid = current.minBufferTime < current.maxBufferTime;
|
|
|
|
modalInstance.htmlTag.find(".modal-body").toggleClass("modal-red", !valid);
|
|
modalInstance.htmlTag.find(".modal-body").toggleClass("modal-green", valid);
|
|
|
|
if(!valid)
|
|
return;
|
|
|
|
apply(current);
|
|
};
|
|
|
|
let slider_min: Slider, slider_max: Slider;
|
|
{
|
|
const container = tag.find(".container-min");
|
|
const tag_value = container.find(".value");
|
|
|
|
const slider_tag = container.find(".container-slider");
|
|
slider_min = sliderfy(slider_tag, {
|
|
initial_value: current.minBufferTime,
|
|
step: 20,
|
|
max_value: 1000,
|
|
min_value: 0,
|
|
|
|
unit: 'ms'
|
|
});
|
|
slider_tag.on('change', event => {
|
|
current.minBufferTime = parseInt(slider_tag.attr("value"));
|
|
tag_value.text(current.minBufferTime + "ms");
|
|
update_value();
|
|
});
|
|
|
|
tag_value.text(current.minBufferTime + "ms");
|
|
}
|
|
|
|
{
|
|
const container = tag.find(".container-max");
|
|
const tag_value = container.find(".value");
|
|
|
|
const slider_tag = container.find(".container-slider");
|
|
slider_max = sliderfy(slider_tag, {
|
|
initial_value: current.maxBufferTime,
|
|
step: 20,
|
|
max_value: 1020,
|
|
min_value: 20,
|
|
|
|
unit: 'ms'
|
|
});
|
|
|
|
slider_tag.on('change', event => {
|
|
current.maxBufferTime = parseInt(slider_tag.attr("value"));
|
|
tag_value.text(current.maxBufferTime + "ms");
|
|
update_value();
|
|
});
|
|
|
|
tag_value.text(current.maxBufferTime + "ms");
|
|
}
|
|
setTimeout(update_value, 0);
|
|
|
|
tag.find(".button-close").on('click', event => {
|
|
modalInstance.close();
|
|
});
|
|
|
|
tag.find(".button-cancel").on('click', event => {
|
|
apply(begin);
|
|
modalInstance.close();
|
|
});
|
|
|
|
tag.find(".button-reset").on('click', event => {
|
|
current = Object.assign({}, reset());
|
|
slider_max.value(current.maxBufferTime);
|
|
slider_min.value(current.minBufferTime);
|
|
});
|
|
|
|
tag.find(".button-flush").on('click', event => callback_flush());
|
|
|
|
return tag.children();
|
|
},
|
|
footer: null,
|
|
|
|
width: 600
|
|
});
|
|
|
|
modalInstance.close_listener.push(() => modalInstance = undefined);
|
|
modalInstance.open();
|
|
modalInstance.htmlTag.find(".modal-body").addClass("modal-latency");
|
|
} |