Grocery store simulator

I am working on a challenge to create a grocery store simulator. I have attached what I have so far. I'm looking to have each of the purple buttons respond by adding the prices to a calculator to tell the shopper their total. In a perfect world, I'd have them drag and drop an image to the shopping cart icon, and have a way to subtract totals as well - if a customer decided to "put back" an item, for example - but I'm not sure how to build either of these out (partially because I don't have individual images for each item, and I don't know how to isolate the images from what I do have). But really my first goal is to get the purple buttons to work with a calculator function of some sort. I looked at the javascript options for calculators, but I'm just not technically savvy enough to have a clue what I'm doing. Am I overreaching here? Any advice?

undefined

Thanks in advance!

Discussion (4)

I'm using a similar method for the add to variable that's outlined above in a module where the actions a learner takes tallies the score for the "test" instead of using a test itself.

Since you want the action to subtract from the total if it's removed from the cart, you could add a variable to indicate if the items is in or out of the cart and use if statements to modify the total.

Variable: cart_state

Initial value: out

OnClick: Set variable cart_state = "in" IF cart_state = "out", ELSE set variable cart_state = "in"

OnClick: Add to variable "total" (amount) if cart_state = "in", Else subtract from variable "total" (amount)

OnClick Change content of the text box to the new total

With drag and drop, thanks to Tim, it is possible to modify the total if the item is dragged to the drop area, but I'm not sure how you could subtract from variable if it's dragged out of the drop area.

Perhaps I'm oversimplifying this, but what about adding an action to each item/button to increase a variable ("Total") with each click. For example:

Trigger: OnClick

Action: Modify Variable

Target: Total, Type: Add to Variable, Value: 0.50

A secondary action could then change the contents of a text box to display the new total.

undefined

Have you thought about adding plus (+) and minus (-) buttons below the price? You could then assign Add to Variable or Subtract from Variable actions to simulate the customer putting the item back.

To upgrade Clammers approach, you could create variables for the amount of each product and make the buttons add 1 to the respective variable. Multiply the amounts with the prices, and sum up the individual product costs. Then you could display something like:

You cart contains:

2 Apples for $1

3 Croissants for $3

Total = $4

Maintenance deleted some of the responses..especially mine in which both issues were fixed. Only using javascript for the calculation of the total and to ensure 2 decimals are shown. If you want 1 or 3 or whatever amount of decimals, its just changing a variable.

http://community.trivantis.com/shared-content/grocery-shopping-store/

Discussions have been disabled for this post