2 'libs/text!./templates/main.html',
3 'libs/text!./templates/handle.html',
6 ], function(mainTemplate, handleTemplate, _, Backbone) {
9 var View = Backbone.View.extend({
10 className: 'rng-view-tabs',
13 'click ul a, i': '_onTabTitleClicked'
16 initialize: function(options) {
17 this.options = options || {};
18 this.template = _.template(mainTemplate);
19 this.handleTemplate = _.template(handleTemplate);
21 this.selectedTab = null;
25 this.$el.html(this.template());
27 tabBar: this.$('.rng-view-tabs-tabBar'),
28 content: this.$('.rng-view-tabs-content')
31 if(this.options.stacked) {
32 this.nodes.tabBar.addClass('nav-stacked nav-pills').removeClass('nav-tabs');
34 if(this.options.position === 'right') {
35 this.$el.addClass('tabs-right');
36 this.nodes.content.addClass('tab-content');
41 addTab: function(title, slug, content) {
42 if(this.contents[slug]) {
43 this.contents[slug].detach();
45 this.contents[slug] = content;
47 var text = (typeof title === 'string') ? title : (title.text || '');
48 var icon = title.icon || null;
50 if(!this.tabExists(slug))
51 this.nodes.tabBar.append(this.handleTemplate({text: text, icon: icon, slug: slug}));
56 selectTab: function(slug) {
57 if(slug !== this.selectedTab && this.contents[slug]) {
58 this.trigger('leaving', this.selectedTab);
60 if(this.selectedTab) {
61 var toDetach = this.contents[this.selectedTab];
66 this.nodes.content.append(this.contents[slug]);
67 if(this.contents[slug].onShow) {
68 this.contents[slug].onShow();
70 this.nodes.tabBar.find('.active').removeClass('active');
71 this.nodes.tabBar.find('a[href="#'+slug+'"]').parent().addClass('active');
73 var prevSlug = this.selectedTab;
74 this.selectedTab = slug;
75 this.trigger('tabSelected', {slug: slug, prevSlug: prevSlug});
79 getAsView: function() {
83 getCurrentSlug: function() {
84 return this.selectedTab;
87 tabExists: function(slug) {
88 return this.nodes.tabBar.find('a[href="#'+ slug + '"]').length > 0;
93 _onTabTitleClicked: function(e) {
95 var target = $(e.target);
97 target = target.parent();
98 var slug = target.attr('href').substr(1);