Simple TamperMonkey script to place tags to the right side of images and to automatically open them to make editing tags on many posts easier.

TamperMonkey is a tool used to manipulate pages by injecting javscript into them when they load. Using this, I just moved the tags next to the image and emulate a mouse click on the button

This may not be useful to everyone, but I'm sure someone can find it speeds up their workflow

Example: https://gist.github.com/DontTalkToMeThx/5e8bc9f8e5ad84ca87f7db137c9e60dd#file-readme-md

You can download it directly if you have tampermonkey installed already by clicking here

hmmm, I already use another script for when the editing menu opens up for me
so idk how this would affect my workflow if I also used this...
but I tend to edit images whenever it really interests me
so I think I'll give it a test run and see how it goes

definitelynotafurry4 said:
Simple TamperMonkey script to place tags to the right side of images and to automatically open them to make editing tags on many posts easier.

TamperMonkey is a tool used to manipulate pages by injecting javscript into them when they load. Using this, I just moved the tags next to the image and emulate a mouse click on the button

This may not be useful to everyone, but I'm sure someone can find it speeds up their workflow

Example: https://cdn.discordapp.com/attachments/796558273012695041/1023753840241152020/jtz1rp_143321.png

// ==UserScript==
// @name         Tags Side By Side
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Places tags to the right of images
// @match        https://e621.net/posts/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=e621.net
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    let editButton = document.getElementById("post-edit-link")
    let edit = document.getElementById("edit")
    let grid = document.getElementById("image-and-nav")
    let image = document.getElementById("image")
    let imageContainer = document.getElementById("image-container")
    editButton.addEventListener("click", () => {
        edit.style.display = "block"
        imageContainer.after(edit)
        let resize = () => {
            let fraction = image.clientWidth/grid.clientWidth
            if (fraction <= 0.7){
                grid.style["grid-template-columns"] = `${image.clientWidth}px ${grid.clientWidth - image.clientWidth}px`
            } else {
                grid.style["grid-template-columns"] = `0.7fr 0.3fr`
            }
            edit.style.height = `${image.clientHeight}px`
            edit.style["overflow-y"] = "scroll"
        }
        new ResizeObserver(resize).observe(image)
        resize()
    })

    let commentButton = document.getElementById("post-sections").firstElementChild.firstElementChild

    commentButton.addEventListener("click", () => {
        grid.style["grid-template-columns"] = `1fr`
    })

    editButton.click()
})();

Thanks! Looks useful. Tempted to use a script like this for edits. It would be sweet to be able to just use a selection box and resized images in a grid, for specific tag. i.e. The disambiguation wars. Think of it like ReCraptcha but less awful! :P

definitelynotafurry4 said:
PROGRAMS

UPDATE: No, I can't use this to help me since it clashes with the one I use. It goes something like this:

// ==UserScript==
// @name e621 Rebalance Quick/Frequent Tags
// @namespace https://coderpatsy.bitbucket.io/
// @version 1
// @description Friggin quick tags not wrapping
// @author coderpatsy
// @include https://e621.net/posts/*
// @grant none
// ==/UserScript==

(function () {
"use strict";

$(document).one("danbooru:open-post-edit-tab", function () {
setTimeout(function () {

const numColumns = 5;
const $roots = $("#tags-container .related-tag-functions + div .related-tags > .related-section:first-child .related-items");
if ($roots.length <= numColumns) {
return;
}
const $eles = $roots.children();
const perColumn = Math.floor($eles.length / numColumns);
let extraItems = $eles.length % numColumns;
let index = 0;

// rebalance columns
$roots.each(function (i) {
const $ele = $(this);
if (i < numColumns) {
let extraIndex = 0;
if (extraItems > 0) {
extraIndex++;
extraItems--;
}
const end = index + perColumn + extraIndex;
$ele.empty().append($eles.slice(index, end));
index = end;

} else {
$ele.remove();
}
});

}, 1);
});

})();