Proof of concept - Image upload

This commit is contained in:
j2blake 2013-04-26 23:50:17 -04:00
parent c59076a19a
commit bf2ed5c339
9 changed files with 248 additions and 63 deletions

View file

@ -7,30 +7,36 @@ ${scripts.add('<script type="text/javascript" src="${urls.base}/js/jquery.js"></
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/css/uploadImages.css" />')}
<#assign i18n = i18n() >
<section id="photoUpload" role="region">
<h2>Photo Upload</h2>
<h2>${i18n.upload_heading}</h2>
<#if errorMessage??>
<section id="error-alert" role="alert"><img src="${urls.images}/iconAlert.png" alt="Error alert icon" />
<section id="error-alert" role="alert"><img src="${urls.images}/iconAlert.png" alt="${i18n.alt_error_alert}" />
<p>${errorMessage}</p>
</section>
</#if>
<section id="photoUploadDefaultImage" role="region">
<h3>Current Photo</h3>
<img src="${thumbnailUrl}" width="115" alt="Individual photo" />
<h3>${i18n.current_photo}</h3>
<img src="${thumbnailUrl}" width="115" alt="${i18n.alt_thumbnail_photo}" />
<a class="thumbnail" href="${deleteUrl}">Delete photo</a>
<a class="thumbnail" href="${deleteUrl}">${i18n.delete_link}</a>
</section>
<form id="photoUploadForm" action="${formAction}" enctype="multipart/form-data" method="post" role="form">
<label>Replace Photo <span> (JPEG, GIF or PNG)</span></label>
<label>${i18n.replace_photo} <span>${i18n.photo_types}</span></label>
<input type="file" name="datafile" size="30">
<p class="note">Maximum file size: ${maxFileSize} megabytes<br />
Minimum image dimensions: ${thumbnailWidth}x${thumbnailHeight} pixels</p>
<input class="submit" type="submit" value="Upload photo">
<p class="note">${i18n.maximum_file_size(maxFileSize)}<br />
${i18n.minimum_image_dimensions(thumbnailWidth, thumbnailHeight)}</p>
<input class="submit" type="submit" value="${i18n.submit_upload}">
<span class="or"> or <a class="cancel" href="${cancelUrl}" title="cancel">Cancel</a></span>
<span class="or"> ${i18n.or} <a class="cancel" href="${cancelUrl}" title="${i18n.cancel_title}">${i18n.cancel_link}</a></span>
</form>
</section>
</section>
<script type="text/javascript">
i18n_confirmDelete = "${i18n.confirm_delete}"
</script>