add debugger button states

This commit is contained in:
LenAnderson
2024-07-18 19:57:05 -04:00
parent 03eb04e8f9
commit ae90966f43
3 changed files with 26 additions and 6 deletions

View File

@ -1204,12 +1204,7 @@ export class QuickReply {
this.abortController = new SlashCommandAbortController(); this.abortController = new SlashCommandAbortController();
this.debugController = new SlashCommandDebugController(); this.debugController = new SlashCommandDebugController();
this.debugController.onBreakPoint = async(closure, executor)=>{ this.debugController.onBreakPoint = async(closure, executor)=>{
//TODO move debug code into its own element, separate from the QR this.editorDom.classList.add('qr--isPaused');
//TODO populate debug code from closure.fullText and get locations, highlights, etc. from that
//TODO keep some kind of reference (human identifier) *where* the closure code comes from?
//TODO QR name, chat input, deserialized closure, ... ?
// this.editorMessage.value = closure.fullText;
// this.editorMessage.dispatchEvent(new Event('input', { bubbles:true }));
syntax.innerHTML = hljs.highlight(`${closure.fullText}${closure.fullText.slice(-1) == '\n' ? ' ' : ''}`, { language:'stscript', ignoreIllegals:true })?.value; syntax.innerHTML = hljs.highlight(`${closure.fullText}${closure.fullText.slice(-1) == '\n' ? ' ' : ''}`, { language:'stscript', ignoreIllegals:true })?.value;
this.editorMessageLabel.innerHTML = ''; this.editorMessageLabel.innerHTML = '';
if (uuidCheck.test(closure.source)) { if (uuidCheck.test(closure.source)) {
@ -1619,6 +1614,7 @@ export class QuickReply {
hi.remove(); hi.remove();
this.editorDebugState.textContent = ''; this.editorDebugState.textContent = '';
this.editorDebugState.classList.remove('qr--active'); this.editorDebugState.classList.remove('qr--active');
this.editorDom.classList.remove('qr--isPaused');
return isStepping; return isStepping;
}; };
const result = await this.onDebug(this); const result = await this.onDebug(this);

View File

@ -435,6 +435,17 @@
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--modal-debugButtons { .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--modal-debugButtons {
display: flex; display: flex;
} }
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--modal-debugButtons .menu_button:not(#qr--modal-minimize, #qr--modal-maximize) {
cursor: not-allowed;
opacity: 0.5;
pointer-events: none;
transition: 200ms;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting.qr--isPaused #qr--modal-debugButtons .menu_button:not(#qr--modal-minimize, #qr--modal-maximize) {
cursor: pointer;
opacity: 1;
pointer-events: all;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--resizeHandle { .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--resizeHandle {
width: 6px; width: 6px;
background-color: var(--SmartThemeBorderColor); background-color: var(--SmartThemeBorderColor);

View File

@ -504,7 +504,20 @@
} }
#qr--modal-debugButtons { #qr--modal-debugButtons {
display: flex; display: flex;
.menu_button:not(#qr--modal-minimize, #qr--modal-maximize) {
cursor: not-allowed;
opacity: 0.5;
pointer-events: none;
transition: 200ms;
}
} }
&.qr--isPaused #qr--modal-debugButtons {
.menu_button:not(#qr--modal-minimize, #qr--modal-maximize) {
cursor: pointer;
opacity: 1;
pointer-events: all;
}
}
#qr--resizeHandle { #qr--resizeHandle {
width: 6px; width: 6px;
background-color: var(--SmartThemeBorderColor); background-color: var(--SmartThemeBorderColor);