Whats the best way to make a loop like you would in c++ and python with a while loop easily. I dont want it to repeat again while its already executing the function or code block or whatever. Ive never known what exactly to use and sometimes use setInterval, or requestAnimationFrame, but whats the best way to do this, not specifically for a game. Just something that repeatedly loops.
#infinite javascript loop
fleet junco
Like ive programmed so many things even things that took months and none were 100% accurate because i didnt know how to make loops correctly
the thing im coding now is a chrome extension that repeatedly checks for an element then executes a task when its found
unborn blade
"it depends". often setTimeout() or setInterval()
royal fiber
If you are checking for elements, the proper approach is to use a mutation observer and no loops.
fleet junco
well id be observing the entire document because im unsure of where the element would be
wouldnt that be too much?
unborn blade
no
fleet junco
okay ill try that then brb
royal fiber
well id be observing the entire document because im unsure of where the element ...
How would a loop be better? You would still check the whole document with the loop.
fleet junco
actually wait.
i noticed that the element doesnt get removed
meaning if i use an observer it wouldnt work correctly
unborn blade
what are you checking for in your loop?
why would it need to be removed for mutation observer to work?
fleet junco
okay i havent made that logic yet but i looked into it more. i need to check any existing video element with specific attributes and do something if the src is not blank
crisp kayak
I imagine running a loop constantly would cause some speed issues on whatever tabs it's active on
fleet junco
yeah i wouldnt mind a cooldown. thats why im not just using requestAnimationFrame
normally id just use setInterval but thats not like... its not very clean and ill probably need a try and catch statement because it'd fail at some point
unborn blade
a function that calls itself again via setTimeout(). just don't start another setTimeout() (don't call the function again) if you want it to stop (or there are errors)
not seeing why a mutation observer wouldn't work
fleet junco
function main(video) {
const callback = function(mutationsList, observer) {
for (let mutation of mutationsList) {
if (mutation.type === 'attributes' && mutation.attributeName === 'src') {
if (mutation.target === video) {
// loop
if (video.src === '') {
// end loop
}
video.currentTime = video.duration;
//
}
}
}
}
}
// loop
const video = document.querySelector('video[title="Advertisement"]');
if (video) {
main(video);
// end loop
}
//
here i wrote the script. how would i make a loop for the things i labeled though?
dude im so confused am i not allowed to mention
unborn blade
no mentions. odd server rule
you don't appear to be adding that callback to an observer?
fleet junco
you don't appear to be adding that callback to an observer?
yeah lemme fix that hold on. someones also bothering me
fleet junco
you don't appear to be adding that callback to an observer?
here sorry back.
function main(video) {
const callback = function(mutationsList, observer) {
for (let mutation of mutationsList) {
if (mutation.type === 'attributes') {
if (video.src !== '') {
// loop
video.currentTime = video.duration;
if (video.src === '') {
// end loop
}
//
}
}
}
}
const observer = new MutationObserver(callback);
observer.observe(video, {attributes: true, attributeFilter: ['src']});
}
// loop
const video = document.querySelector('video[title="Advertisement"]');
if (video) {
main(video);
// end loop
}
//
oops wait one more thing
there
unborn blade
your loop/end loop comments indicate you don't quite get what's going on. do you understand callbacks? do you get when that function will be called?
fleet junco
your loop/end loop comments indicate you don't quite get what's going on. do you...
i have no idea what ur talking about
but does this work
// end ad
function closeAd(video) {
if (video.src !== '') {
video.currentTime = video.duration;
setTimeout(closeAd, 50);
}
}
// end ad if playing
function waitForAd(video) {
const callback = function(mutationsList, observer) {
for (let mutation of mutationsList) {
if (mutation.type === 'attributes') {
closeAd(video);
}
}
}
const observer = new MutationObserver(callback);
observer.observe(video, {attributes: true, attributeFilter: ['src']});
}
// locate ad
function findAd() {
const Video = document.querySelector('video[title="Advertisement"]');
if (Video) {
waitForAd(Video);
} else {
setTimeout(findAd, 50);
}
}
findAd();
I gotta run but at-a-glance, no that's not how you use mutation observer. think of it like an event. you don't "loop" and run it over-and-over. you assign a callback which is called when the event occurs
read the link above
unborn blade
you may also want to read this entire section: https://javascript.info/async
unborn blade
where am i running it over and over again
setTimeout(findAd, 50)
fleet junco
yeah but if it finds it it stops
unborn blade
so you're waiting for 2 events? 1. when the video element exists and 2. when that element has a src?
you should be using mutation observers for both
fleet junco
uhh.. its just finding the element then it observes it
what if my script is late and the video element already exists before i check if it gets added
unborn blade
you can check if it exists before adding the observer 🤷🏼♂️
fleet junco
ig but whats wrong with this
fleet junco
you can check if it exists before adding the observer 🤷🏼♂️
// end ad
function closeAd(video) {
if (video.src !== '') {
video.currentTime = video.duration;
setTimeout(closeAd, 50);
}
}
// end ad if playing
function waitForAd(video) {
const observer = new MutationObserver((mutationsList) => {
for (let mutation of mutationsList) {
if (mutation.type === 'attributes') {
closeAd(video);
}
}
});
observer.observe(video, {attributes: true, attributeFilter: ['src']});
}
// locate ad
function findAd() {
const Video = document.querySelector('video[title="Advertisement"]');
if (Video) {
waitForAd(Video);
} else {
const observer = new MutationObserver((mutationsList) => {
for (let mutation of mutationsList) {
if (mutation.type === 'childList') {
mutation.addedNodes.forEach((node) => {
if (node.nodeName === "VIDEO" && node.title === "Advertisement") {
waitForAd(node);
}
})
}
}
})
observer.observe(document.body, { childList: true, subtree: true});
}
}
findAd();
good?
yeah ngl its kinda breaking and i feel like it wouldnt break if it didnt only check the video once because of the observer
unborn blade
I mean you could use a single observer with different conditions
where is it breaking?
unborn blade
not sure why it'd be any slower than repeatedly searching the DOM