<% content_for :head do %>
  <%# Open Graph / Facebook %>
  <meta property="og:type" content="website">
  <meta property="og:url" content="<%= furecs_user_script_url %>">
  <meta property="og:title" content="FurAffinity User Recommender - Find Similar Artists">
  <meta property="og:description" content="Discover new artists on FurAffinity based on who you already follow. Uses collaborative filtering to find users with similar interests and content.">
  <meta property="og:image" content="<%= image_url('furecs/furecs-screenshot-2.png') %>">
  <%# Twitter %>
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:url" content="<%= furecs_user_script_url %>">
  <meta name="twitter:title" content="FurAffinity User Recommender - Find Similar Artists">
  <meta name="twitter:description" content="Discover new artists on FurAffinity based on who you already follow. Uses collaborative filtering to find users with similar interests and content.">
  <meta name="twitter:image" content="<%= image_url('furecs/furecs-screenshot-2.png') %>">
<% end %>
<div class="mx-auto mt-2 max-w-2xl p-4">
  <h1 class="mb-4 text-2xl font-bold">FurAffinity User Recommender</h1>
  <div class="prose prose-slate max-w-none">
    <p class="mb-4">
      The FurAffinity User Recommender is a user script that helps you discover artists and users similar to ones you already enjoy on FurAffinity.
    </p>
    <h2 class="mt-6 mb-2 text-xl font-semibold">Features</h2>
    <ul class="list-disc pl-6">
      <li>Adds a "Similar Users" section to FurAffinity user profile pages</li>
      <li>Uses tried-and-true algorithms to find similar users, based off of follow lists</li>
      <li>Integrates seamlessly with FurAffinity's interface</li>
      <li>If you are logged in to FurAffinity, will show you users that you don't already follow</li>
    </ul>
    <h2 class="mt-6 mb-2 text-xl font-semibold">Installation</h2>
    <p class="mb-4">
      1. First, install a userscript manager like
      <%= link_to "https://www.tampermonkey.net/", target: "_blank", class: "blue-link" do %>
        Tampermonkey <i class="fas fa-external-link-alt text-xs"></i>
      <% end %>
      or
      <%= link_to "https://violentmonkey.github.io/", target: "_blank", class: "blue-link" do %>
        Violentmonkey <i class="fas fa-external-link-alt text-xs"></i>
      <% end %>.
    </p>
    <p class="mb-4">
      2. Then, <%= link_to "click here", "https://refurrer.com/us/furecs.user.js", class: "blue-link" %> to install the script.
    </p>
    <div class="mt-6 mb-8">
      <p class="mb-2 text-sm text-slate-600 italic">Screenshot of the Similar Users section added to a user profile page:</p>
      <%= image_tag "furecs/furecs-screenshot-2.png", alt: "Screenshot showing the Similar Users section added by the script", class: "rounded-lg border border-slate-300 shadow-lg" %>
    </div>
    <h2 class="mt-6 mb-2 text-xl font-semibold">How it Works</h2>
    <p class="mb-4">
      Just like how Twitter's "Who to Follow" or Amazon's "Customers Also Bought" features work, this recommender uses patterns in user behavior to make suggestions. For FurAffinity, this is based on who follows who.
    </p>
    <ul class="list-disc pl-6 mb-4">
      <li>A sample of user follows is collected from FurAffinity</li>
      <li>A <%= link_to "https://en.wikipedia.org/wiki/Collaborative_filtering", target: "_blank", class: "blue-link" do %>
          collaborative filtering <i class="fas fa-external-link-alt text-xs"></i>
        <% end %>
        model is trained on that dataset, to find other users with similar follow patterns</li>
      <li>Users with more similar follow patterns are ranked higher in the recommendations</li>
      <li>This approach works because people tend to follow users with similar content and styles</li>
    </ul>
    <p class="mb-4">
      Think of it like this: if many people who follow your favorite artist also follow another artist, there's a good chance you'll enjoy that other artist's work too!
    </p>
    <h2 class="mt-6 mb-2 text-xl font-semibold">Just To Note</h2>
    <p class="mb-4">
      The recommendations are based on a snapshot of FurAffinity follow lists that is periodically updated. The current model was last updated on January 10, 2025. This means that very recent changes to who follows who might not be reflected in the recommendations yet.
    </p>
    <div class="mt-8 rounded-lg bg-slate-100 p-4">
      <p class="italic text-slate-600">
        For support or suggestions, contact @DeltaNoises on
        <%= link_to "Telegram", "https://t.me/DeltaNoises", target: "_blank", class: "blue-link" %>.
      </p>
    </div>
  </div>
</div>
