fd9fdebc0b
* Add JSON-LD in place of schema.org in _video_player.html.erb * Remove unnecessary tags around JSON-LD to clean up templates * Fix indenatation and remove extra elements from show.html.erb and _profile_header.html.erb * Remove empty line from articles/show.html.erb * Clean up JSON-LD commas across erb templates * Revert articleBody changes, adjust nesting, and remove extra quote * Add application/ld+json to allowed_types in .erb-lint.yml This addition makes it so that the no verify flag is no longer required * Add additional data for Articles, Users, and Orgs to better SEO * Add additional data to JSON-LD structures *Add sameAs data to articles/show.html.erb *Add sameAs data to users/show.html.erb *Make adjustments to VideoObject data in _video_player *Make adjustments to Org in _profile_header *Add removed erb back to all erb templates * Refactor code to fix syntax Google syntax errors * Add missing double quotes to values * Remove unnecessary meta tags from _video_player.html.erb * Add additional key-value pairs to data structures * General code clean up * Clean up existing data structures *Remove useless meta tag and replace with a tag *Small refactor to users/show.html.erb data * Extract user json-ld out of users/show.html.erb *Move json-ld logic to stories_controller *Use user_json_ld variable in place of entire data structure *Set user_json_ld as a before_action in the controller * Add specs around JSON-LD data in templates *Add request spec for users/show.html.erb *Add request spec for articles/show.html.erb *Add request spec for _video_player.html.erb *Add request spec for _profile_header.html.erb *WIP: Fix pending specs for all templates * Remove useless meta tags from users/show and _profile_header.html.erb * Add additional test coverage to users/show.html.erb *Add additional tests to user_show_spec *Ensure that all tests pass *Small refactor to users/show.html.erb JSON data structure * Add additional test coverage around JSON-LD data *Add more robust tests to template specs *Remove unnecessary comments from specs *Uncomment pending specs * Adjust modified date to be more readable in article specs * Refactor spec to be more readable and update GitHub username test * Remove meta erb from articles/show.html.erb * Remove meta data from _video_player.html.erb * Clean up useless codeand whitespace for final review * Extract users/show data structure from template into StoriesController * Remove JSON-LD object from users/show.html.erb * Place JSON-LD for users/show.html.erb in StoriesController * Store user_json_ld in set_json_ld method in StoriesController * Call user_json_ld variable in script tag in users/show * Clean up trailing commas and refactor articles/show.html.erb * Remove redundant user/profile_header_spec.rb * Remove unnecessary code from _profile_header and articles/show * Remove Organization from articles/show.html.erb * Remove unnecessary comments from _profile_header.html.erb * Extract user_json_ld into separate methods to fix Code Climate failures * Rename user_profile_details and user_same_as methods to be more explicit * Refactored user_json_ld methods to use symbols instead of strings * Use symbols to fetch keys from a hash instead of strings * Changed user_url in data structure * Removal of erb tags and general clean up * Revert schema changes * Remove unnecessary quotation marks
210 lines
10 KiB
Text
210 lines
10 KiB
Text
<% title @user.name %>
|
|
|
|
<%= content_for :page_meta do %>
|
|
<%= render "users/meta" %>
|
|
<% end %>
|
|
|
|
<% cache "main-user-profile-header-area-#{@user.id}-#{@user.profile_updated_at}", expires_in: 10.days do %>
|
|
<style>
|
|
.widget header {
|
|
color: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.88) %>;
|
|
}
|
|
.night-theme .widget header {
|
|
color: #cedae2;
|
|
}
|
|
.user-profile-header .user-profile-header-container .profile-details h1{
|
|
color: <%= HexComparer.new([user_colors(@user)[:bg], user_colors(@user)[:text]]).brightness(0.78) %> !important;
|
|
}
|
|
.night-theme .user-profile-header .user-profile-header-container .profile-details h1{
|
|
color: white !important;
|
|
}
|
|
<% if user_colors(@user)[:bg].downcase.start_with?("#fff") %>
|
|
.user-profile-follow-button {
|
|
border: 1px solid <%= user_colors(@user)[:text] %> !important;
|
|
}
|
|
<% end %>
|
|
</style>
|
|
|
|
<script type="application/ld+json">
|
|
<%= @user_json_ld.to_json.html_safe %>
|
|
</script>
|
|
|
|
<div class="user-profile-header" style="<%= user_colors_style(@user) %>">
|
|
<a href="https://dev.to/<%= user_url(@user) %>"></a>
|
|
<div class="user-profile-header-container">
|
|
<div class="profile-pic-wrapper">
|
|
<img class="profile-pic" src="<%= ProfileImage.new(@user).get(width: 320) %>" alt="<%= @user.username %> profile" style="border-color:<%= user_colors(@user)[:bg] %>;background:<%= user_colors(@user)[:bg] %>" />
|
|
</div>
|
|
<div class="profile-details">
|
|
<h1>
|
|
<span><%= @user.name %><%= render "shared/pro_checkmark", style: nil, width: nil %></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 %>"}'> </button>
|
|
</span>
|
|
<% if user_signed_in? %>
|
|
<span class="user-profile-chat-button-wrapper">
|
|
<a href="/connect/@<%= @user.username %>" id="user-connect-redirect" style="display:none">
|
|
<button class="chat-action-button user-profile-chat-button" id="modal-opener" style="color:<%= user_colors(@user)[:text] %>;background-color:<%= user_colors(@user)[:bg] %>; display:none; ">CHAT</button>
|
|
</a>
|
|
</span>
|
|
<% end %>
|
|
</h1>
|
|
<p class="profile-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;
|
|
}
|
|
.night-theme .profile-details .social .icon-img path {
|
|
fill: white;
|
|
}
|
|
</style>
|
|
<p class="social">
|
|
<% if @user.twitter_username? %>
|
|
<a href="https://twitter.com/<%= @user.twitter_username %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("twitter-logo.svg", class: "icon-img", aria: true, title: "Twitter logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.github_username? %>
|
|
<a href="https://github.com/<%= @user.github_username %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("github-logo.svg", class: "icon-img", aria: true, title: "GitHub logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.mastodon_url? %>
|
|
<a href="<%= @user.mastodon_url %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("mastodon-logo.svg", class: "icon-img", aria: true, title: "Mastodon logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.facebook_url? %>
|
|
<a href="<%= @user.facebook_url %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("facebook-logo.svg", class: "icon-img", aria: true, title: "Facebook logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.linkedin_url? %>
|
|
<a href="<%= @user.linkedin_url %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("linkedin_icon.svg", class: "icon-img", aria: true, title: "LinkedIn logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.behance_url? %>
|
|
<a href="<%= @user.behance_url %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("behance_icon.svg", class: "icon-img", aria: true, title: "Behance logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.stackoverflow_url? %>
|
|
<a href="<%= @user.stackoverflow_url %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("stackoverflow-logo.svg", class: "icon-img", aria: true, title: "StackOverflow logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.dribbble_url? %>
|
|
<a href="<%= @user.dribbble_url %>" target="_blank" rel="noopener me">
|
|
<%= inline_svg_tag("dribbble_icon.svg", class: "icon-img", aria: true, title: "Dribbble logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.medium_url? %>
|
|
<a href="<%= @user.medium_url %>" target="_blank" rel="noopener nofollow me">
|
|
<%= inline_svg_tag("medium_icon.svg", class: "icon-img", aria: true, title: "Medium logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.gitlab_url? %>
|
|
<a href="<%= @user.gitlab_url %>" target="_blank" rel="noopener nofollow me">
|
|
<%= inline_svg_tag("gitlab.svg", class: "icon-img", aria: true, title: "GitLab logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.instagram_url? %>
|
|
<a href="<%= @user.instagram_url %>" target="_blank" rel="noopener nofollow me">
|
|
<%= inline_svg_tag("instagram-logo.svg", class: "icon-img", aria: true, title: "Instagram logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.twitch_username? %>
|
|
<%= link_to twitch_live_stream_path(username: @user.username) do %>
|
|
<%= inline_svg_tag("twitch-logo.svg", class: "icon-img", id: "icon-twitch", aria: true, title: "Twitch logo") %>
|
|
<% end %>
|
|
<% elsif @user.twitch_url? %>
|
|
<a href="<%= @user.twitch_url %>" target="_blank" rel="noopener nofollow me">
|
|
<%= inline_svg_tag("twitch-logo.svg", class: "icon-img", aria: true, title: "Twitch logo") %>
|
|
</a>
|
|
<% end %>
|
|
<% if @user.website_url? %>
|
|
<a href="<%= @user.website_url %>" target="_blank" rel="noopener nofollow me">
|
|
<%= inline_svg_tag("external-link-logo.svg", class: "icon-img", aria: true, title: "external link icon") %>
|
|
</a>
|
|
<% end %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="modal" style="display: none">
|
|
<div class="overlay"></div>
|
|
<div class="modal-content " id="new-message-modal">
|
|
<button title="Close" class="close-modal">X</button>
|
|
<% if @user.inbox_guidelines.present? %>
|
|
<p><b>@<%= @user.username %>'s guidelines:</b></p>
|
|
<p><%= @user.inbox_guidelines %></p>
|
|
<% end %>
|
|
<form id="new-message-form" class="message-form" data-info='{"id":<%= @user.id %>,"className":"<%= @user.class.name %>","username":"<%= @user.username %>", "showChat":"<%= @user.inbox_type %>"}'>
|
|
<textarea id="new-message" rows="4" cols="70" placeholder="Enter your message here..."></textarea>
|
|
<button type="submit" value="Submit" class="submit-message cta">SEND</button>
|
|
</form>
|
|
<p>
|
|
<em>All private interactions <b>must</b> abide by the <a href="/code-of-conduct">code of conduct</a></em>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<%= render "articles/user_metadata", context: "profile" %>
|
|
<div class="profile-dropdown" data-username="<%= @user.username %>">
|
|
<button id="user-profile-dropdown">
|
|
<%= image_tag("three-dots.svg", class: "dropdown-icon", alt: "Toggle dropdown menu") %>
|
|
</button>
|
|
<div id="user-profile-dropdownmenu" class="profile-dropdownmenu">
|
|
<button id="user-profile-dropdownmenu-block-button" data-profile-user-id="<%= @user.id %>" class="block-button" type="button">Block @<%= @user.username %></button>
|
|
<% if user_signed_in? %>
|
|
<%= javascript_packs_with_chunks_tag "profileDropdown", defer: true %>
|
|
<% end %>
|
|
<a href="/report-abuse?url=https://dev.to/<%= @user.username %>">Report Abuse</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if @user.currently_streaming_on_twitch? %>
|
|
<style>
|
|
#icon-twitch path {
|
|
fill: green !important;
|
|
stroke: green !important;
|
|
}
|
|
</style>
|
|
<% end %>
|
|
|
|
<div class="home sub-home" id="index-container"
|
|
data-params="<%= params.to_json(only: %i[tag username q]) %>" data-which="<%= @list_of %>"
|
|
data-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.any? || @comments.any? || @pinned_stories.any? %>
|
|
<%= render "users/main_feed" %>
|
|
<% end %>
|
|
</div>
|
|
<div class="loading-articles" id="loading-articles">
|
|
loading...
|
|
</div>
|
|
</div>
|
|
<% cache "user-profile-sidebar-additional-#{@user.id}-#{@user.github_repos_updated_at}-#{@user.badge_achievements_count}-#{@user.organization_info_updated_at}", expires_in: 2.days do %>
|
|
<%= render "users/sidebar_additional" %>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= render "stories/narrow_nav_menu" %>
|
|
<%= render "stories/stories_list_script" %>
|