Jay Cheroske (4) [Avatar] Offline
#1
In the example code, the $ function is used multiple times. Then the template.find() method is used, and it's output is wrapped in the $ function. I thought that the meteor way of doing this was to use the template.$ function instead, which seems clearer and may perform slightly better. Here is my slightly edited code:

   Template.fridge.rendered = function () {
      var templateInstance = this;

      templateInstance.$('#fridge').droppable({
         drop: function (evt, ui) {
            var query = { _id: ui.draggable.data('id') };
            var changes = { $set: { place: 'fridge' } };
            Products.update(query, changes);
         }
      });
   };

   Template.productList.rendered = function () {
      var templateInstance = this;

      templateInstance.$('#supermarket').droppable({
         drop: function (evt, ui) {
            var query = { _id: ui.draggable.data('id') };
            var changes = { $set: { place: 'supermarket' } };
            Products.update(query, changes);
         }
      });
   };

   Template.productListItem.rendered = function () {
      var templateInstance = this;

      templateInstance.$('.draggable').draggable({
         cursor: 'move',
         helper: 'clone'
      });
   };
stephan.hochhaus (92) [Avatar] Offline
#2
Thanks - I am not sure about the performance aspect, but certainly when we originally wrote the code
Template.instance
wasn't around.

We will revisit all source code shortly and make sure to take advantage of the latest features of Meteor. In the meantime we are more than thankful for these kinds of reports. I think it indeed helps to make the code more approachable and show the Meteor way.
Jay Cheroske (4) [Avatar] Offline
#3
And, just to be clear, in the 'rendered' callback, the template instance is available as 'this'. I simply assigned it to a another variable to make the code more self documenting.
stephan.hochhaus (92) [Avatar] Offline
#4
You are right - I mixed things up.