I'm about to make a photos grid that its lines contain alternatively 2 and 3 photos using javascript. The question is: How to tell mathematically which line i should start making the grid with (a line with 2 photos or 3) in order to prevent that the last line contains 1 photo
| 2 photos | .. |
| -------- |-----|
| 3 photos | ... |
| -------- |-----|
| 4 photos | .. |
| | .. |
| -------- |-----|-----|
| 5 photos | .. | ... |
| | ... | .. |
| -------- |-----|-----|
| 6 photos | ... |
| | ... |
| -------- |-----|
| 7 photos | .. |
| | ... |
| | .. |
| -------- |-----|
| 8 photos | ... |
| | .. |
| | ... |
| -------- |-----|
| 9 photos | .. |
| | ... |
| | .. |
| | .. |
| -------- |-----|-----|
| 10 photos| .. | ... |
| | ... | .. |
| | .. | ... |
| | ... | .. |
| -------- |-----|-----|
| 11 photos| ... |
| | .. |
| | ... |
| | ... |
| -------- |-----|-----|
| 12 photos| .. | ... |
| | ... | .. |
| | .. | ... |
| | ... | .. |
| | .. | .. |
| -------- |-----|-----|
| 13 photos| .. | ... |
| | ... | .. |
| | .. | ... |
| | ... | .. |
| | ... | ... |
| -------- |-----|-----|
| 14 photos| .. |
| | ... |
| | .. |
| | ... |
| | .. |
| | .. |
| -------- |-----|-----|
| 15 photos| .. | ... |
| | ... | .. |
| | .. | ... |
| | ... | .. |
| | .. | ... |
| | ... | .. |
| -------- |-----|-----|
edited
| -------- |-----|-----|
| 7 photos | .. | ... |
| | ... | .. |
| | .. | .. |
| -------- |-----|-----|
CodePudding user response:
As you alternate 2 and 3 photos, what matters is the total modulo 5. (operator %
)
With N = Math.floor(total / 5)
(whole division)
If total % 5 = 0
=> you can start with either 2 or 3. You'll have 2N rows.
If total % 5 = 1
=> start with 3. You'll have 2N rows, and the last one will be 3 (not 2).
If total % 5 = 2
=> start with 2. You'll have 2N 1 rows.
If total % 5 = 3
=> start with 3. You'll have 2N 1 rows.
If total % 5 = 4
=> start with 2. You'll have 2N 2 rows, and the last one will be 2 (not 3).
Only case this doesn't work is if you have only one photo.