maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Stories views reorganization (#1317)

Browse source 
* Added stories feature specs

* Structure feature specs

* Spec for the articles by tag page

* Spec for clicking "week" button on the tag page

* Reorganize stories views

* Feature spec for displaying sponsors on tag page

* Increase allowed rspec example length

* Spec for the users comments view

* Articles by tag: reeplace view code with rendering partials
This commit is contained in:
Anna Buyanova 2018-12-13 22:54:02 +03:00 • committed by Ben Halpern
parent 56ec3e55a2
commit 074d50d2b7
36 changed files with 1237 additions and 915 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.rubocop.yml
View file

@ -15,6 +15,7 @@ RSpec/DescribeClass:
- spec/requests/*
RSpec/ExampleLength:
Max: 10
Exclude:
- spec/features/**/*

3
app/controllers/podcast_episodes_controller.rb
View file

@ -11,10 +11,9 @@ class PodcastEpisodesController < ApplicationController
@podcast_episodes.map { |e| e["record_key"] })
end
@featured_story = Article.new
@podcast_index = true
@article_index = true
@list_of = "podcast-episodes"
render template: "articles/index"
render template: "podcast_episodes/index"
end
private

10
app/controllers/stories_controller.rb
View file

@ -15,7 +15,7 @@ class StoriesController < ApplicationController
@featured_story = Article.new
@article_index = true
set_surrogate_key_header "articles-page-with-query"
render template: "articles/index"
render template: "articles/search"
end
def show
@ -101,7 +101,7 @@ class StoriesController < ApplicationController
@article_index = true
set_surrogate_key_header "articles-#{@tag}", @stories.map(&:record_key)
response.headers["Surrogate-Control"] = "max-age=600, stale-while-revalidate=30, stale-if-error=86400"
render template: "articles/index"
render template: "articles/tag_index"
end
def handle_base_index
@ -155,7 +155,7 @@ class StoriesController < ApplicationController
@list_of = "podcast-episodes"
@podcast_episodes = @podcast.podcast_episodes.order("published_at DESC").limit(30)
set_surrogate_key_header "podcast_episodes", (@podcast_episodes.map { |e| e["record_key"] })
render template: "articles/index"
render template: "podcast_episodes/index"
end
def handle_organization_index
@ -169,7 +169,7 @@ class StoriesController < ApplicationController
@article_index = true
@organization_article_index = true
set_surrogate_key_header "articles-org-#{@organization.id}", @stories.map(&:record_key)
render template: "articles/index"
render template: "organizations/show"
end
def handle_user_index
@ -189,7 +189,7 @@ class StoriesController < ApplicationController
redirect_if_view_param
return if performed?
set_surrogate_key_header "articles-user-#{@user.id}", @stories.map(&:record_key)
render template: "articles/index"
render template: "users/show"
end
def handle_podcast_show

319
app/views/articles/_sidebar.html.erb
View file

@ -1,265 +1,82 @@
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
<div class="sidebar-bg" id="sidebar-bg-left"></div>
<div class="side-bar">
<% if @user && @user.class.name == "User" %>
<div class="user-sidebar">
<% if @user.mostly_work_with.present? %>
<div class="widget">
<header>
skills/languages
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.mostly_work_with %>
</div>
</div>
<% end %>
<% if @user.currently_learning.present? %>
<div class="widget">
<header>
learning/trying
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.currently_learning %>
</div>
</div>
<% end %>
<% if @user.currently_hacking_on.present? %>
<div class="widget">
<header>
projects and hacks
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.currently_hacking_on %>
</div>
</div>
<% end %>
<% if @user.available_for.present? %>
<div class="widget">
<header>
available for
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.available_for %>
</div>
</div>
<% end %>
<div class="sidebar-data">
<div>
<%= pluralize @user.articles.where(published: true).size, "Post" %> Published
</div>
<div>
<%= pluralize @user.comments.where(deleted: false).size, "Comment" %> Written
</div>
<div>
<%= pluralize @user.decorate.cached_followed_tags.size, "Tag" %> Followed
</div>
</div>
</div>
<% elsif @user && @user.class.name == "Organization" %>
<% if @organization.story.present? %>
<div class="widget">
<header>
our story
</header>
<div class="widget-body">
<%= sanitized_sidebar @organization.story %>
</div>
</div>
<% end %>
<% if @organization.tech_stack.present? %>
<div class="widget">
<header>
our stack
</header>
<div class="widget-body">
<%= sanitized_sidebar @organization.tech_stack %>
</div>
</div>
<% end %>
<% elsif @query %>
<div class="widget fixed-widget">
<% cache("main-sidebar-nav--#{user_signed_in?}", :expires_in => 5.days) do %>
<%= render "articles/sidebar_nav" %>
<div class="widget sponsorship-widget <%= "showing" unless user_signed_in? %>" id="sponsorship-widget">
<header>
search results
</header>
<div class="widget-body" style="margin-bottom:16px;">
<a class="query-filter-button" data-filter="class_name:Article">POSTS</a>
<a class="query-filter-button" data-filter="class_name:PodcastEpisode">PODCASTS</a>
<a class="query-filter-button" data-filter="class_name:User">PEOPLE</a>
<hr style="opacity:0.2" />
<a class="query-filter-button my-posts-query-button" data-filter="MY_POSTS">ONLY MY POSTS</a>
</div>
</div>
<% elsif @tag %>
<% if @tag_model && @tag_model.short_summary.present? %>
<div class="widget">
<header>
#<%= @tag %> 👋
</header>
<div class="widget-body">
<%= @tag_model.short_summary.html_safe %>
</div>
</div>
<% end %>
<% if @tag_model && @tag_model.rules_html.present? %>
<div class="widget">
<header>
submission guidelines
</header>
<div class="widget-body">
<%= @tag_model.rules_html.html_safe %>
<a class="cta cta-button" href="/new/<%= @tag %>" >
WRITE A POST
</a>
</div>
</div>
<% end %>
<% if @tag_model && @tag_model.wiki_body_html.present? %>
<div class="widget">
<header>
about #<%= @tag %>
</header>
<div class="widget-body">
<%= @tag_model.wiki_body_html.html_safe %>
</div>
</div>
<% end %>
<% if @tag == "javascript" %>
<div class="widget sponsorship-widget <%= "showing" unless user_signed_in? %>" id="sponsorship-widget">
<header>
<a href="/sponsors">community sponsors</a>
<span class="emoji">
<img alt="emoji heart" src="<%= asset_path "emoji/emoji-one-heart.png" %>" />
</span>
</header>
<div class="widget-body">
<div class="sidebar-sponsor">
<a class="partner-link" href="https://developer.jwplayer.com/jw-player/demos/?utm_source=dev.to" target="_blank" data-details="jwplayer__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/lc2gkdj9dbmkul4z26g0.png") %>" style="margin-bottom:8px;" alt="Cloudinary K" />
</a>
<div class="sponsor-tagline" style="display:inline;">
The Most Powerful & Flexible JavaScript Video API.
<a class="partner-link sponsor-learn-more" href="https://developer.jwplayer.com/jw-player/demos/?utm_source=dev.to" target="_blank" data-details="jwplayer__learn-more">
Learn More
</a>
</div>
</div>
</div>
</div>
<% end %>
<div class="sidebar-data">
<div>
<%= pluralize Article.tagged_with(@tag).where(published: true).size, "Post" %> Published
</div>
</div>
<% elsif @podcast_index && @podcasts %>
<div class="widget podcast-pic-widget">
<header>
&lt;ALL SHOWS&gt;
<a href="/sponsors">community sponsors</a>
<span class="emoji">
<img src="<%= asset_path "emoji/emoji-one-heart.png" %>" alt="emoji heart"/>
</span>
</header>
<div class="widget-body">
<% @podcasts.each do |podcast| %>
<a href="/<%= podcast.slug %>">
<span class="podcast-pic" id="podcast-pic-<%=podcast.slug %>">
<img src="<%= cl_image_path(podcast.image_url,
:type=>"fetch",
:crop => "fill",
:width => 100,
:height => 100,
:flags => "progressive",
:quality => "auto",
:fetch_format => "auto",
:sign_url => true) %>"
alt="<%= podcast.title %>" />
<div class="podcast-name">
<div class="podcast-name-inner">
<%= podcast.title %>
</div>
</div>
</span>
<div class="sidebar-sponsor">
<a class="partner-link" href="https://try.digitalocean.com/performance/?utm_source=devto&utm_medium=display&utm_campaign=Devto_2018_Brand" target="_blank" data-details="digitalocean__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/85318v8gv77kzr8r2e58.png") %>" style="margin-bottom:8px;" alt="Digital Ocean logo" />
</a>
<% end %>
<div class="sponsor-tagline" style="display:inline;">
The all-in-one cloud platform developers & their teams love.
<a class="partner-link sponsor-learn-more" href="https://try.digitalocean.com/performance/?utm_source=devto&utm_medium=display&utm_campaign=Devto_2018_Brand" target="_blank" data-details="digitalocean__learn-more">
Learn More
</a>
</div>
</div>
<div class="sidebar-sponsor">
<a class="partner-link" href="https://www.twilio.com/?utm_source=devto&utm_medium=banner&utm_campaign=summer_awareness_campaign" target="_blank" data-details="twilio__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/lgumfafaywo0zz90ciig.png") %>" alt="Twilio logo" />
</a>
<div class="sponsor-tagline">
APIs for communicating with anyone on planet Earth.
<a class="partner-link sponsor-learn-more" href="https://www.twilio.com/?utm_source=devto&utm_medium=banner&utm_campaign=summer_awareness_campaign" target="_blank" data-details="twilio__learn-more">
Learn More
</a>
</div>
</div>
<div class="sidebar-sponsor">
<a class="partner-link" href="https://raygun.com/?utm_source=dev.to" target="_blank" data-details="raygun__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/6a7bsz3y872g66upddt3.png") %>" alt="Raygun logo"/>
</a>
<div class="sponsor-tagline">
Error, crash, and performance monitoring software for devs.
<a class="partner-link sponsor-learn-more" href="https://raygun.com/?utm_source=dev.to" target="_blank" data-details="raygun__learn-more">
Learn More
</a>
</div>
</div>
<div class="sponsors-love-message">
We are grateful for wonderful sponsors who help sustain the dev community.
</div>
<div class="sponsor-footer">
<p>
<a href="/sponsorship-info">Sponsorship Info/Policy</a>
</p>
</div>
</div>
</div>
<% elsif @podcast %>
<% else %>
<% cache("main-sidebar-nav--#{user_signed_in?}", :expires_in => 5.days) do %>
<%= render "articles/sidebar_nav" %>
<div class="widget sponsorship-widget <%= "showing" unless user_signed_in? %>" id="sponsorship-widget">
<header>
<a href="/sponsors">community sponsors</a>
<span class="emoji">
<img src="<%= asset_path "emoji/emoji-one-heart.png" %>" alt="emoji heart"/>
</span>
</header>
<div class="widget-body">
<div class="sidebar-sponsor">
<a class="partner-link" href="https://try.digitalocean.com/performance/?utm_source=devto&utm_medium=display&utm_campaign=Devto_2018_Brand" target="_blank" data-details="digitalocean__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/85318v8gv77kzr8r2e58.png") %>" style="margin-bottom:8px;" alt="Digital Ocean logo" />
</a>
<div class="sponsor-tagline" style="display:inline;">
The all-in-one cloud platform developers & their teams love.
<a class="partner-link sponsor-learn-more" href="https://try.digitalocean.com/performance/?utm_source=devto&utm_medium=display&utm_campaign=Devto_2018_Brand" target="_blank" data-details="digitalocean__learn-more">
Learn More
</a>
</div>
</div>
<div class="sidebar-sponsor">
<a class="partner-link" href="https://www.twilio.com/?utm_source=devto&utm_medium=banner&utm_campaign=summer_awareness_campaign" target="_blank" data-details="twilio__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/lgumfafaywo0zz90ciig.png") %>" alt="Twilio logo" />
</a>
<div class="sponsor-tagline">
APIs for communicating with anyone on planet Earth.
<a class="partner-link sponsor-learn-more" href="https://www.twilio.com/?utm_source=devto&utm_medium=banner&utm_campaign=summer_awareness_campaign" target="_blank" data-details="twilio__learn-more">
Learn More
</a>
</div>
</div>
<div class="sidebar-sponsor">
<a class="partner-link" href="https://raygun.com/?utm_source=dev.to" target="_blank" data-details="raygun__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/6a7bsz3y872g66upddt3.png") %>" alt="Raygun logo"/>
</a>
<div class="sponsor-tagline">
Error, crash, and performance monitoring software for devs.
<a class="partner-link sponsor-learn-more" href="https://raygun.com/?utm_source=dev.to" target="_blank" data-details="raygun__learn-more">
Learn More
</a>
</div>
</div>
<div class="sponsors-love-message">
We are grateful for wonderful sponsors who help sustain the dev community.
</div>
<div class="sponsor-footer">
<p>
<a href="/sponsorship-info">Sponsorship Info/Policy</a>
</p>
</div>
</div>
<div class="widget">
<header>
key links
</header>
<div class="widget-body">
<a href="https://twitter.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("twitter-logo.svg") %>" alt="Twitter logo" class="social-icon" /></a>
<a href="https://github.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("github-logo.svg") %>" alt="GitHub logo" class="social-icon" /></a>
<a href="https://instagram.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("instagram-logo.svg") %>" alt="Instagram logo" class="social-icon" /></a>
<a href="https://facebook.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("facebook-logo.svg") %>" alt="Facebook logo" class="social-icon" /></a>
<a href="https://twitch.tv/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("twitch-logo.svg") %>" alt="Twitch logo" class="social-icon" /></a>
</div>
<div class="widget">
<header>
key links
</header>
<div class="widget-body">
<a href="https://twitter.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("twitter-logo.svg") %>" alt="Twitter logo" class="social-icon" /></a>
<a href="https://github.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("github-logo.svg") %>" alt="GitHub logo" class="social-icon" /></a>
<a href="https://instagram.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("instagram-logo.svg") %>" alt="Instagram logo" class="social-icon" /></a>
<a href="https://facebook.com/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("facebook-logo.svg") %>" alt="Facebook logo" class="social-icon" /></a>
<a href="https://twitch.tv/thepracticaldev" target="_blank" rel="noopener"><img src="<%= asset_path("twitch-logo.svg") %>" alt="Twitch logo" class="social-icon" /></a>
</div>
<div class="side-footer">
<a href="/about">About</a>
<a href="/events">Events</a>
<a href="/sponsors">Sponsors</a>
<a href="https://shop.dev.to/">DEV Shop</a>
<a href="/privacy">Privacy Policy</a>
<a href="/terms">Terms of Use</a>
<a href="/contact">Contact</a>
<a href="/faq">FAQ</a>
<a href="/code-of-conduct">Code of Conduct</a>
</div>
<div class="side-footer">
<a href="/about">About</a>
<a href="/events">Events</a>
<a href="/sponsors">Sponsors</a>
<a href="https://shop.dev.to/">DEV Shop</a>
<a href="/privacy">Privacy Policy</a>
<a href="/terms">Terms of Use</a>
<a href="/contact">Contact</a>
<a href="/faq">FAQ</a>
<a href="/code-of-conduct">Code of Conduct</a>
</div>
<% end %>
</div>
<% end %>
</div>
</div>

