notazof
/
yavsc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

do the Quill.js test using the snow theme

main
Paul Schneider 9 years ago
parent f46e3d039c
commit 1af0c929c9
1 changed files with 62 additions and 34 deletions
Show Stats Download Patch File Download Diff File

94
BookAStar/BookAStar.Droid/Assets/snow.html
Unescape Escape View File

@ -1,57 +1,85 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>Snow Theme - Quill</title> <title>Quill</title>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="katex.min.css" /> <link rel="stylesheet" href="quill.snow.css" />
<link rel="stylesheet" href="monokai-sublime.min.css" /> <style>
.standalone-container {
margin: 0;
width: 100%;
}
<link rel="stylesheet" href="quill.snow.css" /> #bubble-container {
height: 100%;
}
<style> #bubble-container div.ql-editor {
.standalone-container { margin-top:3em;
margin: 50px auto; }
width: 720px;
}
#snow-container {
height: 350px;
}
</style>
.hidden {
display: none;
}
</style>
</head> </head>
<body> <body>
<div class="standalone-container"> <div class="standalone-container">
<div id="snow-container"></div> <div id="bubble-container"></div>
</div> </div>
<form><input type="hidden" name="md" id="md" />
<input id="btnSubmit" type="button" value="Valider" class="hidden" />
<script type="text/javascript" src="katex.min.js"></script>
<script type="text/javascript" src="highlight.min.js"></script>
<script type="text/javascript" src="quill.min.js"></script>
</form>
<div id="result"></div>
<script type="text/javascript" src="quill.min.js"></script>
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="showdown.js"></script> <script type="text/javascript" src="showdown.js"></script>
<script type="text/javascript" src="to-markdown.js"></script> <script type="text/javascript" src="to-markdown.js"></script>
<script type="text/javascript" src="md-helpers.js"></script> <script type="text/javascript" src="md-helpers.js"></script>
<script type="text/javascript">
var quill = new Quill('#snow-container', { <script type="text/javascript">
placeholder: 'Compose an epic...', var toolbarOptions = [
['bold', 'italic', 'underline', 'strike'], // toggled buttons
['blockquote', 'code-block'],
[{ 'header': 1 }, { 'header': 2 }], // custom button values
[{ 'list': 'ordered' }, { 'list': 'bullet' }],
[{ 'indent': '-1' }, { 'indent': '+1' }], // outdent/indent
['clean'] // remove formatting button
];
var quill = new Quill('#bubble-container', {
modules: {
toolbar: toolbarOptions
},
placeholder: 'Composez votre texte ...',
theme: 'snow' theme: 'snow'
}); });
function GetMD() { function getMD() {
return markdownize($('#snow-container div.ql-editor').html()) return markdownize($('#bubble-container div.ql-editor').html())
} }
</script> quill.on('text-change', function (delta, oldDelta, source)
{
if (source === "user") {
$('#md').val(getMD());
$('#btnSubmit').removeClass('hidden');
}
});
$( document ).ready(function() {
$('#btnSubmit').on('click', function () {
$.get("hybrid:validate?md=" + encodeURIComponent(getMD()),
function(data,stat,jqXHR) { $('#result').html("Okay") })
})
});
</script>
</body> </body>
</html> </html>

Write Preview
Loading…