2015-05-13 18:30:35 +02:00
<!DOCTYPE html>
< html lang = "en" >
2016-03-23 18:39:41 +01:00
< head >
2015-05-13 18:30:35 +02:00
< meta charset = "UTF-8" >
2016-03-23 18:39:41 +01:00
< title > summernote - external-api< / title >
<!-- include jquery -->
< script src = "//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js" > < / script >
2015-05-13 18:30:35 +02:00
2016-03-23 18:39:41 +01:00
<!-- include libs stylesheets -->
< link rel = "stylesheet" href = "//netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" / >
< script src = "//netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js" > < / script >
< link rel = "stylesheet" href = "//netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css" / >
2015-05-13 18:30:35 +02:00
<!-- include summernote -->
< link rel = "stylesheet" href = "../dist/summernote.css" >
< script type = "text/javascript" src = "../dist/summernote.js" > < / script >
< style >
2016-03-23 18:39:41 +01:00
.container {
position: absolute;
left: 10%;
right: 10%;
top: 10%;
bottom: 10%;
}
.custom-toolbar {
padding: 5px;
}
h1 {
text-align: center;
}
2015-05-13 18:30:35 +02:00
< / style >
< script type = "text/javascript" >
2016-03-23 18:39:41 +01:00
var $summernote;
$(document).ready(function () {
$summernote = $('.summernote');
// init summernote
$summernote.summernote({
height: 300,
toolbar: false
2015-05-13 18:30:35 +02:00
});
2016-03-23 18:39:41 +01:00
$("button").popover({
trigger: 'hover'
});
});
function command() {
$summernote.summernote(arguments[0], arguments[1]);
}
2015-05-13 18:30:35 +02:00
< / script >
2016-03-23 18:39:41 +01:00
< / head >
< body >
< div class = "container" >
< h1 > External API Sample< / h1 >
< div class = "custom-toolbar" >
2015-05-13 18:30:35 +02:00
< div class = "btn-group" role = "group" aria-label = "..." >
2016-03-23 18:39:41 +01:00
< button type = "button" class = "btn btn-default" data-container = "body" data-trigger = "hover" data-placement = "left" data-content = "Sample Content" title = "Sample Button" onclick = "command('justifyLeft')" > Left < / button >
< button type = "button" class = "btn btn-default" onclick = "command('justifyCenter')" > Middle< / button >
< button type = "button" class = "btn btn-default" onclick = "command('justifyRight')" > Right< / button >
2015-05-13 18:30:35 +02:00
< / div >
< div class = "btn-group" role = "group" aria-label = "..." >
2016-03-23 18:39:41 +01:00
< button type = "button" class = "btn btn-default" data-container = "body" data-trigger = "hover" data-placement = "bottom" data-content = "Apply bold style to selected text" title = "Bold (CTRL+B)" onclick = "command('bold')" > < i class = "fa fa-bold" > < / i > Bold < / button >
< button type = "button" class = "btn btn-default" title = "Italic (CTRL+I)" onclick = "command('italic')" > < i class = "fa fa-italic" > < / i > Italic < / button >
< button type = "button" class = "btn btn-default" title = "Underline (CTRL+U)" onclick = "command('underline')" > < i class = "fa fa-underline" > < / i > Underline < / button >
< button type = "button" class = "btn btn-default" title = "Remove Font Style (CTRL+\)" onclick = "command('removeFormat')" style = "color:red;" > < i class = "fa fa-eraser" > < / i > Remove Format < / button >
2015-05-13 18:30:35 +02:00
< / div >
2016-03-23 18:39:41 +01:00
< / div >
< div class = "summernote" > Hello World< / div >
2015-05-13 18:30:35 +02:00
< / div >
2016-03-23 18:39:41 +01:00
< / body >
2015-05-13 18:30:35 +02:00
< / html >
