Emi Matchu
6dd8e585a3
We add a new `use_responsive_design` helper, for pages to opt into this
new CSS—mostly just because like… it's *worse* to apply these styles
for pages that don't expect it 😅
And then, I fix up a couple things on the item page (including in the
general items layout) to match!
I'm doing this because the species face picker layout is going to want
some responsive awareness, and I want to be doing that from the start!
95 lines
3.5 KiB
Text
95 lines
3.5 KiB
Text
- title @item.name
|
|
- canonical_path @item
|
|
- use_responsive_design
|
|
|
|
= render partial: "item_header",
|
|
locals: {item: @item, trades: @trades, current_subpage: "preview",
|
|
current_user_lists: @current_user_lists,
|
|
current_user_quantities: @current_user_quantities}
|
|
|
|
- if @item.name.include? "Baby Body Paint"
|
|
%p.warning
|
|
The Baby Body Paint items seem to have new zone restriction rules that our
|
|
system doesn't support yet, whuh oh! This might require major changes to
|
|
how we handle zones. Until then, these items will be <em>very</em> buggy,
|
|
sorry!
|
|
|
|
= turbo_frame_tag "item-preview" do
|
|
= render partial: "outfit_viewer", locals: {outfit: @preview_outfit}
|
|
.error-indicator
|
|
💥 We couldn't load all of this outfit. Try again?
|
|
|
|
= form_for item_path(@item), method: :get, class: "species-color-picker",
|
|
data: {"is-valid": @preview_error.nil?} do |f|
|
|
- if @preview_error == :pet_type_does_not_exist
|
|
%span.error-icon{title: "We haven't seen this kind of pet before."} ⚠️
|
|
- elsif @preview_error == :no_item_data
|
|
%span.error-icon{title: "We haven't seen this item on this pet before."} ⚠️
|
|
|
|
= select_tag "preview[color_id]",
|
|
options_from_collection_for_select(Color.funny.alphabetical,
|
|
"id", "human_name", @selected_preview_pet_type.color_id)
|
|
= select_tag "preview[species_id]",
|
|
options_from_collection_for_select(Species.alphabetical,
|
|
"id", "human_name", @selected_preview_pet_type.species_id)
|
|
= submit_tag "Go", name: nil
|
|
|
|
%species-face-picker
|
|
%noscript
|
|
This fancy species picker requires Javascript, but you can still use the
|
|
dropdowns instead!
|
|
%species-face-picker-options{
|
|
inert: true, # waits for JS to remove
|
|
"aria-hidden": true, # waits for JS to remove
|
|
}
|
|
- @preview_pet_type_options.each do |pet_type|
|
|
%label{
|
|
title: species_face_tooltip(pet_type, @item),
|
|
}
|
|
= radio_button_tag "species_face_id", pet_type.species_id,
|
|
checked: pet_type == @preview_outfit.pet_type,
|
|
disabled: !item_fits?(@item, pet_type)
|
|
= pet_type_image pet_type,
|
|
item_fits?(@item, pet_type) ? :happy : :sad,
|
|
:face
|
|
|
|
.item-zones-info
|
|
%section
|
|
%h3 Occupies
|
|
- if @appearances_by_occupied_zone.present?
|
|
%ul
|
|
- @appearances_by_occupied_zone.each do |zone, appearances_in_zone|
|
|
%li
|
|
= zone.label
|
|
- if item_zone_partial_fit? appearances_in_zone, @all_appearances
|
|
%span.zone-species-info{
|
|
title: item_zone_species_list(appearances_in_zone)
|
|
}
|
|
(#{appearances_in_zone.size} species)
|
|
- else
|
|
%span.no-zones (None)
|
|
|
|
%section
|
|
%h3 Restricts
|
|
- if @item.restricted_zones.present?
|
|
%ul
|
|
- @item.restricted_zones.sort_by(&:label).each do |zone|
|
|
%li= zone.label
|
|
- else
|
|
%span.no-zones (None)
|
|
|
|
- unless @contributors_with_counts.empty?
|
|
#item-contributors
|
|
%header #{t '.contributors.header'}:
|
|
%ul
|
|
- @contributors_with_counts.each do |contributor, count|
|
|
%li= link_to(contributor.name, user_contributions_path(contributor)) + format_contribution_count(count)
|
|
%footer= t '.contributors.footer'
|
|
|
|
- content_for :stylesheets do
|
|
= stylesheet_link_tag "application/hanger-spinner"
|
|
|
|
- content_for :javascripts do
|
|
= javascript_include_tag "lib/idiomorph", async: true
|
|
= javascript_include_tag "outfit-viewer", async: true
|
|
= javascript_include_tag "items/show", async: true
|