<div class="pixiedust" pixiedust="{{pd_controls|htmlAttribute}}">
  <button class="btn btn-default btn-sm expandButton" data-toggle="collapse"
          data-target="#pixiedust-output-wrapper-{{this.getPrefix()}}" title="Expand/Collapse Pixiedust output">
    <i class="fa"></i>
  </button>
  <div id="pixiedust-output-wrapper-{{this.getPrefix()}}" class="pixiedust-output-wrapper collapse in">
    {%if numMenu > 1 %}
      <div class="pixiedust-toolbar btn-group" role="group" style="margin-bottom:15px">  
      {%for key, menuInfoList in menuTree|iteritems%}
        {%if menuInfoList|length==1%}
          <a class="btn btn-small btn-default display-type-button" id="menu{{this.getPrefix(menuInfoList[0])}}" title="{{menuInfoList[0]['title']}}">
            <i class="fa {{menuInfoList[0]['icon']}}"></i>
          </a>
          {{this._getMenuHandlerScript(menuInfoList[0])}}
        {%elif menuInfoList|length>1%}
          <div class="btn-group btn-small display-type-button">
            {% set category = this.getCategory(key) %}
            <a class="btn btn-small dropdown-toggle btn-default" data-toggle="dropdown" title="{{category.title}}">
              {% if "icon-class" in category %}
              <i class="fa {{category['icon-class']}}"></i>
              {% elif "icon-path" in category %}
              <img src="{{category['icon-path']|base64dataUri}}" style="max-width:18px;display:inline-block">
              {% endif %}
              <i class="fa fa-chevron-down"></i>
            </a>
            <div class="dropdown-menu" role="menu" style="white-space:nowrap">
              <ul>
              {%for menuInfo in menuInfoList%}
                <li id="menu{{this.getPrefix(menuInfo)}}">
                  {% if "icon-class" in menuInfo or "icon" in menuInfo%}
                  <i class="fa {{menuInfo.get('icon-class', menuInfo.get('icon'))}}"></i>
                  {% elif "icon-path" in menuInfo %}
                  <img src="{{menuInfo['icon-path']|base64dataUri}}" style="max-width:18px;display:inline-block">
                  {% endif %}
                  <span>{{menuInfo['title']}}</span>
                  {{this._getMenuHandlerScript(menuInfo)}}
                </li>
              {%endfor%}
              </ul>
            </div>
          </div>
        {%endif%}
      {%endfor%}
      </div>
    {%endif%}
    <div id="wrapperJS{{this.getPrefix()}}"></div>
    <div id="wrapperHTML{{this.getPrefix()}}" class="pixiedustWrapperHTML" style="min-height:100px"></div>
  </div>
</div>