jquery - For some reason my Backbone Cocktail.js mixin Event is being overwritten -

my mixin

window.mymixins = {}  mymixins.globalviewmethods =    events:     'click #skipit' : 'skipit' 

my view

maestra.views.questions ||= {}  class maestra.views.questions.prereq extends backbone.view   @mixin mymixins.globalviewmethods    template: jst["backbone/templates/questions/prereq"]    events:     "click #stepone"                        : "open_stepone"     "click #steptwo"                        : "open_steptwo"     "click #stepthree"                      : "open_stepthree"     "click #stepone, #steptwo, #stepthree"  : "add_complete"         "click #iamstupidready"                 : "check_question"   

when run this, mixin event not work. however, if remove events view, mixin event works. otherwise, other events work, , view's events override mixin's events. else klobbers fine ( render functions, constructor methods, etc. )

is syntax incorrect? why not letting me mixin events?

the problem when @mixin runs:

@mixin mymixins.globalviewmethods 

there no events in class no merging done. then, hit events:

events:   "click #stepone"                        : "open_stepone"   #... 

and coffeescript overwrite events @mixin added (remember @mixin knows merging, coffeescript doesn't). if @ simplified example, should see what's going on; coffeescript:

class v extends backbone.view   @mixin mymixins.globalviewmethods   events:     "click #in_v" : "in_v"       

becomes javascript (with bunch of noisy boilerplate removed):

v = (function(_super) {   //...   function v() {     _ref = v.__super__.constructor.apply(this, arguments);     return _ref;   }    v.mixin(mymixins.globalviewmethods);    v.prototype.events = {     "click #in_v": "in_v"   };    return v;  })(backbone.view); 

now can see @mixin (v.mixin) runs , merges events non-existent v.prototype.events , v.prototype.events overwritten events v.

how solve ordering problem? well, adjust order putting @mixin call @ bottom:

class v extends backbone.view   events:     "click #in_v" : "in_v"   @mixin mymixins.globalviewmethods 

now @mixin see events in v , merging.

demo: http://jsfiddle.net/ambiguous/2f9hv/1/