search

dimsemenov / PhotoSwipe

JavaScript image gallery for mobile and desktop, modular, framework independent
http://photoswipe.com
MIT License
23.87k stars 3.32k forks source link

zooming not working in android #354

Closed rambo123 closed 9 years ago

rambo123 commented 11 years ago

Thank you for PhotoSwipe. I am using jquery-1.6.4.min.js,code.photoswipe.jquery-3.0.5.min.js,jquery.mobile-1.0rc2.min.js , there is no error except zooming in android. Pinch and zoom works in ipad,iphone why its not working in android. solutions please.........

pixelfreak commented 11 years ago

I don't think this has ever worked for Android. I know...the description for this framework is misleading, saying it is compatible with Android. It's using gesture event that is not supported.

But it can be done using the basic touch events (on v4.x anyway, I think it doesn't work below that. On 2.x, event.touches always return 1).

I wonder if anyone has forked and added this.

rambo123 commented 11 years ago

thank you so much for your message sir.

On Thu, Jul 26, 2012 at 5:44 AM, pixelfreak reply@reply.github.com wrote:

I don't think this has ever worked for Android. I know...the description for this framework is misleading, saying it is compatible with Android. It's using gesture event that is not supported. But it can be done using the basic touch events. I wonder if anyone has forked and added this.

Reply to this email directly or view it on GitHub: https://github.com/codecomputerlove/PhotoSwipe/issues/354#issuecomment-7263140

pjsb commented 11 years ago

@pixelfreak do you find someone who has adopted it to android? would be a cool feature

pixelfreak commented 11 years ago

Nope. If you find it, let me know too :)

agliottone commented 11 years ago

I have add hammerjs and transitjs, and create addAndroidZoom function and works well!!!

pixelfreak commented 11 years ago

Pull request?

binaya-pradhan19 commented 11 years ago

How to implement addAndroidZoom in photoswipe?

agliottone commented 11 years ago

download and unzipped this http://darioagliottone.it/files/ps.zip there are js files. include in your html:

<script type="text/javascript" charset="utf-8" src="code.photoswipe-3.0.5.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery.transit.js"></script>
<script type="text/javascript" charset="utf-8" src="hammer.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery.hammer.js"></script>

enjoy :)))

binaya-pradhan19 commented 11 years ago

hi agllottone thanks for ur help.....it is super.....

cuxxie commented 11 years ago

yes i can see the pinch zoom looks fine but the photoswipe doesnt show any image after i attached the code. any idea how to solve that? thanks

if i remove this then the pinch zoom will works fine but the photoswipe wont load at all. while if i use this then the photoswipe will only show blank image

agliottone commented 11 years ago

post your code :)

adiepev commented 11 years ago

Where can I find your zip files?

agliottone commented 11 years ago

sorry, try again http://darioagliottone.it/files/ps.zip

adiepev commented 11 years ago

Dario,

Thank you very much, I'll try it out.

Regards from the Netherlands.,

Alex Diepeveen

Tel: 035-6952476

Mob: 06-27416981

Van: Dario Agliottone [mailto:notifications@github.com] Verzonden: donderdag 4 april 2013 20:28 Aan: codecomputerlove/PhotoSwipe CC: adiepev Onderwerp: Re: [PhotoSwipe] zooming not working in android (#354)

sorry, try again http://darioagliottone.it/files/ps.zip

Reply to this email directly or view https://github.com/codecomputerlove/PhotoSwipe/issues/354#issuecomment-1591 4862 it on GitHub. https://github.com/notifications/beacon/NonmGGp1Lu2IFaW6gBeFHbM6PibqIBzcxqO ZLkuGqZuTNFZvW15Jnf-LOZZ4Kbsd.gif

Geen virus gevonden in dit bericht. Gecontroleerd door AVG - www.avg.com Versie: 2013.0.3267 / Virusdatabase: 3161/6218 - datum van uitgifte: 04/01/13

abudayah commented 11 years ago

anyone know how to use multitouch zoom ?

hunag-yean commented 10 years ago

i have one question

how to enlarge jpg image without distortion

in ios and android

angelarted commented 10 years ago

Hi Dario Agliottone, I tried to add those scripts you suggest to my PhoneGap app, but it still doesn't work. Any idea about the reason? Thank you very much

agliottone commented 10 years ago

no. I use it in phonegap application too

angelarted commented 10 years ago

I'll leave my code so someone can help me how to do it. I've used hammer and transit, but still can get it work correctly. In detail, it zooms, but zooms all the images, not only the visible one, and, moreover, it's not draggable (so I can't view it all). I tried with several plugins (like pep.js) but, since I cannot reach the image directly, I cannot apply them to it. (the ui-overlay masks them). Here's my code. Where do I wrong? I used PhoneGap and JqueryMobile

var currentPage = $.mobile.activePage;

var   options = {
    enableMouseWheel        : false , 
    enableKeyboard          : false, 
    captionAndToolbarOpacity: 1,
    backButtonHideEnabled   : false,   //do not modify - causes android crash
    allowUserZoom           : true,
    getImageMetaData        : function(el){
                                            return{
                                               id  : el.getAttribute('id')
                                            }
                                        }
    },

photoSwipeInstance = $('#lstImages a',e.target).photoSwipe(options,currentPage.attr('id'));

photoSwipeInstance.addEventHandler(window.Code.PhotoSwipe.EventTypes.onDisplayImage,function(e){

      //TO CLOSE GALLERY AND STAY IN PAGE ON ANDROID PHISICAL BACK BUTTON
       document.addEventListener('backbutton',function(e){
        e.preventDefault();
             window.Code.PhotoSwipe.activeInstances[0].instance.hide(); 
             window.location.hash = $.mobile.urlHistory.getActive();
    },false)

   //THIS SETS VARIABLES TO CATCH CURRENT IMAGE IN GALLERY
    var currentImage = photoSwipeInstance.getCurrentImage();
    var id = currentImage.metaData.id;
    var $img = $('.ps-carousel-item-'+id+' img');
    var $wrap = $('.ps-carousel-'+id);

    //THIS SETS THE BEHAVIOUR ON HAMMER GESTURE
    $('.ps-uilayer').hammer({prevent_default:true}).on('pinchin pinchout',function(e){
        e.stopPropagation();
        e.gesture.stopPropagation();
        e.gesture.stopDetect();

       //THIS IS THE BEHAVIOUR: IT IS APPLIED TO ALL THE IMAGES INSTEAD OF THE CURRENT ONE. WHY?
        switch(e.type){
           case 'pinchout':
           $img.transition({scale: 2}); 
        break;
           case 'pinchin':
           $img.transition({scale: 1});
        break;
            }       
    })
    $img.pep(); //THIS IS THE ATTEMPT TO MAKE IMG DRAGGABLE
});
yrancillac commented 10 years ago

@agliottone : Thx it's working very well.

agliottone commented 10 years ago

:+1:

emilzaki commented 9 years ago

Dear agliottone, could you please post the whole thing as the attached script doesn't work! Thanks

andreinitescu commented 9 years ago

has anyone managed to make it work on Windows 8 IE11 as well?

dimsemenov commented 9 years ago

@nitescua, do you test on desktop or mobile IE11? On what exactly device?

andreinitescu commented 9 years ago

@dimsemenov on a Windows 8.1 tablet with IE11

andreinitescu commented 9 years ago

I have a deadline and I'm struggling trying to convert the code done by @agliottone

dimsemenov commented 9 years ago

@nitescua, entirely new version of Photoswipe will be released this week (at least I hope so), please email me to diiiimaaaa@gmail.com and I'll send you private link to beta, and you'll test if it works correctly there.