Relic Comments - Answer Overflow

Relic

Posts Comments

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

Current state https://github.com/Relic-Repo/Fates-Descent

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

I added in an indicator/toggle for the GM for those players that rolled the wrong thing. Check is Blue and Orange is Save. The button will toggle to fix those types of in game play errors.

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

Going to add an option to expand this to all d20 tests.

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

Adding a clear array on setup hook too

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

I got it working. Well to be honest the "import { writable } from 'svelte/store';" was working all along, it was the dumb human. See the code is sett up to take the Save/Test data after a player rolls a save and adds it to an array I have in settings. If the array is empty it also calls the SanityApp. The SanityApp reads the global array sets up the writable store to watch for changes. The handleRoll and handleCancel are set up respectively add the form data nad completes the roll and the later just passes the roll along. But they both remove their reference entry from the settings array. As other players roll it sees teh array is not empty and just appends the new request object. Wellllll if the App is closed like it would be on a refresh, but the array isn't empty because you haven't been going through all of the form process. So yeah it dawned on me to check the array and sure enough it was loaded down. After I cleared it function returned.

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

Oh cool learned something new

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

This one here is my first module I need to get registered with FVTT
https://github.com/Relic-Repo/Fates-Folly

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

Alright. After this one is complete and more functionality added, this is just the dialog app side, I have a Feat -> Talents conversion module to start which will heavily use svelte and a master automation module to flesh out.

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

I have checked the current state code for function in this way and they can loaded the app in the older version before I started this “app expansion” part I’m doing now. Currently it just opens a new app with each incoming request.

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

I’m currently registering with socketLib and the player clients send the request via socket. After that it’s all handle on the GM’s side.

21 replies

TTyphonJS

•Created by Relic on 5/28/2024 in #typhonjs-runtime

Global Arrays & Writable Stores

I haven't gotten into the "making branches" part of my learning just yet and don't want to overwrite what is there. I will sort that out tonight though.

21 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

11 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

Though I am going to toss that in now to see how it looks

11 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

Well I want to give it that lovely glass appearance like your esm testing module main app has, but I have another piece of functionality I need to incorporate. I first have to set some of these inputs on a Horizontal plain and prefix the Actor name onto because my intention is to just update the one App with all inbound roll requests if the App is already open. i was going to wait to do final stylings until i had that arrangement done.

11 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

Taking note of that getContext

11 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

Yep that did it

11 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

Well let me get rid of the unused method too

11 replies

TTyphonJS

•Created by Relic on 5/23/2024 in #typhonjs-runtime

Application !Closing

So like this

<script>
  import { getContext } from 'svelte';
  import { ApplicationShell } from '#runtime/svelte/component/core';
  import { FatesDescentRoll } from '../FatesDescentRoll.js';

  export let actorId;
  export let type;
  export let config;
  export let performRoll = FatesDescentRoll.performRoll;
  export let elementRoot;

  const { application } = getContext('#external');

  let severities = [
    { id: 'minimal', text: 'Minimal (DC 8)' },
    { id: 'moderate', text: 'Moderate (DC 12)' },
    { id: 'serious', text: 'Serious (DC 16)' },
    { id: 'extreme', text: 'Extreme (DC 20)' }
  ];

  let selectedSeverity = severities[0];
  let useCustomDC = false;
  let customDC = 0;
  let useCustomLoss = false;
  let loss = 0;

  

  function handleRoll() {
    const lossInput = useCustomLoss ? loss : { 'minimal': '1d4', 'moderate': '1d6', 'serious': '1d8', 'extreme': '1d10' }[selectedSeverity.id];
    performRoll(actorId, selectedSeverity.id, customDC, type, lossInput, config, useCustomDC, useCustomLoss);
    application.close();
  }

  function handleCancel() {
    const method = type === 'save' ? 'rollAbilitySave' : 'rollAbilityTest';
    const rollOptions = {
      chatMessage: true,
      fastForward: true,
      fromDialog: true,
      advantage: config?.advantage || false,
      disadvantage: config?.disadvantage || false
    };
    const actor = game.actors.get(actorId);
    if (actor) {
      actor[method]("san", rollOptions);
    }
    application.close();
  }

  function closeApp() {
    dispatch('close');
  }

  const dialogTitle = type === 'save' ? 'Sanity Save' : 'Sanity Check';
</script>

<svelte:options accessors={true}/>

