dany/antd-web-apps
1
0
Fork 0
mirror of https://github.com/lxsang/antd-web-apps synced 2025-04-19 01:56:44 +02:00
Code Issues Projects Releases Wiki Activity

support comments in odc

Browse Source
This commit is contained in:
lxsang 2020-09-22 17:58:37 +02:00
parent 1e5f2e7fee
commit 25e75badc1
4 changed files with 126 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
doc/assets/style.css
View File

@ -1,4 +1,5 @@
html,body{ html,
body {
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: "Ubuntu"; font-family: "Ubuntu";
@ -8,7 +9,7 @@ html,body{
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
} }
#top{ #top {
background-color: #2c2c2c; background-color: #2c2c2c;
color: white; color: white;
font-weight: bold; font-weight: bold;
@ -17,79 +18,80 @@ html,body{
height: 30px; height: 30px;
} }
#bottom{ #bottom {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
height: 20px; height: 20px;
text-align: center; text-align: center;
color:#878887; color: #878887;
background-color: white; background-color: white;
font-size: 13px; font-size: 13px;
width: 100%; width: 100%;
padding:5px; padding: 5px;
border-top: 1px solid #878887; border-top: 1px solid #878887;
} }
#cover{ #cover {
height: calc(100% - 50px); height: calc(100% - 50px);
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
} }
#navbar{ #navbar {
margin:0 auto; margin: 0 auto;
max-width: 80%; max-width: 80%;
display: flex; display: flex;
justify-content:flex-end; justify-content: flex-end;
flex-direction: row; flex-direction: row;
} }
#book{ #book {
margin:0 auto; margin: 0 auto;
max-width: 80%; max-width: 80%;
max-height: 100%; max-height: 100%;
display: block; display: block;
justify-content:flex-end; justify-content: flex-end;
flex-direction: row; flex-direction: row;
text-align: justify; text-align: justify;
height: 100%; height: 100%;
} }
div.doc-name { div.doc-name {
text-align: left; text-align: left;
padding-top:3px; padding-top: 3px;
} }
div.doc-name a { div.doc-name a {
text-decoration: none; text-decoration: none;
color: #c9c9c9; color: #c9c9c9;
} }
a.x-link, a.x-link:hover { a.x-link,
a.x-link:hover {
text-decoration: none; text-decoration: none;
color: #c9c9c9; color: #c9c9c9;
padding-left: 15px; padding-left: 15px;
padding-top: 7px; padding-top: 7px;
} }
a.x-link::before{ a.x-link::before {
content: "\f08e"; content: "\f08e";
color:#c9c9c9; color: #c9c9c9;
width:20px; width: 20px;
height: 25px; height: 25px;
font-family: "FontAwesome"; font-family: "FontAwesome";
font-size: 15px; font-size: 15px;
} }
div.doc-name a::before{ div.doc-name a::before {
/* padding-top:13px; */ /* padding-top:13px; */
content: "\f015"; content: "\f015";
color:#c9c9c9; color: #c9c9c9;
width:20px; width: 20px;
height: 25px; height: 25px;
font-family: "FontAwesome"; font-family: "FontAwesome";
font-size: 18px; font-size: 18px;
} }
input.search-box{ input.search-box {
outline: none; outline: none;
border: 0; border: 0;
flex:1; flex: 1;
padding:0; padding: 0;
margin:0; margin: 0;
margin-left: 10px; margin-left: 10px;
/* padding-top:13px; */ /* padding-top:13px; */
height: 25px; height: 25px;
@ -100,12 +102,12 @@ input.search-box{
line-height: 0.5; line-height: 0.5;
color: #878887; color: #878887;
} }
div.search-icon:before{ div.search-icon:before {
/* padding-top:13px; */ /* padding-top:13px; */
content: "\f002"; content: "\f002";
color:#878887; color: #878887;
display: block; display: block;
width:20px; width: 20px;
height: 25px; height: 25px;
font-family: "FontAwesome"; font-family: "FontAwesome";
font-size: 18px; font-size: 18px;
@ -165,7 +167,7 @@ div.doc-toc .caret-down::before {
font-family: "FontAwesome"; font-family: "FontAwesome";
margin-right: 5px; margin-right: 5px;
} }
div.doc-toc .active { div.doc-toc .active {
display: block; display: block;
padding-left: 20px; padding-left: 20px;
} }
@ -182,12 +184,13 @@ div.doc-content {
} }
div.pagenav { div.pagenav {
display: flex; display: flex;
justify-content:flex-end; justify-content: flex-end;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
} }
div.pagenav a.go_next, div.pagenav a.go_prev { div.pagenav a.go_next,
div.pagenav a.go_prev {
display: block; display: block;
flex: 1; flex: 1;
text-decoration: none; text-decoration: none;
@ -199,13 +202,12 @@ div.pagenav a.go_next, div.pagenav a.go_prev {
padding-bottom: 3px; padding-bottom: 3px;
margin-bottom: 10px; 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; background-color: #e6e8e8;
} }
div.pagenav a.go_next div.pagenav a.go_next {
{
padding-right: 5px; padding-right: 5px;
text-align: center; text-align: center;
} }
@ -253,7 +255,7 @@ div.md-content p.result-content span.pattern {
padding-right: 3px; padding-right: 3px;
border-radius: 2px; border-radius: 2px;
} }
div.md-content p.result-header a::before{ div.md-content p.result-header a::before {
content: "\f002"; content: "\f002";
color: #333f67; color: #333f67;
display: inline-block; display: inline-block;
@ -264,7 +266,7 @@ div.md-content p.result-header a::before{
padding-left: 10px; padding-left: 10px;
} */ } */
#renderer img { #renderer img {
max-width:100%; max-width: 100%;
display: block; display: block;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
@ -275,7 +277,7 @@ a {
text-decoration: none; text-decoration: none;
} }
a:hover{ a:hover {
text-decoration: underline; text-decoration: underline;
} }
@ -284,27 +286,39 @@ form.search-form {
} }
td.hljs-ln-numbers { td.hljs-ln-numbers {
-webkit-touch-callout: none; -webkit-touch-callout: none;
-webkit-user-select: none; -webkit-user-select: none;
-khtml-user-select: none; -khtml-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
text-align: center; text-align: center;
color: #ccc; color: #ccc;
vertical-align: top; vertical-align: top;
font-size: 13; font-size: 13;
/* your custom style here */ /* your custom style here */
} }
/* for block of code */ /* for block of code */
.hljs-ln td.hljs-ln-code { .hljs-ln td.hljs-ln-code {
padding-left: 10px; padding-left: 10px;
} }
model-viewer{ model-viewer {
/*border: 1px solid #333f67;*/ /*border: 1px solid #333f67;*/
width: 100%; width: 100%;
height: 350px; 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;
}

21
doc/controllers/doccontroller.lua
View File

@ -9,7 +9,8 @@ local pre_process_md = function(str, obj)
local content = str local content = str
for capture in str:gmatch("(%[%[@book:image:[^\n%]]*%]%])") do for capture in str:gmatch("(%[%[@book:image:[^\n%]]*%]%])") do
local apath = capture:match("%[%[@book:image:([^\n%]]*)%]%]") local apath = capture:match("%[%[@book:image:([^\n%]]*)%]%]")
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-", "%%-") local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-",
"%%-")
if apath then if apath then
apath = apath:gsub(" ", "%%%%20") apath = apath:gsub(" ", "%%%%20")
print(apath) print(apath)
@ -27,9 +28,10 @@ local post_process_md = function(str, obj)
-- 3D model -- 3D model
for capture in str:gmatch("(%[%[@book:3dmodel:[^\n%]]*%]%])") do for capture in str:gmatch("(%[%[@book:3dmodel:[^\n%]]*%]%])") do
local apath = capture:match("%[%[@book:3dmodel:([^\n%]]*)%]%]") local apath = capture:match("%[%[@book:3dmodel:([^\n%]]*)%]%]")
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-", "%%-") local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-",
"%%-")
if apath then if apath then
--apath = utils.urlencode(apath):gsub("%%", "%%%%") -- apath = utils.urlencode(apath):gsub("%%", "%%%%")
apath = apath:gsub(" ", "%%20") apath = apath:gsub(" ", "%%20")
content = str:gsub(pattern, content = str:gsub(pattern,
"<model-viewer src=\"" .. HTTP_ROOT .. "/" .. "<model-viewer src=\"" .. HTTP_ROOT .. "/" ..
@ -41,12 +43,14 @@ local post_process_md = function(str, obj)
-- Youtube video -- Youtube video
for capture in str:gmatch("(%[%[youtube:[^\n%]]*%]%])") do for capture in str:gmatch("(%[%[youtube:[^\n%]]*%]%])") do
local apath = capture:match("%[%[youtube:([^\n%]]*)%]%]") local apath = capture:match("%[%[youtube:([^\n%]]*)%]%]")
local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-", "%%-") local pattern = capture:gsub("%[", "%%["):gsub("%]", "%%]"):gsub("%-",
"%%-")
if apath then if apath then
content = content:gsub(pattern, 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 end
return content, has_model return content, has_model
end end
@ -146,6 +150,11 @@ function DocController:index(...)
if p then if p then
toc.cpath = p toc.cpath = p
path = getpath(p, self) 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
end end
else else

13
doc/views/default/index/index.ls
View File

@ -92,6 +92,19 @@
echo(data) echo(data)
?> ?>
</div> </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"> <div class = "pagenav">
<?lua <?lua
if prev_entry then if prev_entry then

34
doc/views/default/layout.ls
View File

@ -2,6 +2,7 @@
local tocdata = __main__:get("toc") local tocdata = __main__:get("toc")
local elinks = __main__:get("elinks") local elinks = __main__:get("elinks")
local has_3d = __main__:get("has_3d") local has_3d = __main__:get("has_3d")
local url = __main__:get("url")
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
@ -14,6 +15,7 @@ local has_3d = __main__:get("has_3d")
rel="stylesheet" rel="stylesheet"
type="text/css" type="text/css"
href="<?=HTTP_ROOT?>/rst/katex/katex.min.css" /> href="<?=HTTP_ROOT?>/rst/katex/katex.min.css" />
<script src="<?=HTTP_ROOT?>/rst/gscripts/jquery-3.2.1.min.js"> </script>
<?lua <?lua
if has_3d then if has_3d then
?> ?>
@ -28,7 +30,19 @@ local has_3d = __main__:get("has_3d")
<script <script
src="<?=HTTP_ROOT?>/rst/hljs/highlightjs-line-numbers.min.js" src="<?=HTTP_ROOT?>/rst/hljs/highlightjs-line-numbers.min.js"
></script> ></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> <script>hljs.initHighlightingOnLoad();</script>
<?lua
end
?>
<script <script
src="<?=HTTP_ROOT?>/rst/katex/katex.min.js" src="<?=HTTP_ROOT?>/rst/katex/katex.min.js"
></script> ></script>
@ -128,7 +142,27 @@ local has_3d = __main__:get("has_3d")
if( val === "" || val == "\n") return false; if( val === "" || val == "\n") return false;
return true; 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> </script>
</body> </body>
</html> </html>