Ivan/commento
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

frontend: display options at the bottom on mobile

Browse Source
This commit is contained in:
Adhityaa Chandrasekar 2018-12-20 01:27:55 -05:00
parent 06c71f4e65
commit e4f71fe402
2 changed files with 33 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
frontend/js/commento.js
View File

@ -57,6 +57,7 @@
var ID_APPROVE = "commento-comment-approve-"; var ID_APPROVE = "commento-comment-approve-";
var ID_REMOVE = "commento-comment-remove-"; var ID_REMOVE = "commento-comment-remove-";
var ID_STICKY = "commento-comment-sticky-"; var ID_STICKY = "commento-comment-sticky-";
var ID_CHILDREN = "commento-comment-children-";
var ID_CONTENTS = "commento-comment-contents-"; var ID_CONTENTS = "commento-comment-contents-";
var ID_NAME = "commento-comment-name-"; var ID_NAME = "commento-comment-name-";
var ID_SUBMIT_BUTTON = "commento-submit-button-"; var ID_SUBMIT_BUTTON = "commento-submit-button-";
@ -632,6 +633,7 @@
var cards = create("div"); var cards = create("div");
cur.forEach(function(comment) { cur.forEach(function(comment) {
var mobileView = root.getBoundingClientRect()["width"] < 450;
var commenter = commenters[comment.commenterHex]; var commenter = commenters[comment.commenterHex];
var avatar; var avatar;
var card = create("div"); var card = create("div");
@ -672,10 +674,12 @@
approve.id = ID_APPROVE + comment.commentHex; approve.id = ID_APPROVE + comment.commentHex;
remove.id = ID_REMOVE + comment.commentHex; remove.id = ID_REMOVE + comment.commentHex;
sticky.id = ID_STICKY + comment.commentHex; sticky.id = ID_STICKY + comment.commentHex;
if (children)
children.id = ID_CHILDREN + comment.commentHex;
contents.id = ID_CONTENTS + comment.commentHex; contents.id = ID_CONTENTS + comment.commentHex;
name.id = ID_NAME + comment.commentHex; name.id = ID_NAME + comment.commentHex;
collapse.title = "Collapse"; collapse.title = "Collapse children";
upvote.title = "Upvote"; upvote.title = "Upvote";
downvote.title = "Downvote"; downvote.title = "Downvote";
edit.title = "Edit"; edit.title = "Edit";
@ -724,6 +728,8 @@
classAdd(score, "score"); classAdd(score, "score");
classAdd(body, "body"); classAdd(body, "body");
classAdd(options, "options"); classAdd(options, "options");
if (mobileView)
classAdd(options, "options-mobile");
classAdd(edit, "option-button"); classAdd(edit, "option-button");
classAdd(edit, "option-edit"); classAdd(edit, "option-edit");
classAdd(reply, "option-button"); classAdd(reply, "option-button");
@ -798,11 +804,18 @@
append(subtitle, score); append(subtitle, score);
append(subtitle, timeago); append(subtitle, timeago);
if (!mobileView)
append(header, options); append(header, options);
append(header, avatar); append(header, avatar);
append(header, name); append(header, name);
append(header, subtitle); append(header, subtitle);
append(contents, body); append(contents, body);
if (mobileView) {
append(contents, options);
var optionsClearfix = create("div");
classAdd(optionsClearfix, "options-clearfix");
append(contents, optionsClearfix);
}
if (children) { if (children) {
classAdd(children, "body"); classAdd(children, "body");
@ -949,30 +962,32 @@
global.commentCollapse = function(id) { global.commentCollapse = function(id) {
var contents = $(ID_CONTENTS + id); var children = $(ID_CHILDREN + id);
var button = $(ID_COLLAPSE + id); var button = $(ID_COLLAPSE + id);
classAdd(contents, "hidden"); if (children)
classAdd(children, "hidden");
classRemove(button, "option-collapse"); classRemove(button, "option-collapse");
classAdd(button, "option-uncollapse"); classAdd(button, "option-uncollapse");
button.title = "Expand"; button.title = "Expand children";
onclick(button, global.commentUncollapse, id); onclick(button, global.commentUncollapse, id);
} }
global.commentUncollapse = function(id) { global.commentUncollapse = function(id) {
var contents = $(ID_CONTENTS + id); var children = $(ID_CHILDREN + id);
var button = $(ID_COLLAPSE + id); var button = $(ID_COLLAPSE + id);
classRemove(contents, "hidden"); if (children)
classRemove(children, "hidden");
classRemove(button, "option-uncollapse"); classRemove(button, "option-uncollapse");
classAdd(button, "option-collapse"); classAdd(button, "option-collapse");
button.title = "Collapse"; button.title = "Collapse children";
onclick(button, global.commentCollapse, id); onclick(button, global.commentCollapse, id);
} }

10
frontend/sass/commento.scss
View File

@ -186,6 +186,16 @@
z-index: 2; z-index: 2;
} }
.commento-options-mobile {
margin-right: 12px;
}
.commento-options-clearfix {
height: 38px;
width: 1px;
display: block;
}
.commento-moderation { .commento-moderation {
height: 48px; height: 48px;
} }