[Guide] Learning to script AMT HITs

If you're interested in learning how to write a script for a HIT on mturk i've made a series of 5 videos going over some of the more common things you might want to do.
I chose the ProductRnR 8 cent HITs to script in the videos because they have quite a few elements in common with a lot of HITs, it also pops up often enough that you can follow along on that specific HIT.
I will go over some basics of jquery and some basic functions used often when scripting HITs, but the videos are no replacement for the sites designed to teach you the broader concepts of coding. As @Yuk mentions in their comment below, learning the basics of HTML CSS and how javascript interacts with them is invaluable. Code academy was mentioned (which i also used) so I've included links to their html/css, Javascript, and Jquery lessons (which i highly recommend) and a couple other resources as well.
*disclaimer: i still consider myself a noobie scripter... so erm... not an expert teacher or anything.

Spoiler: links to resources

Code Academy

https://www.codecademy.com/learn/web
https://www.codecademy.com/learn/javascript
https://www.codecademy.com/learn/jquery​

Mozilla Developer Network (MDN)

https://developer.mozilla.org/en-US/docs/Learn/JavaScript​

JSforCats (because Cats!)

http://jsforcats.com/​

In part one we learn about metadata, how to get the proper URL for our include/match line, a little jquery, and we'll end up with a one line script that selects all "related" radio buttons when the HIT is loaded.

Spoiler: W3 and Jquery API links for video 1

W3 Pages

jQuery Syntax
jQuery Selectors
jQuery Selectors
jQuery click() Method​

Jquery API Pages

jQuery() | jQuery API Documentation
Basic | jQuery API Documentation
Attribute | jQuery API Documentation
.click() | jQuery API Documentation​

Spoiler: The Code After Part 1

Code:

// ==UserScript==
// @name RNRscript
// @version .01
// @description This is easy
// @author You
// @include *mturkcontent*
// @require https://code.jquery.com/jquery-3.0.0-alpha1.min.js
// ==/UserScript==
$("input[value=QueryImage_Related]").click();

In part two we go over the dangers of running a script without a sanity check and i'll show you my way of creating one (there are many ways to do it). We'll learn what exactly a sanity check does, how to use console.log(), and how to call an element using generic selectors and the .eq() function of jquery.

Spoiler: W3 and Jquery API links for video 2

W3 Pages

jQuery eq() Method
jQuery text() Method​

Jquery API Pages

:eq() Selector | jQuery API Documentation
.text() | jQuery API Documentation​

Spoiler: The Code After Part 2

Code:

// ==UserScript==
// @name RNRscript
// @version .01
// @description This is easy
// @author You
// @include *mturkcontent*
// @require https://code.jquery.com/jquery-3.0.0-alpha1.min.js
// ==/UserScript==
var sanity = "Unrelated or Only Indirectly Related";
if($("b").eq(1).text() === sanity){
console.log("Running");
$("input[value=QueryImage_Related]").click();
}

In part three we're going to create a keyup() event listener that will click the submit button when "enter" is released. We'll briefly go over the event data using console.log() including finding the keycode of a keyboard event without external sites. *Note that i probably should have included an event.preventDefault(); line at the end of the video, but i plan on going through that in a future video.

Spoiler: W3 and Jquery API links for video 3

W3 Pages

JavaScript Events
jQuery Event Methods
jQuery keyup() Method​

Jquery API Pages

.keyup() | jQuery API Documentation
Keyboard Events | jQuery API Documentation
​

Keycode website used in vid

Javascript Char Codes (Key Codes) - Cambia Research​

Spoiler: The Code After Part 3

*please note i added the event.preventDefault() line, i discuss this in the last video

Code:

// ==UserScript==
// @name RNRscript
// @version .01
// @description This is easy
// @author You
// @include *mturkcontent*
// @require https://code.jquery.com/jquery-3.0.0-alpha1.min.js
// ==/UserScript==
var sanity = "Unrelated or Only Indirectly Related";
if($("b").eq(1).text() === sanity){
console.log("Running");
$("input[value=QueryImage_Related]").click();
}
$(document).keyup(function(event) {
if(event.which == 13){
event.preventDefault();
$("#SubmitButton").click();
}
});

In part four we're going to hide the instructions using .toggle(), insert an html button element then write a click event listener that will toggle the instructions back to visible.

Spoiler: W3 and Jquery API links for video 4

W3 Pages

jQuery toggle() Method
jQuery HTML / CSS Methods
jQuery before() Method​

Jquery API Pages

.toggle() | jQuery API Documentation
DOM Insertion, Outside | jQuery API Documentation​

Spoiler: The Code After Part 4

Code:

