public
Last active — forked from johan/autofork.js

(Re)fork any gist, including your own

  • Download Gist
readme.md
Markdown

Want to fork your own gists? No fork button? No problem! Install this user script by clicking refork.user.js' "raw" link down below: ⇓

refork.user.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35
// ==UserScript==
// @name (Re)fork any gist, including your own
// @namespace https://github.com/johan
// @description Adds a "fork" button to gists missing one at gist.github.com, so you can create multiple forks
// @match https://gist.github.com/*
// @include https://gist.github.com/*
// ==/UserScript==
 
if (/^\/\d+/.test(location.pathname) &&
!document.querySelector('a img[alt="fork"]')) {
var i = document.createElement('img')
, a = document.createElement('a')
, u = document.querySelector('img.button').src
, p = document.querySelector('.title');
 
a.title = 'Create another fork of this gist';
a.style.cssText = 'float: right; margin: 4px 7px 0';
a.addEventListener('click', fork);
a.appendChild(i);
 
i.alt = 'fork';
i.src = u.replace(/[^\/]*$/, 'fork_button.png');
i.className = 'button';
 
p.appendChild(a);
}
 
function fork(e) {
var f = document.body.appendChild(document.createElement('form'));
f.method = 'POST';
f.action = '/fork' + location.pathname;
f.appendChild(document.querySelector('input[name=authenticity_token]'));
f.submit();
return false;
}

Awesome user script. Works like a charm. :)

Does this still work for anyone? I haven't been on the site in a while and I don't recall what it used to look like but it appears the content on the site changed and broke the script logic.

Never mind, found the announcement: https://github.com/blog/1276-welcome-to-a-new-gist

Interesting. I forked the script and updated it to account for the site changes but the userscript only runs when a full page refresh is invoked (confirmed with a quick console.log statement before any conditional logic). Some research into the problem reveals they are using pjax https://github.com/defunkt/jquery-pjax/ to improve perceived page load times and the ajax style page refreshes bypass the page load mechanism that normally would cause the userscript to be invoked.

Theoretically you could catch the pjax load/completed events and run the script logic but hooking the custom events without jQuery is too big a challenge to tackle tonight.

$(document).on('pjax:complete', function() {
// Call button inject logic here
})

It seems jQuery doesn't use dom events (except in some fallback scenarios) and thus I was unable to hook 'pjax:complete' or any other jQuery event for that matter. As a workaround, a MutationObserver was registered to monitor changes to the '#js-pjax-container' element and button injection is now rerun after dom modifications are detected. Probably not the cleanest or most elegant solution but given the constraints of the extension sandbox, it seemed reasonable. I'd love to see other takes on the problem but for now this approach seems to work.

Btw, very creative solution Johan... thanks!

URL has changed to location.pathname + '/fork'

i came across this from stack over flow when i searched on bing "github how to fork gist"

this is exactly what i needed. however has this been updated to included the location.pathname + '/fork' like eric-wieser says?

also what do you mean user script? i dont get how to use this. im having to convert it to a bookmarklet.

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.