This commit is contained in:
LenAnderson
2024-06-20 15:53:30 -04:00
parent ed8f923b7a
commit 3b6f4dee2c
6 changed files with 103 additions and 126 deletions

View File

@@ -116,17 +116,6 @@
<i class="fa-solid fa-stop"></i>
</div>
</div>
<div id="qr--modal-debugButtons">
<div id="qr--modal-resume" class="qr--modal-debugButton menu_button">
Resume
</div>
<div id="qr--modal-step" class="qr--modal-debugButton menu_button">
Step
</div>
<div id="qr--modal-stepInto" class="qr--modal-debugButton menu_button">
StepInto
</div>
</div>
<div id="qr--modal-executeProgress"></div>
<label class="checkbox_label">
<input type="checkbox" id="qr--modal-executeHide">
@@ -134,6 +123,21 @@
</label>
<div id="qr--modal-executeErrors"></div>
<div id="qr--modal-executeResult"></div>
<div id="qr--modal-debugButtons">
<div title="Resume" id="qr--modal-resume" class="qr--modal-debugButton menu_button">
<span class="qr--glyph"></span>
</div>
<div title="Step Over" id="qr--modal-step" class="qr--modal-debugButton qr--glyph-combo menu_button">
<span class="qr--glyph"></span><span class="qr--glyph"></span>
</div>
<div title="Step Into" id="qr--modal-stepInto" class="qr--modal-debugButton qr--glyph-combo menu_button">
<span class="qr--glyph"></span><span class="qr--glyph"></span>
</div>
<div title="Step Out" id="qr--modal-stepOut" class="qr--modal-debugButton qr--glyph-combo menu_button">
<span class="qr--glyph"></span><span class="qr--glyph"></span>
</div>
</div>
<div id="qr--modal-debugState"></div>
</div>
</div>

View File

@@ -564,6 +564,11 @@ export class QuickReply {
stepIntoBtn.addEventListener('click', ()=>{
this.debugController?.stepInto();
});
/**@type {HTMLElement}*/
const stepOutBtn = dom.querySelector('#qr--modal-stepOut');
stepOutBtn.addEventListener('click', ()=>{
this.debugController?.stepOut();
});
await popupResult;
@@ -653,7 +658,7 @@ export class QuickReply {
title.textContent = isCurrent ? 'Current Scope' : 'Parent Scope';
let hi;
title.addEventListener('pointerenter', ()=>{
const loc = this.getEditorPosition(c.executorList[0].start, c.executorList.slice(-1)[0].end);
const loc = this.getEditorPosition(c.executorList[0].start - 1, c.executorList.slice(-1)[0].end);
const layer = this.editorPopup.dlg.getBoundingClientRect();
hi = document.createElement('div');
hi.style.position = 'fixed';

View File

@@ -262,6 +262,9 @@
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--qrOptions > .qr--ctxEditorActions + h3 + div {
display: none;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor.qr--isExecuting #qr--modal-debugButtons {
display: flex;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor > #qr--main {
flex: 1 1 auto;
display: flex;
@@ -376,6 +379,9 @@
border: 1px solid var(--SmartThemeBorderColor);
border-radius: 5px;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor label:has(#qr--modal-executeHide) {
display: none;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-executeButtons {
display: flex;
gap: 1em;
@@ -424,9 +430,21 @@
border-color: #d78872;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons {
display: flex;
display: none;
gap: 1em;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton {
aspect-ratio: 1.25 / 1;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton.qr--glyph-combo {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugButtons .qr--modal-debugButton.qr--glyph-combo .qr--glyph {
grid-column: 1;
line-height: 0.8;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-executeProgress {
--prog: 0;
--progColor: #92befc;
@@ -512,7 +530,7 @@
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope {
display: grid;
grid-template-columns: 0fr 1fr;
column-gap: 1em;
column-gap: 0em;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--title {
grid-column: 1 / 3;
@@ -526,6 +544,14 @@
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--pipe {
display: contents;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--var:nth-child(2n + 2) .qr--key,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--macro:nth-child(2n + 2) .qr--key,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--pipe:nth-child(2n + 2) .qr--key,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--var:nth-child(2n + 2) .qr--val,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--macro:nth-child(2n + 2) .qr--val,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--pipe:nth-child(2n + 2) .qr--val {
background-color: rgb(from var(--SmartThemeEmColor) r g b / 0.25);
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--var.qr--isHidden .qr--key,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--macro.qr--isHidden .qr--key,
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--pipe.qr--isHidden .qr--key,
@@ -536,6 +562,7 @@
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--key {
margin-left: 0.5em;
padding-right: 1em;
}
.popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-debugState .qr--scope .qr--key:after {
content: ": ";

View File

@@ -289,7 +289,9 @@
{
display: none;
}
#qr--modal-debugButtons {
display: flex;
}
}
> #qr--main {
@@ -403,6 +405,10 @@
}
}
label:has(#qr--modal-executeHide) {
// hide editor is not working anyways
display: none;
}
#qr--modal-executeButtons {
display: flex;
gap: 1em;
@@ -451,8 +457,20 @@
}
}
#qr--modal-debugButtons {
display: flex;
display: none;
gap: 1em;
.qr--modal-debugButton {
aspect-ratio: 1.25 / 1;
&.qr--glyph-combo {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr;
.qr--glyph {
grid-column: 1;
line-height: 0.8;
}
}
}
}
#qr--modal-executeProgress {
--prog: 0;
@@ -538,7 +556,7 @@
.qr--scope {
display: grid;
grid-template-columns: 0fr 1fr;
column-gap: 1em;
column-gap: 0em;
.qr--title {
grid-column: 1 / 3;
font-weight: bold;
@@ -548,6 +566,11 @@
}
.qr--var, .qr--macro, .qr--pipe {
display: contents;
&:nth-child(2n + 2) {
.qr--key, .qr--val {
background-color: rgb(from var(--SmartThemeEmColor) r g b / 0.25);
}
}
&.qr--isHidden {
.qr--key, .qr--val {
opacity: 0.5;
@@ -556,6 +579,7 @@
}
.qr--key {
margin-left: 0.5em;
padding-right: 1em;
&:after { content: ": "; }
}
.qr--pipe, .qr--macro {