Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Dashboard initial design #6229

Closed
wants to merge 2 commits into from
Closed

Dashboard initial design #6229

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e453e52
dashboard initial design
gautamig54 Sep 1, 2019
73e2f06
minor changes
gautamig54 Sep 3, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 5 additions & 4 deletions app/views/dashboard/_header.html.erb
View file
Open in desktop
@@ -1,14 +1,15 @@
<div class="row header">

<% if current_user %>
<h1><%= t('dashboard._header.dashboard') %></h1>
<h4><%= t('dashboard._header.dashboard') %></h4>&nbsp;&nbsp;
<p style="color:#808080; margin-top:2px;">Updates from community members on <a href="/subscriptions" style="color:#808080;"><u> topics you follow </u></a></p>
<% else %>
<h1><%= t('dashboard._header.community_research') %></h1>
<h4><%= t('dashboard._header.community_research') %></h4>
<% end %>

</div>

<div class="row stats">
<!-- <div class="row stats">
<h4 class="col-lg-8">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @gautamig54 May I know why is this section commented ? 馃

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We do not have the welcome text as such in the new design. It is more like an alert message. I'll add the alert message text. Should I completely delete this part?

<% if current_user %>
<span class="d-none d-lg-inline"><%= t('dashboard._header.welcome') %><span class="d-lg-none d-xl-inline">,<b><a href="/profile/"> <%= current_user.username %></a></b></span>! <%= current_user.new_contributor %></span>
Expand All @@ -19,4 +20,4 @@
<%= t('dashboard._header.this_could_be_dashboard') %> <a data-toggle="modal" data-target="#loginModal"><%= t('dashboard._header.joined_public_lab') %></a>
<% end %>
</h4>
</div>
</div> -->
60 changes: 60 additions & 0 deletions app/views/dashboard/_user_topics.html.erb
View file
Open in desktop
@@ -0,0 +1,60 @@
<div class="card-view" style="margin-left: -13px;">
<% current_user.subscriptions(:tag).each do |tag| %>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We shouldn't have tags as per current user right ? It should be all the latest tags in dashboard I guess ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi! As from what I understood, it should be specific to a user. I had a discussion about the same with @gauravano as well. The topic cards should be the ones followed by the user and all the updates regarding that.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, let's ask @jywarren as he's available now for more clarity on this.

<div class="card shadow-sm p-2 mb-3 bg-white rounded" >
<div class="card-header mt-2" style=" padding:0.8em; background-color: inherit; border:none;">
<h4 style="display: inline-block;"><%= tag.tagname %></h4>
<p style="display: inline-block; color: #808080;"><a style="text-decoration: underline; color: #808080;" href="/tag/<%= tag.tagname %>"><%= Tag.follower_count(tag.tagname) %> people</a> discussing</p>
</div>
<div class="card-body" style="padding:0.8em;">
<div class="node-list">
<% Tag.find_nodes_by_type(tag.tagname, type = 'note', limit = 3).each do |node| %>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In dashboard, we require all the nodes, Comments, wikis, Questions too I guess wiki too. I think this would be updated in profile page too. I'll update it for profile page.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Okay! I'll add them as well. Thanks!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @CleverFool77! How do I add comments here, because we cannot associate comments with any topic?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shall we approach this the same way as on the profile page, by making a new page similar to /comments, but for /comments/warren for example -- all comments by an author? Then we can link there from the dashboard AND from the profile page.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could make it a pretty simple page, just a table like /comments maybe?

<div class="node-body">
<% if node.main_image %>
<img class="rounded-circle" id="profile-photo" style="width:20px; height:20px; margin-right:8px; display: inline-block;" src="<%= node.main_image.path(:default) %>" />
<% elsif node.scraped_image %>
<img class="rounded-circle" id="profile-photo" style="width:20px; height:20px; margin-right:8px; display: inline-block;" src="<%= node.scraped_image %>" />
<% else %>
<div class="circle"></div>
<% end %>
<p style="display: inline-block; margin-left: 10px;"><a style="color: inherit;" <% if @widget %>target="_blank"<% end %> href="<%= node.path %>"><%= (node.type == 'note') ? node.title : node.latest.title %></a></p>
<p style="display: inline-block; margin-left: 10px;color: #808080;">by <a style="color: #808080;" <% if @widget %>target="_blank"<% end %> href="/profile/<%= node.author.name %>">@<%= node.author.name %></a></p>
</div>
<% end %>
</div>
</div>
<div class="card-footer" style="background-color: inherit; border:none;">
<a style="text-decoration: underline; color: #808080; display: inline-block;" href="/tag/<%= tag.tagname %>"><%= Tag.follower_count(tag.tagname).to_i-1 %> <%= t('tag.index.more_posts') %> <i class="fa fa-angle-double-right"></i></a>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Similar as above, Not just notes, but need to include comments,questions too.
This will be added in profile page soon too.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Questions and notes have already been added!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here notes are covering all the posts made. I think the only portion not covered here are the wikis and the comments. We can discuss about them with @jywarren !


