<% if @organization_article_index %>
  <div id="organization-article-index"></div>
<% end %>
<% if !user_signed_in? || !@default_home_feed %>
  <% @stories.each_with_index do |story,i| %>
    <% next if story.id == @featured_story.id %>
    <% if !user_signed_in? && i == 4 %>
      <div class="single-article single-article-small-pic feed-cta" id="in-feed-cta">
          <div class="cta-container" id="cta-content">
            <h2>
              <% if @tag.blank? %>
                Need more relevant posts?<br />Sign in to customize your feed:
              <% else %>
                <a href="/">dev.to</a> is a community of <br/><%= number_with_delimiter User.all.size %> amazing humans who code.
              <% end %>
            </h2>
            <div class="button-container">
              <a href="/users/auth/twitter?callback_url=<%= ApplicationConfig["APP_PROTOCOL"] %><%= ApplicationConfig["APP_DOMAIN"] %>/users/auth/twitter/callback" class="cta cta-button" aria-label="Sign in with Twitter." data-no-instant>
                TWITTER
              </a>
              <a href="/users/auth/github?state=in-feed-cta" class="cta cta-button" aria-label="Sign in with GitHub." data-no-instant>
                GITHUB
              </a>
            </div>
        </div>
      </div>
    <% end %>
    <%= render "articles/single_story", story: story %>
    <% if i == 0 && @comments && @comments.size > 0 && @user %>
      <%= render "users/comments_section" %>
    <% end %>
  <% end %>
<% else %>
  <% cache("fetched-home-articles-object", :expires_in => 3.minutes) do %>
      <div id="new-articles-object" data-articles="
      <%=@new_stories.to_json(only:
                            [:title, :path, :id, :user_id, :comments_count, :positive_reactions_count, :organization_id],
                          methods:
                            [:readable_publish_date, :cached_tag_list_array, :flare_tag, :class_name],
                          include: {user: {only: [:username, :name], methods: [:profile_image_90]},
                                    organization: {only: [:slug, :name], methods: [:profile_image_90]}}) %>">
    </div>
    <div id="home-articles-object" data-articles="
      <%=@stories.to_json(only:
                            [:title, :path, :id, :user_id, :comments_count, :positive_reactions_count, :organization_id],
                          methods:
                            [:readable_publish_date, :cached_tag_list_array, :flare_tag, :class_name],
                          include: { user: {only: [:username, :name], methods: [:profile_image_90]},
                                    organization: {only: [:slug, :name], methods: [:profile_image_90]}}) %>">
      <% 3.times do %>
      <div class="single-article single-article-small-pic">
        <div class="small-pic" >
          <div class="color single-article-loading"></div>
        </div>
        <div class="content">
          <h3 class="single-article-loading">&nbsp;</h3>
        </div>
        <h4 class="single-article-loading" style="width:46%">
          &nbsp;
        </h4>
        <div class="tags single-article-loading" style="width:56%">
        </div>
      </div>
      <% end %>
    </div>
  <% end %>
<% end %>


<% if @stories.length == 0 && @comments && @comments.size > 0 && @user %>
  <%= render "users/comments_section" %>
<% end %>
<% if @stories.size > 1 %>
  <div class="placeholder-div">
  </div>
<% end %>
<div class="single-article-small-pic" id="article-index-hidden-div" style="display:none"></div>
