Skip to content

Commit

Permalink
MathJax support (mrvautin#147)
Browse files Browse the repository at this point in the history
* MathJax support

- Adds support for MathJax.
- Mermaid and MathJax can be enabled/disabled via Settings.
- Bit of code styling for the layout.hbs files.
- Added link to footer.
- Updated darkly theme navbar.

* Fixed indentation

Tabs to spaces.
  • Loading branch information
TBK authored and mrvautin committed Mar 20, 2017
1 parent b71fdc8 commit 0d9ba16
Show file tree
Hide file tree
Showing 6 changed files with 437 additions and 383 deletions.
3 changes: 2 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,8 @@ Most of the configuration can be done on the `/settings` page but there are some
|`show_kb_meta`|Whether to show article meta data including published date, last updated date, author etc|
|`suggest_allowed`|If enabled non authenticated users can submit article suggestions for approval|
|`show_author_email`|Controls whether the authors email address is displayed in the meta. Requires "Show article meta data" to be true.|
|`enable_mermaid_charts`|Whether to allow Mermaid charts within articles|
|`mermaid`|Whether to allow Mermaid charts within articles|
|`mathjax`|Whether to allow MathJax inputs within articles|
|`app_context`|Allows for the website to be run from a non root path. Eg: http://127.0.0.1:4444/openkb/|
|`links_blank_page`|Controls whether links within articles open a new page (tab)|
|`add_header_anchors`|Whether to add HTML anchors to all heading tags for linking within articles or direct linking from other articles|
Expand Down
252 changes: 131 additions & 121 deletions public/themes/darkly/views/layouts/layout.hbs
Original file line number Diff line number Diff line change
@@ -1,130 +1,140 @@
<!DOCTYPE html>
<html lang="en">
<head>
{{#if result.kb_seo_title}}
<title>{{result.kb_seo_title}}</title>
<meta property="og:title" content="{{result.kb_seo_title}}" />
{{else}}
{{#if result.kb_title}}
<html lang="{{config.settings.locale}}">
<head>
{{#if result.kb_seo_title}}
<title>{{result.kb_seo_title}}</title>
<meta property="og:title" content="{{result.kb_seo_title}}" />
{{else}}
{{#if result.kb_title}}
<title>{{result.kb_title}}</title>
<meta property="og:title" content="{{result.kb_title}}" />
{{else}}
{{else}}
<title>{{title}}</title>
<meta property="og:title" content="{{title}}" />
{{/if}}
{{/if}}
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
{{#if result.kb_seo_description}}
<meta name="description" content="{{result.kb_seo_description}}">
<meta property="og:description" content="{{result.kb_seo_description}}" />
{{else}}
{{#if result.kb_body}}
{{/if}}
{{/if}}
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
{{#if result.kb_seo_description}}
<meta name="description" content="{{result.kb_seo_description}}">
<meta property="og:description" content="{{result.kb_seo_description}}" />
{{else}}
{{#if result.kb_body}}
<meta name="description" content="{{substring (strip_md result.kb_body) 160}}">
<meta property="og:description" content="{{substring (strip_md result.kb_body) 160}}" />
{{else}}
<meta name="description" content="Powered by openKB">
<meta property="og:description" content="Powered by openKB" />
{{/if}}
{{/if}}
{{#if result.kb_keywords}}
<meta name="keywords" content="{{result.kb_keywords}}">
{{else}}
<meta name="keywords" content="openKB">
{{/if}}
<meta property="og:type" content="article" />
<meta property="og:image" content="{{current_url}}/logo.png" />
<meta property="og:url" content="{{fullUrl}}" />
<link rel="canonical" href="{{fullUrl}}" />
<link rel="stylesheet" href="/themes/darkly/css/darkly.min.css">
<link rel="stylesheet" href="{{app_context}}/stylesheets/github.css">
<link rel="stylesheet" href="/themes/darkly/css/style.css">
<link rel="stylesheet" href="{{app_context}}/font-awesome/css/font-awesome.min.css">
<script src="{{app_context}}/jquery/jquery.min.js"></script>
<script src="{{app_context}}/bootstrap/js/bootstrap.min.js"></script>
<script src="{{app_context}}/javascripts/markdown-it-classy.js"></script>
<script src="{{app_context}}/javascripts/highlight.min.js"></script>
<script src="{{app_context}}/markdown-it/markdown-it.min.js"></script>
<script src="{{app_context}}/javascripts/openKB.js"></script>
{{#ifCond user_page '===' true}}
{{#if config.settings.google_analytics}}
{{else}}
<meta name="description" content="{{__ "Powered by"}} openKB">
<meta property="og:description" content="openKB is an Open Source Node.js Markdown based knowledge base/FAQ/Wiki app with powerful lunr search" />
{{/if}}
{{/if}}
{{#if result.kb_keywords}}
<meta name="keywords" content="{{result.kb_keywords}}">
{{else}}
<meta name="keywords" content="openKB">
{{/if}}
<meta property="og:type" content="article" />
<meta property="og:image" content="{{current_url}}/logo.png" />
<meta property="og:url" content="{{fullUrl}}" />
<link rel="canonical" href="{{fullUrl}}" />
<link rel="stylesheet" href="/themes/darkly/css/darkly.min.css">
<link rel="stylesheet" href="{{app_context}}/stylesheets/github.css">
<link rel="stylesheet" href="/themes/darkly/css/style.css">
<link rel="stylesheet" href="{{app_context}}/font-awesome/css/font-awesome.min.css">
<script src="{{app_context}}/jquery/jquery.min.js"></script>
<script src="{{app_context}}/bootstrap/js/bootstrap.min.js"></script>
{{#ifCond config.settings.mermaid '===' true}}
<script src="{{app_context}}/javascripts/mermaid.min.js"></script>
{{/ifCond}}
{{#ifCond config.settings.mathjax '===' true}}
<script type="text/x-mathjax-config">
MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']], processEscapes: true}});
</script>
<script async src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config={{config.settings.mathjax_input_mode}}"></script>
{{/ifCond}}
<script src="{{app_context}}/javascripts/markdown-it-classy.js"></script>
<script src="{{app_context}}/javascripts/highlight.min.js"></script>
<script src="{{app_context}}/markdown-it/markdown-it.min.js"></script>
<script src="{{app_context}}/javascripts/openKB.js"></script>
{{#ifCond user_page '===' true}}
{{#if config.settings.google_analytics}}
{{{config.settings.google_analytics}}}
{{/if}}
{{/ifCond}}
</head>
<body class="{{show_footer}}">
<!-- Static navbar -->
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{app_context}}/"><img alt="Brand" class="img-responsive" height="110" width="110" src="{{app_context}}/themes/darkly/images/logo.png"></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
{{#if session.user}}
{{#if result._id}}
<li><a href="{{app_context}}/edit/{{result._id}}">Edit</a></li>
{{/if}}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Users <span class="caret"></span></a>
<ul class="dropdown-menu">
{{#ifCond session.is_admin '==' 'true'}}
<li><a href="{{app_context}}/users/new"><i class="fa fa-user-plus fa-fw"></i>&nbsp; New</a></li>
<li><a href="{{app_context}}/users"><i class="fa fa-users fa-fw"></i>&nbsp; Edit</a></li>
{{/ifCond}}
<li><a href="{{app_context}}/user/edit/{{session.user_id}}"><i class="fa fa-user fa-fw"></i>&nbsp; My account</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Article <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="{{app_context}}/insert"><i class="fa fa-plus fa-fw"></i>&nbsp; New</a></li>
<li><a href="{{app_context}}/articles"><i class="fa fa-pencil fa-fw"></i>&nbsp; Edit</a></li>
</ul>
</li>
{{#ifCond session.is_admin '==' 'true'}}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Admin <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="{{app_context}}/settings"><i class="fa fa-cog fa-fw"></i>&nbsp; Settings</a></li>
<li><a href="{{app_context}}/files"><i class="fa fa-files-o fa-fw"></i>&nbsp; Files</a></li>
<li><a href="{{app_context}}/export"><i class="fa fa-file-archive-o fa-fw"></i>&nbsp; Export</a></li>
<li><a href="{{app_context}}/file_cleanup"><i class="fa fa-trash fa-fw"></i>&nbsp; Cleanup files</a></li>
</ul>
</li>
{{/ifCond}}
<li><a href="{{app_context}}/logout">Logout</a></li>
{{else}}
{{#if config.settings.suggest_allowed}}
<li><a href="{{app_context}}/suggest">Suggest</a></li>
{{/if}}
<li><a href="{{app_context}}/login">Login</a></li>
{{/if}}
</ul>
</div>
</div>
</nav>
<div class="container-fluid">
{{{body}}}
</div>
<input type="hidden" id="input_notify_message" value="{{message}}">
<input type="hidden" id="input_notify_message_type" value="{{message_type}}">
<input type="hidden" value="{{app_context}}" id="app_context">
<input type="hidden" value="{{config.settings.links_blank_page}}" id="blank_links">
<div id="notify_message"></div>
{{#if show_footer}}
<footer class="footer">
<div class="container">
<p>Powered by openKB</p>
</div>
</footer>
{{/if}}
</body>
{{/if}}
{{/ifCond}}
</head>
<body class="{{show_footer}}">
<!-- Static navbar -->
<nav class="navbar navbar-default navbar-static-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{app_context}}/"><img alt="Brand" class="img-responsive" height="110" width="110" src="{{app_context}}/themes/darkly/images/logo.png"></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
{{#if session.user}}
{{#if result._id}}
<li><a href="{{app_context}}/edit/{{result._id}}">Edit</a></li>
{{/if}}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Users <span class="caret"></span></a>
<ul class="dropdown-menu">
{{#ifCond session.is_admin '==' 'true'}}
<li><a href="{{app_context}}/users/new"><i class="fa fa-user-plus fa-fw"></i>&nbsp; New</a></li>
<li><a href="{{app_context}}/users"><i class="fa fa-users fa-fw"></i>&nbsp; Edit</a></li>
{{/ifCond}}
<li><a href="{{app_context}}/user/edit/{{session.user_id}}"><i class="fa fa-user fa-fw"></i>&nbsp; My account</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Article <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="{{app_context}}/insert"><i class="fa fa-plus fa-fw"></i>&nbsp; New</a></li>
<li><a href="{{app_context}}/articles"><i class="fa fa-pencil fa-fw"></i>&nbsp; Edit</a></li>
</ul>
</li>
{{#ifCond session.is_admin '==' 'true'}}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Admin <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="{{app_context}}/settings"><i class="fa fa-cog fa-fw"></i>&nbsp; {{__ "Settings"}}</a></li>
<li><a href="{{app_context}}/files"><i class="fa fa-files-o fa-fw"></i>&nbsp; {{__ "Files"}}</a></li>
<li><a href="{{app_context}}/import"><i class="fa fa-upload fa-fw"></i>&nbsp; {{__ "Import"}}</a></li>
<li><a href="{{app_context}}/export"><i class="fa fa-file-archive-o fa-fw"></i>&nbsp; {{__ "Export"}}</a></li>
<li><a href="{{app_context}}/file_cleanup"><i class="fa fa-trash fa-fw"></i>&nbsp; {{__ "Cleanup files"}}</a></li>
</ul>
</li>
{{/ifCond}}
<li><a href="{{app_context}}/logout">Logout</a></li>
{{else}}
{{#if config.settings.suggest_allowed}}
<li><a href="{{app_context}}/suggest">Suggest</a></li>
{{/if}}
<li><a href="{{app_context}}/login">Login</a></li>
{{/if}}
</ul>
</div>
</div>
</nav>
<div class="container-fluid">
{{{body}}}
</div>
<input type="hidden" id="input_notify_message" value="{{message}}">
<input type="hidden" id="input_notify_message_type" value="{{message_type}}">
<input type="hidden" value="{{app_context}}" id="app_context">
<input type="hidden" value="{{config.settings.links_blank_page}}" id="blank_links">
<div id="notify_message"></div>
{{#if show_footer}}
<footer class="footer">
<div class="container">
<p>{{__ "Powered by"}} <a href="http://openkb.mrvautin.com/" target="_blank">openKB</a></p>
</div>
</footer>
{{/if}}
</body>
</html>
Loading

0 comments on commit 0d9ba16

Please sign in to comment.