<% logo_path = SiteSetting['SiteLogoPath'] %>
<% mobile_logo_path = SiteSetting['MobileLogoPath'] %>

<header class="header has-margin-0 <%= SiteSetting['SiteHeaderIsDark'] ? 'is-dark' : '' %>">
  <div class="container header--container">
    <div class="header--brand">
      <% if mobile_logo_path.present? %>
        <a href="/" class="header--site-name __mobile-only" aria-label="Home"><img alt src="<%= mobile_logo_path %>" /></a>
        <% if logo_path.present? %>
          <a href="/" class="header--site-name __desktop-only" aria-label="Home"><img alt src="<%= logo_path %>" /></a>
        <% else %>
          <a href="/" class="header--site-name __desktop-only" aria-label="Home"><%= SiteSetting['SiteName'] %></a>
        <% end %>
      <% else %>
        <% if logo_path.present? %>
          <a href="/" class="header--site-name" aria-label="Home"><img alt src="<%= logo_path %>" /></a>
        <% else %>
          <a href="/" class="header--site-name" aria-label="Home"><%= SiteSetting['SiteName'] %></a>
        <% end %>
      <% end %>
    </div>
    <nav class="header--menu">
      <%= link_to 'Categories', categories_path, class: 'header--item' %>
      <%= link_to 'Users', users_path, class: 'header--item' %>
      <%= link_to 'Search', search_path, class: 'header--item' %>

      <div class='header--separator'></div>

      <%= link_to 'Help', help_center_path, class: 'header--item' %>

      <% if user_signed_in? %>
        <% if current_user.is_admin || current_user.is_moderator %>
          <%= link_to flag_queue_path, class: 'header--item' do %>
            <% if @open_flags > 0 %>
              <span class="header--alert"><%= @open_flags %></span>
            <% end %>
            Flags
          <% end %>
        <% end %>
        <a href="#" class="header--item inbox-toggle is-visible-on-mobile" data-header-slide="#js-inbox">
          <% unread = current_user.unread_count %>
          <% if unread > 0 %>
            <span class="header--alert"><%= unread %></span>
          <% end %>
          <i class='fas fa-inbox' title='Notifications'></i>
        </a>
        <%= link_to qr_login_code_path, class: 'header--item' do %>
          <i class="fas fa-mobile-alt" aria-label="Mobile Sign In" title="Mobile Sign In"></i>
        <% end %>
        <%= link_to user_path(current_user), class: 'header--item is-complex is-visible-on-mobile' do %>
          <img alt="user avatar" src="<%= avatar_url(current_user) %>" class="header--item-image">&nbsp;&nbsp;
          <span class="has-font-size-larger <%= SiteSetting['SiteHeaderIsDark'] ? 'has-color-white' : 'has-color-tertiary-600' %>"><%= current_user.reputation %></span>
        <% end %>
        <%= link_to 'Sign Out', destroy_user_session_path, method: :delete, class: 'header--item' %>
      <% else %>
        <%= link_to 'Sign Up', new_user_registration_path, class: 'button is-muted is-filled' %>
        <%= link_to 'Sign In', new_user_session_path, class: 'button is-muted is-outlined' %>
      <% end %>
      <a class="header--item is-mobile-menu is-complex" aria-label="Menu" href="#" data-header-slide="#js-mobile-menu">
          <span class="header--menu-bars">
            <span></span>
            <span></span>
            <span></span>
          </span>
      </a>
    </nav>
  </div>
</header>

<div class="header-slide inbox h-p-0" id="js-inbox">
  <div class="h-p-2 h-bg-tertiary-050 h-fw-bold">Notifications</div>
  <div class="inbox--container h-p-2"></div>
</div>
<div class="header-slide mobile-menu" id="js-mobile-menu">
  <div class="menu">
    <%= link_to 'Categories', categories_path, class: 'menu--item' %>
    <%= link_to 'Users', users_path, class: 'menu--item' %>
    <%= link_to 'Search', search_path, class: 'menu--item' %>

    <div class='header-slide--separator'></div>

    <%= link_to 'Help', help_center_path, class: 'menu--item' %>

    <% if user_signed_in? %>
      <% if current_user.is_admin || current_user.is_moderator %>
        <%= link_to flag_queue_path, class: 'menu--item' do %>
          <% if @open_flags > 0 %>
            <span class="badge is-status"><%= @open_flags %></span>
          <% end %>
          Flags
        <% end %>
      <% end %>
      <%= link_to 'Sign Out', destroy_user_session_path, method: :delete, class: 'menu--item' %>
    </div>
    <% else %>
    </div>
      <%= link_to 'Sign Up', new_user_registration_path, class: 'button is-filled' %>
      <%= link_to 'Sign In', new_user_session_path, class: 'button is-outlined' %>
    <% end %>
</div>

<% if expandable? %>
  <% current_cat = current_category %>
  <% header_class = current_cat.color_code.present? ? current_cat.color_code : SiteSetting['SiteCategoryHeaderDefaultColor'] %>
<% else %>
  <% header_class = SiteSetting['SiteCategoryHeaderDefaultColor'] %>
<% end %>
<header class="category-header is-<%= header_class %>">
  <div class="category-header--tabs">
    <div class="container category-header--tabs-container">
      <% @header_categories.each do |cat| %>
        <% next unless (current_user&.trust_level || 0) >= (cat.min_view_trust_level || -1) %>
        <%= link_to category_path(cat), class: "category-header--tab #{active?(cat) ? 'is-active' : ''}" do %>
          <%= cat.name %>
          <% if user_signed_in? && cat.new_posts_for?(current_user) %>
            <span class="badge is-status" title="new posts for you"></span>
          <% end %>
        <% end %>
      <% end %>
    </div>
  </div>
  <% if expandable? %>
    <div class="container category-header--container">
      <div class="category-header--name"><%= current_cat.name %></div>
      <div class="category-header--nav">
        <%= link_to 'Posts', category_path(current_cat),
                    class: "category-header--nav-item #{active?(current_cat) && controller_name != 'tags' ? 'is-active' : ''}" %>
        <%= link_to 'Tags', category_tags_path(current_cat),
                    class: "category-header--nav-item #{active?(current_cat) && controller_name == 'tags' ? 'is-active' : ''}" %>
        <%# There will eventually be a Tags link here too, once we have a page that lists tags per-tag set. %>
        <div class="category-header--nav-separator"></div>
        <% ptid = current_cat.display_post_types.reject { |e| e.to_s.empty? }.first || Question.post_type_id %>
        <%= link_to create_post_path(category_id: current_cat.id, post_type_id: ptid),
                    class: 'category-header--nav-item is-button' do %>
          <%= current_cat.button_text.present? ? current_cat.button_text : 'Create Post' %>
        <% end %>
      </div>
    </div>
  <% end %>
</header>

<% if Rails.env.development? %>
  <div class="notice is-danger is-banner has-padding-2 notice__dev-mode">
    <div class="container">
      <p>This site is in development mode!</p>
    </div>
  </div>
<% end %>