Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Commit for 1.0.2

  • Loading branch information...
commit 9304a7a9acd19022bd03c0952d6a99df236e488d 1 parent 85bce94
Code Computerlove authored
View
17 README.md
@@ -73,6 +73,13 @@ See "examples/index.html".
This example assumes no jQuery at all and is heavily optimised for WebKit and Mozilla browsers.
+ // Set up PhotoSwipe with all anchor tags in the Gallery container
+ document.addEventListener('DOMContentLoaded', function(){
+
+ Code.photoSwipe('a', '#Gallery');
+
+ }, false);
+
Getting Started - Default Distribution (with jQuery plugin)
-----------------------------------------------------------
@@ -81,6 +88,12 @@ See "examples/jquery-plugin.html".
This example assumes you want to use the convience of jQuery for initiating the gallery, but still the optimised engine for WebKit and Mozilla browsers.
+ $(document).ready(function(){
+
+ $("#Gallery a").photoSwipe();
+
+ });
+
Getting Started - Default Distribution (with jQuery engine)
-----------------------------------------------------------
@@ -103,10 +116,12 @@ Options
- **loop**: Whether the gallery auto-loops back to the beginning when you reach the end. Default "true"
-- **slideshowDelay**: The delay between showing the next image when in slideshow mode . Default "3000"
+- **slideshowDelay**: The delay between showing the next image when in slideshow mode. Default "3000"
- **imageScaleMethod**: How images will fit onto the screen. Either "fit" or "zoom". "fit" ensures the image always fits the screen. "zoom" the image will always fill the full screen, this may cause the image to be "zoomed" in and cropped. Default "fit"
+- **preventHide**: Once PhotoSwipe is active, prevents the user closing it. Useful for "exclusive mode" (see examples/exclusive-mode.html). Default: "false"
+
- **captionAndToolbarHide**: Hide the caption and toolbar. Default "false"
- **captionAndToolbarHideOnSwipe**: Hide the caption and toolbar when you swipe to the next image. Default "true"
View
3  build.properties
@@ -5,7 +5,8 @@
project.description = PhotoSwipe
project.src.dir = src
-project.build.version = 1.0.1
+project.build.version = 1.0.2
+project.build.year = 2011
project.build.workdir = work
project.build.artifactdir = release
View
41 build.xml
@@ -55,7 +55,11 @@
<fileset dir="." includes="${project.src.dir}/photoswipe.js" />
</concat>
-
+
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/code-photoswipe${engine}-${project.build.version}.js"/>
+ </antcall>
+
<!-- Minimise -->
<jsmin srcfile="${project.build.workdir}/code-photoswipe${engine}-${project.build.version}.js" suffix="true" />
@@ -65,7 +69,9 @@
<fileset dir="." includes="${project.build.workdir}/code-photoswipe${engine}-${project.build.version}.min.js" />
</concat>
- <replace file="${project.build.workdir}/code-photoswipe${engine}-${project.build.version}.min2.js" token="%%version%%" value="${project.build.version}.${build.number}"/>
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/code-photoswipe${engine}-${project.build.version}.min2.js"/>
+ </antcall>
<delete file="${project.build.workdir}/code-photoswipe${engine}-${project.build.version}.min.js"/>
@@ -76,11 +82,25 @@
<fileset dir="${project.src.dir}/examples"/>
</copy>
- <replace file="${project.build.workdir}/examples/index.html" token="%%version%%" value="${project.build.version}"/>
- <replace file="${project.build.workdir}/examples/jquery-plugin.html" token="%%version%%" value="${project.build.version}"/>
- <replace file="${project.build.workdir}/examples/jquery-engine.html" token="%%version%%" value="${project.build.version}"/>
- <replace file="${project.build.workdir}/examples/advanced-setup.html" token="%%version%%" value="${project.build.version}"/>
-
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/examples/index.html"/>
+ </antcall>
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/examples/jquery-plugin.html"/>
+ </antcall>
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/examples/jquery-engine.html"/>
+ </antcall>
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/examples/advanced-setup.html"/>
+ </antcall>
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/examples/events.html"/>
+ </antcall>
+ <antcall target="versionStamp">
+ <param name="filePath" value="${project.build.workdir}/examples/exclusive-mode.html"/>
+ </antcall>
+
</target>
@@ -108,6 +128,13 @@
</target>
+ <target name="versionStamp">
+
+ <replace file="${filePath}" token="%%version%%" value="${project.build.version}"/>
+ <replace file="${filePath}" token="%%year%%" value="${project.build.year}"/>
+
+ </target>
+
<target name="moveToArtifact">
View
7 src/caption-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util){
@@ -27,7 +28,7 @@
Util.extend(this.settings, options);
- this._super(options);
+ this._super(this.settings);
this.captionValue = '';
@@ -156,4 +157,4 @@
content: 'ps-caption-content'
};
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
11 src/caption-toolbar-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util, CaptionClass, ToolbarClass){
@@ -33,7 +34,8 @@
fadeOutSpeed: 500,
autoHideDelay: 5000,
flipPosition: false,
- showEmptyCaptions: true
+ showEmptyCaptions: true,
+ hideClose: false
};
Util.extend(this.settings, options);
@@ -56,7 +58,8 @@
fadeInSpeed: this.settings.fadeInSpeed,
fadeOutSpeed: this.settings.fadeOutSpeed,
opacity: this.settings.opacity,
- position: (this.settings.flipPosition) ? 'top' : 'bottom'
+ position: (this.settings.flipPosition) ? 'top' : 'bottom',
+ hideClose: this.settings.hideClose
});
},
@@ -328,4 +331,4 @@
});
-})(Code.PhotoSwipe.Util, Code.PhotoSwipe.CaptionClass, Code.PhotoSwipe.ToolbarClass);
+})(Code.PhotoSwipe.Util, Code.PhotoSwipe.CaptionClass, Code.PhotoSwipe.ToolbarClass);
View
27 src/change.log
@@ -1,10 +1,10 @@
-1.0.0 07.04.11
---------------
-Initial release by Ste Brennan
+1.0.0 07.04.11 - Ste Brennan
+----------------------------
+Initial release
-1.0.1 11.04.11
---------------
+1.0.1 11.04.11 - Ste Brennan
+----------------------------
Major update:
- Fading of caption and toolbar more like iOS photo view by default.
@@ -18,3 +18,20 @@ Major update:
- Fixed issue with placement of caption if at the bottom
+
+1.0.2 14.04.11 - Ste Brennan
+----------------------------
+
+- PhotoSwipe now dispatches the following events which you can listen out for in your code (see examples/events.html)
+ * onShow: When the gallery is displayed
+ * onHide: When the gallery is hidden
+ * onShowNext: When the gallery has been issued the command to show the next image
+ * onShowPrevious: When the gallery has been issued the command to show the previous image
+ * onDisplayImage: When the gallery displays an image. Typically fired after onShowNext and onShowPrevious
+ * onResetPosition: When the gallery resets the size and position of itself. Typically fired after device orientation change or window resize
+ * onSlideshowStart: When the gallery has started the slideshow
+ * onSlideshowStop: When the gallery has stopped the slideshow
+
+- Added "exclusive mode". This means the user will only be able to interact with PhotoSwipe, and not the underlying document. They will be unable to close PhotoSwipe once it is active. (see examples/exclusive-mode.html)
+
+- Fixed Issue #1 - Line break in thumbnail anchor can cause a JS error
View
5 src/document-overlay-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util){
@@ -47,4 +48,4 @@
documentOverlay: 'ps-document-overlay'
};
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
5 src/element-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function (Util) {
@@ -294,4 +295,4 @@
};
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
5 src/event-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function () {
@@ -62,4 +63,4 @@
});
-})();
+})();
View
86 src/examples/debug.html
@@ -29,7 +29,65 @@
// Set up PhotoSwipe with all anchor tags in the Gallery container
document.addEventListener('DOMContentLoaded', function(){
- Code.photoSwipe('a', '#Gallery', {
+ // Add event listeners
+
+ // onShow
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShow, function(e){
+
+ console.log('onShow');
+
+ });
+
+ // onHide
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onHide, function(e){
+
+ console.log('onHide');
+
+ });
+
+ // onShowNext
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShowNext, function(e){
+
+ console.log('onShowNext');
+
+ });
+
+ // onShowPrevious
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShowPrevious, function(e){
+
+ console.log('onShowPrevious');
+
+ });
+
+ // onDisplayImage
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onDisplayImage, function(e){
+
+ console.log('onDisplayImage');
+
+ });
+
+ // onResetPosition
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onResetPosition, function(e){
+
+ console.log('onResetPosition');
+
+ });
+
+ // onSlideshowStart
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onSlideshowStart, function(e){
+
+ console.log('onSlideshowStart');
+
+ });
+
+ // onSlideshowStop
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onSlideshowStop, function(e){
+
+ console.log('onSlideshowStop');
+
+ });
+
+ var thumbEls = Code.photoSwipe('a', '#Gallery', {
getImageSource: Code.PhotoSwipe.GetImageSource,
getImageCaption: Code.PhotoSwipe.GetImageCaption,
@@ -40,6 +98,7 @@
loop: true,
slideshowDelay: 3000,
imageScaleMethod: 'fit', // Either "fit" or "zoom"
+ preventHide: false,
captionAndToolbarHide: false,
captionAndToolbarHideOnSwipe: true,
@@ -50,7 +109,8 @@
});
-
+ console.log(thumbEls);
+
}, false);
@@ -102,11 +162,23 @@
<div class="gallery-row">
- <div class="gallery-item"><a href="images/full/001.jpg"><img src="images/thumb/001.jpg" alt="Image 001" /></a></div>
-
- <div class="gallery-item"><a href="images/full/002.jpg"><img src="images/thumb/002.jpg" alt="Image 002" /></a></div>
-
- <div class="gallery-item"><a href="images/full/003.jpg"><img src="images/thumb/003.jpg" alt="" /></a></div>
+ <div class="gallery-item">
+ <a href="images/full/001.jpg">
+ <img src="images/thumb/001.jpg" alt="Image 001" />
+ </a>
+ </div>
+
+ <div class="gallery-item">
+ <a href="images/full/002.jpg">
+ <img src="images/thumb/002.jpg" alt="Image 002" />
+ </a>
+ </div>
+
+ <div class="gallery-item">
+ <a href="images/full/003.jpg">
+ <img src="images/thumb/003.jpg" alt="" />
+ </a>
+ </div>
</div>
View
183 src/examples/events.html
@@ -0,0 +1,183 @@
+<!DOCTYPE html><html>
+<head>
+ <title>PhotoSwipe</title>
+ <meta name="author" content="Code Computerlove - http://www.codecomputerlove.com/" />
+ <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
+ <link href="styles.css" type="text/css" rel="stylesheet" />
+
+ <link href="../photoswipe.css" type="text/css" rel="stylesheet" />
+
+ <script type="text/javascript" src="../lib/simple-inheritance.min.js"></script>
+ <script type="text/javascript" src="../code-photoswipe-%%version%%.min.js"></script>
+
+
+ <script type="text/javascript">
+
+ /*
+ This example shows how to listen and respond to gallery events.
+
+ - onShow: When the gallery is displayed
+ - onHide: When the gallery is hidden
+ - onShowNext: When the gallery has been issued the command to show the next image
+ - onShowPrevious: When the gallery has been issued the command to show the previous image
+ - onDisplayImage: When the gallery displays an image. Typically fired after onShowNext and onShowPrevious
+ - onResetPosition: When the gallery resets the size and position of itself. Typically fired after device orientation change or window resize
+ - onSlideshowStart: When the gallery has started the slideshow
+ - onSlideshowStop: When the gallery has stopped the slideshow
+
+ */
+
+ document.addEventListener('DOMContentLoaded', function(){
+
+
+ // onShow
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShow, function(e){
+
+ console.log('onShow');
+
+ });
+
+ // onHide
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onHide, function(e){
+
+ console.log('onHide');
+
+ });
+
+ // onShowNext
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShowNext, function(e){
+
+ console.log('onShowNext');
+
+ });
+
+ // onShowPrevious
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onShowPrevious, function(e){
+
+ console.log('onShowPrevious');
+
+ });
+
+ // onDisplayImage
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onDisplayImage, function(e){
+
+ console.log('onDisplayImage');
+
+ });
+
+ // onResetPosition
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onResetPosition, function(e){
+
+ console.log('onResetPosition');
+
+ });
+
+ // onSlideshowStart
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onSlideshowStart, function(e){
+
+ console.log('onSlideshowStart');
+
+ });
+
+ // onSlideshowStop
+ Code.PhotoSwipe.Current.addEventListener(Code.PhotoSwipe.EventTypes.onSlideshowStop, function(e){
+
+ console.log('onSlideshowStop');
+
+ });
+
+
+ Code.photoSwipe('a', '#Gallery');
+
+ }, false);
+
+
+
+ </script>
+
+</head>
+<body>
+
+<div id="Header">
+ <a href="http://www.codecomputerlove.com"><img src="images/codecomputerlovelogo.gif" width="230" height="48" alt="Code Computerlove" /></a>
+</div>
+
+<div id="MainContent">
+
+ <div class="page-content">
+ <h1>PhotoSwipe</h1>
+ </div>
+
+
+ <div id="Gallery">
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/001.jpg"><img src="images/thumb/001.jpg" alt="Image 001" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/002.jpg"><img src="images/thumb/002.jpg" alt="Image 002" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/003.jpg"><img src="images/thumb/003.jpg" alt="" /></a></div>
+
+ </div>
+
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/004.jpg"><img src="images/thumb/004.jpg" alt="Image 004" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/005.jpg"><img src="images/thumb/005.jpg" alt="Image 005" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/006.jpg"><img src="images/thumb/006.jpg" alt="Image 006" /></a></div>
+
+ </div>
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/007.jpg"><img src="images/thumb/007.jpg" alt="Image 007" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/008.jpg"><img src="images/thumb/008.jpg" alt="Image 008" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/009.jpg"><img src="images/thumb/009.jpg" alt="Image 009" /></a></div>
+
+ </div>
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/010.jpg"><img src="images/thumb/010.jpg" alt="Image 010" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/011.jpg"><img src="images/thumb/011.jpg" alt="Image 011" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/012.jpg"><img src="images/thumb/012.jpg" alt="Image 012" /></a></div>
+
+ </div>
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/013.jpg"><img src="images/thumb/013.jpg" alt="Image 013" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/014.jpg"><img src="images/thumb/014.jpg" alt="Image 014" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/015.jpg"><img src="images/thumb/015.jpg" alt="Image 015" /></a></div>
+
+ </div>
+
+ </div>
+
+
+</div>
+
+
+<div id="Footer">
+ <p><small>&copy; 2011 Code Computerlove Ltd - new media agency / digital marketing agency</small></p>
+
+ <div id="SocialLinks">
+ <a href="http://blog.codecomputerlove.com/"><img src="images/blogicon.png" width="32" height="32" alt="Blog" /></a>
+ <a href="http://www.twitter.com/computerlovers"><img src="images/twittericon.png" width="32" height="32" alt="Twitter" /></a>
+ <a href="http://www.facebook.com/CodeComputerlove"><img src="images/facebookicon.png" width="32" height="32" alt="Facebook" /></a>
+ <a href="http://www.flickr.com/photos/codecomputerlove"><img src="images/flickricon.png" width="32" height="32" alt="Flickr" /></a>
+</div>
+</div>
+
+</body>
+</html>
View
137 src/examples/exclusive-mode.html
@@ -0,0 +1,137 @@
+<!DOCTYPE html><html>
+<head>
+ <title>PhotoSwipe</title>
+ <meta name="author" content="Code Computerlove - http://www.codecomputerlove.com/" />
+ <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
+ <link href="styles.css" type="text/css" rel="stylesheet" />
+
+ <link href="../photoswipe.css" type="text/css" rel="stylesheet" />
+
+ <script type="text/javascript" src="../lib/simple-inheritance.min.js"></script>
+ <script type="text/javascript" src="../code-photoswipe-%%version%%.min.js"></script>
+
+
+ <script type="text/javascript">
+
+ /*
+ This example shows how to set up PhotoSwipe and run in "exclusive" mode.
+
+ This means the user will only be able to interact with PhotoSwipe, and not
+ the underlying document. They will be unable to close PhotoSwipe once it
+ is active.
+
+ */
+
+ document.addEventListener('DOMContentLoaded', function(){
+
+ // Set up PhotoSwipe, setting "preventHide: true"
+ var thumbEls = Code.photoSwipe('a', '#Gallery', { preventHide: true });
+
+ // Trigger off a "click" of the first thumbnail
+ var clickEvt = document.createEvent("MouseEvents");
+ clickEvt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
+ thumbEls[0].dispatchEvent(clickEvt);
+
+ }, false);
+
+
+ </script>
+
+</head>
+<body>
+
+<div id="Header">
+ <a href="http://www.codecomputerlove.com"><img src="images/codecomputerlovelogo.gif" width="230" height="48" alt="Code Computerlove" /></a>
+</div>
+
+<div id="MainContent">
+
+ <div class="page-content">
+ <h1>PhotoSwipe</h1>
+ </div>
+
+
+ <div id="Gallery">
+
+ <div class="gallery-row">
+
+ <div class="gallery-item">
+ <a href="images/full/001.jpg">
+ <img src="images/thumb/001.jpg" alt="Image 001" />
+ </a>
+ </div>
+
+ <div class="gallery-item">
+ <a href="images/full/002.jpg">
+ <img src="images/thumb/002.jpg" alt="Image 002" />
+ </a>
+ </div>
+
+ <div class="gallery-item">
+ <a href="images/full/003.jpg">
+ <img src="images/thumb/003.jpg" alt="" />
+ </a>
+ </div>
+
+ </div>
+
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/004.jpg"><img src="images/thumb/004.jpg" alt="Image 004" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/005.jpg"><img src="images/thumb/005.jpg" alt="Image 005" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/006.jpg"><img src="images/thumb/006.jpg" alt="Image 006" /></a></div>
+
+ </div>
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/007.jpg"><img src="images/thumb/007.jpg" alt="Image 007" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/008.jpg"><img src="images/thumb/008.jpg" alt="Image 008" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/009.jpg"><img src="images/thumb/009.jpg" alt="Image 009" /></a></div>
+
+ </div>
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/010.jpg"><img src="images/thumb/010.jpg" alt="Image 010" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/011.jpg"><img src="images/thumb/011.jpg" alt="Image 011" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/012.jpg"><img src="images/thumb/012.jpg" alt="Image 012" /></a></div>
+
+ </div>
+
+ <div class="gallery-row">
+
+ <div class="gallery-item"><a href="images/full/013.jpg"><img src="images/thumb/013.jpg" alt="Image 013" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/014.jpg"><img src="images/thumb/014.jpg" alt="Image 014" /></a></div>
+
+ <div class="gallery-item"><a href="images/full/015.jpg"><img src="images/thumb/015.jpg" alt="Image 015" /></a></div>
+
+ </div>
+
+ </div>
+
+
+</div>
+
+
+<div id="Footer">
+ <p><small>&copy; 2011 Code Computerlove Ltd - new media agency / digital marketing agency</small></p>
+
+ <div id="SocialLinks">
+ <a href="http://blog.codecomputerlove.com/"><img src="images/blogicon.png" width="32" height="32" alt="Blog" /></a>
+ <a href="http://www.twitter.com/computerlovers"><img src="images/twittericon.png" width="32" height="32" alt="Twitter" /></a>
+ <a href="http://www.facebook.com/CodeComputerlove"><img src="images/facebookicon.png" width="32" height="32" alt="Facebook" /></a>
+ <a href="http://www.flickr.com/photos/codecomputerlove"><img src="images/flickricon.png" width="32" height="32" alt="Flickr" /></a>
+</div>
+</div>
+
+</body>
+</html>
View
24 src/examples/index.html
@@ -36,7 +36,7 @@
With options:
-------------
- Code.photoSwipe('a', '#Gallery', { loop: false, hideCaption: true } );
+ Code.photoSwipe('a', '#Gallery', { loop: false } );
Using preselected elements:
@@ -69,11 +69,23 @@
<div class="gallery-row">
- <div class="gallery-item"><a href="images/full/001.jpg"><img src="images/thumb/001.jpg" alt="Image 001" /></a></div>
-
- <div class="gallery-item"><a href="images/full/002.jpg"><img src="images/thumb/002.jpg" alt="Image 002" /></a></div>
-
- <div class="gallery-item"><a href="images/full/003.jpg"><img src="images/thumb/003.jpg" alt="" /></a></div>
+ <div class="gallery-item">
+ <a href="images/full/001.jpg">
+ <img src="images/thumb/001.jpg" alt="Image 001" />
+ </a>
+ </div>
+
+ <div class="gallery-item">
+ <a href="images/full/002.jpg">
+ <img src="images/thumb/002.jpg" alt="Image 002" />
+ </a>
+ </div>
+
+ <div class="gallery-item">
+ <a href="images/full/003.jpg">
+ <img src="images/thumb/003.jpg" alt="" />
+ </a>
+ </div>
</div>
View
3  src/examples/jquery-engine.html
@@ -32,8 +32,7 @@
To pass your own settings:
$("#Gallery a").photoSwipe({
- loop: false,
- captionDelay: 2000
+ loop: false
});
*/
View
3  src/examples/jquery-plugin.html
@@ -28,8 +28,7 @@
To pass your own settings:
$("#Gallery a").photoSwipe({
- loop: false,
- captionDelay: 2000
+ loop: false
});
*/
View
5 src/full-size-image-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util){
@@ -90,4 +91,4 @@
};
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
54 src/photoswipe.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util, ElementClass, DocumentOverlayClass, FullSizeImageClass, ViewportClass, SliderClass, CaptionClass, ToolbarClass, CaptionToolbarClass){
@@ -54,6 +55,7 @@
loop: true,
slideshowDelay: 3000,
imageScaleMethod: 'fit', // Either "fit" or "zoom"
+ preventHide: false,
captionAndToolbarHide: false,
captionAndToolbarHideOnSwipe: true,
@@ -213,7 +215,8 @@
fadeOutSpeed: this.settings.fadeOutSpeed,
autoHideDelay: this.settings.captionAndToolbarAutoHideDelay,
flipPosition: this.settings.captionAndToolbarFlipPosition,
- showEmptyCaptions: this.settings.captionAndToolbarShowEmptyCaptions
+ showEmptyCaptions: this.settings.captionAndToolbarShowEmptyCaptions,
+ hideClose: this.settings.preventHide
});
@@ -302,6 +305,8 @@
this.isBusy = false;
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onShow);
+
},
@@ -441,6 +446,8 @@
this.documentOverlay.resetPosition();
this.captionAndToolbar.resetPosition();
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onResetPosition);
+
},
@@ -489,6 +496,8 @@
this.isBusy = false;
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onHide);
+
},
@@ -498,7 +507,7 @@
*/
hide: function(){
- if (this.isBusy){
+ if (this.isBusy || this.settings.preventHide){
return;
}
@@ -534,7 +543,9 @@
this.setCaptionAndToolbarOnShowPreviousNext();
this.slider.showNext();
-
+
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onShowNext);
+
},
@@ -553,7 +564,9 @@
this.setCaptionAndToolbarOnShowPreviousNext();
this.slider.showPrevious();
-
+
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onShowPrevious);
+
},
@@ -663,6 +676,8 @@
}
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onDisplayImage);
+
}
this.lastShowPrevTrigger = '';
@@ -778,6 +793,8 @@
this.fireSlideshowTimeout();
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onSlideshowStart);
+
},
@@ -791,6 +808,8 @@
this.isSlideshowActive = false;
+ this.dispatchEvent(Code.PhotoSwipe.EventTypes.onSlideshowStop);
+
},
@@ -846,6 +865,20 @@
};
+ Code.PhotoSwipe.EventTypes = {
+
+ onShow: 'onShow',
+ onHide: 'onHide',
+ onShowNext: 'onShowNext',
+ onShowPrevious: 'onShowPrevious',
+ onDisplayImage: 'onDisplayImage',
+ onResetPosition: 'onResetPosition',
+ onSlideshowStart: 'onSlideshowStart',
+ onSlideshowStop: 'onSlideshowStop'
+
+ };
+
+
/*
* Function: Code.PhotoSwipe.GetImageSource
* Default method for returning an image's source
@@ -867,7 +900,13 @@
if (el.nodeName === "IMG"){
return Util.DOM.getAttribute(el, 'alt');
}
- return Util.DOM.getAttribute(el.firstChild, 'alt');
+ var i, childEl;
+ for (i=0; i<el.childNodes.length; i++){
+ childEl = el.childNodes[i];
+ if (el.childNodes[i].nodeName === 'IMG'){
+ return Util.DOM.getAttribute(childEl, 'alt');
+ }
+ }
};
@@ -992,6 +1031,7 @@
}
+ return thumbEls;
};
@@ -1033,4 +1073,4 @@
Code.PhotoSwipe.CaptionClass,
Code.PhotoSwipe.ToolbarClass,
Code.PhotoSwipe.CaptionToolbarClass
-);
+);
View
5 src/slider-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util, SliderItemClass){
@@ -377,4 +378,4 @@
};
-})(Code.PhotoSwipe.Util, Code.PhotoSwipe.SliderItemClass);
+})(Code.PhotoSwipe.Util, Code.PhotoSwipe.SliderItemClass);
View
5 src/slider-item-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util, FullSizeImageClass){
@@ -251,4 +252,4 @@
};
-})(Code.PhotoSwipe.Util, Code.PhotoSwipe.FullSizeImageClass);
+})(Code.PhotoSwipe.Util, Code.PhotoSwipe.FullSizeImageClass);
View
12 src/toolbar-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util){
@@ -27,12 +28,13 @@
init: function(options){
this.settings = {
- position: 'bottom'
+ position: 'bottom',
+ hideClose: false
};
Util.extend(this.settings, options);
- this._super(options);
+ this._super(this.settings);
this.isNextActive = true;
this.isPreviousActive = true;
@@ -60,6 +62,10 @@
// Close
this.closeEl = Util.DOM.createElement('div', { 'class': Code.PhotoSwipe.ToolbarClass.CssClasses.close }, '<div class="' + Code.PhotoSwipe.ToolbarClass.CssClasses.content + '"></div>');
+
+ if (this.settings.hideClose){
+ Util.DOM.hide(this.closeEl);
+ }
Util.DOM.appendChild(this.closeEl, this.el);
// Play
View
5 src/util-animation-jQuery.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function (Util) {
@@ -80,4 +81,4 @@
});
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
5 src/util-animation.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function (Util) {
@@ -289,4 +290,4 @@
});
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
5 src/util-dom-jQuery.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function (Util) {
@@ -381,4 +382,4 @@
});
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
5 src/util-dom.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function (Util) {
@@ -494,4 +495,4 @@
});
-})(Code.PhotoSwipe.Util);
+})(Code.PhotoSwipe.Util);
View
5 src/util.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function () {
@@ -226,4 +227,4 @@
};
-})();
+})();
View
2  src/version-header.txt
@@ -1,4 +1,4 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
// version: %%version%%
View
4 src/viewport-class.js
@@ -1,6 +1,7 @@
// PhotoSwipe - http://www.photoswipe.com/
-// Copyright (c) 2011 by Code Computerlove (http://www.codecomputerlove.com)
+// Copyright (c) %%year%% by Code Computerlove (http://www.codecomputerlove.com)
// Licensed under the MIT license
+// version: %%version%%
(function(Util){
@@ -279,4 +280,3 @@
})(Code.PhotoSwipe.Util);
-
Please sign in to comment.
Something went wrong with that request. Please try again.