Steam showcase uploader. Upload long artworks/screenshots on "edit profile" page directly to showcase by choosing file or with drag and drop.

minified version for bookmarklet

javascript:(function(){function%20a(a){if(!a.firstElementChild.hasAttribute("data-initiated")){a.firstElementChild.setAttribute("data-initiated",1);var%20b=a.getAttribute("data-eshowcasetype");[].forEach.call(a.querySelectorAll(".screenshot_showcase_primary,%20.screenshot_showcase_smallscreenshot.showcase_slot"),function(a){a.setAttribute("data-eshowcasetype",b),0==a.clientHeight&&(a.style.minHeight="300px"),a.addEventListener("click",c,!0),a.addEventListener("dragover",d,!0),a.addEventListener("dragleave",e,!1),a.addEventListener("drop",e,!0),a.classList.contains("openslot")||a.classList.add("not-open")})}}function%20b(b,c){var%20d=b[0].target;a(d)}function%20c(a){a.preventDefault(),a.stopPropagation(),k.parentNode&&k.parentNode.removeChild(k),k.target=this,k.click()}function%20d(a){k.parentNode!==this&&(k.target=this,this.insertBefore(k,this.firstChild)),this.classList.add("dragover")}function%20e(a){this.classList.remove("dragover")}function%20f(){this.parentNode&&this.parentNode.removeChild(this);var%20a=this.cloneNode(!0);a.files=this.files;var%20b=this.target.getAttribute("data-eshowcasetype"),c=JSON.parse(this.target.getAttribute("data-slotjson")),d=c.slot;if(a.files&&a.files[0]){var%20e=a.files[0],f=e.name.lastIndexOf("."),h=e.name.substring(f+1).toLowerCase();if(["jpg","png","gif","jpeg"].indexOf(h)<0)return%20void%20alert("You%20can%20only%20upload%20JPG,%20PNG%20and%20GIF%20files.");if(e.size>10485760)return%20void%20alert("You%20can%20only%20upload%20files%20less%20than%2010%20MB%20in%20file%20size.");g(d,b,a,f)}else%20alert("No%20file%20selected.")}function%20g(a,b,c,d){var%20e=c.files[0],f=new%20FileReader;f.addEventListener("load",function(){var%20g=new%20Image;g.addEventListener("load",function(){window.clearTimeout(i);var%20f=g.width,j=g.height,k=window.prompt("Enter%20title",e.name.substring(0,d)),l=window.open("/sharedfiles/edititem/767/3/","","width=,height=,resizable=no");l?(l.resizeTo(0,0),l.onload=function(){h(l,k,a,b,c,f,j)}):alert("Allow%20popups%20first!")});var%20i=window.setTimeout(function(){alert("That's%20not%20an%20image!")},500);g.src=f.result}),f.readAsDataURL(e)}function%20h(a,b,c,d,e,f,g){a.document.body.appendChild(l);var%20h=a.document.getElementsByName("file")[0];h.parentNode.replaceChild(e,h);var%20j={13:3,7:5}[d];a.document.getElementsByName("title")[0].value=b,a.document.getElementsByName("agree_terms")[0].checked=!0,0==c&&506==f&&g>506||c>0&&c<4&&100==f&&g>80?(a.document.getElementsByName("image_width")[0].value=1e3,a.document.getElementsByName("image_height")[0].value=1):(a.document.getElementsByName("image_width")[0].value=f,a.document.getElementsByName("image_height")[0].value=g),a.document.getElementsByName("file_type")[0].value=j,a.document.getElementsByName("cloudfilenameprefix")[0].value=Math.trunc(Date.now()/1e3)+"_",a.document.getElementById("Visibility0").checked=!0,a.onunload=function(){function%20b(){a.location.search.indexOf("fileuploadsuccess")>-1&&(window.clearInterval(e),i(a,c,d))}var%20e=window.setInterval(b,50)},a.document.getElementById("SubmitItemForm").submit()}function%20i(a,b,c){var%20d=a.location.search;if(a.close(),d.indexOf("id=")==-1)return%20alert("Some%20error%20occured.%20Post%20your%20browser,%20file%20you%20wanted%20to%20upload%20and%20code%20below%20to%20author%20of%20this%20script.\n"+d),void%20a.close();var%20e=d.match(/id=(\d+)/)[1];j.push({scType:c,slot:b,id:e,running:!1})}window.setInterval(function(){if(j.length){var%20a=j[0];if(a.running){var%20b='div[data-eshowcasetype="'+a.scType+'"]%20.screenshot_showcase_'+(0==a.slot?"primary":"smallscreenshot:nth-child("+a.slot+")"),c=JSON.parse(document.querySelector(b).getAttribute("data-slotjson"));c.publishedfileid==a.id&&j.shift()}else%20a.running=!0,PreviewShowcaseConfigWithSlotChange(a.scType,a.slot,{publishedfileid:a.id})}},200);var%20j=[];window.setTimeout(function(){var%20a=window.open("/?CLOSE_ME","","width=300,height=");a?a.close():alert("Allow%20popups!")},1);var%20k=document.createElement("input");k.type="file",k.name="file",k.style.opacity=0,k.style.position="absolute",k.style.width="100%",k.style.height="100%",k.style.zIndex="9999",k.style.top=0,k.style.left=0,k.setAttribute("multiple",""),k.addEventListener("change",f,!1);var%20l=document.createElement("div");l.style.position="fixed",l.style.top=0,l.style.left=0,l.style.width="100%",l.style.height="100%",l.style.background="black%20url('http://steamcommunity-a.akamaihd.net/public/images/login/throbber.gif')%20center%20no-repeat",l.style.zIndex=9999999;var%20m=document.createElement("style");m.innerHTML=".not-open:hover,.dragover{border-color:#FFFFFF%20!important}.not-open{border:2px%20dashed%20#5491CF;border-radius:5px;margin:-2px}.not-open.screenshot_showcase_smallscreenshot{margin-bottom:9px}",document.head.appendChild(m),[].forEach.call(document.querySelectorAll("#showcase_preview_13,%20#showcase_preview_7"),function(c){a(c);var%20d=new%20MutationObserver(b);d.observe(c,{childList:!0})})})();

