☰

[MTurk Worker] HIT Details Enhancer

Changes the HIT Details link text to the requester name, changes the requester name inside the popup to a link that searches for their HITs and adds the remaining HIT count to the details bar.

  1. // ==UserScript==
  2. // @name         [MTurk Worker] HIT Details Enhancer
  3. // @namespace    https://github.com/Kadauchi
  4. // @version      1.0.3
  5. // @description  Changes the HIT Details link text to the requester name, changes the requester name inside the popup to a link that searches for their HITs and adds the remaining HIT count to the details bar.
  6. // @author       Kadauchi
  7. // @icon         http://i.imgur.com/oGRQwPN.png
  8. // @include      https://worker.mturk.com/projects/*/tasks*
  9. // ==/UserScript==
  10.  
  11. function reactRequire(string) {
  12.     const element = document.querySelector(`[data-react-class="require('${string}')['default']"]`);
  13.  
  14.     if (element) {
  15.         try {
  16.             const reactProps = JSON.parse(element.dataset.reactProps);
  17.             return { element: element, reactProps: reactProps };
  18.         }
  19.         catch (error) {
  20.             return false;
  21.         }
  22.     }
  23.     return false;
  24. }
  25.  
  26. (function() {
  27.     const react = reactRequire(`reactComponents/common/ShowModal`);
  28.     const react2 = reactRequire(`reactComponents/modal/MTurkWorkerModal`);
  29.  
  30.     const details = react.element.closest(`.project-detail-bar`).firstElementChild.lastElementChild.firstElementChild;
  31.  
  32.     react.element.firstChild.textContent = react.reactProps.modalOptions.requesterName;
  33.     details.firstElementChild.className = `col-xs-4 text-xs-center col-md-4 text-md-center`;
  34.     details.lastElementChild.className = `col-xs-4 text-xs-center col-md-4 text-md-right`;
  35.  
  36.     const available = document.createElement(`div`);
  37.     available.className = `col-xs-4 text-xs-center col-md-4 text-md-center`;
  38.  
  39.     const availableLabel = document.createElement(`span`);
  40.     availableLabel.className = `detail-bar-label`;
  41.     availableLabel.textContent = `HITs: `;
  42.     available.appendChild(availableLabel);
  43.  
  44.     const availableValue = document.createElement(`span`);
  45.     availableValue.className = `detail-bar-value`;
  46.     availableValue.textContent = react.reactProps.modalOptions.assignableHitsCount;
  47.     available.appendChild(availableValue);
  48.  
  49.     details.insertBefore(available, details.lastElementChild);
  50.  
  51.     const observer = new MutationObserver((mutations) => {
  52.         mutations.forEach((mutation) => {
  53.             const addedNode = mutation.addedNodes[0];
  54.  
  55.             if (addedNode.matches(`#modalProjectDetailsModal`) === true) {
  56.                 const requester = addedNode.querySelector(`[data-reactid=".8.0.0.1.0.0.1"]`);
  57.  
  58.                 const link = document.createElement(`a`);
  59.                 link.href = `https://worker.mturk.com/requesters/${react.reactProps.modalOptions.contactRequesterUrl.match(/requesterId=(\w+)/)[1]}/projects`;
  60.                 link.target = `_blank`;
  61.                 link.textContent = react.reactProps.modalOptions.requesterName;
  62.  
  63.                 requester.replaceWith(link);
  64.             }
  65.         });
  66.     });
  67.  
  68.     observer.observe(react2.element, { childList: true });
  69. })();