From: Zach Prezkuta <fermion@gmx.com>
Date: Thu, 31 Jan 2013 15:40:03 +0000 (-0700)
Subject: starting switching to colorbox
X-Git-Url: https://git.mxchange.org/?a=commitdiff_plain;h=0f25455d1b4594d44cf2cbf13839f3f8a39cb835;p=friendica.git

starting switching to colorbox
---

diff --git a/js/main.js b/js/main.js
index ff1039be9d..7eaff3c43c 100644
--- a/js/main.js
+++ b/js/main.js
@@ -103,9 +103,13 @@
 		});
 		
 		// fancyboxes
-		$("a.popupbox").fancybox({
+		/*$("a.popupbox").fancybox({
 			'transitionIn' : 'elastic',
 			'transitionOut' : 'elastic'
+		});*/
+		$("a.popupbox").colorbox({
+			'inline' : true,
+			'transition' : 'none'
 		});
 		
 
diff --git a/view/admin_site.tpl b/view/admin_site.tpl
index 38d1fb8d04..e8fdd42589 100644
--- a/view/admin_site.tpl
+++ b/view/admin_site.tpl
@@ -1,37 +1,40 @@
 <script>
 	$(function(){
 		
-		$("#cnftheme").fancybox({
-			width: 800,
-			autoDimensions: false,
-			onStart: function(){
-				var theme = $("#id_theme :selected").val();
-				var theme_mobile = $("#id_theme_mobile :selected").val();
-				$("#cnftheme").attr('href',"$baseurl/admin/themes/"+theme);
-			}, 
-			onComplete: function(){
-				$("div#fancybox-content form").submit(function(e){
-					var url = $(this).attr('action');
-					// can't get .serialize() to work...
-					var data={};
-					$(this).find("input").each(function(){
-						data[$(this).attr('name')] = $(this).val();
-					});
-					$(this).find("select").each(function(){
-						data[$(this).attr('name')] = $(this).children(":selected").val();
-					});
-					console.log(":)", url, data);
+		$("#cnftheme").click(function(){
+			$.colorbox({
+				width: 800,
+				height: '90%',
+				/*onOpen: function(){
+					var theme = $("#id_theme :selected").val();
+					$("#cnftheme").attr('href',"$baseurl/admin/themes/"+theme);
+				},*/
+				href: "$baseurl/admin/themes/" + $("#id_theme :selected").val(),
+				onComplete: function(){
+					$("div#fancybox-content form").submit(function(e){
+						var url = $(this).attr('action');
+						// can't get .serialize() to work...
+						var data={};
+						$(this).find("input").each(function(){
+							data[$(this).attr('name')] = $(this).val();
+						});
+						$(this).find("select").each(function(){
+							data[$(this).attr('name')] = $(this).children(":selected").val();
+						});
+						console.log(":)", url, data);
 					
-					$.post(url, data, function(data) {
-						if(timer) clearTimeout(timer);
-						NavUpdate();
-						$.fancybox.close();
-					})
+						$.post(url, data, function(data) {
+							if(timer) clearTimeout(timer);
+							NavUpdate();
+							$.colorbox.close();
+						})
 					
-					return false;
-				});
+						return false;
+					});
 				
-			}
+				}
+			});
+			return false;
 		});
 	});
 </script>
diff --git a/view/event_head.tpl b/view/event_head.tpl
index ea7dc44663..559de24e31 100644
--- a/view/event_head.tpl
+++ b/view/event_head.tpl
@@ -7,7 +7,7 @@
 		$.get(
 			'$baseurl/events/?id='+eventid,
 			function(data){
-				$.fancybox(data);
+				$.colorbox({html:data});
 			}
 		);			
 	}
diff --git a/view/head.tpl b/view/head.tpl
index 588654352d..7b1ed7de93 100644
--- a/view/head.tpl
+++ b/view/head.tpl
@@ -1,7 +1,8 @@
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <base href="$baseurl/" />
 <meta name="generator" content="$generator" />
-<link rel="stylesheet" href="$baseurl/library/fancybox/jquery.fancybox.css" type="text/css" media="screen" />
+{#<!--<link rel="stylesheet" href="$baseurl/library/fancybox/jquery.fancybox.css" type="text/css" media="screen" />-->#}
+<link rel="stylesheet" href="$baseurl/library/colorbox/colorbox.css" type="text/css" media="screen" />
 <link rel="stylesheet" href="$baseurl/library/jgrowl/jquery.jgrowl.css" type="text/css" media="screen" />
 
 <link rel="stylesheet" type="text/css" href="$stylesheet" media="all" />
@@ -23,7 +24,8 @@
 <script type="text/javascript" src="$baseurl/js/jquery.js" ></script>
 <script type="text/javascript" src="$baseurl/js/jquery.textinputs.js" ></script>
 <script type="text/javascript" src="$baseurl/js/fk.autocomplete.js" ></script>
-<script type="text/javascript" src="$baseurl/library/fancybox/jquery.fancybox.pack.js"></script>
+{#<!--<script type="text/javascript" src="$baseurl/library/fancybox/jquery.fancybox.pack.js"></script>-->#}
+<script type="text/javascript" src="$baseurl/library/colorbox/jquery.colorbox-min.js"></script>
 <script type="text/javascript" src="$baseurl/library/jgrowl/jquery.jgrowl_minimized.js"></script>
 <script type="text/javascript" src="$baseurl/library/tinymce/jscripts/tiny_mce/tiny_mce_src.js" ></script>
 <script type="text/javascript" src="$baseurl/js/acl.js" ></script>
diff --git a/view/jot-header.tpl b/view/jot-header.tpl
index 8b9e772e60..a442c4c648 100644
--- a/view/jot-header.tpl
+++ b/view/jot-header.tpl
@@ -13,9 +13,9 @@ function initEditor(cb){
 			$("#profile-jot-text").css({ 'height': 200, 'color': '#000' });
 			$("#profile-jot-text").contact_autocomplete(baseurl+"/acl");
 			editor = true;
-			$("a#jot-perms-icon").fancybox({
-				'transitionIn' : 'elastic',
-				'transitionOut' : 'elastic'
+			$("a#jot-perms-icon").colorbox({
+				'inline' : true,
+				'transition' : 'elastic'
 			});
 			$(".jothidden").show();
 			if (typeof cb!="undefined") cb();
@@ -105,9 +105,9 @@ function initEditor(cb){
 		});
 		editor = true;
 		// setup acl popup
-		$("a#jot-perms-icon").fancybox({
-			'transitionIn' : 'elastic',
-			'transitionOut' : 'elastic'
+		$("a#jot-perms-icon").colorbox({
+			'inline' : true,
+			'transition' : 'elastic'
 		}); 
 	} else {
 		if (typeof cb!="undefined") cb();
@@ -274,7 +274,7 @@ function enableOnUser(){
 		var bordercolor = $("input").css("border-color");
 		
 		$.get('filer/', function(data){
-			$.fancybox(data);
+			$.colorbox({html:data});
 			$("#id_term").keypress(function(){
 				$(this).css("border-color",bordercolor);
 			})
@@ -292,7 +292,7 @@ function enableOnUser(){
 //					if(timer) clearTimeout(timer);
 //					timer = setTimeout(NavUpdate,3000);
 					liking = 1;
-					$.fancybox.close();
+					$.colorbox.close();
 				} else {
 					$("#id_term").css("border-color","#FF0000");
 				}
diff --git a/view/smarty3/admin_site.tpl b/view/smarty3/admin_site.tpl
index 2ff63ec2e7..f033b52eef 100644
--- a/view/smarty3/admin_site.tpl
+++ b/view/smarty3/admin_site.tpl
@@ -6,37 +6,40 @@
 <script>
 	$(function(){
 		
-		$("#cnftheme").fancybox({
-			width: 800,
-			autoDimensions: false,
-			onStart: function(){
-				var theme = $("#id_theme :selected").val();
-				var theme_mobile = $("#id_theme_mobile :selected").val();
-				$("#cnftheme").attr('href',"{{$baseurl}}/admin/themes/"+theme);
-			}, 
-			onComplete: function(){
-				$("div#fancybox-content form").submit(function(e){
-					var url = $(this).attr('action');
-					// can't get .serialize() to work...
-					var data={};
-					$(this).find("input").each(function(){
-						data[$(this).attr('name')] = $(this).val();
-					});
-					$(this).find("select").each(function(){
-						data[$(this).attr('name')] = $(this).children(":selected").val();
-					});
-					console.log(":)", url, data);
+		$("#cnftheme").click(function(){
+			$.colorbox({
+				width: 800,
+				height: '90%',
+				/*onOpen: function(){
+					var theme = $("#id_theme :selected").val();
+					$("#cnftheme").attr('href',"{{$baseurl}}/admin/themes/"+theme);
+				},*/
+				href: "{{$baseurl}}/admin/themes/" + $("#id_theme :selected").val(),
+				onComplete: function(){
+					$("div#fancybox-content form").submit(function(e){
+						var url = $(this).attr('action');
+						// can't get .serialize() to work...
+						var data={};
+						$(this).find("input").each(function(){
+							data[$(this).attr('name')] = $(this).val();
+						});
+						$(this).find("select").each(function(){
+							data[$(this).attr('name')] = $(this).children(":selected").val();
+						});
+						console.log(":)", url, data);
 					
-					$.post(url, data, function(data) {
-						if(timer) clearTimeout(timer);
-						NavUpdate();
-						$.fancybox.close();
-					})
+						$.post(url, data, function(data) {
+							if(timer) clearTimeout(timer);
+							NavUpdate();
+							$.colorbox.close();
+						})
 					
-					return false;
-				});
+						return false;
+					});
 				
-			}
+				}
+			});
+			return false;
 		});
 	});
 </script>
diff --git a/view/smarty3/event_head.tpl b/view/smarty3/event_head.tpl
index 4eb8c304fb..3d7091fb7a 100644
--- a/view/smarty3/event_head.tpl
+++ b/view/smarty3/event_head.tpl
@@ -12,7 +12,7 @@
 		$.get(
 			'{{$baseurl}}/events/?id='+eventid,
 			function(data){
-				$.fancybox(data);
+				$.colorbox({html:data});
 			}
 		);			
 	}
diff --git a/view/smarty3/head.tpl b/view/smarty3/head.tpl
index 27e5615149..1b01b71a05 100644
--- a/view/smarty3/head.tpl
+++ b/view/smarty3/head.tpl
@@ -6,7 +6,8 @@
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <base href="{{$baseurl}}/" />
 <meta name="generator" content="{{$generator}}" />
-<link rel="stylesheet" href="{{$baseurl}}/library/fancybox/jquery.fancybox.css" type="text/css" media="screen" />
+{{*<!--<link rel="stylesheet" href="{{$baseurl}}/library/fancybox/jquery.fancybox.css" type="text/css" media="screen" />-->*}}
+<link rel="stylesheet" href="{{$baseurl}}/library/colorbox/colorbox.css" type="text/css" media="screen" />
 <link rel="stylesheet" href="{{$baseurl}}/library/jgrowl/jquery.jgrowl.css" type="text/css" media="screen" />
 
 <link rel="stylesheet" type="text/css" href="{{$stylesheet}}" media="all" />
@@ -28,7 +29,8 @@
 <script type="text/javascript" src="{{$baseurl}}/js/jquery.js" ></script>
 <script type="text/javascript" src="{{$baseurl}}/js/jquery.textinputs.js" ></script>
 <script type="text/javascript" src="{{$baseurl}}/js/fk.autocomplete.js" ></script>
-<script type="text/javascript" src="{{$baseurl}}/library/fancybox/jquery.fancybox.pack.js"></script>
+{{*<!--<script type="text/javascript" src="{{$baseurl}}/library/fancybox/jquery.fancybox.pack.js"></script>-->*}}
+<script type="text/javascript" src="{{$baseurl}}/library/colorbox/jquery.colorbox-min.js"></script>
 <script type="text/javascript" src="{{$baseurl}}/library/jgrowl/jquery.jgrowl_minimized.js"></script>
 <script type="text/javascript" src="{{$baseurl}}/library/tinymce/jscripts/tiny_mce/tiny_mce_src.js" ></script>
 <script type="text/javascript" src="{{$baseurl}}/js/acl.js" ></script>
diff --git a/view/smarty3/jot-header.tpl b/view/smarty3/jot-header.tpl
index b893f1f6b1..ce7dcf2a4d 100644
--- a/view/smarty3/jot-header.tpl
+++ b/view/smarty3/jot-header.tpl
@@ -18,9 +18,9 @@ function initEditor(cb){
 			$("#profile-jot-text").css({ 'height': 200, 'color': '#000' });
 			$("#profile-jot-text").contact_autocomplete(baseurl+"/acl");
 			editor = true;
-			$("a#jot-perms-icon").fancybox({
-				'transitionIn' : 'elastic',
-				'transitionOut' : 'elastic'
+			$("a#jot-perms-icon").colorbox({
+				'inline' : true,
+				'transition' : 'elastic'
 			});
 			$(".jothidden").show();
 			if (typeof cb!="undefined") cb();
@@ -110,9 +110,9 @@ function initEditor(cb){
 		});
 		editor = true;
 		// setup acl popup
-		$("a#jot-perms-icon").fancybox({
-			'transitionIn' : 'elastic',
-			'transitionOut' : 'elastic'
+		$("a#jot-perms-icon").colorbox({
+			'inline' : true,
+			'transition' : 'elastic'
 		}); 
 	} else {
 		if (typeof cb!="undefined") cb();
@@ -279,7 +279,7 @@ function enableOnUser(){
 		var bordercolor = $("input").css("border-color");
 		
 		$.get('filer/', function(data){
-			$.fancybox(data);
+			$.colorbox({html:data});
 			$("#id_term").keypress(function(){
 				$(this).css("border-color",bordercolor);
 			})
@@ -297,7 +297,7 @@ function enableOnUser(){
 //					if(timer) clearTimeout(timer);
 //					timer = setTimeout(NavUpdate,3000);
 					liking = 1;
-					$.fancybox.close();
+					$.colorbox.close();
 				} else {
 					$("#id_term").css("border-color","#FF0000");
 				}
diff --git a/view/theme/diabook/photo_view.tpl b/view/theme/diabook/photo_view.tpl
index 272b670488..3a8f7291ec 100644
--- a/view/theme/diabook/photo_view.tpl
+++ b/view/theme/diabook/photo_view.tpl
@@ -11,7 +11,8 @@
 </div>
 
 {{ if $prevlink }}<div id="photo-prev-link"><a href="$prevlink.0">$prevlink.1</a></div>{{ endif }}
-<div id="photo-photo"><a href="$photo.href" class="lightbox" title="$photo.title"><img src="$photo.src" /></a></div>
+{#<!--<div id="photo-photo"><a href="$photo.href" class="lightbox" title="$photo.title"><img src="$photo.src" /></a></div>-->#}
+<div id="photo-photo"><img href="$photo.href" class="lightbox" style="cursor:pointer;" src="$photo.src" /></div>
 {{ if $nextlink }}<div id="photo-next-link"><a href="$nextlink.0">$nextlink.1</a></div>{{ endif }}
 <div id="photo-photo-end"></div>
 <div id="photo-caption">$desc</div>
diff --git a/view/theme/diabook/smarty3/photo_view.tpl b/view/theme/diabook/smarty3/photo_view.tpl
index e3908be006..55a8440d10 100644
--- a/view/theme/diabook/smarty3/photo_view.tpl
+++ b/view/theme/diabook/smarty3/photo_view.tpl
@@ -16,7 +16,8 @@
 </div>
 
 {{if $prevlink}}<div id="photo-prev-link"><a href="{{$prevlink.0}}">{{$prevlink.1}}</a></div>{{/if}}
-<div id="photo-photo"><a href="{{$photo.href}}" class="lightbox" title="{{$photo.title}}"><img src="{{$photo.src}}" /></a></div>
+{{*<!--<div id="photo-photo"><a href="{{$photo.href}}" class="lightbox" title="{{$photo.title}}"><img src="{{$photo.src}}" /></a></div>-->*}}
+<div id="photo-photo"><img href="{{$photo.href}}" class="lightbox" style="cursor:pointer;" src="{{$photo.src}}" /></div>
 {{if $nextlink}}<div id="photo-next-link"><a href="{{$nextlink.0}}">{{$nextlink.1}}</a></div>{{/if}}
 <div id="photo-photo-end"></div>
 <div id="photo-caption">{{$desc}}</div>
diff --git a/view/theme/diabook/theme.php b/view/theme/diabook/theme.php
index 1ec98e877a..faafb7537f 100644
--- a/view/theme/diabook/theme.php
+++ b/view/theme/diabook/theme.php
@@ -169,10 +169,10 @@ if ($color=="dark") $color_path = "/diabook-dark/";
 	$a->page['htmlhead'] .= '
 	<script>
 	 $(function() {
-		$("a.lightbox").fancybox(); // Select all links with lightbox class
-	 	$("a#twittersettings-link").fancybox({onClosed: function() { $("#twittersettings").attr("style","display: none;");}} );
-	   $("a#mapcontrol-link").fancybox({onClosed: function() { $("#mapcontrol").attr("style","display: none;");}} );
-	   $("a#closeicon").fancybox({onClosed: function() { $("#boxsettings").attr("style","display: none;");}} );
+		$("img.lightbox").colorbox({maxHeight:"90%"}); // Select all links with lightbox class
+	 	$("a#twittersettings-link").colorbox({inline:true,onClosed: function() { $("#twittersettings").attr("style","display: none;");}} );
+		$("a#mapcontrol-link").colorbox({inline:true,onClosed: function() { $("#mapcontrol").attr("style","display: none;");}} );
+		$("a#closeicon").colorbox({inline:true,onClosed: function() { $("#boxsettings").attr("style","display: none;");}} );
 	 	});
 
 	 $(window).load(function() {
diff --git a/view/theme/dispy/jot-header.tpl b/view/theme/dispy/jot-header.tpl
index 3974c11c9f..f4712f0bef 100644
--- a/view/theme/dispy/jot-header.tpl
+++ b/view/theme/dispy/jot-header.tpl
@@ -11,9 +11,9 @@ function initEditor(cb) {
 			$("#profile-jot-text").css({ 'height': 200, 'color': '#000' });
 			$("#profile-jot-text").contact_autocomplete(baseurl+"/acl");
 			editor = true;
-			$("a#jot-perms-icon").fancybox({
-				'transitionIn' : 'elastic',
-				'transitionOut' : 'elastic'
+			$("a#jot-perms-icon").colorbox({
+				'inline' : true,
+				'transition' : 'elastic'
 			});
 			$(".jothidden").show();
 			if (typeof cb!="undefined") cb();
@@ -102,9 +102,9 @@ function initEditor(cb) {
 		});
 		editor = true;
 		// setup acl popup
-		$("a#jot-perms-icon").fancybox({
-			'transitionIn' : 'elastic',
-			'transitionOut' : 'elastic'
+		$("a#jot-perms-icon").colorbox({
+			'inline' : true,
+			'transition' : 'elastic'
 		}); 
 	} else {
 		if (typeof cb!="undefined") cb();
@@ -268,7 +268,7 @@ function enableOnUser(){
 		var bordercolor = $("input").css("border-color");
 		
 		$.get('filer/', function(data){
-			$.fancybox(data);
+			$.colorbox({html:data});
 			$("#id_term").keypress(function(){
 				$(this).css("border-color",bordercolor);
 			})
@@ -286,7 +286,7 @@ function enableOnUser(){
 					if(timer) clearTimeout(timer);
 					timer = setTimeout(NavUpdate,3000);
 					liking = 1;
-					$.fancybox.close();
+					$.colorbox.close();
 				} else {
 					$("#id_term").css("border-color","#FF0000");
 				}
diff --git a/view/theme/dispy/photo_edit.tpl b/view/theme/dispy/photo_edit.tpl
index 9e623ba61d..ead8bc9207 100644
--- a/view/theme/dispy/photo_edit.tpl
+++ b/view/theme/dispy/photo_edit.tpl
@@ -46,8 +46,8 @@
 </form>
 
 <script type="text/javascript">
-	$("a#photo-edit-perms-menu").fancybox({
-		'transitionIn' : 'none',
-		'transitionOut' : 'none'
+	$("a#photo-edit-perms-menu").colorbox({
+		'inline' : true,
+		'transition' : 'none'
 	}); 
 </script>
diff --git a/view/theme/dispy/photo_view.tpl b/view/theme/dispy/photo_view.tpl
index a559583085..cab7dfb3fd 100644
--- a/view/theme/dispy/photo_view.tpl
+++ b/view/theme/dispy/photo_view.tpl
@@ -11,7 +11,8 @@
 </div>
 
 {{ if $prevlink }}<div id="photo-prev-link"><a href="$prevlink.0">$prevlink.1</a></div>{{ endif }}
-<div id="photo-photo"><a href="$photo.href" class="lightbox" title="$photo.title"><img src="$photo.src" /></a></div>
+{#<!--<div id="photo-photo"><a href="$photo.href" class="lightbox" title="$photo.title"><img src="$photo.src" /></a></div>-->#}
+<div id="photo-photo"><img href="$photo.href" class="lightbox" style="cursor:pointer;" src="$photo.src" /></div>
 {{ if $nextlink }}<div id="photo-next-link"><a href="$nextlink.0">$nextlink.1</a></div>{{ endif }}
 <div id="photo-photo-end"></div>
 <div id="photo-caption">$desc</div>
diff --git a/view/theme/dispy/smarty3/jot-header.tpl b/view/theme/dispy/smarty3/jot-header.tpl
index 00bf4dcb7b..4aafc2175d 100644
--- a/view/theme/dispy/smarty3/jot-header.tpl
+++ b/view/theme/dispy/smarty3/jot-header.tpl
@@ -16,9 +16,9 @@ function initEditor(cb) {
 			$("#profile-jot-text").css({ 'height': 200, 'color': '#000' });
 			$("#profile-jot-text").contact_autocomplete(baseurl+"/acl");
 			editor = true;
-			$("a#jot-perms-icon").fancybox({
-				'transitionIn' : 'elastic',
-				'transitionOut' : 'elastic'
+			$("a#jot-perms-icon").colorbox({
+				'inline' : true,
+				'transition' : 'elastic'
 			});
 			$(".jothidden").show();
 			if (typeof cb!="undefined") cb();
@@ -107,9 +107,9 @@ function initEditor(cb) {
 		});
 		editor = true;
 		// setup acl popup
-		$("a#jot-perms-icon").fancybox({
-			'transitionIn' : 'elastic',
-			'transitionOut' : 'elastic'
+		$("a#jot-perms-icon").colorbox({
+			'inline' : true,
+			'transition' : 'elastic'
 		}); 
 	} else {
 		if (typeof cb!="undefined") cb();
@@ -273,7 +273,7 @@ function enableOnUser(){
 		var bordercolor = $("input").css("border-color");
 		
 		$.get('filer/', function(data){
-			$.fancybox(data);
+			$.colorbox({html:data});
 			$("#id_term").keypress(function(){
 				$(this).css("border-color",bordercolor);
 			})
@@ -291,7 +291,7 @@ function enableOnUser(){
 					if(timer) clearTimeout(timer);
 					timer = setTimeout(NavUpdate,3000);
 					liking = 1;
-					$.fancybox.close();
+					$.colorbox.close();
 				} else {
 					$("#id_term").css("border-color","#FF0000");
 				}
diff --git a/view/theme/dispy/smarty3/photo_edit.tpl b/view/theme/dispy/smarty3/photo_edit.tpl
index 3a3dcaca76..b9a92fda81 100644
--- a/view/theme/dispy/smarty3/photo_edit.tpl
+++ b/view/theme/dispy/smarty3/photo_edit.tpl
@@ -51,8 +51,8 @@
 </form>
 
 <script type="text/javascript">
-	$("a#photo-edit-perms-menu").fancybox({
-		'transitionIn' : 'none',
-		'transitionOut' : 'none'
+	$("a#photo-edit-perms-menu").colorbox({
+		'inline' : true,
+		'transition' : 'none'
 	}); 
 </script>
diff --git a/view/theme/dispy/smarty3/photo_view.tpl b/view/theme/dispy/smarty3/photo_view.tpl
index cfc8868edf..027cc8fb9d 100644
--- a/view/theme/dispy/smarty3/photo_view.tpl
+++ b/view/theme/dispy/smarty3/photo_view.tpl
@@ -16,7 +16,8 @@
 </div>
 
 {{if $prevlink}}<div id="photo-prev-link"><a href="{{$prevlink.0}}">{{$prevlink.1}}</a></div>{{/if}}
-<div id="photo-photo"><a href="{{$photo.href}}" class="lightbox" title="{{$photo.title}}"><img src="{{$photo.src}}" /></a></div>
+{{*<!--<div id="photo-photo"><a href="{{$photo.href}}" class="lightbox" title="{{$photo.title}}"><img src="{{$photo.src}}" /></a></div>-->*}}
+<div id="photo-photo"><img href="{{$photo.href}}" class="lightbox" style="cursor:pointer;" src="{{$photo.src}}" /></div>
 {{if $nextlink}}<div id="photo-next-link"><a href="{{$nextlink.0}}">{{$nextlink.1}}</a></div>{{/if}}
 <div id="photo-photo-end"></div>
 <div id="photo-caption">{{$desc}}</div>
diff --git a/view/theme/dispy/theme.php b/view/theme/dispy/theme.php
index d0b7e19d76..2eb104ae1e 100644
--- a/view/theme/dispy/theme.php
+++ b/view/theme/dispy/theme.php
@@ -52,7 +52,7 @@ function dispy_init(&$a) {
 	<script type="text/javascript">
 	$(document).ready(function() {
 		// Select all links with lightbox class
-		$("a.lightbox").fancybox();
+		$("img.lightbox").colorbox({maxHeight:"90%"});
 
     	$('.group-edit-icon').hover(
 			function() {
diff --git a/view/theme/slackr/events_reminder.tpl b/view/theme/slackr/events_reminder.tpl
index bd1a57d18d..93c493432a 100644
--- a/view/theme/slackr/events_reminder.tpl
+++ b/view/theme/slackr/events_reminder.tpl
@@ -10,7 +10,7 @@
 		$.get(
 			'$baseurl/events/?id='+eventid,
 			function(data){
-				$.fancybox(data);
+				$.colorbox({html:data});
 			}
 		);			
 	}
diff --git a/view/theme/slackr/smarty3/events_reminder.tpl b/view/theme/slackr/smarty3/events_reminder.tpl
index 5bac584219..0f699a3022 100644
--- a/view/theme/slackr/smarty3/events_reminder.tpl
+++ b/view/theme/slackr/smarty3/events_reminder.tpl
@@ -15,7 +15,7 @@
 		$.get(
 			'{{$baseurl}}/events/?id='+eventid,
 			function(data){
-				$.fancybox(data);
+				$.colorbox({html:data});
 			}
 		);			
 	}