{"action":"created","issue":{"url":"https://api.github.com/repos/inaturalist/inaturalist/issues/460","labels_url":"https://api.github.com/repos/inaturalist/inaturalist/issues/460/labels{/name}","comments_url":"https://api.github.com/repos/inaturalist/inaturalist/issues/460/comments","events_url":"https://api.github.com/repos/inaturalist/inaturalist/issues/460/events","html_url":"https://github.com/inaturalist/inaturalist/issues/460","id":56184411,"number":460,"title":"Upgrading the image viewer","user":{"login":"Murray-Dawson","id":10802516,"avatar_url":"https://avatars.githubusercontent.com/u/10802516?v=3","gravatar_id":"","url":"https://api.github.com/users/Murray-Dawson","html_url":"https://github.com/Murray-Dawson","followers_url":"https://api.github.com/users/Murray-Dawson/followers","following_url":"https://api.github.com/users/Murray-Dawson/following{/other_user}","gists_url":"https://api.github.com/users/Murray-Dawson/gists{/gist_id}","starred_url":"https://api.github.com/users/Murray-Dawson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Murray-Dawson/subscriptions","organizations_url":"https://api.github.com/users/Murray-Dawson/orgs","repos_url":"https://api.github.com/users/Murray-Dawson/repos","events_url":"https://api.github.com/users/Murray-Dawson/events{/privacy}","received_events_url":"https://api.github.com/users/Murray-Dawson/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":20,"created_at":"2015-02-01T23:58:26Z","updated_at":"2015-02-19T20:01:44Z","closed_at":null,"body":"**Project Description:**\r\nThis job is to provide replacement image viewing script that adds the ability to zoom and click/swipe through multiple images while staying within the viewer.\r\n\r\nThe current iNaturalist (http://www.inaturalist.org/) (including API’s such as NatureWatch NZ at http://naturewatch.org.nz/) script works fine for viewing one image at a time for an observation, with the ability to step between small - medium - large - original sizes.\r\n\r\nHowever, for an observation that has several images associated with it, you cannot currently move back and forth between images within the same viewer instance, and you must jump out of and then back into the viewer to see the next image(s) for that observation.\r\n\r\nThe new functionality should be implemented as the replacement image viewer throughout iNaturalist, NatureWatchNZ and any API’s, e.g., http://www.inaturalist.org/observations/1206507 and http://www.inaturalist.org/taxa/41566-Megaptera-novaeangliae ; http://naturewatch.org.nz/observations/1081655 and http://naturewatch.org.nz/taxa/343580-Entelea-arborescens. However, image pages such as http://naturewatch.org.nz/photos/1358109 can remain without the viewer script.\r\n\r\n**Functionality required:** \r\n•\tCross-platform, multiple browser and device compatibility.\r\n•\tTouch support for mobile devices.\r\n•\tMouse scroll wheel and touch drag to zoom / unzoom.\r\n•\tMagnifier or +/- icons to indicate zoomability.\r\n•\tAbility to pan around the zoomed image.\r\n•\tRight click save of images.\r\n•\tCopyright statements as in existing iNaturalist viewer.\r\n•\t“View original” and “View details” links within the new viewer as in the current viewer.\r\n•\tA nice-to-have (but not essential) is social media (Tweet and FB Like buttons) built into the viewer for each photo. Some of the scripts out there, including prettyPhoto, have this feature.\r\n\r\n**Existing jquery image viewer exemplars:**\r\nI think the preferred solution should have the appearence of a Lightbox clone with the added ability to zoom and pan around the enlarged image. A functional image viewer is required rather than an effects-heavy slideshow gallery.\r\n\r\nThe most suitable (and simple) example that I have seen is Smooth Zoom Pan, with their “Example 7” (http://vectorflower.com/preview/smooth_zoom/sample7.html#prettyPhoto) made using prettyPhoto lightbox. The prettyPhoto slideshow image gallery demo (http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/) does not have the zoom ability but demonstrates caption display, mouseover left/right navigation elements and embedded previews of the image set.\r\n\r\nOther examples tend to be more slideshow/large screen orientated and probably less suitable:\r\n•\tPhotoSwipe (http://photoswipe.com/)\r\n•\tPhotobox (http://dropthebit.com/demos/photobox/)\r\n•\tJackBox (http://codecanyon.net/item/jackbox-responsive-lightbox/3078222?ref=webdesigndev).\r\n\r\nLists of jQuery image viewing scripts are at:\r\n•\thttp://jquery-plugins.net/tag/image-zoom\r\n•\thttp://planetozh.com/projects/lightbox-clones/\r\n•\thttp://www.narga.net/promising-jquery-lightbox-plugins/\r\n•\thttp://blog.webrulon.com/10-jquery-lightbox-clone-plugins/\r\n•\thttp://www.webdesigndev.com/web-development/20-best-premium-free-jquery-lightbox-plugins\r\n•\thttp://www.1stwebdesigner.com/fresh-jquery-image-gallery-display-solutions/\r\n•\thttp://www.freshdesignweb.com/jquery-lightbox-plugin-image-gallery.html\r\n\r\n**Budget:** Murray Dawson (dawsonm@rnzih.org.nz) has funding available for this work. Proposed range is a small project (USD$750-1500) following the Freelancer (https://www.freelancer.com) categories.\r\n\r\n**Background info for post on Freelancer (https://www.freelancer.com/projects/Software-Architecture-Javascript/Upgrading-the-iNaturalist-image-viewer.html):** The iNaturalist code is open source Rails, and the coding, including this job (https://github.com/inaturalist/inaturalist/issues/460), is coordinated on GitHub. Project is considered complete upon acceptance of iNaturalist developers who will work with the coder to deploy the implementation. **Skills:** Ruby on Rails, Javascript."},"comment":{"url":"https://api.github.com/repos/inaturalist/inaturalist/issues/comments/75124921","html_url":"https://github.com/inaturalist/inaturalist/issues/460#issuecomment-75124921","issue_url":"https://api.github.com/repos/inaturalist/inaturalist/issues/460","id":75124921,"user":{"login":"judenaveenraj","id":951039,"avatar_url":"https://avatars.githubusercontent.com/u/951039?v=3","gravatar_id":"","url":"https://api.github.com/users/judenaveenraj","html_url":"https://github.com/judenaveenraj","followers_url":"https://api.github.com/users/judenaveenraj/followers","following_url":"https://api.github.com/users/judenaveenraj/following{/other_user}","gists_url":"https://api.github.com/users/judenaveenraj/gists{/gist_id}","starred_url":"https://api.github.com/users/judenaveenraj/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/judenaveenraj/subscriptions","organizations_url":"https://api.github.com/users/judenaveenraj/orgs","repos_url":"https://api.github.com/users/judenaveenraj/repos","events_url":"https://api.github.com/users/judenaveenraj/events{/privacy}","received_events_url":"https://api.github.com/users/judenaveenraj/received_events","type":"User","site_admin":false},"created_at":"2015-02-19T20:01:44Z","updated_at":"2015-02-19T20:01:44Z","body":"@Murray-Dawson : Okay i will work on the compatibility issue, but there have always been issues with ie8 and javascript packages and most don't even support ie8 because of the current usage statistics for IE8:\r\n\r\nAs on January 2015: IE8 usage is a mere 1.2% and compatibility for this small percentage is hard.\r\nIf i fix the firefox issue , then we would be supporting 98.8% of browsers worldwide. I hope that is enough and feasible. "}}