Mturk Expanded Header (Cached)

Gives you an expanded header with transfer balance and Worker ID without polling on every page load. This also works on the latest Firefox (the other scripts will break soon).

目前為 2014-07-12 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name        Mturk Expanded Header (Cached)
// @namespace   DonovanM
// @author	DonovanM (dnast)
// @description Gives you an expanded header with transfer balance and Worker ID without polling on every page load.  This also works on the latest Firefox (the other scripts will break soon).
// @include     https://www.mturk.com/mturk/*
// @require     https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js
// @version     0.9
// @grant       none
// ==/UserScript==


/** Users can change the values below to thier liking. The cache_time is the
    number of minutes before the balance is checked again. For the colors
    you can use hex i.e. "#ABC123" or RBG(A) i.e. "rgba(100,255,220, .8)".
	Just make sure the color values are in quotes (but not the cache time).
**/
var UserSettings = { };
UserSettings.cache_time = 5;			// Minutes to wait between updating
UserSettings.idColor = "#c60";			// Color of the WorkerId highlight
UserSettings.balanceColor = "#03B603";	// Color of the balance amount. Use "#000" to go back to black
/** End of user settings **/


var LOCAL_STORAGE = "expanded_header_data";

$(document).ready(function() {
	var header = new Header();
});

function Header() {
	this.URL = "https://www.mturk.com/mturk/dashboard";
	this.CACHE_TIME = UserSettings.cache_time * 60000; // Convert mins to millis
	this.isSignedIn = false;
	this.init();
}

Header.prototype.init = function() {
	this.addStyle();
	this.addDiv();
	this.getData();
}

Header.prototype.addDiv = function() {
	// Get the place in the document to add the header
	var container = $("#user_name_field").parent();

	if (container.length === 0)
		container = $("#lnkWorkerSignin").parent();
	else
		this.isSignedIn = true;

	// Create the div
	var div = $("<div>").attr('id', "expandedHeader")
		.append(
			"Transfer Balance: ",
			$("<span>").addClass("balance"),
			" | Worker ID: ",
			$("<input>").addClass("workerId").prop('readonly', true)
				.hover(function() {	$(this).select(); }, function() { $(this).focus(); $(this).blur(); })
		);

	// Add the div to the page
	container.append(div);
}

Header.prototype.getData = function() {
	// Get cached data from local storage and get the current time
	var data = JSON.parse(localStorage.getItem(LOCAL_STORAGE));
	var currentTime = new Date().getTime();

	// If the info is cached but the cache time hasn't been exceeded, load the cached values.
	// If user isn't logged in, use cached values no matter how old.
	if ((data !== null) && (!this.isSignedIn || (currentTime - data.timestamp < this.CACHE_TIME))) {
		this.setValues(data.balance, data.workerId);
	} else if (this.isSignedIn) {
		// Otherwise load the data from mturk.com (if signed in)
		var self = this;

		this.loadData(function(results) {
			self.setValues(results.balance, results.workerId);
			localStorage.setItem(LOCAL_STORAGE,
				JSON.stringify({
					balance: results.balance,
					workerId: results.workerId,
					timestamp: new Date().getTime()
				})
			);
		});
	} else {
		console.log("Not logged in and no cached data");
	}
}

Header.prototype.setValues = function(balance, workerId) {
	$("#expandedHeader .balance").text(balance);
	$("#expandedHeader .workerId").attr('value', workerId);
}

Header.prototype.loadData = function(callback) {
	$.get(this.URL, function(data) {
		var balance = $("#transfer_earnings .reward", data).text();
		var workerId = data.match(/Your Worker ID: ([0-9A-Z]+)/)[1];

		callback({ workerId: workerId, balance: balance});
	})
}

Header.prototype.addStyle = function() {
 $("head").append("\
 	<style type=\"text/css\">\
 	#expandedHeader { margin: 1px }\
 	#expandedHeader .balance { font-weight: bold; color: " + UserSettings.balanceColor + " }\
 	#expandedHeader .workerId { font-weight: bold; border: none; width: 115px; color: " + UserSettings.idColor + " }\
 	</style>\
 	");
}