<!-- begin of media-publish -->
<div id="media_publish">
  <form action="" method="post" enctype="multipart/form-data" id="form_media_publish">  
    <input type="hidden" name="csrfmiddlewaretoken" id="csrfmiddlewaretoken" value="" />

    <!-- begin of media-update -->    
    <div id="media-update" class="edit">
      <div class="bloco-1">
	<p class="name"><span class="title">Título:</span><input type="text" name="name" id="name" value="<%= media.get('name') %>"></p>
	<p class="tags"><span class="title">Tags:</span> 
	  <input type="text" name="tags" id="tags" value="<% _.each(media.get("tags"), function(tagName) { %><%= tagName %><% }); %>">
	</p>
	
	<p class="type"><span class="title">Tipo de arquivo</span>
	  <select name="type" id="type">
	    <% _.each(types, function(value, key) { %>
	    <option value="<%= key %>" <% if (media.get("type") == key) { %>selected<% } %>><%= value %></option>
	    <% }) %>
	  </select>
	</p>
	<p class="imagem">
	  <!-- TODO: visualização por tipo de arquivo -->
	  <% if (_.isEmpty(media.get("uuid"))) { %>
	  <% } else { %> 
	  <% if (_.isEmpty(media.get("image_preview"))) { %>
	  <div class="image_preview">
	    <span>SEM PRÉ-VISUALIZAÇÃO</span>
	  </div>
	  <% } %>
	  <% } %>
	</p>
	<span class="mediafile">
	  <a id="mediafile-original" href='file:<%= media.get('mediafile') %>'><%= media.get('mediafile') %></a>
	  </span>
	<input type="file" name="mediafile" id="mediafile" value="<%= media.get('mediafile') %>" />
	<br />
	<div class="progress">
          <div class="bar"></div >
          <div class="percent">0%</div >
	</div>
	<% if (_.isEmpty(media.get("uuid"))) { %>
	<% } else { %> 
	<p class="uuid">UUID: <%= media.get("uuid") %></p>
	<% } %>
	<% if (page == 'MediaUpdate') { %>
	<div id="view-media" class="button-nav">
	  <img src="images/view-media.png">
	  <br />
	  <span>Visualizar mídia</span>
	</div>
	<% } %>

	<div id="submit" class="button-nav">
	  <img src="images/save.png">
	  <br />
	  <span><% if (page == 'MediaUpdate') { %>Atualizar<% } else { %>Subir arquivo<% } %></span>
	</div>
	
      </div>
      <!-- end of bloco-1 -->

      <!-- begin bloco-2 -->      
      <div class="bloco-2">
	<div class="modo-edicao">
	  <img src="images/modo-edicao.png" />
	  <span class="title">edição de arquivo</span>
	</div>

	<input type="hidden" name="repository" id="repository" value="<%= media.get('repository') %>">
	<input type="hidden" name="author" id="author" value="<%= media.get('author') %>">
	<input type="hidden" name="origin" id="origin" value="<%= media.get('origin') %>">
	<input type="hidden" name="format" id="format" value="<%= media.get('format') %>">

	<p class="autor">
	  <span class="title">Autoria</span>: <a href='<% print(baseurl + '/mocambola/' + media.get("author")) %>'><%= media.get("author") %></a>
	</p>
	
	<p class="date">
	  <span class="title">Data:</span>
	  <input type="text" name="date" id="date" value="<%= media.get('date') %>"/>
	</p>

	<p class="origin">
	  <span class="title">Origem:</span> 
	  <%= media.get("origin") %>
	</p>
	
	<p class="format"><span class="title">Formato:</span> <%= media.get("format") %></p>
	
	<div class="license"><span class="title">Licença:</span>
	  <select name="license" id="license">
	    <% _.each(licenses, function(value, key) { %>
	    <option value="<%= key %>" <% if (media.get("license") == key) { %>selected<% } %>><%= value %></option>
	    <% }) %>
	  </select>
	  <div id="license_image" class="license-<%= media.get("license") %>"></div>
	</div>
	<p class="quem-tem"><span class="title">Disponibilidade: </span></p>
	<br/>
	<p class="note"><span class="title">Comentários</span>
	<textarea name="note" id="note"><%= media.get('note') %></textarea>

      </div>
    <!-- end of bloco-2 -->    
    
    </div>
    <!-- end of media-update -->
  </form>
</div>
<!-- end of media-publish -->
