var glob_width;
var glob_height;
var glob_elem;
var glob_id;
if (document.addEventListener)
{
document.addEventListener('webkitfullscreenchange', exitHandler, false);
document.addEventListener('mozfullscreenchange', exitHandler, false);
document.addEventListener('fullscreenchange', exitHandler, false);
document.addEventListener('MSFullscreenChange', exitHandler, false);
}
function exitHandler() {
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$(glob_elem).css("width", "100%");
$(glob_elem).css("height", "100%");
$(glob_elem).css("background-color", "white");
$(glob_elem).css("color", "#000");
$("#front-quality-text").text("Size: 25%");
$("#top-quality-text").text("Size: 25%");
$("#left-quality-text").text("Size: 25%");
$("#"+glob_id).width('100%');
$("#"+glob_id).height("100%");
} else {
$("#front-quality-text").text("Size: 100%");
$("#top-quality-text").text("Size: 100%");
$("#left-quality-text").text("Size: 100%");
}
}
}
function toggleFullscreen(elem, _id) {
elem = elem || document.documentElement;
console.log("ID: "+_id);
var ori_width = glob_width
var ori_height = glob_height;
var fs_scale;
var myRatio;
if (window.devicePixelRatio < 1) {
myRatio = 1.0;
} else {
myRatio = 2.0;
}
$("#"+_id).css('width', 'auto')
$("#"+_id).css('height', 'auto')
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
if ((ori_height*1.2) > ori_width) {
//newWidth = screen.width * (1/Math.ceil(window.devicePixelRatio));
//newHeight = screen.width * (ori_height/ori_width) * (1/Math.ceil(window.devicePixelRatio));
newWidth = screen.width * (1/ myRatio);
newHeight = screen.width * (ori_height/ori_width) * (1/ myRatio);
$("#"+_id).removeAttr('width');
$("#"+_id).height("80%");
} else {
newHeight = screen.height * (1/myRatio);
newWidth = screen.height * (ori_width/ori_height) * (1/myRatio);
$("#"+_id).removeAttr('height');
$("#"+_id).width("100%");
//newHeight = screen.height * (1/Math.ceil(window.devicePixelRatio));
//newWidth = screen.height * (ori_width/ori_height) * (1/Math.ceil(window.devicePixelRatio));
}
$(elem).css("height", (newHeight)+"px");
$(elem).css("width", (newWidth)+"px");
//$("#"+_id).removeAttr('width');
//$("#"+_id).height("80%");
//$(elem).css("width", "200px");
$(elem).css("background-color", "black");
$(elem).css("color", "#ccc");
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
$("#"+_id).width('100%');
$("#"+_id).height("100%");
//$(elem).css("width", "100%");
$(elem).css("background-color", "white");
$(elem).css("color", "#000");
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
}
}
$(function() {
$(window).resize(function() {
$("#front-quality-text").text("Magnification: " + ($("#img-front").width() / parseInt($("#front-count").text())).toFixed(2).toString() + "%");
$("#top-quality-text").text("Magnification: " + ($("#img-top").height() / parseInt($("#top-count").text())).toFixed(2).toString() + "%");
$("#left-quality-text").text("Magnification: " + ($("#placeholder-left").height() / parseInt($("#left-count").text())).toFixed(2).toString() + "%");
});
$( "#slider-left" ).slider({
range: "max",
min: 1,
max: parseInt($("#left-count").text()),
value: 1,
slide: function( event, ui ) {
//console.log(ui.value);
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
$("#left-text").text(ui.value);
// update image src
// data-zoom-image
//$("#placeholder-left").attr("data-zoom-image", "img?id="+id+"&name="+name+"&type=left-resized&counter="+(ui.value-1));
var imageUrl = "img?id="+id+"&name="+name+"&type=left&counter="+(ui.value-1);
$("#placeholder-left-zoomContainer > .zoomWindowContainer > div").css('background-image', 'url("' + imageUrl + '")');
//$("#placeholder-left-zoomContainer > .zoomLens").css('background-image', 'url("' + imageUrl + '")');
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+(ui.value-1));
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left&counter="+(ui.value-1));
}
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+(ui.value-1));
}
}
});
$( "#slider-right" ).slider({
range: "max",
min: 1,
max: parseInt($("#front-count").text()),
value: 1,
slide: function( event, ui ) {
//console.log(ui.value);
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
$("#front-text").text(ui.value);
// update image src
var imageUrl = "img?id="+id+"&name="+name+"&type=front&counter="+(ui.value-1);
$("#img-front-zoomContainer > .zoomWindowContainer > div").css('background-image', 'url("' + imageUrl + '")');
//$("#img-front-zoomContainer > .zoomLens").css('background-image', 'url("' + imageUrl + '")');
//$("#img-front").attr("data-zoom-image", "img?id="+id+"&name="+name+"&type=left-resized&counter="+(ui.value-1));
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+(ui.value-1));
} else {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front&counter="+(ui.value-1));
}
} else {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+(ui.value-1));
}
}
});
$( "#slider-center" ).slider({
range: "max",
min: 1,
max: parseInt($("#top-count").text()),
value: 1,
slide: function( event, ui ) {
//console.log(ui.value);
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
$("#top-text").text(ui.value);
// update image src
var imageUrl = "img?id="+id+"&name="+name+"&type=top&counter="+(ui.value-1);
$("#img-top-zoomContainer > .zoomWindowContainer > div").css('background-image', 'url("' + imageUrl + '")');
//$("#img-top-zoomContainer > .zoomLens").css('background-image', 'url("' + imageUrl + '")');
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+(ui.value-1));
} else {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top&counter="+(ui.value-1));
}
} else {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+(ui.value-1));
}
}
});
$( "#download" ).click(function(e) {
var did = $( "select option:selected" ).text();
e.preventDefault(); //stop the browser from following
window.location.href = 'download?did=' + did;
});
$('.target').change(function() {
var name = $(this).find("option:selected").text();
var index = $(this).find("option:selected").val();
$.ajax({
url: 'update?index=' + index + '&name=' + name,
type: 'GET',
success: function (response) {
console.log("Success.");
console.log(response);
$("#size").text("("+response.data_size+" GB)");
var html = "Description";
for (i = 0; i < response["desc"].length; i++) {
if (response["desc"][i]["type"] == "i") {
tmp = "" + response["desc"][i]["text"] + "";
} else if (response["desc"][i]["type"] == "p") {
tmp = response["desc"][i]["text"];
}
html += tmp;
}
$("#description").empty().append(html);
$("#front-count-text").text(" (max: " + response.front_count + ")");
$("#left-count-text").text(" (max: " + response.left_count + ")");
$("#top-count-text").text(" (max: " + response.top_count + ")");
$("#front-count").text(response.front_count);
$("#left-count").text(response.left_count);
$("#top-count").text(response.top_count);
$("#slider-right").slider("option", "max" , response.front_count );
$("#slider-left").slider("option", "max" , response.left_count );
$("#slider-center").slider("option", "max" , response.top_count );
var left_index = $( "#slider-left" ).slider( "option", "value" );
var top_index = $( "#slider-center" ).slider( "option", "value" );
var front_index = $( "#slider-right" ).slider( "option", "value" );
// update images
$("#placeholder-left").attr("src", "img?id="+index+"&name="+name+"&type=left-resized&counter="+(left_index-1));
$("#img-top").attr("src", "img?id="+index+"&name="+name+"&type=top-resized&counter="+(top_index-1));
$("#img-front").attr("src", "img?id="+index+"&name="+name+"&type=front-resized&counter="+(front_index-1));
var imageUrlLeft = "img?id="+index+"&name="+name+"&type=left&counter="+(left_index-1);
var imageUrlTop ="img?id="+index+"&name="+name+"&type=top&counter="+(top_index-1);
var imageUrlFront = "img?id="+index+"&name="+name+"&type=front&counter="+(front_index-1);
$("#placeholder-left-zoomContainer > .zoomWindowContainer > div").css('background-image', 'url("' + imageUrlLeft + '")');
$("#img-top-zoomContainer > .zoomWindowContainer > div").css('background-image', 'url("' + imageUrlTop + '")');
$("#img-front-zoomContainer > .zoomWindowContainer > div").css('background-image', 'url("' + imageUrlFront + '")');
$("#front-quality-text").text("Magnification: " + ($("#img-front").width() / parseInt($("#front-count").text())).toFixed(2).toString());
$("#top-quality-text").text("Magnification: " + ($("#img-top").height() / parseInt($("#top-count").text())).toFixed(2).toString());
$("#left-quality-text").text("Magnification: " + ($("#placeholder-left").height() / parseInt($("#left-count").text())).toFixed(2).toString());
},
error: function () {
console.log("Error.")
}
});
$("#img-preview").attr("src", "img?id="+index+"&name="+name+"&type=preview&counter=0");
});
$("#front-left").click( function() {
var index = parseInt($("#front-text").text());
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
index -= 1;
if (index < 1) {
index = 1;
}
$("#front-text").text(index);
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+index.toString());
} else {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front&counter="+index.toString());
}
} else {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+index.toString());
}
});
$("#front-right").click( function() {
var index = parseInt($("#front-text").text());
var max_count = parseInt($("#front-count").text());
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
//console.log(index, max_count);
index += 1;
if (index > max_count) {
index = max_count;
}
$("#front-text").text(index);
// update image src
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+index.toString());
} else {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front&counter="+index.toString());
}
} else {
$("#img-front").attr("src", "img?id="+id+"&name="+name+"&type=front-resized&counter="+index.toString());
}
});
$("#top-left").click( function() {
var index = parseInt($("#top-text").text());
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
index -= 1;
if (index < 1) {
index = 1;
}
$("#top-text").text(index);
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+index.toString());
} else {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top&counter="+index.toString());
}
} else {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+index.toString());
}
});
$("#top-right").click( function() {
var index = parseInt($("#top-text").text());
var max_count = parseInt($("#top-count").text());
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
//console.log(index, max_count);
index += 1;
if (index > max_count) {
index = max_count;
}
$("#top-text").text(index);
// update image src
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+index.toString());
} else {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top&counter="+index.toString());
}
} else {
$("#img-top").attr("src", "img?id="+id+"&name="+name+"&type=top-resized&counter="+index.toString());
}
});
$("#left-left").click( function() {
var index = parseInt($("#left-text").text());
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
index -= 1;
if (index < 1) {
index = 1;
}
$("#left-text").text(index);
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left&counter="+index.toString());
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
}
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left&counter="+index.toString());
}
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
}
});
$("#left-right").click( function() {
var index = parseInt($("#left-text").text());
var max_count = parseInt($("#left-count").text());
var name = $( "select option:selected" ).text();
var id = $( "select option:selected" ).val();
//console.log(index, max_count);
index += 1;
if (index > max_count) {
index = max_count;
}
$("#left-text").text(index);
// update image src
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null) {
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left&counter="+index.toString());
}
} else {
$("#placeholder-left").attr("src", "img?id="+id+"&name="+name+"&type=left-resized&counter="+index.toString());
}
});
document.getElementById("img-front").addEventListener("click", function() {
var container = $("#photowrapper-front");
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
glob_id = this.id;
glob_width = $("#photowrapper-front > img").width();
glob_height = $("#photowrapper-front > img").height();
glob_elem = $("#photowrapper-front")[0];
}
toggleFullscreen(container[0], this.id);
});
document.getElementById('img-top').addEventListener('click', function() {
var container = $("#photowrapper-top");
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
glob_id = this.id;
glob_width = $("#photowrapper-top > img").width();
glob_height = $("#photowrapper-top > img").height();
glob_elem = $("#photowrapper-top")[0];
}
toggleFullscreen(container[0], this.id);
});
document.getElementById('placeholder-left').addEventListener('click', function() {
var container = $("#photowrapper-left");
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
glob_id = this.id;
glob_width = $("#photowrapper-left > img").width();
glob_height = $("#photowrapper-left > img").height();
glob_elem = $("#photowrapper-left")[0];
}
toggleFullscreen(container[0], this.id);
});
$("#img-top").ezPlus({
zoomWindowPosition: 1,
scrollZoom: true,
zoomLevel: 0.1,
minZoomLevel: 0.1,
zoomWindowWidth: 300,
zoomWindowHeight: 300
});
$("#placeholder-left").ezPlus({
zoomWindowPosition: 9,
scrollZoom: true,
zoomLevel: 0.1,
minZoomLevel: 0.1,
zoomWindowWidth: 300,
zoomWindowHeight: 300
});
$("#img-front").ezPlus({
zoomWindowPosition: 11,
scrollZoom: true,
zoomLevel: 0.1,
minZoomLevel: 0.1,
zoomWindowWidth: 300,
zoomWindowHeight: 300
});
/*
* print folder, imLeft.size, imTop.size, imFront.size
* NRM-PZ Ar65771 (1174, 2929) (1173, 2929) (1173, 1174)
* NRM-PZ Ar65772 (1122, 3200) (1173, 3200) (1173, 1122)
* NRM-PZ Ar65794 (1118, 3113) (1133, 3113) (1133, 1118)
* NRM-PZ Ar65793 (1294, 3431) (1240, 3431) (1240, 1294)
* NRM-PZ Ar65720 (1223, 3311) (1267, 3311) (1267, 1223)
* NRM-PZ Ar65767 (1302, 2936) (1284, 2936) (1284, 1302)
*/
$("#front-quality-text").text("Magnification: 0.34");
$("#top-quality-text").text("Magnification: 0.13");
$("#left-quality-text").text("Magnification: 0.13");
/*
console.log("FRONT QUALITY: " + $("#img-front").width() + " / " + $("#front-count").text() );
console.log("TOP QUALITY: " + $("#img-top").height() + " / " + $("#top-count").text() );
console.log("LEFT QUALITY: " + $("#placeholder-left").height() + " / " + $("#left-count").text() );
*/
});