Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Display filename in codeblock (resend) #1533

Merged
merged 4 commits into from
Feb 22, 2018
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions browser/components/markdown.styl
Original file line number Diff line number Diff line change
Expand Up @@ -220,6 +220,7 @@ pre
background-color white
&.CodeMirror
height initial
flex-wrap wrap
&>code
flex 1
overflow-x auto
Expand All @@ -229,6 +230,13 @@ pre
padding 0
border none
border-radius 0
&>span.filename
width 100%
border-radius: 5px 0px 0px 0px
margin -8px 100% 8px -8px
padding 0px 6px
background-color #777;
color white
&>span.lineNumber
display none
font-size 1em
Expand Down
16 changes: 12 additions & 4 deletions browser/lib/markdown.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,11 @@ import {lastFindInArray} from './utils'
const katex = window.katex
const config = ConfigManager.get()

function createGutter (str) {
const lc = (str.match(/\n/g) || []).length
function createGutter (str, fc) {
if(Number.isNaN(fc)) fc = 1
const lc = (str.match(/\n/g) || []).length + fc - 1
const lines = []
for (let i = 1; i <= lc; i++) {
for (let i = fc; i <= lc; i++) {
lines.push('<span class="CodeMirror-linenumber">' + i + '</span>')
}
return '<span class="lineNumber CodeMirror-gutters">' + lines.join('') + '</span>'
Expand All @@ -25,14 +26,21 @@ var md = markdownit({
xhtmlOut: true,
breaks: true,
highlight: function (str, lang) {
let delimiter = ":";
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please follow eslintrc

let langinfo = lang.split(delimiter);
let lang = langinfo[0];
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

duplicate declaration lang

let filename = langinfo[1] || "";
let fc = parseInt(langinfo[2],10);

if (lang === 'flowchart') {
return `<pre class="flowchart">${str}</pre>`
}
if (lang === 'sequence') {
return `<pre class="sequence">${str}</pre>`
}
return '<pre class="code">' +
createGutter(str) +
'<span class="filename">' + filename + '</span>' +
createGutter(str, fc) +
'<code class="' + lang + '">' +
str +
'</code></pre>'
Expand Down