TyphonJS•2y ago

Settings are not a store and Chat Messages Talk

I wanted to grab the TJSGameSettings stores, but it seems that they are not actual stores? They have subscribe, set, and update methods... What I am doing here is essentially

gameSettings = new TJSGameSettings("pf2e-target-damage")
console.log($gameSettings.getWritableStore("classic"))

gameSettings = new TJSGameSettings("pf2e-target-damage")
console.log($gameSettings.getWritableStore("classic"))

23 Replies

VauxsOP•2y ago

welp solved my own issue

 const classic = gameSettings.getStore("classic");
 console.log("Hello, world!", $classic);

 const classic = gameSettings.getStore("classic");
 console.log("Hello, world!", $classic);

TyphonJS (Michael)•2y ago

Yeah. TJSGameSettings isn't a store itself, but more of a manager / conduit between Foundry game.settings providing the registration w/ Foundry and the wiring up w/ connecting things to a Svelte store. Check out the way TJSGameSettings is used in Auto Animations and my unpublished module "TinyMCE Everywhere". In general you need to register your settings through TJSGameSettings as data that it can use to create backing stores. There definitely can be better explanations w/ a dev guide in the future: https://github.com/typhonjs-fvtt/mce-everywhere/blob/main/src/model/mceGameSettings.js https://github.com/otigon/automated-jb2a-animations/blob/main/src/gameSettings.js

VauxsOP•2y ago

right now just wanting to make use of the store functionality, still going to use the Foundry settings page for sake of my sanity 😩

TyphonJS (Michael)•2y ago

The nice thing about the TJSGameSettings UI angle is that it is realtime changes which can be useful for certain design goals. The settings component can also be embedded inside of an application instead of located in a separate area of the Foundry UI. Certainly a theme editor comes to mind in that case. Changes you make as a GM reflect across all clients in realtime. The other use case in auto-animations is that GM changes to animation data is reflected in realtime across all clients, but in both cases only GM users have access to those settings. You can still use the main Foundry settings capability. Any changes to invoking game.settings.set(....) programmatically or through the stock Foundry UI are instantly updated in the associated TJSGameSettings stores. You can hook up the stores however you like in Svelte or JS code.

VauxsOP•2y ago

Yep, and that's lovely For Target Damage it's really just a point of convenience to have the settings immediately reflected in how the messages are styled. That module is just jQuery hell https://github.com/MrVauxs/PF2e-Target-Damage/blob/master/module/target-damage.js

TyphonJS (Michael)•2y ago

Perhaps check out the basic chat-message example in essential-svelte-esm. Potentially you can have a Svelte component load for the chat message and you could easily access settings stores to change the display even for previous chat messages already initially rendered. https://github.com/typhonjs-fvtt-demo/essential-svelte-esm/blob/main/src/chatmessage.js https://github.com/typhonjs-fvtt-demo/essential-svelte-esm/tree/main/src/view/chatmessage

VauxsOP•2y ago

already doing so

VauxsOP•2y ago

https://github.com/MrVauxs/PF2e-Target-Damage/blob/svelte-dev/src/view/TargetDamage.svelte

GitHub

PF2e-Target-Damage/TargetDamage.svelte at svelte-dev · MrVauxs/PF2e...

Contribute to MrVauxs/PF2e-Target-Damage development by creating an account on GitHub.

TyphonJS (Michael)•2y ago

Nice... Love it... "Svelte Messages, this will be interesting"

VauxsOP•2y ago

just realized how easy this will be with {#each} chefskiss

TyphonJS (Michael)•2y ago

It's great to have a module using the core APIs trying to push things as far as possible until a breaking point is reached where a new approach leads to further progress!

VauxsOP•2y ago

No reRenderDamageButtons()!

VauxsOP•2y ago

I guess I will continue here, is there a way to have the component add stuff outside of itself? Like, a button that is contained inside the roll section, not attached to the bottom of the message

VauxsOP•2y ago

Nekro Darkmoon•2y ago

https://github.com/Pjb518/FoundryVTT-Level-Up-Official/tree/main/src/apps/chat If you want to take a look, almost all of our chat cards are made with svelte Maybe you'll find something useful in there.

VauxsOP•2y ago

Unfortunately don't want to create entire new chat cards with it, just add more stuff. But I think I got it. In the meantime, this comment seems to be false?

/**
 * This hook is necessary for _modules_ that include Svelte components attached to chat messages. As things go on
 * initial setup and rendering of Foundry the chat log is rendered before modules initially can register for the
 * `renderChatMessage` hook. This hook is _not_ necessary for game systems as systems are initialized / loaded before
 * Foundry core renders the chat log for the first time.
 */

/**
 * This hook is necessary for _modules_ that include Svelte components attached to chat messages. As things go on
 * initial setup and rendering of Foundry the chat log is rendered before modules initially can register for the
 * `renderChatMessage` hook. This hook is _not_ necessary for game systems as systems are initialized / loaded before
 * Foundry core renders the chat log for the first time.
 */

At least from what I can see, I don't need the ready hook Everything is rendered as it should be from renderChatMessage already

TyphonJS (Michael)•2y ago

I believe that is for the chat history on startup to attach or render a complete chat message component for previous chat messages. It's been a while since I reviewed that demo, so perhaps things may have changed.

VauxsOP•2y ago

It may have been, but that is no longer the case. Target Damage had no issues with working off of renderChatMessage exclusively and neither does this svelte version also very nice to be able to just, add a svelte component anywhere

VauxsOP•2y ago

I can just compartmentalize everything grineerFeelsGood

TyphonJS (Michael)•2y ago

Also it might be handy to review the docs for instantiating a Svelte component. https://svelte.dev/docs#run-time-client-side-component-api-creating-a-component When supplying a target that renders at the end of the target children. You can also supply a anchor element that places the component before that element in the children of target. The "Svelte configuration object" that TRL uses essentially is the same configuration data used for instantiating a Svelte component.

VauxsOP•2y ago

oh perfect I hadn't had to fix that thanks to CSS but this will definitely help, thank you

Gaming

Programming

Settings are not a store and Chat Messages Talk