summaryrefslogtreecommitdiffstats
path: root/apps/files_imageviewer/js/lightbox.js
blob: 4f079b6d8aff59d5e7997f1dccfac83c4b8bad1c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
var lightBoxShown=false;
$(document).ready(function() {
	images={};//image cache
	loading_str = t('files_imageviewer','Loading');
	var overlay=$('<div id="lightbox_overlay"><div id="lightbox_loader"><img /></div></div>');
	overlay.find('#lightbox_loader img')
		.attr('src',OC.imagePath('core', 'loading-dark.gif'))
		.attr('alt',loading_str)
		.after(loading_str);
	$( 'body' ).append(overlay);
	var container=$('<div id="lightbox"/>');
	$( 'body' ).append(container);
	$( '#lightbox_overlay' ).click(hideLightbox);
	$( '#lightbox' ).click(hideLightbox);
	if(typeof FileActions!=='undefined'){
		FileActions.register('image','View','',function(filename){
			viewImage($('#dir').val(),filename);
		});
		FileActions.setDefault('image','View');
	}
	OC.search.customResults.Images=function(row,item){
		var image=item.link.substr(item.link.indexOf('file=')+5);
		var a=row.find('a');
		var container=$('<div id="lightbox"/>');
		a.attr('href','#');
		a.click(function(){
			var file=image.split('/').pop();
			var dir=image.substr(0,image.length-file.length-1);
			viewImage(dir,file);
		});
	}
});

function viewImage(dir,file){
	var location=OC.filePath('files','ajax','download.php')+'?files='+file+'&dir='+dir;
	var overlay=$('#lightbox_overlay');
	var container=$('#lightbox');
	overlay.show();
	if(!images[location]){
		var img = new Image();
		img.onload = function(){
			images[location]=img;
			if($('#lightbox_overlay').is(':visible'))
				showLightbox(container,img);
		}
		img.src = location;
	}else{
		showLightbox(container,images[location]);
	}
}

function showLightbox(container,img){
	var maxWidth = $( window ).width() - 50;
	var maxHeight = $( window ).height() - 50;
	if( img.width > maxWidth || img.height > maxHeight ) { // One of these is larger than the window
		var ratio = img.width / img.height;
		if( img.height >= maxHeight ) {
			img.height = maxHeight;
			img.width = maxHeight * ratio;
		} else {
			img.width = maxWidth;
			img.height = maxWidth / ratio;
		}
	}
	container.empty();
	container.append(img);
	container.css('top',Math.round( ($( window ).height() - img.height)/2));
	container.css('left',Math.round( ($( window ).width() - img.width)/2));
	$('#lightbox').show();
	setTimeout(function(){
		lightBoxShown=true;
	},100);
}

function hideLightbox(event){
	if(event){
		event.stopPropagation();
		$('#lightbox_overlay').hide();
		$('#lightbox').hide();
		lightBoxShown=false;
	}
}