☰

mmmturkeybacon Preview Overlay

Covers a HIT's workspace with a gray overlay if the HIT has not been accepted. Clicking once on the overlay will remove the gray foreground and allow you to interact with the HIT's contents while still showing a message warning you the hit has not been accepted.

  1. // ==UserScript==
  2. // @name        mmmturkeybacon Preview Overlay
  3. // @version     1.02
  4. // @description Covers a HIT's workspace with a gray overlay if the HIT has not been accepted. Clicking once on the overlay will remove the gray foreground and allow you to interact with the HIT's contents while still showing a message warning you the hit has not been accepted.
  5. // @author      mmmturkeybacon
  6. // @namespace   http://userscripts.org/users/523367
  7. // @include     http://*/*
  8. // @include     https://*/*
  9. // @exclude     https://www.mturk.com/mturk/takequalificationtest
  10. // @require     https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js
  11. // @grant       GM_log
  12. // ==/UserScript==
  13.  
  14. $(window).load(function()
  15. {
  16.     var $hit_wrapper = $('div[id="hit-wrapper"]');
  17.     if(window.location.hostname == 'www.mturk.com' && $hit_wrapper.length > 0)
  18.     {//internal HIT
  19.         $hit_wrapper.css({"position": "relative"});
  20.         var offset = $hit_wrapper.offset();
  21.         $hit_wrapper.append('<div id="mtb_preview_overlay" \
  22.                                title="This HIT has not been accepted. Click once to interact with content." \
  23.                                style="position: absolute; left: 0px; top: 0px; \
  24.                                       width: 100%; height: 100%; \
  25.                                       opacity: 0.6; background-color: #000; z-index: 99; \
  26.                                       color: #333; \
  27.                                       font-family: &quot;Helvetica Neue&quot;,Helvetica,Arial,sans-serif; \
  28.                                       font-size: 14px; \
  29.                                       line-height: 20px; \
  30.                                       cursor: not-allowed"> \
  31.                                  <h1 style="position: fixed; left: '+offset.left+'; top:'+offset.top+';  \
  32.                                      color: #333; \
  33.                                      font-family: inherit; \
  34.                                      font-weight: 700; \
  35.                                      color: inherit; \
  36.                                      text-rendering: optimizelegibility; \
  37.                                      line-height: 40px; \
  38.                                      font-size: 10em; \
  39.                                      margin: 0px auto; \
  40.                                      padding: 75px 0px 0px 0px; \
  41.                                      text-align:center; \
  42.                                      width: 100%;">Preview</h1></div>');
  43.  
  44.         $('div[id="mtb_preview_overlay"]').bind('click', function()
  45.         {
  46.             this.style.pointerEvents = "none";
  47.             this.style.backgroundColor = "rgba(0, 0, 0, 0.0)";
  48.             this.style.color = "#F00";
  49.         });
  50.     }
  51.     else if(window.location != window.top.location === true && window.location.href.indexOf("ASSIGNMENT_ID_NOT_AVAILABLE") > -1)
  52.     {//external HIT
  53.         $('div[id="preview_overlay"]').remove();
  54.         $('body').append('<div id="mtb_preview_overlay" \
  55.                                title="This HIT has not been accepted. Click once to interact with content." \
  56.                                style="position: fixed; left: 0px; top: 0px; \
  57.                                       width: 100%; height: 100%; \
  58.                                       opacity: 0.6; background-color: #000; z-index: 99; \
  59.                                       color: #333; \
  60.                                       font-family: &quot;Helvetica Neue&quot;,Helvetica,Arial,sans-serif; \
  61.                                       font-size: 14px; \
  62.                                       line-height: 20px; \
  63.                                       cursor: not-allowed"> \
  64.                               <h1 style="color: #333; \
  65.                                         font-family: inherit; \
  66.                                         font-weight: 700; \
  67.                                         color: inherit; \
  68.                                         text-rendering: optimizelegibility; \
  69.                                         line-height: 40px; \
  70.                                         font-size: 10em; \
  71.                                         margin: 0px auto; \
  72.                                         padding: 75px 0px 0px 0px; \
  73.                                         text-align:center; \
  74.                                         width: 100%;">Preview</h1></div>');
  75.  
  76.         $('div[id="mtb_preview_overlay"]').bind('click', function()
  77.         {
  78.             this.style.pointerEvents = "none";
  79.             this.style.backgroundColor = "rgba(0, 0, 0, 0.0)";
  80.             this.style.color = "#F00";
  81.         });
  82.     }
  83. });