|
@@ -30,25 +30,49 @@ function exitHandler() {
|
|
|
}
|
|
|
|
|
|
|
|
|
-function toggleFullscreen(elem) {
|
|
|
+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/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/Math.ceil(window.devicePixelRatio));
|
|
|
- newWidth = screen.height * (ori_width/ori_height) * (1/Math.ceil(window.devicePixelRatio));
|
|
|
+ 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, "img").css("height", (newHeight)+"px");
|
|
|
- $(elem, "img").css("width", (newWidth)+"px");
|
|
|
+
|
|
|
+ $(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");
|
|
@@ -63,7 +87,9 @@ function toggleFullscreen(elem) {
|
|
|
elem.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
|
|
}
|
|
|
} else {
|
|
|
- $(elem).css("width", "100%");
|
|
|
+ $("#"+_id).width('100%');
|
|
|
+ $("#"+_id).height("100%");
|
|
|
+ //$(elem).css("width", "100%");
|
|
|
$(elem).css("background-color", "white");
|
|
|
$(elem).css("color", "#000");
|
|
|
|
|
@@ -299,7 +325,7 @@ $(function() {
|
|
|
glob_height = $("#photowrapper-front > img").height();
|
|
|
glob_elem = $("#photowrapper-front")[0];
|
|
|
}
|
|
|
- toggleFullscreen(container[0]);
|
|
|
+ toggleFullscreen(container[0], this.id);
|
|
|
});
|
|
|
|
|
|
document.getElementById('img-top').addEventListener('click', function() {
|
|
@@ -310,7 +336,7 @@ $(function() {
|
|
|
glob_height = $("#photowrapper-top > img").height();
|
|
|
glob_elem = $("#photowrapper-top")[0];
|
|
|
}
|
|
|
- toggleFullscreen(container[0]);
|
|
|
+ toggleFullscreen(container[0], this.id);
|
|
|
});
|
|
|
|
|
|
document.getElementById('placeholder-left').addEventListener('click', function() {
|
|
@@ -321,7 +347,7 @@ $(function() {
|
|
|
glob_height = $("#photowrapper-left > img").height();
|
|
|
glob_elem = $("#photowrapper-left")[0];
|
|
|
}
|
|
|
- toggleFullscreen(container[0]);
|
|
|
+ toggleFullscreen(container[0], this.id);
|
|
|
});
|
|
|
|
|
|
$("#img-top").ezPlus({
|