diff --git a/css/style.css b/css/style.css
index b1c8ba0..a99ee81 100755
--- a/css/style.css
+++ b/css/style.css
@@ -147,6 +147,15 @@ button.gamma-btn-close:before {
content: '\2715';
}
+button.gamma-btn-view {
+ width: 130px;
+ display: none;
+}
+
+button.gamma-btn-view:before {
+ content: 'Full image';
+}
+
button.gamma-btn-ssplay:before {
content: '\25b6';
}
diff --git a/js/gamma.js b/js/gamma.js
index f399a0b..46a3a35 100644
--- a/js/gamma.js
+++ b/js/gamma.js
@@ -169,6 +169,10 @@ var Gamma = (function() {
overlayAnimated : true,
// if true, the navigate next function is called when the image (singleview) is clicked
nextOnClickImage : true,
+ // if true, then view the big image on click
+ viewBigOnClickImage: false,
+ // if true, then view the Full Image button
+ viewFullImageButton: false,
// circular navigation
circular : true,
// transition settings for the image in the single view.
@@ -256,12 +260,17 @@ var Gamma = (function() {
if( !Gamma.singleview ) {
- $( '
' )
+ $('')
.appendTo( Gamma.container );
Gamma.singleview = Gamma.container.children( 'div.gamma-single-view' );
- Gamma.svclose = Gamma.singleview.find( 'button.gamma-btn-close' );
+ Gamma.svclose = Gamma.singleview.find('button.gamma-btn-close');
+ if (Gamma.settings.viewFullImageButton) {
+ Gamma.fullImageButton = Gamma.singleview.find('button.gamma-btn-view');
+ Gamma.fullImageButton.css({ display: "block" });
+ }
+
_initEvents( 'singleview' );
_createSingleViewNavigation();
@@ -278,7 +287,7 @@ var Gamma = (function() {
if( Gamma.itemsCount > 1 ) {
- Gamma.svplay = $( '' ).insertAfter( Gamma.svclose );
+ Gamma.svplay = $( '' ).insertBefore( Gamma.svclose );
Gamma.nav = $( '' ).appendTo( Gamma.singleview );
Gamma.svnavnext = Gamma.nav.find( 'span.gamma-next' );
Gamma.svnavprev = Gamma.nav.find( 'span.gamma-prev' );
@@ -396,11 +405,12 @@ var Gamma = (function() {
// replace each div element with an image element with the right source
$items.each( function() {
- var $item = $( this ),
+ var $item = $(this),
$picEl = $item.children(),
sources = _getImgSources( $picEl ),
source = _chooseImgSource( sources, $item.outerWidth( true ) ),
- description = $picEl.data( 'description' );
+ description = $picEl.data( 'description' ),
+ url = $picEl.data("url");
// data is saved in the element
$item.data( {
@@ -410,14 +420,29 @@ var Gamma = (function() {
maxheight : $picEl.data( 'maxHeight' )
} );
- $( '' ).addClass( 'gamma-description' ).html( description ).insertAfter( $picEl );
-
- $( '
' ).attr( {
- alt : $picEl.data( 'alt' ),
- title : $picEl.data( 'title' ),
- src : source.src
- } ).insertAfter( $picEl );
+ var overlay = $('');
+ if (url != null) {
+ overlay.attr("href", url);
+ }
+ overlay.addClass('gamma-description').html(description).insertAfter($picEl);
+
+ var img = $('
').attr({
+ alt: $picEl.data('alt'),
+ title: $picEl.data('title'),
+ src: source.src
+ });
+
+ if (url != null) {
+ var anchor = $('');
+ img.appendTo(anchor);
+ anchor.insertAfter($picEl);
+ }
+ else
+ {
+ img.insertAfter($picEl);
+ }
+
$picEl.remove();
} );
@@ -475,7 +500,7 @@ var Gamma = (function() {
Gamma.gallery.masonry( {
itemSelector : 'li',
columnWidth : function( containerWidth ) {
- return containerWidth / Gamma.columns;
+ return containerWidth / Gamma.columns;
}
} );
@@ -747,7 +772,7 @@ var Gamma = (function() {
var id = $item.index(),
data = $item.data(),
- $img = $item.children( 'img' );
+ $img = $item.find( 'img' );
if( anim ) {
@@ -1247,6 +1272,13 @@ var Gamma = (function() {
Gamma.gallery.on( 'click.gamma', 'li', _singleview );
Gamma.svclose.on( 'click.gamma', _closesingleview );
+ if (Gamma.fullImageButton) {
+ Gamma.fullImageButton.on('click.gamma', function () {
+ var imageAddress = _getHighQualityImage($(Gamma.items[Gamma.current]).data().source).src || e.currentTarget.src;
+ window.location = imageAddress;
+ });
+ }
+
break;
case 'singleviewnavigation' :
@@ -1258,6 +1290,16 @@ var Gamma = (function() {
Gamma.singleview.on( 'click.gamma', 'img', function() { _onnavigate( 'next' ); } );
+ } else {
+
+ if (Gamma.settings.viewBigOnClickImage) {
+ Gamma.singleview.on('click.gamma', 'img', function (e) {
+ var imageAddress = _getHighQualityImage($(e.currentTarget).data().source).src || e.currentTarget.src;
+
+ window.location = imageAddress;
+ });
+ }
+
}
if ( Gamma.settings.keyboard ) {
@@ -1327,6 +1369,17 @@ var Gamma = (function() {
};
},
+ //get high resolution image
+ _getHighQualityImage = function (source) {
+
+ var result = source[0];
+ for (var i = 1 ; i < source.length ; i++) {
+ if (source[i].width > result.width)
+ result = source[i];
+ }
+ return result;
+
+ },
// sets a transition for an element
_setTransition = function( el , property, speed, easing ) {