Static size of canvas

[MartinSandberg]

Nice work on this one.... the only thing preventing it from being used widley is as I see it that the size of the canvas never gets changed. Preferrably it would rezise as soon as adapt registeres device:changed

You can use

        canvas = document.getElementById(theId);

        width = $(canvas).parent().width();
        if (width > parseInt(this.model.get('maxsize')))
        {
            width = parseInt(this.model.get('maxsize'));
        }
        canvas.width = width;

Then you would have to calculate the height as well and redraw the puzzle as it was.

BR

Martin

[dennis-learningpool]

Hi Martin,

Thanks for the feedback. I've updated this plugin to remove the dependency on canvas - it now uses img elements and sets the css clip property to render tiles (v0.1.0).

The puzzle is supposed resize on the 'device:changed' event, (see lines 146, 147 of js/adapt-slidingPuzzle.js), but I haven't really done much testing! Additionally, the puzzle is reset during resize - should probably change that.

The "maxwidth" check is something I hadn't considered - I will change that also.

[MartinSandberg]

Hi Dennis,

Works much better now but if you only have one size of the image it will make a puzzle of the upper left portion of the image when resized down. So it's really important to use two sizes of the image.

Seems to work well when loaded but having some problems finding the correct size when resizing the browser.

/ Martin