.gitignore

node_modules

README.md

fiddie

Start-to-end local-gist-jsfiddle workflow script.

Original idea by @nimbupani, here is a lazy-web-response.. :)

So, yout want to prototype stuff ? and you prefer doing it locally ? This script would let you:

• Create fiddle-ready files: fiddle.manifest / fiddle.js / fiddle.html / fiddle.js / fiddle.css (todo: maybe take existing index.html and convert them into these?)
• Then I mess with them.
• Convert them into a single public gist (change private gists options to false, default to private)
• Return me a link to the jsfiddle with a url. e.g. this is the final url http://jsfiddle.net/gh/gist/mootools/1.2/86dc0f0d363446b0869c/ for this gist https://gist.github.com/86dc0f0d363446b0869c

quick docs

This script a very first try, dont expect much. It would allow you to:

• Create a new fiddle directory, with the fiddle.* files in this current repository.
• Edit them (actually, you'll have to do this. The script wont help you much on your fiddlestication).
• run the script, within the gist you'd like to create. You'll have to provide the gist argument. eg. ./fiddie gist (insted of just fiddie)

synopsis

npm install git+ssh://git@gist.github.com:bca5bd4747a727c3d4e2.git

# generate fiddle folder, relative to the current directory.
fiddie

# create a private gists from the fiddle files in the current directory
# and put the gist url in your clipboard (fiddle equivalent? would need a little
# configuration on fwk/version)
fiddie gists

To be able to create new gists, ngist expects both github.user and github.token to be set. The script uses the global git config before posting gists.

git config --global github.user "your-github-username"
git config --global github.token "your-github-token"

To check if it's ok, run

git config --get github.user
git config --get github.token

You can find your token under your account.

fiddie

#!/usr/bin/env node

var colors = require('colors'),
  prompt = require('prompt'),
  ngist = require('ngist'),
  child = require('child_process'),
  path = require('path'),
  eyes = require('eyes'),
  fs = require('fs');

var base = process.cwd(),
  config = ['user', 'token'],
  step = config.length,
  error = function(err) {
    console.log(err.stack.red);
    process.exit(1);
  };

console.log('Start..'.cyan);
console.log('Things'.grey);
console.log('Current directory: ', base);

// holder for git config stuff
var gh = {};

// get github info, for posting gists, from the git global config
child.exec('git config --get github.user', function(err, stdout, stderr) {
  if(err) return error(new Error(ghHint('user')));
  gh.user = stdout.trim();
  next();
});

child.exec('git config --get github.token', function(err, stdout, stderr) {
  if(err) return error(new Error(ghHint('token')));
  gh.token = stdout.trim();
  next();
});



// ## runnnn
// done after the github.user, github.token are ok to be used
function runnnnnn() {
  if(process.argv.slice(2)[0] === 'gist') {
    return pushGist();
  }

  generateFiddle();
}



// ## main tasks, creating folder structure, creating gist
function pushGist() {
  console.log('Okay, going to publish gists...'.yellow);

  var files = gimmeFiddles(base);

  if(!Object.keys(files).length) return error(new Error('No fiddles to gist!'));

  // must have a fiddle.manifest, also used to setup basic
  // gist info, namely description
  if(!files['fiddle.manifest']) return error(new Error('No manifest'));

  var desc = files['fiddle.manifest'].match(/description:\s?(.+)/);

  var gists = Object.keys(files).map(function(file) {
    return {
      name: file,
      contents: files[file]
    };
  });

  var options = {
    user: gh.user,
    token: gh.token,
    description: desc ? desc[1] : 'jsfiddle gist',
    private: true
  };

  console.log(' Posting gists... '.yellow);

  eyes.inspect(gists);

  console.log('\n With options...'.yellow);
  eyes.inspect(options);

  return ngist.send(gists, options, function(err, url) {
    if(err) return error(err);
    console.log((' ✔ '  + url + ' created...').green);

    var sha = url.split('/').slice(-1);

    var fwkPrompts = [{
      message: 'choose framework',
      name: 'framework',
      default: 'jquery'
    }, {
      message: 'version',
      name: 'version',
      default: '1.6.3'
    }];

    prompt.start();

    console.log((' Creating fiddle url from ' + sha).grey);

    console.log(' Available options: '.grey);

    fiddleFwks();

    prompt.get(fwkPrompts, function(err, result) {
      if(err) return error(err);
      var fiddleurl = ["http://jsfiddle.net/gh/gist", result.framework, result.version, sha].join('/');

      // may change pbcopy here by open, to automatically open the fiddle url
      // in the default browser (both maconly). May allow to configure this with
      // environment variables.
      child.exec('echo ' + fiddleurl + ' | pbcopy ', function(err) {
        if(err) return error(err);
        console.log(('  » ' +fiddleurl + 'and pasted to your clipboard').grey);
      });
    });

  });
}

function generateFiddle() {
  // where youd like to put stuff, relative to the current directory
  var prompts = {
    message: 'Enter the relative path to the output directory',
    name: 'directory',
    validator: /^[\w-]+$/,
    warning: 'Wrong pattern, should comply with /[\w-]/',
    empty: false
  };

  // get jsfiddle files in the current repository
  var fiddles = gimmeFiddles(__dirname);

  prompt.start();
  prompt.get(prompts, function(err, result) {
    if(err) return error(err);

    var output = path.join(base, result.directory);

    child.exec('mkdir -p ' + output, function(code, stdout, stderr) {
      if(code > 0) return error(stdout || stderr);
      console.log((' ✓ Created dir ' + output).green);

      console.log(('Writing ' + Object.keys(fiddles).length + ' files...').yellow);
      Object.keys(fiddles).forEach(function(fiddle) {
        fs.writeFileSync(path.join(output, fiddle), fiddles[fiddle]);
        console.log((' ✓ Created ' + fiddle).green);
      });

      console.log(('\n\n » Fiddles generated, cd to ' + output + ' and mess with them').green);
    });
  });
}


// ## function helpers
function gimmeFiddles(dir) {
  var fiddles = {};
  // read this gist content, searching for fiddle files: `fiddle.*`
  fs.readdirSync(dir).forEach(function(file) {
    var src = path.join(dir, file);
    if(!fs.statSync(src).isFile()) return;
    if(!/^fiddle\./.test(file)) return;
    fiddles[file] = fs.readFileSync(src, 'utf8');
  });
  return fiddles;
}

function ghHint(config) {
  return [
    'Failed to load github ' + config + ' from git config.',
    '',
    'Run these two commands:',
    '',
    'git config --global github.user "your-github-username"',
    'git config --global github.token "your-github-token"',
    '',
    '',
    'To verify that they have been set, use:',
    '',
    'git config --get github.user',
    'git config --get github.token',
    ''
  ].join('\n');
}

function next() {
  if(--step === 0) runnnnnn();
}

function fiddleFwks() {
  // the list of jsfiddle fwks
  var fwks = fs.readFileSync(path.join(__dirname, 'jsfiddle.fwk'), 'utf8').split('\n')
    // filter empty lines
    .filter(function(item) { return item.trim(); })
    .map(function(item) {
      var m = item.match(/(\w+)\s([\d\.]+)/);
      return !m ? item : {
        name: m[1],
        version: m[2]
      };
    });

  eyes.inspect(fwks);
  return fwks;
}

fiddle.html

<h1>hi from a gist</h1>

fiddle.manifest

author: Divya Manian

jsfiddle.fwk

Mootools 1.4.0 (compat)
Mootools 1.4.0
Mootools 1.3.2 (compat)
Mootools 1.3.2
Mootools 1.2.5
Mootools 1.1.2
Mootools (edge)
jQuery 1.6.3
jQuery 1.6.2
jQuery 1.5.2
jQuery 1.4.4
jQuery 1.3.2
jQuery 1.2.6
jQuery (edge)
Prototype 1.7
Prototype 1.6.1.0
YUI 3.4.1 simple
YUI 3.4.1
YUI 3.4.0 Simple
YUI 3.4.0
YUI 3.3.0 Simple
YUI 3.3.0
YUI 2.8.0r4
Glow Core 1.7.0
No-Library (pure JS)
Dojo 1.6
Dojo 1.5
Dojo 1.4
Dojo 1.3
Processing.js 1.2.3
Processing.js 1.0.0
ExtJS 4.0.2a
ExtJS 3.1.0
ExtJS 3.0.0
Raphael 1.5.2 (min)
Raphael 1.4
RightJS 2.1.1

package.json

{
  "author": "Your name",
  "name": "fiddie",
  "description": "Start-to-end local-gist-jsfiddle workflow script",
  "version": "0.0.0",
  "repository": {
    "type": "git",
    "url": "git@gist.github.com:86dc0f0d363446b0869c.git"
  },
  "bin": "./fiddie",
  "engines": {
    "node": "> v0.4.0"
  },
  "dependencies": {
    "colors": "~0.5.1",
    "prompt": "~0.1.9",
    "ngist": "~0.2.0",
    "eyes": "~0.1.6"
  }
}