summernote
Version:
Super simple WYSIWYG editor
81 lines (68 loc) • 3.12 kB
HTML
<html>
<head>
<title>Examples</title>
<style type="text/css">
body {
margin: 0 auto;
max-width: 800px;
}
.list .item {
display: grid;
grid-template-columns: 200px 1fr 1fr;
height: 30px;
border-bottom: 1px solid #ececec;
padding: 10px;
}
.item.header {
font-weight: bold;
}
</style>
</head>
<body>
<h1>Summernote Examples </h1>
<div class='list'>
<div class='item header'>
<div class='title'>
Title(Link)
</div>
<div class='description'>
Description
</div>
<div class='version'>
Support Version
</div>
</div>
<div class='list-body' id='listBody'></div>
</div>
<script type="text/javascript">
var samples = [
{ title: 'Languages', link : 'lang.html', description: 'Support language setting', support: 'bs3, bs4, lite'},
{ title: 'Record every key stroke', link : 'recordEveryKeyStroke.html', description: 'Support language setting', support: 'bs3, bs4, lite'},
{ title: 'hint-emoji', link : 'hint-emoji.html', description: 'test hint ui ', support: 'bs3, bs4, lite'},
{ title: 'hint-userdefine', link : 'hint-userdefine.html', description: 'test hint userdefine ', support: 'bs3, bs4, lite'},
{ title: 'hint-symbol', link : 'hint-symbols_mathematical-symbols_Greek-letters.html', description: 'test hint symbol ', support: 'bs3, bs4, lite'},
{ title: 'jQuery custom event', link : 'jquery-custom-event.html', description: 'test jQuery custom event ', support: 'bs3, bs4, lite'},
{ title: 'Plugin : Hello', link : 'plugin-hello.html', description: 'Plugin sample - Hello', support: 'bs3, bs4, lite'},
{ title: 'Limited history stack', link : 'history-limit.html', description: 'Limited history stack', support: 'bs3, bs4, lite'},
{ title: 'Mode Switcher', link : 'mode-switcher.html', description: 'Change mode between Default and Air', support: 'bs3, bs4, lite'},
{ title: 'Air Mode', link : 'airmode.html', description: 'run as airmode', support: 'bs3, bs4, lite'},
{ title: 'Air Mode with scroll', link : 'airmode-scroll.html', description: 'run as airmode with scroll', support: 'bs3, bs4, lite'},
{ title: 'External CodeMirror Constructor', link : 'external-codemirror.html', description: 'support external codemirror', support: 'bs3, bs4, lite'},
]
function generate_sample_pages() {
var html = samples.map(it => {
return "<div class='item'>" +
"<div class='title'>" +
"<a href='/examples/"+it.link+"' target='summernote_window'>" + it.title + "</a>" +
"</div>" +
"<div class='description'>" + it.description + "</div>" +
"<div class='version'>" + it.support + "</div>" +
"</div>"
}).join('')
document.getElementById('listBody').innerHTML = html
}
generate_sample_pages();
</script>
</body>
</html>