diff --git a/src/renderer/components/QueryEditor.vue b/src/renderer/components/QueryEditor.vue index 84ba1cab..cfe5a0f3 100644 --- a/src/renderer/components/QueryEditor.vue +++ b/src/renderer/components/QueryEditor.vue @@ -241,6 +241,24 @@ export default { this.$emit('update:value', content); }); + this.editor.on('guttermousedown', e => { + const target = e.domEvent.target; + if (target.className.indexOf('ace_gutter-cell') === -1) + return; + if (!this.editor.isFocused()) + return; + if (e.clientX > 25 + target.getBoundingClientRect().left) + return; + + const row = e.getDocumentPosition().row; + const breakpoints = e.editor.session.getBreakpoints(row, 0); + if (typeof breakpoints[row] === typeof undefined) + e.editor.session.setBreakpoint(row); + else + e.editor.session.clearBreakpoint(row); + e.stop(); + }); + if (this.autoFocus) { setTimeout(() => { this.editor.focus(); @@ -308,4 +326,21 @@ export default { .ace_dark.ace_editor.ace_autocomplete .ace_completion-highlight { color: #e0d00c; } + +.ace_gutter-cell.ace_breakpoint { + &::before { + content: '\F0403'; + position: absolute; + left: 3px; + top: 2px; + color: $primary-color; + display: inline-block; + font: normal normal normal 24px/1 "Material Design Icons", sans-serif; + font-size: inherit; + text-rendering: auto; + line-height: inherit; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } +} diff --git a/src/renderer/components/WorkspacePropsTabRoutine.vue b/src/renderer/components/WorkspacePropsTabRoutine.vue index 83511e36..81966ab8 100644 --- a/src/renderer/components/WorkspacePropsTabRoutine.vue +++ b/src/renderer/components/WorkspacePropsTabRoutine.vue @@ -47,7 +47,8 @@