Providers Show View

ProvidersShowView.js

App.ProvidersShowView = Ember.View.extend({
  templateName: "providersShow",
  elementId: "providers",
  popupBinding: "controller.controllers.map.providerPopup",
  init: function () {
    this._super();
    this.createElement();
  },
  /* Begin Providers Collection */
  providersCollection: Ember.CollectionView.extend({
    tagName: "ul",
    contentBinding: "controller.content",

    /* Begin Item Class */
    itemViewClass: Ember.View.extend({
      templateName: "providerItem",
      click: function (event) {
        // Doesn't fire
        alert("clicked - item");
      }
    }),
    /* End Item Class*/

    onChildViewsChanged : function (obj, key) {
      var length = this.get( "childViews.length" );

      if (length > 0) {
        Ember.run.scheduleOnce("afterRender", this, "childViewsDidRender");
      }
    }.observes("childViews"),    

    childViewsDidRender : function () {
      this.get("parentView").updatePopup();
    },

    click: function (event) {
      // Doesn't fire
      alert("clicked - coll");
    }
  }),
  /* End Providers Collection */

  updatePopup: function () {
    var view = this,
      popup = this.get("popup"),
      markerGroup = this.get("controller.controllers.map.providerMarkerGroup"),
      map = this.get("controller.controllers.map.map");

    popup.setContent(/*this.$().get(0)*/"");

    if (popup && popup.hasOwnProperty("_content")) {
      markerGroup.eachLayer(function (marker) {
        marker.bindPopup(popup);
      });
    }

    map.on("popupopen", function (event) {
      this.destroyElement();
      this.appendTo($(".leaflet-popup-content"));
    }, view);
  },

  click: function (event) {
    // Doesn't fire
    alert("clicked - parent");
  }
});