mirror of
https://github.com/SillyTavern/SillyTavern.git
synced 2025-06-05 21:59:27 +02:00
Replace jQuery slideToggle with a 3rd-party lib
This commit is contained in:
7
package-lock.json
generated
7
package-lock.json
generated
@@ -63,6 +63,7 @@
|
|||||||
"showdown": "^2.1.0",
|
"showdown": "^2.1.0",
|
||||||
"sillytavern-transformers": "2.14.6",
|
"sillytavern-transformers": "2.14.6",
|
||||||
"simple-git": "^3.19.1",
|
"simple-git": "^3.19.1",
|
||||||
|
"slidetoggle": "^4.0.0",
|
||||||
"tiktoken": "^1.0.16",
|
"tiktoken": "^1.0.16",
|
||||||
"vectra": "^0.2.2",
|
"vectra": "^0.2.2",
|
||||||
"wavefile": "^11.0.0",
|
"wavefile": "^11.0.0",
|
||||||
@@ -6531,6 +6532,12 @@
|
|||||||
"integrity": "sha512-VZBmZP8WU3sMOZm1bdgTadsQbcscK0UM8oKxKVBs4XAhUo2Xxzm/OFMGBkPusxw9xL3Uy8LrzEqGqJhclsr0yA==",
|
"integrity": "sha512-VZBmZP8WU3sMOZm1bdgTadsQbcscK0UM8oKxKVBs4XAhUo2Xxzm/OFMGBkPusxw9xL3Uy8LrzEqGqJhclsr0yA==",
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
|
"node_modules/slidetoggle": {
|
||||||
|
"version": "4.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/slidetoggle/-/slidetoggle-4.0.0.tgz",
|
||||||
|
"integrity": "sha512-6qvrOS1dnDFEr41UEEFFRQE8nswaAFIYZAHer6dVlznRIjHyCISjNJoxIn5U5QlAbZfBBxTELQk4jS7miHto1A==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/smart-buffer": {
|
"node_modules/smart-buffer": {
|
||||||
"version": "4.2.0",
|
"version": "4.2.0",
|
||||||
"resolved": "https://registry.npmjs.org/smart-buffer/-/smart-buffer-4.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/smart-buffer/-/smart-buffer-4.2.0.tgz",
|
||||||
|
@@ -53,6 +53,7 @@
|
|||||||
"showdown": "^2.1.0",
|
"showdown": "^2.1.0",
|
||||||
"sillytavern-transformers": "2.14.6",
|
"sillytavern-transformers": "2.14.6",
|
||||||
"simple-git": "^3.19.1",
|
"simple-git": "^3.19.1",
|
||||||
|
"slidetoggle": "^4.0.0",
|
||||||
"tiktoken": "^1.0.16",
|
"tiktoken": "^1.0.16",
|
||||||
"vectra": "^0.2.2",
|
"vectra": "^0.2.2",
|
||||||
"wavefile": "^11.0.0",
|
"wavefile": "^11.0.0",
|
||||||
|
@@ -19,6 +19,7 @@ import seedrandom from 'seedrandom';
|
|||||||
import * as Popper from '@popperjs/core';
|
import * as Popper from '@popperjs/core';
|
||||||
import droll from 'droll';
|
import droll from 'droll';
|
||||||
import morphdom from 'morphdom';
|
import morphdom from 'morphdom';
|
||||||
|
import { toggle as slideToggle } from 'slidetoggle';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Expose the libraries to the 'window' object.
|
* Expose the libraries to the 'window' object.
|
||||||
@@ -94,6 +95,7 @@ export default {
|
|||||||
Popper,
|
Popper,
|
||||||
droll,
|
droll,
|
||||||
morphdom,
|
morphdom,
|
||||||
|
slideToggle,
|
||||||
};
|
};
|
||||||
|
|
||||||
export {
|
export {
|
||||||
@@ -115,4 +117,5 @@ export {
|
|||||||
Popper,
|
Popper,
|
||||||
droll,
|
droll,
|
||||||
morphdom,
|
morphdom,
|
||||||
|
slideToggle,
|
||||||
};
|
};
|
||||||
|
102
public/script.js
102
public/script.js
@@ -10,6 +10,7 @@ import {
|
|||||||
SVGInject,
|
SVGInject,
|
||||||
Popper,
|
Popper,
|
||||||
initLibraryShims,
|
initLibraryShims,
|
||||||
|
slideToggle,
|
||||||
default as libs,
|
default as libs,
|
||||||
} from './lib.js';
|
} from './lib.js';
|
||||||
|
|
||||||
@@ -9217,45 +9218,43 @@ function doNavbarIconClick() {
|
|||||||
const pinnedDrawerClicked = drawer.hasClass('pinnedOpen');
|
const pinnedDrawerClicked = drawer.hasClass('pinnedOpen');
|
||||||
|
|
||||||
if (!drawerWasOpenAlready) { //to open the drawer
|
if (!drawerWasOpenAlready) { //to open the drawer
|
||||||
$('.openDrawer').not('.pinnedOpen').addClass('resizing').slideToggle({
|
$('.openDrawer').not('.pinnedOpen').addClass('resizing').each((_, el) => {
|
||||||
duration: animation_duration * 1.5,
|
slideToggle(el, {
|
||||||
easing: 'swing',
|
miliseconds: animation_duration * 1.5,
|
||||||
queue: false,
|
transitionFunction: 'ease-in',
|
||||||
complete: async function () {
|
onAnimationEnd: function (el) {
|
||||||
await delay(50);
|
el.closest('.drawer-content').classList.remove('resizing');
|
||||||
$(this).closest('.drawer-content').removeClass('resizing');
|
},
|
||||||
},
|
});
|
||||||
});
|
});
|
||||||
$('.openIcon').toggleClass('closedIcon openIcon');
|
$('.openIcon').not('.drawerPinnedOpen').toggleClass('closedIcon openIcon');
|
||||||
$('.openDrawer').not('.pinnedOpen').toggleClass('closedDrawer openDrawer');
|
$('.openDrawer').not('.pinnedOpen').toggleClass('closedDrawer openDrawer');
|
||||||
icon.toggleClass('openIcon closedIcon');
|
icon.toggleClass('openIcon closedIcon');
|
||||||
drawer.toggleClass('openDrawer closedDrawer');
|
drawer.toggleClass('openDrawer closedDrawer');
|
||||||
|
|
||||||
//console.log(targetDrawerID);
|
//console.log(targetDrawerID);
|
||||||
if (targetDrawerID === 'right-nav-panel') {
|
if (targetDrawerID === 'right-nav-panel') {
|
||||||
$(this).closest('.drawer').find('.drawer-content').addClass('resizing').slideToggle({
|
$(this).closest('.drawer').find('.drawer-content').addClass('resizing').each((_, el) => {
|
||||||
duration: animation_duration * 1.5,
|
slideToggle(el, {
|
||||||
easing: 'swing',
|
miliseconds: animation_duration * 1.5,
|
||||||
queue: false,
|
transitionFunction: 'ease-in',
|
||||||
start: function () {
|
elementDisplayStyle: 'flex',
|
||||||
jQuery(this).css('display', 'flex'); //flex needed to make charlist scroll
|
onAnimationEnd: function (el) {
|
||||||
},
|
el.closest('.drawer-content').classList.remove('resizing');
|
||||||
complete: async function () {
|
favsToHotswap();
|
||||||
favsToHotswap();
|
$('#rm_print_characters_block').trigger('scroll');
|
||||||
await delay(50);
|
},
|
||||||
$(this).closest('.drawer-content').removeClass('resizing');
|
});
|
||||||
$('#rm_print_characters_block').trigger('scroll');
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
$(this).closest('.drawer').find('.drawer-content').addClass('resizing').slideToggle({
|
$(this).closest('.drawer').find('.drawer-content').addClass('resizing').each((_, el) => {
|
||||||
duration: animation_duration * 1.5,
|
slideToggle(el, {
|
||||||
easing: 'swing',
|
miliseconds: animation_duration * 1.5,
|
||||||
queue: false,
|
transitionFunction: 'ease-in',
|
||||||
complete: async function () {
|
onAnimationEnd: function (el) {
|
||||||
await delay(50);
|
el.closest('.drawer-content').classList.remove('resizing');
|
||||||
$(this).closest('.drawer-content').removeClass('resizing');
|
},
|
||||||
},
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -9271,25 +9270,25 @@ function doNavbarIconClick() {
|
|||||||
icon.toggleClass('closedIcon openIcon');
|
icon.toggleClass('closedIcon openIcon');
|
||||||
|
|
||||||
if (pinnedDrawerClicked) {
|
if (pinnedDrawerClicked) {
|
||||||
$(drawer).addClass('resizing').slideToggle({
|
$(drawer).addClass('resizing').each((_, el) => {
|
||||||
duration: animation_duration * 1.5,
|
slideToggle(el, {
|
||||||
easing: 'swing',
|
miliseconds: animation_duration * 1.5,
|
||||||
queue: false,
|
transitionFunction: 'ease-in',
|
||||||
complete: async function () {
|
onAnimationEnd: function (el) {
|
||||||
await delay(50);
|
el.classList.remove('resizing');
|
||||||
$(this).removeClass('resizing');
|
},
|
||||||
},
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
$('.openDrawer').not('.pinnedOpen').addClass('resizing').slideToggle({
|
$('.openDrawer').not('.pinnedOpen').addClass('resizing').each((_, el) => {
|
||||||
duration: animation_duration * 1.5,
|
slideToggle(el, {
|
||||||
easing: 'swing',
|
miliseconds: animation_duration * 1.5,
|
||||||
queue: false,
|
transitionFunction: 'ease-in',
|
||||||
complete: async function () {
|
onAnimationEnd: function (el) {
|
||||||
await delay(50);
|
el.closest('.drawer-content').classList.remove('resizing');
|
||||||
$(this).closest('.drawer-content').removeClass('resizing');
|
},
|
||||||
},
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -10924,12 +10923,17 @@ jQuery(async function () {
|
|||||||
if ($('.openDrawer').length !== 0) {
|
if ($('.openDrawer').length !== 0) {
|
||||||
if (targetParentHasOpenDrawer === 0) {
|
if (targetParentHasOpenDrawer === 0) {
|
||||||
//console.log($('.openDrawer').not('.pinnedOpen').length);
|
//console.log($('.openDrawer').not('.pinnedOpen').length);
|
||||||
$('.openDrawer').not('.pinnedOpen').addClass('resizing').slideToggle(200, 'swing', function () {
|
$('.openDrawer').not('.pinnedOpen').addClass('resizing').each((_, el) => {
|
||||||
$(this).closest('.drawer-content').removeClass('resizing');
|
slideToggle(el, {
|
||||||
|
miliseconds: 200,
|
||||||
|
transitionFunction: 'ease-in',
|
||||||
|
onAnimationEnd: (el) => {
|
||||||
|
el.closest('.drawer-content').classList.remove('resizing');
|
||||||
|
},
|
||||||
|
});
|
||||||
});
|
});
|
||||||
$('.openIcon').not('.drawerPinnedOpen').toggleClass('closedIcon openIcon');
|
$('.openIcon').not('.drawerPinnedOpen').toggleClass('closedIcon openIcon');
|
||||||
$('.openDrawer').not('.pinnedOpen').toggleClass('closedDrawer openDrawer');
|
$('.openDrawer').not('.pinnedOpen').toggleClass('closedDrawer openDrawer');
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@@ -1,4 +1,4 @@
|
|||||||
import { DOMPurify, Bowser } from '../lib.js';
|
import { DOMPurify, Bowser, slideToggle } from '../lib.js';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
characters,
|
characters,
|
||||||
@@ -19,6 +19,7 @@ import {
|
|||||||
menu_type,
|
menu_type,
|
||||||
substituteParams,
|
substituteParams,
|
||||||
sendTextareaMessage,
|
sendTextareaMessage,
|
||||||
|
animation_duration,
|
||||||
} from '../script.js';
|
} from '../script.js';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
@@ -748,8 +749,8 @@ export function initRossMods() {
|
|||||||
$(RightNavDrawerIcon).removeClass('drawerPinnedOpen');
|
$(RightNavDrawerIcon).removeClass('drawerPinnedOpen');
|
||||||
|
|
||||||
if ($(RightNavPanel).hasClass('openDrawer') && $('.openDrawer').length > 1) {
|
if ($(RightNavPanel).hasClass('openDrawer') && $('.openDrawer').length > 1) {
|
||||||
$(RightNavPanel).slideToggle(200, 'swing');
|
slideToggle(RightNavPanel, { miliseconds: animation_duration * 1.5, transitionFunction: 'ease-in' });
|
||||||
$(RightNavDrawerIcon).toggleClass('openIcon closedIcon');
|
$(RightNavDrawerIcon).toggleClass('closedIcon openIcon');
|
||||||
$(RightNavPanel).toggleClass('openDrawer closedDrawer');
|
$(RightNavPanel).toggleClass('openDrawer closedDrawer');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -766,8 +767,8 @@ export function initRossMods() {
|
|||||||
$(LeftNavDrawerIcon).removeClass('drawerPinnedOpen');
|
$(LeftNavDrawerIcon).removeClass('drawerPinnedOpen');
|
||||||
|
|
||||||
if ($(LeftNavPanel).hasClass('openDrawer') && $('.openDrawer').length > 1) {
|
if ($(LeftNavPanel).hasClass('openDrawer') && $('.openDrawer').length > 1) {
|
||||||
$(LeftNavPanel).slideToggle(200, 'swing');
|
slideToggle(LeftNavPanel, { miliseconds: animation_duration * 1.5, transitionFunction: 'ease-in' });
|
||||||
$(LeftNavDrawerIcon).toggleClass('openIcon closedIcon');
|
$(LeftNavDrawerIcon).toggleClass('closedIcon openIcon');
|
||||||
$(LeftNavPanel).toggleClass('openDrawer closedDrawer');
|
$(LeftNavPanel).toggleClass('openDrawer closedDrawer');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -786,8 +787,8 @@ export function initRossMods() {
|
|||||||
|
|
||||||
if ($(WorldInfo).hasClass('openDrawer') && $('.openDrawer').length > 1) {
|
if ($(WorldInfo).hasClass('openDrawer') && $('.openDrawer').length > 1) {
|
||||||
console.debug('closing WI after lock removal');
|
console.debug('closing WI after lock removal');
|
||||||
$(WorldInfo).slideToggle(200, 'swing');
|
slideToggle(WorldInfo, { miliseconds: animation_duration * 1.5, transitionFunction: 'ease-in' });
|
||||||
$(WIDrawerIcon).toggleClass('openIcon closedIcon');
|
$(WIDrawerIcon).toggleClass('closedIcon openIcon');
|
||||||
$(WorldInfo).toggleClass('openDrawer closedDrawer');
|
$(WorldInfo).toggleClass('openDrawer closedDrawer');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user