File: D:/HostingSpaces/PvdBoogaard/indoorski.nl/backup/oude-site/cms/admin/templates/imgman.view.tpl
{template="header"}
{capture name=baseImageRow}
<span class="ManageImageBox" id="%%image_id%%" >
<input type="checkbox" id="deleteimages[]" value="%%image_realname%%" /><input class="TemplateHeading inPlaceImageBoxDefault" id="%%image_id%%_name" value="%%image_name%%" /><br />
<input type="hidden" id="%%image_id%%_realname" value="%%image_realname%%" />
<div style="width: 202px; height: 156px; margin-top: 5px;">
<a href='%%image_url%%' id="%%image_id%%_url" target="_blank"><img src='%%image_url%%' style=" border: solid 1px #CACACA;" id="%%image_id%%_image" width="%%image_width%%" height="%%image_height%%" title="{$lang.imageManagerViewFullSize}" /></a>
</div>
<a href='%%image_url%%' class="%%image_id%%_url" target="_blank"><img width="10" height="11" border="0" src="images/magnify.gif" /></a>
<a href='%%image_url%%' class="%%image_id%%_url" target="_blank">{$lang.imageManagerShowFullImage}</a>
| <a href="downloadimage.php?image=%%image_realname%%">{$lang.Download}</a><br />
Size: %%image_size%% <br />
Dimensions: %%image_dimensions%%px<br />
<input type="button" class="Button" id="%%image_id%%_delete" value="{$lang.imageManagerDelete}" style="width: 150px; margin-top: 4px; margin-bottom: 14px; " />
</span>
{/capture}
<script type="text/javascript" src="../javascript/detect.flash.js"></script>
<script type="text/javascript" src="../javascript/swfupload.js"></script>
<script type="text/javascript" src="../javascript/admin.imagemanager.js"></script>
<script type="text/javascript">
{if %imageDir.CountDirItems == 0}
$(function(){
$('#MainMessage').infoMessage({$lang.PromptToCreateImage|iwp_FilterJavascriptString});
});
{/if}
imageManager.maxFileSize = '{$MaxFileSize|iwp_js}';
imageManager.phpSessionId = "{$sessionid}";
imageManager.imageRow = '{$baseImageRow|iwp_js}';
$(function(){
if (imageManager.hasRequestedFlashVersion()) {
imageManager.loadFlashObject();
} else {
// no flash installed or enabled
$('#btnUpload').bind('click', function () {
$.iModal({
width: 500,
title: '{$lang.imageManagerUploadingImages}',
type: 'ajax',
url: 'remote.php?section=imagemanager&action=noflashupload',
buttons: '<input type="button" onclick="$.iModal.close();" style="float: left" value="{$lang.Cancel}" class="Button" /><input type="button" value="{$lang.imageManagerUpload}" class="Button" id="uploadButton" style="font-weight: bold;"/>'
});
});
}
$('#deleteButton').bind('click', function() {
if(!$('#hasImages input:checkbox:checked').exists()){
alert('{$lang.imageManagerNoImagesSelectedForDelete|iwp_js}');
return;
}
if(confirm('{$lang.imageManagerConfirmDeleteSelectedImages|iwp_js}')) {
var sendPOST = '';
$('input:checkbox:checked').each(function (){
if(this.value == '%%image_name%%') { return; }
sendPOST += '&deleteimages[]=' + escape(this.value);
});
$.post('remote.php?section=imagemanager&action=delete', sendPOST,
function(result){
if(result.success){
for(i in result.successimages) {
var imageName = result.successimages[i];
imageName = imageManager.removeExtension(imageName);
$('input:checkbox[value=' + imageName + ']').removeAttr('checked');
$('input:text[value=' + imageName + ']').parent().hide('slow');
$('input:text[value=' + imageName + ']').parent().remove();
}
$('#MainMessage').successMessage(result.message);
imageManager.checkDelete();
}else{
$('#MainMessage').errorMessage(result.message);
}
}, 'json'
);
}
});
});
</script>
<div class="BodyContainer">
<table class="OuterPanel">
<tr>
<td class="Intro">
<h2 class="Heading1">{$lang.ManageImages}</h2>
<div>{$lang.ManageImagesIntro}</div>
{template="message"}
<span id="spanButtonPlaceholder"></span>
<input id="btnUpload" type="button" value="{$lang.imageManagerUploadImages}" style="width: 130px;" /> <input id="deleteButton" type="button" value="{$lang.imageManagerDeleteSelected}" class="Button" style="display: {if !$hasImages}none{/if};" /><br /><br />
</td>
</tr><tr><td>
<div style="display: none" id="ProgressWindow">
<div id="ProgressBarDiv" style="text-align: center;"><br/><span id="ProgressBarText" class="ProgressBarText">{$lang.imageManagerUploadInProgress}</span><br/><br/><br/>
<div style="border: 1px solid #ccc; width: 300px; padding: 0px; margin: 0 auto; position: relative;">
<div class="progressBarPercentage" style="margin: 0; padding: 0; background: url('images/progressbar.gif') no-repeat; height: 20px; width: 0%; ">
</div>
<div style="position: absolute; top: 0px; left: 0; text-align: center; width: 300px; font-weight: bold;line-height:1.5;color:#333333;font-family:Tahoma;font-size:11px;" class="progressPercent"> </div>
</div>
<span id="progressBarStatus" class="progressBarStatus" style="text-align: center; font-size: 10px; color: gray; padding-top: 5px;"> </span>
</div>
</div><!-- End #ProgressWindow -->
<div id="hasImages" style="display: {if !$hasImages}none{/if};">
<div style="">
<div style="float: right"> {template="paging"}</div>
<div style="float: right; padding-bottom: 7px;">
<select name="PerPage" class="Field" style="width: 180px;" onChange="imageManager.changeImageManagerPaging(this, '{$PageNumber}');">
<option value="10" {$PerPage10Selected}>{$lang.imageManagerPerPage|sprintf,10}</option>
<option value="20" {$PerPage20Selected}>{$lang.imageManagerPerPage|sprintf,20}</option>
<option value="50" {$PerPage50Selected}>{$lang.imageManagerPerPage|sprintf,50}</option>
<option value="100" {$PerPage100Selected}>{$lang.imageManagerPerPage|sprintf,100}</option>
<option value="all" {$PerPageAllSelected}>{$lang.imageManagerShowAllImages}</option>
</select>
<select name="SortBy" class="Field" style="width: 150px;" onChange="imageManager.changeImageManagerSorting(this, '{$PageNumber}');">
<option value="name.asc" {$SortNameAsc}>{$lang.SortNameAsc}</option>
<option value="name.desc" {$SortNameDesc}>{$lang.SortNameDesc}</option>
<option value="modified.asc" {$SortModifiedAsc}>{$lang.SortDateAsc}</option>
<option value="modified.desc" {$SortModifiedDesc}>{$lang.SortDateDesc}</option>
<option value="size.asc" {$SortSizeAsc}>{$lang.SortFilesizeAsc}</option>
<option value="size.desc" {$SortSizeDesc}>{$lang.SortFilesizeDesc}</option>
</select>
</div>
</div>
<div style="clear:both;"></div>
<table class="Panel" style="margin:0px;">
<tr>
<td class="Heading2" colspan='2'>
<input type="checkbox" name="toggleAllChecks" id="toggleAllChecks" onclick="imageManager.checkAllCheckBoxes(this);" style="margin: 3px 0 0 0 ; float: left;" />
<label for="toggleAllChecks" style="display: block; padding-top: 4px; float: left; padding-left: 4px;">{$ImagesTitle}</label>
</td>
</tr>
<tr>
<td align="right" style=" padding-left: 10px;" colspan='2'>
</td>
</tr>
<tr>
<td style="padding:5px 5px 5px 10px;" colspan='2'>
<div id="imagesList"><script type="text/javascript">
<!--
{foreach from=%imagedir.GetImageDirFiles key=k item=image id=fieldsHeaderLoop}
imageManager.addImage( '{$image.name|addslashes}', '{$image.url|addslashes}', '{$image.size|NiceSize|addslashes}', '{$image.width}', '{$image.height}', '{$image.origwidth} x {$image.origheight}', '{$image.id}');
{/foreach}
//-->
</script>
</div><!-- end #imagesList -->
</td>
</tr>
<tr>
<td align="right" style=" padding-left: 10px;" colspan='2'>
<select name="PerPage" class="Field" style="width: 160px;" onChange="imageManager.changeImageManagerPaging(this, '{$PageNumber}');">
<option value="10" {$PerPage10Selected}>{$lang.imageManagerPerPage|sprintf,10}</option>
<option value="20" {$PerPage20Selected}>{$lang.imageManagerPerPage|sprintf,20}</option>
<option value="50" {$PerPage50Selected}>{$lang.imageManagerPerPage|sprintf,50}</option>
<option value="100" {$PerPage100Selected}>{$lang.imageManagerPerPage|sprintf,100}</option>
<option value="all" {$PerPageAllSelected}>{$lang.imageManagerShowAllImages}</option>
</select>
<select name="SortBy" class="Field" style="width: 150px;" onChange="imageManager.changeImageManagerSorting(this, '{$PageNumber}');">
<option value="name.asc" {$SortNameAsc}>{$lang.SortNameAsc}</option>
<option value="name.desc" {$SortNameDesc}>{$lang.SortNameDesc}</option>
<option value="modified.asc" {$SortModifiedAsc}>{$lang.SortDateAsc}</option>
<option value="modified.desc" {$SortModifiedDesc}>{$lang.SortDateDesc}</option>
<option value="size.asc" {$SortSizeAsc}>{$lang.SortFilesizeAsc}</option>
<option value="size.desc" {$SortSizeDesc}>{$lang.SortFilesizeDesc}</option>
</select>
</td>
</tr>
</table><br />
{template="paging"}
</div>
<div id="hasNoImages" style="display: {if $hasImages}none{/if}; text-align: center;">
</div>
</td></tr></table>
</div>
{template="footer"}