Custom Event and inSender Propagation

edited April 2012 in Enyo 2
My expectations of the inSender for a custom event being passed back up the component tree is that it would remain a reference to the original sending object, rather than a reference to the object that last passed the event back, as occurs in the below example.
This is to say, I expect the woof function to receive a Video.Thumb object as the first argument for each one created, but it receives an ItemManager object for each Video.Thumb created.
(Excuse any potential errors, it is a pared down version of an app based on the example Twitter search app)

Is this the intended behaviour?
Is it possible to access the original object?
Is the custom event / event handler behaviour documented explicitly somewhere?
Is enyo.Component::dispatchBubble relevant in this case?
Is this something for which you would recommend using enyo.Signal?

Main.js
enyo.kind({
 name: "Main",
 kind: "Control",
 handlers: {
	onSneeze: "woof",
 },
 components: [
    {kind: "ItemManager", name: "ill"}
 ],
 create: function() {
   this.inherited(arguments);
   this.thingamajigs();
 },
  thingamajigs: function() {
     this.$.ill.createItems(returnedJsonDataFromSomewhere);
 },
 woof: function(inSender, inEvent) {
	debug(inSender.name);
	return true;
 }
})
ItemManager.js
enyo.kind({
 name: "ItemManager",
  kind: "Control",
 components: [
		{ tag: "div", name: "vidList"	},
 ],
  createItems: function(inResponse) {
		this.$.vidList.destroyClientControls();
		enyo.forEach((inResponse.items).slice(10,20), this.addVid, this);
		this.$.vidList.render();
  },
  addVid: function(inResult) {
	  this.createComponent({
		  kind: "Video.Thumb",
		  container: this.$.vidList,
		  icon: inResult.thumbnailURL,
		  handle: inResult.id,
		  text: inResult.name,
	  });
  },

})
Video.Thumb.js
enyo.kind({
  name: "Video.Thumb",
  events: {
  	onSneeze:""
  },
  kind: enyo.Control,
  tag: "div",
  style: "border-style: solid; border-width: 1px; " +
         "padding: 2x; margin: 2px; min-height: 30px",

  published: {
    icon: "",
    handle: "",
    text: ""
  },

  components: [
    { tag: "img", name: "icon",
      style: "width: 50px; height: 20px; float: left; padding-right: 10px" },
    { tag: "b", name: "handle" },
    { tag: "span", name: "text" }
  ],

  create: function() {
    this.inherited(arguments);
    this.iconChanged();
    this.handleChanged();
    this.textChanged();
    this.doSneeze();
  },

  iconChanged: function() {
    this.$.icon.setAttribute("src", this.icon);
  },

  handleChanged: function() {
    this.$.handle.setContent(this.handle + ": ");
  },

  textChanged: function() {
    this.$.text.setContent(this.text);
  }
});

Comments

  • edited April 2012
    It appears that bubble and its complement waterfall are what I should be using in this case.

    In answer to my other question, inEvent.originator appears to be the suggested method of accessing the original sender.

    Here is a link to the github documentation for other search-impaired persons such as myself.
  • Dear enyo,

    I love you.
    </emotional spam>
Sign In or Register to comment.