From 77e2bd5f7a59d395c4031d679e0d0d4d522d19f7 Mon Sep 17 00:00:00 2001 From: Matthew Kastor Date: Wed, 17 Oct 2012 03:21:10 -0400 Subject: [PATCH] Adds Pretty Printed Source Code To Docs Plugin generates pages using google prettify to highlight the source. The three css files are the defaults that come with google prettify. The plugin is set up to use the desert style as it's default stylesheet, with prettify, sunburst and prettify-jsdoc listed as alternative stylesheets. Currently this plugin is not tied in with any template. There won't be links in the documentation to bring you to the prettified source. --- plugins/prettyPrintSource.js | 110 +++++++++++++++++++ templates/default/static/styles/desert.css | 34 ++++++ templates/default/static/styles/prettify.css | 52 +++++++++ templates/default/static/styles/sunburst.css | 51 +++++++++ 4 files changed, 247 insertions(+) create mode 100644 plugins/prettyPrintSource.js create mode 100644 templates/default/static/styles/desert.css create mode 100644 templates/default/static/styles/prettify.css create mode 100644 templates/default/static/styles/sunburst.css diff --git a/plugins/prettyPrintSource.js b/plugins/prettyPrintSource.js new file mode 100644 index 00000000..a85d1853 --- /dev/null +++ b/plugins/prettyPrintSource.js @@ -0,0 +1,110 @@ +/** + * @file Adds pretty printed source code to + * the output files. + * @author Matthew Christopher Kastor-Inare III + * Hial Atropa!! + * @version 20121017 + */ + +exports.handlers = { + beforeParse: function(e) { + + function bs2fs(text) { + return text.replace(/\\/g, '/'); + } + + function toRelativePath(text) { + return text.replace(/^.*:/, ''); + } + + function slashesCollapseToDots(text) { + return text.replace(/[\/\\]+/g, '.'); + } + + function suffixFsCollapse(text) { + return text.replace(/\/+$/, '/'); + } + + function noDotPrefix(text) { + return text.replace(/^\./, ''); + } + + function makeOutputFileName(sourceFileName, extension) { + extension = extension || ''; + + var out; + + out = toRelativePath(sourceFileName); + out = slashesCollapseToDots(out); + out = noDotPrefix(out) + out += extension; + + return out; + } + + function getOutputDirectory() { + var path = require('path'); + var out; + + out = path.resolve(env.opts.destination); + out = bs2fs(out); + out = suffixFsCollapse(out + '/'); + + return out; + } + + function generateHighlightedSourceFile(outDir, outfile, sourceContent) { + var fs = require('fs'); + var outsource; + + outsource = '\n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' Source of : ' + outfile + '\n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += ' \n'; + outsource += '
\n';
+            outsource += sourceContent;
+            outsource += '      
\n'; + outsource += ' '; + outsource += ' ' + outsource += '\n'; + + fs.mkPath(outDir); + fs.writeFileSync(outfile, outsource); + } + + function main() { + + var sourceFileName= bs2fs(e.filename); + var sourceContent = e.source; + var outFileName = makeOutputFileName(sourceFileName, '.html'); + var outDir = getOutputDirectory(); + var outfile = outDir + outFileName; + + // Debug + /* + dump(fs); + print('source file name = ' + sourceFileName); + print('output file name = ' + outFileName); + print('output directory = ' + outDir); + print('output file = ' + outfile); + print('sourceContent = ' + sourceContent); + //*/ + + // write source to file with a unique name + generateHighlightedSourceFile(outDir, outfile, sourceContent); + // link to source in documentation somehow + } + + main(); + } +}; \ No newline at end of file diff --git a/templates/default/static/styles/desert.css b/templates/default/static/styles/desert.css new file mode 100644 index 00000000..f6ba40d7 --- /dev/null +++ b/templates/default/static/styles/desert.css @@ -0,0 +1,34 @@ +/* desert scheme ported from vim to google prettify */ +pre { display: block; background-color: #333 } +pre .nocode { background-color: none; color: #000 } +pre .str { color: #ffa0a0 } /* string - pink */ +pre .kwd { color: #f0e68c; font-weight: bold } +pre .com { color: #87ceeb } /* comment - skyblue */ +pre .typ { color: #98fb98 } /* type - lightgreen */ +pre .lit { color: #cd5c5c } /* literal - darkred */ +pre .pun { color: #fff } /* punctuation */ +pre .pln { color: #fff } /* plaintext */ +pre .tag { color: #f0e68c; font-weight: bold } /* html/xml tag - lightyellow */ +pre .atn { color: #bdb76b; font-weight: bold } /* attribute name - khaki */ +pre .atv { color: #ffa0a0 } /* attribute value - pink */ +pre .dec { color: #98fb98 } /* decimal - lightgreen */ + +/* Specify class=linenums on a pre to get line numbering */ +ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE } /* IE indents via margin-left */ +li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none } +/* Alternate shading for lines */ +li.L1,li.L3,li.L5,li.L7,li.L9 { } + +@media print { + pre { background-color: none } + pre .str, code .str { color: #060 } + pre .kwd, code .kwd { color: #006; font-weight: bold } + pre .com, code .com { color: #600; font-style: italic } + pre .typ, code .typ { color: #404; font-weight: bold } + pre .lit, code .lit { color: #044 } + pre .pun, code .pun { color: #440 } + pre .pln, code .pln { color: #000 } + pre .tag, code .tag { color: #006; font-weight: bold } + pre .atn, code .atn { color: #404 } + pre .atv, code .atv { color: #060 } +} diff --git a/templates/default/static/styles/prettify.css b/templates/default/static/styles/prettify.css new file mode 100644 index 00000000..400fd742 --- /dev/null +++ b/templates/default/static/styles/prettify.css @@ -0,0 +1,52 @@ +/* Pretty printing styles. Used with prettify.js. */ + +/* SPAN elements with the classes below are added by prettyprint. */ +.pln { color: #000 } /* plain text */ + +@media screen { + .str { color: #080 } /* string content */ + .kwd { color: #008 } /* a keyword */ + .com { color: #800 } /* a comment */ + .typ { color: #606 } /* a type name */ + .lit { color: #066 } /* a literal value */ + /* punctuation, lisp open bracket, lisp close bracket */ + .pun, .opn, .clo { color: #660 } + .tag { color: #008 } /* a markup tag name */ + .atn { color: #606 } /* a markup attribute name */ + .atv { color: #080 } /* a markup attribute value */ + .dec, .var { color: #606 } /* a declaration; a variable name */ + .fun { color: red } /* a function name */ +} + +/* Use higher contrast and text-weight for printable form. */ +@media print, projection { + .str { color: #060 } + .kwd { color: #006; font-weight: bold } + .com { color: #600; font-style: italic } + .typ { color: #404; font-weight: bold } + .lit { color: #044 } + .pun, .opn, .clo { color: #440 } + .tag { color: #006; font-weight: bold } + .atn { color: #404 } + .atv { color: #060 } +} + +/* Put a border around prettyprinted code snippets. */ +pre.prettyprint { padding: 2px; border: 1px solid #888 } + +/* Specify class=linenums on a pre to get line numbering */ +ol.linenums { margin-top: 0; margin-bottom: 0 } /* IE indents via margin-left */ +li.L0, +li.L1, +li.L2, +li.L3, +li.L5, +li.L6, +li.L7, +li.L8 { list-style-type: none } +/* Alternate shading for lines */ +li.L1, +li.L3, +li.L5, +li.L7, +li.L9 { background: #eee } diff --git a/templates/default/static/styles/sunburst.css b/templates/default/static/styles/sunburst.css new file mode 100644 index 00000000..011d33e2 --- /dev/null +++ b/templates/default/static/styles/sunburst.css @@ -0,0 +1,51 @@ +/* Pretty printing styles. Used with prettify.js. */ +/* Vim sunburst theme by David Leibovic */ + +pre .str, code .str { color: #65B042; } /* string - green */ +pre .kwd, code .kwd { color: #E28964; } /* keyword - dark pink */ +pre .com, code .com { color: #AEAEAE; font-style: italic; } /* comment - gray */ +pre .typ, code .typ { color: #89bdff; } /* type - light blue */ +pre .lit, code .lit { color: #3387CC; } /* literal - blue */ +pre .pun, code .pun { color: #fff; } /* punctuation - white */ +pre .pln, code .pln { color: #fff; } /* plaintext - white */ +pre .tag, code .tag { color: #89bdff; } /* html/xml tag - light blue */ +pre .atn, code .atn { color: #bdb76b; } /* html/xml attribute name - khaki */ +pre .atv, code .atv { color: #65B042; } /* html/xml attribute value - green */ +pre .dec, code .dec { color: #3387CC; } /* decimal - blue */ + +pre.prettyprint, code.prettyprint { + background-color: #000; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + -o-border-radius: 8px; + -ms-border-radius: 8px; + -khtml-border-radius: 8px; + border-radius: 8px; +} + +pre.prettyprint { + width: 95%; + margin: 1em auto; + padding: 1em; + white-space: pre-wrap; +} + + +/* Specify class=linenums on a pre to get line numbering */ +ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE; } /* IE indents via margin-left */ +li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none } +/* Alternate shading for lines */ +li.L1,li.L3,li.L5,li.L7,li.L9 { } + +@media print { + pre .str, code .str { color: #060; } + pre .kwd, code .kwd { color: #006; font-weight: bold; } + pre .com, code .com { color: #600; font-style: italic; } + pre .typ, code .typ { color: #404; font-weight: bold; } + pre .lit, code .lit { color: #044; } + pre .pun, code .pun { color: #440; } + pre .pln, code .pln { color: #000; } + pre .tag, code .tag { color: #006; font-weight: bold; } + pre .atn, code .atn { color: #404; } + pre .atv, code .atv { color: #060; } +}