{# Create a macro that will write a bunch of steps as a list.
 # This is intended to be utilized as the internals of a table cell (<td>)
 #}
{% macro writeStepColumn(actor, steps) %}

    {# start the ordered list, keeping the numbering for the current actor column #}
    <ol start="{{actor.stepNum}}">

        {# Loop through each step #}
        {% for step in steps %}
            
            {# Write the title if it exists #}
            {% if step.title %}
                {{step.title|markdownFormatter}}
            {% endif %}

            {# Check for warning #}
            {% for warning in step.warnings %}
                <div class="ncw ncw-warning">
                    <div class="ncw-head">WARNING</div>
                    <div class="ncw-body">{{warning|markdownFormatter}}</div>
                </div>
            {% endfor %}

            {# Check for caution #}
            {% for caution in step.cautions %}
                <div class="ncw ncw-caution">
                    <div class="ncw-head">CAUTION</div>
                    <div class="ncw-body">{{caution|markdownFormatter}}</div>
                </div>
            {% endfor %}

            {# Check for note #}
            {% for note in step.notes %}
                <div class="ncw ncw-note">
                    <div class="ncw-head">NOTE</div>
                    <div class="ncw-body">{{note|markdownFormatter}}</div>
                </div>
            {% endfor %}

            {# If not warning, caution, or note, it must be a step! #}

                
            {{writeStep(actor, step, false)}}
                

        {% endfor %}
    </ol>
{% endmacro %}

{# Put the actual step in a macro since it can call itself for substeps... #}
{% macro writeStep(actor, step, isSubstep) %}

    {# First first, check to make sure something will be printed.  
     # If not, skip everything because otherwise the list will get messed up. 
     #}
    {% if step.text.length > 0 or step.checkboxes.length > 0 or step.substeps.length > 0 or step.images.length > 0 or step.comments.length > 0 %}

        {# First, print the step #}
        <li>
            {{step.text|markdownFormatter}}
            {# Make sure to increment the step number, only if not substep #}
            {% if not isSubstep %}
                {{actor|stepIncrement}}
            {% endif %}

            {# Check for checkboxes #}
            {% if step.checkboxes %}
                <ul>
                    {% for checkbox in step.checkboxes %}
                        <li>{{checkbox|checkboxes|markdownFormatter}}</li>
                    {% endfor %}
                </ul>
            {% endif %}

            {# Check for substeps. #}
            {% if step.substeps %}
                <ul>
                    {% for substep in step.substeps %}
                        {{writeStep(actor, substep, true)}}
                    {% endfor %}
                </ul>
            {% endif %}

            {# Check for images. #}
            {% if step.images %}
                {% for image in step.images %}
                    <div class="sizeable tooltip">
                        <span class="tooltiptext">drag bottom right corner to size image</span>
                        <img class="img-fluid" src="{{image|imagePath}}" alt="image" />
                    </div>
                {% endfor %}
            {% endif %}

            {# Check for comment. #}
            {% if step.comment %}
                {% for comment in step.comment %}
                    <div style="text-align: center;border-style: solid;border: 1">
                        {{comment|markdownFormatter}}
                    </div>
                {% endfor %}
            {% endif %}

        </li>
    {% endif %}

{%- endmacro -%}