Permalink
Browse files

update campaign tree/menu selectors for ExtJS 4

  • Loading branch information...
jefftrull committed May 1, 2012
1 parent 598e80a commit 97f8112fdfaf7d5a11bb647fda8d2a525a1ba3f7
Showing with 19 additions and 19 deletions.
  1. +5 −5 components/Campaign_Select_Menu.component
  2. +11 −10 components/Campaign_Select_Tree.component
  3. +3 −4 pages/CHMenu_Test.page
@@ -27,7 +27,7 @@ Copyright 2011 Jeff Trull <jetrull@sbcglobal.net>
<script>
Ext.onReady(function() {
// Build campaign menu tree from controller data
- var campMenu = new Ext.menu.Menu({id: 'campMenu'});
+ var campMenu = Ext.create('Ext.menu.Menu', {id: 'campMenu'});
var clickAction = function(n) { {!fn}(n.id.substr(4)); } // execute supplied callback
var allowinactive = ("{!allowinactiveselect}" == "true");
@@ -45,11 +45,11 @@ Copyright 2011 Jeff Trull <jetrull@sbcglobal.net>
if ({!NOT(c.isActive)} && !allowinactive) {
// This campaign should be disabled for selection, but still present as a submenu,
// in case it has active children
- parentMenu.addMenuItem({id : ("CAMP" + "{!c.id}"), text : "{!c.name}",
- menu : {id : ("MENU" + "{!c.id}")}, cls: 'x-item-disabled'}); // no handler connection
+ parentMenu.add({id : ("CAMP" + "{!c.id}"), text : "{!c.name}",
+ menu : {id : ("MENU" + "{!c.id}")}, cls: 'x-item-disabled'}); // no handler connection
} else {
- parentMenu.addMenuItem({id : ("CAMP" + "{!c.id}"), text : "{!c.name}",
- menu : {id : ("MENU" + "{!c.id}")}, handler: clickAction});
+ parentMenu.add({id : ("CAMP" + "{!c.id}"), text : "{!c.name}",
+ menu : {id : ("MENU" + "{!c.id}")}, handler: clickAction});
}
}
</apex:repeat>
@@ -22,34 +22,35 @@ Copyright 2011 Jeff Trull <jetrull@sbcglobal.net>
<script type="text/javascript">
Ext.onReady(function(){
var allowinactive = ("{!allowinactiveselect}" == "true");
- var tree = new Ext.tree.TreePanel({
+ var tree = Ext.create('Ext.tree.Panel', {
renderTo: 'treediv',
useArrows: true,
autoScroll: true,
animate: true,
containerScroll: true,
border: false,
- root: new Ext.tree.TreeNode({
+ height: 250,
+ root: {
text: 'All Campaigns',
expanded: true,
disabled: true,
id: 'camproot'
- }),
+ },
listeners: {
// for the treepanel - but apparently not the menu - I can define a single event function for the whole thing
- click: function(n) { {!fn}(n.id.substr(4)); } // execute supplied callback
+ itemclick: function(view, model, item, index) { {!fn}(model.data.id.substr(4)); } // execute supplied callback
}
});
// add the campaigns as tree nodes
var parentNode;
<apex:repeat value="{!CampaignTree}" var="c" id="treenodes">
// add this Campaign as a menu item
- parentNode = tree.getNodeById(("{!c.parentid}" == "") ? "camproot" : ("NODE" + "{!c.parentid}"));
- parentNode.appendChild(new Ext.tree.TreeNode({id : ("NODE" + "{!c.id}"), text : "{!c.name}", leaf : "{!c.isleaf}",
- // do not allow selecting inactive campaigns
- disabled : !allowinactive && {!NOT(c.isActive)},
- // if they are leafs, do not even show them...
- hidden : !allowinactive && {!AND(c.isLeaf, NOT(c.isActive))}}));
+ parentNode = tree.getStore().getNodeById(("{!c.parentid}" == "") ? "camproot" : ("NODE" + "{!c.parentid}"));
+ parentNode.appendChild({id : ("NODE" + "{!c.id}"), text : "{!c.name}", leaf : "{!c.isleaf}",
+ // do not allow selecting inactive campaigns
+ disabled : !allowinactive && {!NOT(c.isActive)},
+ // if they are leafs, do not even show them...
+ hidden : !allowinactive && {!AND(c.isLeaf, NOT(c.isActive))}});
</apex:repeat>
});
</script>
View
@@ -17,11 +17,10 @@ Copyright 2011 Jeff Trull <jetrull@sbcglobal.net>
<!-- A page to test using the campaign menu and campaign tree components -->
<!-- load ExtJS -->
- <apex:stylesheet value="{!$Resource.ExtJS}/ext-3.4.0/resources/css/ext-all.css" />
- <apex:includeScript value="{!$Resource.ExtJS}/ext-3.4.0/adapter/ext/ext-base.js"/>
- <apex:includeScript value="{!$Resource.ExtJS}/ext-3.4.0/ext-all.js"/>
+ <apex:stylesheet value="{!$Resource.ExtJS4}/ext-4.0.7-gpl/resources/css/ext-all.css" />
+ <apex:includeScript value="{!$Resource.ExtJS4}/ext-4.0.7-gpl/ext-all-debug.js"/>
<script type="text/javascript">
- Ext.BLANK_IMAGE_URL="{!$Resource.ExtJS}/ext-3.4.0/resources/images/default/s.gif"
+ Ext.BLANK_IMAGE_URL="{!$Resource.ExtJS4}/ext-4.0.7-gpl/resources/themes/images/default/tree/s.gif"
</script>
<apex:form >

0 comments on commit 97f8112

Please sign in to comment.