// ==UserScript==
// @name RNRscript
// @version .01
// @description This is easy
// @author You
// @include *mturkcontent*
// @require https://code.jquery.com/jquery-3.0.0-alpha1.min.js
// ==/UserScript==
var sanity = "Unrelated or Only Indirectly Related";
if($("b").eq(1).text() === sanity){
console.log("Running");
$("input[value=QueryImage_Related]").click();
}
$(document).keyup(function(event) {
if(event.which == 13){
event.preventDefault();
$("#SubmitButton").click();
}
});
$("#header").toggle();
var myButton = '<button type="button" id="myButton">Instructions</button>';
$("#header").before(myButton);
$("#myButton").click(function(){
$("#header").toggle();
});

In the last video we use a couple tree traversal methods to toggle the radio buttons when we click the image above them. We'll use event.preventDefault to stop the default action of clicking on the images and end up with something that could be used to do a few HITs. (because what's the point if you never use it). I end a bit rambly but i just couldn't say goodbye

Spoiler: W3 and Jquery API links for video 5

W3 pages
http://www.w3schools.com/jquery/jquer...
http://www.w3schools.com/jquery/trave...
http://www.w3schools.com/jquery/trave...

Jquery API pages
https://api.jquery.com/category/trave...
https://api.jquery.com/siblings/
https://api.jquery.com/children/

Spoiler: The Code After Part 5

Code:

// ==UserScript==
// @name RNRscript
// @version .01
// @description This is easy
// @author You
// @include *mturkcontent*
// @require https://code.jquery.com/jquery-3.0.0-alpha1.min.js
// ==/UserScript==
var sanity = "Unrelated or Only Indirectly Related";
if($("b").eq(1).text() === sanity){
console.log("Running");
$("input[value=QueryImage_Related]").click();
}
$(document).keyup(function(event) {
if(event.which == 13){
event.preventDefault();
$("#SubmitButton").click();
}
});
$("#header").toggle();
var myButton = '<button type="button" id="myButton">Instructions</button>';
$("#header").before(myButton);
$("#myButton").click(function(){
$("#header").toggle();
});
$(".imagebox").click(function(event){
event.preventDefault();
var THIS = $(this).siblings().children("input");
if(THIS.eq(0).prop('checked') === true){
THIS.eq(1).click();
}
else{
THIS.eq(0).click();
}
});

 

Awesome!

 

I think this guide (when you're through with it, of course) would make an excellent contribution for the Wiki.

 

I was talking a bit with @ChrisTurk about that but im actually really bad at bbcode he had to pretty much re-do the entire Overwatch page for me so if someone wants to create one around this thread that'd be great, but i'd probably just make more work for the admin

 

@ChrisTurk is so nice.

 

Great guide! Thank you for creating and sharing it with us.

Something I would like to add: From my own personal experience of learning to script, I didn't even understand a basic page layout of CSS or HTML or anything like that at the start, as I assume 99% of other turkers also fall into. I feel like acquiring a basic understanding of CSS and HTML as a first step is a must for any form of scripting. The website I learned the basics of CSS and HTML from is https://www.codecademy.com/

They have courses you can select from (for free) where they will walk you through on the subject of whatever course you've selected. Of course, most of those guides are extremely generic and broad and you don't need to know a lot at all to write a script for an mturk HIT. I think I only went through half of the CSS/HTML course and like 25% of the Javascript course before I realized that beyond the basics of the basics what they were teaching me wasn't relevant to making a good mturk script at all.

It took me literally 3 or 4 hours total sitting down and following their guide before I was able to write my own functioning script (which is easy on a slow weekend). If your videos had existed back then it would've definitely expedited it even more.
Also, analyzing scripts you already have to see how they work is super super helpful after you've already completed these beginner steps.

 

Thank you so much.

 

I'm late, but this awesome dude!

 

Rigged together my very first script for a different batch while watching these videos. Thanks so much @Ethraiel!

 

Here are the youtube links from the OP that @ChrisTurk broke like the monster that he is

Video parts 1-5
https://youtu.be/a2oRU4F-KJA
https://youtu.be/7NzR6w2j-uo
https://youtu.be/wNN9eMuP8Ks
https://youtu.be/s_SYkMwzGr4
https://youtu.be/oFcyz-3-0Rs

 

hai

 

I've been looking through the JQuery API along with a number of coding websites. The .click() function works great for the radio buttons but is there something that works on sliders? A function that moves the slider all the way to the right for example.

 

Oh swet thanks I'm about to watch these tonight and get to work! luckily I have html css networking and beginning programming experience too

 

I believe I saw something like that I will see if I can find it again.

 

I did this in the past and it worked great, for some reason now I get the error with Jquery "$ is not defined"

Can anyone help with this?

 

I don't use Jquery anymore, but I know Tampermonkey updated and it stopped recognizing it natively.
Try adding this to the top:

Code:

var $ = window.jQuery;

 

That worked, thanks. Trying to figure this A9 hit out and it is kicking my ass. Hits all of the yes buttons.

 

These are some old posts but I find it hard to believe people didnt get mass banned for this. As a programmer myself this is sooooooo easily detectable, are they that incompetent?

 

Well, this isn't cheating. This is about being smart and working efficiently. The worker still has to think and work to complete the HIT.