The Wiert Corner – irregular stream of stuff

I like JSFiddle, but rather keep source code under my own version control.

I was curious, so queried [Wayback/Archive] gist as jssfiddle – Google Search and found [Wayback/Archive] Publishing a Github Gist to JSFiddle | Toolbox Tech

It has better steps than the official documentation at these links:

• [Wayback/Archive] Pass response directly from a Github repo – JSFiddle Docs
• [Wayback/Archive] Display fiddle from a Github repository – JSFiddle Docs
  

  Demo Directory/

  demo.js
  demo.html
  demo.css
  demo.details

  • demo.[ js | html | css ] contains fiddle code for the specific panel
  • demo.details is a description of the demo written in YAML

  ---
  name: Name of the Demo
  description: Some description, please keep it in one line
  authors:
  - John Doe
  - Jan Wisniewski
  resources:
  - http://some.url.com/some/file.js
  - http://other.url.com/other_filename.css
  normalize_css: no
  load_type: d
  ...

• [Wayback/Archive] Display fiddle from Gist – JSFiddle Docs
  

  Read a demo from Github Gist and present it as a fiddle.

  Gist files structure

  fiddle.js
  fiddle.html
  fiddle.css
  fiddle.manifest

  File name	Description
  fiddle.[js/html/css]	Contains fiddle code for the specific panel
  fiddle.manifest	YAML description of the Gist for JSFiddle to parse

  Manifest file example
  name: The Name of the Fiddle
  description: Some description, please keep it in one line
  authors:
    - John Doe
    - Jan Wisniewski
  resources:
    - http://some.url.com/some/file.js
    - http://other.url.com/other_filename.css
  normalize_css: no
  wrap: bpanel_js: 1
  panel_css: 1

  Manifest fields

  • panel_html – Language for HTML panel. Accepts:

    • 0 – HTML
  • panel_css – Language for CSS panel. Accepts:

    • 0 – CSS
    • 1 – SCSS
  • panel_js – Language for the JS panel. Accepts:

    • 0 – JavaScript
    • 1 – CoffeeScript
    • 2 – JavaScript 1.7
  • resources – List of external resources.
  • name – Fiddle title
  • description – Fiddle description
  • normalize_css – Normalize CSS by loading normalize.css before any CSS declarations.

    • yes – normalize
    • no – don’t normalize
  • wrap – Set the JS code wrap. Options:

    • l – On load
    • d – On DOM ready

–jeroen