Skip to content

Instantly share code, notes, and snippets.

@iskugor
Created June 9, 2012 14:38
Show Gist options
  • Save iskugor/2901206 to your computer and use it in GitHub Desktop.
Save iskugor/2901206 to your computer and use it in GitHub Desktop.
ZenTi - advanced extending
//get ZenTi library
var ZenTi = require('/library/zen_ti');
//Window constructor
var Window = ZenTi.include('window', 'ui');
//Button constructor
var Button = ZenTi.include('button', 'ui');
//List container constructor
var List = ZenTi.include('list', 'containers');
//want to extend a button
function ExtendedButton() {
}
//simple :)
ZenTi.extend(ExtendedButton, Button);
//define properties
ZenTi.defineProperties(ExtendedButton.prototype, {
backgroundColor: '#f00'
});
//define methods
ZenTi.defineMethods(ExtendedButton.prototype, {
doSomething: function() {
Ti.API.info('ExtendedButton doSomething');
}
});
//this is new cool feature, now listeners can be defined in prototype object
ZenTi.defineListeners(ExtendedButton.prototype, {
custom: function() {
this.doSomething();
},
click: new List([
function() { Ti.API.info('One!'); Ti.API.debug(this.toString()); },
function() { Ti.API.info('Two!'); Ti.API.debug(this.toString()); }
])
});
//extend again
function ExtendExtendedButton() {
}
ZenTi.extend(ExtendExtendedButton, ExtendedButton);
//methods can be redefined
ZenTi.defineMethods(ExtendExtendedButton.prototype, {
doSomething: function() {
Ti.API.info('doSomethingElse');
}
});
//but listeners are added
ZenTi.defineListeners(ExtendExtendedButton.prototype, {
click: function() { Ti.API.info('Only One!'); Ti.API.debug(this.toString()); }
});
//to redefine listeners (that is, remove inherited ones)
ZenTi.reDefineListeners(ExtendExtendedButton.prototype, {
custom: function() { Ti.API.info('Custom redefined!'); }
});
//usage
var win = new Window();
win.setProperties({ backgroundColor: '#000', navBarHidden: true, layout: Window.prototype.LAYOUT_VERTICAL });
var button = new ExtendedButton();
button.setProperties({ title: 'Click me!' });
var eButton = new ExtendExtendedButton();
eButton.setProperties({ title: 'Click me too!', top: 20, backgroundColor: '#00f' });
var oneMoreEButton = new ExtendExtendedButton();
oneMoreEButton.setProperties({ backgroundColor: '#0f0', title: 'Another click please!' });
win.add(button, 'Button');
win.add(eButton, 'EButton');
win.add(oneMoreEButton, 'OneMoreEButton');
//adding event listener with custom "this" value
win.on('open', function() {
button.trigger('custom');
this.trigger('custom');
win.get('OneMoreEButton').trigger('custom');
}, eButton);
win.open();
//output
//06-09 14:22:09.960: I/TiAPI(4629): ExtendedButton doSomething
//06-09 14:22:09.960: I/TiAPI(4629): Custom redefined!
//06-09 14:22:09.960: I/TiAPI(4629): Custom redefined!
//screenshoot: http://i47.tinypic.com/2i9hx6r.png
//click on first, second and third button produces the output:
//06-09 14:22:15.070: I/TiAPI(4629): One!
//06-09 14:22:15.080: D/TiAPI(4629): [object ZenExtendedButton]
//06-09 14:22:15.080: I/TiAPI(4629): Two!
//06-09 14:22:15.080: D/TiAPI(4629): [object ZenExtendedButton]
//06-09 14:22:15.650: I/TiAPI(4629): One!
//06-09 14:22:15.650: D/TiAPI(4629): [object ZenExtendExtendedButton]
//06-09 14:22:15.650: I/TiAPI(4629): Two!
//06-09 14:22:15.660: D/TiAPI(4629): [object ZenExtendExtendedButton]
//06-09 14:22:15.660: I/TiAPI(4629): Only One!
//06-09 14:22:15.660: D/TiAPI(4629): [object ZenExtendExtendedButton]
//06-09 14:22:16.260: I/TiAPI(4629): One!
//06-09 14:22:16.260: D/TiAPI(4629): [object ZenExtendExtendedButton]
//06-09 14:22:16.260: I/TiAPI(4629): Two!
//06-09 14:22:16.260: D/TiAPI(4629): [object ZenExtendExtendedButton]
//06-09 14:22:16.260: I/TiAPI(4629): Only One!
//06-09 14:22:16.260: D/TiAPI(4629): [object ZenExtendExtendedButton]
//there is still some work that has to be done with listeners :(
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment