Back to General - Yahoo! TV Widgets Forum
0

How to define custom event the KONtx way

I have a container class and two button inside it. I want to expose 2 custom events for my two buttons like following:
CODE
var Toolbar = new KONtx.Class({
	ClassName: 'Toolbar',
	Extends: KONtx.element.Container,
	
    onButton1Select: function() {},
    onButton2Select: function() {},
    
	initialize: function() {
	    var button1 = new KONtx.element.Button({
	        // code to define button1
	        events: {
	            onSelect: function(event) {
	                onButton1Select();
	            }
	        }
	    }).appendTo(this);
	    
	    var button2 = new KONtx.element.Button({
	        // code to define button2
	        events: {
	            onSelect: function(event) {
	                onButton2Select();
	            }
	        }
	    }).appendTo(this);
	}
});

var Dashboard = new KONtx.Class({
	ClassName: 'Dashboard',
	Extends: KONtx.system.FullscreenView,
	createView: function() {
	    var toolbar = new Toolbar().appendTo(this);
	    toolbar.onButton1Select = function() {
	        // handle button 1 select
	    };
	    
	    toolbar.onButton2Select = function() {
	        // handle button 2 select
	    };
	}
});


But this is not the *framework* way to do this. What I want to is to do something like this:
CODE
var toolbar = new Toolbar().appendTo(this);
function handleButton1Select() {
}.subscribeTo(toolbar, 'onButton1Select');


Could you please show me some sample code for this?
Many thanks in advance!

by
Report Abuse
2 Replies
  • Look in src/core/base.js and you will see that each "Class" created using the KONtx.Class syntax implements an "Events" library.

    CODE
    ['Config','Events'].forEach(function(lib){
        KONtx.Class.Mutators.Implements(properties, KONtx.Class.Libraries[lib]);
    });


    The Events library (also defined in base.js) contains several method, one of which is fire.

    CODE
    fire: function Events_fire (eventType, eventPayload, nativeEvent)


    You will want to use the "fire" method to publish any events that you would like to be listened to by the user of the composite object you created. You will see lots of examples of using the "fire" method in the framework code.

    So you could use:
    CODE
    this.fire('button1Select', <someData>)
    this.fire('button2Select', <someData>)


    You can then listen to the event like any other component, by either including an events object, or using the addEvents method.
    Report Abuse
    0
  • Your answer is what I am looking for!
    Many thanks Steve!
    Tinh
    Report Abuse
    0
Ask a Question

Recent Posts

in General - Yahoo! TV Widgets