rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add separate drag handle for prompt manager on touch screen

Browse Source 
Fixes #2239
This commit is contained in:
Cohee
2025-01-15 00:07:06 +02:00
parent eee45281ea
commit f8c6a62c23
2 changed files with 21 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
public/css/promptmanager.css
View File

@ -271,6 +271,24 @@
opacity: 0.8; opacity: 0.8;
} }
#completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt .drag-handle:not(.ui-sortable-handle) {
display: none;
}
#completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt:has(.drag-handle.ui-sortable-handle) {
position: relative;
padding-left: 20px;
}
#completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt .drag-handle {
position: absolute;
height: 100%;
top: 0;
padding: 0 5px;
display: flex;
align-items: center;
}
#completion_prompt_manager_footer_append_prompt { #completion_prompt_manager_footer_append_prompt {
font-size: 1em; font-size: 1em;
} }

3
public/scripts/PromptManager.js
View File

@ -11,6 +11,7 @@ import { debounce_timeout } from './constants.js';
import { renderTemplateAsync } from './templates.js'; import { renderTemplateAsync } from './templates.js';
import { Popup } from './popup.js'; import { Popup } from './popup.js';
import { t } from './i18n.js'; import { t } from './i18n.js';
import { isMobile } from './RossAscends-mods.js';
function debouncePromise(func, delay) { function debouncePromise(func, delay) {
let timeoutId; let timeoutId;
@ -1562,6 +1563,7 @@ class PromptManager {
listItemHtml += ` listItemHtml += `
<li class="${prefix}prompt_manager_prompt ${draggableClass} ${enabledClass} ${markerClass} ${importantClass}" data-pm-identifier="${escapeHtml(prompt.identifier)}"> <li class="${prefix}prompt_manager_prompt ${draggableClass} ${enabledClass} ${markerClass} ${importantClass}" data-pm-identifier="${escapeHtml(prompt.identifier)}">
<span class="drag-handle">☰</span>
<span class="${prefix}prompt_manager_prompt_name" data-pm-name="${encodedName}"> <span class="${prefix}prompt_manager_prompt_name" data-pm-name="${encodedName}">
${isMarkerPrompt ? '<span class="fa-fw fa-solid fa-thumb-tack" title="Marker"></span>' : ''} ${isMarkerPrompt ? '<span class="fa-fw fa-solid fa-thumb-tack" title="Marker"></span>' : ''}
${isSystemPrompt ? '<span class="fa-fw fa-solid fa-square-poll-horizontal" title="Global Prompt"></span>' : ''} ${isSystemPrompt ? '<span class="fa-fw fa-solid fa-square-poll-horizontal" title="Global Prompt"></span>' : ''}
@ -1741,6 +1743,7 @@ class PromptManager {
makeDraggable() { makeDraggable() {
$(`#${this.configuration.prefix}prompt_manager_list`).sortable({ $(`#${this.configuration.prefix}prompt_manager_list`).sortable({
delay: this.configuration.sortableDelay, delay: this.configuration.sortableDelay,
handle: isMobile() ? '.drag-handle' : null,
items: `.${this.configuration.prefix}prompt_manager_prompt_draggable`, items: `.${this.configuration.prefix}prompt_manager_prompt_draggable`,
update: (event, ui) => { update: (event, ui) => {
const promptOrder = this.getPromptOrderForCharacter(this.activeCharacter); const promptOrder = this.getPromptOrderForCharacter(this.activeCharacter);