steam_showcase_uploader.js

// add listeners to showcase items
function init(parentNode) {
    if(parentNode.firstElementChild.hasAttribute("data-initiated"))
        return;
    parentNode.firstElementChild.setAttribute("data-initiated", 1);
    var showCaseType = parentNode.getAttribute("data-eshowcasetype");
    [].forEach.call(parentNode.querySelectorAll(".screenshot_showcase_primary, .screenshot_showcase_smallscreenshot.showcase_slot"), function(el) {
        el.setAttribute("data-eshowcasetype", showCaseType);
        if(el.clientHeight == 0)
            el.style.minHeight = "300px";
        el.addEventListener("click", clickFileInput, true);
        el.addEventListener("dragover", dragover, true);
        el.addEventListener("dragleave", dragleave, false);
        el.addEventListener("drop", dragleave, true);
        if(!el.classList.contains("openslot"))
            el.classList.add("not-open");
    });
}

// after image is selected in showcase we must reinitiate script for this showcase
function observerFunc(mutations, observer) {
    var target = mutations[0].target;
    init(target);
}

// block default "click" action on showcase item and redirect click to file input
function clickFileInput(e) {
    e.preventDefault();
    e.stopPropagation();
    if(fileInput.parentNode)
        fileInput.parentNode.removeChild(fileInput);
    fileInput.target = this;
    fileInput.click();
}

// move file input under mouse and add border
function dragover(e) {
    if(fileInput.parentNode !== this) {
        fileInput.target = this;
        this.insertBefore(fileInput, this.firstChild);
    }
    this.classList.add("dragover");
}

// remove border
function dragleave(e) {
    this.classList.remove("dragover");
}

// fired on input file "change"; test file size and extension
function uploadFile() {
    if(this.parentNode)
        this.parentNode.removeChild(this);
    var clonedFileInput = this.cloneNode(true);
    clonedFileInput.files = this.files;
    var showCaseType = this.target.getAttribute("data-eshowcasetype");
    var jsonSlot = JSON.parse(this.target.getAttribute("data-slotjson"));
    var slot = jsonSlot["slot"];
    
    if(clonedFileInput.files && clonedFileInput.files[0]) {
        var file = clonedFileInput.files[0];
        var dot = file.name.lastIndexOf(".");
        var ext = file.name.substring(dot + 1).toLowerCase();
        if(["jpg", "png", "gif", "jpeg"].indexOf(ext) < 0) {
            alert("You can only upload JPG, PNG and GIF files.")
            return;
        }
        if(file.size > 10485760) {
            alert("You can only upload files less than 10 MB in file size.")
            return;
        }
        uploadFileStep1(slot, showCaseType, clonedFileInput, dot);
    } else
        alert("No file selected.");
}

// get width and height and open upload popup
function uploadFileStep1(slot, showCaseType, clonedFileInput, dot) {
    var file = clonedFileInput.files[0];
    var reader = new FileReader();
    reader.addEventListener("load", function() {
        var img = new Image();
        img.addEventListener("load", function() {
            window.clearTimeout(timeout);
            var width = img.width;
            var height = img.height;
            var title = window.prompt("Enter title", file.name.substring(0, dot));
            var upl = window.open("/sharedfiles/edititem/767/3/", "", "width=,height=,resizable=no");
            if(upl) {
                upl.resizeTo(0, 0);
                upl.onload = function() {
                    uploadFileStep2(upl, title, slot, showCaseType, clonedFileInput, width, height);
                }
            } else
                alert("Allow popups first!");
        });
        var timeout = window.setTimeout(function() {
            alert("That's not an image!");
        }, 500);
        img.src = reader.result;
    });
    reader.readAsDataURL(file);
}

