Commit 0aa453e4 authored by Steffen van Bergerem's avatar Steffen van Bergerem

Merge pull request #6291 from AugierLe42e/change-actions-icons-mobile

Use entypo icons on mobile posts
parents 633d65fe f917757b
......@@ -45,6 +45,7 @@ With the port to Bootstrap 3, app/views/terms/default.haml has a new structure.
* Replace MBP.autogrow with autosize on mobile [#6261](https://github.com/diaspora/diaspora/pull/6261)
* Improve mobile drawer transition [#6233](https://github.com/diaspora/diaspora/pull/6233)
* Remove unused header icons and an unused favicon [#6283](https://github.com/diaspora/diaspora/pull/6283)
* Replace mobile icons for post interactions with Entypo icons [#6291](https://github.com/diaspora/diaspora/pull/6291)
## Bug fixes
* Destroy Participation when removing interactions with a post [#5852](https://github.com/diaspora/diaspora/pull/5852)
......
......@@ -56,7 +56,7 @@ $(document).ready(function(){
});
/* Heart toggle */
$(".like_action", ".stream").bind("tap click", function(evt){
$(".like-action", ".stream").bind("tap click", function(evt){
evt.preventDefault();
var link = $(this),
likeCounter = $(this).closest(".stream_element").find("like_count"),
......@@ -99,7 +99,7 @@ $(document).ready(function(){
});
/* Reshare */
$(".reshare_action", ".stream").bind("tap click", function(evt){
$(".reshare-action", ".stream").bind("tap click", function(evt){
evt.preventDefault();
var link = $(this),
......
......@@ -39,7 +39,7 @@ $(document).ready(function() {
var bottomBar = toggleReactionsLink.closest(".bottom_bar").first(),
commentsContainer = commentsContainerLazy(bottomBar),
existingCommentsContainer = commentsContainer(),
commentActionLink = bottomBar.find("a.comment_action");
commentActionLink = bottomBar.find("a.comment-action");
if (existingCommentsContainer.length > 0) {
showLoadedComments(toggleReactionsLink, existingCommentsContainer, commentActionLink);
} else {
......@@ -73,7 +73,7 @@ $(document).ready(function() {
};
}
$(".stream").on("tap click", "a.comment_action", function(evt) {
$(".stream").on("tap click", "a.comment-action", function(evt) {
evt.preventDefault();
showCommentBox(this);
var bottomBar = $(this).closest(".bottom_bar").first();
......@@ -157,7 +157,7 @@ $(document).ready(function() {
function handleCommentShowing(form, bottomBar) {
var formContainer = form.parent();
formContainer.remove();
var commentActionLink = bottomBar.find("a.comment_action").first();
var commentActionLink = bottomBar.find("a.comment-action").first();
commentActionLink.addClass("inactive");
var toggleReactionsLink = bottomBar.find(".show_comments").first();
showComments(toggleReactionsLink);
......
.bottom_bar {
border-radius: 0 0 5px 5px;
z-index: 3;
display: block;
position: relative;
padding: 8px 10px 10px;
background: $background-grey;
margin-top: 10px;
border-top: 1px solid $border-grey;
min-height: 22px;
> a, .show_comments {
@include transition(color);
color: $text-grey;
font-weight: bold;
}
.show_comments {
position: relative;
top: 3px;
}
a.show_comments.active:not(.bottom_collapse) {
color: $text;
padding-right: 14px;
background: {
image: image-url("mobile/arrow_down_small.png");
position: center right;
repeat: no-repeat;
}
}
.floater {
top: -5px;
float: right;
height: 28px;
overflow: hidden;
position: relative;
[class^="entypo"] {
height: 90%;
margin: 0 4px;
color: $text-grey;
font-size: 24px;
&:hover, &:active, &:focus{ text-decoration: none; }
&:last-child { margin-right: 1px; }
&.entypo-reshare.active { color: $blue; }
&.entypo-heart.active { color: $red; }
}
}
}
......@@ -11,6 +11,7 @@
@import "mobile/conversations";
@import "mobile/settings";
@import "mobile/stream_element";
@import "mobile/comments";
a {
color: #2489ce;
......@@ -369,87 +370,6 @@ h3 { margin-top: 0; }
float: right;
}
.bottom_bar {
border-radius: 0 0 5px 5px;
z-index: 3;
display: block;
position: relative;
padding: 10px;
padding-top: 8px;
background: $background-grey;
margin: {
top: 10px; };
border: {
top: 1px solid $border-grey;
};
min-height: 22px;
> a,
.show_comments {
@include transition(color);
color: $text-grey;
font-weight: bold;
}
.show_comments {
position: relative;
top: 3px;
color: #ccc;
}
a.show_comments {
color: $text-grey;
&.active:not(.bottom_collapse) {
color: #444;
padding: {
right: 14px;
}
background: {
image: image-url("mobile/arrow_down_small.png");
position: center right;
repeat: no-repeat;
}
}
}
#bottom_bar_tabs {
display: table;
width: 100%;
text: {
align: center;
}
border: {
bottom: 1px solid #ccc;
}
font: {
size: 28px;
}
color: #ccc;
.tab {
display: table-cell;
position:relative;
top: -5px;
border: {
right: 1px solid #ccc;
}
&:last-child {
border: none;
}
}
}
}
.floater {
float: right;
}
.photo_area {
border-radius: 3px;
text-align: center; }
......@@ -476,27 +396,6 @@ h3 { margin-top: 0; }
}
}
.reshare_action {
background-image: image-url("mobile/reshare_mobile.png");
&.active {
background-image: image-url("mobile/reshare_mobile_active.png");
}
}
.like_action {
background-image: image-url("mobile/heart_mobile_grey.png");
&.active {
background-image: image-url("mobile/heart_mobile_red.png");
}
}
.comment_action.image_link {
background-image: image-url("mobile/pencil_mobile_grey_active.png");
&.inactive {
background-image: image-url("mobile/pencil_mobile_grey.png");
}
}
#new_status_message {
margin: 0;
......
module MobileHelper
def aspect_select_options(aspects, selected)
selected_id = selected == :all ? "" : selected.id
'<option value="" >All</option>\n'.html_safe + options_from_collection_for_select(aspects, "id", "name", selected_id)
end
def mobile_reshare_icon(post)
if (post.public? || reshare?(post)) && (user_signed_in? && post.author != current_user.person)
absolute_root = reshare?(post) ? post.absolute_root : post
if absolute_root && absolute_root.author != current_user.person
reshare = Reshare.where(:author_id => current_user.person_id,
:root_guid => absolute_root.guid).first
reshare = Reshare.where(author_id: current_user.person_id,
root_guid: absolute_root.guid).first
klass = reshare.present? ? "active" : "inactive"
link_to '', reshares_path(:root_guid => absolute_root.guid), :title => t('reshares.reshare.reshare_confirmation', :author => absolute_root.author_name), :class => "image_link reshare_action #{klass}"
link_to "", reshares_path(root_guid: absolute_root.guid),
title: t("reshares.reshare.reshare_confirmation", author: absolute_root.author_name),
class: "entypo-reshare reshare-action #{klass}"
end
end
end
def mobile_like_icon(post)
if current_user && current_user.liked?(post)
link_to '', post_like_path(post.id, current_user.like_for(post).id), :class => "image_link like_action active"
link_to "", post_like_path(post.id, current_user.like_for(post).id), class: "entypo-heart like-action active"
else
link_to '', post_likes_path(post.id), :class => "image_link like_action inactive"
link_to "", post_likes_path(post.id), class: "entypo-heart like-action inactive"
end
end
def mobile_comment_icon(post)
link_to '', new_post_comment_path(post), :class => "image_link comment_action inactive"
link_to "", new_post_comment_path(post), class: "entypo-comment comment-action inactive"
end
def reactions_link(post)
reactions_count = post.comments_count + post.likes_count
if reactions_count > 0
link_to "#{t('reactions', :count => reactions_count)}", post_comments_path(post, :format => "mobile"), :class => 'show_comments'
link_to "#{t('reactions', count: reactions_count)}",
post_comments_path(post, format: "mobile"),
class: "show_comments"
else
html = "<span class='show_comments'>"
html << "#{t('reactions', :count => reactions_count)}"
html << "#{t('reactions', count: reactions_count)}"
html << "</span>"
end
end
......
......@@ -16,7 +16,7 @@ Feature: Viewing my activity on the steam mobile page
And I should not see "Hello! I am #newhere"
Scenario: Show post on my activity
When I click on selector "a.image_link.like_action.inactive"
When I click on selector "a.like-action.inactive"
And I open the drawer
And I follow "My activity"
Then I should see "My activity"
......
......@@ -8,7 +8,7 @@ Feature: Browsing Diaspora as a logged out user mobile
Given a user named "Bob Jones" with email "bob@bob.bob"
And "bob@bob.bob" has a public post with text "public stuff"
And I sign in as "bob@bob.bob"
And I click on selector "a.image_link.comment_action.inactive"
And I click on selector "a.comment-action.inactive"
And I fill in the following:
| text | this also |
And I press "Comment"
......
......@@ -45,7 +45,7 @@ Feature: Not safe for work
And I toggle all nsfw posts
And I follow "Reshare"
And I confirm the alert
Then I should see a "a.image_link.reshare_action.active"
Then I should see a "a.reshare-action.active"
When I go to the home page
Then I should not see "Sexy Senators Gone Wild!"
......@@ -59,7 +59,7 @@ Feature: Not safe for work
And I toggle all nsfw posts
And I follow "Reshare"
And I confirm the alert
Then I should see a "a.image_link.reshare_action.active"
Then I should see a "a.reshare-action.active"
When I go to the home page
Then I should not see "Sexy Senators Gone Wild!"
......@@ -73,7 +73,7 @@ Feature: Not safe for work
And I toggle all nsfw posts
And I follow "Reshare"
And I confirm the alert
Then I should see a "a.image_link.reshare_action.active"
Then I should see a "a.reshare-action.active"
When I go to the home page
Then I should not see "Sexy Senators Gone Wild!"
......
......@@ -16,15 +16,15 @@ Feature: reactions mobile post
Scenario: like on a mobile post
When I should see "No reactions" within ".show_comments"
And I click on selector "span.show_comments"
And I click on selector "a.image_link.like_action.inactive"
Then I should see a "a.image_link.like_action.active"
And I click on selector "a.like-action.inactive"
Then I should see a "a.like-action.active"
When I go to the stream page
And I should see "1 reaction" within ".show_comments"
And I click on selector "a.show_comments"
Then I should see "1" within ".like_count"
Scenario: comment and delete a mobile post
When I click on selector "a.image_link.comment_action.inactive"
When I click on selector "a.comment-action.inactive"
And I fill in the following:
| text | is that a poodle? |
And I press "Comment"
......@@ -33,7 +33,7 @@ Feature: reactions mobile post
And I should see "1 reaction" within ".show_comments"
And I click on selector "a.show_comments"
And I should see "1" within ".comment_count"
When I click on selector "a.image_link.comment_action"
When I click on selector "a.comment-action"
And I click on selector "a.remove"
And I confirm the alert
Then I should not see "1 reaction" within ".show_comments"
......@@ -16,18 +16,18 @@ Feature: resharing from the mobile
And I sign in as "alice@alice.alice"
Scenario: Resharing a post from a single post page
And I click on selector "a.image_link.reshare_action.inactive"
And I click on selector "a.reshare-action.inactive"
And I confirm the alert
Then I should see a "a.image_link.reshare_action.active"
Then I should see a "a.reshare-action.active"
When I go to the stream page
Then I should see "Reshared via" within ".reshare_via"
Scenario: Resharing a post from a single post page that is reshared
Given the post with text "reshare this!" is reshared by "eve@eve.eve"
And a user with email "alice@alice.alice" is connected with "eve@eve.eve"
And I click on the first selector "a.image_link.reshare_action.inactive"
And I click on the first selector "a.reshare-action.inactive"
And I confirm the alert
Then I should see a "a.image_link.reshare_action.active"
Then I should see a "a.reshare-action.active"
When I go to the stream page
Then I should see "Reshared via" within ".reshare_via"
......
# Copyright (c) 2010-2011, Diaspora Inc. This file is
# licensed under the Affero General Public License version 3 or later. See
# the COPYRIGHT file.
require 'spec_helper'
describe MobileHelper, :type => :helper do
describe "#aspect_select_options" do
it "adds an all option to the list of aspects" do
# options_from_collection_for_select(@aspects, "id", "name", @aspect.id)
n = FactoryGirl.create(:aspect)
options = aspect_select_options([n], n).split('\n')
expect(options.first).to match(/All/)
end
end
end
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment