mirror of
https://github.com/lxsang/antd-web-apps
synced 2024-11-20 02:18:20 +01:00
support comments in odc
This commit is contained in:
lxsang
parent
1e5f2e7fee
commit
25e75badc1
@ -1,4 +1,5 @@
|
||||
html,body{
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "Ubuntu";
|
||||
@ -8,7 +9,7 @@ html,body{
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
#top{
|
||||
#top {
|
||||
background-color: #2c2c2c;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
@ -17,79 +18,80 @@ html,body{
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
#bottom{
|
||||
#bottom {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
color:#878887;
|
||||
color: #878887;
|
||||
background-color: white;
|
||||
font-size: 13px;
|
||||
width: 100%;
|
||||
padding:5px;
|
||||
padding: 5px;
|
||||
border-top: 1px solid #878887;
|
||||
}
|
||||
|
||||
#cover{
|
||||
#cover {
|
||||
height: calc(100% - 50px);
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#navbar{
|
||||
margin:0 auto;
|
||||
#navbar {
|
||||
margin: 0 auto;
|
||||
max-width: 80%;
|
||||
display: flex;
|
||||
justify-content:flex-end;
|
||||
justify-content: flex-end;
|
||||
flex-direction: row;
|
||||
}
|
||||
#book{
|
||||
margin:0 auto;
|
||||
#book {
|
||||
margin: 0 auto;
|
||||
max-width: 80%;
|
||||
max-height: 100%;
|
||||
display: block;
|
||||
justify-content:flex-end;
|
||||
justify-content: flex-end;
|
||||
flex-direction: row;
|
||||
text-align: justify;
|
||||
height: 100%;
|
||||
}
|
||||
div.doc-name {
|
||||
text-align: left;
|
||||
padding-top:3px;
|
||||
padding-top: 3px;
|
||||
}
|
||||
div.doc-name a {
|
||||
text-decoration: none;
|
||||
color: #c9c9c9;
|
||||
}
|
||||
|
||||
a.x-link, a.x-link:hover {
|
||||
a.x-link,
|
||||
a.x-link:hover {
|
||||
text-decoration: none;
|
||||
color: #c9c9c9;
|
||||
padding-left: 15px;
|
||||
padding-top: 7px;
|
||||
}
|
||||
a.x-link::before{
|
||||
a.x-link::before {
|
||||
content: "\f08e";
|
||||
color:#c9c9c9;
|
||||
width:20px;
|
||||
color: #c9c9c9;
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
font-family: "FontAwesome";
|
||||
font-size: 15px;
|
||||
}
|
||||
div.doc-name a::before{
|
||||
div.doc-name a::before {
|
||||
/* padding-top:13px; */
|
||||
content: "\f015";
|
||||
color:#c9c9c9;
|
||||
width:20px;
|
||||
color: #c9c9c9;
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
font-family: "FontAwesome";
|
||||
font-size: 18px;
|
||||
}
|
||||
input.search-box{
|
||||
input.search-box {
|
||||
outline: none;
|
||||
border: 0;
|
||||
flex:1;
|
||||
padding:0;
|
||||
margin:0;
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-left: 10px;
|
||||
/* padding-top:13px; */
|
||||
height: 25px;
|
||||
@ -100,12 +102,12 @@ input.search-box{
|
||||
line-height: 0.5;
|
||||
color: #878887;
|
||||
}
|
||||
div.search-icon:before{
|
||||
div.search-icon:before {
|
||||
/* padding-top:13px; */
|
||||
content: "\f002";
|
||||
color:#878887;
|
||||
color: #878887;
|
||||
display: block;
|
||||
width:20px;
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
font-family: "FontAwesome";
|
||||
font-size: 18px;
|
||||
@ -165,7 +167,7 @@ div.doc-toc .caret-down::before {
|
||||
font-family: "FontAwesome";
|
||||
margin-right: 5px;
|
||||
}
|
||||
div.doc-toc .active {
|
||||
div.doc-toc .active {
|
||||
display: block;
|
||||
padding-left: 20px;
|
||||
}
|
||||
@ -182,12 +184,13 @@ div.doc-content {
|
||||
}
|
||||
div.pagenav {
|
||||
display: flex;
|
||||
justify-content:flex-end;
|
||||
justify-content: flex-end;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div.pagenav a.go_next, div.pagenav a.go_prev {
|
||||
div.pagenav a.go_next,
|
||||
div.pagenav a.go_prev {
|
||||
display: block;
|
||||
flex: 1;
|
||||
text-decoration: none;
|
||||
@ -199,13 +202,12 @@ div.pagenav a.go_next, div.pagenav a.go_prev {
|
||||
padding-bottom: 3px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
div.pagenav a.go_next:hover, div.pagenav a.go_prev:hover
|
||||
{
|
||||
div.pagenav a.go_next:hover,
|
||||
div.pagenav a.go_prev:hover {
|
||||
background-color: #e6e8e8;
|
||||
}
|
||||
|
||||
div.pagenav a.go_next
|
||||
{
|
||||
div.pagenav a.go_next {
|
||||
padding-right: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
@ -253,7 +255,7 @@ div.md-content p.result-content span.pattern {
|
||||
padding-right: 3px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
div.md-content p.result-header a::before{
|
||||
div.md-content p.result-header a::before {
|
||||
content: "\f002";
|
||||
color: #333f67;
|
||||
display: inline-block;
|
||||
@ -264,7 +266,7 @@ div.md-content p.result-header a::before{
|
||||
padding-left: 10px;
|
||||
} */
|
||||
#renderer img {
|
||||
max-width:100%;
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
@ -275,7 +277,7 @@ a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover{
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@ -284,27 +286,39 @@ form.search-form {
|
||||
}
|
||||
|
||||
td.hljs-ln-numbers {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
vertical-align: top;
|
||||
font-size: 13;
|
||||
/* your custom style here */
|
||||
/* your custom style here */
|
||||
}
|
||||
|
||||
/* for block of code */
|
||||
.hljs-ln td.hljs-ln-code {
|
||||
padding-left: 10px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
model-viewer{
|
||||
model-viewer {
|
||||
/*border: 1px solid #333f67;*/
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
.commentsec {
|
||||
padding: 15px;
|
||||
display: block;
|
||||
}
|
||||
.commentsec .comment-header {
|
||||
text-align: center;
|
||||
border-top: 1px dashed #3170b2;
|
||||
color: #3170b2;
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
|
||||
@ -9,7 +9,8 @@ local pre_process_md = function(str, obj)
|
||||
local content = str
|
||||
for capture in str:gmatch("(%[%[@book:image:[^\n%]]*%]%])") do
|
||||
local apath = capture:match("%[%[@book:image:([^\n%]]*)%]%]")
|
||||
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-", "%%-")
|
||||
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-",
|
||||
"%%-")
|
||||
if apath then
|
||||
apath = apath:gsub(" ", "%%%%20")
|
||||
print(apath)
|
||||
@ -27,9 +28,10 @@ local post_process_md = function(str, obj)
|
||||
-- 3D model
|
||||
for capture in str:gmatch("(%[%[@book:3dmodel:[^\n%]]*%]%])") do
|
||||
local apath = capture:match("%[%[@book:3dmodel:([^\n%]]*)%]%]")
|
||||
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-", "%%-")
|
||||
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-",
|
||||
"%%-")
|
||||
if apath then
|
||||
--apath = utils.urlencode(apath):gsub("%%", "%%%%")
|
||||
-- apath = utils.urlencode(apath):gsub("%%", "%%%%")
|
||||
apath = apath:gsub(" ", "%%20")
|
||||
content = str:gsub(pattern,
|
||||
"<model-viewer src=\"" .. HTTP_ROOT .. "/" ..
|
||||
@ -41,12 +43,14 @@ local post_process_md = function(str, obj)
|
||||
-- Youtube video
|
||||
for capture in str:gmatch("(%[%[youtube:[^\n%]]*%]%])") do
|
||||
local apath = capture:match("%[%[youtube:([^\n%]]*)%]%]")
|
||||
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-", "%%-")
|
||||
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-",
|
||||
"%%-")
|
||||
if apath then
|
||||
content = content:gsub(pattern,
|
||||
"<iframe style='width:100%%;height: auto;min-height: 400px;' src=\"https://www.youtube.com/embed/"..apath.."\"> </iframe>")
|
||||
"<iframe style='width:100%%;height: auto;min-height: 400px;' src=\"https://www.youtube.com/embed/" ..
|
||||
apath .. "\"> </iframe>")
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
return content, has_model
|
||||
end
|
||||
@ -146,6 +150,11 @@ function DocController:index(...)
|
||||
if p then
|
||||
toc.cpath = p
|
||||
path = getpath(p, self)
|
||||
if path and ulib.exists(path) then
|
||||
self.template:set("url", HTTP_ROOT .. '/' .. self.name ..
|
||||
'/' ..
|
||||
std.b64encode(toc.cpath):gsub("=", ""))
|
||||
end
|
||||
end
|
||||
end
|
||||
else
|
||||
|
||||
@ -92,6 +92,19 @@
|
||||
echo(data)
|
||||
?>
|
||||
</div>
|
||||
<?lua
|
||||
if url then
|
||||
?>
|
||||
<div class = "commentsec">
|
||||
<h3 class = "comment-header">Comments</h1>
|
||||
<div>
|
||||
The comment editor supports <b>Markdown</b> document format. Your email is necessary to notify you of further updates on the discussion. It will be hidden from the public.
|
||||
</div>
|
||||
<div id="quick_talk_comment_thread"></div>
|
||||
</div>
|
||||
<?lua
|
||||
end
|
||||
?>
|
||||
<div class = "pagenav">
|
||||
<?lua
|
||||
if prev_entry then
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
local tocdata = __main__:get("toc")
|
||||
local elinks = __main__:get("elinks")
|
||||
local has_3d = __main__:get("has_3d")
|
||||
local url = __main__:get("url")
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
@ -14,6 +15,7 @@ local has_3d = __main__:get("has_3d")
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
href="<?=HTTP_ROOT?>/rst/katex/katex.min.css" />
|
||||
<script src="<?=HTTP_ROOT?>/rst/gscripts/jquery-3.2.1.min.js"> </script>
|
||||
<?lua
|
||||
if has_3d then
|
||||
?>
|
||||
@ -28,7 +30,19 @@ local has_3d = __main__:get("has_3d")
|
||||
<script
|
||||
src="<?=HTTP_ROOT?>/rst/hljs/highlightjs-line-numbers.min.js"
|
||||
></script>
|
||||
|
||||
<?lua
|
||||
if url then
|
||||
?>
|
||||
<link rel="stylesheet" type="text/css" href="https://chat.iohub.dev/assets/quicktalk.css" />
|
||||
<script src="https://chat.iohub.dev/assets/quicktalk.js"> </script>
|
||||
<?lua
|
||||
else
|
||||
?>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<?lua
|
||||
end
|
||||
?>
|
||||
<script
|
||||
src="<?=HTTP_ROOT?>/rst/katex/katex.min.js"
|
||||
></script>
|
||||
@ -128,7 +142,27 @@ local has_3d = __main__:get("has_3d")
|
||||
if( val === "" || val == "\n") return false;
|
||||
return true;
|
||||
}
|
||||
<?lua
|
||||
if url then
|
||||
?>
|
||||
var options = {
|
||||
target: "quick_talk_comment_thread",
|
||||
api_uri: "https://chat.iohub.dev/comment",
|
||||
uri: "<?=url?>",
|
||||
onload: function(){
|
||||
renderMathInElement($("#book")[0]);
|
||||
$('pre code').each(function(i, block) {
|
||||
hljs.highlightBlock(block);
|
||||
hljs.lineNumbersBlock(block);
|
||||
});
|
||||
}
|
||||
};
|
||||
new QuickTalk(options);
|
||||
<?lua
|
||||
end
|
||||
?>
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user