Skip to content
This repository has been archived by the owner on Nov 28, 2022. It is now read-only.

Commit

Permalink
Add readme-syntax-highlighter package and use in ApiExplorer
Browse files Browse the repository at this point in the history
  • Loading branch information
Dom Harrington committed Aug 11, 2017
1 parent f770940 commit b70a72a
Show file tree
Hide file tree
Showing 18 changed files with 4,254 additions and 5 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,6 @@ test('should generate a HTML snippet for each lang', () => {

Object.keys(snippets).forEach((lang) => {
expect(typeof snippets[lang]).toBe('string');
// expect(snippets[lang]).toEqual(expect.stringMatching(/cm-s-tomorrow-night/));
expect(snippets[lang]).toEqual(expect.stringMatching(/cm-s-tomorrow-night/));
});
});
9 changes: 6 additions & 3 deletions packages/api-explorer-ui/src/CodeSample.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ function CodeSample({ oas, setLanguage, path, method }) {
<li key={lang}>
<a
role="link"
href="#"
className={`hub-lang-switch-${lang}`}
onClick={setLanguage.bind(null, lang)}
>{lang}</a>
Expand Down Expand Up @@ -73,9 +74,11 @@ function CodeSample({ oas, setLanguage, path, method }) {
<i className="icon icon-sync icon-spin" ng-show="codeLoading" />
{
Object.keys(snippets).map(lang => (
<pre key={lang} className={`tomorrow-night hub-lang hub-lang-${lang}`}>
{snippets[lang]}
</pre>
<pre
key={lang}
className={`tomorrow-night hub-lang hub-lang-${lang}`}
dangerouslySetInnerHTML={{ __html: snippets[lang] }}
/>
))
}
</div>
Expand Down
4 changes: 3 additions & 1 deletion packages/api-explorer-ui/src/lib/generate-code-snippets.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
const HTTPSnippet = require('httpsnippet');
const generateHar = require('./oas-to-har');
const syntaxHighlighter = require('readme-syntax-highlighter');

const supportedLanguages = {
node: {
Expand Down Expand Up @@ -64,8 +65,9 @@ module.exports = (oas, path, method, languages) => {
const snippet = new HTTPSnippet(har);

return languages.reduce((snippets, lang) => {
const language = supportedLanguages[lang];
return Object.assign(snippets, {
[lang]: snippet.convert(...supportedLanguages[lang].httpsnippet),
[lang]: syntaxHighlighter(snippet.convert(...language.httpsnippet), language.highlight),
});
}, {});
};
11 changes: 11 additions & 0 deletions packages/readme-syntax-highlighter/.editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
root = true

# Unix-style newlines with a newline ending every file
[*]
end_of_line = lf
insert_final_newline = true

[*js]
charset = utf-8
indent_style = space
trim_trailing_whitespace = true
2 changes: 2 additions & 0 deletions packages/readme-syntax-highlighter/.eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
**/node_modules
coverage
6 changes: 6 additions & 0 deletions packages/readme-syntax-highlighter/.eslintrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"extends": "airbnb-base",
"rules": {

}
}
2 changes: 2 additions & 0 deletions packages/readme-syntax-highlighter/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules
coverage
7 changes: 7 additions & 0 deletions packages/readme-syntax-highlighter/.jsinspectrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"threshold": 30,
"identifiers": true,
"ignore": "test",
"reporter": "default",
"suppress": 100
}
5 changes: 5 additions & 0 deletions packages/readme-syntax-highlighter/.travis.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
language: node_js
sudo: false
node_js:
- 6.0
- 8.0
13 changes: 13 additions & 0 deletions packages/readme-syntax-highlighter/LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
Copyright (c) 2017, Dom Harrington <dom@harrington-mail.com>

Permission to use, copy, modify, and/or distribute this software for any purpose
with or without fee is hereby granted, provided that the above copyright notice
and this permission notice appear in all copies.

THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND
FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS
OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER
TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF
THIS SOFTWARE.
21 changes: 21 additions & 0 deletions packages/readme-syntax-highlighter/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# readme-syntax-highlighter

Syntax highlighter used on ReadMe.io

[![build status](https://secure.travis-ci.org/readme/readme-syntax-highlighter.svg)](http://travis-ci.org/readme/readme-syntax-highlighter)
[![dependency status](https://david-dm.org/readme/readme-syntax-highlighter.svg)](https://david-dm.org/readme/readme-syntax-highlighter)

## Installation

```
npm install --save readme-syntax-highlighter
```

## Usage

## Credits
[Dom Harrington](https://github.com/readme/)

## License

ISC
44 changes: 44 additions & 0 deletions packages/readme-syntax-highlighter/codemirror.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
const CodeMirror = require('codemirror');
require('codemirror/addon/runmode/runmode');
require('codemirror/mode/meta.js');

require('codemirror/mode/shell/shell');
require('codemirror/mode/javascript/javascript');
require('codemirror/mode/ruby/ruby');
require('codemirror/mode/python/python');

function esc(str) {
return str.replace(/[<&]/g, ch => (ch === '&' ? '&amp;' : '&lt;'));
}

module.exports = (code, lang) => {
let output = '';

// if (!CodeMirror.modes[lang]) {
// require(`codemirror/mode/${lang}/${lang}.js`);
// }

let curStyle = null;
let accum = '';
function flush() {
accum = esc(accum);
if (curStyle) {
output += `<span class="${curStyle.replace(/(^|\s+)/g, '$1cm-')}">${accum}</span>`;
} else {
output += accum;
}
}

CodeMirror.runMode(code, lang, (text, style) => {
if (style !== curStyle) {
flush();
curStyle = style;
accum = text;
} else {
accum += text;
}
});
flush();

return output;
};
Empty file.
67 changes: 67 additions & 0 deletions packages/readme-syntax-highlighter/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
const codemirror = require('./codemirror');

function sanitizeCode(code) {
const entityMap = {
'&': '&amp;',
'<': '&lt;',
'>': '&gt;',
'"': '&quot;',
"'": '&#39;',
'/': '&#x2F;',
};

return String(code).replace(/[&<>"'/]/g, s => entityMap[s]);
}

module.exports = (code, lang/* , dark */) => {
if (lang === 'text') {
return sanitizeCode(code);
}

const theme = 'cm-s-tomorrow-night';
// let theme = 'cm-s-neo';
// if (dark) {
// theme = 'cm-s-tomorrow-night';
// }

// const modes = {
// html: 'htmlmixed',
// json: ['javascript', 'application/ld+json'],
// text: ['null', 'text/plain'],
// markdown: 'gfm',
// stylus: 'scss',
// bash: 'shell',
// mysql: 'sql',
// sql: ['sql', 'text/x-sql'],
// curl: 'shell',
// asp: 'clike',
// csharp: ['clike', 'text/x-csharp'],
// cplusplus: ['clike', 'text/x-c++src'],
// c: 'clike',
// java: ['clike', 'text/x-java'],
// scala: ['clike', 'text/x-scala'],
// objectivec: ['clike', 'text/x-objectivec'],
// liquid: 'htmlmixed',
// scss: 'css',
// };

// let mode = lang;

// if (mode in modes) {
// mode = modes[mode];
// lang = mode;
// if (_.isArray(mode)) {
// lang = mode[0];
// mode = mode[1];
// }
// }

// let highlighted = ;

// // Kind of a hack, but no other way to sanitize angular code
// // Can't use ng-non-bindable because of jwt variables
// highlighted = highlighted.replace(/{{/g, '&#123;<span></span>&#123;');
// highlighted = highlighted.replace(/}}/g, '&#125;<span></span>&#125;');

return `<span class="${theme}">${codemirror(code, lang)}</span>`;
};
Loading

0 comments on commit b70a72a

Please sign in to comment.