CommonHIT example usage

This is a short example of how to use the functionality in CommonHIT. Please inspect this document's source code to see how certain functionality is being achieved.

This is only shown when the HIT is being previewed by a worker. (This is when the query-string contains assignmentId=ASSIGNMENT_ID_NOT_AVAILABLE.)
This is only shown when the HIT has been accepted by a worker.
This is only shown when debug mode is turned on (debug=1 in the query string). Also, in debug mode you can replace variables with dummy values: ${VIDEO} = ${VIDEO}. Note, however, that the replacement only works within child-tags of the body.

Here is how to include the YouTube player:

Attributes:

id
Any unique identifier. Required for the YouTube API.
class="lll-player"
Signals lllight.js to insert a YouTube player here.
data-video-id
The YouTube video to be played.
data-log-field
The name of the hidden form field that lllight.js will create for storing the user's interactions with the video player. 
data-name
The name of the global variable that lllight.js will use to expose the scripting functionality of the video player. For example, you can use JavaScript to .stop() the playback of a video. 
data-width, data-height
Optional: Set a custom size for the video player.

Task

Multiple choice question example:



The script in commonhit.js will automatically generate the required name and id attributes and link the label-tags to the choices.
It also works for checkboxes:




You can also include a textarea to have workers explain their answers. Within a div with class="hit-question", a name attribute will be generated automatically based on the provided data-name-attribute.
End of this HIT. You could also leave some feedback below.

Browser information

You can fill in form fields with browser information by using the following CSS classes: 
class="hit-browser-ua"
class="hit-html5-video-support"
class="hit-screen-resolution"

Feedback

If you encountered any problems with this HIT or have any other comments, please report them here: