Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Keyboard navigation not working properly #184

Open
randomd00d opened this issue Dec 21, 2017 · 0 comments
Open

Keyboard navigation not working properly #184

randomd00d opened this issue Dec 21, 2017 · 0 comments

Comments

@randomd00d
Copy link

randomd00d commented Dec 21, 2017

Keyboard shortcuts are turned on (!0). When I try to go to the next image, prettyPhoto simply reloads the same image.

I've done a bit of digging around, and logging responses. It would seem that the array pp_images which should store links for img elements is not being filled beyond the first such element found - this can be seen by inspecting the document, and removing display:none from .pp_nav while the lightbox is open.

I've tried to override a part of what prettyphoto is doing in the background, by disabling keyboard shortcuts, and using this hacky solution:

	$(document).ready(function() {
		var gallery = 'nothing';
		var arrLinks = [];
		var imgLink = '';
		var elemIndex;
		var heading = 0;
		$('a[class="prettyphoto"]').each(function() {
			imgLink = $(this).attr('href');
			if(imgLink) {
				arrLinks.push(imgLink);
			}
		});
		var arrLen = arrLinks.length;

		$('body').keyup(function(e) {
			e.preventDefault();
			var keyCode = e.keyCode || e.which;
			if(keyCode===37) {
				heading = -1;
			} else if(keyCode===39) {
				heading = 1;
			} else if(keyCode===27) {
				$(document).find('.pp_pic_holder').remove()
			}

			var prettyOpen = $('.pp_pic_holder');
			if(prettyOpen[0]) {
				console.log(arrLen);
				console.log(prettyOpen[0]);
				imgLink = $('#fullResImage').attr('src');
				elemIndex = arrLinks.indexOf(imgLink);
				replacePhoto(elemIndex,heading,arrLinks,arrLen);
			}
		});

		function replacePhoto(elemIndex,heading,arrLinks,arrLen) {
			var newIndex = arrLinks[elemIndex+heading];
			if(newIndex===0 && heading==-1) {
				newIndex = arrLen - 1;
			} else if(newIndex==arrLen) {
				newIndex = 0;
			}
			$('#fullResImage').attr('src',newIndex);
			console.log($('#fullResImage').attr('src'));
		}
	});

Unfortunately, this doesn't work. The logging occurs, but nothing what I'd expect - prettyPhoto still reloads the same image, and never goes on to open the following or the previous one.

If the project is not dead, I'd appreciate any help on discovering (and solving) why the array isn't being filled with img links.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant