0

I have a photo page with a jquery cropper loaded on an image. When satisfied with the crop dimensions, the user clicks a button and a method is called to crop the image.

'update_crop': function(
          fileObj_id, photoSpec
    )
    {

        PhotoCollection.find({"_id" : fileObj_id}).forEach(function (fileObj) {
            console.log("Photo Spec in server: " + photoSpec.x);
            var readStream = fileObj.createReadStream('ImageStore');
            var writeStream = fileObj.createWriteStream('ImageStore');
            gm(readStream, fileObj.name()).crop(photoSpec.width, photoSpec.height, photoSpec.x, photoSpec.y).stream().pipe(writeStream);
        });

    }

I use graphics magic to crop the image and it works. However to see the image cropped you have to refresh the page manually, which is not what I want to do. I wrote the following code in the photo helper, but it does not change the photo even though the re subscription takes place. The page still needs to be refreshed.

Template.profile_photo.helpers({
    replace_upload_photo: function() {
        return Session.get("replace_upload_photo");
    },
    profile_photo: function() {
                var controller = Iron.controller();
                var id = controller.state.get('profileId');
                var photoHandle = Meteor.subscribe('profile_photo', id);

                if (Session.get("crop")) {
                  console.log
                  photoHandle.stop(); //Deletes the profile photo subscription and re subscribes by using the handler
                  Session.set("crop", false);
                  photoHandle = Meteor.subscribe('profile_photo', id);
                }

                return PhotoCollection.findOne({parentId: id, photoType: "profile"});           
    }
});
Geromephoto
  • 83
  • 7
  • 3
    Correct me if I'm wrong, but it looks like you're just editing the existing file and overwriting it with the cropped version. Most likely it's because you're browser is caching the older version of the image. Manually refreshing the page will cause the image to reload, but even leaving the page and coming back won't. The only ways to prevent this is to change the image name, or add a query string to the end of the image's `src` url. http://stackoverflow.com/questions/126772/how-to-force-a-web-browser-not-to-cache-images – Brian Shamblen Nov 11 '15 at 00:21
  • 1
    If you follow @BrianShamblen's suggestion you shouldn't even need to stop the subscription and resubscribe. Creating a new url for the image is the way to go. You might want to keep the larger version around anyway in case the user needs to *revert*. – Michel Floyd Nov 11 '15 at 01:04

0 Answers0