mirror of https://github.com/status-im/codimd.git
Update to make slide mode support all extra syntax and change it's rendering engine
This commit is contained in:
parent
160b51d16a
commit
d39f1fc700
|
@ -22,12 +22,8 @@ var md = require('reveal.js/plugin/markdown/markdown');
|
|||
|
||||
//reveal.js
|
||||
var slideOptions = {
|
||||
template: fs.readFileSync(config.slidepath).toString(),
|
||||
theme: 'css/theme/black.css',
|
||||
highlightTheme: 'zenburn',
|
||||
separator: '^(\r\n?|\n)---(\r\n?|\n)$',
|
||||
verticalSeparator: '^(\r\n?|\n)----(\r\n?|\n)$',
|
||||
revealOptions: {}
|
||||
verticalSeparator: '^(\r\n?|\n)----(\r\n?|\n)$'
|
||||
};
|
||||
|
||||
//public
|
||||
|
@ -544,11 +540,9 @@ function showPublishSlide(req, res, next) {
|
|||
url: origin,
|
||||
title: meta.title || title,
|
||||
description: meta.description,
|
||||
theme: slideOptions.theme,
|
||||
highlightTheme: slideOptions.highlightTheme,
|
||||
slides: slides,
|
||||
options: JSON.stringify(slideOptions.revealOptions, null, 2),
|
||||
GA: meta.GA
|
||||
GA: meta.GA,
|
||||
useCDN: config.usecdn
|
||||
};
|
||||
return renderPublishSlide(data, res);
|
||||
}).catch(function (err) {
|
||||
|
|
|
@ -50,8 +50,7 @@
|
|||
width: auto;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-top: -40px;
|
||||
margin-left: -40px;
|
||||
transform: translate(-50%, -50%);
|
||||
color: white;
|
||||
opacity: 0.3;
|
||||
-webkit-transition: opacity 0.2s; /* Safari */
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -6,7 +6,9 @@
|
|||
.reveal h5,
|
||||
.reveal h6 {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft JhengHei", Meiryo, "MS ゴシック", "MS Gothic", sans-serif;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.reveal pre,
|
||||
.reveal code {
|
||||
font-family: "Source Code Pro", Consolas, monaco, "Microsoft JhengHei", Meiryo, "MS ゴシック", "MS Gothic", monospace;
|
||||
|
@ -14,3 +16,231 @@
|
|||
line-height: 1.25;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.vimeo,
|
||||
.youtube {
|
||||
position: relative !important;
|
||||
cursor: pointer;
|
||||
display: table;
|
||||
width: 100% !important;
|
||||
text-align: center;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-color: black;
|
||||
overflow: hidden;
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
|
||||
/* youtube always use 16:9 aspect ratio video */
|
||||
|
||||
.vimeo,
|
||||
.youtube {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-bottom: 56.25% !important;
|
||||
}
|
||||
|
||||
.vimeo > img,
|
||||
.youtube > img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
margin: 0 !important;
|
||||
border: 0 !important;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.vimeo > iframe,
|
||||
.youtube > iframe {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.slideshare .inner,
|
||||
.speakerdeck .inner {
|
||||
padding-bottom: 62% !important;
|
||||
}
|
||||
|
||||
.pdfobject {
|
||||
height: 85vh !important;
|
||||
}
|
||||
|
||||
.task-list-item-checkbox {
|
||||
font-size: inherit;
|
||||
height: 1em;
|
||||
margin: 0.2em 0 0.2em -0.65em !important;
|
||||
}
|
||||
|
||||
pre code .wrapper {
|
||||
display: -webkit-inline-flex;
|
||||
display: -moz-inline-flex;
|
||||
display: -ms-inline-flex;
|
||||
display: -o-inline-flex;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
pre code .gutter {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
pre code .gutter.linenumber {
|
||||
text-align: right;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: default;
|
||||
z-index: 4;
|
||||
padding: 0 8px 0 0;
|
||||
min-width: 20px;
|
||||
box-sizing: content-box;
|
||||
color: #afafaf !important;
|
||||
border-right: 3px solid #6ce26c !important;
|
||||
}
|
||||
|
||||
pre code .gutter.linenumber > span:before {
|
||||
content: attr(data-linenumber);
|
||||
}
|
||||
|
||||
pre code .code {
|
||||
float: left;
|
||||
margin: 0 0 0 16px;
|
||||
}
|
||||
|
||||
.gist .line-numbers {
|
||||
border-left: none;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.gist .line-data {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.gist table {
|
||||
border-spacing: 0;
|
||||
border-collapse: inherit !important;
|
||||
}
|
||||
|
||||
code[data-gist-id] {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
code[data-gist-id]:before {
|
||||
content: ''
|
||||
}
|
||||
|
||||
code[data-gist-id]:after {
|
||||
content: ''
|
||||
}
|
||||
|
||||
.alert {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.alert h4 {
|
||||
margin-top: 0;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.alert > p {
|
||||
padding: 5px !important;
|
||||
}
|
||||
|
||||
.alert-success {
|
||||
color: #3c763d;
|
||||
background-color: #dff0d8;
|
||||
border-color: #d6e9c6;
|
||||
}
|
||||
|
||||
.alert-success hr {
|
||||
border-top-color: #c9e2b3;
|
||||
}
|
||||
|
||||
.alert-success .alert-link {
|
||||
color: #2b542c;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
color: #31708f;
|
||||
background-color: #d9edf7;
|
||||
border-color: #bce8f1;
|
||||
}
|
||||
|
||||
.alert-info hr {
|
||||
border-top-color: #a6e1ec;
|
||||
}
|
||||
|
||||
.alert-info .alert-link {
|
||||
color: #245269;
|
||||
}
|
||||
|
||||
.alert-warning {
|
||||
color: #8a6d3b;
|
||||
background-color: #fcf8e3;
|
||||
border-color: #faebcc;
|
||||
}
|
||||
|
||||
.alert-warning hr {
|
||||
border-top-color: #f7e1b5;
|
||||
}
|
||||
|
||||
.alert-warning .alert-link {
|
||||
color: #66512c;
|
||||
}
|
||||
|
||||
.alert-danger {
|
||||
color: #a94442;
|
||||
background-color: #f2dede;
|
||||
border-color: #ebccd1;
|
||||
}
|
||||
|
||||
.alert-danger hr {
|
||||
border-top-color: #e4b9c0;
|
||||
}
|
||||
|
||||
.alert-danger .alert-link {
|
||||
color: #843534;
|
||||
}
|
||||
|
||||
pre.flow-chart,
|
||||
pre.sequence-diagram,
|
||||
pre.graphviz,
|
||||
pre.mermaid {
|
||||
text-align: center;
|
||||
background-color: white;
|
||||
border-radius: 0;
|
||||
white-space: inherit;
|
||||
}
|
||||
|
||||
pre.flow-chart > code,
|
||||
pre.sequence-diagram > code,
|
||||
pre.graphviz > code,
|
||||
pre.mermaid > code {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
pre.flow-chart > svg,
|
||||
pre.sequence-diagram > svg,
|
||||
pre.graphviz > svg,
|
||||
pre.mermaid > svg {
|
||||
max-width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.emoji {
|
||||
margin: 0 !important;
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
margin-bottom: -.25em !important;
|
||||
}
|
|
@ -5,27 +5,15 @@
|
|||
*/
|
||||
(function( root, factory ) {
|
||||
if( typeof exports === 'object' ) {
|
||||
module.exports = factory( require( './marked' ) );
|
||||
module.exports = factory();
|
||||
}
|
||||
else {
|
||||
// Browser globals (root is window)
|
||||
root.RevealMarkdown = factory( root.marked );
|
||||
root.RevealMarkdown = factory();
|
||||
root.RevealMarkdown.initialize();
|
||||
}
|
||||
}( this, function( marked ) {
|
||||
|
||||
if( typeof marked === 'undefined' ) {
|
||||
throw 'The reveal.js Markdown plugin requires marked to be loaded';
|
||||
}
|
||||
|
||||
if( typeof hljs !== 'undefined' ) {
|
||||
marked.setOptions({
|
||||
highlight: function( lang, code ) {
|
||||
return hljs.highlightAuto( lang, code ).value;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}( this, function() {
|
||||
|
||||
var DEFAULT_SLIDE_SEPARATOR = '^\r?\n---\r?\n$',
|
||||
DEFAULT_NOTES_SEPARATOR = 'note:',
|
||||
DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR = '\\\.element\\\s*?(.+?)$',
|
||||
|
@ -364,10 +352,10 @@
|
|||
var notes = section.querySelector( 'aside.notes' );
|
||||
var markdown = getMarkdownFromSlide( section );
|
||||
|
||||
var rendered = marked( markdown );
|
||||
rendered = preventXSS(rendered);
|
||||
|
||||
section.innerHTML = rendered;
|
||||
var rendered = md.render(markdown);
|
||||
rendered = preventXSS(rendered);
|
||||
var result = postProcess(rendered);
|
||||
section.innerHTML = result[0].outerHTML;
|
||||
addAttributes( section, section, null, section.getAttribute( 'data-element-attributes' ) ||
|
||||
section.parentNode.getAttribute( 'data-element-attributes' ) ||
|
||||
DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR,
|
||||
|
|
|
@ -0,0 +1,65 @@
|
|||
var body = $(".slides").html();
|
||||
$(".slides").html(S(body).unescapeHTML().s);
|
||||
|
||||
function extend() {
|
||||
var target = {};
|
||||
for (var i = 0; i < arguments.length; i++) {
|
||||
var source = arguments[i];
|
||||
for (var key in source) {
|
||||
if (source.hasOwnProperty(key)) {
|
||||
target[key] = source[key];
|
||||
}
|
||||
}
|
||||
}
|
||||
return target;
|
||||
}
|
||||
|
||||
// Optional libraries used to extend on reveal.js
|
||||
var deps = [{
|
||||
src: serverurl + '/vendor/reveal.js/lib/js/classList.js',
|
||||
condition: function() {
|
||||
return !document.body.classList;
|
||||
}
|
||||
}, {
|
||||
src: serverurl + '/js/reveal-markdown.js',
|
||||
condition: function() {
|
||||
return !!document.querySelector('[data-markdown]');
|
||||
}
|
||||
}, {
|
||||
src: serverurl + '/vendor/reveal.js/plugin/notes/notes.js',
|
||||
async: true,
|
||||
condition: function() {
|
||||
return !!document.body.classList;
|
||||
}
|
||||
}];
|
||||
|
||||
// default options to init reveal.js
|
||||
var defaultOptions = {
|
||||
controls: true,
|
||||
progress: true,
|
||||
slideNumber: true,
|
||||
history: true,
|
||||
center: true,
|
||||
transition: 'none',
|
||||
dependencies: deps
|
||||
};
|
||||
|
||||
// options from URL query string
|
||||
var queryOptions = Reveal.getQueryHash() || {};
|
||||
|
||||
var options = extend(defaultOptions, queryOptions);
|
||||
Reveal.initialize(options);
|
||||
|
||||
viewAjaxCallback = function () {
|
||||
Reveal.layout();
|
||||
};
|
||||
|
||||
function renderSlide() {
|
||||
var title = document.title;
|
||||
finishView($(event.currentSlide));
|
||||
document.title = title;
|
||||
Reveal.layout();
|
||||
}
|
||||
|
||||
Reveal.addEventListener('ready', renderSlide);
|
||||
Reveal.addEventListener('slidechanged', renderSlide);
|
|
@ -14,11 +14,28 @@
|
|||
<title><%- title %></title>
|
||||
<link rel="icon" type="image/png" href="<%- url %>/favicon.png">
|
||||
<link rel="apple-touch-icon" href="<%- url %>/apple-touch-icon.png">
|
||||
|
||||
<% if(useCDN) { %>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/ionicons/2.0.1/css/ionicons.min.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/octicons/3.5.0/octicons.min.css">
|
||||
<% } else { %>
|
||||
<link rel="stylesheet" href='<%- url %>/vendor/font-awesome/css/font-awesome.min.css'>
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/Ionicons/css/ionicons.min.css">
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/octicons/octicons/octicons.css">
|
||||
<% } %>
|
||||
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/reveal.js/css/reveal.css">
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/reveal.js/<%- theme %>" id="theme">
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/reveal.js/css/theme/black.css" id="theme">
|
||||
|
||||
<!-- For syntax highlighting -->
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/reveal.js/lib/css/<%- highlightTheme %>.css">
|
||||
<link rel="stylesheet" href="<%- url %>/vendor/reveal.js/lib/css/zenburn.css">
|
||||
|
||||
<link rel="stylesheet" href='<%- url %>/css/github-extract.css'>
|
||||
<link rel="stylesheet" href='<%- url %>/css/gist.css'>
|
||||
<link rel="stylesheet" href="<%- url %>/css/mermaid.css">
|
||||
<link rel="stylesheet" href='<%- url %>/css/markdown.css'>
|
||||
<link rel="stylesheet" href='<%- url %>/vendor/emojify/css/emojify.min.css'>
|
||||
<link rel="stylesheet" href='<%- url %>/css/extra.css'>
|
||||
<link rel="stylesheet" href="<%- url %>/css/site.css">
|
||||
<link rel="stylesheet" href="<%- url %>/css/slide.css">
|
||||
|
||||
|
@ -26,8 +43,6 @@
|
|||
<script>
|
||||
document.write( '<link rel="stylesheet" href="<%- url %>/vendor/reveal.js/css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
|
||||
</script>
|
||||
<script src="<%- url %>/vendor/jquery/dist/jquery.min.js"></script>
|
||||
<script src="<%- url %>/vendor/velocity/velocity.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
@ -35,58 +50,56 @@
|
|||
<div class="slides"><%- slides %></div>
|
||||
</div>
|
||||
|
||||
<script type="text/x-mathjax-config">
|
||||
MathJax.Hub.Config({ messageStyle: "none", skipStartupTypeset: true ,tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']], processEscapes: true }});
|
||||
</script>
|
||||
<% if(useCDN) { %>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
||||
<script src="//cdn.jsdelivr.net/velocity/1.2.3/velocity.min.js" defer></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-yaml/3.6.1/js-yaml.min.js" defer></script>
|
||||
<script type="text/javascript" src="//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML" defer></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment-with-locales.min.js" defer></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/6.0.0/mermaid.min.js" defer></script>
|
||||
<% } else { %>
|
||||
<script src="<%- url %>/vendor/jquery/dist/jquery.min.js"></script>
|
||||
<script src="<%- url %>/vendor/velocity/velocity.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/js-yaml/dist/js-yaml.min.js" defer></script>
|
||||
<script type="text/javascript" src="<%- url %>/vendor/MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML" defer></script>
|
||||
<script src="<%- url %>/vendor/moment/min/moment-with-locales.js" defer></script>
|
||||
<script src="<%- url %>/vendor/mermaid/dist/mermaid.min.js" defer></script>
|
||||
<% } %>
|
||||
<script src="<%- url %>/vendor/reveal.js/lib/js/head.min.js"></script>
|
||||
<script src="<%- url %>/vendor/reveal.js/js/reveal.js"></script>
|
||||
<script src="<%- url %>/vendor/string/dist/string.min.js"></script>
|
||||
<script src="<%- url %>/vendor/xss/dist/xss.min.js"></script>
|
||||
<script src="<%- url %>/js/render.js"></script>
|
||||
|
||||
<script>
|
||||
if (typeof mixpanel !== 'undefined') mixpanel.track("enter slide");
|
||||
|
||||
var body = $(".slides").html();
|
||||
$(".slides").html(S(body).unescapeHTML().s);
|
||||
|
||||
function extend() {
|
||||
var target = {};
|
||||
for (var i = 0; i < arguments.length; i++) {
|
||||
var source = arguments[i];
|
||||
for (var key in source) {
|
||||
if (source.hasOwnProperty(key)) {
|
||||
target[key] = source[key];
|
||||
}
|
||||
}
|
||||
}
|
||||
return target;
|
||||
}
|
||||
|
||||
// Optional libraries used to extend on reveal.js
|
||||
var deps = [
|
||||
{ src: '<%- url %>/vendor/reveal.js/lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
||||
{ src: '<%- url %>/vendor/reveal.js/plugin/markdown/marked.js', condition: function() { return !!document.querySelector('[data-markdown]'); } },
|
||||
{ src: '<%- url %>/js/reveal-markdown.js', condition: function() { return !!document.querySelector('[data-markdown]'); } },
|
||||
{ src: '<%- url %>/vendor/reveal.js/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
|
||||
{ src: '<%- url %>/vendor/reveal.js/plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } },
|
||||
{ src: '<%- url %>/vendor/reveal.js/plugin/math/math.js', async: true }
|
||||
];
|
||||
|
||||
// default options to init reveal.js
|
||||
var defaultOptions = {
|
||||
controls: true,
|
||||
progress: true,
|
||||
history: true,
|
||||
center: true,
|
||||
transition: 'slide',
|
||||
dependencies: deps
|
||||
};
|
||||
|
||||
// options from URL query string
|
||||
var queryOptions = Reveal.getQueryHash() || {};
|
||||
|
||||
var options = <%- options %>;
|
||||
options = extend(defaultOptions, options, queryOptions);
|
||||
Reveal.initialize(options);
|
||||
</script>
|
||||
<script src="<%- url %>/vendor/xss/dist/xss.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it/dist/markdown-it.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-abbr/dist/markdown-it-abbr.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-footnote/dist/markdown-it-footnote.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-deflist/dist/markdown-it-deflist.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-mark/dist/markdown-it-mark.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-ins/dist/markdown-it-ins.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-sub/dist/markdown-it-sub.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-sup/dist/markdown-it-sup.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-container/dist/markdown-it-container.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-mathjax.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-regexp.js" defer></script>
|
||||
<script src="<%- url %>/vendor/markdown-it-imsize.js" defer></script>
|
||||
<script src="<%- url %>/vendor/gist-embed.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/string/dist/string.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/highlightjs/highlight.pack.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/js-cookie/src/js.cookie.js" defer></script>
|
||||
<script src="<%- url %>/vendor/emojify/js/emojify.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/raphael/raphael.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/lodash/dist/lodash.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/sequence-diagrams/sequence-diagram-min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/flowchart/release/flowchart.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/viz.js/viz.js" defer></script>
|
||||
<script src="<%- url %>/vendor/pdfobject/pdfobject.min.js" defer></script>
|
||||
<script src="<%- url %>/vendor/md-toc.js" defer></script>
|
||||
<script src="<%- url %>/js/common.js" defer></script>
|
||||
<script src="<%- url %>/js/extra.js" defer></script>
|
||||
<script src="<%- url %>/js/render.js" defer></script>
|
||||
<script src="<%- url %>/js/slide.js" defer></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
Loading…
Reference in New Issue