The K-Scaffold Framework

PUG, HTML, and Javascript

The PUG Library

The K-Scaffold's PUG library provides a collection of frequently used elements and collections of elements in Roll20 sheet development. The library's mixins also provide a link to the sheetworker library via the trigger property that can be passed to many of these mixins. The sections below give the details on how the mixins can be used and what html is generated by them.

The Trigger Object

The trigger object is a K-Scaffold specific property that can be passed to any mixin that creates a Roll20 attribute element (e.g. input or span). The trigger object creates a link between the attribute, and any attributes that are affected by it or any functions that should be called when the attribute is changed. This looks like:

pug

+number({name:'strength',value:10,trigger:{affects:['strength_mod']}})
+number({name:'strength mod',value:0,readonly:'',trigger:{calculation:'calcStrength'}})

html

<number type="number" name="attr_strength" value="10">
<number type="number" name="attr_strength_mod" value="0">

sheetworker

//This function will be called whenever strength_mod is affected by another attribute. It will return the calculated value, and the K-Scaffold sheetworker framework will set the attribute to that value.
const calcStrength = function({attributes}){
  return Math.floor((attributes.strength - 10) / 2);
}
//Register the function to the K-Scaffold sheetworker framework so that it can be called by the scaffold's listeners.
k.registerFuncs({calcStrength});

Note that when using the K-Scaffold to drive the event handling, you only need to write your actual calculation or logic functions, not any of the sheetworker event handling. Functions called by the K-Scaffold's trigger handling should be written using the object descructuring pattern and can have any (or all) argument of:

  • attributes
  • trigger
  • casc

Because this uses the destructuring pattern, these attribute names must be named this, but can be in any order in the function declaration.