You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
122 lines
2.9 KiB
122 lines
2.9 KiB
/**
|
|
* @description Used to view single photos with view.php
|
|
* @copyright 2015 by Tobias Reich
|
|
*/
|
|
|
|
let lychee = { content: $('#content') },
|
|
loadingBar = { show() {}, hide() {} }
|
|
imageview = $('#imageview')
|
|
|
|
$(document).ready(function() {
|
|
|
|
// Event Name
|
|
let touchendSupport = (/Android|iPhone|iPad|iPod/i).test(navigator.userAgent || navigator.vendor || window.opera) && ('ontouchend' in document.documentElement),
|
|
eventName = (touchendSupport===true ? 'touchend' : 'click')
|
|
|
|
// Set API error handler
|
|
api.onError = error
|
|
|
|
// Infobox
|
|
header.dom('#button_info').on(eventName, sidebar.toggle)
|
|
|
|
// Direct Link
|
|
header.dom('#button_direct').on(eventName, function() {
|
|
|
|
let link = $('#imageview #image').css('background-image').replace(/"/g,'').replace(/url\(|\)$/ig, '')
|
|
window.open(link, '_newtab')
|
|
|
|
})
|
|
|
|
loadPhotoInfo(gup('p'))
|
|
|
|
})
|
|
|
|
const getPhotoSize = function(photo) {
|
|
|
|
// Size can be 'big', 'medium' or 'small'
|
|
// Default is big
|
|
// Small is centered in the middle of the screen
|
|
let size = 'big',
|
|
scaled = false,
|
|
hasMedium = photo.medium!=='',
|
|
pixelRatio = window.devicePixelRatio,
|
|
view = {
|
|
width: $(window).width() - 60,
|
|
height: $(window).height() - 100
|
|
}
|
|
|
|
// Detect if the photo will be shown scaled,
|
|
// because the screen size is smaller than the photo
|
|
if (photo.json.width>view.width || photo.json.height>view.height) scaled = true
|
|
|
|
// Calculate pixel ratio of screen
|
|
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.json.width<view.width&& photo.json.width<view.height)) size = 'small'
|
|
|
|
return size
|
|
|
|
}
|
|
|
|
const loadPhotoInfo = function(photoID) {
|
|
|
|
let params = {
|
|
photoID,
|
|
albumID: 0,
|
|
password: ''
|
|
}
|
|
|
|
api.post('Photo::get', params, function(data) {
|
|
|
|
if (data==='Warning: Photo private!' || data==='Warning: Wrong password!') {
|
|
|
|
$('body').append(build.no_content('question-mark'))
|
|
$('body').removeClass('view')
|
|
header.dom().remove()
|
|
return false
|
|
|
|
}
|
|
|
|
// Set title
|
|
if (!data.title) data.title = 'Untitled'
|
|
document.title = 'Lychee - ' + data.title
|
|
header.dom('#title').html(data.title)
|
|
|
|
let size = getPhotoSize(data)
|
|
|
|
// Render HTML
|
|
imageview.html(build.imageview(data, size, true))
|
|
imageview.find('.arrow_wrapper').remove()
|
|
imageview.addClass('fadeIn').show()
|
|
|
|
// Render Sidebar
|
|
let structure = sidebar.createStructure.photo(data),
|
|
html = sidebar.render(structure)
|
|
|
|
sidebar.dom('.wrapper').html(html)
|
|
sidebar.bind()
|
|
|
|
})
|
|
|
|
}
|
|
|
|
const error = function(errorThrown, params, data) {
|
|
|
|
console.error({
|
|
description : errorThrown,
|
|
params : params,
|
|
response : data
|
|
})
|
|
|
|
loadingBar.show('error', errorThrown)
|
|
|
|
} |