Skip to content
This repository
Browse code

v2.0.2

  • Loading branch information...
commit bc64828d636abbe5a447a42e9f53a61127e329d4 1 parent aed586f
authored August 19, 2011
20  README.md
Source Rendered
@@ -11,9 +11,21 @@ PhotoSwipe also runs on the desktop and has been tested on Chrome, Firefox, Safa
11 11
 
12 12
 
13 13
 
14  
-Latest Release v2.0.1
  14
+Latest Release v2.0.2
15 15
 ---------------------
16  
-[Download](http://github.com/downloads/codecomputerlove/PhotoSwipe/code.photoswipe-2.0.1.zip)
  16
+[Download](http://github.com/downloads/codecomputerlove/PhotoSwipe/code.photoswipe-2.0.2.zip)
  17
+
  18
+**Changes for 2.0.2**
  19
+
  20
+- You can now give your PhotoSwipe instances your own string identifiers (IDs)
  21
+
  22
+- **IMPORTANT** Re-written the jQuery Mobile demos so that they are now based on PhotoSwipe instance IDs. If you are implementing PhotoSwipe v2 into jQuery Mobile, please check the supplied examples
  23
+
  24
+- Fixed back button issue with jQuery Mobile demo
  25
+
  26
+
  27
+
  28
+**Important notes about v2**
17 29
 
18 30
 This is a brand new version of PhotoSwipe re-written from the ground up. Unfortunately, to cram in all the great new features, this has meant that how you implement PhotoSwipe had to be modified. I've kept configuration settings etc as close to v1 where possible.
19 31
 
@@ -106,7 +118,7 @@ Getting Started - Default Distribution
106 118
 
107 119
 See "examples/01-default.html". 
108 120
 
109  
-This example assumes no jQuery at all and is heavily optimised for WebKit and Mozilla browsers. PhotoSwipe.attach takes two parameters, an array of HTML elements and optional options.
  121
+This example assumes no jQuery at all and is heavily optimised for WebKit and Mozilla browsers. PhotoSwipe.attach takes three parameters, an array of HTML elements, optional options and optional instance ID string.
110 122
 
111 123
 	// Set up PhotoSwipe with all anchor tags in the Gallery container 
112 124
 	document.addEventListener('DOMContentLoaded', function(){
@@ -123,7 +135,7 @@ PhotoSwipe can be initiated without being attached to HTML elements. See "exampl
123 135
 Getting Started - Default Distribution (with jQuery engine)
124 136
 -----------------------------------------------------------
125 137
 
126  
-See "examples/02-jquery.html". 
  138
+See "examples/02-jquery.html". The plugin takes two parameters both of which optional; an options objectand an instance ID string.
127 139
 
128 140
 	// Set up PhotoSwipe with all anchor tags in the Gallery container 
129 141
 	$(document).ready(function(){
2  build.properties
@@ -5,7 +5,7 @@
5 5
 project.description = PhotoSwipe
6 6
 project.src.dir = src
7 7
 
8  
-project.build.version = 2.0.1
  8
+project.build.version = 2.0.2
9 9
 project.build.year = 2011
10 10
 
11 11
 project.build.workdir = work
23  src/change.log
... ...
@@ -0,0 +1,23 @@
  1
+2.0.0 17.08.11 - Ste Brennan
  2
+----------------------------
  3
+Initial release
  4
+
  5
+
  6
+2.0.1 18.08.11 - Ste Brennan
  7
+----------------------------
  8
+
  9
+- Fixed issue with example "07-custom-toolbar.html"
  10
+ 
  11
+- New event "onToolbarTap"
  12
+
  13
+- Fixed issue with the cache which on certain occassions would lead to images not loading or reloading
  14
+
  15
+
  16
+2.0.1 19.08.11 - Ste Brennan
  17
+----------------------------
  18
+
  19
+- You can now give your PhotoSwipe instances IDs
  20
+
  21
+- Re-written how the jQuery Mobile demo so that it is now based on PhotoSwipe instance IDs
  22
+
  23
+- Fixed back button issue with jQuery Mobile demo
12  src/code.photoswipe/photoswipe.class.js
@@ -13,6 +13,7 @@
13 13
 		
14 14
 		
15 15
 		
  16
+		id: null,
16 17
 		settings: null,
17 18
 		isBackEventSupported: null,
18 19
 		backButtonClicked: null,
@@ -109,8 +110,15 @@
109 110
 		/*
110 111
 		 * Function: initialize
111 112
 		 */
112  
-		initialize: function(images, options){
113  
-		
  113
+		initialize: function(images, options, id){
  114
+			
  115
+			if (Util.isNothing(id)){
  116
+				this.id = 'PhotoSwipe' + new Date().getTime().toString();
  117
+			}
  118
+			else{
  119
+				this.id = id;
  120
+			}
  121
+			
114 122
 			this.originalImages = images;
115 123
 			
116 124
 			if (Util.Browser.isAndroid){
32  src/code.photoswipe/photoswipe.js
@@ -72,11 +72,11 @@
72 72
 	/*
73 73
 	 * Function: Code.PhotoSwipe.attach
74 74
 	 */
75  
-	PhotoSwipe.attach = function(images, options){
  75
+	PhotoSwipe.attach = function(images, options, id){
76 76
 		
77 77
 		var i, instance, image;
78 78
 		
79  
-		instance = PhotoSwipe.createInstance(images, options);
  79
+		instance = PhotoSwipe.createInstance(images, options, id);
80 80
 		
81 81
 		// Add click event handlers if applicable
82 82
 		for (i=0; i<images.length; i++){
@@ -104,11 +104,9 @@
104 104
 	 */
105 105
 	if (window.jQuery){
106 106
 		
107  
-		window.jQuery.fn.photoSwipe = function(options){
  107
+		window.jQuery.fn.photoSwipe = function(options, id){
108 108
 		
109  
-			options = Util.coalesce(options, { });
110  
-			
111  
-			return PhotoSwipe.attach(this, options);
  109
+			return PhotoSwipe.attach(this, options, id);
112 110
 			
113 111
 		};
114 112
 		
@@ -147,7 +145,7 @@
147 145
 	/*
148 146
 	 * Function: Code.PhotoSwipe.createInstance
149 147
 	 */
150  
-	PhotoSwipe.createInstance = function(images, options){
  148
+	PhotoSwipe.createInstance = function(images, options, id){
151 149
 		
152 150
 		var i, instance, image;
153 151
 		
@@ -163,15 +161,17 @@
163 161
 			throw 'Code.PhotoSwipe.createInstance: No images to passed.';
164 162
 		}
165 163
 		
166  
-		instance = PhotoSwipe.getInstance(images);
167  
-		
168  
-		if (!Util.isNothing(instance)){
169  
-			throw 'Code.PhotoSwipe.createInstance: This set of images is already associated with a PhotoSwipe instance.';
170  
-		}
  164
+		options = Util.coalesce(options, { });
171 165
 		
172  
-		instance = new PhotoSwipe.PhotoSwipeClass(images, options);
  166
+		instance = PhotoSwipe.getInstance(id);
173 167
 		
174  
-		PhotoSwipe.instances.push(instance);
  168
+		if (Util.isNothing(instance)){
  169
+			instance = new PhotoSwipe.PhotoSwipeClass(images, options, id);
  170
+			PhotoSwipe.instances.push(instance);
  171
+		}
  172
+		else{
  173
+			throw 'Code.PhotoSwipe.createInstance: Instance with id "' + id +' already exists."';
  174
+		}
175 175
 		
176 176
 		return instance;
177 177
 	
@@ -215,14 +215,14 @@
215 215
 	/*
216 216
 	 * Function: Code.PhotoSwipe.getInstance
217 217
 	 */
218  
-	PhotoSwipe.getInstance = function(images){
  218
+	PhotoSwipe.getInstance = function(id){
219 219
 		
220 220
 		var i, instance;
221 221
 		
222 222
 		for (i=0; i<PhotoSwipe.instances.length; i++){
223 223
 			
224 224
 			instance = PhotoSwipe.instances[i];
225  
-			if (instance.originalImages === images){
  225
+			if (instance.id === id){
226 226
 				return instance;
227 227
 			}
228 228
 			
24  src/examples/04-jquery-mobile.html
@@ -26,18 +26,26 @@
26 26
 			
27 27
 			$(document).ready(function(){
28 28
 				
29  
-				var 
30  
-					currentInstance,
31  
-					options = {};
32 29
 				
33 30
 				$('div.gallery-page').live('pageshow', function(e){
34 31
 						
35  
-					// Re-initialize with the photos for the current page
36  
-					if (currentInstance){
37  
-						PhotoSwipe.detatch(currentInstance);
38  
-						currentInstance = null;
  32
+					// See if there is a PhotoSwipe instance associated with the page.
  33
+					// For this demo I've assumed one page has one instance and the ID 
  34
+					// for each instance is the same as the page ID.
  35
+					//
  36
+					// Of course, it's up to you how many instances per page and what
  37
+					// ID naming convention you use!
  38
+					var 
  39
+						currentPage = $(e.target),
  40
+						photoSwipeInstanceId = currentPage.attr('id'),
  41
+						photoSwipeInstance = PhotoSwipe.getInstance(photoSwipeInstanceId)
  42
+						options = {};
  43
+					
  44
+					if (typeof photoSwipeInstance === "undefined" || photoSwipeInstance === null) {
  45
+						console.log('creating');
  46
+						photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options, photoSwipeInstanceId);
39 47
 					}
40  
-					currentInstance = $("ul.gallery a", e.target).photoSwipe(options);
  48
+					
41 49
 					return true;
42 50
 					
43 51
 				})
24  src/examples/05-jquery-mobile-ajax.html
@@ -26,18 +26,26 @@
26 26
 			
27 27
 			$(document).ready(function(){
28 28
 				
29  
-				var 
30  
-					currentInstance,
31  
-					options = {};
32 29
 				
33 30
 				$('div.gallery-page').live('pageshow', function(e){
34 31
 						
35  
-					// Re-initialize with the photos for the current page
36  
-					if (currentInstance){
37  
-						PhotoSwipe.detatch(currentInstance);
38  
-						currentInstance = null;
  32
+					// See if there is a PhotoSwipe instance associated with the page.
  33
+					// For this demo I've assumed one page has one instance and the ID 
  34
+					// for each instance is the same as the page ID.
  35
+					//
  36
+					// Of course, it's up to you how many instances per page and what
  37
+					// ID naming convention you use!
  38
+					var 
  39
+						currentPage = $(e.target),
  40
+						photoSwipeInstanceId = currentPage.attr('id'),
  41
+						photoSwipeInstance = PhotoSwipe.getInstance(photoSwipeInstanceId)
  42
+						options = {};
  43
+					
  44
+					if (typeof photoSwipeInstance === "undefined" || photoSwipeInstance === null) {
  45
+						console.log('creating');
  46
+						photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options, photoSwipeInstanceId);
39 47
 					}
40  
-					currentInstance = $("ul.gallery a", e.target).photoSwipe(options);
  48
+					
41 49
 					return true;
42 50
 					
43 51
 				})
26  src/examples/debug-jquery-mobile.html
@@ -52,19 +52,26 @@
52 52
 			
53 53
 			$(document).ready(function(){
54 54
 				
55  
-				var 
56  
-					currentInstance,
57  
-					options = {};
58 55
 				
59 56
 				$('div.gallery-page').live('pageshow', function(e){
60 57
 						
61  
-					// Re-initialize with the photos for the current page
62  
-					if (currentInstance){
63  
-						PhotoSwipe.detatch(currentInstance);
64  
-						currentInstance = null;
65  
-						console.log(currentInstance);
  58
+					// See if there is a PhotoSwipe instance associated with the page.
  59
+					// For this demo I've assumed one page has one instance and the ID 
  60
+					// for each instance is the same as the page ID.
  61
+					//
  62
+					// Of course, it's up to you how many instances per page and what
  63
+					// ID naming convention you use!
  64
+					var 
  65
+						currentPage = $(e.target),
  66
+						photoSwipeInstanceId = currentPage.attr('id'),
  67
+						photoSwipeInstance = PhotoSwipe.getInstance(photoSwipeInstanceId)
  68
+						options = {};
  69
+					
  70
+					if (typeof photoSwipeInstance === "undefined" || photoSwipeInstance === null) {
  71
+						console.log('creating');
  72
+						photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options, photoSwipeInstanceId);
66 73
 					}
67  
-					currentInstance = $("ul.gallery a", e.target).photoSwipe(options);
  74
+					
68 75
 					return true;
69 76
 					
70 77
 				})
@@ -73,6 +80,7 @@
73 80
 		
74 81
 		}(window, window.jQuery, window.Code.PhotoSwipe));
75 82
 		
  83
+		
76 84
 	</script>
77 85
 	
78 86
 </head>
4  src/version.header.txt
... ...
@@ -0,0 +1,4 @@
  1
+// PhotoSwipe - http://www.photoswipe.com/
  2
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
  3
+// Licensed under the MIT license
  4
+// version: %%version%%

0 notes on commit bc64828

Please sign in to comment.
Something went wrong with that request. Please try again.