new sales_browser
diff --git a/css/all-app.css b/css/all-app.css
index 033ca6e..d267c9b 100644
--- a/css/all-app.css
+++ b/css/all-app.css
@@ -1945,7 +1945,7 @@
 	padding: 0px;
 }
 
-.layout-section {
+.layout-main {
 	padding: 15px;	
 }
 
diff --git a/css/all-web.css b/css/all-web.css
index 53eb733..c16a8e8 100644
--- a/css/all-web.css
+++ b/css/all-web.css
@@ -1425,7 +1425,7 @@
 	padding: 0px;
 }
 
-.layout-section {
+.layout-main {
 	padding: 15px;	
 }
 
diff --git a/erpnext/accounts/page/accounts_browser/accounts_browser.css b/erpnext/accounts/page/accounts_browser/accounts_browser.css
index 1e3904f..bbbbb6b 100644
--- a/erpnext/accounts/page/accounts_browser/accounts_browser.css
+++ b/erpnext/accounts/page/accounts_browser/accounts_browser.css
@@ -4,7 +4,7 @@
 	margin-left: 10px;
 }
 
-span.accbrowser-node-toolbar {
+span.tree-node-toolbar {
 	padding: 2px;
 	margin-left: 15px;
 	border-radius: 3px;
diff --git a/erpnext/accounts/page/accounts_browser/accounts_browser.js b/erpnext/accounts/page/accounts_browser/accounts_browser.js
index 9be45ea..0561bd7 100644
--- a/erpnext/accounts/page/accounts_browser/accounts_browser.js
+++ b/erpnext/accounts/page/accounts_browser/accounts_browser.js
@@ -102,7 +102,7 @@
 		var data = $(link).data('node-data');
 		if(!data) return;
 
-		link.toolbar = $('<span class="accbrowser-node-toolbar"></span>').insertAfter(link);
+		link.toolbar = $('<span class="tree-node-toolbar"></span>').insertAfter(link);
 		
 		// edit
 		$('<a href="#!Form/'+encodeURIComponent(this.ctype)+'/'
@@ -112,7 +112,7 @@
 			link.toolbar.append(' | <a onclick="erpnext.account_chart.new_node();">Add Child</a>');
 		} else if(this.ctype=='Account') {
 			link.toolbar.append(' | <a onclick="erpnext.account_chart.show_ledger();">View Ledger</a>');
-		}		
+		}
 	},
 	show_ledger: function() {
 		var me = this;
diff --git a/erpnext/home/page/activity/activity.html b/erpnext/home/page/activity/activity.html
index b348d95..9fb910c 100644
--- a/erpnext/home/page/activity/activity.html
+++ b/erpnext/home/page/activity/activity.html
@@ -1,6 +1,7 @@
-<div class="layout-wrapper">
-	<a class="close" onclick="window.history.back();">&times;</a>
-	<h1>Activity</h1>
-	<div id="activity-list">
+<div class="layout-wrapper layout-wrapper-appframe">
+	<div class="layout-appframe"></div>
+	<div class="layout-main">
+		<div id="activity-list">
+		</div>		
 	</div>
 </div>
\ No newline at end of file
diff --git a/erpnext/home/page/activity/activity.js b/erpnext/home/page/activity/activity.js
index 83f018d..7df834e 100644
--- a/erpnext/home/page/activity/activity.js
+++ b/erpnext/home/page/activity/activity.js
@@ -1,5 +1,8 @@
 wn.pages['activity'].onload = function(wrapper) {
+	wrapper.appframe = new wn.ui.AppFrame($(wrapper).find('.layout-appframe'));
+	wrapper.appframe.title('Activity');
 	var list = new wn.ui.Listing({
+		appframe: wrapper.appframe,
 		method: 'home.page.activity.activity.get_feed',
 		parent: $('#activity-list'),
 		render_row: function(row, data) {
diff --git a/erpnext/selling/page/sales_browser/sales_browser.css b/erpnext/selling/page/sales_browser/sales_browser.css
new file mode 100644
index 0000000..38b8e96
--- /dev/null
+++ b/erpnext/selling/page/sales_browser/sales_browser.css
@@ -0,0 +1,14 @@
+span.tree-node-toolbar {
+	padding: 2px;
+	margin-left: 15px;
+	border-radius: 3px;
+	-moz-border-radius: 3px;
+	-webkit-border-radius: 3px;
+	border-radius: 3px;
+	background-color: #ddd;
+}
+
+.tree-area a.selected {
+	font-weight: bold;
+	text-decoration: underline;
+}
diff --git a/erpnext/selling/page/sales_browser/sales_browser.html b/erpnext/selling/page/sales_browser/sales_browser.html
index 1acb5ee..4683a07 100644
--- a/erpnext/selling/page/sales_browser/sales_browser.html
+++ b/erpnext/selling/page/sales_browser/sales_browser.html
@@ -1,4 +1,11 @@
-<div class="layout_wrapper">
-<div id="tr_header"></div>
-<div id="tr_body" style="margin: 16px"></div>
+<div class="layout-wrapper layout-wrapper-background">
+	<div class="appframe-area"></div>
+	<div class="layout-main-section">
+		<div class="tree-area"></div>
+	</div>
+	<div class="layout-side-section">
+		<div class="help">To add child nodes, explore tree and click on the node under which you want to add more nodes.
+		</div>
+	</div>
+	<div class="clear"></div>
 </div>
\ No newline at end of file
diff --git a/erpnext/selling/page/sales_browser/sales_browser.js b/erpnext/selling/page/sales_browser/sales_browser.js
index 8137d04..4d5a3dc 100644
--- a/erpnext/selling/page/sales_browser/sales_browser.js
+++ b/erpnext/selling/page/sales_browser/sales_browser.js
@@ -14,6 +14,123 @@
 // You should have received a copy of the GNU General Public License
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
+pscript['onload_Sales Browser'] = function(wrapper){
+	wn.require('lib/js/wn/ui/tree.js');
+	wrapper.appframe = new wn.ui.AppFrame($(wrapper).find('.appframe-area'));
+	wrapper.appframe.add_button('Refresh', function() {  
+			wrapper.make_tree();
+		}, 'icon-refresh');
+
+	wrapper.make_tree = function() {
+		var ctype = wn.get_route()[1] || 'Territory';
+		erpnext.sales_chart = new erpnext.SalesChart(ctype, wrapper);
+	}
+	
+	wrapper.make_tree();
+}
+
+pscript['onshow_Sales Browser'] = function(wrapper){
+	// set route
+	var ctype = wn.get_route()[1] || 'Territory';
+	wrapper.appframe.title(ctype + ' Tree');  
+
+	if(erpnext.sales_chart && erpnext.sales_chart.ctype != ctype) {
+		wrapper.make_tree();
+	}
+};
+
+erpnext.SalesChart = Class.extend({
+	init: function(ctype, wrapper) {
+		var root_nodes = {
+			'Territory': 'All Territories',
+			'Item Group': 'All Item Groups',
+			'Customer Group': 'All Customer Groups',
+			'Sales Person': 'All Sales Persons'
+		}
+		
+		$(wrapper).find('.tree-area').empty();
+		var me = this;
+		me.ctype = ctype;
+		this.tree = new wn.ui.Tree({
+			parent: $(wrapper).find('.tree-area'), 
+			label: root_nodes[ctype],
+			args: {ctype: ctype},
+			method: 'selling.page.sales_browser.sales_browser.get_children',
+			click: function(link) {
+				if(me.cur_toolbar) 
+					$(me.cur_toolbar).toggle(false);
+
+				if(!link.toolbar) 
+					me.make_link_toolbar(link);
+
+				if(link.toolbar) {
+					me.cur_toolbar = link.toolbar;
+					$(me.cur_toolbar).toggle(true);					
+				}
+			}
+		});
+		this.tree.rootnode.$a
+			.data('node-data', {value: root_nodes[ctype], expandable:1})
+			.click();		
+	},
+	make_link_toolbar: function(link) {
+		var data = $(link).data('node-data');
+		if(!data) return;
+
+		link.toolbar = $('<span class="tree-node-toolbar"></span>').insertAfter(link);
+		
+		// edit
+		$('<a href="#!Form/'+encodeURIComponent(this.ctype)+'/'
+			+encodeURIComponent(data.value)+'">Edit</a>').appendTo(link.toolbar);
+
+		if(data.expandable) {
+			link.toolbar.append(' | <a onclick="erpnext.sales_chart.new_node();">Add Child</a>');
+		}
+	},
+	new_node: function() {
+		var me = this;
+
+		// the dialog
+		var d = new wn.ui.Dialog({
+			title:'New ' + me.ctype,
+			fields: [
+				{fieldtype:'Data', fieldname: 'name_field', label:'New ' + me.ctype + ' Name', reqd:true},
+				{fieldtype:'Select', fieldname:'is_group', label:'Group Node',
+					options:'No\nYes', description:'Entries can made only against non-group (leaf) nodes'},
+				{fieldtype:'Button', fieldname:'create_new', label:'Create New' }
+			]
+		})		
+	
+		// create
+		$(d.fields_dict.create_new.input).click(function() {
+			var btn = this;
+			$(btn).set_working();
+			var v = d.get_values();
+			if(!v) return;
+			
+			var node = me.selected_node();
+			
+			v.parent = node.data('label');
+			v.ctype = me.ctype;
+			
+			wn.call({
+				method: 'selling.page.sales_browser.sales_browser.add_node',
+				args: v,
+				callback: function() {
+					$(btn).done_working();
+					d.hide();
+					node.trigger('reload');
+				}	
+			})			
+		});
+		d.show();		
+	},
+	selected_node: function() {
+		return this.tree.$w.find('.tree-link.selected');
+	}
+});
+
+/*
 pscript['onshow_Sales Browser'] = function(){
   wn.require('lib/js/legacy/widgets/tree.js');
 
@@ -397,14 +514,14 @@
         $c_obj('Sales Browser Control',method_name, docstring(arg2), function(r,rt) { 
           me.main_dialog.widgets[me.lbl_rec].value='';
           me.main_dialog.hide();
-          /*if(me.btn_name == "Create"){
-            me.cls_obj.cur_node.clear_child_nodes();
-            me.cls_obj.dtl.innerHTML = '';  
-            me.cls_obj.cur_node.expand();
-          }
-          else{
-            me.cls_obj.refresh_tree();   
-          }*/
+          //if(me.btn_name == "Create"){
+          //  me.cls_obj.cur_node.clear_child_nodes();
+          //  me.cls_obj.dtl.innerHTML = '';  
+          //  me.cls_obj.cur_node.expand();
+          //}
+          //else{
+          //  me.cls_obj.refresh_tree();   
+          //}
           me.cls_obj.refresh_tree(); 
         });
       }
@@ -444,3 +561,4 @@
     return {'node_title':nt,'sales_person_name':nm,'parent_sales_person':pnm,'is_group':grp,'old_parent':old_prt}
 
 }
+*/
\ No newline at end of file
diff --git a/erpnext/selling/page/sales_browser/sales_browser.py b/erpnext/selling/page/sales_browser/sales_browser.py
new file mode 100644
index 0000000..d5419f5
--- /dev/null
+++ b/erpnext/selling/page/sales_browser/sales_browser.py
@@ -0,0 +1,25 @@
+import webnotes
+
+@webnotes.whitelist()
+def get_children():
+	ctype = webnotes.form_dict.get('ctype')
+	webnotes.form_dict['parent_field'] = 'parent_' + ctype.lower().replace(' ', '_')
+	
+	return webnotes.conn.sql("""select name as value, 
+		if(is_group='Yes', 1, 0) as expandable
+		from `tab%(ctype)s`
+		where docstatus < 2
+		and %(parent_field)s = "%(parent)s"
+		order by name""" % webnotes.form_dict, as_dict=1)
+		
+@webnotes.whitelist()
+def add_node():
+	from webnotes.model.doc import Document
+	ctype = webnotes.form_dict.get('ctype')
+	parent_field = 'parent_' + ctype.lower().replace(' ', '_')
+
+	d = Document(ctype)
+	d.fields[ctype.lower().replace(' ', '_') + '_name'] = webnotes.form_dict['name_field']
+	d.fields[parent_field] = webnotes.form_dict['parent']
+	d.is_group = webnotes.form_dict['is_group']
+	d.save()
\ No newline at end of file