Original state of the page when it’s loaded:
When “activeLesson” is null, “lessonInfo” container should be invisible. If a lesson is selected (adds the lesson’s id to “activeLesson”) the container should be visible:
The contents of the “lessonInfo” container:
When “activeLessonIndex” index is 0, the button that moves it to index-1 becomes deactivated.
When “activeLessonIndex” is equal to the last item in the array, the button that moves it to index+1 is deactivated.
When a tab is selected “activeLesson” is populated by the lesson’s id and “activeLessonIndex” by the lesson object’s index in the array.
Things that work:
- When the + button is pressed a new lesson tab is added and automatically selected. This populates “activeLesson” with the new lesson’s id making the container visible.
- When the - button is pressed the selected lesson is removed and “activeLesson” is nullified, making the container invisible.
- Moving a lesson either to the start of end of the deactivates the appropriate button.
- Moving the first lesson forward or last lesson backward activates the previously deactivated button.
Things that don’t work:
- If the “lessonsInfo” container is invisible, selecting a tab populates “activeLesson” with the lesson’s id, but the container remains invisible.
- If any lesson other than the first or last is selected, the appropriate button is not deactivated if the first or last tabs are selected.
Things I tried:
- Added “set component property” node to make “lessonInfo” container visible at the end of the logic diagram of the soft tabs (last image).
- Added the conditional logic for both move buttons at the end of the same logic diagram.
Neither of those had any effect.
The logic I have set works when the triggering variables are set by a button, but doesn’t work when the triggering variables are set by the soft tabs component.
I will issue a bug report on the tracker, but in the meantime is there a workaround to this?
Update: I added a couple of toast messages after the conditional node that sets the visibility of the “lessonInfo” container:
It doesn’t matter what the visibility state of the “lessonInfo” container is, selecting a tab always triggers the “show” toast, but the set component property has no effect.
Update 2: I recreated the lessons navigation with a repeated list item component as well as a repeated button component. The issue is still present in both variations.
Update 3: I can use the conditional renderer to avoid having to use set component property for changing the visibility of the “lessonInfo” container. The issue still remains that I cannot use set component property to activate and deactivate buttons.