// set proper values and start upload
function uploadFileStep2(upl, title, slot, showCaseType, clonedFileInput, width, height) {
    upl.document.body.appendChild(loading);
    var f = upl.document.getElementsByName("file")[0];
    f.parentNode.replaceChild(clonedFileInput, f);
    var fileType = {"13": 3, "7": 5}[showCaseType];
    upl.document.getElementsByName("title")[0].value = title;
    upl.document.getElementsByName("agree_terms")[0].checked = true;
    if((slot == 0 && width == 506 && height > 506) || (slot > 0 && slot < 4 && width == 100 && height > 80)) {
        upl.document.getElementsByName("image_width")[0].value = 1000;
        upl.document.getElementsByName("image_height")[0].value = 1;
    } else {
        upl.document.getElementsByName("image_width")[0].value = width;
        upl.document.getElementsByName("image_height")[0].value = height;
    }
    upl.document.getElementsByName("file_type")[0].value = fileType;
    upl.document.getElementsByName("cloudfilenameprefix")[0].value = Math.trunc(Date.now() / 1000) + "_";
    upl.document.getElementById("Visibility0").checked = true;
    upl.onunload = function() {
        function testUrl() {
            if(upl.location.search.indexOf("fileuploadsuccess") > -1) {
                window.clearInterval(interval);
                uploadFileStep3(upl, slot, showCaseType);
            }
        }
        var interval = window.setInterval(testUrl, 50);
    }
    upl.document.getElementById("SubmitItemForm").submit();
}

// wait for upload and choose uploaded image
function uploadFileStep3(upl, slot, showCaseType) {
    var urlSearch = upl.location.search;
    upl.close();
    if(urlSearch.indexOf("id=") == -1) {
        alert("Some error occured. Post your browser, file you wanted to upload and code below to author of this script.\n" + urlSearch)
        upl.close();
        return;
    }
    var publishedId = urlSearch.match(/id=(\d+)/)[1];
    queue.push({scType: showCaseType, slot: slot, id: publishedId, running: false});
}

// simple queue
window.setInterval(function() {
    if(queue.length) {
        var j = queue[0];
        if(j.running) {
            var selector = 'div[data-eshowcasetype="' + j.scType + '"] .screenshot_showcase_' +
                           (j.slot == 0 ? "primary" : "smallscreenshot:nth-child(" + j.slot + ")");
            var jsonData = JSON.parse(document.querySelector(selector).getAttribute("data-slotjson"));
            if(jsonData.publishedfileid == j.id) {
                queue.shift();
            }
        } else {
            j.running = true;
            PreviewShowcaseConfigWithSlotChange(j.scType, j.slot, { publishedfileid: j.id });
        }
    }
}, 200);
var queue = [];

// test for popups
// timeout because without it browsers opened and closed window even when blocking popups
window.setTimeout(function() {
    var t = window.open("/?CLOSE_ME", "", "width=300,height=");
    if(t)
        t.close()
    else
        alert("Allow popups!");
}, 1);

// file you choose/drop ends here, and then is cloned to upload window
var fileInput = document.createElement("input");
fileInput.type = "file";
fileInput.name = "file";
fileInput.style.opacity = 0;
fileInput.style.position = "absolute";
fileInput.style.width = "100%";
fileInput.style.height = "100%";
fileInput.style.zIndex = "9999";
fileInput.style.top = 0;
fileInput.style.left = 0;
fileInput.setAttribute("multiple", "");
fileInput.addEventListener("change", uploadFile, false);

// cosmetics, inserted in popup
var loading = document.createElement("div");
loading.style.position = "fixed";
loading.style.top = 0;
loading.style.left = 0;
loading.style.width = "100%";
loading.style.height = "100%";
loading.style.background = "black url('http://steamcommunity-a.akamaihd.net/public/images/login/throbber.gif') center no-repeat";
loading.style.zIndex = 9999999;

// cosmetics too
var style = document.createElement("style");
style.innerHTML = ".not-open:hover,.dragover{border-color:#FFFFFF !important}" +
                  ".not-open{border:2px dashed #5491CF;border-radius:5px;margin:-2px}" + 
                  ".not-open.screenshot_showcase_smallscreenshot{margin-bottom:9px}";
document.head.appendChild(style);

// initialization
[].forEach.call(document.querySelectorAll("#showcase_preview_13, #showcase_preview_7"), function(el) {
    init(el);
    var observer = new MutationObserver(observerFunc);
    observer.observe(el, { childList: true });
});

seems the long picture uploader has an error, same as another way of uploading the right side long picture.