TeaSpeak
/
TeaWeb
1
0
Fork 0
Code Issues 1 Pull Requests Activity

Saving last seperator setting to keep the last view

canary
WolverinDEV 2019-01-19 13:16:12 +01:00
parent 9236714bec
commit ec6ee56d0c
4 changed files with 52 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
shared/css/general.scss
View File

@ -289,16 +289,8 @@ $separator_thickness: 4px;
}
.container-channel-chat {
/*
> div {
min-height: 100px;
min-width: 100px;
max-width: 100%;
}
*/
min-width: 100px;
//max-width: 60%; /* tmp chat fix */
width: 60%;
display: flex;
flex-direction: column;
@ -337,8 +329,7 @@ $separator_thickness: 4px;
background: white;
min-width: 100px;
//max-width: 40%;
//width: 40%;
width: 40%;
display: flex;
flex-direction: row;

4
shared/html/templates.html
View File

@ -106,7 +106,7 @@
<div class="channelTree" id="channelTree"></div>
</div>
<div class="container-seperator horizontal"></div>
<div class="container-seperator horizontal" seperator-id="seperator-channel-chat"></div>
<!-- Chat window -->
<div class="main_container container-chat">
<div id="chat">
@ -122,7 +122,7 @@
</div>
</div>
</div>
<div class="container-seperator vertical"></div>
<div class="container-seperator vertical" seperator-id="seperator-main-info"></div>
<div class="main_container container-info">
<div id="select_info" class="select_info" style="width: 100%; max-width: 100%">
<div class="container-banner"></div>

4
shared/js/main.ts
View File

@ -99,6 +99,8 @@ async function initialize() {
displayCriticalError(message);
};
settings = new Settings();
try {
await i18n.initialize();
} catch(error) {
@ -118,6 +120,7 @@ async function initialize() {
try { //Initialize main template
const main = $("#tmpl_main").renderTag().dividerfy();
$("body").append(main);
} catch(error) {
console.error(error);
@ -144,7 +147,6 @@ async function initialize() {
function main() {
//http://localhost:63343/Web-Client/index.php?_ijt=omcpmt8b9hnjlfguh8ajgrgolr&default_connect_url=true&default_connect_type=teamspeak&default_connect_url=localhost%3A9987&disableUnloadDialog=1&loader_ignore_age=1
settings = new Settings();
globalClient = new TSClient();
/** Setup the XF forum identity **/
profiles.identities.setup_forum();

61
shared/js/ui/context_divider.ts
View File

@ -5,16 +5,23 @@ interface JQuery<TElement = HTMLElement> {
if(!$.fn.dividerfy) {
$.fn.dividerfy = function<T extends HTMLElement>(this: JQuery<T>) : JQuery<T> {
this.find(".container-seperator").each(function (this: T) {
if(!this.previousElementSibling) return;
if(!this.nextElementSibling) return;
const element = $(this);
const parent_element = $(this.parentElement);
const previous_element = $(this.previousElementSibling);
const next_element = $(this.nextElementSibling);
const seperator_id = element.attr("seperator-id");
const vertical = element.hasClass("vertical");
const listener_move = (event: MouseEvent) => {
if(!this.previousElementSibling) return;
if(!this.nextElementSibling) return;
const apply_view = (property: string, previous: number, next: number) => {
previous_element.css(property, "calc(" + previous + "% - " + (vertical ? element.width() : element.height()) + "px)");
next_element.css(property, "calc(" +next + "% - " + (vertical ? element.width() : element.height()) + "px)");
};
const parent_element = $(this.parentElement);
const previous_element = $(this.previousElementSibling);
const next_element = $(this.nextElementSibling);
const listener_move = (event: MouseEvent) => {
const parent_offset = parent_element.offset();
const min = vertical ? parent_offset.left : parent_offset.top;
@ -31,25 +38,34 @@ if(!$.fn.dividerfy) {
Math.max(previous_offset.top + previous_element.height(), next_offset.top + next_element.height());
*/
let previous_width = 0;
let next_width = 0;
let previous = 0;
let next = 0;
if(current < min) {
previous_width = 0;
next_width = 1;
previous = 0;
next = 1;
} else if(current < max) {
const x_offset = current - min;
const x_offset_max = max - min;
previous_width = x_offset / x_offset_max;
next_width = 1 - previous_width;
previous = x_offset / x_offset_max;
next = 1 - previous;
} else {
previous_width = 1;
next_width = 0;
previous = 1;
next = 0;
}
previous_element.css(vertical ? "width" : "height", "calc(" + Math.ceil(previous_width * 100) + "% - " + (vertical ? element.width() : element.height()) + "px)");
next_element.css(vertical ? "width" : "height", "calc(" + Math.ceil(next_width * 100) + "% - " + (vertical ? element.width() : element.height()) + "px)");
const property = vertical ? "width" : "height";
const previous_p = Math.ceil(previous * 100);
const next_p = Math.ceil(next * 100);
apply_view(property, previous_p, next_p);
if(seperator_id)
settings.changeGlobal("seperator-settings-" + seperator_id, JSON.stringify({
previous: previous_p,
next: next_p,
property: property
}));
};
const listener_up = (event: MouseEvent) => {
@ -63,6 +79,19 @@ if(!$.fn.dividerfy) {
document.addEventListener('mouseup', listener_up);
$(document.documentElement).css("user-select", "none");
});
if(seperator_id) {
try {
const config = JSON.parse(settings.global("seperator-settings-" + seperator_id));
if(config) {
console.log("Apply previous changed: %o", config);
apply_view(config.property, config.previous, config.next);
}
} catch(e) {
console.error(e);
}
}
});
return this;
}