mirror of https://github.com/jlelse/teleposter
Improve HTML
This commit is contained in:
parent
9857315274
commit
3946d21e68
|
@ -1,113 +1,118 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/summernote-lite.css"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<style>
|
||||
* {
|
||||
max-width: 100% !important;
|
||||
height: auto;
|
||||
word-break: break-all;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/summernote-lite.css" rel="stylesheet">
|
||||
<style>
|
||||
* {
|
||||
max-width: 100% !important;
|
||||
height: auto;
|
||||
word-break: break-all;
|
||||
word-break: break-word;
|
||||
}
|
||||
#summernote {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#summernote {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.note-editor {
|
||||
border: none !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
.note-editor {
|
||||
border: none !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="summernote"></div>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote-lite.min.js"></script>
|
||||
<script>
|
||||
function domToNode(domNode) {
|
||||
if (domNode.nodeType == domNode.TEXT_NODE) {
|
||||
return domNode.data;
|
||||
}
|
||||
if (domNode.nodeType != domNode.ELEMENT_NODE) {
|
||||
return false;
|
||||
}
|
||||
var nodeElement = {};
|
||||
nodeElement.tag = domNode.tagName.toLowerCase();
|
||||
for (var i = 0; i < domNode.attributes.length; i++) {
|
||||
var attr = domNode.attributes[i];
|
||||
if (attr.name == "href" || attr.name == "src") {
|
||||
if (!nodeElement.attrs) {
|
||||
nodeElement.attrs = {};
|
||||
}
|
||||
nodeElement.attrs[attr.name] = attr.value;
|
||||
}
|
||||
}
|
||||
if (domNode.childNodes.length > 0) {
|
||||
nodeElement.children = [];
|
||||
for (var ii = 0; ii < domNode.childNodes.length; ii++) {
|
||||
var child = domNode.childNodes[ii];
|
||||
nodeElement.children.push(domToNode(child));
|
||||
}
|
||||
}
|
||||
return nodeElement;
|
||||
}
|
||||
|
||||
<body>
|
||||
<div id="summernote"></div>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote-lite.min.js"></script>
|
||||
<script>
|
||||
function domToNode(domNode) {
|
||||
if (domNode.nodeType == domNode.TEXT_NODE) {
|
||||
return domNode.data;
|
||||
}
|
||||
if (domNode.nodeType != domNode.ELEMENT_NODE) {
|
||||
return false;
|
||||
}
|
||||
var nodeElement = {};
|
||||
nodeElement.tag = domNode.tagName.toLowerCase();
|
||||
for (var i = 0; i < domNode.attributes.length; i++) {
|
||||
var attr = domNode.attributes[i];
|
||||
if (attr.name == 'href' || attr.name == 'src') {
|
||||
if (!nodeElement.attrs) {
|
||||
nodeElement.attrs = {};
|
||||
}
|
||||
nodeElement.attrs[attr.name] = attr.value;
|
||||
}
|
||||
}
|
||||
if (domNode.childNodes.length > 0) {
|
||||
nodeElement.children = [];
|
||||
for (var ii = 0; ii < domNode.childNodes.length; ii++) {
|
||||
var child = domNode.childNodes[ii];
|
||||
nodeElement.children.push(domToNode(child));
|
||||
}
|
||||
}
|
||||
return nodeElement;
|
||||
}
|
||||
function getNodeJson() {
|
||||
window.android.getText(
|
||||
JSON.stringify(
|
||||
domToNode(document.getElementsByClassName("note-editable")[0])
|
||||
.children
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
function getNodeJson() {
|
||||
window.android.getText(JSON.stringify(domToNode(document.getElementsByClassName('note-editable')[0]).children));
|
||||
}
|
||||
function uploadImage(file) {
|
||||
data = new FormData();
|
||||
data.append("FileUpload", file);
|
||||
$.ajax({
|
||||
data: data,
|
||||
type: "POST",
|
||||
url: "https://telegra.ph/upload",
|
||||
cache: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
success: function(data) {
|
||||
if (data) {
|
||||
$("#summernote").summernote("insertImage", data[0].src);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function uploadImage(file) {
|
||||
data = new FormData();
|
||||
data.append("FileUpload", file);
|
||||
$.ajax({
|
||||
data: data,
|
||||
type: "POST",
|
||||
url: "https://telegra.ph/upload",
|
||||
cache: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
success: function (data) {
|
||||
if (data) {
|
||||
$('#summernote').summernote('insertImage', data[0].src);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
$(document).ready(function() {
|
||||
$("#summernote").summernote({
|
||||
focus: true,
|
||||
placeholder: "Start writing...",
|
||||
styleTags: ["p", "h3", "h4", "blockquote", "pre"],
|
||||
toolbar: [
|
||||
["style", ["style", "bold", "italic", "underline", "clear"]],
|
||||
["para", ["ul", "ol"]],
|
||||
["insert", ["link", "picture", "hr"]],
|
||||
["history", ["undo", "redo"]],
|
||||
["other", ["codeview"]]
|
||||
],
|
||||
callbacks: {
|
||||
onInit: function(e) {
|
||||
$("#summernote").summernote("fullscreen.toggle");
|
||||
},
|
||||
onImageUpload: function(files) {
|
||||
uploadImage(files[0]);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
$('#summernote').summernote({
|
||||
height: 1200,
|
||||
focus: true,
|
||||
placeholder: 'Start writing...',
|
||||
styleTags: ['p', 'h3', 'h4', 'blockquote', 'pre'],
|
||||
toolbar: [
|
||||
['style', ['style', 'bold', 'italic', 'underline', 'clear']],
|
||||
['para', ['ul', 'ol']],
|
||||
['insert', ['link', 'picture', 'hr']],
|
||||
['history', ['undo', 'redo']],
|
||||
['other', ['codeview']]
|
||||
],
|
||||
callbacks: {
|
||||
onInit: function (e) {
|
||||
$("#summernote").summernote("fullscreen.toggle");
|
||||
},
|
||||
onImageUpload: function (files) {
|
||||
uploadImage(files[0]);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function setContent(content) {
|
||||
$('#summernote').summernote('code', content);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
function setContent(content) {
|
||||
$("#summernote").summernote("code", content);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,58 +1,60 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.min.css"
|
||||
/>
|
||||
<style>
|
||||
* {
|
||||
max-width: 100% !important;
|
||||
height: auto;
|
||||
word-break: break-all;
|
||||
word-break: break-word;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main role="main" class="container">
|
||||
<div id="viewerTitle" class="mt-3"></div>
|
||||
<div id="viewerAuthor"></div>
|
||||
<div id="viewerViews"></div>
|
||||
<div id="viewerContent"></div>
|
||||
</main>
|
||||
<script>
|
||||
function setTitle(title) {
|
||||
document.getElementById("viewerTitle").innerHTML =
|
||||
"<h1>" + title + "</h1>";
|
||||
}
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/css/bootstrap.min.css">
|
||||
<style>
|
||||
* {
|
||||
max-width: 100% !important;
|
||||
height: auto;
|
||||
word-break: break-all;
|
||||
word-break: break-word;
|
||||
}
|
||||
function setAuthor(author, url) {
|
||||
var viewerAuthor = document.getElementById("viewerAuthor");
|
||||
if (author && url && author.length > 0 && url.length > 0)
|
||||
viewerAuthor.innerHTML =
|
||||
'By <a href="' + url + '">' + author + "</a><br>";
|
||||
else if (author && author.length > 0)
|
||||
viewerAuthor.innerHTML = "By " + author + "<br>";
|
||||
else if (url && url.length > 0)
|
||||
viewerAuthor.innerHTML =
|
||||
'By <a href="' + url + '"><i>Author</i></a><br>';
|
||||
else viewerAuthor.innerHTML = "";
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
function setViews(views) {
|
||||
document.getElementById("viewerViews").innerHTML =
|
||||
views + " times viewed<br><br>";
|
||||
}
|
||||
|
||||
<body>
|
||||
<main role="main" class="container">
|
||||
<div id="viewerTitle" class="mt-3"></div>
|
||||
<div id="viewerAuthor"></div>
|
||||
<div id="viewerViews"></div>
|
||||
<div id="viewerContent"></div>
|
||||
</main>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
<script>
|
||||
function setDescription(description) {
|
||||
document.getElementById("viewerContent").innerHTML = description;
|
||||
}
|
||||
|
||||
function setTitle(title) {
|
||||
$('#viewerTitle').html('<h1>' + title + '</h1>');
|
||||
}
|
||||
|
||||
function setAuthor(author, url) {
|
||||
if (author && url && author.length > 0 && url.length > 0) $('#viewerAuthor').html('By <a href="' + url + '">' + author + '</a><br>');
|
||||
else if (author && author.length > 0) $('#viewerAuthor').html('By ' + author + '<br>');
|
||||
else if (url && url.length > 0) $('#viewerAuthor').html('By <a href="' + url + '"><i>Author</i></a><br>');
|
||||
else $('#viewerAuthor').html('');
|
||||
}
|
||||
|
||||
function setViews(views) {
|
||||
$('#viewerViews').html(views + ' times viewed<br><br>');
|
||||
}
|
||||
|
||||
function setDescription(description) {
|
||||
$('#viewerContent').html(description);
|
||||
}
|
||||
|
||||
function setContent(content) {
|
||||
$('#viewerContent').html(content);
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
function setContent(content) {
|
||||
document.getElementById("viewerContent").innerHTML = content;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue