Add ability score fields
This commit is contained in:
parent
a7fb11119f
commit
89578e13b7
GPG Key ID:
DAF7821E067D9C48
|
|
@ -28,6 +28,10 @@ label {
|
|||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.ability-scores .field input {
|
||||
width: 65px;
|
||||
}
|
||||
|
||||
#character-class {
|
||||
width: 130px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,139 @@
|
|||
use yew::services::console::ConsoleService;
|
||||
|
||||
#[derive(Debug)]
|
||||
pub enum Message {
|
||||
Strength(yew::ChangeData),
|
||||
Dexterity(yew::ChangeData),
|
||||
Constitution(yew::ChangeData),
|
||||
Intelligence(yew::ChangeData),
|
||||
Wisdom(yew::ChangeData),
|
||||
Charisma(yew::ChangeData),
|
||||
}
|
||||
|
||||
pub struct AbilityScores {
|
||||
link: yew::ComponentLink<Self>,
|
||||
|
||||
strength: i32,
|
||||
dexterity: i32,
|
||||
constitution: i32,
|
||||
intelligence: i32,
|
||||
wisdom: i32,
|
||||
charisma: i32,
|
||||
}
|
||||
|
||||
impl yew::Component for AbilityScores {
|
||||
type Message = Message;
|
||||
type Properties = ();
|
||||
|
||||
fn create(_props: Self::Properties, link: yew::ComponentLink<Self>) -> Self {
|
||||
Self {
|
||||
link,
|
||||
strength: 10,
|
||||
dexterity: 10,
|
||||
constitution: 10,
|
||||
intelligence: 10,
|
||||
wisdom: 10,
|
||||
charisma: 10,
|
||||
}
|
||||
}
|
||||
|
||||
fn update(&mut self, message: Self::Message) -> yew::ShouldRender {
|
||||
match message {
|
||||
Message::Strength(yew::ChangeData::Value(strength)) => {
|
||||
self.strength = strength.parse().unwrap_or(10);
|
||||
}
|
||||
Message::Dexterity(yew::ChangeData::Value(dexterity)) => {
|
||||
self.dexterity = dexterity.parse().unwrap_or(10);
|
||||
}
|
||||
Message::Constitution(yew::ChangeData::Value(constitution)) => {
|
||||
self.constitution = constitution.parse().unwrap_or(10);
|
||||
}
|
||||
Message::Intelligence(yew::ChangeData::Value(intelligence)) => {
|
||||
self.intelligence = intelligence.parse().unwrap_or(10);
|
||||
}
|
||||
Message::Wisdom(yew::ChangeData::Value(wisdom)) => {
|
||||
self.wisdom = wisdom.parse().unwrap_or(10);
|
||||
}
|
||||
Message::Charisma(yew::ChangeData::Value(charisma)) => {
|
||||
self.charisma = charisma.parse().unwrap_or(10);
|
||||
}
|
||||
_ => {
|
||||
ConsoleService::log(&format!("{:?}", message));
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
true
|
||||
}
|
||||
|
||||
fn change(&mut self, _props: Self::Properties) -> yew::ShouldRender {
|
||||
false
|
||||
}
|
||||
|
||||
fn view(&self) -> yew::Html {
|
||||
yew::html! {
|
||||
<div class="ability-scores">
|
||||
<div class="field">
|
||||
<input
|
||||
type="number"
|
||||
id="ability-strength"
|
||||
value={self.strength.to_string()}
|
||||
onchange=self.link.callback(|e| Message::Strength(e))
|
||||
/>
|
||||
{(self.strength - 10) / 2}
|
||||
<label for="ability-strength">{"Strength"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input
|
||||
type="number"
|
||||
id="ability-dexterity"
|
||||
value={self.dexterity.to_string()}
|
||||
onchange=self.link.callback(|e| Message::Dexterity(e))
|
||||
/>
|
||||
{(self.dexterity - 10) / 2}
|
||||
<label for="ability-dexterity">{"Dexterity"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input
|
||||
type="number"
|
||||
id="ability-constitution"
|
||||
value={self.constitution.to_string()}
|
||||
onchange=self.link.callback(|e| Message::Constitution(e))
|
||||
/>
|
||||
{(self.constitution - 10) / 2}
|
||||
<label for="ability-constitution">{"Constitution"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input
|
||||
type="number"
|
||||
id="ability-intelligence"
|
||||
value={self.intelligence.to_string()}
|
||||
onchange=self.link.callback(|e| Message::Intelligence(e))
|
||||
/>
|
||||
{(self.intelligence - 10) / 2}
|
||||
<label for="ability-intelligence">{"Intelligence"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input
|
||||
type="number"
|
||||
id="ability-wisdom"
|
||||
value={self.wisdom.to_string()}
|
||||
onchange=self.link.callback(|e| Message::Wisdom(e))
|
||||
/>
|
||||
{(self.wisdom - 10) / 2}
|
||||
<label for="ability-wisdom">{"Wisdom"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input
|
||||
type="number"
|
||||
id="ability-charisma"
|
||||
value={self.charisma.to_string()}
|
||||
onchange=self.link.callback(|e| Message::Charisma(e))
|
||||
/>
|
||||
{(self.charisma - 10) / 2}
|
||||
<label for="ability-charisma">{"Charisma"}</label>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,79 @@
|
|||
pub enum Message {}
|
||||
|
||||
pub struct CharacterInfo {
|
||||
_link: yew::ComponentLink<Self>,
|
||||
}
|
||||
|
||||
impl yew::Component for CharacterInfo {
|
||||
type Message = Message;
|
||||
type Properties = ();
|
||||
|
||||
fn create(_props: Self::Properties, link: yew::ComponentLink<Self>) -> Self {
|
||||
Self { _link: link }
|
||||
}
|
||||
|
||||
fn update(&mut self, _msg: Self::Message) -> yew::ShouldRender {
|
||||
false
|
||||
}
|
||||
|
||||
fn change(&mut self, _props: Self::Properties) -> yew::ShouldRender {
|
||||
false
|
||||
}
|
||||
|
||||
fn view(&self) -> yew::Html {
|
||||
yew::html! {
|
||||
<div class="columns">
|
||||
<div class="field">
|
||||
<input id="character-name"/>
|
||||
<label for="character-name">{"Character name"}</label>
|
||||
</div>
|
||||
<div>
|
||||
<div class="columns">
|
||||
<div class="field">
|
||||
<input id="character-class"/>
|
||||
<label for="character-class">{"Class"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input type="number" id="character-level"/>
|
||||
<label for="character-level">{"Level"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input id="character-race"/>
|
||||
<label for="character-race">{"Race"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="field">
|
||||
<input id="character-background"/>
|
||||
<label for="character-background">{"Background"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<select id="character-alignment">
|
||||
<option value="lg">{"Lawful Good"}</option>
|
||||
<option value="ng">{"Neutral Good"}</option>
|
||||
<option value="cg">{"Chaotic Good"}</option>
|
||||
<option value="ln">{"Lawful Neutral"}</option>
|
||||
<option value="nn">{"True Neutral"}</option>
|
||||
<option value="cn">{"Chaotic Neutral"}</option>
|
||||
<option value="le">{"Lawful Evil"}</option>
|
||||
<option value="ne">{"True Evil"}</option>
|
||||
<option value="ce">{"Chaotic Evil"}</option>
|
||||
</select>
|
||||
<label for="character-alignment">{"Alignment"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="field">
|
||||
<input id="player-name"/>
|
||||
<label for="player-name">{"Player Name"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input id="experience-points"/>
|
||||
<label for="experience-points">{"Experience Points"}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
84
src/main.rs
84
src/main.rs
|
|
@ -1,27 +1,23 @@
|
|||
enum Msg {
|
||||
AddOne,
|
||||
mod ability_scores;
|
||||
mod character_info;
|
||||
|
||||
use ability_scores::AbilityScores;
|
||||
use character_info::CharacterInfo;
|
||||
|
||||
struct Page {
|
||||
_link: yew::ComponentLink<Self>,
|
||||
}
|
||||
|
||||
struct Model {
|
||||
link: yew::ComponentLink<Self>,
|
||||
value: i64,
|
||||
}
|
||||
|
||||
impl yew::Component for Model {
|
||||
type Message = Msg;
|
||||
impl yew::Component for Page {
|
||||
type Message = ();
|
||||
type Properties = ();
|
||||
|
||||
fn create(_props: Self::Properties, link: yew::ComponentLink<Self>) -> Self {
|
||||
Self { link, value: 0 }
|
||||
Self { _link: link }
|
||||
}
|
||||
|
||||
fn update(&mut self, msg: Self::Message) -> yew::ShouldRender {
|
||||
match msg {
|
||||
Msg::AddOne => {
|
||||
self.value += 1;
|
||||
true
|
||||
}
|
||||
}
|
||||
fn update(&mut self, _msg: Self::Message) -> yew::ShouldRender {
|
||||
false
|
||||
}
|
||||
|
||||
fn change(&mut self, _props: Self::Properties) -> yew::ShouldRender {
|
||||
|
|
@ -30,62 +26,14 @@ impl yew::Component for Model {
|
|||
|
||||
fn view(&self) -> yew::Html {
|
||||
yew::html! {
|
||||
<div class="columns">
|
||||
<div class="field">
|
||||
<input id="character-name"/>
|
||||
<label for="character-name">{"Character name"}</label>
|
||||
</div>
|
||||
<div>
|
||||
<div class="columns">
|
||||
<div class="field">
|
||||
<input id="character-class"/>
|
||||
<label for="character-class">{"Class"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input type="number" id="character-level"/>
|
||||
<label for="character-level">{"Level"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input id="character-race"/>
|
||||
<label for="character-race">{"Race"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="field">
|
||||
<input id="character-background"/>
|
||||
<label for="character-background">{"Background"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<select id="character-alignment">
|
||||
<option value="lg">{"Lawful Good"}</option>
|
||||
<option value="ng">{"Neutral Good"}</option>
|
||||
<option value="cg">{"Chaotic Good"}</option>
|
||||
<option value="ln">{"Lawful Neutral"}</option>
|
||||
<option value="nn">{"True Neutral"}</option>
|
||||
<option value="cn">{"Chaotic Neutral"}</option>
|
||||
<option value="le">{"Lawful Evil"}</option>
|
||||
<option value="ne">{"True Evil"}</option>
|
||||
<option value="ce">{"Chaotic Evil"}</option>
|
||||
</select>
|
||||
<label for="character-alignment">{"Alignment"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="field">
|
||||
<input id="player-name"/>
|
||||
<label for="player-name">{"Player Name"}</label>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input id="experience-points"/>
|
||||
<label for="experience-points">{"Experience Points"}</label>
|
||||
</div>
|
||||
</div>
|
||||
<CharacterInfo />
|
||||
<AbilityScores />
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fn main() {
|
||||
yew::start_app::<Model>();
|
||||
yew::start_app::<Page>();
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue