Forum | Appery.io

Hi, I built a page that loads a picture and then, through a slider, is possible to adjust the quality of the image taken.

The page works perfectly into the laptop browser simulator (chrome) but, when I try to execute it from the device the behaviour is strange: the image is half black and looks stretched!

I'm using exactly the same file, take a look to the screensthots:

Simulator:

Device (Chrome, Safari and Appery.io tester have the same behaviour)

To resize the image i'm levereging the "canvas" browser feature (http://clientside-resize.labs.liip.ch/) and it works fine if i'm using a "static" image (loaded as an asset in appery) instead of a dynamically loaded one.

Do you have any idea of what's wrong?

Hello! Please take a look here and let us know if this post helps https://getsatisfaction.com/apperyio/...

Thanks a lot Maryna, it seems exactly what i was searching for! I'll test as soon I have time.

It could be possible to also add a progress bar that indicates the status of the upload?

Gabriele

Hi Gabriele,

Here is how to use spinner: https://getsatisfaction.com/apperyio/...

Katya, Maryina,

Thanks a lot for the information! It was exactly what I was searching for!!!

I have another question: I'm trying, once selected the picture, to keep the original rate between width and height.. how can I do that with the canvas?

Gabriele

Hi Gabriele,

You can calculate a coefficient c=height/width, and then change size this way: width = widthn and height considering coefficient heightn*c

Thanks a lot,
I implemented the solution you suggested me and works great!!