arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Show medium in view.php when available #67

Browse Source
This commit is contained in:
Tobias Reich 2014-11-28 23:21:32 +01:00
parent 4b9030effb
commit c670b85daf
3 changed files with 37 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist/main.js vendored
View File

Binary file not shown.

BIN
dist/view.js vendored
View File

Binary file not shown.

57
src/scripts/view/main.js
View File

@ -39,32 +39,50 @@ key = function(e) {
var code = (e.keyCode ? e.keyCode : e.which); var code = (e.keyCode ? e.keyCode : e.which);
if (code===27&&visibleInfobox()) { if (code===27) {
hideInfobox(); hideInfobox();
e.preventDefault(); e.preventDefault();
} }
} }
visibleInfobox = function() { getPhotoSize = function(photo) {
if (parseInt(infobox.css('right').replace('px', ''))<0) return false; // Size can be 'big', 'medium' or 'small'
else return true; // Default is big
// Small is centered in the middle of the screen
} var size = 'big',
scaled = false,
isPhotoSmall = function(photo) { hasMedium = photo.medium!=='',
pixelRatio = window.devicePixelRatio,
var size = { view = {
width: false, width: $(window).width()-60,
height: false height: $(window).height()-100
}; };
if (photo.width<$(window).width()-60) size.width = true; // Detect if the photo will be shown scaled,
if (photo.height<$(window).height()-100) size.height = true; // because the screen size is smaller than the photo
if (photo.width>view.width||
photo.width>view.height) scaled = true;
if (size.width&&size.height) return true; // Calculate pixel ratio of screen
else return false; if (pixelRatio!==undefined&&pixelRatio>1) {
view.width = view.width * pixelRatio;
view.height = view.height * pixelRatio;
}
// Medium available and
// Medium still bigger than screen
if (hasMedium===true&&
(1920>view.width&&1080>view.height)) size = 'medium';
// Photo not scaled
// Photo smaller then screen
if (scaled===false&&
(photo.width<view.width&&
photo.width<view.height)) size = 'small';
return size;
} }
@ -88,14 +106,17 @@ loadPhotoInfo = function(photoID) {
var params = 'function=getPhoto&photoID=' + photoID + '&albumID=0&password=""'; var params = 'function=getPhoto&photoID=' + photoID + '&albumID=0&password=""';
$.ajax({type: 'POST', url: api_path, data: params, dataType: 'json', success: function(data) { $.ajax({type: 'POST', url: api_path, data: params, dataType: 'json', success: function(data) {
var size = getPhotoSize(data);
if (!data.title) data.title = 'Untitled'; if (!data.title) data.title = 'Untitled';
document.title = 'Lychee - ' + data.title; document.title = 'Lychee - ' + data.title;
headerTitle.html(data.title); headerTitle.html(data.title);
imageview.attr('data-id', photoID); imageview.attr('data-id', photoID);
if (isPhotoSmall(data)) imageview.html("<div id='image' class='small' style='background-image: url(" + data.url + "); width: " + data.width + "px; height: " + data.height + "px; margin-top: -" + parseInt((data.height/2)-20) + "px; margin-left: -" + data.width/2 + "px;'></div>"); if (size==='big') imageview.html("<div id='image' style='background-image: url(" + data.url + ");'></div>");
else imageview.html("<div id='image' style='background-image: url(" + data.url + ");'></div>"); else if (size==='medium') imageview.html("<div id='image' style='background-image: url(" + data.medium + ");'></div>");
else imageview.html("<div id='image' class='small' style='background-image: url(" + data.url + "); width: " + data.width + "px; height: " + data.height + "px; margin-top: -" + parseInt((data.height/2)-20) + "px; margin-left: -" + data.width/2 + "px;'></div>");
imageview imageview
.removeClass('fadeOut') .removeClass('fadeOut')