makary/writefreely
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #31 from mrvdb/codehighlight

Browse source 
Add code highlighting
This commit is contained in:
Matt Baer 2018-11-23 13:23:50 -05:00 • committed by GitHub
commit cf784388f0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 86 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
templates.go
View file

@ -49,21 +49,19 @@ func initTemplate(name string) {
log.Info(" %s%s%s.tmpl", templatesDir, string(filepath.Separator), name) log.Info(" %s%s%s.tmpl", templatesDir, string(filepath.Separator), name)
} }
files := []string{
filepath.Join(templatesDir, name+".tmpl"),
filepath.Join(templatesDir, "include", "footer.tmpl"),
filepath.Join(templatesDir, "base.tmpl"),
}
if name == "collection" || name == "collection-tags" { if name == "collection" || name == "collection-tags" {
// These pages list out collection posts, so we also parse templatesDir + "include/posts.tmpl" // These pages list out collection posts, so we also parse templatesDir + "include/posts.tmpl"
templates[name] = template.Must(template.New("").Funcs(funcMap).ParseFiles( files = append(files, filepath.Join(templatesDir, "include", "posts.tmpl"))
filepath.Join(templatesDir, name+".tmpl"),
filepath.Join(templatesDir, "include", "posts.tmpl"),
filepath.Join(templatesDir, "include", "footer.tmpl"),
filepath.Join(templatesDir, "base.tmpl"),
))
} else {
templates[name] = template.Must(template.New("").Funcs(funcMap).ParseFiles(
filepath.Join(templatesDir, name+".tmpl"),
filepath.Join(templatesDir, "include", "footer.tmpl"),
filepath.Join(templatesDir, "base.tmpl"),
))
} }
if name == "collection" || name == "collection-tags" || name == "collection-post" || name == "post" {
files = append(files, filepath.Join(templatesDir, "include", "post-render.tmpl"))
}
templates[name] = template.Must(template.New("").Funcs(funcMap).ParseFiles(files...))
} }
func initPage(path, key string) { func initPage(path, key string) {

20
templates/collection-post.tmpl
View file

@ -30,20 +30,14 @@
{{range .Images}}<meta property="og:image" content="{{.}}" />{{else}}<meta property="og:image" content="{{.Collection.AvatarURL}}">{{end}} {{range .Images}}<meta property="og:image" content="{{.}}" />{{else}}<meta property="og:image" content="{{.Collection.AvatarURL}}">{{end}}
<meta property="article:published_time" content="{{.Created8601}}"> <meta property="article:published_time" content="{{.Created8601}}">
{{if .Collection.StyleSheet}}<style type="text/css">{{.Collection.StyleSheetDisplay}}</style>{{end}} {{if .Collection.StyleSheet}}<style type="text/css">{{.Collection.StyleSheetDisplay}}</style>{{end}}
{{if .Collection.RenderMathJax}} {{if .Collection.RenderMathJax}}
<script type="text/x-mathjax-config"> <!-- Add mathjax logic -->
MathJax.Hub.Config({ {{template "mathjax" . }}
extensions: ["tex2jax.js"], {{end}}
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: { <!-- Add highlighting logic -->
inlineMath: [ ['$','$'], ["\\(","\\)"] ], {{template "highlighting" .}}
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML" async></script>{{end}}
</head> </head>
<body id="post"> <body id="post">

20
templates/collection-tags.tmpl
View file

@ -30,20 +30,14 @@
<meta property="og:url" content="{{.CanonicalURL}}tag:{{.Tag}}" /> <meta property="og:url" content="{{.CanonicalURL}}tag:{{.Tag}}" />
<meta property="og:image" content="{{.Collection.AvatarURL}}"> <meta property="og:image" content="{{.Collection.AvatarURL}}">
{{if .Collection.StyleSheet}}<style type="text/css">{{.Collection.StyleSheetDisplay}}</style>{{end}} {{if .Collection.StyleSheet}}<style type="text/css">{{.Collection.StyleSheetDisplay}}</style>{{end}}
{{if .Collection.RenderMathJax}} {{if .Collection.RenderMathJax}}
<script type="text/x-mathjax-config"> <!-- Add mathjax logic -->
MathJax.Hub.Config({ {{template "mathjax" .}}
extensions: ["tex2jax.js"], {{end}}
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: { <!-- Add highlighting logic -->
inlineMath: [ ['$','$'], ["\\(","\\)"] ], {{template "highlighting" . }}
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML" async></script>{{end}}
</head> </head>
<body id="subpage"> <body id="subpage">

20
templates/collection.tmpl
View file

@ -28,20 +28,14 @@
<meta property="og:description" content="{{.Description}}" /> <meta property="og:description" content="{{.Description}}" />
<meta property="og:image" content="{{.AvatarURL}}"> <meta property="og:image" content="{{.AvatarURL}}">
{{if .StyleSheet}}<style type="text/css">{{.StyleSheetDisplay}}</style>{{end}} {{if .StyleSheet}}<style type="text/css">{{.StyleSheetDisplay}}</style>{{end}}
{{if .RenderMathJax}} {{if .RenderMathJax}}
<script type="text/x-mathjax-config"> <!-- Add mathjax logic -->
MathJax.Hub.Config({ {{template "mathjax" .}}
extensions: ["tex2jax.js"], {{end}}
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: { <!-- Add highlighting logic -->
inlineMath: [ ['$','$'], ["\\(","\\)"] ], {{template "highlighting" . }}
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML" async></script>{{end}}
</head> </head>
<body id="collection" itemscope itemtype="http://schema.org/WebPage"> <body id="collection" itemscope itemtype="http://schema.org/WebPage">

50
templates/include/post-render.tmpl Normal file
View file

@ -0,0 +1,50 @@
<!-- Miscelaneous render related template parts we use multiple times -->
{{define "highlighting"}}
<script>
// TODO: this feels more like a mutation observer
addEventListener('DOMContentLoaded', function () {
var hlbaseUri = "//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/";
var x = document.querySelectorAll("code[class^='language-']");
if (x.length > 0) {
// We have blocks to be highlighted, so we load css + js
var st = document.createElement('link');
st.rel = "stylesheet";
st.href = hlbaseUri + "styles/atom-one-light.min.css";
document.getElementsByTagName('head')[0].appendChild(st);
var sc = document.createElement('script');
sc.type = "text/javascript";
sc.src = hlbaseUri + "highlight.min.js";
sc.async = true;
// Here's the crux, we need to react on load event for this new element to make it work.
sc.onload = () => { highlight(x) }
document.getElementsByTagName('head')[0].appendChild(sc);
// Given a set of nodes, run highlighting on them
function highlight(nodes) {
for (i=0; i < nodes.length; i++) {
hljs.highlightBlock(nodes[i]);
}
}
}
});
</script>
{{end}}
<!-- Include mathjax configuration -->
{{define "mathjax"}}
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML" async></script>
{{end}}

7
templates/post.tmpl
View file

@ -6,7 +6,7 @@
<title>{{if .Title}}{{.Title}}{{else}}{{.GenTitle}}{{end}} &mdash; {{.SiteName}}</title> <title>{{if .Title}}{{.Title}}{{else}}{{.GenTitle}}{{end}} &mdash; {{.SiteName}}</title>
{{if .IsCode}} {{if .IsCode}}
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/mono-blue.min.css"> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/mono-blue.min.css">
{{end}} {{end}}
<link rel="stylesheet" type="text/css" href="/css/write.css" /> <link rel="stylesheet" type="text/css" href="/css/write.css" />
<link rel="shortcut icon" href="/favicon.ico" /> <link rel="shortcut icon" href="/favicon.ico" />
@ -31,7 +31,8 @@
<meta property="og:description" content="{{.Description}}" /> <meta property="og:description" content="{{.Description}}" />
<meta property="og:image" content="https://write.as/img/w-sq-light.png"> <meta property="og:image" content="https://write.as/img/w-sq-light.png">
{{if .Author}}<meta property="article:author" content="https://{{.Author}}" />{{end}} {{if .Author}}<meta property="article:author" content="https://{{.Author}}" />{{end}}
<!-- Add highlighting logic -->
{{template "highlighting" .}}
</head> </head>
<body id="post"> <body id="post">
@ -55,7 +56,7 @@
</body> </body>
{{if .IsCode}} {{if .IsCode}}
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/highlight.min.js"></script>
<script> <script>
hljs.highlightBlock(document.getElementById('post-body')); hljs.highlightBlock(document.getElementById('post-body'));
</script> </script>