Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
TamperMonkey Script: Gist expand / collapse files.
// Add a button to Collapse or Expand files in a Github Gist
//
// Install Tampermonkey and add this as a script
// ==UserScript==
// @name Github Gists: Expand / Collapse Files
// @namespace https://gist.github.com/Jaace/7b70d2bb19af63e10b144ed7d867eae0
// @version 0.1
// @description Add a button to expand or collapse files in github gists
// @author Jason Boyle
// @match https://gist.github.com/*
// @grant GM_addStyle
// ==/UserScript==
GM_addStyle(
'.gist-expand-collapse-btn { margin: 0 0 0 6px; } ' +
'.collapsed { display: none; }'
);
window.addEventListener('load', () => {
if (document.body.classList.contains('page-gist-edit')) {
return;
}
initializeButtons();
initializeExpandCollapseAll();
});
function initializeExpandCollapseAll() {
const pageHeadActions = document.querySelector('.pagehead-actions');
const listItem = document.createElement('li');
const expandCollapseAllBtn = document.createElement('a');
const files = document.querySelectorAll('.file');
const buttons = document.querySelectorAll('.gist-expand-collapse-btn');
listItem.appendChild(expandCollapseAllBtn);
pageHeadActions.appendChild(listItem);
expandCollapseAllBtn.classList.add('gist-expand-collapse-all-btn', 'btn', 'btn-sm');
expandCollapseAllBtn.innerHTML = 'Collapse All';
expandCollapseAllBtn.onclick = () => {
if ('Collapse All' === expandCollapseAllBtn.innerHTML) {
expandCollapseAllBtn.innerHTML = 'Expand All';
for (let btn of buttons) {
btn.innerHTML = 'Expand';
}
for (let file of files) {
const fileContainer = file.querySelector('.file-header').nextSibling.nextSibling;
fileContainer.classList.add('collapsed');
}
} else {
expandCollapseAllBtn.innerHTML = 'Collapse All';
for (let btn of buttons) {
btn.innerHTML = 'Collapse';
}
for (let file of files) {
const fileContainer = file.querySelector('.file-header').nextSibling.nextSibling;
fileContainer.classList.remove('collapsed');
}
}
};
}
function initializeButtons() {
const files = document.querySelectorAll('.file');
for (let file of files) {
const actions = file.querySelector('.file-actions');
const fileContainer = file.querySelector('.file-header').nextSibling.nextSibling;
const expandCollapseBtn = document.createElement('a');
expandCollapseBtn.classList.add('gist-expand-collapse-btn', 'btn', 'btn-sm');
expandCollapseBtn.innerHTML = 'Collapse';
actions.appendChild(expandCollapseBtn);
expandCollapseBtn.onclick = function() {
if ('Collapse' === expandCollapseBtn.innerHTML) {
expandCollapseBtn.innerHTML = 'Expand';
} else {
expandCollapseBtn.innerHTML = 'Collapse';
}
fileContainer.classList.toggle('collapsed');
};
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment