<% #listItem %>
<tr>
   <td>
      <% image.thumbnail data-uk-tooltip="{pos: 'right'}" | image.link class='uk-thumbnail' %>
   </td>
   <!--
   <td><% //image.contentType | replace image/ '' %></td>
   <td><% //image.contentLength %></td>
   -->
   <td><% image.width %>&times;<% image.height %></td>
   <td><% image.creator %></td>
   <td class='uk-text-truncate' title='<% image.modified short %>' data-uk-tooltip="{pos: 'top-left'}">
      <% image.modified text %>
   </td>
   <td class='uk-text-right'>
      <% if <% image.tags count %> is 0 then '' else <% image.tags prefix="<i class='uk-text-muted uk-icon-tags' data-uk-tooltip title='" suffix="'></i>" %> %>
   </td>
   <td class='uk-text-right uk-text-nowrap'>
      <a href='javascript:' class='av-clipboard-copy' data-text='<% gettext 'Press CTRL & C to copy to clipboard.' %>' data-value="<% image.macro suffix=' box' %>"><i class='uk-icon-clipboard'></i></a>
      <% image.link delete "<i class='uk-icon-trash-o'></i>" %>
      <% image.link edit "<i class='uk-icon-pencil'></i>" %>
   </td>
</tr>

<% #tagged %>
<div class='av-tagged-image' data-caption='<% image.description default=<% image.fileName %> %>'>
   <% image.render | image.link %>
</div>

<% #embed %>
<div class='av-image-box'>
   <figure>
      <% image.render | link <% param.link %> class='uk-thumbnail' %>
      <% image.description prefix="<figcaption class='uk-text-small'>" suffix=</figcaption> %>
   </figure>
</div>

<% #edit %>
<h1>
   <% response.title %>
   <% image.link . ' ' class='uk-icon-button uk-icon-link uk-text-middle' %>
</h1>
<div class='uk-article-meta'><% image.skin $HopObject#meta %></div>
<form class='uk-margin-top uk-form uk-form-stacked' method="post" action="<% response.action %>" enctype="multipart/form-data">
   <div class='uk-form-row'>
      <label class='uk-form-label' for='file'>
         <% gettext File %>
      </label>
      <div class='uk-form-controls'>
         <% image.upload file %>
      </div>
   </div>
   <div class='uk-form-row uk-hidden av-name-row'>
      <label class='uk-form-label' for='name'>
         <% gettext Name %>
         <i class='uk-icon-info-circle uk-text-muted' title='<% gettext "If you do not specify a name Antville will create one based on the filename." %>' data-uk-tooltip='{pos: "right"}'></i>
      </label>
      <div class='uk-form-controls'>
         <% image.input name class='uk-width-1-2' %>
      </div>
   </div>
   <div class='uk-form-row'>
      <label class='uk-form-label' for='description'>
         <% gettext Description %>
      </label>
      <div class='uk-form-controls'>
         <% image.input description class='uk-width-1-1' %>
      </div>
   </div>
   <div class='uk-form-row uk-hidden av-tags-row'>
      <label class='uk-form-label' for='tags'>
         <% gettext Tags %>
         <i class='uk-icon-info-circle uk-text-muted' title='<% gettext 'Separated by commas' %>' data-uk-tooltip='{pos: "right"}'></i>
      </label>
      <div class='uk-form-controls'>
         <% image.input tags class='uk-width-1-1' %>
      </div>
   </div>
   <fieldset class='uk-margin-top'>
     <legend><% gettext Information %></legend>
      <div class='uk-form-row'>
         <% image.macro | link <% image.href %> data-value=<% image.macro %> data-text=<% gettext "Press CTRL & C to copy to clipboard." %> class='av-clipboard-copy' %>
      </div>
   </fieldset>
   <div class='uk-margin-top'>
      <button class='uk-button uk-button-primary' type="submit" id="submit" name="save" value="1">
         <% gettext Save %>
      </button>
      <% image.link delete <% gettext Delete %> class='uk-button' %>
      <a href='.' class="uk-button uk-button-link"><% gettext Cancel %></a>
   </div>
</form>
<script type="text/javascript">
$(function() {
   if ('<% image.name %>') {
      $('#name').attr('disabled', true);
   }
   $('.av-name-row').removeClass('uk-hidden');
   if (location.href.indexOf('/layout/') < 0) {
      $('.av-tags-row').removeClass('uk-hidden');
   }
});
</script>
