diff options
Diffstat (limited to 'packages/gitbook-plugin-highlight')
-rw-r--r-- | packages/gitbook-plugin-highlight/.gitignore | 31 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/.npmignore | 2 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/_assets/website/white.css | 92 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/index.js | 10 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/package.json | 29 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/src/ALIASES.js | 10 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/src/CodeBlock.js | 55 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/src/getLanguage.js | 34 | ||||
-rw-r--r-- | packages/gitbook-plugin-highlight/src/index.js | 9 |
9 files changed, 272 insertions, 0 deletions
diff --git a/packages/gitbook-plugin-highlight/.gitignore b/packages/gitbook-plugin-highlight/.gitignore new file mode 100644 index 0000000..ef47881 --- /dev/null +++ b/packages/gitbook-plugin-highlight/.gitignore @@ -0,0 +1,31 @@ +# Logs +logs +*.log + +# Runtime data +pids +*.pid +*.seed + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage + +# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Compiled binary addons (http://nodejs.org/api/addons.html) +build/Release + +# Dependency directory +# Deployed apps should consider commenting this line out: +# see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git +node_modules + +# vim swapfile +*.swp + +# Plugin assets +_assets/plugin.js diff --git a/packages/gitbook-plugin-highlight/.npmignore b/packages/gitbook-plugin-highlight/.npmignore new file mode 100644 index 0000000..a0e53cf --- /dev/null +++ b/packages/gitbook-plugin-highlight/.npmignore @@ -0,0 +1,2 @@ +# Publish assets on NPM +!_assets/plugin.js diff --git a/packages/gitbook-plugin-highlight/_assets/website/white.css b/packages/gitbook-plugin-highlight/_assets/website/white.css new file mode 100644 index 0000000..d59f1d4 --- /dev/null +++ b/packages/gitbook-plugin-highlight/_assets/website/white.css @@ -0,0 +1,92 @@ +/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ + +/* Tomorrow Comment */ +.hljs-comment, +.hljs-title { + color: #8e908c; +} + +/* Tomorrow Red */ +.hljs-variable, +.hljs-attribute, +.hljs-tag, +.hljs-regexp, +.hljs-deletion, +.ruby .hljs-constant, +.xml .hljs-tag .hljs-title, +.xml .hljs-pi, +.xml .hljs-doctype, +.html .hljs-doctype, +.css .hljs-id, +.css .hljs-class, +.css .hljs-pseudo { + color: #c82829; +} + +/* Tomorrow Orange */ +.hljs-number, +.hljs-preprocessor, +.hljs-pragma, +.hljs-built_in, +.hljs-literal, +.hljs-params, +.hljs-constant { + color: #f5871f; +} + +/* Tomorrow Yellow */ +.ruby .hljs-class .hljs-title, +.css .hljs-rules .hljs-attribute { + color: #eab700; +} + +/* Tomorrow Green */ +.hljs-string, +.hljs-value, +.hljs-inheritance, +.hljs-header, +.hljs-addition, +.ruby .hljs-symbol, +.xml .hljs-cdata { + color: #718c00; +} + +/* Tomorrow Aqua */ +.css .hljs-hexcolor { + color: #3e999f; +} + +/* Tomorrow Blue */ +.hljs-function, +.python .hljs-decorator, +.python .hljs-title, +.ruby .hljs-function .hljs-title, +.ruby .hljs-title .hljs-keyword, +.perl .hljs-sub, +.javascript .hljs-title, +.coffeescript .hljs-title { + color: #4271ae; +} + +/* Tomorrow Purple */ +.hljs-keyword, +.javascript .hljs-function { + color: #8959a8; +} + +.hljs { + display: block; + background: white; + color: #4d4d4c; + padding: 0.5em; +} + +.coffeescript .javascript, +.javascript .xml, +.tex .hljs-formula, +.xml .javascript, +.xml .vbscript, +.xml .css, +.xml .hljs-cdata { + opacity: 0.5; +} diff --git a/packages/gitbook-plugin-highlight/index.js b/packages/gitbook-plugin-highlight/index.js new file mode 100644 index 0000000..e542ae8 --- /dev/null +++ b/packages/gitbook-plugin-highlight/index.js @@ -0,0 +1,10 @@ + +module.exports = { + blocks: { + + }, + + hooks: { + + } +}; diff --git a/packages/gitbook-plugin-highlight/package.json b/packages/gitbook-plugin-highlight/package.json new file mode 100644 index 0000000..ce8b8d6 --- /dev/null +++ b/packages/gitbook-plugin-highlight/package.json @@ -0,0 +1,29 @@ +{ + "name": "gitbook-plugin-highlight", + "description": "Syntax highlighter for Gitbook", + "main": "index.js", + "browser": "./_assets/plugin.js", + "version": "4.0.0", + "dependencies": { + "gitbook-core": "4.0.0", + "highlight.js": "9.7.0" + }, + "devDependencies": { + "gitbook-plugin": "4.0.0" + }, + "engines": { + "gitbook": ">=3.0.0" + }, + "scripts": { + "build-js": "gitbook-plugin build ./src/index.js ./_assets/plugin.js", + "prepublish": "npm run build-js" + }, + "homepage": "https://github.com/GitbookIO/gitbook", + "repository": { + "type": "git", + "url": "https://github.com/GitbookIO/gitbook.git" + }, + "bugs": { + "url": "https://github.com/GitbookIO/gitbook/issues" + } +} diff --git a/packages/gitbook-plugin-highlight/src/ALIASES.js b/packages/gitbook-plugin-highlight/src/ALIASES.js new file mode 100644 index 0000000..799efef --- /dev/null +++ b/packages/gitbook-plugin-highlight/src/ALIASES.js @@ -0,0 +1,10 @@ + +const ALIASES = { + 'py': 'python', + 'js': 'javascript', + 'json': 'javascript', + 'rb': 'ruby', + 'csharp': 'cs' +}; + +module.exports = ALIASES; diff --git a/packages/gitbook-plugin-highlight/src/CodeBlock.js b/packages/gitbook-plugin-highlight/src/CodeBlock.js new file mode 100644 index 0000000..a556d36 --- /dev/null +++ b/packages/gitbook-plugin-highlight/src/CodeBlock.js @@ -0,0 +1,55 @@ +const hljs = require('highlight.js'); +const GitBook = require('gitbook-core'); +const { React } = GitBook; + +const getLanguage = require('./getLanguage'); + +/** + * Get children as text + * @param {React.Children} children + * @return {String} + */ +function getChildrenToText(children) { + return React.Children.map(children, child => { + if (typeof child === 'string') { + return child; + } else { + return child.props.children ? + getChildrenToText(child.props.children) : ''; + } + }).join(''); +} + +const CodeBlock = React.createClass({ + propTypes: { + children: React.PropTypes.node, + className: React.PropTypes.string + }, + + render() { + const { children, className } = this.props; + const content = getChildrenToText(children); + const lang = getLanguage(className || ''); + + const includeCSS = <GitBook.ImportCSS href="gitbook/highlight/white.css" />; + + try { + const html = hljs.highlight(lang, content).value; + return ( + <code> + {includeCSS} + <span dangerouslySetInnerHTML={{__html: html}} /> + </code> + ); + } catch (e) { + return ( + <code> + {includeCSS} + {content} + </code> + ); + } + } +}); + +module.exports = CodeBlock; diff --git a/packages/gitbook-plugin-highlight/src/getLanguage.js b/packages/gitbook-plugin-highlight/src/getLanguage.js new file mode 100644 index 0000000..7a1bf8e --- /dev/null +++ b/packages/gitbook-plugin-highlight/src/getLanguage.js @@ -0,0 +1,34 @@ +const GitBook = require('gitbook-core'); +const { List } = GitBook.Immutable; + +const ALIASES = require('./ALIASES'); + +/** + * Return language for a code blocks from a list of class names + * + * @param {String} className + * @return {String} + */ +function getLanguage(className) { + const lang = List(className.split(' ')) + .map(function(cl) { + // Markdown + if (cl.search('lang-') === 0) { + return cl.slice('lang-'.length); + } + + // Asciidoc + if (cl.search('language-') === 0) { + return cl.slice('language-'.length); + } + + return null; + }) + .find(function(cl) { + return Boolean(cl); + }); + + return ALIASES[lang] || lang; +} + +module.exports = getLanguage; diff --git a/packages/gitbook-plugin-highlight/src/index.js b/packages/gitbook-plugin-highlight/src/index.js new file mode 100644 index 0000000..3f17c42 --- /dev/null +++ b/packages/gitbook-plugin-highlight/src/index.js @@ -0,0 +1,9 @@ +const GitBook = require('gitbook-core'); +const CodeBlock = require('./CodeBlock'); + +module.exports = GitBook.createPlugin({ + activate: (dispatch, getState, { Components }) => { + dispatch(Components.registerComponent(CodeBlock, { role: 'html:code' })); + }, + reduce: (state, action) => state +}); |