{include file="$blogtemplate/header.template"}
{include file="$blogtemplate/leftmenu.template"}
<div id="mainflickr">
<div id="flickr">
{if !empty($flickr)}
<script type="text/javascript" src="{$url->getBaseUrl()}/plugins/flickr/js/annotation/annotation.js"></script>
{literal}
<STYLE TYPE="text/css">
<!--
.flickr-album {
padding: 0;
width: 100%;
clear: both;
}

.flickr-thumbnail {
background-color: #fff;
border: 0px solid #a9a9a9;
}

.highlightit img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-moz-opacity: 0.5;
}

.highlightit:hover img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity: 1;
border: 1px solid navy;
}

.highlightit:hover{
color: red;
}

.flickr-photo {
padding-right: 20px;
background-color: #fff;
border: 1px solid #a9a9a9;
margin: 6px 6px 6px 6px;
padding: 4px;
margin-top:10px;
}

.flickr-title {
color: #260;
border-bottom: 1px dashed #CCC;
padding: 5px 0;
}

.flickr-album-nav {
clear: both;
text-align: left;
}

.flickr-photo-nav {
clear: both;
text-align: center;
}

.flickr-slideshow {
clear: both;
text-align: right;
}

.flickr-description {
font-size: 11px;
}

a.annotation {
position: absolute;
border: 2px solid yellow;
padding: 0;
display: none;
opacity: 0.2;
-moz-opacity: 0.2;
filter: alpha(opacity=20);
}
a.annotation span {
display: block;
width: 100%;
height: 100%;
background: white;
opacity: 0.2;
-moz-opacity: 0.2;
filter: alpha(opacity=20);
}
a.annotation:hover {
background: white;
opacity: 0.2;
-moz-opacity: 0.2;
filter: alpha(opacity=20);
border: 2px solid blue;
}
-->
</STYLE>
{/literal}

{if $flickr->isEnabled()}
{assign var=albumId value=$smarty.request.album}
{assign var=photoId value=$smarty.request.photo}
{assign var=secretId value=$smarty.request.secret}
{if $albumId != '' && $photoId != '' && $secretId != ''}
<div class="flickr-album-nav"><a href="{$flickr->pluginTemplatePage()}">{$locale->tr("flickr")}</a>  &raquo; <a href="{$flickr->getAlbumUrl($albumId)}">{$locale->tr("flickr_album_id")} {$albumId}</a>  &raquo; <b>{$locale->tr("flickr_photo_id")} {$photoId}</b></div>
{assign var=flickrPhotoInfo value=$flickr->getPhotoInfo($photoId,$secretId)}
<h3 class="flickr-title">{$locale->tr("flickr_photo_title")} {$flickrPhotoInfo.title}</h3>
{assign var=photoNavigation value=$flickr->getPhotoNavigation($albumId,$photoId)}
<div class="flickr-photo-nav">{if $photoNavigation.prevPhotoUrl != ''}<a href="{$photoNavigation.prevPhotoUrl}">&laquo; {$locale->tr("flickr_prev_photo")}</a>{/if} | {if $photoNavigation.nextPhotoUrl != ''}<a href="{$photoNavigation.nextPhotoUrl}">{$locale->tr("flickr_next_photo")} &raquo;</a>{/if}</div>
<a href="{$flickrPhotoInfo.originalimageUrl}"><img class="annotated flickr-photo" src="{$flickrPhotoInfo.resizeimageUrl}" alt="" usemap="imgmap" /></a><br />
{assign var=flickrNotes value=$flickrPhotoInfo.notes}
<map id="imgmap">
{foreach item=flickrNote from=$flickrNotes}
<area alt="" title="{$flickrNote.noteDesc}" nohref="nohref" shape="rect" coords="{$flickrNote.noteX},{$flickrNote.noteY},{$flickrNote.noteX+$flickrNote.noteW-1},{$flickrNote.noteY+$flickrNote.noteH-1}" />
{/foreach}
</map>
{assign var=flickrTags value=$flickrPhotoInfo.tags}
<div class="flickr-description">{$locale->tr("flickr_photo_description")} {$flickrPhotoInfo.description}</div>
<div class="flickr-description">{$locale->tr("flickr_photo_date")} {$flickrPhotoInfo.date}</div>
<div class="flickr-description">{$locale->tr("flickr_photo_tag")} {foreach item=flickrTag from=$flickrTags}<a href="{$flickrTag.tagUrl}">{$flickrTag.tagName}</a> {/foreach}</div>
<div class="flickr-description">{$locale->tr("flickr_photo_url")} <a href="{$flickrPhotoInfo.flickrUrl}">{$locale->tr("flickr_photo_see_url")} ({$flickrPhotoInfo.comments} {$locale->tr("comments")})</a></div>
{elseif $albumId != '' && ($photoId == '' || $secretId == '')}
<div class="flickr-nav"><a href="{$flickr->pluginTemplatePage()}">{$locale->tr("flickr")}</a>  &raquo; <b>{$locale->tr("flickr_album_id")} {$albumId}</b></div>
<div class="flickr-slideshow"><a href="#" onclick="window.open('{$flickr->getSlideShowUrl($albumId)}','slideShowWin','width=500,height=500,top=150,left=70,scrollbars=no, status=no, resizable=no')">{$locale->tr("flickr_view_as_slideshow")}</a></div>
{assign var=flickrPhotos value=$flickr->getPhotos($albumId)}
{foreach item=flickrPhoto from=$flickrPhotos}
<a href="{$flickrPhoto.photoUrl}" class="highlightit"><img class="flickr-thumbnail" src="{$flickrPhoto.thumbnailUrl}" alt="" /></a>
{/foreach}
{else}
{assign var=flickrAlbums value=$flickr->getPhotoList()}
{foreach name=flickrAlbum item=flickrAlbum from=$flickrAlbums}
<div class="flickr-album">
<a href="{$flickrAlbum.albumUrl}"><img class="flickr-thumbnail" src="{$flickrAlbum.thumbnailUrl}" alt="{$flickrAlbum.title}" /></a><br />
<h4 class="flickr-title">{$locale->tr("flickr_album_title")} {$flickrAlbum.title}</h4>
<div class="flickr-description">{$locale->tr("flickr_album_description")} {$flickrAlbum.description}</div>
<div class="flickr-description">{$locale->tr("flickr_album_photos")} <a href="{$flickrAlbum.albumUrl}">{$flickrAlbum.photos}</a></div>
<div class="flickr-description">{$locale->tr("flickr_album_url")} <a href="{$flickrAlbum.flickrUrl}">{$locale->tr("flickr_album_see_url")}</a></div>
</div>
{/foreach}
{assign var=totalAlbums value=$smarty.foreach.flickrAlbum.total}
{/if}
{else}
{$locale->tr("error_flickr_not_enabled")}
{/if}
{/if}
</div>
</div>
{include file="$blogtemplate/rightmenu.template"}
{include file="$blogtemplate/footer.template"}