wojodesign / simplecart-js

A simple javascript shopping cart that easily integrates with your current website.
simplecartjs.org
1.79k stars 491 forks source link

Basket items between multiple tabs/windows #473

Open ehuggett opened 10 years ago

ehuggett commented 10 years ago

Hi,

If a user opens a shop using simplecart in two or more browser tabs/windows changes made in one tab will overwrite changes made in the other. For example

  1. User opens a shop using simplecart in TAB1 and TAB2
  2. User adds ITEM1 to cart in TAB1, TAB1 writes ITEM1 to localStorage.
  3. User adds ITEM2 to cart in TAB2, TAB2 writes ITEM2 to localStorage (overwriting ITEM1 effectively removing it from their cart).

The user would expect to have ITEM1 and ITEM2 in their cart, but will instead find that only ITEM2 is in the cart if they change page or reload TAB1.

When using cookies to store basket items there does not seem to be a solution for this, however, as simplecart is using HTML5 Local Storage you could create a event for when local storage is updated and use this to reload the cart items in other tabs/windows (I attempted this but caused infinite loops!).

HTML5 localstorage on update event example http://html5demos.com/storage-events

dceonline commented 10 years ago

Hi,

you may try to use window events focus and blur to update cart - http://stackoverflow.com/questions/1760250/how-to-tell-if-browser-tab-is-active?answertab=votes#tab-top

Regards Ortwin