UI Macro for the ProgressBar - Jelly Scripting

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="true" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<j:set var="jvar_renderer" value="SimpleProgressBar"/>

<g:evaluate var="jvar_choices" jelly="true" object="true">

    // get the api
    var api = new SNC.RendererAPI('$[jvar_renderer]');
    var showValue = api.getOption('showValue')+'';
   
    // build the full set of choices including subflows
    var choices = api.getParentWorkflowChoices(current, jelly.jvar_ref);
 
    choices;
</g:evaluate>

<g:evaluate var="jvar_increment" jelly="true" >
    var increment = 100.00 / choices.getSize();
    var percentComplete = 0;
    var atEnd = true;

    for (var i = 0; choices.getSize() > i; i++) {
        percentComplete += increment;
        if (choices.getChoice(i).getParameter('state')+'' === 'active') {
            atEnd = false;
            break;
        }
    }

    percentComplete = atEnd ? 100 : parseInt(percentComplete);

    increment;
</g:evaluate>


<j:set var="jvar_t" value="$[jvar_ref]" />

<table id="workflow.progress" border="1" cellpadding="0" cellspacing="0"
       style="width:100%; margin-top: 2px; background-color: transparent;" >

<j:if test="$[showValue]">
  <tr>
      <td colspan="${choices.getSize()}" style="width:100%; font-size:10px; border:none; text-align:center; background: #000066 url('progress_pctnotdone.gifx') repeat-x;">
          ${showValue==='true' ? percentComplete+'%' : ' '}
      </td>
  </tr>
</j:if>

  <tr id="progress">
   
  <j:forEach var="jvar_choice" items="$[jvar_choices]">
    <g:evaluate var="jvar_choice_visible" jelly="true">
        var isVisible = true;
        if (!api.getOption('showSkipped'))
            if (jelly.jvar_choice.getParameter('state')+'' == 'skipped')
                isVisible = false;

        if (jelly.jvar_choice.value == '')
            isVisible = false;

        isVisible;
    </g:evaluate>

    <g:evaluate var="jvar_image" jelly="true">
        var imgsrc = 'progress_pctnotdone.gifx';
        if (jelly.jvar_choice.getParameter('state')+'' != 'pending')
              imgsrc = 'progress_pctdone.gifx';
        imgsrc;
    </g:evaluate>
     
    <j:if test="$[jvar_choice_visible]">
      <td nowrap="true" style="width:${jvar_increment}%; border-left:none; border-top:none; border-bottom:none; border-right: 1px solid white;  background: #000066 url('${imgsrc}') repeat-x;">
          $[SP]
      </td>
    </j:if>
  </j:forEach>

</tr>
</table>


</j:jelly>