2022-08-31 13:19:30 -06:00
|
|
|
function gradioApp(){
|
2022-09-02 14:25:29 -06:00
|
|
|
return document.getElementsByTagName('gradio-app')[0].shadowRoot;
|
2022-08-31 13:19:30 -06:00
|
|
|
}
|
|
|
|
|
2022-09-23 17:12:13 -06:00
|
|
|
function get_uiCurrentTab() {
|
|
|
|
return gradioApp().querySelector('.tabs button:not(.border-transparent)')
|
|
|
|
}
|
|
|
|
|
2022-09-17 23:37:03 -06:00
|
|
|
uiUpdateCallbacks = []
|
2022-09-23 17:12:13 -06:00
|
|
|
uiTabChangeCallbacks = []
|
|
|
|
let uiCurrentTab = null
|
|
|
|
|
2022-09-17 23:37:03 -06:00
|
|
|
function onUiUpdate(callback){
|
|
|
|
uiUpdateCallbacks.push(callback)
|
2022-09-16 18:03:03 -06:00
|
|
|
}
|
2022-09-23 17:12:13 -06:00
|
|
|
function onUiTabChange(callback){
|
|
|
|
uiTabChangeCallbacks.push(callback)
|
|
|
|
}
|
2022-09-16 18:03:03 -06:00
|
|
|
|
2022-09-23 17:12:13 -06:00
|
|
|
function runCallback(x){
|
|
|
|
try {
|
|
|
|
x()
|
|
|
|
} catch (e) {
|
|
|
|
(console.error || console.log).call(console, e.message, e);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
function executeCallbacks(queue) {
|
|
|
|
queue.forEach(runCallback)
|
2022-08-31 13:19:30 -06:00
|
|
|
}
|
|
|
|
|
|
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
|
|
var mutationObserver = new MutationObserver(function(m){
|
2022-09-23 17:12:13 -06:00
|
|
|
executeCallbacks(uiUpdateCallbacks);
|
|
|
|
const newTab = get_uiCurrentTab();
|
|
|
|
if ( newTab && ( newTab !== uiCurrentTab ) ) {
|
|
|
|
uiCurrentTab = newTab;
|
|
|
|
executeCallbacks(uiTabChangeCallbacks);
|
|
|
|
}
|
2022-08-31 13:19:30 -06:00
|
|
|
});
|
2022-09-02 14:25:29 -06:00
|
|
|
mutationObserver.observe( gradioApp(), { childList:true, subtree:true })
|
2022-08-31 13:19:30 -06:00
|
|
|
});
|
2022-09-26 10:12:55 -06:00
|
|
|
|
|
|
|
/**
|
|
|
|
* checks that a UI element is not in another hidden element or tab content
|
|
|
|
*/
|
|
|
|
function uiElementIsVisible(el) {
|
|
|
|
let isVisible = !el.closest('.\\!hidden');
|
|
|
|
if ( ! isVisible ) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
while( isVisible = el.closest('.tabitem')?.style.display !== 'none' ) {
|
|
|
|
if ( ! isVisible ) {
|
|
|
|
return false;
|
|
|
|
} else if ( el.parentElement ) {
|
|
|
|
el = el.parentElement
|
|
|
|
} else {
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return isVisible;
|
|
|
|
}
|