From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Mon, 14 Oct 2013 13:13:23 +0000 (+0000)
Subject: (no commit message)
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=8961815d307bc9e5f311f86572b7cce61ee38ed0;p=fluidbook-html5.git

---

diff --git a/_index.html b/_index.html
index 2bd28589..298c93e2 100644
--- a/_index.html
+++ b/_index.html
@@ -46,5 +46,6 @@
 		<div id="coquillette"></div>
 		<div id="hiddencontents"><!-- $hiddenContents --></div>
 		<div id="splash"><!-- $splash --></div>
+		<div id="popinOverlay"></div>
 	</body>
 </html>
\ No newline at end of file
diff --git a/js/libs/fluidbook/fluidbook.js b/js/libs/fluidbook/fluidbook.js
index 6c04d5d2..988fe9bc 100644
--- a/js/libs/fluidbook/fluidbook.js
+++ b/js/libs/fluidbook/fluidbook.js
@@ -116,9 +116,15 @@ Fluidbook.prototype = {
 		this.ready();
 		$("#main").css('visibility', 'visible');
 		this.hideLoader(0, true);
-		$("#splash").css('opacity', 0).one(this.support.getTransitionEndEvent(true), function() {
-			$(this).remove();
-		});
+		if (this.support.transitions2d) {
+			$("#splash").css('opacity', 0).one(this.support.getTransitionEndEvent(true), function() {
+				$(this).remove();
+			});
+		} else {
+			$("#splash").fadeOut(500, function() {
+				$(this.remove());
+			})
+		}
 
 	},
 	ready: function() {
@@ -731,7 +737,7 @@ Fluidbook.prototype = {
 
 		this.displayLoader();
 		this.resetWaiters();
-		
+
 		setTimeout(function() {
 			$this._openView(view, param1, param2, callback);
 		}, 20);
@@ -759,7 +765,7 @@ Fluidbook.prototype = {
 			search: 'thumbnails',
 			bookmark: 'thumbnails',
 			video: 'extras'};
-		
+
 		if (this.gal != null && preload[view] != undefined) {
 			var w = this.addWaiter(true);
 			this.gal.downloadAndCall(preload[view], function() {
diff --git a/js/libs/fluidbook/fluidbook.loader.js b/js/libs/fluidbook/fluidbook.loader.js
index dbeefa6a..0d15f9c9 100644
--- a/js/libs/fluidbook/fluidbook.loader.js
+++ b/js/libs/fluidbook/fluidbook.loader.js
@@ -6,7 +6,7 @@ function FluidbookLoader(fluidbook) {
 	this.toPreload = [];
 	this.numPreload = 0;
 	this.imagesErrors = [];
-
+ 
 }
 
 FluidbookLoader.prototype = {
diff --git a/js/main.js b/js/main.js
index 85b3bc9d..2a8d663f 100644
--- a/js/main.js
+++ b/js/main.js
@@ -201,6 +201,39 @@ function initEvents() {
 		return false;
 	});
 
+	$(document).on('click', "#popinOverlay", function() {
+		closePopin();
+		return false;
+	});
+
+	$(document).on('click', 'a.popin', function() {
+		var iframeid = 'iframe_' + Math.round(Math.random() * 100000);
+
+		var html = '<div style="width:' + $(this).data('width') + 'px;height:' + $(this).data('height') + 'px"><iframe id="' + iframeid + '" width="' + $(this).data('width') + '" height="' + $(this).data('height') + '" src="' + $(this).data('src') + '" frameborder="0"></iframe></div>';
+		$("#popinOverlay").append(html).show();
+
+		var frame = $("#" + iframeid)
+
+		$(frame).load(function() {
+			var f=$(frame).contents();
+			$(f).click(function(e){
+				if($(e.target).hasClass('closePopup')){
+					closePopin();
+					return;
+				}
+				$(e.target).parents().each(function(){
+					if($(this).hasClass('closePopup')){
+						closePopin();
+						return;
+					}
+				});
+			});
+		});
+
+		resize();
+		return false;
+	});
+
 	$(document).on('click', 'a.appswitchlocale', function() {
 		try {
 			fluidbook.displayLoader();
@@ -329,6 +362,16 @@ function resize(init) {
 		init = false;
 	}
 	fluidbook.resize.resize(init);
+
+	var ww = $(window).width();
+	var wh = $(window).height();
+	$("#popinOverlay>div").each(function() {
+		$(this).css({
+			top: (wh - $(this).outerHeight()) / 2,
+			left: (ww - $(this).outerWidth()) / 2
+		});
+	});
+
 }
 
 function goNextPage(e) {
@@ -399,6 +442,10 @@ function cacheUpdated(e) {
 	}
 }
 
+function closePopin() {
+	$("#popinOverlay").html('').hide();
+}
+
 (function() {
 	var proxied = window.alert;
 	window.alert = function() {
diff --git a/style/fluidbook.css b/style/fluidbook.css
index 5e8e69f2..0266ed18 100644
--- a/style/fluidbook.css
+++ b/style/fluidbook.css
@@ -1495,6 +1495,31 @@ a.button{
 	position:absolute;
 }
 
+#popinOverlay{
+	position:absolute;
+	z-index: 29;
+	top:0px;
+	left:0px;
+	width:100%;
+	height: 100%;
+	background-color: rgba(0,0,0,0.3);
+	display:none;
+}
+
+
+#popinOverlay iframe{
+	background-color:#fff;
+	overflow:hidden;
+}
+
+#popinOverlay>*{
+	position:absolute;
+	z-index: 30;
+	top:0px;
+	left:0px;
+
+}
+
 /* Tooltip */
 #tooltip{
 	position:absolute;
@@ -1508,14 +1533,14 @@ a.button{
 	z-index: 100;
 }
 
-@media all and (orientation: portrait) {  
+@media handled and (orientation: portrait) {  
 	#ol{display:none;}
-	@-ms-viewport { width: 640px; }
+	@-ms-viewport { width: 800px; }
 }  
 
-@media all and (orientation: landscape) {  
+@media handled and (orientation: landscape) {  
 	#op{display:none;}
-	@-ms-viewport { width: 1024px; }
+	@-ms-viewport { width: 1280px; }
 }  
 
 /* Webfonts*/