github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-15 09:48:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

still on debounce

Browse Source
This commit is contained in:
Peter Olu 2022-04-24 16:03:52 +01:00
parent 1f7139d85a
commit 7f2464cc28
1 changed files with 27 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/views/dashboard/controls/Tab.vue
View File

@ -205,36 +205,34 @@ export default defineComponent({
function scrollToGraph(e: any) { function scrollToGraph(e: any) {
document?.getElementById(`tabitem${e}`)?.scrollIntoView(); document?.getElementById(`tabitem${e}`)?.scrollIntoView();
} }
function debounce(func: any, wait: number, immediate: boolean) { function debounce(func: any, wait: number) {
let timeout: any; let timeout = null;
return function () { return function (func, delayMs) {
let context = this,
args = arguments;
clearTimeout(timeout); clearTimeout(timeout);
timeout = setTimeout(function () { timeout = setTimeout(() => {
timeout = null; func();
if (!immediate) func.apply(context, args); }, delayMs || 500);
}, wait);
if (immediate && !timeout) func.apply(context, args);
}; };
} }
function scrollDecider() {
console.log("runing debounce");
console.log(window.scrollY);
}
function observeItems(kill = false) { function observeItems(kill = false) {
const observer = new IntersectionObserver((entries) => { const observer = new IntersectionObserver((entries) => {
entries.forEach( entries.forEach((element) => {
(element) => { if (element.isIntersecting && element.intersectionRatio > 0) {
if (element.isIntersecting && element.intersectionRatio > 0) { setTimeout(() => {
// console.log("Last Value:", lastItem.value); currentItem.value = element.target.id;
setTimeout(() => { }, 200);
currentItem.value = element.target.id;
}, 200);
}
},
{
// rootMargin: "-60px 0",
// container: tabObserveContainer.value
} }
); });
}); });
lastItem.value = `${
dashboardStore.currentTabItems[
dashboardStore.currentTabItems.length - 1
].i
}`;
document.querySelectorAll(".tabitem").forEach((element) => { document.querySelectorAll(".tabitem").forEach((element) => {
observer.observe(element); observer.observe(element);
}); });
@ -250,12 +248,7 @@ export default defineComponent({
() => { () => {
setTimeout(() => { setTimeout(() => {
observeItems(); observeItems();
lastItem.value = `${ console.log("Last Value:", lastItem.value);
dashboardStore.currentTabItems[
dashboardStore.currentTabItems.length - 1
].i
}`;
// console.log(lastItem.value)
}, 500); }, 500);
} }
); );
@ -338,8 +331,10 @@ export default defineComponent({
} }
); );
onMounted(() => { onMounted(() => {
window.addEventListener("scroll", (e) => { tabObserveContainer?.value?.addEventListener("scroll", (e: Event) => {
// console.log(e); debounce(() => {
console.log("Yeah!");
}, 100);
}); });
tabRef?.value["parentElement"]?.classList?.toggle("item"); tabRef?.value["parentElement"]?.classList?.toggle("item");
if (dashboardStore.fullView) { if (dashboardStore.fullView) {