Skip to content

Instantly share code, notes, and snippets.

@rogeliog
Last active August 29, 2015 13:57
Show Gist options
  • Save rogeliog/9519964 to your computer and use it in GitHub Desktop.
Save rogeliog/9519964 to your computer and use it in GitHub Desktop.
Code example from http://learnflight.io
$(function () {
//Color Stat UI component
var ColorStat = flight.component(function () {
this.updateColorStat = function (event, data) {
var count = parseInt(this.$node.text(), 10);
if (this.$node.data('color') == data.color) {
this.$node.text(count + 4);
} else {
this.$node.text(count - 1);
}
};
this.after('initialize', function () {
this.on(document, 'uiColorSelected', this.updateColorStat);
});
});
//History UI component
var History = flight.component(function () {
this.updateHistory = function (event, data) {
this.$node.append('<li>' + data.color + '</li>');
};
this.after('initialize', function () {
this.on(document, 'uiColorSelected', this.updateHistory);
});
});
//Raffle Trigger UI component
var RaffleTrigger = flight.component(function () {
this.defaultAttrs({
colors: ['red', 'green', 'blue']
});
this.selectColor = function (event, data) {
var color = this.attr.colors[Math.floor(Math.random() * this.attr.colors.length)];
this.trigger('uiColorSelected', { color: color });
};
this.after('initialize', function () {
this.on('click', this.selectColor);
});
});
//Attach the components to the DOM
History.attachTo('.history');
ColorStat.attachTo('.color-stat');
RaffleTrigger.attachTo('.trigger');
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment