neocities/views/browse.erb

<script type="text/javascript">
  function getPage(page) {
    document.location.href = '/browse?page='+page+'&'+$('#search_criteria').serialize();
  }
</script>

<div class="header-Outro with-columns browse-page">
  <div class="row content">
    <div class="col col-100">
      <% if params[:tag] %>
        <h1><a href="/browse">Websites</a> > <%= params[:tag] %></h1>
      <% else %>
        <h1>Sites on Neocities</h1>
      <% end %>
    </div>

    <form id="search_criteria" action="/browse" method="GET">
      <div class="col col-50 filter">
        <fieldset class="grouping">
          <% unless is_education? %>
            <label class="text-Label" for="sort_by">Sort by:</label>
            <div class="select-Container">
              <select name="sort_by" id="sort_by" class="input-Select">
                <option value="followers" <%= params[:sort_by] == 'followers' ? 'selected' : '' %>>Most Followed</option>
                <option value="special_sauce" <%= params[:sort_by] == 'special_sauce' ? 'selected' : '' %>>Special Sauce (alpha)</option>
                <option value="last_updated" <%= params[:sort_by] == 'last_updated' ? 'selected' : '' %>>Last Updated</option>
                <option value="supporters" <%= params[:sort_by] == 'supporters' ? 'selected' : '' %>>Neocities Supporters</option>
                <option value="featured" <%= params[:sort_by] == 'featured' ? 'selected' : '' %>>Featured</option>
                <option value="tipping_enabled" <%= params[:sort_by] == 'tipping_enabled' ? 'selected' : '' %>>Accepting Tips</option>
                <option value="views" <%= params[:sort_by] == 'views' ? 'selected' : '' %>>Most Views</option>
                <option value="hits" <%= params[:sort_by] == 'hits' ? 'selected' : '' %>>Most Hits</option>
                <option value="newest" <%= params[:sort_by] == 'newest' ? 'selected' : '' %>>Newest</option>
                <option value="oldest" <%= params[:sort_by] == 'oldest' ? 'selected' : '' %>>Oldest</option>
                <option value="random" <%= params[:sort_by] == 'random' ? 'selected' : '' %>>Random</option>
              </select>
            </div>

            <!--
              <div>
                <input name="is_nsfw" type="checkbox" value="true" <%= params[:is_nsfw].to_s == 'true' ? 'checked' : '' %>> Show 18+ content
              </div>
            -->
            <input class="btn-Action" type="submit" value="Update">
          <% end %>
        </fieldset>
      </div>
      <div class="col col-50 filter">
        <form method="GET" action="browse">
        <fieldset class="grouping">
        <% unless is_education? %>
          <label class="text-Label" for="tag"><span class="hide-on-mobile">Filter by </span>Tag:</label>
          <input class="input-Area typeahead" id="tag" name="tag" type="text" placeholder="pokemon" value="<%= params[:tag] %>" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" dir="auto">
          <input style="vertical-align: -4px;margin-left: 4px;" type="submit" class="btn-Action" value="Filter">
        <% else %>
          <% if params[:tag] %>
            <input name="tag" type="hidden" value="<%= params[:tag] %>">
          <% end %>
        <% end %>
        </fieldset>
      </div>
    </div>
    </form>
</div>

<div class="browse-page">

<% if @sites.length == 0 %>
  <div class="row website-Gallery content int-Gall" style="padding-left: 30px;">
    <h3>No active sites found.</h3>
    <p>Try another search, or <a href="/browse">browse all sites</a>!</p>
  </div>
<% else %>
  <ul class="row website-Gallery content int-Gall">
    <% @sites.each_with_index do |site,i| %>
      <li id="username_<%= site.username %>">
        <a href="<%= site.uri %>"
           class="neo-Screen-Shot"
           title="<%= site.title %>"
        >
          <span class="img-Holder" style="background:url(<%= site.screenshot_url('index.html', '540x405') %>) no-repeat;">
            <img src="/img/placeholder.png" alt="<%= site.title %>" />
          </span>
        </a>
        <div class="title">
          <a href="<%= site.uri %>"
             title="<%= site.title %>"
          ><%= site.title.shorten(30) %></a>
        </div>
        <div class="site-info">
          <div class="username">
            <a href="/site/<%= site.username %>" title="Site Profile">
              <i class="fa fa-user"><% if site.supporter? %><i class="fa fa-heart"></i><% end %></i><%= site.username %>
            </a>
          </div>
          <div class="site-stats hide-on-mobile">
            <a href="/site/<%= site.username %>" title="<% if params[:sort_by] == 'hits' %>Hits<% else %>Visitors<% end %>">
              <span>
                <i class="fa fa-eye"></i>
              </span>
              <% if params[:sort_by] == 'hits' %>
                <%= site.hits.format_large_number %>
              <% else %>
                <%= site.views.format_large_number %>
              <% end %>
            </a>
          </div>
          <div class="site-tags">
            <% if @site_tags[site.id].length > 0 %>
              <i class="fa fa-tag" title="Tags"></i>
              <% @site_tags[site.id].each_with_index do |tag, index| %>
                <a class="" href="/browse?tag=<%= Rack::Utils.escape tag %>"><%= tag %></a><% if index != @site_tags[site.id].length - 1 %>,<% end %>
              <% end %>
            <% end %>
          </div>
          <% if signed_in? && current_site.is_admin %>
            <div class="admin">
              <button onclick="banSite('<%= site.username.gsub('\'', '') %>', '', this); ">Ban</button>
              <button onclick="banSite('<%= site.username.gsub('\'', '') %>', 'spam', this)">Spam</button>
              <button onclick="banSite('<%= site.username.gsub('\'', '') %>', 'phishing', this)">Phishing</button>
              <form action="/admin/mark_nsfw" target="_blank" method="POST" onsubmit="return confirm('Confirm NSFW marking of <%= site.username %>');">
                <%== csrf_token_input_html %>
                <input type="hidden" name="username" value="<%= site.username %>">
                <button>Mark NSFW</button>
              </form>

              <% if params[:sort_by] == 'blocks' %>
              <p>
                Blocks:<br>
                <% site.blocks.each do |block| %>
                  <a href="/site/<%= block.actioning_site.username %>"><%= block.actioning_site.username %></a><br>
                <% end %>
              </p>
              <% end %>
            </div>
          <% end %>
        </div>
      </li>
    <% end %>
  </ul>
<% end %>

<% if params[:sort_by] != 'random' %>
  <%== erb :'_pagination', layout: false %>
<% end %>

<% unless is_education? %>
<div class="row content misc">
  <h3>Popular Tags</h3>
  <p class="tagcloud">
    <% Tag.popular_names(100).each_with_index do |tag,i| %>
      <% i = (((i+1).to_f/100) * 10).to_i %>
      <a class="tag<%= i %>" href="/browse?tag=<%= Rack::Utils.escape tag[:name] %>"><%= tag[:name] %></a>&nbsp;&nbsp;
    <% end %>
  </p>
</div>
<div class="row content misc">
  <h3>Text Search</h3>
  <form id="searchForm" method="GET" action="https://duckduckgo.com" class="content" onsubmit="return addSiteToSearch()">
    <input name="csrf_token" type="hidden" value="<%= csrf_token %>">
    <fieldset>
      <input id="searchQuery" name="q" type="text" placeholder="keywords" class="input-Area" autocapitalize="off" autocorrect="off" value="<%= flash[:username] %>" style="width: 50%">
      <input class="btn btn-Action" type="submit" value="Search">
    </fieldset>
  </form>
  <p>Search powered by <a href="https://duckduckgo.com/">Duck Duck Go</a></p>
</div>
<% end %>
</div>

<script>
  function addSiteToSearch() {
    var searchQuery = $('#searchQuery')
    var finalSearchQuery = searchQuery.val() + ' site:neocities.org'

    window.location = 'https://duckduckgo.com/?q='+encodeURI(finalSearchQuery)
    return false
  }
</script>


<script>
  function banSite(usernames, classifier, el) {
    $.post('/admin/banhammer', {
      usernames: usernames,
      classifier: classifier,
      csrf_token: '<%= csrf_token %>'
    }, function(data) {
      $(el).css('color', '#3eff00')
    })
    return false;
  }
</script>