Browse Source

Demo: Added IE8 support. Just for fun

pull/14/head
Vitaly Puzrin 10 years ago
parent
commit
00aa9a9a53
  1. 16
      demo/assets/index.css
  2. 17
      demo/assets/index.js
  3. 16
      demo/index.html
  4. 20
      demo/index.jade

16
demo/assets/index.css

@ -127,3 +127,19 @@ body {
padding: 4px 50px 2px;
text-align: center;
}
.form-inline .radio,
.form-inline .checkbox {
display: inline-block;
margin-bottom: 0;
margin-top: 0;
}
.form-inline .form-group {
display: inline-block;
margin-bottom: 0;
vertical-align: middle;
}
.form-inline .form-control {
display: inline-block;
vertical-align: middle;
width: auto;
}

17
demo/assets/index.js

@ -1,7 +1,7 @@
(function () {
'use strict';
var mdHtml, mdSrc, permalink, scrollMap;
var mdHtml, mdSrc, permalink, scrollMap, escapeHtml;
var defaults = {
html: false, // Enable HTML tags in source
@ -18,7 +18,7 @@
};
defaults.highlight = function (str, lang) {
if (!defaults._highlight) { return ''; }
if (!defaults._highlight || !window.hljs) { return ''; }
var hljs = window.hljs;
if (lang && hljs.getLanguage(lang)) {
@ -92,16 +92,17 @@
function updateResult() {
var source = $('.source').val(),
dump;
out;
// Update only active view to avoid slowdowns
// (debug & src view with highlighting are a bit slow)
if (defaults._view === 'src') {
$('.result-src-content').html(window.hljs.highlight('html', mdSrc.render(source)).value);
out = mdSrc.render(source);
$('.result-src-content').html(window.hljs ? window.hljs.highlight('html', out).value : escapeHtml(out));
} else if (defaults._view === 'debug') {
dump = JSON.stringify(mdSrc.parse(source, { references: {} }), null, 2);
$('.result-debug-content').html(window.hljs.highlight('json', dump).value);
out = JSON.stringify(mdSrc.parse(source, { references: {} }), null, 2);
$('.result-debug-content').html(window.hljs ? window.hljs.highlight('json', out).value : escapeHtml(out));
} else { /*defaults._view === 'html'*/
$('.result-html').html(mdHtml.render(source));
@ -212,10 +213,14 @@
}
$(function() {
escapeHtml = window.Remarkable.utils.escapeHtml;
// highlight snippet
if (window.hljs) {
$('pre.code-sample code').each(function(i, block) {
window.hljs.highlightBlock(block);
});
}
// Restore content if opened by permalink
if (location.hash && /^(#md=|#md64=)/.test(location.hash)) {

16
demo/index.html

@ -3,15 +3,23 @@
<head>
<title>Remarkable demo</title>
<meta charset="UTF-8">
<script src="https://cdn.jsdelivr.net/jquery/2.1.1/jquery.min.js"></script>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.0.5/es5-shim.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/lodash/2.4.1/lodash.js"></script>
<script src="https://cdn.jsdelivr.net/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bootstrap/3.2.0/css/bootstrap.css">
<script src="https://cdn.jsdelivr.net/highlight.js/8.2/highlight.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/highlight.js/8.2/styles/solarized_light.css">
<script src="../dist/remarkable.min.js"></script>
<script src="https://cdn.jsdelivr.net/highlight.js/8.4.0/highlight.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/highlight.js/8.4.0/styles/solarized_light.min.css">
<script src="../dist/remarkable.js"></script>
<link rel="stylesheet" href="./assets/index.css">
<script src="./assets/index.js"></script>
<!-- Ancient IE support - load shiv & kill broken highlighter--><!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script>window.hljs = null;</script>
<![endif]-->
<!-- GA counter-->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

20
demo/index.jade

@ -3,22 +3,32 @@ html
head
title Remarkable demo
meta(charset='UTF-8')
meta(http-equiv='X-UA-Compatible' content='IE=edge')
meta(name='viewport' content='width=device-width, initial-scale=1')
script(src='https://cdn.jsdelivr.net/jquery/2.1.1/jquery.min.js')
script(src='https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.0.5/es5-shim.min.js')
script(src='https://cdn.jsdelivr.net/jquery/1.11.1/jquery.min.js')
script(src='https://cdn.jsdelivr.net/lodash/2.4.1/lodash.js')
script(src='https://cdn.jsdelivr.net/bootstrap/3.2.0/js/bootstrap.min.js')
link(rel='stylesheet' href='https://cdn.jsdelivr.net/bootstrap/3.2.0/css/bootstrap.css')
script(src='https://cdn.jsdelivr.net/highlight.js/8.2/highlight.min.js')
link(rel='stylesheet' href='https://cdn.jsdelivr.net/highlight.js/8.2/styles/solarized_light.css')
script(src='https://cdn.jsdelivr.net/highlight.js/8.4.0/highlight.min.js')
link(rel='stylesheet' href='https://cdn.jsdelivr.net/highlight.js/8.4.0/styles/solarized_light.min.css')
script(src='../dist/remarkable.min.js')
script(src='../dist/remarkable.js')
link(rel='stylesheet' href='./assets/index.css')
script(src='./assets/index.js')
//- GA counter
// Ancient IE support - load shiv & kill broken highlighter
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script>window.hljs = null;</script>
<![endif]-->
// GA counter
script.
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

Loading…
Cancel
Save