[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. })();