Foundry/taf
1
0
Fork 0
Code Issues 8 Pull requests Releases 1 Wiki Activity Actions

Get the base Actor sheet working w/ collaboration

Browse source
This commit is contained in:
Oliver-Akins 2024-08-28 22:36:12 -06:00
parent 60b0072bcc
commit ce9c2de751
18 changed files with 320 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

38
.styles/root.css Normal file
View file

@ -0,0 +1,38 @@
.actor--player.style-v1 {
--header-size: 75px;
}
.actor--player.style-v1 form {
display: flex;
flex-direction: column;
gap: 8px;
}
.actor--player.style-v1 .header-row {
display: flex;
flex-direction: row;
border-radius: 4px;
border: 1px solid var(--color-underline-header);
}
.actor--player.style-v1 .avatar {
--size: var(--header-size);
width: var(--size);
height: var(--size);
border: none;
border-right: 1px solid var(--color-underline-header);
}
.actor--player.style-v1 .actor-name {
height: var(--header-size);
padding: 8px 1rem;
font-size: clamp(1rem, 2rem, var(--header-size) - 16px);
border: none;
}
.actor--player.style-v1 prose-mirror {
--menu-background: rgba(0, 0, 0, 0.1);
flex-grow: 1;
border: 1px solid var(--color-underline-header);
border-radius: 4px;
}
.actor--player.style-v1 prose-mirror .editor-container {
height: auto;
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../styles/v1/player/root.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;EACC;;AAEA;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAEA;EACC%22,%22file%22:%22root.css%22%7D */

5
.styles/v1/components/common.css Normal file
View file

@ -0,0 +1,5 @@
:host {
display: inline-block;
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/v1/components/common.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAIA;EACC%22,%22file%22:%22common.css%22%7D */

24
.styles/v1/components/icon.css Normal file
View file

@ -0,0 +1,24 @@
/*
Disclaimer: This CSS is used by a custom web component and is scoped to JUST
the corresponding web component. Importing this into other files is forbidden
*/
:host {
display: inline-block;
}
div {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
svg {
width: var(--size, 1rem);
height: var(--size, 1rem);
fill: var(--fill);
stroke: var(--stroke);
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/v1/components/icon.scss%22,%22../../../styles/v1/components/common.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;AAAA;AAAA;AAAA;ACIA;EACC;;;ADID;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA%22,%22file%22:%22icon.css%22%7D */

53
.styles/v1/components/incrementer.css Normal file
View file

@ -0,0 +1,53 @@
/*
Disclaimer: This CSS is used by a custom web component and is scoped to JUST
the corresponding web component. Importing this into other files is forbidden
*/
:host {
display: inline-block;
}
div {
display: grid;
grid-template-columns: var(--height, 1.5rem) var(--width, 50px) var(--height, 1.5rem);
grid-template-rows: var(--height, 1fr);
border-radius: var(--border-radius, 4px);
}
span, input {
border: none;
outline: none;
background: none;
color: inherit;
}
input {
font-family: var(--font-family, inherit);
text-align: center;
font-size: var(--font-size, inherit);
padding: 2px 4px;
}
input::-webkit-inner-spin-button, input::-webkit-outer-spin-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0;
}
.increment, .decrement {
aspect-ratio: 1/1;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.increment {
border-radius: 0 var(--border-radius, 4px) var(--border-radius, 4px) 0;
}
.decrement {
border-radius: var(--border-radius, 4px) 0 0 var(--border-radius, 4px);
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/v1/components/incrementer.scss%22,%22../../../styles/v1/components/common.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;AAAA;AAAA;AAAA;ACIA;EACC;;;ADKD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAED;EACC%22,%22file%22:%22incrementer.css%22%7D */

38
.styles/v1/index.css Normal file
View file

@ -0,0 +1,38 @@
.actor--player.style-v1 {
--header-size: 75px;
}
.actor--player.style-v1 form {
display: flex;
flex-direction: column;
gap: 8px;
}
.actor--player.style-v1 .header-row {
display: flex;
flex-direction: row;
border-radius: 4px;
border: 1px solid var(--color-underline-header);
}
.actor--player.style-v1 .avatar {
--size: var(--header-size);
width: var(--size);
height: var(--size);
border: none;
border-right: 1px solid var(--color-underline-header);
}
.actor--player.style-v1 .actor-name {
height: var(--header-size);
padding: 8px 1rem;
font-size: clamp(1rem, 2rem, var(--header-size) - 16px);
border: none;
}
.actor--player.style-v1 prose-mirror {
--menu-background: rgba(0, 0, 0, 0.1);
flex-grow: 1;
border: 1px solid var(--color-underline-header);
border-radius: 4px;
}
.actor--player.style-v1 prose-mirror .editor-container {
height: auto;
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../styles/v1/player/root.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;EACC;;AAEA;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAEA;EACC%22,%22file%22:%22index.css%22%7D */

38
.styles/v1/player/root.css Normal file
View file

@ -0,0 +1,38 @@
.actor--player.style-v1 {
--header-size: 75px;
}
.actor--player.style-v1 form {
display: flex;
flex-direction: column;
gap: 8px;
}
.actor--player.style-v1 .header-row {
display: flex;
flex-direction: row;
border-radius: 4px;
border: 1px solid var(--color-underline-header);
}
.actor--player.style-v1 .avatar {
--size: var(--header-size);
width: var(--size);
height: var(--size);
border: none;
border-right: 1px solid var(--color-underline-header);
}
.actor--player.style-v1 .actor-name {
height: var(--header-size);
padding: 8px 1rem;
font-size: clamp(1rem, 2rem, var(--header-size) - 16px);
border: none;
}
.actor--player.style-v1 prose-mirror {
--menu-background: rgba(0, 0, 0, 0.1);
flex-grow: 1;
border: 1px solid var(--color-underline-header);
border-radius: 4px;
}
.actor--player.style-v1 prose-mirror .editor-container {
height: auto;
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/v1/player/root.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;EACC;;AAEA;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;;AAEA;EACC%22,%22file%22:%22root.css%22%7D */

12
.styles/v1/v1/player/root.css Normal file
View file

@ -0,0 +1,12 @@
.actor--player.style-v1 .header-row {
display: flex;
flex-direction: row;
gap: 8px;
}
.actor--player.style-v1 .avatar {
--size: 75px;
width: var(--size);
height: var(--size);
}
/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../../styles/v1/v1/player/root.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AACC;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA%22,%22file%22:%22root.css%22%7D */

2
.vscode/settings.json vendored
View file

@ -8,7 +8,7 @@
"git.branchProtection": [],
"files.exclude": {
"*.lock": true,
".styles": true,
".styles": false,
"node_modules": true,
"packs": true,
},

2
package-lock.json generated
View file

@ -1,5 +1,5 @@
{
"name": "foundry-system-template",
"name": "Text-Actors-Foundry",
"lockfileVersion": 3,
"requires": true,
"packages": {

8
src/documents/Actor/Player/Model.mjs
View file

@ -1,6 +1,12 @@
export class PlayerData extends foundry.abstract.TypeDataModel {
static defineSchema() {
const fields = foundry.data.fields;
return {};
return {
content: new fields.HTMLField({
blank: true,
trim: true,
initial: ``,
}),
};
};
};

5
src/main.mjs
View file

@ -4,6 +4,8 @@ import { ActorProxy } from "./documents/Actor/_proxy.mjs";
import { ChatMessageProxy } from "./documents/ChatMessage/_proxy.mjs";
import { ItemProxy } from "./documents/Item/_proxy.mjs";
// DataModel Imports
import { PlayerData } from "./documents/Actor/Player/Model.mjs";
// Misc Imports
import "./utils/logger.mjs";
@ -19,6 +21,9 @@ Hooks.once(`init`, () => {
registerSettings();
// Data Models
CONFIG.Actor.dataModels.player = PlayerData;
// Update document classes
CONFIG.Actor.documentClass = ActorProxy;
CONFIG.Item.documentClass = ItemProxy;

16
src/sheets/Player/v1.mjs
View file

@ -4,9 +4,23 @@ export class PlayerSheetv1 extends ActorSheet {
super.defaultOptions,
{
template: `systems/${game.system.id}/templates/Player/v1/main.hbs`,
classes: [],
},
);
opts.classes.push(`style-v1`);
opts.classes = [`actor--player`, `style-v1`];
return opts;
};
async getData() {
const ctx = {};
ctx.editable = this.isEditable;
const actor = ctx.actor = this.actor;
ctx.system = actor.system;
ctx.enriched = { system: {} };
ctx.enriched.system.content = await TextEditor.enrichHTML(actor.system.content);
return ctx;
};
}

1
styles/root.scss
View file

@ -0,0 +1 @@
@use "./v1/index.scss";

10
styles/v1/components/incrementer.scss
View file

@ -6,7 +6,6 @@ the corresponding web component. Importing this into other files is forbidden
$default-border-radius: 4px;
$default-height: 1.5rem;
@use "../mixins/material";
@use "./common.scss";
div {
@ -14,15 +13,6 @@ div {
grid-template-columns: var(--height, $default-height) var(--width, 50px) var(--height, $default-height);
grid-template-rows: var(--height, 1fr);
border-radius: var(--border-radius, $default-border-radius);
@include material.elevate(2);
&:hover {
@include material.elevate(4);
}
&:focus-within {
@include material.elevate(6);
}
}
span, input {

4
styles/v1/index.scss
View file

@ -1 +1,3 @@
// Styling version 1
// Styling version 1
@use "./player/root.scss";

42
styles/v1/player/root.scss Normal file
View file

@ -0,0 +1,42 @@
.actor--player.style-v1 {
--header-size: 75px;
form {
display: flex;
flex-direction: column;
gap: 8px;
}
.header-row {
display: flex;
flex-direction: row;
border-radius: 4px;
border: 1px solid var(--color-underline-header);
}
.avatar {
--size: var(--header-size);
width: var(--size);
height: var(--size);
border: none;
border-right: 1px solid var(--color-underline-header);
}
.actor-name {
height: var(--header-size);
padding: 8px 1rem;
font-size: clamp(1rem, 2rem, calc(var(--header-size) - 16px));
border: none;
}
prose-mirror {
--menu-background: rgba(0, 0, 0, 0.1);
flex-grow: 1;
border: 1px solid var(--color-underline-header);
border-radius: 4px;
.editor-container {
height: auto;
}
}
}

12
system.json
View file

@ -1,6 +1,6 @@
{
"id": "fst",
"title": "Foundry System Template",
"id": "taf",
"title": "Text-Based Actors",
"description": "",
"version": "0.0.0",
"download": "",
@ -15,12 +15,16 @@
"esmodules": [
"src/main.mjs"
],
"styles": [],
"styles": [
".styles/root.css"
],
"packs": [],
"documentTypes": {
"Actor": {
"player": {
"htmlFields": [],
"htmlFields": [
"content"
],
"filePathFields": {}
}
},

32
templates/Player/v1/main.hbs
View file

@ -1,3 +1,29 @@
<form autocomplete="off" class="actor--pc-v2">
Hello Foundry
</form>
<form autocomplete="off">
<div class="header-row">
<img
class="avatar"
src="{{actor.img}}"
data-edit="img"
title="{{actor.name}}"
/>
<input
type="text"
name="name"
value="{{actor.name}}"
class="actor-name"
>
</div>
{{#if editable}}
<prose-mirror
class="actor-text"
name="system.content"
value="{{system.content}}"
collaborate="true"
data-document-uuid="{{actor.uuid}}"
>
{{{enriched.system.content}}}
</prose-mirror>
{{else}}
{{{enriched.system.content}}}
{{/if}}
</form>