<ApplicationShell bind:elementRoot>
  <main>
    <h2><i class="fas fa-dice"></i> {dialogTitle} <i class="fas fa-dice"></i></h2>

    <form on:submit|preventDefault={handleRoll}>
      <label>
        Severity:
        <select bind:value={selectedSeverity} on:change={() => { customDC = 0; loss = 0; }}>
          {#each severities as severity}
            <option value={severity}>{severity.text}</option>
          {/each}
        </select>
      </label>

      <label>
        Custom DC: <input type="checkbox" bind:checked={useCustomDC} />
        <input type="text" bind:value={customDC} placeholder="DC" disabled={!useCustomDC} />
      </label>

      <label>
        Loss: <input type="checkbox" bind:checked={useCustomLoss} />
        <input type="text" bind:value={loss} placeholder="Loss" disabled={!useCustomLoss} />
      </label>

      <button disabled={selectedSeverity === null} type="submit">Roll</button>
      <button type="button" on:click={handleCancel}>Cancel</button>
    </form>

    <p>Selected severity: {selectedSeverity ? selectedSeverity.text : '[waiting...]'}</p>
  </main>
</ApplicationShell>

<style>
  main {
    background: #222;
    color: #f8f8f8;
    padding: 5px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  form {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  label {
    display: block;
    margin: 10px 0;
    font-size: 1.4em;
  }
  input[type='text'], input[type='checkbox'], select {
    margin-left: 10px;
    background: #333; 
    color: #f8f8f8; 
    border: 1px solid #444;
    padding: 2px;
    border-radius: 4px;
    font-size: 12px;
  }
  input[type='text'] {
    width: 100px;
  }
  button {
    background: #f8f8f8;
    color: #222;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 16px;
    margin: 10px 0;
    cursor: pointer;
  }
  button:hover {
    background: #555;
  }
</style>

<script>
  import { getContext } from 'svelte';
  import { ApplicationShell } from '#runtime/svelte/component/core';
  import { FatesDescentRoll } from '../FatesDescentRoll.js';

  export let actorId;
  export let type;
  export let config;
  export let performRoll = FatesDescentRoll.performRoll;
  export let elementRoot;

  const { application } = getContext('#external');

  let severities = [
    { id: 'minimal', text: 'Minimal (DC 8)' },
    { id: 'moderate', text: 'Moderate (DC 12)' },
    { id: 'serious', text: 'Serious (DC 16)' },
    { id: 'extreme', text: 'Extreme (DC 20)' }
  ];

  let selectedSeverity = severities[0];
  let useCustomDC = false;
  let customDC = 0;
  let useCustomLoss = false;
  let loss = 0;

  

  function handleRoll() {
    const lossInput = useCustomLoss ? loss : { 'minimal': '1d4', 'moderate': '1d6', 'serious': '1d8', 'extreme': '1d10' }[selectedSeverity.id];
    performRoll(actorId, selectedSeverity.id, customDC, type, lossInput, config, useCustomDC, useCustomLoss);
    application.close();
  }

  function handleCancel() {
    const method = type === 'save' ? 'rollAbilitySave' : 'rollAbilityTest';
    const rollOptions = {
      chatMessage: true,
      fastForward: true,
      fromDialog: true,
      advantage: config?.advantage || false,
      disadvantage: config?.disadvantage || false
    };
    const actor = game.actors.get(actorId);
    if (actor) {
      actor[method]("san", rollOptions);
    }
    application.close();
  }

  function closeApp() {
    dispatch('close');
  }

  const dialogTitle = type === 'save' ? 'Sanity Save' : 'Sanity Check';
</script>

<svelte:options accessors={true}/>

<ApplicationShell bind:elementRoot>
  <main>
    <h2><i class="fas fa-dice"></i> {dialogTitle} <i class="fas fa-dice"></i></h2>

    <form on:submit|preventDefault={handleRoll}>
      <label>
        Severity:
        <select bind:value={selectedSeverity} on:change={() => { customDC = 0; loss = 0; }}>
          {#each severities as severity}
            <option value={severity}>{severity.text}</option>
          {/each}
        </select>
      </label>

      <label>
        Custom DC: <input type="checkbox" bind:checked={useCustomDC} />
        <input type="text" bind:value={customDC} placeholder="DC" disabled={!useCustomDC} />
      </label>

      <label>
        Loss: <input type="checkbox" bind:checked={useCustomLoss} />
        <input type="text" bind:value={loss} placeholder="Loss" disabled={!useCustomLoss} />
      </label>

      <button disabled={selectedSeverity === null} type="submit">Roll</button>
      <button type="button" on:click={handleCancel}>Cancel</button>
    </form>

    <p>Selected severity: {selectedSeverity ? selectedSeverity.text : '[waiting...]'}</p>
  </main>
</ApplicationShell>

<style>
  main {
    background: #222;
    color: #f8f8f8;
    padding: 5px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  form {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  label {
    display: block;
    margin: 10px 0;
    font-size: 1.4em;
  }
  input[type='text'], input[type='checkbox'], select {
    margin-left: 10px;
    background: #333; 
    color: #f8f8f8; 
    border: 1px solid #444;
    padding: 2px;
    border-radius: 4px;
    font-size: 12px;
  }
  input[type='text'] {
    width: 100px;
  }
  button {
    background: #f8f8f8;
    color: #222;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 16px;
    margin: 10px 0;
    cursor: pointer;
  }
  button:hover {
    background: #555;
  }
</style>

11 replies

Gaming

Programming