Modal stat roller

This commit is contained in:
Trevor Vallender 2024-06-21 09:09:19 +01:00
parent 2f0e1b90b4
commit 810ebcbed3
12 changed files with 117 additions and 14 deletions

View File

@ -45,3 +45,9 @@ form.stat-form, form.counter-form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.feature-box form.stat-form {
display: block;
margin: 1em auto;
width: fit-content;
}

View File

@ -98,3 +98,53 @@ header nav {
hr { hr {
width: 100%; width: 100%;
} }
#modal:empty {
display: none;
}
#modal {
position: fixed;
background-color: rgba(0,0,0,0.8);
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 5000;
}
#modal div {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80vw;
max-width: 800px;
min-width: 200px;
max-height: 800px;
min-height: 400px;
padding: 1em;
word-break: break-word;
border-radius: var(--border-radius);
background-color: var(--inset-bg-color);
}
.feature-box h2 {
text-align: center;
}
.nf {
color: var(--text-color);
}
.roll-button {
border-radius: var(--border-radius);
scale: 1.4;
cursor: pointer;
box-shadow: 0 0 5px var(--shadow-color);
}
.roll-button::before {
content: "YO";
background-color: red;
}

View File

@ -3,7 +3,7 @@
class StatsController < ApplicationController class StatsController < ApplicationController
before_action :set_section, only: [ :new, :create ] before_action :set_section, only: [ :new, :create ]
before_action :set_character, only: [ :new, :create ] before_action :set_character, only: [ :new, :create ]
before_action :set_stat, only: [ :update, :destroy ] before_action :set_stat, only: [ :show, :update, :destroy ]
def new def new
@stat = @section.stats.new @stat = @section.stats.new
@ -18,8 +18,11 @@ class StatsController < ApplicationController
end end
end end
def show
end
def update def update
@editable = true @editable = ActiveModel::Type::Boolean.new.cast(params[:editable])
@stat.update(stat_params) @stat.update(stat_params)
end end

View File

@ -9,8 +9,8 @@ module ApplicationHelper
end end
end end
def icon_link_to(icon_name, path, data: {}) def icon_link_to(icon_name, path, data: {}, class: "")
icon = content_tag(:i, nil, class: "nf nf-#{icon_name}").html_safe icon = content_tag(:i, nil, class: "nf nf-#{icon_name}").html_safe
link_to icon, path, data: data link_to icon, path, data:, class:
end end
end end

View File

@ -0,0 +1,9 @@
import { Controller } from "@hotwired/stimulus"
// Connects to data-controller="modal-closer"
export default class extends Controller {
closeModal() {
const modal = document.getElementById("modal")
modal.innerHTML = ""
}
}

View File

@ -13,6 +13,7 @@
</head> </head>
<body> <body>
<%= turbo_frame_tag :modal %>
<header> <header>
<%= yield(:header_content) if content_for?(:header_content) %> <%= yield(:header_content) if content_for?(:header_content) %>
<h1><%= link_to t("site_name"), root_path %></h1> <h1><%= link_to t("site_name"), root_path %></h1>

View File

@ -12,16 +12,12 @@
<h6><%= stat.name %></h6> <h6><%= stat.name %></h6>
<% if @editable %> <% if @editable %>
<%= form_with model: stat, class: "stat-form", data: { controller: "auto-update" } do |f| %> <%= form_with model: stat, class: "stat-form", data: { controller: "auto-update" } do |f| %>
<%= hidden_field_tag :editable, value: true %>
<%= f.number_field :value %> <%= f.number_field :value %>
<% end %> <% end %>
<% elsif stat.roll_command.present? %>
<%= form_with model: DiceRoll.new, url: table_dice_rolls_path(stat.character.table), class: "stat-form",
data: { controller: "dice-roll" } do |f| %>
<%= f.hidden_field :rollable_type, value: "Stat" %>
<%= f.hidden_field :rollable_id, value: stat.id %>
<div class="stat-value" data-action="click->dice-roll#rollDice"><%= stat.value %></div>
<% end %>
<% else %> <% else %>
<%= link_to stat, data: { turbo_frame: :modal } do %>
<div class="stat-value"><%= stat.value %></div> <div class="stat-value"><%= stat.value %></div>
<% end %> <% end %>
<% end %>
</div> </div>

View File

@ -0,0 +1,16 @@
<%= turbo_frame_tag :modal do %>
<div class="feature-box stat">
<%= icon_link_to "fa-close", table_character_character_sheet_sections_path(@stat.character.table, @stat.character),
class: "icon-link" %>
<h2><%= @stat.name %></h2>
<%= form_with model: @stat, class: "stat-form", data: { controller: "auto-update" } do |f| %>
<%= f.number_field :value %>
<% end %>
<%= form_with model: DiceRoll.new, url: table_dice_rolls_path(@stat.character.table), class: "stat-form",
data: { controller: "dice-roll modal-closer", action: "modal-closer#closeModal" } do |f| %>
<%= f.hidden_field :rollable_type, value: "Stat" %>
<%= f.hidden_field :rollable_id, value: @stat.id %>
<%= f.submit "#{t(".roll")}".html_safe, class: "roll-button" %>
<% end %>
</div>
<% end %>

View File

@ -145,6 +145,8 @@ en:
log_out: Log out log_out: Log out
success: "You have signed out." success: "You have signed out."
stats: stats:
show:
roll: Roll!
stat: stat:
down: Move down down: Move down
up: Move up up: Move up

View File

@ -30,7 +30,7 @@ Rails.application.routes.draw do
resources :character_sheet_sections, only: [ :index, :new, :create ] resources :character_sheet_sections, only: [ :index, :new, :create ]
end end
resources :counters, only: [ :update, :destroy ] resources :counters, only: [ :update, :destroy ]
resources :stats, only: [ :update, :destroy ] resources :stats, only: [ :show, :update, :destroy ]
resources :table_invites, only: [ :index, :edit, :update ] resources :table_invites, only: [ :index, :edit, :update ]
resources :tables do resources :tables do
resources :characters, only: [] do resources :characters, only: [] do

View File

@ -1,5 +1,5 @@
nardren: nardren:
name: Nardren Rockseeker name: Nardren Rockseeker
table: dnd_table table: table
game_system: dnd game_system: dnd
user: trevor user: trevor

View File

@ -0,0 +1,20 @@
# frozen_string_literal: true
require "application_system_test_case"
class CharacterSheetTest < ApplicationSystemTestCase
test "can roll dice on a character sheet" do
system_sign_in users(:trevor)
character = characters(:nardren)
visit table_character_character_sheet_sections_path(tables(:table), character)
assert_no_css ".feature-box"
first(".stat-value").click
assert_css ".feature-box"
click_button I18n.t("stats.show.roll")
assert_text "rolled"
assert_no_css ".feature-box"
end
end