Fix no reaction case
This commit is contained in:
parent
054971c7de
commit
a5198e9a01
5 changed files with 110 additions and 19 deletions
|
|
@ -57,8 +57,9 @@
|
|||
toggleComments: function(toggleReactionsLink) {
|
||||
if(toggleReactionsLink.hasClass("loading")) { return; }
|
||||
|
||||
if (toggleReactionsLink.hasClass("active")) {
|
||||
if(toggleReactionsLink.hasClass("active")) {
|
||||
this.hideComments(toggleReactionsLink);
|
||||
toggleReactionsLink.parents(".bottom-bar").find(".add-comment-switcher").addClass("hidden");
|
||||
} else {
|
||||
this.showComments(toggleReactionsLink);
|
||||
}
|
||||
|
|
@ -171,7 +172,7 @@
|
|||
var bottomBar = form.closest(".bottom-bar").first();
|
||||
this.addNewComments(bottomBar, data);
|
||||
this.updateCommentCount(bottomBar);
|
||||
this.updateReactionCount(bottomBar);
|
||||
this.increaseReactionCount(bottomBar);
|
||||
this.handleCommentShowing(form, bottomBar);
|
||||
bottomBar.find("time.timeago").timeago();
|
||||
},
|
||||
|
|
@ -193,11 +194,28 @@
|
|||
},
|
||||
|
||||
// Fix for no reactions
|
||||
updateReactionCount: function(bottomBar) {
|
||||
increaseReactionCount: function(bottomBar) {
|
||||
var toggleReactionsLink = bottomBar.find(".show-comments").first();
|
||||
toggleReactionsLink.text(toggleReactionsLink.text().replace(/(\d+)/, function (match) {
|
||||
return parseInt(match, 10) + 1;
|
||||
}));
|
||||
var count = toggleReactionsLink.text().match(/.*(\d+).*/);
|
||||
var text = "";
|
||||
|
||||
// No previous comment
|
||||
if(!count){
|
||||
text = Diaspora.I18n.t("stream.reactions", {count: 1});
|
||||
var parent = toggleReactionsLink.parent();
|
||||
var postGuid = bottomBar.parents(".stream_element").data("guid");
|
||||
|
||||
toggleReactionsLink.remove();
|
||||
toggleReactionsLink = $("<a/>", {"class": "show-comments", "href": Routes.postComments(postGuid) + ".mobile"})
|
||||
.html(text + "<i class='entypo-chevron-up'/>");
|
||||
parent.prepend(toggleReactionsLink);
|
||||
bottomBar.removeClass("inactive").addClass("active");
|
||||
}
|
||||
else {
|
||||
count = parseInt(count, 10) + 1;
|
||||
text = Diaspora.I18n.t("stream.reactions", {count: count});
|
||||
toggleReactionsLink.html(text + "<i class='entypo-chevron-up'/>");
|
||||
}
|
||||
},
|
||||
|
||||
handleCommentShowing: function(form, bottomBar) {
|
||||
|
|
@ -206,8 +224,7 @@
|
|||
this.resetCommentBox(formContainer);
|
||||
var commentActionLink = bottomBar.find("a.comment-action").first();
|
||||
commentActionLink.addClass("inactive");
|
||||
var toggleReactionsLink = bottomBar.find(".show-comments").first();
|
||||
this.showComments(toggleReactionsLink);
|
||||
this.showComments(bottomBar.find(".show-comments").first());
|
||||
},
|
||||
|
||||
resetCommentBox: function(el){
|
||||
|
|
|
|||
|
|
@ -22,6 +22,8 @@
|
|||
position: relative;
|
||||
top: 3px;
|
||||
|
||||
> [class^="entypo"] { margin-left: .5em; }
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
|
|
@ -61,17 +63,17 @@
|
|||
height: 28px;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&.entypo-reshare.active { color: $blue; }
|
||||
|
||||
&.entypo-heart.active { color: $red; }
|
||||
}
|
||||
|
||||
[class^="entypo"]:hover,
|
||||
[class^="entypo"]:active,
|
||||
[class^="entypo"]:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.entypo-reshare.active { color: $blue; }
|
||||
|
||||
.entypo-heart.active { color: $red; }
|
||||
}
|
||||
|
||||
.post-action {
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ module MobileHelper
|
|||
entypo_class = "entypo-chevron-down"
|
||||
end
|
||||
if reactions_count > 0
|
||||
link_to "#{t('reactions', count: reactions_count)} <i class='#{entypo_class}'></i>".html_safe,
|
||||
link_to "#{t('reactions', count: reactions_count)}<i class='#{entypo_class}'></i>".html_safe,
|
||||
post_comments_path(post, format: "mobile"),
|
||||
class: "show-comments #{klass}"
|
||||
else
|
||||
|
|
|
|||
|
|
@ -258,6 +258,11 @@ en:
|
|||
stop_following_confirm: "Stop following #<%= tag %>?"
|
||||
follow_error: "Couldn’t follow #<%= tag %> :("
|
||||
stop_following_error: "Couldn’t stop following #<%= tag %> :("
|
||||
|
||||
reactions:
|
||||
zero: "<%= count%> reactions"
|
||||
one: "<%= count%> reaction"
|
||||
other: "<%= count%> reactions"
|
||||
|
||||
header:
|
||||
home: "Home"
|
||||
|
|
|
|||
|
|
@ -100,4 +100,71 @@ describe("Diaspora.Mobile.Comments", function(){
|
|||
expect(jQuery.ajax).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
describe("increaseReactionCount", function(){
|
||||
beforeEach(function() {
|
||||
spec.loadFixture("aspects_index_mobile_post_with_comments");
|
||||
this.bottomBar = $(".bottom-bar").first();
|
||||
this.toggleReactionsLink = this.bottomBar.find(".show-comments").first();
|
||||
});
|
||||
|
||||
it("Increase reaction count from 1", function(){
|
||||
expect(this.toggleReactionsLink.text().trim()).toBe("5 reactions");
|
||||
Diaspora.Mobile.Comments.increaseReactionCount(this.bottomBar);
|
||||
expect(this.toggleReactionsLink.text().trim()).toBe("6 reactions");
|
||||
});
|
||||
|
||||
it("Creates the reaction link when no reactions", function(){
|
||||
var parent = this.toggleReactionsLink.parent();
|
||||
var postGuid = this.bottomBar.parents(".stream_element").data("guid");
|
||||
this.toggleReactionsLink.remove();
|
||||
parent.prepend($("<span/>", {"class": "show-comments"}).text("No reaction"));
|
||||
|
||||
Diaspora.Mobile.Comments.increaseReactionCount(this.bottomBar);
|
||||
this.toggleReactionsLink = this.bottomBar.find(".show-comments").first();
|
||||
expect(this.toggleReactionsLink.text().trim()).toBe("1 reaction");
|
||||
expect(this.toggleReactionsLink.attr("href")).toBe("/posts/" + postGuid + "/comments.mobile");
|
||||
});
|
||||
});
|
||||
|
||||
describe("bottomBarLazy", function(){
|
||||
beforeEach(function() {
|
||||
spec.loadFixture("aspects_index_mobile_post_with_comments");
|
||||
this.bottomBar = $(".bottom-bar").first();
|
||||
this.bottomBarLazy = Diaspora.Mobile.Comments.bottomBarLazy(this.bottomBar);
|
||||
});
|
||||
|
||||
it("shows and hides the loader", function(){
|
||||
expect(this.bottomBarLazy.loader()).toHaveClass("hidden");
|
||||
this.bottomBarLazy.showLoader();
|
||||
expect(this.bottomBarLazy.loader()).not.toHaveClass("hidden");
|
||||
this.bottomBarLazy.hideLoader();
|
||||
expect(this.bottomBarLazy.loader()).toHaveClass("hidden");
|
||||
});
|
||||
|
||||
it("activates the bottom bar", function(){
|
||||
expect(this.bottomBar).toHaveClass("inactive");
|
||||
expect(this.bottomBar).not.toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink()).not.toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink().find("i")).toHaveClass("entypo-chevron-down");
|
||||
this.bottomBarLazy.activate();
|
||||
expect(this.bottomBar).not.toHaveClass("inactive");
|
||||
expect(this.bottomBar).toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink()).toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink().find("i")).toHaveClass("entypo-chevron-up");
|
||||
});
|
||||
|
||||
it("deactivates the bottom bar", function(){
|
||||
this.bottomBarLazy.activate();
|
||||
expect(this.bottomBar).not.toHaveClass("inactive");
|
||||
expect(this.bottomBar).toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink()).toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink().find("i")).toHaveClass("entypo-chevron-up");
|
||||
this.bottomBarLazy.deactivate();
|
||||
expect(this.bottomBar).toHaveClass("inactive");
|
||||
expect(this.bottomBar).not.toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink()).not.toHaveClass("active");
|
||||
expect(this.bottomBarLazy.getShowCommentsLink().find("i")).toHaveClass("entypo-chevron-down");
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue