| 9 | * Add event listener to the lid-toggle button. |
| 10 | */ |
| 11 | const lidToggle = function (event, button, newArg) { |
| 12 | console.log(event) |
| 13 | console.log(newArg) |
| 14 | |
| 15 | // Find the current backpack object in backpackObjectArray |
| 16 | let backpackObject = backpackObjectArray.find( ({ id }) => id === button.parentElement.id ); |
| 17 | |
| 18 | // Toggle lidOpen status |
| 19 | backpackObject.lidOpen == true |
| 20 | ? backpackObject.lidOpen = false |
| 21 | : backpackObject.lidOpen = true; |
| 22 | |
| 23 | // Toggle button text |
| 24 | button.innerText == "Open lid" |
| 25 | ? button.innerText = "Close lid" |
| 26 | : button.innerText = "Open lid"; |
| 27 | |
| 28 | // Set visible property status text |
| 29 | let status = button.parentElement.querySelector(".backpack__lid span"); |
| 30 | status.innerText == "closed" |
| 31 | ? (status.innerText = "open") |
| 32 | : (status.innerText = "closed"); |
| 33 | } |
| 34 | |
| 35 | const backpackList = backpackObjectArray.map((backpack) => { |
| 36 | |