Browse Source

Add lower tabs pane instead of splitting

topic-sass
Jason Denney 11 years ago
parent
commit
c73d5f955a
  1. 13
      app/components/user_and_profiles_lower_tabs.rb
  2. 2
      app/components/user_stats.rb
  3. 6
      app/components/users_and_profiles_border.rb
  4. 24
      app/components/users_and_profiles_border/javascripts/init_component.js

13
app/components/user_and_profiles_lower_tabs.rb

@ -0,0 +1,13 @@
class UserAndProfilesLowerTabs < Netzke::Basepack::TabPanel
component :user_profiles
component :user_logs
component :user_stats
def configure(c)
c.prevent_header = true
c.items = [ :user_logs,
{ netzke_component: :user_profiles, title: "User Profiles" },
{ netzke_component: :user_stats, title: "User Stats" }]
super
end
end

2
app/components/user_stats.rb

@ -40,7 +40,7 @@ class UserStats < Netzke::Base
private
def user
controller.current_user
User.find_by_id(session[:selected_user_id]) || controller.current_user
end
end

6
app/components/users_and_profiles_border.rb

@ -2,16 +2,14 @@ class UsersAndProfilesBorder < Netzke::Base
# Remember regions collapse state and size
include Netzke::Basepack::ItemPersistence
component :users
component :user_profiles
component :user_logs
component :user_and_profiles_lower_tabs
def configure(c)
super
c.header = false
c.items = [
{ netzke_component: :users, header: "Users", region: :center, width: 350, split: true },
{ netzke_component: :user_profiles, region: :south, height: 150, split: true},
{ netzke_component: :user_logs, region: :east, split: true}
{ netzke_component: :user_and_profiles_lower_tabs, region: :south, height: 300, split: true}
]
end

24
app/components/users_and_profiles_border/javascripts/init_component.js

@ -2,30 +2,48 @@
initComponent: function(){
// calling superclass's initComponent
this.callParent();
var stats = this.getComponent('user_stats');
var stats = this.queryById('user_stats');
if (stats != undefined){
stats.updateStats();
}
if( this.queryById('user_profiles')){
this.queryById('user_profiles').disable();
}
if( this.queryById('user_logs')){
this.queryById('user_logs').disable();
//update user stats
var store = this.queryById('user_logs').getStore()
store.on('load', function (store, records, operation, success){
if( this.queryById('user_stats') ){
this.queryById('user_stats').updateStats();
}
}, this);
}
if( this.queryById('user_stats') ){
this.queryById('user_stats').disable();
}
// setting the 'rowclick' event
var view = this.getComponent('users').getView();
view.on('itemclick', function(view, record){
// The beauty of using Ext.Direct: calling 3 endpoints in a row, which results in a single call to the server!
this.selectUser({user_id: record.get('id')});
this.getComponent('user_profiles').getStore().load();
this.getComponent('user_logs').getStore().load();
if( this.queryById('user_profiles')){
this.queryById('user_profiles').getStore().load();
this.queryById('user_profiles').enable();
}
if( this.queryById('user_logs')){
this.queryById('user_logs').getStore().load();
this.queryById('user_logs').enable();
}
if( this.queryById('user_stats') ){
this.queryById('user_stats').updateStats();
this.queryById('user_stats').enable();
}
}, this);
}
}

Loading…
Cancel
Save