77 lines
No EOL
2.7 KiB
TypeScript
77 lines
No EOL
2.7 KiB
TypeScript
//TODO: Use the max limit!
|
|
|
|
import {sliderfy} from "tc-shared/ui/elements/Slider";
|
|
import {createModal, Modal} from "tc-shared/ui/elements/Modal";
|
|
import {ClientEntry} from "tc-shared/ui/client";
|
|
import * as htmltags from "tc-shared/ui/htmltags";
|
|
import {spawnReactModal} from "tc-shared/ui/react-elements/Modal";
|
|
|
|
let modal: Modal;
|
|
export function spawnChangeVolume(client: ClientEntry, local: boolean, current: number, max: number | undefined, callback: (number) => void) {
|
|
if(modal) modal.close();
|
|
|
|
let new_value: number;
|
|
modal = createModal({
|
|
header: local ? tr("Change local volume") : tr("Change remote volume"),
|
|
body: function () {
|
|
let tag = $("#tmpl_change_volume").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()
|
|
}),
|
|
local: local
|
|
});
|
|
|
|
const container_value = tag.find(".info .value");
|
|
const set_value = value => {
|
|
const number = value > 100 ? value - 100 : 100 - value;
|
|
container_value.html((value == 100 ? "±" : value > 100 ? "+" : "-") + number + "%");
|
|
|
|
new_value = value / 100;
|
|
if(local) callback(new_value);
|
|
};
|
|
set_value(current * 100);
|
|
|
|
const slider_tag = tag.find(".container-slider");
|
|
const slider = sliderfy(slider_tag, {
|
|
initial_value: current * 100,
|
|
step: 1,
|
|
max_value: 200,
|
|
min_value: 0,
|
|
|
|
unit: '%'
|
|
});
|
|
slider_tag.on('change', event => set_value(parseInt(slider_tag.attr("value"))));
|
|
|
|
tag.find(".button-save").on('click', event => {
|
|
if(typeof(new_value) !== "undefined") callback(new_value);
|
|
modal.close();
|
|
});
|
|
|
|
tag.find(".button-cancel").on('click', event => {
|
|
callback(current);
|
|
modal.close();
|
|
});
|
|
|
|
tag.find(".button-reset").on('click', event => {
|
|
slider.value(100);
|
|
});
|
|
|
|
tag.find(".button-apply").on('click', event => {
|
|
callback(new_value);
|
|
new_value = undefined;
|
|
});
|
|
|
|
return tag.children();
|
|
},
|
|
footer: null,
|
|
|
|
width: 600
|
|
});
|
|
|
|
modal.close_listener.push(() => modal = undefined);
|
|
modal.open();
|
|
modal.htmlTag.find(".modal-body").addClass("modal-volume");
|
|
} |