Skip to content

Instantly share code, notes, and snippets.

@nemoinho
Last active February 6, 2021 23:57
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nemoinho/70a176e73e2cbf14315772cc4e618516 to your computer and use it in GitHub Desktop.
Save nemoinho/70a176e73e2cbf14315772cc4e618516 to your computer and use it in GitHub Desktop.
This script will enable resizing of the details on a board in jira.The script only runs in the latest versions of jira and only on domains which start with "jira." or on the atlassian-domain. -- Please click on "Raw" to install it via greasemonkey or tampermonkey
// ==UserScript==
// @name Jira Board Size
// @namespace info.nehrke.jira
// @author Felix Nehrke
// @description This script will enable resizing of the details on a board in jira. The script only runs in the latest versions of jira and only on domains which start with "jira." or on the atlassian-domain.
// @include /^https?:\/\/jira.[^\/]+\/secure\/RapidBoard.jspa.*/
// @include /^https?:\/\/[^\/]+?\.atlassian\.net\/secure\/RapidBoard.jspa.*/
// @downloadURL https://gist.github.com/nemoinho/70a176e73e2cbf14315772cc4e618516/raw/jira-board-size.user.js
// @updateURL https://gist.github.com/nemoinho/70a176e73e2cbf14315772cc4e618516/raw/jira-board-size.user.js
// @version 1.1.1
// @grant none
// ==/UserScript==
applyStyles(`
body .ghx-detail-view .ghx-sizer { display:inline }
`)
restartDragging();
function applyStyles(styles) {
const style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = styles;
document.head.appendChild(style);
}
function renderUntil(check) {
return new Promise(resolve => {
if (!check()) {
requestAnimationFrame(e => renderUntil(check).then(resolve));
} else {
resolve();
}
});
}
let sizer = null;
let detailsViewWidth = 0;
function restartDragging() {
let detailsView, currentSizer;
renderUntil(draggerIsReady)
.then(() => {
sizer = currentSizer;
applyDraggable(sizer, detailsView);
restartDragging();
});
function draggerIsReady() {
detailsView = document.querySelector('.ghx-detail-view');
currentSizer = document.querySelector('.ghx-detail-view .ghx-sizer');
return detailsView && currentSizer && currentSizer != sizer
}
}
function applyDraggable(node, view) {
let startPosition = 0;
let isMouseDown = false;
resetWidth();
node.addEventListener('mousedown', e => {
isMouseDown = true;
startPosition = e.clientX;
detailsViewWidth = view.offsetWidth;
e.preventDefault();
});
document.addEventListener('mouseup', e => {
isMouseDown = false;
detailsViewWidth = view.offsetWidth;
});
document.addEventListener('mousemove', e => {
if (isMouseDown) {
e.preventDefault();
const currentPosition = startPosition - e.clientX;
view.style.width = (detailsViewWidth + currentPosition) + 'px'
}
});
window.addEventListener('resize', e => renderUntil(viewHasOriginalWidth).then(resetWidth));
document.querySelector('#ghx-pool-column').addEventListener('click', e => renderUntil(viewHasOriginalWidth).then(resetWidth));
function viewHasOriginalWidth() {
return view.offsetWidth !== detailsViewWidth;
}
function resetWidth() {
if (view.offsetWidth !== 0 && detailsViewWidth !== 0) {
view.style.width = detailsViewWidth + 'px';
const headerStyle = document.getElementById('ghx-column-header-group').style;
headerStyle.width = 'auto';
headerStyle.position = 'absolute';
headerStyle.top = 0;
headerStyle.left = 0;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment