direct-online/vito
2
0
Fork 0
mirror of https://github.com/vitodeploy/vito.git synced 2025-07-02 22:46:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix focus issue

Browse Source
This commit is contained in:
Saeed Vaziry
2024-03-29 12:21:33 +01:00
parent dcc4276f09
commit 8a49003e9e
7 changed files with 54 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
resources/js/app.js
View File

@ -26,7 +26,9 @@ document.body.addEventListener('htmx:configRequest', (event) => {
if (window.getSelection) { window.getSelection().removeAllRanges(); }
else if (document.selection) { document.selection.empty(); }
});
let activeElement = null;
document.body.addEventListener('htmx:beforeRequest', (event) => {
activeElement = document.activeElement;
let targetElements = event.target.querySelectorAll('[hx-disable]');
for (let i = 0; i < targetElements.length; i++) {
targetElements[i].disabled = true;
@ -38,6 +40,18 @@ document.body.addEventListener('htmx:afterRequest', (event) => {
targetElements[i].disabled = false;
}
});
document.body.addEventListener('htmx:afterSwap', (event) => {
tippy('[data-tooltip]', {
content(reference) {
return reference.getAttribute('data-tooltip');
},
});
if (activeElement) {
activeElement.blur();
activeElement.focus();
activeElement = null;
}
});
import toastr from 'toastr';
window.toastr = toastr;
@ -49,13 +63,6 @@ window.toastr.options = {
import tippy from 'tippy.js';
import 'tippy.js/dist/tippy.css';
document.body.addEventListener('htmx:afterSettle', (event) => {
tippy('[data-tooltip]', {
content(reference) {
return reference.getAttribute('data-tooltip');
},
});
});
tippy('[data-tooltip]', {
content(reference) {
return reference.getAttribute('data-tooltip');

46
resources/views/components/code-editor.blade.php
View File

@ -11,33 +11,27 @@
disabled: @js($disabled),
lang: @js($lang),
init() {
document.body.addEventListener('htmx:afterSettle', (event) => {
let editor = null
let theme =
document.documentElement.className === 'dark'
? 'one-dark'
: 'github'
editor = window.ace.edit(this.editorId, {
tabSize: 1,
})
let contentElement = document.getElementById(
`text-${this.editorId}`,
)
editor.setValue(contentElement.innerText, 1)
if (this.disabled) {
editor.setReadOnly(true)
}
editor.getSession().setMode(`ace/mode/${this.lang}`)
let editor = null
let theme =
document.documentElement.className === 'dark'
? 'one-dark'
: 'github'
editor = window.ace.edit(this.editorId, {})
let contentElement = document.getElementById(`text-${this.editorId}`)
editor.setValue(contentElement.innerText, 1)
if (this.disabled) {
editor.setReadOnly(true)
}
editor.getSession().setMode(`ace/mode/${this.lang}`)
editor.setTheme(`ace/theme/${theme}`)
editor.setFontSize('15px')
editor.setShowPrintMargin(false)
editor.on('change', () => {
contentElement.innerHTML = editor.getValue()
})
document.body.addEventListener('color-scheme-changed', (event) => {
theme = event.detail.theme === 'dark' ? 'one-dark' : 'github'
editor.setTheme(`ace/theme/${theme}`)
editor.setFontSize('15px')
editor.setShowPrintMargin(false)
editor.on('change', () => {
contentElement.innerHTML = editor.getValue()
})
document.body.addEventListener('color-scheme-changed', (event) => {
theme = event.detail.theme === 'dark' ? 'one-dark' : 'github'
editor.setTheme(`ace/theme/${theme}`)
})
})
},
}"