impress/app/views/outfits/new_v2.html.haml

- title "Wardrobe v2"

!!! 5
%html
  %head
    %meta{charset: 'utf-8'}
    %meta{name: 'viewport', content: 'width=device-width, initial-scale=1'}
    %title= yield :title
    %link{href: image_path('favicon.png'), rel: 'icon'}
    = stylesheet_link_tag "application/hanger-spinner"
    = stylesheet_link_tag "application/outfit-viewer"
    = page_stylesheet_link_tag "outfits/new_v2"
    = javascript_include_tag "application", async: true
    = javascript_include_tag "idiomorph", async: true
    = javascript_include_tag "outfit-viewer", async: true
    = javascript_include_tag "species-color-picker", async: true
    = javascript_include_tag "outfits/new_v2", async: true
    = csrf_meta_tags
    %meta{name: 'outfit-viewer-morph-mode', value: 'full-page'}
  %body.wardrobe-v2
    .wardrobe-container
      .outfit-preview-section
        - if @pet_type.nil?
          .no-preview-message
            %p
              We haven't seen this kind of pet before! Try a different species/color
              combination.
        - else
          = outfit_viewer @outfit

        %species-color-picker
          = form_with url: wardrobe_v2_path, method: :get do |f|
            = select_tag :color,
              options_from_collection_for_select(@colors, "id", "human_name",
                @selected_color&.id),
              "aria-label": "Pet color"
            = select_tag :species,
              options_from_collection_for_select(@species, "id", "human_name",
                @selected_species&.id),
              "aria-label": "Pet species"
            = submit_tag "Go", name: nil

            -# Preserve item IDs in the URL
            - if params[:objects].present?
              - params[:objects].each do |item_id|
                = hidden_field_tag "objects[]", item_id

      .outfit-controls-section
        %h1 Customize your pet

        - if @outfit.worn_items.any?
          .worn-items
            %h2 Items (#{@outfit.worn_items.size})
            %ul.items-list
              - @outfit.worn_items.each do |item|
                %li.item-card
                  .item-thumbnail
                    = image_tag item.thumbnail_url, alt: item.name, loading: "lazy"
                  .item-info
                    .item-name= item.name
                    .item-badges
                      = render "items/badges/kind", item: item
                      = render "items/badges/first_seen", item: item