Tools page customization

[miken32]

Implement feature request for customization of lists at https://stackoverflow.com/tools as described in #505.

One thing lacking is inability to add radio buttons to the settings to select question/answer/all. Like you can add a single setting of type "radio" but without ability to link them together it's kind of useless.

Also was unable to get sox.helpers.addAjaxListener to work, but didn't spend much time figuring out why since I just went with the mutation observer instead.

[miken32]

I'm going to convert this to draft for now and do some more testing since it's been a while and seems to be acting a bit flaky for me. I'm still not able to get the ajax listener working, FWIW.

[shu8]

Hm, it seemed to work for me when I tried it locally, does nothing happen when you use the ajax listener?

[miken32]

Hm, it seemed to work for me when I tried it locally, does nothing happen when you use the ajax listener?

Well, nothing happens at first. Opening up one of the lists triggers the listener, as does changing tabs. Seems inconsistent, and oddly enough only seems to happen when I have the dev console open.

Check this video where you can see I have multiple items shown (the custom setting is at 8 items) then I reload the page and only have 3. You can also see the expected Ajax requests were made. I change tabs and come back, and the listener has fired. It's not a time delay; I can wait 5 minutes and nothing will happen until the tab loses focus and regains it again. Very strange.

[shu8]

I wonder if what's happening is that the tab change triggers the focus, and only then does the feature actually run, due to this code which is what actually triggers Feature functions:

https://github.com/soscripted/sox/blob/78d65e714bf1729f4354b45322b353ac96ec508a/sox.user.js#L181-L187

But - if this is the case, it's strange that you wouldn't experience the same issue with the Mutation Observer approach.

---

This is what it looks like for me, with listCount=2, with a tab switch in between:

when using this code for the entire feature:

  customizeToolsPageLists: function(settings) {
    const trimLists = function(table) {
      if (settings.filterInvalid) {
        table.querySelectorAll("td.tagged-ignored").forEach(cell => cell.parentNode.remove());
      }
      if (settings.filterTypeQuestions) {
        table.querySelectorAll("a.question-hyperlink").forEach(cell => cell.parentNode.parentNode.remove());
      }
      if (settings.filterTypeAnswers) {
        table.querySelectorAll("a.answer-hyperlink").forEach(cell => cell.parentNode.parentNode.remove());
      }
      const listCount = settings.listCount || 3;
      const rows = table.querySelectorAll("tr");
      rows.forEach((row, i) => row.classList.toggle("collapsing", i >= listCount));
    };
   // tables are populated by XHR after page loads
    sox.helpers.addAjaxListener("\\/tools\\?tab=", () => {
      console.log('fire')
      document.querySelectorAll("table.summary-table").forEach(trimLists);
    });
    // just in case we come in after a table has been loaded already
    document.querySelectorAll("table.summary-table").forEach(trimLists);
  }

---

In any case, if this definitely doesn't work for you, I'm happy to merge in the Mutation Observer approach, because there's not many other features that run on this page anyway (the main issue with observers used to be when lots of features applied their own to the same page e.g., a post page which lots of SOX features target).