mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
persistent state for movingUI
This commit is contained in:
@ -12,6 +12,7 @@ import {
|
|||||||
getTokenCount,
|
getTokenCount,
|
||||||
menu_type,
|
menu_type,
|
||||||
max_context,
|
max_context,
|
||||||
|
saveSettingsDebounced,
|
||||||
} from "../script.js";
|
} from "../script.js";
|
||||||
|
|
||||||
|
|
||||||
@ -478,11 +479,12 @@ dragElement(document.getElementById("right-nav-panel"));
|
|||||||
dragElement(document.getElementById("avatar_zoom_popup"));
|
dragElement(document.getElementById("avatar_zoom_popup"));
|
||||||
dragElement(document.getElementById("WorldInfo"));
|
dragElement(document.getElementById("WorldInfo"));
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export function dragElement(elmnt) {
|
export function dragElement(elmnt) {
|
||||||
|
|
||||||
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
|
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
|
||||||
|
var draggableHeight, draggableWidth, draggableTop, draggableLeft;
|
||||||
|
var elmntName = $(elmnt).attr('id');
|
||||||
|
|
||||||
if (document.getElementById(elmnt.id + "header")) { //ex: id="sheldheader"
|
if (document.getElementById(elmnt.id + "header")) { //ex: id="sheldheader"
|
||||||
// if present, the header is where you move the DIV from, but this overrides everything else:
|
// if present, the header is where you move the DIV from, but this overrides everything else:
|
||||||
document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown;
|
document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown;
|
||||||
@ -506,17 +508,19 @@ export function dragElement(elmnt) {
|
|||||||
function elementDrag(e) {
|
function elementDrag(e) {
|
||||||
//disable scrollbars when dragging to prevent jitter
|
//disable scrollbars when dragging to prevent jitter
|
||||||
$("body").css("overflow", "hidden");
|
$("body").css("overflow", "hidden");
|
||||||
|
if (!power_user.movingUIState[elmntName]) {
|
||||||
|
power_user.movingUIState[elmntName] = {};
|
||||||
|
}
|
||||||
|
|
||||||
//get window size
|
//get window size
|
||||||
let winWidth = window.innerWidth;
|
let winWidth = window.innerWidth;
|
||||||
let winHeight = window.innerHeight;
|
let winHeight = window.innerHeight;
|
||||||
|
|
||||||
//get necessary data for calculating element footprint
|
//get necessary data for calculating element footprint
|
||||||
let draggableHeight = parseInt(getComputedStyle(elmnt).getPropertyValue('height').slice(0, -2));
|
draggableHeight = parseInt(getComputedStyle(elmnt).getPropertyValue('height').slice(0, -2));
|
||||||
let draggableWidth = parseInt(getComputedStyle(elmnt).getPropertyValue('width').slice(0, -2));
|
draggableWidth = parseInt(getComputedStyle(elmnt).getPropertyValue('width').slice(0, -2));
|
||||||
let draggableTop = parseInt(getComputedStyle(elmnt).getPropertyValue('top').slice(0, -2));
|
draggableTop = parseInt(getComputedStyle(elmnt).getPropertyValue('top').slice(0, -2));
|
||||||
let draggableLeft = parseInt(getComputedStyle(elmnt).getPropertyValue('left').slice(0, -2));
|
draggableLeft = parseInt(getComputedStyle(elmnt).getPropertyValue('left').slice(0, -2));
|
||||||
let sheldWidth = parseInt(getComputedStyle(document.documentElement).getPropertyValue('--sheldWidth').slice(0, -2));
|
let sheldWidth = parseInt(getComputedStyle(document.documentElement).getPropertyValue('--sheldWidth').slice(0, -2));
|
||||||
let topBarFirstX = (winWidth - sheldWidth) / 2;
|
let topBarFirstX = (winWidth - sheldWidth) / 2;
|
||||||
let topBarLastX = topBarFirstX + sheldWidth;
|
let topBarLastX = topBarFirstX + sheldWidth;
|
||||||
@ -616,7 +620,15 @@ export function dragElement(elmnt) {
|
|||||||
document.onmousemove = null;
|
document.onmousemove = null;
|
||||||
//revert scrolling to normal after drag to allow recovery of vastly misplaced elements
|
//revert scrolling to normal after drag to allow recovery of vastly misplaced elements
|
||||||
$("body").css("overflow", "auto");
|
$("body").css("overflow", "auto");
|
||||||
|
saveMovingUIState();
|
||||||
|
}
|
||||||
|
|
||||||
|
function saveMovingUIState() {
|
||||||
|
power_user.movingUIState[elmntName].top = draggableTop;
|
||||||
|
power_user.movingUIState[elmntName].left = draggableLeft;
|
||||||
|
power_user.movingUIState[elmntName].width = draggableWidth;
|
||||||
|
power_user.movingUIState[elmntName].height = draggableHeight;
|
||||||
|
saveSettingsDebounced();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -127,6 +127,7 @@ let power_user = {
|
|||||||
|
|
||||||
waifuMode: false,
|
waifuMode: false,
|
||||||
movingUI: false,
|
movingUI: false,
|
||||||
|
movingUIState: {},
|
||||||
noShadows: false,
|
noShadows: false,
|
||||||
theme: 'Default (Dark) 1.7.1',
|
theme: 'Default (Dark) 1.7.1',
|
||||||
|
|
||||||
@ -630,6 +631,19 @@ function loadPowerUserSettings(settings, data) {
|
|||||||
loadInstructMode();
|
loadInstructMode();
|
||||||
loadMaxContextUnlocked();
|
loadMaxContextUnlocked();
|
||||||
switchWaifuMode();
|
switchWaifuMode();
|
||||||
|
loadMovingUIState();
|
||||||
|
|
||||||
|
console.log(power_user)
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadMovingUIState() {
|
||||||
|
if (power_user.movingUIState) {
|
||||||
|
for (var elmntName of Object.keys(power_user.movingUIState)) {
|
||||||
|
var elmntState = power_user.movingUIState[elmntName];
|
||||||
|
var elmnt = $('#' + elmntName);
|
||||||
|
elmnt.css(elmntState);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function loadMaxContextUnlocked() {
|
function loadMaxContextUnlocked() {
|
||||||
@ -902,13 +916,15 @@ function resetMovablePanels() {
|
|||||||
document.getElementById("right-nav-panel").style.width = '';
|
document.getElementById("right-nav-panel").style.width = '';
|
||||||
document.getElementById("right-nav-panel").style.margin = '';
|
document.getElementById("right-nav-panel").style.margin = '';
|
||||||
|
|
||||||
document.getElementById("expression-holder").style.top = '';
|
if ($("#expression-holder")) {
|
||||||
document.getElementById("expression-holder").style.left = '';
|
document.getElementById("expression-holder").style.top = '';
|
||||||
document.getElementById("expression-holder").style.right = '';
|
document.getElementById("expression-holder").style.left = '';
|
||||||
document.getElementById("expression-holder").style.bottom = '';
|
document.getElementById("expression-holder").style.right = '';
|
||||||
document.getElementById("expression-holder").style.height = '';
|
document.getElementById("expression-holder").style.bottom = '';
|
||||||
document.getElementById("expression-holder").style.width = '';
|
document.getElementById("expression-holder").style.height = '';
|
||||||
document.getElementById("expression-holder").style.margin = '';
|
document.getElementById("expression-holder").style.width = '';
|
||||||
|
document.getElementById("expression-holder").style.margin = '';
|
||||||
|
}
|
||||||
|
|
||||||
document.getElementById("avatar_zoom_popup").style.top = '';
|
document.getElementById("avatar_zoom_popup").style.top = '';
|
||||||
document.getElementById("avatar_zoom_popup").style.left = '';
|
document.getElementById("avatar_zoom_popup").style.left = '';
|
||||||
@ -927,6 +943,8 @@ function resetMovablePanels() {
|
|||||||
document.getElementById("WorldInfo").style.margin = '';
|
document.getElementById("WorldInfo").style.margin = '';
|
||||||
|
|
||||||
$('*[data-dragged="true"]').removeAttr('data-dragged');
|
$('*[data-dragged="true"]').removeAttr('data-dragged');
|
||||||
|
power_user.movingUIState = {}
|
||||||
|
saveSettingsDebounced();
|
||||||
eventSource.emit(event_types.MOVABLE_PANELS_RESET);
|
eventSource.emit(event_types.MOVABLE_PANELS_RESET);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user