title: Ember.js + HTML5 drag and drop shopping cart demo
body: <p>In short, I am trying to reproduce a basic version of jquery-ui's shopping cart demo: <a href="http://jqueryui.com/demos/droppable/shopping-cart.html">http://jqueryui.com/demos/droppable/shopping-cart.html</a> with ember.js and HTML5 native drag n drop.</p>
  
  <p>After previously trying to implement drag and drop with ember + jquery-ui and having difficulty using this solution: <a href="http://jsfiddle.net/Wu2cu/2/">http://jsfiddle.net/Wu2cu/2/</a>, I saw pangratz's HTML5 solution: <a href="http://jsfiddle.net/pangratz666/DYnNH/">http://jsfiddle.net/pangratz666/DYnNH/</a> and decided to give it a shot. </p>
  
  <p>I have forked pangratz's jsfiddle, created a productsController and an addedToCartController that filters the productsController based on an isAdded property: <a href="http://jsfiddle.net/GU8N7/3/">http://jsfiddle.net/GU8N7/3/</a></p>
  
  <p>That works fine, but then I get stuck when I try to use an #each iterator and append unique draggable views to each object in the iterator. I want to be able to drag each "product" object, and when it is dropped into the "shopping cart" area, set that object's isAdded property to true, thus having it show up in the "shopping cart."</p>
  
  <p>Any help would be greatly appreciated!! </p>
  
  <p>(also as a bonus, I'd like to make the items in the shopping cart sortable, but that's probably too much to ask for until the first bridge is crossed.)</p>