128 lines
3.7 KiB
C#
128 lines
3.7 KiB
C#
<?cs def:html_head() ?>
|
|
<style type="text/css">
|
|
body {
|
|
margin: 2em;
|
|
text-align: center;
|
|
}
|
|
|
|
#progress {
|
|
position: absolute;
|
|
left: 0px;
|
|
top: 0px;
|
|
right: 0px;
|
|
border: 1px solid white;
|
|
padding: 0.2em;
|
|
}
|
|
|
|
#progdone {
|
|
color: white;
|
|
background-color: blue;
|
|
font-size: x-small;
|
|
text-align: center;
|
|
width: 0%;
|
|
}
|
|
</style>
|
|
<title>Image: <?cs var:html_strip(photo.annotation) ?> (<?cs var:photo.name ?>)</title>
|
|
<script lang="type/javascript">
|
|
function display() {
|
|
if ( this.readyState == 4 ) {
|
|
document.photo.src = '';
|
|
document.last = document.data;
|
|
eval( 'document.data = (' + this.responseText + ');' );
|
|
var ratio = document.data.photo.origwidth /
|
|
document.data.photo.origheight;
|
|
if ( ratio > 1 ) {
|
|
document.photo.width = 400;
|
|
document.photo.height = 400/ratio;
|
|
} else {
|
|
document.photo.width = 300*ratio;
|
|
document.photo.height = 300;
|
|
}
|
|
document.photo.src = '<?cs var:uri ?>/'
|
|
+ document.data.photo.resized;
|
|
var index = Math.floor(document.data.photo.index);
|
|
var count = Math.floor(document.data.gallery.length);
|
|
var progress = Math.round(
|
|
100*( index + 1 )
|
|
/ count );
|
|
document.progress.style.width = progress + '%';
|
|
document.progress.innerHTML = progress+'%';
|
|
document.xhr.onreadystatechange = display;
|
|
if ( ( document.data.photo.width <= 100 ) &&
|
|
( document.data.photo.height <= 100 ) ) {
|
|
document.xhr.open('GET',
|
|
'<?cs var:js_escape(CGI.ScriptName) ?>/'
|
|
+ document.data.gallery.name
|
|
+ '/'
|
|
+ document.data.photo.name
|
|
+ '?json=1'
|
|
+ document.scaledata);
|
|
} else {
|
|
document.lastphotolink.href =
|
|
'<?cs var:js_escape(CGI.ScriptName) ?>/'
|
|
+ document.data.gallery.name
|
|
+ '/'
|
|
+ document.last.photo.name;
|
|
document.lastphoto.src = '';
|
|
document.lastphoto.width =
|
|
document.photo.width;
|
|
document.lastphoto.height =
|
|
document.photo.height;
|
|
document.lastphoto.src = document.photo.src;
|
|
if ( document.data.photo.name !=
|
|
document.data.photo.next ) {
|
|
document.xhr.open('GET',
|
|
'<?cs var:js_escape(CGI.ScriptName) ?>/'
|
|
+ document.data.gallery.name
|
|
+ '/'
|
|
+ document.data.photo.next
|
|
+ '?json=1'
|
|
+ document.thumbdata);
|
|
}
|
|
}
|
|
document.xhr.send(null);
|
|
}
|
|
}
|
|
|
|
function main() {
|
|
document.lastphotolink = document.getElementById('lastphotolink');
|
|
document.lastphoto = document.getElementById('lastphoto');
|
|
document.photo = document.getElementById('photo');
|
|
document.progress = document.getElementById('progdone');
|
|
document.base = window.location.protocol
|
|
+ window.location.host;
|
|
document.thumbdata = '&width=100&height=100&quality=25';
|
|
document.scaledata = '&width=<?cs var:settings.width ?>'
|
|
+ '&height=<?cs var:settings.height ?>'
|
|
+ '&quality=<?cs var:settings.quality ?>'
|
|
+ '&rotation=<?cs var:settings.rotation ?>';
|
|
|
|
document.xhr = getXHR();
|
|
document.xhr.onreadystatechange = display;
|
|
document.xhr.open('GET','<?cs var:js_escape(CGI.ScriptName)
|
|
?>/<?cs var:js_escape(gallery.name)
|
|
?>/<?cs var:js_escape(photo.name) ?>?json=1'+document.thumbdata);
|
|
document.xhr.send(null);
|
|
}
|
|
</script>
|
|
<script lang="text/javascript" src="<?cs var:uri
|
|
?>/templates/lib.js"></script>
|
|
<script lang="text/javascript" src="<?cs var:uri
|
|
?>/templates/wheellib.js"></script>
|
|
<?cs /def ?>
|
|
|
|
<?cs def:html_body() ?>
|
|
<div id="progress">
|
|
<div id="progdone"></div>
|
|
</div>
|
|
<a href="#" id="lastphotolink" target="_blank"> <img id="lastphoto"
|
|
alt="" width="400" height="300" /></a>
|
|
<img id="photo" alt="" width="400" height="300" />
|
|
<p>
|
|
Photo gallery images are being generated. Click the left photo
|
|
to view the last resized image.
|
|
</p>
|
|
<?cs /def ?>
|
|
|
|
<?cs set:template.bodyargs = 'onload="main();"' ?>
|