420
app/views/articles/_sidebar_additional.html.erb
View file

@ -1,267 +1,183 @@
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
<div class="sidebar-bg" id="sidebar-bg-right"></div>
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
<% if @user && @user.class.name == "User" %>
<% @user.github_repos.where(featured: true).order({stargazers_count: :desc}, {name: :asc}).each do |repo| %>
<a class="widget" href="<%= repo.url %>" target="_blank">
<header>
<span class="emoji"><img src="<%= asset_path("github-logo.svg") %>" /></span><%= repo.name %>
</header>
<div class="widget-body">
<%= repo.description %>
<div class="widget-footer">
<% if repo.fork %>
<span class="widget-accent">fork</span>
<% end %>
<%= repo.language %>
<% if repo.stargazers_count > 0 %>
<img src="<%= asset_path("star.svg") %>" /> <%= repo.stargazers_count %>
<% end %>
</div>
</div>
</a>
<% end %>
<% if @user.badge_achievements_count > 0 %>
<%= render "articles/badges_area" %>
<% end %>
<% elsif @user && @user.class.name == "Organization" %>
<% if @user.users.size > 0 %>
<div class="widget">
<div class="widget-suggested-follows-container">
<header>meet the team</header>
<div class="widget-body">
<% @user.users.each do |user| %>
<div class="widget-user-pic">
<a href="/<%= user.username %>">
<img src="<%= ProfileImage.new(user).get(90) %>" />
</a>
</div>
<% end %>
</div>
</div>
<% unless user_signed_in? %>
<div class="widget signin-cta-widget">
<header>
DEV.TO(GETHER)
</header>
<div class="widget-body">
<center style="margin-bottom: 2px;">
<a href="/users/auth/twitter?callback_url=<%= ApplicationConfig["APP_PROTOCOL"] %><%= ApplicationConfig["APP_DOMAIN"] %>/users/auth/twitter/callback" class="cta cta-button login-cta-button" data-no-instant>
SIGN IN VIA TWITTER
</a>
<a href="/users/auth/github?state=navbar_basic" class="cta cta-button login-cta-button" data-no-instant>
SIGN IN VIA GITHUB
</a>
</center>
</div>
<% end %>
<% elsif @tag %>
<% if Article.active_threads([@tag,"discuss"], Timeframer.new(params[:timeframe]).datetime).any? %>
<div class="widget">
<header>
#discuss
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads([@tag,"discuss"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
</div>
<% end %>
<% if @sidebar_ad %>
<div class="widget">
<div class="widget-body" style="margin-top:-6px">
<%= @sidebar_ad.processed_html.html_safe %>
</div>
</div>
<% end %>
<% ApplicationConfig["TRENDING_TAGS"].split(",").each do |tag| %>
<div class="widget">
<header>
<a href="/t/<%= tag %>">#<%= tag %></a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads([tag], Timeframer.new(params[:timeframe]).datetime, 5).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/<%= tag %>">MAKE A #<%= tag.upcase %> POST</a>
</div>
<% end %>
<% if user_signed_in? %>
<%= javascript_pack_tag "sidebarWidget", defer: true %>
<div id="sidebarWidget__pack" data-tag-info="<%= @tag_model.attributes.slice("id", "text_color_hex", "bg_color_hex", "name").to_json %>">
</div>
<% end %>
<% if Article.active_help.any? %>
<div class="widget">
<header>
<a href="/t/help">#help</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_help.limit(8).pluck(:path,:title,:comments_count, :created_at).each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/help">ASK FOR HELP</a>
</div>
<% else %>
<% cache("seo-boostable-posts-for-tag#{@tag}", :expires_in => 18.hours) do %>
<% @boostable_posts = Article.seo_boostable(@tag) %>
<% if @boostable_posts.any? %>
<div class="widget">
<header>
trending guides/resources
</header>
<div class="widget-body">
<div class="widget-link-list">
<% @boostable_posts.first(8).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: false %>
<% end %>
</div>
<% end %>
<% if Article.active_threads(["ama"], Timeframer.new(params[:timeframe]).datetime).any? %>
<div class="widget">
<header>
<a href="/t/ama">#ama</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["ama"], Timeframer.new(params[:timeframe]).datetime, 5).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/ama">START AN "ASK ME ANYTHING"</a>
</div>
</div>
<% end %>
<% if Article.active_threads(["challenge"], Timeframer.new(params[:timeframe]).datetime).any? %>
<div class="widget">
<header>
<a href="/t/challenge">#challenge</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["challenge"], Timeframer.new(params[:timeframe]).datetime, 5).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/challenge">CREATE A CHALLENGE</a>
</div>
</div>
<% end %>
<div class="widget">
<header>
<a href="/t/discuss">#discuss</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["discuss"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/discuss">START A DISCUSSION</a>
</div>
</div>
<div class="widget">
<header>
<a href="/t/explainlikeimfive">#explainlikeimfive</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_eli5(Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/explainlikeimfive">ASK FOR AN EXPLANATION</a>
</div>
</div>
<div class="widget">
<header>
<a href="/t/healthydebate">#healthydebate</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["healthydebate"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/healthydebate">START A DEBATE</a>
</div>
</div>
<div class="widget">
<header>
<a href="/t/meta">#meta</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["meta"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/meta">START A META DISCUSSION</a>
</div>
</div>
<% if user_signed_in? %>
<div class="widget" id="podcast-widget">
<header>
<a href="/pod">latest podcasts</a>
</header>
<div class="widget-body">
<% @podcast_episodes.each do |ep| %>
<div class="widget-podcast-ep">
<a href="<%= ep.path %>"><%= ep.title %>
<div class="widget-podcast-title">
<a href="<%= ep.podcast.path %>"><%= ep.podcast.title %>
</div>
</div>
</div>
<% end %>
<% end %>
<% end %>
<% elsif @query %>
<% elsif @podcast_index %>
<% end %>
<a class="cta cta-button" href="/pod">VIEW ALL</a>
</div>
</div>
<% else %>
<% unless user_signed_in? %>
<div class="widget signin-cta-widget">
<header>
DEV.TO(GETHER)
</header>
<div class="widget-body">
<center style="margin-bottom: 2px;">
<a href="/users/auth/twitter?callback_url=<%= ApplicationConfig["APP_PROTOCOL"] %><%= ApplicationConfig["APP_DOMAIN"] %>/users/auth/twitter/callback" class="cta cta-button login-cta-button" data-no-instant>
SIGN IN VIA TWITTER
</a>
<a href="/users/auth/github?state=navbar_basic" class="cta cta-button login-cta-button" data-no-instant>
SIGN IN VIA GITHUB
</a>
</center>
</div>
</div>
<% end %>
<% if @sidebar_ad %>
<div class="widget">
<div class="widget-body" style="margin-top:-6px">
<%= @sidebar_ad.processed_html.html_safe %>
</div>
</div>
<% end %>
<% ApplicationConfig["TRENDING_TAGS"].split(",").each do |tag| %>
<div class="widget">
<header>
<a href="/t/<%= tag %>">#<%= tag %></a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads([tag], Timeframer.new(params[:timeframe]).datetime, 5).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/<%= tag %>">MAKE A #<%= tag.upcase %> POST</a>
</div>
</div>
<% end %>
<% if Article.active_help.any? %>
<div class="widget">
<header>
<a href="/t/help">#help</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_help.limit(8).pluck(:path,:title,:comments_count, :created_at).each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/help">ASK FOR HELP</a>
</div>
</div>
<% end %>
<% if Article.active_threads(["ama"], Timeframer.new(params[:timeframe]).datetime).any? %>
<div class="widget">
<header>
<a href="/t/ama">#ama</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["ama"], Timeframer.new(params[:timeframe]).datetime, 5).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/ama">START AN "ASK ME ANYTHING"</a>
</div>
</div>
<% end %>
<% if Article.active_threads(["challenge"], Timeframer.new(params[:timeframe]).datetime).any? %>
<div class="widget">
<header>
<a href="/t/challenge">#challenge</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["challenge"], Timeframer.new(params[:timeframe]).datetime, 5).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/challenge">CREATE A CHALLENGE</a>
</div>
</div>
<% end %>
<div class="widget">
<header>
<a href="/t/discuss">#discuss</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["discuss"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/discuss">START A DISCUSSION</a>
</div>
</div>
<div class="widget">
<header>
<a href="/t/explainlikeimfive">#explainlikeimfive</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_eli5(Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/explainlikeimfive">ASK FOR AN EXPLANATION</a>
</div>
</div>
<div class="widget">
<header>
<a href="/t/healthydebate">#healthydebate</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["healthydebate"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/healthydebate">START A DEBATE</a>
</div>
</div>
<div class="widget">
<header>
<a href="/t/meta">#meta</a>
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads(["meta"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
<a class="cta cta-button" href="/new/meta">START A META DISCUSSION</a>
</div>
</div>
<% if user_signed_in? %>
<div class="widget" id="podcast-widget">
<header>
<a href="/pod">latest podcasts</a>
</header>
<div class="widget-body">
<% @podcast_episodes.each do |ep| %>
<div class="widget-podcast-ep">
<a href="<%= ep.path %>"><%= ep.title %>
<div class="widget-podcast-title">
<a href="<%= ep.podcast.path %>"><%= ep.podcast.title %>
</div>
</div>
<% end %>
<a class="cta cta-button" href="/pod">VIEW ALL</a>
</div>
</div>
<% else %>
<% cache("seo-boostable-posts-homepage", :expires_in => 18.hours) do %>
<% @boostable_posts = Article.seo_boostable %>
<% if @boostable_posts.any? %>
<div class="widget">
<header>
trending guides/resources
</header>
<div class="widget-body">
<div class="widget-link-list">
<% @boostable_posts.first(12).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: false %>
<% end %>
</div>
<% cache("seo-boostable-posts-homepage", :expires_in => 18.hours) do %>
<% @boostable_posts = Article.seo_boostable %>
<% if @boostable_posts.any? %>
<div class="widget">
<header>
trending guides/resources
</header>
<div class="widget-body">
<div class="widget-link-list">
<% @boostable_posts.first(12).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: false %>
<% end %>
</div>
</div>
<% end %>
</div>
<% end %>
<% end %>
<% end %>

5
app/views/articles/_sidebar_nav.html.erb
View file

@ -10,7 +10,7 @@
<div class="sidebar-profile-username" id="sidebar-profile-username">
</div>
</div>
</a>
</a>
</div>
<% end %>
<% if user_signed_in? %>
@ -59,6 +59,5 @@
<div class="sidebar-nav-subheader">
<a href="/tags">View all-time top tags</a>
</div>
</div>
</div>
</div>

430
app/views/articles/index.html.erb
View file

@ -1,249 +1,28 @@
<%= content_for :page_meta do %>
<% if @user %>
<% title "#{@user.name} - DEV Profile" %>
<link rel="canonical" href="https://dev.to/<%= @user.username %>"/>
<meta name="description" content="<%= @user.summary %>">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="https://dev.to/<%= @user.username %>" />
<meta property="og:title" content="<%= @user.name %> — - DEV Profile" />
<meta property="og:image" content="<%= GeneratedImage.new(@user).social_image %>" >
<meta property="og:description" content="<%= @user.summary %>" />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:creator" content="@<%=@user.twitter_username %>">
<meta name="twitter:title" content="<%= @user.name %> — DEV Profile">
<meta name="twitter:description" content="<%= @user.summary %>">
<meta name="twitter:image:src" content="<%= GeneratedImage.new(@user).social_image %>" >
<%= auto_discovery_link_tag(:rss, "https://dev.to/feed/#{@user.username}", {title: "The Practical Dev RSS Feed"}) %>
<% elsif @tag.present? %>
<% title "#{@tag}#{ " - top this #{params[:timeframe]}" if params[:timeframe].present? }" %>
<link rel="canonical" href="https://dev.to/t/<%= @tag %>"/>
<meta name="description" content="<%= @tag %> content on dev.to">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="https://dev.to/t/<%= @tag %>" />
<meta property="og:title" content="<%= @tag %><%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %> - The DEV Community" />
<meta property="og:description" content="<%= @tag %> content on dev.to" />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:creator" content="@<%=@tag %>">
<meta name="twitter:title" content="<%= @tag %><%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %> - The DEV Community">
<meta name="twitter:description" content="<%= @tag %> content on dev.to">
<% if @tag_model %>
<meta name="twitter:card" content="summary_large_image">
<meta property="og:image" content="<%= GeneratedImage.new(@tag_model).social_image %>" >
<meta name="twitter:image:src" content="<%= GeneratedImage.new(@tag_model).social_image %>" >
<% else %>
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:card" content="summary_large_image">
<% end %>
<% elsif @query.present? %>
<% title "Search Results" %>
<link rel="canonical" href="https://dev.to/search"/>
<meta name="description" content="Where programmers share ideas and help each other grow.">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="DEV => Search Results" />
<meta property="og:title" content="The DEV Community" />
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta property="og:description" content="Where programmers share ideas and help each other grow." />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:title" content="DEV => Search Results">
<meta name="twitter:description" content="Where programmers share ideas, experiences, and help each other grow.">
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:card" content="summary_large_image">
<% elsif @podcast_index %>
<%= render "podcast_episodes/meta" %>
<% else %>
<% if params[:timeframe].present? %>
<% title "DEV Community 👩‍💻👨‍💻 - top posts this #{params[:timeframe]}" %>
<% else %>
<% title "DEV Community 👩‍💻👨‍💻 - Where software engineers connect, build their resumes, and grow." %>
<% end %>
<link rel="canonical" href="https://dev.to<%= request.path %>"/>
<meta name="description" content="Where programmers share ideas and help each other grow.">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<link rel="canonical" href="https://dev.to<%= request.path %>"/>
<meta name="description" content="Where programmers share ideas and help each other grow.">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="https://dev.to<%= request.path %>" />
<meta property="og:title" content="The DEV Community<%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %>" />
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta property="og:description" content="Where programmers share ideas and help each other grow." />
<meta property="og:site_name" content="The DEV Community" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://dev.to<%= request.path %>" />
<meta property="og:title" content="The DEV Community<%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %>" />
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta property="og:description" content="Where programmers share ideas and help each other grow." />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:title" content="The DEV Community<%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %>">
<meta name="twitter:description" content="Where programmers share ideas, experiences, and help each other grow.">
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:card" content="summary_large_image">
<%= auto_discovery_link_tag(:rss, "https://dev.to/feed", {title: "The Practical Dev RSS Feed"}) %>
<% end %>
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:title" content="The DEV Community<%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %>">
<meta name="twitter:description" content="Where programmers share ideas, experiences, and help each other grow.">
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:card" content="summary_large_image">
<%= auto_discovery_link_tag(:rss, "https://dev.to/feed", {title: "The Practical Dev RSS Feed"}) %>
<% end %>
<% if @user %>
<style>
.widget header{
color: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.88) %>;
}
<% if user_colors(@user)[:bg].downcase.start_with?("#fff") %>
.user-profile-follow-button {
border: 1px solid <%= user_colors(@user)[:text] %> !important;
}
<% end %>
</style>
<div class="user-profile-header" style="<%= user_colors_style(@user) %>" itemscope itemtype="http://schema.org/Person" itemprop="mainEntityOfPage">
<meta itemprop="url" content="https://dev.to/<%=@user.username%>">
<div class="user-profile-header-container">
<div class="profile-pic-wrapper">
<img class="profile-pic" src="<%= ProfileImage.new(@user).get(320) %>" itemprop="image" alt="<%= @user.username %> profile" style="border-color:<%=user_colors(@user)[:bg] %>;background:<%=user_colors(@user)[:bg] %>"/>
</div>
<div class="profile-details">
<h1 style="color:<%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %>"><span itemprop="name"><%= @user.name %></span>
<span class="user-profile-follow-button-wrapper">
<button id="user-follow-butt" class="cta follow-action-button user-profile-follow-button" style="color:<%= user_colors(@user)[:text] %>;background-color:<%=user_colors(@user)[:bg] %>" data-info='{"id":<%= @user.id%>,"className":"<%= @user.class.name %>"}'>&nbsp;</button>
</span>
</h1>
<p class="profile-description" itemprop="description">
<%= @user.summary.present? ? @user.summary : ["404 bio not found"].sample %>
</p>
<style>
.profile-details .social .icon-img path{
fill: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %> !important;
}
</style>
<p class="social">
<% if @user.twitter_username.present? %>
<a href="https://twitter.com/<%= @user.twitter_username %>" target="_blank" rel="noopener me">
<%= inline_svg("twitter-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.github_username.present? %>
<a href="https://github.com/<%= @user.github_username %>" target="_blank" rel="noopener me">
<%= inline_svg("github-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.class.name == "User" %>
<% if @user.mastodon_url.present? %>
<a href="<%= @user.mastodon_url %>" target="_blank" rel="noopener">
<%= inline_svg("mastodon-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.facebook_url.present? %>
<a href="<%= @user.facebook_url %>" target="_blank" rel="noopener me">
<%= inline_svg("facebook-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.linkedin_url.present? %>
<a href="<%= @user.linkedin_url %>" target="_blank" rel="noopener me">
<%= inline_svg("linkedin_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.behance_url.present? %>
<a href="<%= @user.behance_url %>" target="_blank" rel="noopener me">
<%= inline_svg("behance_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.stackoverflow_url.present? %>
<a href="<%= @user.stackoverflow_url %>" target="_blank" rel="noopener me">
<%= inline_svg("stackoverflow-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.dribbble_url.present? %>
<a href="<%= @user.dribbble_url %>" target="_blank" rel="noopener me">
<%= inline_svg("dribbble_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.medium_url.present? %>
<a href="<%= @user.medium_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("medium_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.gitlab_url.present? %>
<a href="<%= @user.gitlab_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("gitlab.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.website_url.present? %>
<a href="<%= @user.website_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("external-link-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% end %>
</p>
</div>
</div>
<%= render "articles/user_metadata", context: "profile" %>
</div>
<% elsif @tag %>
<style>
.tag-header{
border: 2px solid <%= HexComparer.new([@tag_model.bg_color_hex || "#0000000",@tag_model.text_color_hex || "#ffffff"]).brightness(0.88) %>;
box-shadow: 5px 6px 0px <%= HexComparer.new([@tag_model.bg_color_hex || "#0000000",@tag_model.text_color_hex || "#ffffff"]).brightness(0.88) %>;
}
</style>
<div class="user-profile-header tag-header">
<div class="tag-or-query-header-container">
<h1>
<% if @tag_model && @tag_model.pretty_name.present? %>
<%= @tag_model.pretty_name %>
<% else %>
<%= @tag %>
<% end %>
<% if @tag_model %>
<span class="user-profile-follow-button-wrapper">
<button id="user-follow-butt" class="cta follow-action-button user-profile-follow-button" style="color:<%=@tag_model.text_color_hex %>;background-color:<%=@tag_model.bg_color_hex %>" data-info='{"id":<%= @tag_model.id%>,"className":"Tag"}'>&nbsp;</button>
</span>
<% end %>
</h1>
</div>
</div>
<% elsif @query %>
<div id="query-wrapper"></div>
<% elsif @podcast_index %>
<% if @podcast %>
<div class="user-profile-header tag-header podcast-header" style="background:#<%= @podcast.main_color_hex %> url(<%= cl_image_path(@podcast.pattern_image_url || "https://i.imgur.com/fKYKgo4.png",
:type=>"fetch",
:quality => "auto",
:sign_url => true,
:flags => "progressive",
:fetch_format => "jpg") %>);color:white;">
<div class="tag-or-query-header-container">
<h1><img class="record" src="<%=cl_image_path(@podcast.image_url,
:type=>"fetch",
:crop => "fill",
:width => 420,
:height => 420,
:quality => "auto",
:sign_url => true,
:flags => "progressive",
:fetch_format => "auto",
:class => "main-image")
%>"
alt="<%= @podcast.title %>" /> <%= @podcast.title %></h1>
</div>
<%= render "podcast_episodes/subscribe_buttons" %>
</div>
<% else %>
<div class="user-profile-header tag-header">
<div class="tag-or-query-header-container">
<h1>Podcasts</h1>
</div>
</div>
<% end %>
<% end %>
<div class="home <%= "sub-home" if (@user || @tag || @query)%>" id="index-container"
<div class="home" id="index-container"
data-params="<%= params.to_json(only: [:tag,:username,:q]) %>" data-which="<%=@list_of%>"
data-algolia-tag="<%= @user ? "#{@user.class.name.downcase}_#{@user.id}" : nil || @tag %>"
data-feed="<%= params[:timeframe] || "base-feed"%>"
@ -251,83 +30,55 @@
>
<%= render "articles/sidebar" %>
<div class="articles-list" id="articles-list">
<% if @home_page || @tag %>
<% if @tag_model && @tag_model.supported %>
<style>
.nav-chronofiter-link.selected {
background: <%= @tag_model.bg_color_hex %> !important;
color: <%= @tag_model.text_color_hex %> !important;
box-shadow: 3px 4px 0px <%= HexComparer.new([@tag_model.bg_color_hex || "#ffffff"], 4).accent %> !important;
border: 1px solid <%= HexComparer.new([@tag_model.bg_color_hex || "#ffffff"], 4).accent %> !important;
}
.narrow-nav-menu a.selected {
color: <%= @tag_model.text_color_hex %> !important;
background: <%= @tag_model.bg_color_hex %> !important;
}
.on-page-nav-controls .separator {
border-color: <%= HexComparer.new([@tag_model.bg_color_hex || "#ffffff"], 4).accent %> !important;
}
</style>
<% end %>
<div class="on-page-nav-controls" id="on-page-nav-controls">
<div class="on-page-nav-label <%= "sub-home-nav" if (@user || @tag || @query)%>">
<div class="wide-nav-links">
<a class="nav-chronofiter-link <%= 'selected' if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>" href="<%= list_path %>/">
FEED
</a>
<span class="separator"></span>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('week') %>" href="<%= list_path %>/top/week">
WEEK
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('month') %>" href="<%= list_path %>/top/month">
MONTH
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('year') %>" href="<%= list_path %>/top/year">
YEAR
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('infinity') %>" href="<%= list_path %>/top/infinity">
INFINITY
</a>
<span class="separator"></span>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('latest') %>" href="<%= list_path %>/latest">
LATEST
</a>
</div>
<div class="narrow-nav-select" aria-label="feed-filter-select">
<% if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>
<button id="narrow-feed-butt">&lt;MY DEV FEED&gt;</button>
<% elsif timeframe_check('week') %>
<button id="narrow-feed-butt">&lt;PAST WEEK&gt;</button>
<% elsif timeframe_check('month') %>
<button id="narrow-feed-butt">&lt;PAST MONTH&gt;</button>
<% elsif timeframe_check('year') %>
<button id="narrow-feed-butt">&lt;PAST YEAR&gt;</button>
<% elsif timeframe_check('infinity') %>
<button id="narrow-feed-butt">&lt;INFINITY&gt;</button>
<% elsif timeframe_check('latest') %>
<button id="narrow-feed-butt">&lt;LATEST&gt;</button>
<% end %>
</div>
<div class="on-page-nav-controls" id="on-page-nav-controls">
<div class="on-page-nav-label <%= "sub-home-nav" if (@user || @tag || @query)%>">
<div class="wide-nav-links">
<a class="nav-chronofiter-link <%= 'selected' if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>" href="<%= list_path %>/">
FEED
</a>
<span class="separator"></span>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('week') %>" href="<%= list_path %>/top/week">
WEEK
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('month') %>" href="<%= list_path %>/top/month">
MONTH
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('year') %>" href="<%= list_path %>/top/year">
YEAR
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('infinity') %>" href="<%= list_path %>/top/infinity">
INFINITY
</a>
<span class="separator"></span>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('latest') %>" href="<%= list_path %>/latest">
LATEST
</a>
</div>
<div class="narrow-nav-select" aria-label="feed-filter-select">
<% if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>
<button id="narrow-feed-butt">&lt;MY DEV FEED&gt;</button>
<% elsif timeframe_check('week') %>
<button id="narrow-feed-butt">&lt;PAST WEEK&gt;</button>
<% elsif timeframe_check('month') %>
<button id="narrow-feed-butt">&lt;PAST MONTH&gt;</button>
<% elsif timeframe_check('year') %>
<button id="narrow-feed-butt">&lt;PAST YEAR&gt;</button>
<% elsif timeframe_check('infinity') %>
<button id="narrow-feed-butt">&lt;INFINITY&gt;</button>
<% elsif timeframe_check('latest') %>
<button id="narrow-feed-butt">&lt;LATEST&gt;</button>
<% end %>
</div>
<button class="on-page-nav-butt on-page-nav-butt-left" id="on-page-nav-butt-left" aria-label="nav-button-left">
<img src="<%= asset_path 'stack.svg' %>" alt="left-sidebar-nav">
</button>
<button class="on-page-nav-butt on-page-nav-butt-right" id="on-page-nav-butt-right" aria-label="nav-button-right">
<img src="<%= asset_path 'lightning.svg' %>" alt="right-sidebar-nav">
</button>
</div>
<% end %>
<% if @user && @user.class.name == "User" %>
<div class="on-page-nav-controls user-nav-controls" id="on-page-nav-controls">
<button class="on-page-nav-butt on-page-nav-butt-left" id="on-page-nav-butt-left" aria-label="nav-button-left">
<img src="<%= asset_path 'stack.svg' %>" alt="left-sidebar-nav">
</button>
<button class="on-page-nav-butt on-page-nav-butt-right" style="margin-top:-1px;" id="on-page-nav-butt-right" aria-label="nav-button-right">
<img style="height:28px;width:28px;" src="<%= asset_path 'ribbon.svg' %>" alt="right-sidebar-nav">
</button>
</div>
<% end %>
<% if @user.blank? && @tag.blank? && @featured_story.id %>
<button class="on-page-nav-butt on-page-nav-butt-left" id="on-page-nav-butt-left" aria-label="nav-button-left">
<img src="<%= asset_path 'stack.svg' %>" alt="left-sidebar-nav">
</button>
<button class="on-page-nav-butt on-page-nav-butt-right" id="on-page-nav-butt-right" aria-label="nav-button-right">
<img src="<%= asset_path 'lightning.svg' %>" alt="right-sidebar-nav">
</button>
</div>
<% if @featured_story.id %>
<div id="featured-story-marker" data-featured-article="articles-<%= @featured_story.id %>"></div>
<img src="<%=cloud_cover_url(@featured_story.main_image) %>" style="display:none" alt="<%= @featured_story.title %>"/>
<a href="<%=@featured_story.path%>" id="article-link-<%=@featured_story.id%>" class="index-article-link" aria-label="Main Story" data-featured-article="articles-<%= @featured_story.id %>">
@ -374,18 +125,8 @@
</a>
<% end %>
<div class="substories" id="substories">
<% if @query %>
<div class="query-results-nothing">
<div class="query-results-loader"></div>
<br/>
</div>
<% end %>
<% if params[:view] == "comments" %>
<%= render "articles/comments_section" %>
<% elsif (@stories && @stories.any?) || (@comments && @comments.any?) %>
<%= render "articles/main_stories_feed" %>
<% elsif @podcast_episodes %>
<%= render "articles/podcast_episodes_feed" %>
<% if (@stories && @stories.any?) || (@comments && @comments.any?) %>
<%= render "stories/main_stories_feed" %>
<% end %>
</div>
<div class="loading-articles" id="loading-articles">
@ -394,43 +135,6 @@
</div>
<%= render "articles/sidebar_additional" %>
</div>
<% if @query.present? %>
<%= render "articles/algolia_search" %>
<% end %>
<div class="narrow-nav-menu" id="narrow-nav-menu" aria-label="feed-nav-menu">
<a href="<%= list_path %>/" class="<%= 'selected' if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>">&lt;MY DEV FEED&gt;</a>
<a href="<%= list_path %>/top/week" class="<%= 'selected' if timeframe_check('week') %>">&lt;PAST WEEK&gt;</a>
<a href="<%= list_path %>/top/month" class="<%= 'selected' if timeframe_check('month') %>">&lt;PAST MONTH&gt;</a>
<a href="<%= list_path %>/top/year" class="<%= 'selected' if timeframe_check('year') %>">&lt;PAST YEAR&gt;</a>
<a href="<%= list_path %>/top/infinity" class="<%= 'selected' if timeframe_check('infinity') %>">&lt;INFINITY&gt;</a>
<a href="<%= list_path %>/latest" class="<%= 'selected' if timeframe_check('latest') %>">&lt;LATEST&gt;</a>
</div>
<script defer>
var isTouchDevice = ('ontouchstart' in window || navigator.maxTouchPoints > 0);
if (isTouchDevice) {
function hasClass(el, cls) {
return el.className && new RegExp("(\\s|^)" + cls + "(\\s|$)").test(el.className);
}
var activeLinks = document.getElementsByClassName('active');
Array.prototype.forEach.call(activeLinks, function(el) { el.classList.remove("active"); });
document.getElementById('articles-list').addEventListener('click', function(event) {
var clickedEl = event.target;
if (hasClass(clickedEl,"bm-initial") || hasClass(clickedEl,"bm-success")){
//do nothing
}
else if (hasClass(clickedEl.parentNode,"single-article")) {
clickedEl.parentNode.classList.add('active');
}
else if (hasClass(clickedEl.parentNode.parentNode,"single-article")) {
clickedEl.parentNode.parentNode.classList.add('active');
}
else if (hasClass(clickedEl.parentNode.parentNode.parentNode,"single-article")) {
clickedEl.parentNode.parentNode.parentNode.classList.add('active');
}
});
}
</script>
<%= render "stories/narrow_nav_menu" %>
<%= render "stories/stories_list_script" %>

31
app/views/articles/search.html.erb Normal file
View file

@ -0,0 +1,31 @@
<%= content_for :page_meta do %>
<%= render "articles/search/meta" %>
<% end %>
<div id="query-wrapper"></div>
<div class="home sub-home" id="index-container"
data-params="<%= params.to_json(only: [:tag,:username,:q]) %>" data-which="<%=@list_of%>"
data-algolia-tag=""
data-feed="<%= params[:timeframe] || "base-feed"%>"
data-articles-since="<%= Timeframer.new(params[:timeframe]).datetime.to_i %>"
>
<%= render "articles/search/sidebar" %>
<div class="articles-list" id="articles-list">
<div class="substories" id="substories">
<div class="query-results-nothing">
<div class="query-results-loader"></div>
<br/>
</div>
<% if (@stories && @stories.any?) || (@comments && @comments.any?) %>
<%= render "stories/main_stories_feed" %>
<% end %>
</div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
</div>
<%= render "articles/search/sidebar_additional" %>
</div>
<%= render "articles/algolia_search" %>
<%= render "stories/narrow_nav_menu" %>
<%= render "stories/stories_list_script" %>

17
app/views/articles/search/_meta.html.erb Normal file
View file

@ -0,0 +1,17 @@
<% title "Search Results" %>
<link rel="canonical" href="https://dev.to/search"/>
<meta name="description" content="Where programmers share ideas and help each other grow.">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="DEV => Search Results" />
<meta property="og:title" content="The DEV Community" />
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta property="og:description" content="Where programmers share ideas and help each other grow." />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:title" content="DEV => Search Results">
<meta name="twitter:description" content="Where programmers share ideas, experiences, and help each other grow.">
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:card" content="summary_large_image">

17
app/views/articles/search/_sidebar.html.erb Normal file
View file

@ -0,0 +1,17 @@
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
<div class="sidebar-bg" id="sidebar-bg-left"></div>
<div class="side-bar">
<div class="widget fixed-widget">
<header>
search results
</header>
<div class="widget-body" style="margin-bottom:16px;">
<a class="query-filter-button" data-filter="class_name:Article">POSTS</a>
<a class="query-filter-button" data-filter="class_name:PodcastEpisode">PODCASTS</a>
<a class="query-filter-button" data-filter="class_name:User">PEOPLE</a>
<hr style="opacity:0.2" />
<a class="query-filter-button my-posts-query-button" data-filter="MY_POSTS">ONLY MY POSTS</a>
</div>
</div>
</div>
</div>

5
app/views/articles/search/_sidebar_additional.html.erb Normal file
View file

@ -0,0 +1,5 @@
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
<div class="sidebar-bg" id="sidebar-bg-right"></div>
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
</div>
</div>

112
app/views/articles/tag_index.html.erb Normal file
View file

@ -0,0 +1,112 @@
<%= content_for :page_meta do %>
<%= render "articles/tags/meta" %>
<% end %>
<style>
.tag-header{
border: 2px solid <%= HexComparer.new([@tag_model.bg_color_hex || "#0000000",@tag_model.text_color_hex || "#ffffff"]).brightness(0.88) %>;
box-shadow: 5px 6px 0px <%= HexComparer.new([@tag_model.bg_color_hex || "#0000000",@tag_model.text_color_hex || "#ffffff"]).brightness(0.88) %>;
}
</style>
<div class="user-profile-header tag-header">
<div class="tag-or-query-header-container">
<h1>
<% if @tag_model && @tag_model.pretty_name.present? %>
<%= @tag_model.pretty_name %>
<% else %>
<%= @tag %>
<% end %>
<% if @tag_model %>
<span class="user-profile-follow-button-wrapper">
<button id="user-follow-butt" class="cta follow-action-button user-profile-follow-button" style="color:<%=@tag_model.text_color_hex %>;background-color:<%=@tag_model.bg_color_hex %>" data-info='{"id":<%= @tag_model.id%>,"className":"Tag"}'>&nbsp;</button>
</span>
<% end %>
</h1>
</div>
</div>
<div class="home sub-home" id="index-container"
data-params="<%= params.to_json(only: [:tag,:username,:q]) %>" data-which=""
data-algolia-tag="<%= @tag %>"
data-feed="<%= params[:timeframe] || "base-feed"%>"
data-articles-since="<%= Timeframer.new(params[:timeframe]).datetime.to_i %>"
>
<%= render "articles/tags/sidebar" %>
<div class="articles-list" id="articles-list">
<% if @tag_model && @tag_model.supported %>
<style>
.nav-chronofiter-link.selected {
background: <%= @tag_model.bg_color_hex %> !important;
color: <%= @tag_model.text_color_hex %> !important;
box-shadow: 3px 4px 0px <%= HexComparer.new([@tag_model.bg_color_hex || "#ffffff"], 4).accent %> !important;
border: 1px solid <%= HexComparer.new([@tag_model.bg_color_hex || "#ffffff"], 4).accent %> !important;
}
.narrow-nav-menu a.selected {
color: <%= @tag_model.text_color_hex %> !important;
background: <%= @tag_model.bg_color_hex %> !important;
}
.on-page-nav-controls .separator {
border-color: <%= HexComparer.new([@tag_model.bg_color_hex || "#ffffff"], 4).accent %> !important;
}
</style>
<% end %>
<div class="on-page-nav-controls" id="on-page-nav-controls">
<div class="on-page-nav-label <%= "sub-home-nav" if (@user || @tag || @query)%>">
<div class="wide-nav-links">
<a class="nav-chronofiter-link <%= 'selected' if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>" href="<%= list_path %>/">
FEED
</a>
<span class="separator"></span>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('week') %>" href="<%= list_path %>/top/week">
WEEK
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('month') %>" href="<%= list_path %>/top/month">
MONTH
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('year') %>" href="<%= list_path %>/top/year">
YEAR
</a>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('infinity') %>" href="<%= list_path %>/top/infinity">
INFINITY
</a>
<span class="separator"></span>
<a class="nav-chronofiter-link <%= 'selected' if timeframe_check('latest') %>" href="<%= list_path %>/latest">
LATEST
</a>
</div>
<div class="narrow-nav-select" aria-label="feed-filter-select">
<% if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>
<button id="narrow-feed-butt">&lt;MY DEV FEED&gt;</button>
<% elsif timeframe_check('week') %>
<button id="narrow-feed-butt">&lt;PAST WEEK&gt;</button>
<% elsif timeframe_check('month') %>
<button id="narrow-feed-butt">&lt;PAST MONTH&gt;</button>
<% elsif timeframe_check('year') %>
<button id="narrow-feed-butt">&lt;PAST YEAR&gt;</button>
<% elsif timeframe_check('infinity') %>
<button id="narrow-feed-butt">&lt;INFINITY&gt;</button>
<% elsif timeframe_check('latest') %>
<button id="narrow-feed-butt">&lt;LATEST&gt;</button>
<% end %>
</div>
</div>
<button class="on-page-nav-butt on-page-nav-butt-left" id="on-page-nav-butt-left" aria-label="nav-button-left">
<img src="<%= asset_path 'stack.svg' %>" alt="left-sidebar-nav">
</button>
<button class="on-page-nav-butt on-page-nav-butt-right" id="on-page-nav-butt-right" aria-label="nav-button-right">
<img src="<%= asset_path 'lightning.svg' %>" alt="right-sidebar-nav">
</button>
</div>
<div class="substories" id="substories">
<% if (@stories && @stories.any?) || (@comments && @comments.any?) %>
<%= render "stories/main_stories_feed" %>
<% end %>
</div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
</div>
<%= render "articles/tags/sidebar_additional" %>
</div>
<%= render "stories/narrow_nav_menu" %>
<%= render "stories/stories_list_script" %>

25
app/views/articles/tags/_meta.html.erb Normal file
View file

@ -0,0 +1,25 @@
<% title "#{@tag}#{ " - top this #{params[:timeframe]}" if params[:timeframe].present? }" %>
<link rel="canonical" href="https://dev.to/t/<%= @tag %>"/>
<meta name="description" content="<%= @tag %> content on dev.to">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="https://dev.to/t/<%= @tag %>" />
<meta property="og:title" content="<%= @tag %><%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %> - The DEV Community" />
<meta property="og:description" content="<%= @tag %> content on dev.to" />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:creator" content="@<%=@tag %>">
<meta name="twitter:title" content="<%= @tag %><%= " - top this #{params[:timeframe]}" if params[:timeframe].present? %> - The DEV Community">
<meta name="twitter:description" content="<%= @tag %> content on dev.to">
<% if @tag_model %>
<meta name="twitter:card" content="summary_large_image">
<meta property="og:image" content="<%= GeneratedImage.new(@tag_model).social_image %>" >
<meta name="twitter:image:src" content="<%= GeneratedImage.new(@tag_model).social_image %>" >
<% else %>
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/g355ol6qsrg0j2mhngz9.png" >
<meta name="twitter:card" content="summary_large_image">
<% end %>

67
app/views/articles/tags/_sidebar.html.erb Normal file
View file

@ -0,0 +1,67 @@
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
<div class="sidebar-bg" id="sidebar-bg-left"></div>
<div class="side-bar">
<% if @tag_model && @tag_model.short_summary.present? %>
<div class="widget">
<header>
#<%= @tag %> 👋
</header>
<div class="widget-body">
<%= @tag_model.short_summary.html_safe %>
</div>
</div>
<% end %>
<% if @tag_model && @tag_model.rules_html.present? %>
<div class="widget">
<header>
submission guidelines
</header>
<div class="widget-body">
<%= @tag_model.rules_html.html_safe %>
<a class="cta cta-button" href="/new/<%= @tag %>" >
WRITE A POST
</a>
</div>
</div>
<% end %>
<% if @tag_model && @tag_model.wiki_body_html.present? %>
<div class="widget">
<header>
about #<%= @tag %>
</header>
<div class="widget-body">
<%= @tag_model.wiki_body_html.html_safe %>
</div>
</div>
<% end %>
<% if @tag == "javascript" %>
<div class="widget sponsorship-widget <%= "showing" unless user_signed_in? %>" id="sponsorship-widget">
<header>
<a href="/sponsors">community sponsors</a>
<span class="emoji">
<img alt="emoji heart" src="<%= asset_path "emoji/emoji-one-heart.png" %>" />
</span>
</header>
<div class="widget-body">
<div class="sidebar-sponsor">
<a class="partner-link" href="https://developer.jwplayer.com/jw-player/demos/?utm_source=dev.to" target="_blank" data-details="jwplayer__image">
<img src="<%= cloudinary("https://thepracticaldev.s3.amazonaws.com/i/lc2gkdj9dbmkul4z26g0.png") %>" style="margin-bottom:8px;" alt="Cloudinary K" />
</a>
<div class="sponsor-tagline" style="display:inline;">
The Most Powerful & Flexible JavaScript Video API.
<a class="partner-link sponsor-learn-more" href="https://developer.jwplayer.com/jw-player/demos/?utm_source=dev.to" target="_blank" data-details="jwplayer__learn-more">
Learn More
</a>
</div>
</div>
</div>
</div>
<% end %>
<div class="sidebar-data">
<div>
<%= pluralize Article.tagged_with(@tag).where(published: true).size, "Post" %> Published
</div>
</div>
</div>
</div>

44
app/views/articles/tags/_sidebar_additional.html.erb Normal file
View file

@ -0,0 +1,44 @@
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
<div class="sidebar-bg" id="sidebar-bg-right"></div>
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
<% if Article.active_threads([@tag,"discuss"], Timeframer.new(params[:timeframe]).datetime).any? %>
<div class="widget">
<header>
#discuss
</header>
<div class="widget-body">
<div class="widget-link-list">
<% Article.active_threads([@tag,"discuss"], Timeframer.new(params[:timeframe]).datetime).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: true %>
<% end %>
</div>
</div>
</div>
<% end %>
<% if user_signed_in? %>
<%= javascript_pack_tag "sidebarWidget", defer: true %>
<div id="sidebarWidget__pack" data-tag-info="<%= @tag_model.attributes.slice("id", "text_color_hex", "bg_color_hex", "name").to_json %>">
</div>
<% else %>
<% cache("seo-boostable-posts-for-tag#{@tag}", :expires_in => 18.hours) do %>
<% @boostable_posts = Article.seo_boostable(@tag) %>
<% if @boostable_posts.any? %>
<div class="widget">
<header>
trending guides/resources
</header>
<div class="widget-body">
<div class="widget-link-list">
<% @boostable_posts.first(8).
each do |plucked_article| %>
<%= render "articles/widget_list_item", plucked_article: plucked_article, show_comment_count: false %>
<% end %>
</div>
</div>
</div>
<% end %>
<% end %>
<% end %>
</div>
</div>

0
app/views/homepage/index.html.erb Normal file
View file

25
app/views/organizations/_sidebar.html.erb Normal file
View file

@ -0,0 +1,25 @@
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
<div class="sidebar-bg" id="sidebar-bg-left"></div>
<div class="side-bar">
<% if @organization.story.present? %>
<div class="widget">
<header>
our story
</header>
<div class="widget-body">
<%= sanitized_sidebar @organization.story %>
</div>
</div>
<% end %>
<% if @organization.tech_stack.present? %>
<div class="widget">
<header>
our stack
</header>
<div class="widget-body">
<%= sanitized_sidebar @organization.tech_stack %>
</div>
</div>
<% end %>
</div>
</div>

21
app/views/organizations/_sidebar_additional.html.erb Normal file
View file

@ -0,0 +1,21 @@
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
<div class="sidebar-bg" id="sidebar-bg-right"></div>
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
<% if @organization.users.any? %>
<div class="widget">
<div class="widget-suggested-follows-container">
<header>meet the team</header>
<div class="widget-body">
<% @organization.users.each do |user| %>
<div class="widget-user-pic">
<a href="/<%= user.username %>">
<img src="<%= ProfileImage.new(user).get(90) %>" />
</a>
</div>
<% end %>
</div>
</div>
</div>
<% end %>
</div>
</div>

26
app/views/organizations/show.html.erb Normal file
View file

@ -0,0 +1,26 @@
<%= content_for :page_meta do %>
<%= render "users/meta" %>
<% end %>
<%= render "users/profile_header" %>
<div class="home sub-home" id="index-container"
data-params="<%= params.to_json(only: [:tag,:username,:q]) %>" data-which="<%=@list_of%>"
data-algolia-tag="<%= "organization_#{@organization.id}" %>"
data-feed="<%= params[:timeframe] || "base-feed"%>"
data-articles-since="<%= Timeframer.new(params[:timeframe]).datetime.to_i %>"
>
<%= render "organizations/sidebar" %>
<div class="articles-list" id="articles-list">
<div class="substories" id="substories">
<% if (@stories && @stories.any?) || (@comments && @comments.any?) %>
<%= render "stories/main_stories_feed" %>
<% end %>
</div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
</div>
<%= render "organizations/sidebar_additional" %>
</div>
<%= render "stories/narrow_nav_menu" %>
<%= render "stories/stories_list_script" %>

23
app/views/podcast_episodes/_episodes_feed.html.erb Normal file
View file

@ -0,0 +1,23 @@
<% @podcast_episodes.each_with_index do |episode,i| %>
<a href="<%=episode.path%>" class="small-pic-link-wrapper" id="article-link-<%= episode.id %>">
<div class="single-article single-article-small-pic">
<div class="small-pic">
<%=cl_image_tag(episode.image_url || episode.podcast.image_url,
:type=>"fetch",
:crop => "imagga_scale",
:width => 240,
:height => 240,
:quality => "auto",
:flags => "progressive",
:fetch_format => "auto",
:sign_url => true) %>
</div>
<div class="content">
<h3><span class="tag-identifier">podcast</span><%= episode.title %></h3>
</div>
<h4>
<%= episode.podcast.title %>
</h4>
</div>
</a>
<% end %>

36
app/views/podcast_episodes/_sidebar.html.erb Normal file
View file

@ -0,0 +1,36 @@
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
<div class="sidebar-bg" id="sidebar-bg-left"></div>
<div class="side-bar">
<% if @podcast_index && @podcasts %>
<div class="widget podcast-pic-widget">
<header>
&lt;ALL SHOWS&gt;
</header>
<div class="widget-body">
<% @podcasts.each do |podcast| %>
<a href="/<%= podcast.slug %>">
<span class="podcast-pic" id="podcast-pic-<%=podcast.slug %>">
<img src="<%= cl_image_path(podcast.image_url,
:type=>"fetch",
:crop => "fill",
:width => 100,
:height => 100,
:flags => "progressive",
:quality => "auto",
:fetch_format => "auto",
:sign_url => true) %>"
alt="<%= podcast.title %>" />
<div class="podcast-name">
<div class="podcast-name-inner">
<%= podcast.title %>
</div>
</div>
</span>
</a>
<% end %>
</div>
</div>
<% elsif @podcast %>
<% end %>
</div>
</div>

5
app/views/podcast_episodes/_sidebar_additional.html.erb Normal file
View file

@ -0,0 +1,5 @@
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
<div class="sidebar-bg" id="sidebar-bg-right"></div>
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
</div>
</div>

56
app/views/podcast_episodes/index.html.erb Normal file
View file

@ -0,0 +1,56 @@
<%= content_for :page_meta do %>
<%= render "podcast_episodes/meta" %>
<% end %>
<% if @podcast %>
<div class="user-profile-header tag-header podcast-header" style="background:#<%= @podcast.main_color_hex %> url(<%= cl_image_path(@podcast.pattern_image_url || "https://i.imgur.com/fKYKgo4.png",
:type=>"fetch",
:quality => "auto",
:sign_url => true,
:flags => "progressive",
:fetch_format => "jpg") %>);color:white;">
<div class="tag-or-query-header-container">
<h1><img class="record" src="<%=cl_image_path(@podcast.image_url,
:type=>"fetch",
:crop => "fill",
:width => 420,
:height => 420,
:quality => "auto",
:sign_url => true,
:flags => "progressive",
:fetch_format => "auto",
:class => "main-image")
%>"
alt="<%= @podcast.title %>" /> <%= @podcast.title %></h1>
</div>
<%= render "podcast_episodes/subscribe_buttons" %>
</div>
<% else %>
<div class="user-profile-header tag-header">
<div class="tag-or-query-header-container">
<h1>Podcasts</h1>
</div>
</div>
<% end %>
<div class="home" id="index-container"
data-params="<%= params.to_json(only: [:tag,:username,:q]) %>" data-which="<%= @list_of %>"
data-algolia-tag=""
data-feed="<%= params[:timeframe] || "base-feed"%>"
data-articles-since="<%= Timeframer.new(params[:timeframe]).datetime.to_i %>"
>
<%= render "podcast_episodes/sidebar" %>
<div class="articles-list" id="articles-list">
<div class="substories" id="substories">
<% if @podcast_episodes %>
<%= render "podcast_episodes/episodes_feed" %>
<% end %>
</div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
</div>
<%= render "podcast_episodes/sidebar_additional" %>
</div>
<%= render "stories/narrow_nav_menu" %>
<%= render "stories/stories_list_script" %>

4
app/views/articles/_main_stories_feed.html.erb → app/views/stories/_main_stories_feed.html.erb
View file

@ -27,7 +27,7 @@
<% end %>
<%= render "articles/single_story", story: story %>
<% if i == 0 && @comments && @comments.size > 0 && @user %>
<%= render "articles/comments_section" %>
<%= render "users/comments_section" %>
<% end %>
<% end %>
<% else %>
@ -68,7 +68,7 @@
<% if @stories.length == 0 && @comments && @comments.size > 0 && @user %>
<%= render "articles/comments_section" %>
<%= render "users/comments_section" %>
<% end %>
<% if @stories.size > 1 %>
<div class="placeholder-div">

8
app/views/stories/_narrow_nav_menu.html.erb Normal file
View file

@ -0,0 +1,8 @@
<div class="narrow-nav-menu" id="narrow-nav-menu" aria-label="feed-nav-menu">
<a href="<%= list_path %>/" class="<%= 'selected' if ["week", "month", "year", "infinity", "latest"].exclude?(params[:timeframe]) %>">&lt;MY DEV FEED&gt;</a>
<a href="<%= list_path %>/top/week" class="<%= 'selected' if timeframe_check('week') %>">&lt;PAST WEEK&gt;</a>
<a href="<%= list_path %>/top/month" class="<%= 'selected' if timeframe_check('month') %>">&lt;PAST MONTH&gt;</a>
<a href="<%= list_path %>/top/year" class="<%= 'selected' if timeframe_check('year') %>">&lt;PAST YEAR&gt;</a>
<a href="<%= list_path %>/top/infinity" class="<%= 'selected' if timeframe_check('infinity') %>">&lt;INFINITY&gt;</a>
<a href="<%= list_path %>/latest" class="<%= 'selected' if timeframe_check('latest') %>">&lt;LATEST&gt;</a>
</div>

26
app/views/stories/_stories_list_script.html.erb Normal file
View file

@ -0,0 +1,26 @@
<script defer>
var isTouchDevice = ('ontouchstart' in window || navigator.maxTouchPoints > 0);
if (isTouchDevice) {
function hasClass(el, cls) {
return el.className && new RegExp("(\\s|^)" + cls + "(\\s|$)").test(el.className);
}
var activeLinks = document.getElementsByClassName('active');
Array.prototype.forEach.call(activeLinks, function(el) { el.classList.remove("active"); });
document.getElementById('articles-list').addEventListener('click', function(event) {
var clickedEl = event.target;
if (hasClass(clickedEl,"bm-initial") || hasClass(clickedEl,"bm-success")){
//do nothing
}
else if (hasClass(clickedEl.parentNode,"single-article")) {
clickedEl.parentNode.classList.add('active');
}
else if (hasClass(clickedEl.parentNode.parentNode,"single-article")) {
clickedEl.parentNode.parentNode.classList.add('active');
}
else if (hasClass(clickedEl.parentNode.parentNode.parentNode,"single-article")) {
clickedEl.parentNode.parentNode.parentNode.classList.add('active');
}
});
}
</script>

0
app/views/articles/_comments_section.html.erb → app/views/users/_comments_section.html.erb
View file

18
app/views/users/_meta.html.erb Normal file
View file

@ -0,0 +1,18 @@
<link rel="canonical" href="https://dev.to/<%= @user.username %>"/>
<meta name="description" content="<%= @user.summary %>">
<meta name="keywords" content="software development,engineering,rails,javascript,ruby">
<meta property="og:type" content="website" />
<meta property="og:url" content="https://dev.to/<%= @user.username %>" />
<meta property="og:title" content="<%= @user.name %> — - DEV Profile" />
<meta property="og:image" content="<%= GeneratedImage.new(@user).social_image %>" >
<meta property="og:description" content="<%= @user.summary %>" />
<meta property="og:site_name" content="The DEV Community" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@ThePracticalDev">
<meta name="twitter:creator" content="@<%=@user.twitter_username %>">
<meta name="twitter:title" content="<%= @user.name %> — DEV Profile">
<meta name="twitter:description" content="<%= @user.summary %>">
<meta name="twitter:image:src" content="<%= GeneratedImage.new(@user).social_image %>" >
<%= auto_discovery_link_tag(:rss, "https://dev.to/feed/#{@user.username}", {title: "The Practical Dev RSS Feed"}) %>

93
app/views/users/_profile_header.html.erb Normal file
View file

@ -0,0 +1,93 @@
<style>
.widget header{
color: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.88) %>;
}
<% if user_colors(@user)[:bg].downcase.start_with?("#fff") %>
.user-profile-follow-button {
border: 1px solid <%= user_colors(@user)[:text] %> !important;
}
<% end %>
</style>
<div class="user-profile-header" style="<%= user_colors_style(@user) %>" itemscope itemtype="http://schema.org/Person" itemprop="mainEntityOfPage">
<meta itemprop="url" content="https://dev.to/<%=@user.username%>">
<div class="user-profile-header-container">
<div class="profile-pic-wrapper">
<img class="profile-pic" src="<%= ProfileImage.new(@user).get(320) %>" itemprop="image" alt="<%= @user.username %> profile" style="border-color:<%=user_colors(@user)[:bg] %>;background:<%=user_colors(@user)[:bg] %>"/>
</div>
<div class="profile-details">
<h1 style="color:<%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %>"><span itemprop="name"><%= @user.name %></span>
<span class="user-profile-follow-button-wrapper">
<button id="user-follow-butt" class="cta follow-action-button user-profile-follow-button" style="color:<%= user_colors(@user)[:text] %>;background-color:<%=user_colors(@user)[:bg] %>" data-info='{"id":<%= @user.id%>,"className":"<%= @user.class.name %>"}'>&nbsp;</button>
</span>
</h1>
<p class="profile-description" itemprop="description">
<%= @user.summary.present? ? @user.summary : ["404 bio not found"].sample %>
</p>
<style>
.profile-details .social .icon-img path{
fill: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %> !important;
}
</style>
<p class="social">
<% if @user.twitter_username.present? %>
<a href="https://twitter.com/<%= @user.twitter_username %>" target="_blank" rel="noopener me">
<%= inline_svg("twitter-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.github_username.present? %>
<a href="https://github.com/<%= @user.github_username %>" target="_blank" rel="noopener me">
<%= inline_svg("github-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.class.name == "User" %>
<% if @user.mastodon_url.present? %>
<a href="<%= @user.mastodon_url %>" target="_blank" rel="noopener">
<%= inline_svg("mastodon-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.facebook_url.present? %>
<a href="<%= @user.facebook_url %>" target="_blank" rel="noopener me">
<%= inline_svg("facebook-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.linkedin_url.present? %>
<a href="<%= @user.linkedin_url %>" target="_blank" rel="noopener me">
<%= inline_svg("linkedin_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.behance_url.present? %>
<a href="<%= @user.behance_url %>" target="_blank" rel="noopener me">
<%= inline_svg("behance_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.stackoverflow_url.present? %>
<a href="<%= @user.stackoverflow_url %>" target="_blank" rel="noopener me">
<%= inline_svg("stackoverflow-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.dribbble_url.present? %>
<a href="<%= @user.dribbble_url %>" target="_blank" rel="noopener me">
<%= inline_svg("dribbble_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.medium_url.present? %>
<a href="<%= @user.medium_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("medium_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.gitlab_url.present? %>
<a href="<%= @user.gitlab_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("gitlab.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.website_url.present? %>
<a href="<%= @user.website_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("external-link-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% end %>
</p>
</div>
</div>
<%= render "articles/user_metadata", context: "profile" %>
</div>

58
app/views/users/_sidebar.html.erb Normal file
View file

@ -0,0 +1,58 @@
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
<div class="sidebar-bg" id="sidebar-bg-left"></div>
<div class="side-bar">
<div class="user-sidebar">
<% if @user.mostly_work_with.present? %>
<div class="widget">
<header>
skills/languages
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.mostly_work_with %>
</div>
</div>
<% end %>
<% if @user.currently_learning.present? %>
<div class="widget">
<header>
learning/trying
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.currently_learning %>
</div>
</div>
<% end %>
<% if @user.currently_hacking_on.present? %>
<div class="widget">
<header>
projects and hacks
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.currently_hacking_on %>
</div>
</div>
<% end %>
<% if @user.available_for.present? %>
<div class="widget">
<header>
available for
</header>
<div class="widget-body">
<%= sanitized_sidebar @user.available_for %>
</div>
</div>
<% end %>
<div class="sidebar-data">
<div>
<%= pluralize @user.articles.where(published: true).size, "Post" %> Published
</div>
<div>
<%= pluralize @user.comments.where(deleted: false).size, "Comment" %> Written
</div>
<div>
<%= pluralize @user.decorate.cached_followed_tags.size, "Tag" %> Followed
</div>
</div>
</div>
</div>
</div>

27
app/views/users/_sidebar_additional.html.erb Normal file
View file

@ -0,0 +1,27 @@
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
<div class="sidebar-bg" id="sidebar-bg-right"></div>
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
<% @user.github_repos.where(featured: true).order({stargazers_count: :desc}, {name: :asc}).each do |repo| %>
<a class="widget" href="<%= repo.url %>" target="_blank">
<header>
<span class="emoji"><img src="<%= asset_path("github-logo.svg") %>" /></span><%= repo.name %>
</header>
<div class="widget-body">
<%= repo.description %>
<div class="widget-footer">
<% if repo.fork %>
<span class="widget-accent">fork</span>
<% end %>
<%= repo.language %>
<% if repo.stargazers_count.to_i > 0 %>
<img src="<%= asset_path("star.svg") %>" /> <%= repo.stargazers_count %>
<% end %>
</div>
</div>
</a>
<% end %>
<% if @user.badge_achievements_count > 0 %>
<%= render "articles/badges_area" %>
<% end %>
</div>
</div>

159
app/views/users/show.html.erb
View file

@ -1,43 +1,128 @@
<%= content_for :page_meta do %>
<%= render "users/meta" %>
<% end %>
<style>
.stories-index{
margin-top: 0px !important;
.widget header{
color: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.88) %>;
}
.profile-pic{
border-radius: 1000px;
width: 200px;
border: 3px solid #888;
float: left;
}
header{
padding: 20px;
overflow: hidden;
}
.profile-info{
float: left;
}
header h1{
padding-left: 20px;
font-size: 2.5em;
}
<% if user_colors(@user)[:bg].downcase.start_with?("#fff") %>
.user-profile-follow-button {
border: 1px solid <%= user_colors(@user)[:text] %> !important;
}
<% end %>
</style>
<% title @user.name + " — DEV Profile on dev.to" %>
<div class="user-profile-header" style="<%= user_colors_style(@user) %>" itemscope itemtype="http://schema.org/Person" itemprop="mainEntityOfPage">
<meta itemprop="url" content="https://dev.to/<%=@user.username%>">
<div class="user-profile-header-container">
<div class="profile-pic-wrapper">
<img class="profile-pic" src="<%= ProfileImage.new(@user).get(320) %>" itemprop="image" alt="<%= @user.username %> profile" style="border-color:<%=user_colors(@user)[:bg] %>;background:<%=user_colors(@user)[:bg] %>"/>
</div>
<div class="profile-details">
<h1 style="color:<%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %>"><span itemprop="name"><%= @user.name %></span>
<span class="user-profile-follow-button-wrapper">
<button id="user-follow-butt" class="cta follow-action-button user-profile-follow-button" style="color:<%= user_colors(@user)[:text] %>;background-color:<%=user_colors(@user)[:bg] %>" data-info='{"id":<%= @user.id%>,"className":"<%= @user.class.name %>"}'>&nbsp;</button>
</span>
</h1>
<p class="profile-description" itemprop="description">
<%= @user.summary.presence || ["404 bio not found"].sample %>
</p>
<style>
.profile-details .social .icon-img path{
fill: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %> !important;
}
</style>
<p class="social">
<% if @user.twitter_username? %>
<a href="https://twitter.com/<%= @user.twitter_username %>" target="_blank" rel="noopener me">
<%= inline_svg("twitter-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.github_username? %>
<a href="https://github.com/<%= @user.github_username %>" target="_blank" rel="noopener me">
<%= inline_svg("github-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.mastodon_url? %>
<a href="<%= @user.mastodon_url %>" target="_blank" rel="noopener">
<%= inline_svg("mastodon-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.facebook_url? %>
<a href="<%= @user.facebook_url %>" target="_blank" rel="noopener me">
<%= inline_svg("facebook-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.linkedin_url? %>
<a href="<%= @user.linkedin_url %>" target="_blank" rel="noopener me">
<%= inline_svg("linkedin_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.behance_url? %>
<a href="<%= @user.behance_url %>" target="_blank" rel="noopener me">
<%= inline_svg("behance_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.stackoverflow_url? %>
<a href="<%= @user.stackoverflow_url %>" target="_blank" rel="noopener me">
<%= inline_svg("stackoverflow-logo.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.dribbble_url? %>
<a href="<%= @user.dribbble_url %>" target="_blank" rel="noopener me">
<%= inline_svg("dribbble_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.medium_url? %>
<a href="<%= @user.medium_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("medium_icon.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.gitlab_url? %>
<a href="<%= @user.gitlab_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("gitlab.svg", class:"icon-img") %>
</a>
<% end %>
<% if @user.website_url? %>
<a href="<%= @user.website_url %>" target="_blank" rel="noopener nofollow me">
<%= inline_svg("external-link-logo.svg", class:"icon-img") %>
</a>
<% end %>
</p>
</div>
</div>
<%= render "articles/user_metadata", context: "profile" %>
</div>
<div class="home">
<div class="container article">
<header>
<img class="profile-pic" src="<%= ProfileImage.new(@user).get(320) %>" itemprop="image" alt="<%= @user.username %> profile" style="border-color:<%=user_colors(@user)[:text] %>;background:<%=user_colors(@user)[:text] %>"/>
<div class="profile-info">
<h1><%= @user.name %></h1>
</div>
</header>
<div class="body">
My projects
<div class="home sub-home" id="index-container"
data-params="<%= params.to_json(only: [:tag,:username,:q]) %>" data-which="<%=@list_of%>"
data-algolia-tag="<%= "user_#{@user.id}" %>"
data-feed="<%= params[:timeframe] || "base-feed"%>"
data-articles-since="0"
>
<%= render "users/sidebar" %>
<div class="articles-list" id="articles-list">
<div class="on-page-nav-controls user-nav-controls" id="on-page-nav-controls">
<button class="on-page-nav-butt on-page-nav-butt-left" id="on-page-nav-butt-left" aria-label="nav-button-left">
<img src="<%= asset_path 'stack.svg' %>" alt="left-sidebar-nav">
</button>
<button class="on-page-nav-butt on-page-nav-butt-right" style="margin-top:-1px;" id="on-page-nav-butt-right" aria-label="nav-button-right">
<img style="height:28px;width:28px;" src="<%= asset_path 'ribbon.svg' %>" alt="right-sidebar-nav">
</button>
</div>
<div class="substories" id="substories">
<% if params[:view] == "comments" %>
<%= render "users/comments_section" %>
<% elsif (@stories && @stories.any?) || (@comments && @comments.any?) %>
<%= render "stories/main_stories_feed" %>
<% end %>
</div>
<div class="loading-articles" id="loading-articles">
loading...
</div>
</div>
<div class="primary-sticky-nav">
<div class="primary-sticky-nav-element primary-sticky-nav-author">
Test
</div>
</div>
</div>
<%= render "users/sidebar_additional" %>
</div>
<%= render "stories/narrow_nav_menu" %>
<%= render "stories/stories_list_script" %>

1
spec/factories/podcast_episodes.rb
View file

@ -7,5 +7,6 @@ FactoryBot.define do
body { Faker::Hipster.paragraph(1) }
slug { "slug-#{rand(10_000)}" }
guid { "guid-#{rand(10_000)}" }
podcast
end
end

13
spec/features/articles/user_visits_articles_by_tag_spec.rb
View file

@ -49,6 +49,19 @@ describe "User visits articles by tag", type: :feature do
expect(page).not_to have_text(article2.title)
end
end
it "displays community sponsors" do
within("#sponsorship-widget") do
expect(page).to have_link("community sponsors", href: "/sponsors")
end
end
end
context "when choosing non-js tag" do
it "doesn't display sponsors" do
visit "/t/IoT"
expect(page).not_to have_selector("#sponsorship-widget")
end
end
context "when user has logged in" do

21
spec/features/podcasts/user_visits_podcasts_root_page_spec.rb Normal file
View file

@ -0,0 +1,21 @@
require "rails_helper"
describe "User visits /pod page", type: :feature do
let!(:podcast_episode) { create(:podcast_episode) }
let!(:podcast_episode2) { create(:podcast_episode) }
before { visit "/pod" }
it "displays the header" do
within "h1" do
expect(page).to have_text("Podcasts")
end
end
it "displays the podcasts" do
within "#articles-list" do
expect(page).to have_link(nil, href: podcast_episode.path)
expect(page).to have_link(nil, href: podcast_episode2.path)
end
end
end

26
spec/features/user/view_user_comments_spec.rb Normal file
View file

@ -0,0 +1,26 @@
require "rails_helper"
describe "User comments", type: :feature do
let!(:user) { create(:user, username: "user3000") }
let!(:article) { create(:article, user: user) }
let!(:comment) { create(:comment, user: user, commentable: create(:article)) }
let!(:comment2) { create(:comment, user: user, commentable: create(:article)) }
context "when user is unauthorized" do
before { visit "/user3000/comments" }
it "does not show user's articles" do
within("#substories") do
expect(page).not_to have_content(article.title)
end
end
it "shows user's comments" do
within("#substories div.index-comments") do
expect(page).to have_content("All 2 Comments")
expect(page).to have_link(nil, href: comment.path)
expect(page).to have_link(nil, href: comment2.path)
end
end
end
end