dgtlmoon / changedetection.io

The best and simplest free open source web page change detection, website watcher, restock monitor and notification service. Restock Monitor, change detection. Designed for simplicity - Simply monitor which websites had a text change for free. Free Open source web page change detection, Website defacement monitoring, Price change notification
https://changedetection.io
Apache License 2.0
17.3k stars 965 forks source link

Button to open all Diffs #511

Open mat-hil opened 2 years ago

mat-hil commented 2 years ago

Version and OS Via Lemonade

Describe the solution you'd like A button that opens up all sites in a new tab where a diff has occurred

Describe the use-case and give concrete real-world examples When I check once a morning, around 50 sites have noticed a change. To see whether a meaningful change has occurred, I give all diffs a quick scan. However, for that I need to click on all "Diff" buttons where a change has been registered. This is a bit tedious and I would save around 3 minutes a day by having a button that allowed me to open all the diffs at once.

Two suggested solutions

One option: Screenshot 2022-03-30 at 21 26 02

The other option: image

dgtlmoon commented 2 years ago

@mat-hil glad you like the software!

I had the same idea but I could not get it to work, it seems that chrome/firefox wont let you fire off new multiple window.open()'s so simply just with a JS loop, the correct implementation looks horribly complex , but I'm open to PR's, or this might take some time to implement

https://developer.chrome.com/docs/extensions/reference/tabs/#opening-an-extension-page-in-a-new-tab https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Working_with_the_Tabs_API

For example, this wont work, even when calling the window name a something special each time '_newtab'+index When added to watch-overview.js https://github.com/dgtlmoon/changedetection.io/blob/04c62f5e7f9ab8bf7fba482160c79ae5076e5f21/changedetectionio/static/js/watch-overview.js

  $('#open-all-diffs').click(function () {
    $('.watch-table tr.unviewed').each(function (index) {
      window.open($('.diff-link',this).attr('href'), '_newtab'+index);
      $(this).removeClass('unviewed');
    });
    $(this).hide();
  });
<li>
  <a href="#" class="pure-button button-tag" id="open-all-diffs">Open all Diffs</a>
</li>
mat-hil commented 2 years ago

Appreciate the efforts @dgtlmoon – thanks so much!

I'm not a pro in JS, but I'll try to do a bit of research and play around with it next week.

mat-hil commented 2 years ago

@dgtlmoon from what I gather, Chrome blocks windows.open(), but this can easily be allowed by the user. image

So your code should work fine, and it might just require a small explanation for users that they need to allow popups.

Tried a simple example from https://tutorial.eyehunts.com/js/open-multiple-urls-with-one-click-javascript-example-code/ and it works like a charm in Chrome.

mat-hil commented 2 years ago

@dgtlmoon would you be able to try the code and see whether the popups indeed get blocked?

jathri commented 1 year ago

@mat-hil You can try this addon: https://cpriest.github.io/SnapLinksPlus/#/. It makes opening multiple links much easier.

mat-hil commented 1 year ago

@mat-hil You can try this addon: https://cpriest.github.io/SnapLinksPlus/#/. It makes opening multiple links much easier.

Thanks a lot for the suggestion! Ended up using Linkclump https://chrome.google.com/webstore/detail/linkclump/lfpjkncokllnfokkgpkobnkbkmelfefj/related and it works amazing!