TyphonJS•2y ago

TJSDocument for aggregating actor flags for Svelte Component

I'm sure this is very simple, but I'm having a hard time understanding how to get this to work. Maybe someone can provide a quicker pointer or two. For a module I'm working on, I'm storing attributes as flags on the Actors document. An example is as such:

_ActorPF2e2 : {
  ....
  flags: {
    fvtt-knowledge-recalled-pf2e: {
      npcFlags: *myFlags exist here*
    }
  }  
}

_ActorPF2e2 : {
  ....
  flags: {
    fvtt-knowledge-recalled-pf2e: {
      npcFlags: *myFlags exist here*
    }
  }  
}

To gather this data with the TJSDocument method I have the following code

const doc = new TJSDocument();
const NPC = doc.embedded.create(Actors,
   {
   flags: {
      npcFlags: doc?.flags?.npcFlags,
   }
});

const doc = new TJSDocument();
const NPC = doc.embedded.create(Actors,
   {
   flags: {
      npcFlags: doc?.flags?.npcFlags,
   }
});

To explore what the objects look like and what kind of returns I should expect I've been implementing with this function here:

function onDrop(event)
{
   try
   {
      doc.setFromDataTransfer(JSON.parse(event.dataTransfer.getData('text/plain')));
      console.log("Knowledge Recalled onDrop: ", doc.embedded.create(Actors));
   }
   catch (err) { /**/ }
}

function onDrop(event)
{
   try
   {
      doc.setFromDataTransfer(JSON.parse(event.dataTransfer.getData('text/plain')));
      console.log("Knowledge Recalled onDrop: ", doc.embedded.create(Actors));
   }
   catch (err) { /**/ }
}

Using the Essential Svelte as a template to drag an actor over to see if I can extract the data I want. Create requires a second argument, but in my experimenting I've tried the parameter that I posted above for the NPC variable, but I left it out of the implementation here for brevity. I also tried create(Actors, 'flags.npcFlags'). It's clear that I don't really understand how DynOptionsMapCreate works. The output that I'm receiving is a DynMapReducer object with a null value in the array. I've have to step away to head to work, so I'll continue to explore later today, but I figured I'd post here to see if maybe there was something simple that I'm missing here. I appreciate any help here.

3 Replies

chimisOP•2y ago

Based on what is being done here:

   const wildcard = doc.embedded.create(Item, {
      name: 'wildcard',
      filters: [filterSearch],
      sort: (a, b) => a.name.localeCompare(b.name)
   });

   const wildcard = doc.embedded.create(Item, {
      name: 'wildcard',
      filters: [filterSearch],
      sort: (a, b) => a.name.localeCompare(b.name)
   });

It's pretty clear that I need to pass more parameters to get the Dyn reducer to work than just passing it "the location of the object" or a "string" to search.

TyphonJS (Michael)•2y ago

That's definitely not how to use the reactive embedded collection support. I think a good quick start is to check out the document / TJSDocument related demos in essential-svelte-esm. There are only a couple and indeed a bit more you can do w/ TJSDocument and reactive embedded collections. (looks like you are / have done that). TJSDocument takes an actual Foundry document and wraps it essentially making it like a readable Svelte store insofar that you get callbacks or reactive / updates when using it as a store in a Svelte component when the document changes. You still need to use the core Foundry document update mechanism. For reactive embedded collections it's useful to check out the demo in essential-svelte-esm. The support for these collections is "DynMapReducer" which provides mechanisms to filter / sort maps non-destructively. Foundry embedded collections are Maps. So the API is unique to TRL and doesn't have anything to do with setting data of the backing document. I will be adding more descriptions and examples into the API docs in the coming weeks and the reactive embedded collection and TJSDocument angle in general could use some thorough descriptions. The demo in essential-svelte-esm is one way to set things up; the created DynMapReducer instance also has an API to change / add filters and sorting functions, but the object w/ name / filters / sort properties simply sets them up in one go during creation. You can also do some tricky things with both the filter and sort functions you assign as you can create a function that also is a Svelte store. That is what filterSearch is which is created by a helper resource that generates some common patterns. filterSearch is also set to the input element so when you change the "type" via text entry it automatically updates the non-destructive indexes over the backing Foundry embedded collection / Map. Re: some of your initial demo code blocks. You'd never set or work with flags via embedded collections w/ Foundry core or the TRL reactive embedded collections at least in the creation of a reducer. I can see how the "create" method name could be confusing, but it is for creating the reactive embedded collection instance linking it with an existing embedded collection available from the Foundry document you associate w/ TJSDocument. Specific filter / sort methods that target data in the documents in the collection may need to be custom built and there are many flexible ways to do this, but more documentation and potentially demos are necessary for sure. The demo side is tricky because it's hard to make a more complex demo that is system neutral when you are targeting specific data. I assume you are familiar with the core Foundry document model and working w/ core embedded collections? I'll also be glad to try to work through a full example specific to your use case in reducing an embedded collection. One thing that I want to make sure is that this is for embedded collections in a document. It seems like you want to reduce all actors the Actor collection game.actors, etc. That is possible by directly using DynMapReducer and we can also look at a concrete example next week. So, definitely try to state clearly what you are interested in attempting.

chimisOP•2y ago

Sorry it took me some time to respond. I'm working on a module that provides an overhaul to the recall knowledge functionality of PF2e. From a data perspective, I'm collecting the attributes which are pertinent to knowledge recall checks (lowest save, abilities, spells, and descriptions that are tied to the actor. An example object with the flags will look as such:

pf2eNPC: {
  flags: {
    NPCFlags: {
      ...
      spellAbilities: [
        {name: fireball, tradition: arcane, description: `some string`, visibility: false},
      ]
    }
  }
}

pf2eNPC: {
  flags: {
    NPCFlags: {
      ...
      spellAbilities: [
        {name: fireball, tradition: arcane, description: `some string`, visibility: false},
      ]
    }
  }
}

If a player wishes to use a recall knowledge ability and suceeds the GUI provides an interface for the GM to toggle vilibility, through the GMJournal, and this populates an entry in the PlayerJournal. This data is also stored as a JSON file in persistant storage to keep track of all past recall knowledge attemtps so that the PlayerJournal remains populated as they go through the campaign. It's very similar to how a pokedex works in pokemon, and has similarities to the Wrath of the Righteous feature allowing you to see knowledge information when you hover over enemies in that CRPG. The player journal, during foundry initialization, is populated by an array that is sourced by the JSON file we store between sessions. The GM journal is only ever populated by active encounters. What I was working on above was going to be similar to implementation throughout when I'm trying to get that data in the svelte component. The TJSDocument, I was attempting, was to be a wrapper for the actors in my array so that I could use that store to populate the view. I have on the class for the NPCModel the methods being utilized for actually updating, instantiating, and deleting flags. The functionality here is just to take an array of foundry Actor documents and be able to implement them in the vue. The GMJournal, and the codeblock I first provided was intended to take an array of documents that are populated by an array of active encounters, and their actors. If there are multiple encounters, they should be separated by different tabs. The array of actors for the given encounter selected, will provide a carasel of all of the actors to cycle through, and it will provide one NPCFocus, which provides the data for the selected NPC. The store functionality will be useful for, and I'm hoping to use it to subscribe to changes that occur on the actor document itself (for instance if someone changes the fortitude save value which would change which save is considered the 'lowest save'). I don't need TJS to update that information on the foundry document or on my flags, but when my flags values change I would like for me to be able to mediate those changes between the backend and the view. For instance, if the gm changes the visibility of a flag property by clicking an eyeball icon, that change could be passed to the subscribers (I'm assuming) which could change the objects value at the foundry level, and the playerJournal which is also subscribed to that document would be notified to reflect the visibility of property on the players journal. Hopefully this isn't too high level of a description of what the module does. If I need to provide more details somwhere I certainly can.

Gaming

Programming

TJSDocument for aggregating actor flags for Svelte Component