Procore Development helper (Mturk)

Makes it easier to do Procore Development drawing number and title HITs on Mturk.
当前为 2014-07-16 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name        Procore Development helper (Mturk)
// @author      DonovanM (dnast)
// @description Makes it easier to do Procore Development drawing number and title HITs on Mturk.
// @include     https://www.procoretech.com/mechanical_turk/show_drawing_revision*
// @include     http://www.procoretech.com/mechanical_turk/show_drawing_revision*
// @require     https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js
// @version     0.9.1
// @grant       none
// @namespace https://greasyfork.org/users/3408
// ==/UserScript==

// Automatically scrolls to the bottom right on load. Whatever you type into the floating
// form will be entered into the real form. Pressing enter or clicking the Done button will
// bring the window back to the top with the input fields filled in (so you can preview
// before you submit). Hitting Enter again will submit the hit. Use Ctrl + arrow keys to
// move around the window.

var clone;

$(document).ready(function() {
    // Stretch out the input boxes to make sure everything was typed out correctly
    $("#drawing_number").css('width', "500px");
    $("#drawing_title").css('width', "500px");

    var form = $("<form>");

    // Container
    var div = $("<div>")
        .css('position', "fixed")
        .css('right', "0px")
        .css('bottom', "0px")
        .css('padding', "3px")
        .css('background-color', "rgba(160,215,255,0.75)")
        .css('border', "1px solid rgba(130,200,220,0.75)")
        .css('border-width', "1px 0 0 1px")
        .css('border-radius', "2px 0 0 0")
        .css('font', "11pt sans-serif")
        .append(
            $("<p>") 
            .html("Drawing/sheet number: ")
            .append(
                $("<input>") // First input (drawing number)
                .attr('id', "clone_number")
                .keydown(function() { clone.number() })
            )
        )
        .append(
            $("<p>")
            .html("Drawing/sheet title: ")
            .css('margin-left', "20px")
            .append(
                $("<input>") // Second input (drawing number)
                .attr('id', "clone_title")
                .css('width', "500px")
                .keydown(function() { clone.title() })
            )
            .append(
                $("<button>") // Done button (doesn't submit, just takes you to the real sumbit button)
                .html("Done")
                .prop('type', "button")
                .css('margin', "0 10px 0 20px")
                .click(function() {
                    $(window).scrollTop(0).scrollLeft(0);
                    $("button[name='commit']").focus();
                })
            )
        )

    // Add some shared styles
    $("p", div).css('text-align', "right").css('display', "inline");
    $("input", div).css('background-color', "rgba(255,255,255,0.65)").css('border', "1px solid #ddd");


    form.append(div);
    $("body").append(form);

    $("#clone_number")[0].focus();
    clone = new Clone();
});

$(window).load(function(e) {
    // Timeout needed for Chrome or it will scroll to the bottom right and quickly back to it's original position
    // otherwise. Not sure if a longer timeout is needed for slower computers.
    setTimeout(function() { $(window).scrollTop($(window).height()).scrollLeft($(document).outerWidth() - $(window).width()); }, 100); 
});

// Clone object. Copies text from the floating form to the HIT form. Created as an object to keep references to
// jQuery objects instead of doing a search on each keypress. The timeout allows the text to go into the floating
// form before copying it, otherwise it'll copy before the text is actually in the input box.
function Clone() {
    var self = this;
    this.numberBox = $("#drawing_number");
    this.titleBox = $("#drawing_title");
    this.numberClone = $("#clone_number");
    this.titleClone = $("#clone_title");

    this.number = function() {
        setTimeout(function() {
            self.numberBox.val(self.numberClone.val());
        }, 100);
    }

    this.title = function() {
        setTimeout(function() {
            self.titleBox.val(self.titleClone.val());
        }, 100);
    }
}

$(document).keydown(function(e) {
    if (e.keyCode == 13) {
        $(window).scrollTop(0).scrollLeft(0);
        $("button[name='commit']").focus();
    } else if (e.ctrlKey) {
        switch (e.keyCode) {
            case 38: // Up
                $(window).scrollTop(0);
                break;
            case 40: // Down
                $(window).scrollTop($(this).height());
                break;
            case 37: // Left
                $(window).scrollLeft(0);
                break;
            case 39: // Right
                $(window).scrollLeft($(document).outerWidth() - $(window).width());
        }
    }
});