Render issue with Masonry on Skins page

[MattD]

On the page skin/index.php, when you create more than 3 skins, masonry fails to calculate the content and positions a skin box in the wrong position.

This always happens on page load when the function initUserThumbnailsMasonry() fires (theme.js).
From what i can see, when the function is called, content is not loaded, therefore creating a wrong dimension. Not 100% sure but if you follow the steps bellow maybe it will help determine the cause.

1. go to /skins/index.php.
2. create 4 new skin. Skin boxes will all align correctly.
3. Refresh the browser.
4. Notice the 4th skin box absolute positioning is incorrect and overlaps box 3.
5. Open up browser developer tools, navigate to view the raw js "theme.js".
6. Scroll to line 129 and add a break-point and refresh the browser.
7. Click through the break-point and the Skins will load correctly.
or
7. Click on a navigation link to open a new page eg "Shared with me" then go page to skins page via the link.
8. If you have the break-point set on the js, it will load correctly. If not, it will break.

I have tested this a bit and it doesn't always work :) Sometime if you refresh the page, it works. Other times it doesn't.

[Mahara Bot (dev-mahara)]

Patch for "master" branch: https://reviews.mahara.org/6614

[Mahara Bot (dev-mahara)]

Reviewed: https://reviews.mahara.org/6614
Committed: https://git.mahara.org/mahara/mahara/commit/1a60bcbb8e5c5e6c6eafe9fa3ab4b5cfed95817f
Submitter: Robert Lyon (<email address hidden>)
Branch: master

commit 1a60bcbb8e5c5e6c6eafe9fa3ab4b5cfed95817f
Author: Pat Kira <email address hidden>
Date: Thu Jun 23 13:03:12 2016 +1200

Bug 1592213 - Fixed skin overlapping each other

Removed Masonry as all skin items are the same height, the layout of the
page can be acheived with css only

behatnotneeded

Change-Id: I4a469dc4698b5b06e53fa6310f2dc3f55ea23cab

[Mahara Bot (dev-mahara)]

Patch for "15.10_STABLE" branch: https://reviews.mahara.org/6623

[Mahara Bot (dev-mahara)]

Patch for "16.04_STABLE" branch: https://reviews.mahara.org/6624

[Mahara Bot (dev-mahara)]

Reviewed: https://reviews.mahara.org/6623
Committed: https://git.mahara.org/mahara/mahara/commit/266d26fcb578ca9252bdaf3516ca60b93b13b7d8
Submitter: Robert Lyon (<email address hidden>)
Branch: 15.10_STABLE

commit 266d26fcb578ca9252bdaf3516ca60b93b13b7d8
Author: Pat Kira <email address hidden>
Date: Thu Jun 23 13:03:12 2016 +1200

Bug 1592213 - Fixed skin overlapping each other

Removed Masonry as all skin items are the same height, the layout of the
page can be acheived with css only

behatnotneeded

Change-Id: I4a469dc4698b5b06e53fa6310f2dc3f55ea23cab
(cherry picked from commit 1a60bcbb8e5c5e6c6eafe9fa3ab4b5cfed95817f)

[Mahara Bot (dev-mahara)]

Reviewed: https://reviews.mahara.org/6624
Committed: https://git.mahara.org/mahara/mahara/commit/cfe97c910622c0a4e2d15e1ad3faaecd7f9f77bd
Submitter: Robert Lyon (<email address hidden>)
Branch: 16.04_STABLE

commit cfe97c910622c0a4e2d15e1ad3faaecd7f9f77bd
Author: Pat Kira <email address hidden>
Date: Thu Jun 23 13:03:12 2016 +1200

Bug 1592213 - Fixed skin overlapping each other

Removed Masonry as all skin items are the same height, the layout of the
page can be acheived with css only

behatnotneeded

Change-Id: I4a469dc4698b5b06e53fa6310f2dc3f55ea23cab