Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Add foler browser and render on github server if possible

  • Loading branch information...
commit 3fdb17fe7cb63fc4d5b5afe712c7ff877132352f 1 parent 0282575
@ForbesLindesay ForbesLindesay authored committed
View
6 README.md
@@ -11,16 +11,16 @@ via npm:
## Usage
- $ greadme [path/to/some.markdown]
+ $ greadme [port-number]
view your markdown at http://localhost:8124/
press CTRL+C to quit
-Execute `greadme` passing an optional path to a markdown file and it will be parsed and served from a locally running http server with Github styling applied.
+Execute `greadme` passing an optional port number and markdown in the current directory will be parsed and served from a locally running http server with Github styling applied.
If you are running on a mac, a browser will automatically be opened to preview the markdown.
-When no file path is specified, `greadme` attempts to locate a Readme file in the current directory and renders it instead. The following filenames and extensions are tried, if none are found, an error is printed and the program exits.
+When no file path is specified, `greadme` attempts to locate a Readme file in the current directory and renders it instead. The following filenames and extensions are tried.
- README.md
- README.markdown
View
149 bin/greadme
@@ -1,22 +1,23 @@
#!/usr/bin/env node
+var express = require('express');
+var app = express();
+var path = require('path');
var fs = require('fs')
var md = require('marked')
var http = require('http')
var request = require('request')
// TODO configurable
+var arg = process.argv[2];
var host = 'localhost'
-var port = 8124
+var port = +(arg||8124)
-var dir = process.cwd()
-var exts = 'markdown md'.split(' ')
-
-var file = process.argv[2] || ''
-
-if (!file) {
+function readme(dir) {
+ var exts = 'markdown md'.split(' ')
+ var file;
var names = 'README Readme readme'.split(' ')
- names.some(function (name) {
+ if (names.some(function (name) {
return exts.some(function (ext) {
try {
var filename = dir + '/' + name + '.' + ext
@@ -27,66 +28,96 @@ if (!file) {
return false
}
})
- })
+ })) {
+ return file;
+ }
}
-if (!file) {
- console.error('no readme.md found')
- return process.exit(1)
+function getStyle(cb) {
+ request({ uri: "https://github.com/aheckmann/greadme", timeout: 4000 }, function (err, res, body) {
+ try {
+ var css = []
+ if (err) {
+ // ignore error, use old css instead
+ console.log('\u001B[35m %s\u001B[0m', 'could not retreive latest github css. using old version');
+ css.unshift('/css/style.css')
+ } else {
+ var rgx = /href=["']([^"']+\.css)/g
+ ;(body || '').replace(rgx, function (_, href) {
+ css.unshift(href);
+ })
+ }
+ } catch (ex) {
+ return cb(ex);
+ }
+ cb(null, css);
+ });
}
-function getHTML(file, css) {
- var contents = fs.readFileSync(file, 'utf8')
- var html = md(contents)
-
-
- html = '<div id="readme"><article class="markdown-body entry-content">'
- + html
- + '</article></div>'
-
- html = '<style type="text/css">'
- + '#readme { width: 920px;margin: 0 auto; }'
- + '</style>'
- + html;
+function listDir(dir) {
+ var all = fs.readdirSync(dir);
+ var md = [];
+ var dirs = dir == process.cwd() ? [] : ['..'];
+ all.forEach(function (item) {
+ var stat = fs.statSync(path.join(dir, item));
+ if (stat.isDirectory()) {
+ dirs.push(item);
+ } else if (stat.isFile() && (/\.md$/.test(item) || /\.markdown$/.test(item))) {
+ md.push(item);
+ }
+ });
+ function canonical(item) {
+ return {
+ href: path.join(dir, item).replace(process.cwd(), '').replace(/\\/g, '/') || '/',
+ name: item
+ };
+ }
+ return {
+ md: md.map(canonical),
+ dirs: dirs.map(canonical)
+ }
+}
- css.forEach(function (href) {
- html = '<link href="' + href + '" rel="stylesheet">' + html;
+function render(fileContent, cb) {
+ request({
+ url: 'https://api.github.com/markdown/raw',
+ body: fileContent,
+ method: 'POST',
+ headers: {
+ 'content-type': 'text/plain'
+ },
+ timeout: 2000
+ }, function (err, res, body) {
+ if (err) console.log(err);
+ if (err || res.statusCode != 200) {
+ return cb(null, md(fileContent));
+ } else {
+ return cb(null, body);
+ }
})
-
- html = '<html><body>' + html + '</body></html>'
-
- return html;
}
-var stylesheet = ''
-
// get github css
-request({ uri: "https://github.com/aheckmann/greadme", timeout: 4000 }, function (err, res, body) {
- var css = []
-
- if (err) {
- // ignore error, use old css instead
- console.log('\u001B[35m %s\u001B[0m', 'could not retreive latest github css. using old version');
- css.unshift('/css/style.css')
- stylesheet = fs.readFileSync(__dirname + '/../css/style.css', 'utf8');
-
- } else {
- var rgx = /href=["']([^"']+\.css)/g
- ;(body || '').replace(rgx, function (_, href) {
- css.unshift(href);
- })
- }
-
- var server = http.createServer(function (req, res) {
- if (/css$/.test(req.url)) {
- res.writeHead(200, { 'Content-Type': 'text/css' })
- res.end(stylesheet)
- return;
- }
-
- res.writeHead(200, { 'Content-Type': 'text/html' })
- res.end(getHTML(file, css))
- }).listen(port, host)
+getStyle(function (err, css) {
+ if (err) throw err;
+
+ app.use(express.favicon());
+ app.use('/css', express.static(path.join(__dirname, '..', 'css')))
+ app.use(function (req, res, next) {
+ var p = path.join(process.cwd(), req.url.substring(1));
+ var stat = fs.statSync(p);
+ var dir = stat.isDirectory();
+ var file = dir ? readme(p) : p;
+ var contents = file ? fs.readFileSync(file, 'utf8') : 'No readme found';
+ render(contents, function (err, markdown) {
+ res.render(path.join(__dirname, '..', 'view.ejs'), {
+ css: css,
+ markdown: markdown,
+ dir: dir && listDir(p)
+ });
+ });
+ });
+ var server = http.createServer(app).listen(port, host)
server.on('listening', function () {
var url = 'http://' + host + ':' + port
View
BIN  css/directory.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  css/file.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
13 package.json
@@ -2,7 +2,9 @@
"name": "greadme",
"version": "0.0.5",
"description": "Locally preview your markdown, Github style",
- "bin": { "greadme": "./bin/greadme" },
+ "bin": {
+ "greadme": "./bin/greadme"
+ },
"scripts": {
"test": "make test"
},
@@ -17,12 +19,17 @@
],
"dependencies": {
"marked": "0.2.5",
- "request": "2.11.1"
+ "request": "2.11.1",
+ "express": "3.0.3",
+ "ejs": "~0.8.3"
},
"devDependencies": {
"mocha": "1.4.1"
},
"author": "Aaron Heckmann <aaron.heckmann+github@gmail.com>",
"license": "MIT",
- "repository": { "type": "git", "url": "git://github.com/aheckmann/greadme.git" }
+ "repository": {
+ "type": "git",
+ "url": "git://github.com/aheckmann/greadme.git"
+ }
}
View
37 view.ejs
@@ -0,0 +1,37 @@
+<html>
+ <head>
+ <% css.forEach(function (href) { %>
+ <link href="<%= href %>" rel="stylesheet">
+ <% }) %>
+ <style type="text/css">
+ #readme, #file-explorer { width: 920px;margin: 0 auto; }
+ </style>
+ </head>
+ <body>
+ <% if (dir) { %>
+ <div id="file-explorer" class="bubble tree-browser-wrapper">
+ <table class="tree-browser css-truncate" cellpadding="0" cellspacing="0">
+ <tbody class="tree-entries">
+ <% dir.dirs.forEach(function (dir) { %>
+ <tr>
+ <td class="icon"><img width="20" src="/css/directory.png"/></td>
+ <td class="content"><a href="<%= dir.href %>"><%= dir.name %></a></td>
+ </tr>
+ <% }) %>
+ <% dir.md.forEach(function (file) { %>
+ <tr>
+ <td class="icon"><img width="20" src="/css/file.png"/></td>
+ <td class="content"><a href="<%= file.href %>"><%= file.name %></a></td>
+ </tr>
+ <% }) %>
+ </tbody>
+ </table>
+ </div>
+ <% } %>
+ <div id="readme">
+ <article class="markdown-body entry-content">
+ <%- markdown %>
+ </article>
+ </div>
+ </body>
+</html>
Please sign in to comment.
Something went wrong with that request. Please try again.