<div id="{{fieldId}}"
     class="form-group {{#if error}}has-error has-feedback{{/if}}"
     data-multiple="{{#if field.formFieldMultiple}}true{{else}}false{{/if}}"  >

  <label for="{{fieldId}}">{{{label}}} {{#ifCond field.allowNull false}}*{{/ifCond}}</label>

  <we-image-selector-btn
    id="{{fieldId}}ImageBTNSelector"
    data-fieldid="{{fieldId}}"
    data-name="{{name}}"

    {{#unless field.formFieldMultiple}}
      {{#ifCond value 'null'}}{{else}}{{#if value}}style="display:none;"{{/if}}{{/ifCond}}
    {{/unless}}

    class="btn btn-default"
  >
    {{t 'file.image.select.btn'}}
  </we-image-selector-btn>

  {{!-- Magic field to run the image field updater --}}
  <input name="{{name}}" type="hidden" value="null">

  <table id="{{fieldId}}ImageTable"
         class="table table-bordered"
         {{#ifCond value 'null'}}style="display:none;"{{/ifCond}}
         {{#unless value}}style="display:none;"{{/unless}}  >
    <thead><tr>
      <th>{{t 'Name'}}</th>
      <th>{{t 'thumbnail'}}</th>
      <th>{{t 'Actions'}}</th>
    </tr></thead>
    <tbody>
      {{#each value}}
        {{#if this.id}}
          <tr>
            <td><we-image-description data-id="{{id}}"></we-image-description></td>
            <td>
              <we-image data-id="{{id}}" data-style="thumbnail"></we-image>
            </td>
            <td>
              <button onclick="we.components.imageSelector.removeImage(this, '#{{../fieldId}}')" type="button" class="btn btn-danger">{{t 'image.remove'}}</button>
              <input name="{{../name}}" type="hidden" value="{{id}}">
            </td>
          </tr>
        {{else}}
          <tr>
            <td>
               <we-image-description data-id="{{this}}"></we-image-description>
            </td>
            <td>
              <we-image data-id="{{this}}" data-style="thumbnail"></we-image>
            </td>
            <td>
              <button onclick="we.components.imageSelector.removeImage(this, '#{{../fieldId}}')" type="button" class="btn btn-danger">{{t 'image.remove'}}</button>
              <input name="{{../name}}" type="hidden" value="{{this}}">
            </td>
          </tr>
        {{/if}}
      {{/each}}
    </tbody>
  </table>

  {{!-- each file template --}}
  <div id="{{fieldId}}ImageFieldTemplates" style="display:none;">
    <table><tr>
      <td data-image-name></td>
      <td data-image-thumbnail></td>
      <td>
        <button onclick="we.components.imageSelector.removeImage(this, '#{{fieldId}}')" type="button" class="btn btn-danger">{{t 'image.remove'}}</button>
      </td>
    </tr></table>
  </div>

  <p class="help-block">{{{help}}}</p>

  {{{field-help-error error}}}
</div>