A Markdown Monster addin that integrates with a few Gist features:
Important: Script Rendering has to be enabled for Preview
In order for Markdown Monster to render embedded Gists in the Previewer, it's necessary to enable the Allow Script Tags in Markdown Monster option (
AllowRenderScriptTags
in config file) to allow<script>
tags to execute. Without this setting enabled Gists will not render - the setting is disabled by default.
Here's what a few of the Addin features look like in action:
Get a GitHub Personal Access Token
For authentication purposes you need a Github Personal Access Token. To create one, go to GitHub, click on your Profile and select Settings. Scroll down to the Developer Settings box and select Personal Access Tokens.
Save the retrieved value in the Gist Integration Addin configuration - click the downarrow next to the addin-icon and select Configuration.
{ "GithubUserToken": "12345e0deb0c66041719d4cc7dec6cd45e", "GithubUsername": "JamesUser" }
The user interface for this addin is made up of two separate Windows:
The 'Create Gist Code Window' This window is used to create a new Gist and publish and embed it in a single step.
The Gist Manager Displays existing Gists in a list along with operations on it: Embedding a Gist in the document, editing in a new editor tab, deleting a Gist and opening a new Gist to create.
The two options are available from the Toolbar Button drop down:
As well as additional menu options for loading and saving Gists:
This window's purpose is to create new Gists and publish it as a Gist.
This feature:
<script>
link to Gist into Markdown documentThis features takes the current Clipboard or Editor text selection and publishes it as a Gist on Github, then emebds a link to the Gist in the editor.
The addin uses the Gist REST API to post the code to Github. The Gist API creates the Gist and returns a URL to the Gist so you can embed it into the page as an embedded Gist code block.
The embedded code in the markdown creates a <script>
tag like this:
<script src="https://gist.github.com/35c288114e2cd98e1ca4fd875e7749fe.js"></script>
Here's what the rendered result looks like in the editor:
Set AllowRenderScriptTags: true
Markdown Monster by default doesn't allow
<script>
tags to be rendered. Embedded Gists use<script>
tags and so you have to enable script embedding by setting theAllowRenderScriptTags: true
in the Markdown Monster settings. Goto Tools -> Settings and find the AllowRenderScriptTags key to set.
The Open From Gist dialog allows you to view online Gists and perform a number of tasks on them.
To use this dialog you can use one of these two options:
The dialog shows a list of existing Gists, which you can filter by Github user account and an optional keyword search:
Once the list is up, you can use the Toolbar buttons or the Context menu to perform the various operations. Double clicking the selection embeds the script tag into the currently active document.
You can use Markdown Monster to edit and update existing Gists:
The primary file of the Gist is now opened in a MM editor tab.
Here's what the dialog looks like for saving where you select a Gist to save to:
Alternately you can create a new Gist from here by checking the Save as new Gist checkbox:
The Gist features in this addin are not just useful for Markdown embedding, but can be useful for managing and updating Gists quickly and easily directly from your application folders.
Essentially you can push any document to a Gist, and edit and update any Gist regardless of the type of file and regardless of whether you end up embedding it into your Markdown document.
Major UI Updates The Gist Listing window now has easier navigation via a toolbar and a context menu with all options. The list windows now show the file type with a syntax icon for easier navigation. The two windows now backlink to each other so all functionality is accessible via either of these top level operation windows.
Access to Embed or Open Dialog from Toolbar Dropdown The toolbar dropdown now has both the new Gist option (primary as before) as well as the Embed or Open existing Gist option to directly go to the Gist Listing Window. This is in addition to the File->Open From->Open or Embed from Gist menu option.
Pick up Code Snippets and Syntax better for new Gists Added logic to allow capturing code snippet syntax, or trying to detect syntax from any code provided as input. Code is picked first from an editor selection and second from the Clipboard (if it matches a code detection).
Copy Gist Id or Gist Script Tag to Clipboard You can now copy the Gist Id or the embeddable Gist script tag to the clipboard for pasting into other applications.
Add Search Filter to Gist Selection Form Once Gists have loaded you can now filter the list with a search string to find all matching Gists.
Retrieve up to the 100 Last Gists Changed the defaults to retrieve up to 100 of the last Gists from Github. 100 is the max for a single list grab and in order to keep the time to load reasonable this is - for now - the max list of Gists that can be loaded. (open to change in the future - it's possible to load up 3000 via paging).
Show Gist Count on the Status Bar The number of Gists loaded now show on the status bar.
Add Navigation Link to the HTML Gist You can now click on the URL icon in the list to navigate to the HTML Gist Page in your browser to check out the Gist before opening it.