draw - PeterNaydenov/code-assembly-line GitHub Wiki

Describes process of drawing current data with template.

Fields

  { 
       do: 'draw'
     , tpl: templateName
     , as: newParam
     , missData?: missFullDataStrategy
     , missField?: missFieldStrategy
     , hook?: hookFunction
     , watchHook?: watchHookFunction
     , space ?: spaceSymbol
  }

Types

  • templateName: string.
  • newParam: string. Keep existing current data. Put drawing results in newParam property.
  • missFullDataStrategy: '_hide' | '_fn' | string. Behaviour of render-engine if not full dataset available. Could hide the block or substitute with custom error. '_fn' will search for hook function. Missing 'missData' will render block with template placeholders.
  • missFieldStrategy: '_hide' | '_position' | '_fn' | string. Behaviour of render-engine on missing data-field. Placeholder could be hidden, substituted with placeholder name or customized with error message. '_fn' will execute hook function. Missing 'missField' property will render blocks with template placeholders.
  • hookFunction : string. Hook function that will be executed if missFieldStrategy or missFullDataStrategy are set to '_fn'.
  • watchHookFunction : string. Hook function that will be executed on each data-segment during draw step execution.
  • spaceSymbol : string. Works only when watchHook is defined. Represent space between rendered elements. ', ' will separate elements with coma, '\n' will separate with new line, etc. Default spaceSymbol is empty space.

NOTE: There is no practical reason to use 'missData' and 'missField' together. Use just one of them.

Hook functions

Process-step draw can use a hook functions as part of missFullDataStrategy or missFieldStrategy. Start using hook functions by providing for strategy '_fn' and the hook.

  // If template 'card' has empty placeholders, hook function 'testValue' will be executed.
  // The response of the function will come as render for this particular data-segment
  { do: 'draw', tpl: 'card', missFullDataStrategy: '_fn', hook: 'testValue' }

  // If template 'card' has empty placeholder, hook function 'testValue' will be executed.
  // The response of the function will be used as placeholder value.
  { do: 'draw', tpl: 'card', missFieldStrategy: '_fn', hook: 'testValue' }

NOTE: Using hook without missFullDataStrategy or missFieldStrategy will fail.

  { do: 'draw', tpl: 'card', hook: 'testValue' }
 // This DRAW step will not call a hook function!

Hook function itself looks like:

 function ( data ) { 
        // Modify the data and return it.
        return data
     }

Watch Hook functions

WatchHooks are here to provide dynamic change of template and/or data-segment during rendering process.

 function myWatchHook ( data, template ) {
       // template : string. Name of the template from 'draw' step.
       // data: object. Current data-segment for rendering.
       // Check data details and do changes or change the template name for specific data...
       // Draw iteration will use returned data and template instead of original ones. 
      return [ data, template ]
      // Function must return [] with data and template name.
   }

Step draw with watchHook looks like:

 { do: 'draw', tpl: 'simple', watchHook: 'checkNames' }

Provide watchhook to process as other hook functions.

  tplEngine.run ( 'processName', data, { hookName: hookFunction })
  // standard hooks and watchHooks are hooks.

Example:

// Draw data with template 'li'. Hide the rendered block if some placeholder is neglected.   
{ do: 'draw', tpl: 'li', missData: '_hide' }