Hello! I'm trying to build an interaction where someone drags items into a backpack. On the next slide, I want them to see a list of the items that they had included in the backpack. I have the first part down - they drag items into a bag and need to fit within a certain weight limit. But, I am not sure how to create a list of items based on that. Any help would be appreciated. My project is attached. Thank you!
This may work for you. I only did the coffee mug, lunch, and two books. Here are some things to keep in mind.
You must set the variables to false when the timeline starts, because variables aren't included in what is reset on revisit.
All names that you put into the text version (2) of the variables need to be about the same length if you want each item to fit on one, and only one line.
If this can't work for you, you're going to have to use javascript.
Thank you Walt - this completely worked! I appreciate your help!
Another question - I'm wondering if there is a way to add a "back" or "Undo" button to the second slide. When the popup for "Too Heavy" appears, I want the option to start over or just undo the last action. Or, add a button at the bottom that is always visible allowing users to undo their last action. I can't figure out a way to make this happen. Thank you!
Also, I set it so that each word would be on its own line because I wanted a bulleted list. I assume there's no way to get rid of the awkward spacing and that's why you'd suggested including them all on one line? When you made your samples, how did you make it so that the words were not right up against each other? I saw that you did not include a space or a line between the variables. When I tried that, they were right up against each other with no space at all.
The items on the list are on separate lines because I made them all about the same length, set the text box that holds them to Do Not Autofit, and made it narrow enough to force each one to a new line. (That's why lunch was changed to "Her lunch").
To give each one its own paragraph (which is the only way to give them bullets) and not have gaps, would probably take thousands of triggers in SL. The only way to format text that extensively is to use javascript.
As far as taking items back out of the backpack, keeping track of what went last is more work than it is worth. I suggest you leave them visible and let them be dragged back off. The advantage of that is that the learner can choose which to unload.
Leaving them visible introduces other problems. If an item is clicked, then not removed, its weight is added again to the total, and it is not easy to subtract a weight when the item is removed. My solution is that adding is what causes the problem, and that it is best to calculate from scratch when the learner clicks Done. But then you don't have a running total. The solution is that when an item is dropped on the backpack, it invokes a layer that adds the weights of all the dropped items. The easiest way to know if an item is dropped is to change the slide to a Drag and Drop slide without a submit button. That way we can use all the magic of the DnD, but not the Correct and Incorrect layers. DnD changes the states for us, and it gives us the option to stack the dropped items in free form, so they are all or in part visible to be dragged off if necessary. While DnD changes the drop Correct state, it can't change the T/F variable (which the javascript needs). To do that I added Rectangle 5 which surrounds the entire slide, but is at the very back. When an item is dropped on the backpack, a trigger changes its T/F to True, and its state is changed to Drop Correct. (You don't even have to create the state; when you go to form View and give the item a correct drop target, like Open Backpack, the Drop Correct state is automatically created, and it looks just like the Normal state.) When an item is dropped on Rectangle 5, a trigger changes its T/F to False. and its state is changed to Drop Incorrect.
To summarize, 1. Let the items stay visible on the backpack 2. Change the slide to a DnD, and deselect the option to Delay drop states 3. Take off the submit button 4. When an item is dropped on the backpack, change its T/F variable to true, and show the calculation (Add Weights) layer 5. Create a large filled rectangle set to 99% transparency and send it to the back. 6. When an item is dropped on the rectangle, change its T/F to false, and show the calculation layer. 7. When items are dragged off, and dropped on rectangle 5, they stay where they are dropped. To return them home, give them a straight line motion path, with a length of 0, and a time of 0.1 sec that begins when they are dropped on rectangle 5. I fixed Skittles, Student ID, and Coffee mug (what else does she need, anyway?) . I also recolored them and set white to the transparent color, which you may or may not want to do. If not reset them. The javascript runs when the next slide starts.
5 Replies
This may work for you. I only did the coffee mug, lunch, and two books. Here are some things to keep in mind.
You must set the variables to false when the timeline starts, because variables aren't included in what is reset on revisit.
All names that you put into the text version (2) of the variables need to be about the same length if you want each item to fit on one, and only one line.
If this can't work for you, you're going to have to use javascript.
Thank you Walt - this completely worked! I appreciate your help!
Another question - I'm wondering if there is a way to add a "back" or "Undo" button to the second slide. When the popup for "Too Heavy" appears, I want the option to start over or just undo the last action. Or, add a button at the bottom that is always visible allowing users to undo their last action. I can't figure out a way to make this happen. Thank you!
Also, I set it so that each word would be on its own line because I wanted a bulleted list. I assume there's no way to get rid of the awkward spacing and that's why you'd suggested including them all on one line? When you made your samples, how did you make it so that the words were not right up against each other? I saw that you did not include a space or a line between the variables. When I tried that, they were right up against each other with no space at all.
The items on the list are on separate lines because I made them all about the same length, set the text box that holds them to Do Not Autofit, and made it narrow enough to force each one to a new line. (That's why lunch was changed to "Her lunch").
To give each one its own paragraph (which is the only way to give them bullets) and not have gaps, would probably take thousands of triggers in SL. The only way to format text that extensively is to use javascript.
As far as taking items back out of the backpack, keeping track of what went last is more work than it is worth. I suggest you leave them visible and let them be dragged back off. The advantage of that is that the learner can choose which to unload.
Leaving them visible introduces other problems. If an item is clicked, then not removed, its weight is added again to the total, and it is not easy to subtract a weight when the item is removed. My solution is that adding is what causes the problem, and that it is best to calculate from scratch when the learner clicks Done. But then you don't have a running total. The solution is that when an item is dropped on the backpack, it invokes a layer that adds the weights of all the dropped items. The easiest way to know if an item is dropped is to change the slide to a Drag and Drop slide without a submit button. That way we can use all the magic of the DnD, but not the Correct and Incorrect layers. DnD changes the states for us, and it gives us the option to stack the dropped items in free form, so they are all or in part visible to be dragged off if necessary. While DnD changes the drop Correct state, it can't change the T/F variable (which the javascript needs). To do that I added Rectangle 5 which surrounds the entire slide, but is at the very back. When an item is dropped on the backpack, a trigger changes its T/F to True, and its state is changed to Drop Correct. (You don't even have to create the state; when you go to form View and give the item a correct drop target, like Open Backpack, the Drop Correct state is automatically created, and it looks just like the Normal state.) When an item is dropped on Rectangle 5, a trigger changes its T/F to False. and its state is changed to Drop Incorrect.
To summarize,
1. Let the items stay visible on the backpack
2. Change the slide to a DnD, and deselect the option to Delay drop states
3. Take off the submit button
4. When an item is dropped on the backpack, change its T/F variable to true, and show the calculation (Add Weights) layer
5. Create a large filled rectangle set to 99% transparency and send it to the back.
6. When an item is dropped on the rectangle, change its T/F to false, and show the calculation layer.
7. When items are dragged off, and dropped on rectangle 5, they stay where they are dropped. To return them home, give them a straight line motion path, with a length of 0, and a time of 0.1 sec that begins when they are dropped on rectangle 5.
I fixed Skittles, Student ID, and Coffee mug (what else does she need, anyway?) . I also recolored them and set white to the transparent color, which you may or may not want to do. If not reset them.
The javascript runs when the next slide starts.
This discussion is closed. You can start a new discussion or contact Articulate Support.