Injectors

Injectors are operations that inject values. They can be used with any of the compose-* functions wherever an Operation object is required:

• composeComparators
• composeConditional
• composeOperators
• composeValidation

They are the necessary leaf nodes in the operation tree:

Here is how the above example works. Check the HTML page to see where the injectors are getting their values.

The second panel shows the JS/JSON object generated from the nested operation/injector constructors. This object is then passed to the composeOperators function, which returns a function that takes an optional arg (used by FromArgument) and returns the result of the calculation.

Here we apply it immediately, passing it the value, 5. The result of the calculation can be seen in the console below.

Types of Injectors

Constant

The Constant constructor is a curried function used to generate an operation configuration that injects a known value, which is included in the configuration object.

const Constant = datatype => value => ConstantOp

The first parameter is the datatype to be returned, which defaults to "Number". The second parameter is the constant value to be returned.

FromArgument

The FromArgument constructor is the simplest of the injector constructors. It creates an operation configuration that tells the operation to use the optional argument passed to the function returned from composeOperators.

const FromArgument = datatype => FromArgumentOp

It takes a single parameter, the datatype to be returned, which defaults to "Number".

const op = FromArgument()
 
/* op is
  {
    "tag": "FromArgument",
    "datatype": "Number"
  }
*/
 
// composeOperators returns arg => Either<Array<Error>, Number>
const calculate = composeOperators(op)
 
console.log(calculate(7)) // returns { right: 7 }

FromElement

The FromElement injector is used to inject values from HTML elements on the page, such as form inputs. As with all the operation constructors, it is a curried function.

const FromElement = datatype => source => FromElementOp

The first parameter is the datatype to be returned, which defaults to "Number".

The second parameter, source, is an object from which a CSS selector is created. Keys include form (the ID of the form), id (the ID of the element), name (of the form input), tagName (of the element), and selector, which sets a selector directly and overrides all other keys.

The selector is used to obtain the HTML element (using document.querySelector). Depending on the type of element returned, the value is extracted from innerHTML or the value attribute.

FromLocalStorage

The FromLocalStorage injector is used to retrieve values from the browser's local storage.

const FromLocalStorage = datatype => key => FromLocalStorageOp

Values in local storage are stored as strings. The first parameter is the datatype to which the value retrieved will be cast. It defaults to "Number".

The second parameter is the key of the value stored in local storage.

FromLookup

The FromLookup injector is used to lookup values stored as <data> elements on the page, although hidden inputs could also be used if the data is to be included in a form submission.

const Lookup = datatype => id => LookupOp

The first parameter is the datatype to be returned, which defaults to "Json". In this instance, JSON.parse will be used on the returned value. But "Number", "Integer", "String", etc. are also options, in which case the return value will be cast accordingly.

The second parameter is the id of the <data> or <input type="hidden"> element.

FromLookupTable

The FromLookupTable injector is used to lookup values stored as tables (multi-dimensional arrays) JSON "stringified" in <data> elements on the page, although hidden inputs could also be used if the data is to be included in a form submission.

const LookupTable = datatype => config => LookupTableOp

The first parameter is the datatype to be returned, which defaults to "Json". In this instance, JSON.parse will be used on the returned value. But "Number", "Integer", "String", etc. are also options, in which case the return value will be cast accordingly.

The second parameter is a configuration object which determines how the data is to be extracted from the table. This must contain a source key whose value is a source configuration object as described in FromElement above.

The source configuration must also include column and test keys whose values are operations themselves. In other words, the column of the table (one-based) from which to get the value is determined by an operation, the simplest of which would be Constant("Integer")(2), the second column. But this could also use a Ternary operation or even nested ternaries.

The test key is used to determine the row in which the desired value is located. Most often, this will use a FromArgument operation, with the current value to be looked up passed in as an argument at runtime.

FromQueryString

The FromQueryString injector is used to retrieve values from the query (search) string in the page URL, e.g., sitebender.org?age=42.

const FromQueryString = datatype => key => FromQueryStringOp

Values in the query/search string are returned as strings. The first parameter to FromQueryString is the datatype to which the value retrieved will be cast. It defaults to "Number".

The second parameter is the key of the value to be found in the query string.

FromSessionStorage

The FromSessionStorage injector is used to retrieve values from the browser's session storage.

const FromSessionStorage = datatype => key => FromSessionStorageOp

Values in session storage are stored as strings. The first parameter is the datatype to which the value retrieved will be cast. It defaults to "Number".

The second parameter is the key of the value stored in session storage.

FromUrlParameter

The FromUrlParameter injector is used to retrieve values from the path in the page URL, e.g., sitebender.org/path/to/page.

const FromUrlParameter = datatype => segment => FromUrlParameterOp

Values in the path are returned as strings. The first parameter to FromUrlParameter is the datatype to which the value retrieved will be cast. It defaults to "Number".

The second parameter is the number of the path segment where the value is to be found. These are zero-based. For example, if the segment is 1 and the URL is sitebender.org/path/to/page, then FromUrlParameter("String")(1) will create an operation that, when composed and called, will return lbrace; right: "to" }.