mirror of
https://github.com/RoY7x/worldbuilding.git
synced 2025-04-30 02:31:41 -04:00
Improve Simple Worldbuilding sheet layout and macro syntax
This commit is contained in:
Andrew
parent
6dbee061d6
commit
d405a18f53
8 changed files with 350 additions and 138 deletions
|
|
@ -33,14 +33,6 @@ export class SimpleActorSheet extends ActorSheet {
|
|||
activateListeners(html) {
|
||||
super.activateListeners(html);
|
||||
|
||||
// Activate tabs
|
||||
let tabs = html.find('.tabs');
|
||||
let initial = this._sheetTab;
|
||||
new Tabs(tabs, {
|
||||
initial: initial,
|
||||
callback: clicked => this._sheetTab = clicked.data("tab")
|
||||
});
|
||||
|
||||
// Everything below here is only needed if the sheet is editable
|
||||
if (!this.options.editable) return;
|
||||
|
||||
|
|
@ -64,6 +56,17 @@ export class SimpleActorSheet extends ActorSheet {
|
|||
|
||||
/* -------------------------------------------- */
|
||||
|
||||
/** @override */
|
||||
setPosition(options={}) {
|
||||
const position = super.setPosition(options);
|
||||
const sheetBody = this.element.find(".sheet-body");
|
||||
const bodyHeight = position.height - 192;
|
||||
sheetBody.css("height", bodyHeight);
|
||||
return position;
|
||||
}
|
||||
|
||||
/* -------------------------------------------- */
|
||||
|
||||
/**
|
||||
* Listen for click events on an attribute control to modify the composition of attributes in the sheet
|
||||
* @param {MouseEvent} event The originating left click event
|
||||
|
|
|
|||
35
module/actor.js
Normal file
35
module/actor.js
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
/**
|
||||
* Extend the base Actor entity by defining a custom roll data structure which is ideal for the Simple system.
|
||||
* @extends {Actor}
|
||||
*/
|
||||
export class SimpleActor extends Actor {
|
||||
|
||||
/** @override */
|
||||
getRollData() {
|
||||
const data = super.getRollData();
|
||||
const shorthand = game.settings.get("worldbuilding", "macroShorthand");
|
||||
|
||||
// Re-map all attributes onto the base roll data
|
||||
if ( !!shorthand ) {
|
||||
for ( let [k, v] of Object.entries(data.attributes) ) {
|
||||
if ( !(k in data) ) data[k] = v.value;
|
||||
}
|
||||
delete data.attributes;
|
||||
}
|
||||
|
||||
// Map all items data using their slugified names
|
||||
data.items = this.data.items.reduce((obj, i) => {
|
||||
let key = i.name.slugify({strict: true});
|
||||
let itemData = duplicate(i.data);
|
||||
if ( !!shorthand ) {
|
||||
for ( let [k, v] of Object.entries(itemData.attributes) ) {
|
||||
if ( !(k in itemData) ) itemData[k] = v.value;
|
||||
}
|
||||
delete itemData["attributes"];
|
||||
}
|
||||
obj[key] = itemData;
|
||||
return obj;
|
||||
}, {});
|
||||
return data;
|
||||
}
|
||||
}
|
||||
|
|
@ -29,18 +29,21 @@ export class SimpleItemSheet extends ItemSheet {
|
|||
|
||||
/* -------------------------------------------- */
|
||||
|
||||
/** @override */
|
||||
setPosition(options={}) {
|
||||
const position = super.setPosition(options);
|
||||
const sheetBody = this.element.find(".sheet-body");
|
||||
const bodyHeight = position.height - 192;
|
||||
sheetBody.css("height", bodyHeight);
|
||||
return position;
|
||||
}
|
||||
|
||||
/* -------------------------------------------- */
|
||||
|
||||
/** @override */
|
||||
activateListeners(html) {
|
||||
super.activateListeners(html);
|
||||
|
||||
// Activate tabs
|
||||
let tabs = html.find('.tabs');
|
||||
let initial = this._sheetTab;
|
||||
new Tabs(tabs, {
|
||||
initial: initial,
|
||||
callback: clicked => this._sheetTab = clicked.data("tab")
|
||||
});
|
||||
|
||||
// Everything below here is only needed if the sheet is editable
|
||||
if (!this.options.editable) return;
|
||||
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@
|
|||
*/
|
||||
|
||||
// Import Modules
|
||||
import { SimpleActor } from "./actor.js";
|
||||
import { SimpleItemSheet } from "./item-sheet.js";
|
||||
import { SimpleActorSheet } from "./actor-sheet.js";
|
||||
|
||||
|
|
@ -24,9 +25,22 @@ Hooks.once("init", async function() {
|
|||
decimals: 2
|
||||
};
|
||||
|
||||
// Define custom Entity classes
|
||||
CONFIG.Actor.entityClass = SimpleActor;
|
||||
|
||||
// Register sheet application classes
|
||||
Actors.unregisterSheet("core", ActorSheet);
|
||||
Actors.registerSheet("dnd5e", SimpleActorSheet, { makeDefault: true });
|
||||
Items.unregisterSheet("core", ItemSheet);
|
||||
Items.registerSheet("dnd5e", SimpleItemSheet, {makeDefault: true});
|
||||
|
||||
// Register system settings
|
||||
game.settings.register("worldbuilding", "macroShorthand", {
|
||||
name: "Shortened Macro Syntax",
|
||||
hint: "Enable a shortened macro syntax which allows referencing attributes directly, for example @str instead of @attributes.str.value. Disable this setting if you need the ability to reference the full attribute model, for example @attributes.str.label.",
|
||||
scope: "world",
|
||||
type: Boolean,
|
||||
default: true,
|
||||
config: true
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,109 +1,100 @@
|
|||
.worldbuilding.sheet .window-content {
|
||||
.worldbuilding {
|
||||
/* Sheet Tabs */
|
||||
/* Items List */
|
||||
/* Attributes */
|
||||
}
|
||||
.worldbuilding .window-content {
|
||||
height: 100%;
|
||||
padding: 5px;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
/* Sheet Header */
|
||||
.worldbuilding.sheet .sheet-header {
|
||||
.worldbuilding .sheet-header {
|
||||
height: 100px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
flex: 0 0 100px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .profile-img {
|
||||
.worldbuilding .sheet-header .profile-img {
|
||||
flex: 0 0 100px;
|
||||
height: 100px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .header-fields {
|
||||
.worldbuilding .sheet-header .header-fields {
|
||||
flex: 1;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .charname {
|
||||
height: 60px;
|
||||
padding: 5px;
|
||||
margin: 0;
|
||||
.worldbuilding .sheet-header h1.charname {
|
||||
height: 50px;
|
||||
padding: 0px;
|
||||
margin: 5px 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
.worldbuilding.sheet .charname input {
|
||||
.worldbuilding .sheet-header h1.charname input {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .resource {
|
||||
height: 40px;
|
||||
.worldbuilding .resource {
|
||||
width: 50%;
|
||||
padding: 3px 10px;
|
||||
height: 40px;
|
||||
margin-top: 10px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
}
|
||||
.worldbuilding.sheet .resource input {
|
||||
.worldbuilding .resource input {
|
||||
width: 100px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
/* Navigation Tabs */
|
||||
.worldbuilding.sheet .tabs {
|
||||
flex: 0 0 40px;
|
||||
.worldbuilding .tabs {
|
||||
height: 40px;
|
||||
border-top: 1px solid #AAA;
|
||||
border-bottom: 1px solid #AAA;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .tabs .item {
|
||||
.worldbuilding .tabs .item {
|
||||
line-height: 40px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .tabs .item.active {
|
||||
.worldbuilding .tabs .item.active {
|
||||
text-decoration: underline;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
/* Content Tabs */
|
||||
.worldbuilding.sheet .sheet-body {
|
||||
height: calc(100% - 160px);
|
||||
.worldbuilding .sheet-body {
|
||||
overflow: hidden;
|
||||
}
|
||||
.worldbuilding.sheet .sheet-body .tab {
|
||||
.worldbuilding .sheet-body .tab {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.worldbuilding .editor,
|
||||
.worldbuilding .editor-content {
|
||||
height: 100%;
|
||||
}
|
||||
.worldbuilding.sheet .sheet-body .editor {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
/* Items */
|
||||
.worldbuilding.sheet .items-list {
|
||||
.worldbuilding .items-list {
|
||||
list-style: none;
|
||||
margin: 7px 0;
|
||||
padding: 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.worldbuilding.sheet .items-list .item {
|
||||
.worldbuilding .items-list .item {
|
||||
height: 30px;
|
||||
line-height: 24px;
|
||||
padding: 3px 0;
|
||||
border-bottom: 1px solid #BBB;
|
||||
}
|
||||
.worldbuilding.sheet .items-list .item img {
|
||||
.worldbuilding .items-list .item img {
|
||||
flex: 0 0 24px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.worldbuilding.sheet .items-list .item-name {
|
||||
.worldbuilding .items-list .item-name {
|
||||
margin: 0;
|
||||
}
|
||||
.worldbuilding.sheet .items-list .item-controls {
|
||||
.worldbuilding .items-list .item-controls {
|
||||
flex: 0 0 36px;
|
||||
}
|
||||
|
||||
/* Attributes */
|
||||
.worldbuilding.sheet .attributes-header {
|
||||
.worldbuilding .attributes-header {
|
||||
padding: 5px;
|
||||
margin: 5px 0;
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
|
|
@ -112,20 +103,18 @@
|
|||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
.worldbuilding.sheet .attribute-label {
|
||||
.worldbuilding .attributes-header .attribute-label {
|
||||
flex: 1.5;
|
||||
}
|
||||
.worldbuilding.sheet .attribute-control {
|
||||
.worldbuilding .attributes-header .attribute-control {
|
||||
flex: 0 0 20px;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .attributes-list {
|
||||
.worldbuilding .attributes-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .attributes-list li > * {
|
||||
.worldbuilding .attributes-list li > * {
|
||||
margin: 0 3px;
|
||||
height: 28px;
|
||||
line-height: 24px;
|
||||
|
|
@ -134,11 +123,17 @@
|
|||
border-radius: 0;
|
||||
border-bottom: 1px solid #AAA;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .attribute-value.checkbox {
|
||||
.worldbuilding .attributes-list a.attribute-control {
|
||||
flex: 0 0 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.worldbuilding.sheet .attributes-list li a.attribute-control {
|
||||
line-height: 28px;
|
||||
border: none;
|
||||
}
|
||||
.worldbuilding.sheet.actor {
|
||||
min-width: 560px;
|
||||
min-height: 420px;
|
||||
}
|
||||
.worldbuilding.sheet.item {
|
||||
min-width: 460px;
|
||||
min-height: 400px;
|
||||
}
|
||||
|
|
|
|||
162
styles/simple.less
Normal file
162
styles/simple.less
Normal file
|
|
@ -0,0 +1,162 @@
|
|||
.worldbuilding {
|
||||
.window-content {
|
||||
height: 100%;
|
||||
padding: 5px;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.sheet-header {
|
||||
height: 100px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.profile-img {
|
||||
flex: 0 0 100px;
|
||||
height: 100px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.header-fields {
|
||||
flex: 1;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
h1.charname {
|
||||
height: 50px;
|
||||
padding: 0px;
|
||||
margin: 5px 0;
|
||||
border-bottom: 0;
|
||||
input {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.resource {
|
||||
width: 50%;
|
||||
height: 40px;
|
||||
margin-top: 10px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
input {
|
||||
width: 100px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Sheet Tabs */
|
||||
.tabs {
|
||||
height: 40px;
|
||||
border-top: 1px solid #AAA;
|
||||
border-bottom: 1px solid #AAA;
|
||||
|
||||
.item {
|
||||
line-height: 40px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.item.active {
|
||||
text-decoration: underline;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sheet-body {
|
||||
overflow: hidden;
|
||||
.tab {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.editor, .editor-content {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Items List */
|
||||
.items-list {
|
||||
list-style: none;
|
||||
margin: 7px 0;
|
||||
padding: 0;
|
||||
overflow-y: auto;
|
||||
|
||||
.item {
|
||||
height: 30px;
|
||||
line-height: 24px;
|
||||
padding: 3px 0;
|
||||
border-bottom: 1px solid #BBB;
|
||||
|
||||
img {
|
||||
flex: 0 0 24px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.item-name {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.item-controls {
|
||||
flex: 0 0 36px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Attributes */
|
||||
.attributes-header {
|
||||
padding: 5px;
|
||||
margin: 5px 0;
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
border: 1px solid #AAA;
|
||||
border-radius: 2px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
|
||||
.attribute-label {
|
||||
flex: 1.5;
|
||||
}
|
||||
|
||||
.attribute-control {
|
||||
flex: 0 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.attributes-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li > * {
|
||||
margin: 0 3px;
|
||||
height: 28px;
|
||||
line-height: 24px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
border-bottom: 1px solid #AAA;
|
||||
}
|
||||
|
||||
a.attribute-control {
|
||||
flex: 0 0 20px;
|
||||
text-align: center;
|
||||
line-height: 28px;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.worldbuilding.sheet.actor {
|
||||
min-width: 560px;
|
||||
min-height: 420px;
|
||||
}
|
||||
|
||||
|
||||
.worldbuilding.sheet.item {
|
||||
min-width: 460px;
|
||||
min-height: 400px;
|
||||
}
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
"name": "worldbuilding",
|
||||
"title": "Simple World-Building",
|
||||
"description": "A minimalist game system with very simple Actor and Item models to support free-form system agnostic gameplay.",
|
||||
"version": 0.34,
|
||||
"version": 0.35,
|
||||
"minimumCoreVersion": "0.5.2",
|
||||
"compatibleCoreVersion": "0.5.5",
|
||||
"templateVersion": 2,
|
||||
|
|
@ -17,6 +17,6 @@
|
|||
"secondaryTokenAttribute": "power",
|
||||
"url": "https://gitlab.com/foundrynet/worldbuilding/",
|
||||
"manifest": "https://gitlab.com/foundrynet/worldbuilding/raw/master/system.json",
|
||||
"download": "https://gitlab.com/foundrynet/worldbuilding/-/archive/release-034/worldbuilding-release-034.zip",
|
||||
"download": "https://gitlab.com/foundrynet/worldbuilding/-/archive/release-035/worldbuilding-release-035.zip",
|
||||
"license": "LICENSE.txt"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
<section class="sheet-body">
|
||||
|
||||
{{!-- Biography Tab --}}
|
||||
<div class="tab biography active" data-group="primary" data-tab="description">
|
||||
<div class="tab biography" data-group="primary" data-tab="description">
|
||||
{{editor content=data.biography target="data.biography" button=true owner=owner editable=editable}}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue