diff --git a/readme.md b/readme.md index 528820cdc9ee..659517def52c 100644 --- a/readme.md +++ b/readme.md @@ -108,6 +108,7 @@ GitHub Enterprise is also supported by [authorizing your own domain in the optio - Copy canonical link to file when [the y hotkey](https://help.github.com/articles/getting-permanent-links-to-files/) is used - Supports indenting with the tab key in textareas like the comment box (ShiftTab for original behavior) - [Uses the pull request title as commit title when merging with 'Squash and merge'](https://github.com/sindresorhus/refined-github/issues/276) +- [Replaces linked gists in issue and pull request comments with an embedded version of the gist file](https://user-images.githubusercontent.com/6978877/33911900-c62ee968-df8b-11e7-8685-506ffafc60b4.PNG) ### More actions diff --git a/source/content.js b/source/content.js index 893ba4239da1..7737f5321b03 100644 --- a/source/content.js +++ b/source/content.js @@ -50,6 +50,7 @@ import focusConfirmationButtons from './features/focus-confirmation-buttons'; import addKeyboardShortcutsToCommentFields from './features/add-keyboard-shortcuts-to-comment-fields'; import addConfirmationToCommentCancellation from './features/add-confirmation-to-comment-cancellation'; import addCILink from './features/add-ci-link'; +import embedGistInline from './features/embed-gist-inline'; import expandCollapseOutdatedComments from './features/expand-collapse-outdated-comments'; import * as pageDetect from './libs/page-detect'; @@ -161,6 +162,7 @@ function ajaxedPagesHandler() { if (pageDetect.isPR() || pageDetect.isIssue()) { safely(linkifyIssuesInTitles); safely(addUploadBtn); + safely(embedGistInline); observeEl('.new-discussion-timeline', () => { safely(addOPLabels); diff --git a/source/features/embed-gist-inline.js b/source/features/embed-gist-inline.js new file mode 100644 index 000000000000..3c0cf654b0a2 --- /dev/null +++ b/source/features/embed-gist-inline.js @@ -0,0 +1,28 @@ +import {h} from 'dom-chef'; +import select from 'select-dom'; + +const isGist = link => + !link.pathname.includes('.') && // Exclude links to embed files + ( + link.hostname.startsWith('gist.') || + link.pathname.startsWith('gist/') + ); + +const createGistElement = gistData => ( +
+ +
+
+); + +async function embedGist(link) { + const response = await fetch(`${link.href}.json`); + const gistData = await response.json(); + const gistEl = createGistElement(gistData); + link.parentNode.attachShadow({mode: 'open'}).append(gistEl); +} +export default () => { + select.all('.js-comment-body p a:only-child') + .filter(isGist) + .forEach(embedGist); +};