<a style="float: right; width: 100px;" rel="tooltip" title="<%= t('sidebar._post_button.share_your_work') %>" data-placement="bottom" href="/post?tags=<%= tag.tagname %>" class="btn btn-primary btn-sm">New post <i class="fa fa-plus fa-white"></i></a>
<% if current_user %>
<div id="follow-unfollow-column-<%=tag.tid%>" style="float: right; margin-right: 10px;">
<% if current_user.following(tag.tagname) %>
<a style="width: 100px;" rel="tooltip" title="<%= t('tag.show.unfollow') %>" class="btn btn-light btn-sm active" href="/unsubscribe/tag/<%= tag.tagname %>"></i> <%= t('tag.index.unsubscribe') %></a>
<% else %>
<a style="width: 100px;" class="btn btn-outline-secondary btn-sm index-follow-buttons follow-btn-remote" href="/subscribe/tag/<%= tag.name %>" data-remote="true"><%= t('tag.index.subscribe') %></a>
<% end %>
</div>
<% end %>
</div>
</div>
<% end %>
</div>

<style>

.node-list {
display: grid;
}

.node-body {
display: flex;
}

.circle {
background-color: gray;
height: 20px;
width: 20px;
border-radius: 100%;
}

</style>
58 changes: 20 additions & 38 deletions app/views/dashboard/dashboard.html.erb
View file
Open in desktop
Expand Up @@ -27,54 +27,36 @@

<div class="row">

<div class="col-lg-8">
<div class="col-lg-7">

<%= render partial: "dashboard/header" %>

<div class="dashboard-blog">

<% if @blog %>

<% if @blog.main_image %>
<div class="img" style="background-image: url('<%= @blog.main_image.path(:large) %>')">
<% elsif @blog.scraped_image %>
<div class="img" style="background-image: url('<%= @blog.scraped_image %>')">
<% end %>

<div class="blog-caption">

<h4>
<small class="float-right d-none d-lg-inline"><%= raw translation('dashboard.dashboard.from_blog', :url => '/blog') %></small>
<a class="title" href="/blog"><%= @blog.title %></a>
<small><%= t('dashboard.dashboard.by') %>
<a href="/profile/<%= @blog.author.username %>"><%= @blog.author.username %></a></small>
</h4>

</div>

<% if @blog.main_image || @blog.scraped_image %>
</div>
<%= render partial: "dashboard/user_topics" %><br/>

<p style="width: 100%; text-align: center; border-bottom: 1px solid #ccc; line-height:2px; margin: 10px 0 20px; margin-left:-13px;">
<span style="background-color: #fff; padding: 0 10px; color: #808080;">Click to start following topics that interests you</span>
</p>
<br/>

<div>
<small><a href="/tags" class="form-grey" style="margin-left:-13px;">Trending topics:</a></small>
<span class="topics-span">
<% cache('trending-tags', expires_in: 24.hours, skip_digest: true) do %>
<% Tag.trending.each do |tag| %>
<a href="/tag/<%= tag.name %>" class="badge badge-primary"><%= tag.name %></a>
<% end %>
<% end %>

<% end %>

<%= render partial: "dashboard/activity", locals: {activity: @activity, notes: @notes} %>

</div>

</span>
</div>

<div class="col-lg-4">

<%= feature('dashboard-feature') %>
</div>

<%= render partial: "sidebar/dashboard" %>
<div class="col-lg-5">
<%= render :partial => "map/peopleLeaflet" , locals: {people: true , lat:23 , lon: 4} %>

</div>
</div>

</div>

</div>
</div>
<%= stylesheet_link_tag "dashboard" %>
<%= javascript_include_tag "dashboard" %>