I'd like to put together a StoryMap app using Initiative (second level) portfolio items as the backbone (columns). To do this the app needs to query for all the second level portfolio items, and then use each PI as a column header in the rallycardboard.
I've gotten the cardboard to display the column headers correctly, but I have not been able to get it to display the cards, which should be the first level of portfolio items (PortfolioItem/Feature).
Here is my code so far:
launch: function() {
this._getInitiativeStore();
},
_getInitiativeStore: function() {
this.initiativeStore = Ext.create('Rally.data.wsapi.Store', {
model: 'PortfolioItem/Initiative',
fetch: ['Name', 'Children'],
autoLoad: true,
listeners: {
load: this._createCardBoard,
scope: this
}
});
},
_createCardBoard: function(store, records) {
var initiativeColumns = [];
Ext.each(records, function(record) {
initiativeColumns.push({
xtype: 'rallycardboardcolumn',
columnHeaderConfig: {
xtype: 'rallycardboardcolumnheader',
fieldToDisplay: 'Name',
record: record,
},
cardConfig: {
xtype: 'rallycard',
record: 'PortfolioItem/Feature'
},
fields: ['Name', 'Parent'],
valueField: 'Parent',
value: record.get('_ref') // BUG FIXED HERE. Was: record.get('Parent')
});
}, this);
var cardBoardConfig = {
xtype: 'rallycardboard',
types: ['PortfolioItem/Feature'],
columns: initiativeColumns,
attribute: 'Parent',
};
var cardBoard = this.add(cardBoardConfig);
console.log('cardboard', cardBoard);
}
I realize I am using this perhaps a bit differently than the authors have planned for, but I'm willing to extend the rallycardboard and rallycolumnheader objects with Ext.define if that's what it takes. I'm starting to look at the Rally source code but its slow going so far.
I was able to figure out the problem by using Ext.define() to override the cardboardcolumn getStoreFilter function to print out its filter value. Probably for somebody good with a browser debugger that would not have been necessary, but I'm not and it pinpointed the problem right away: The "value" field of the initiativeColumn configs should have been record.get('_ref'), not record.get('Parent'). I'll edit the code above so it works.
Now the basic board works great as a story map with portfolio items! Next step is to see if I can incorporate the concept of releases into the map.
Also, I think I found a bug in the 'rallycardboard' constructor-- if I pass it a context reference like: context: { project: 'project/XXX'} where XXX is an OID, it crashes. Instead I need to instantiate a context object and pass that. But that's inconsistent from other items like the wsapi store. Workaround is easy, but it is a bit annoying.
Related
I'm assembling a custom Rally app based on the SDK (v2). I have a list of stories (stories that my team is doing on behalf of some other team) - and I want to get the PortfolioItem/feature to which those stories are parented.
Looking for ideas on the optimal (performance) way to approach that. I suppose I could retrieve one feature at a time (how?) - though that causes network traffic per feature - but is there a way create a collection/model and fetch all the data in the collection at once? (something like "get me all the features in my list of of featureIds").
TIA
So first you'll start with getting the story model:
Rally.data.ModelFactory.getModel({
type: 'userstory',
success: this._onStoryModelRetrieved,
scope: this
});
And then with the model you can load individual stories like so:
_onStoryModelRetrieved: function(model) {
model.load(storyOid, {
fetch: ['FormattedID', 'Name', 'Feature'],
callback: this._onStoryLoaded,
scope: this
});
}
But you're right, there are perf issues with that. So alternatively you can create a store and create an or'ed together filter query of objectid's:
var storyObjectIDs = [12345, 23456, 34567];
Ext.create('Rally.data.wsapi.Store', {
model: 'userstory'
fetch: ['FormattedID', 'Name', 'Feature'],
filters: _.map(storyObjectIDs, function(storyOid) {
return {
property: 'ObjectID',
value: storyOid
};
}),
autoLoad: true,
listeners: {
load: function(store, records) {
//process records
}
}
});
I want to create a custom grid and only show userstories that have failed test cases. I checked the API docs and could not work it out.
I tried (TestCaseStatus < Complete) but did not get any results i also tried the same thing with defect status.
What is the specific syntax that i need to use?
In WS API documentation
TestCaseStatus attribute on HierarcicalRequirement object shows allowed values:
"NONE", "NONE_RUN", "SOME_RUN_SOME_NOT_PASSING", "SOME_RUN_ALL_PASSING", "ALL_RUN_NONE_PASSING", "ALL_RUN_ALL_PASSING"
If for example your custom app extends Rally.app.TimeboxScopedApp, and filters user stories by iteration, you may add another filter to exclude ALL_RUN_ALL_PASSING as follows:
onScopeChange: function() {
var filter = this.getContext().getTimeboxScope().getQueryFilter();
filter = filter.and({
property: 'TestCaseStatus',
operator: '<',
value: 'ALL_RUN_ALL_PASSING'
});
Ext.create('Rally.data.WsapiDataStore', {
model: 'UserStory',
fetch: ['FormattedID','Name','TestCases', 'TestCaseStatus'],
pageSize: 100,
autoLoad: true,
filters: [filter],
listeners: {
load: this._onDataLoaded,
scope: this
}
});
},
The full code is available in this github repo.
Baffled by this and not sure where to start looking.
I have a carousel which I load when the refresh event fires on my backing store:
Ext.define('Rb.store.Items', {
extend: 'Ext.data.Store',
requires: ['Rb.model.Item', 'Ext.data.proxy.Rest'],
config: {
storeId: 'itemstore',
model: 'Rb.model.Item',
proxy: {
type: 'rest',
url: '',
reader: {
type: 'json',
rootProperty: 'items'
}
},
autoLoad: false,
listeners:{
refresh: function( me, data, eOpts ){
console.log("refresh");
var carousel = Ext.ComponentQuery.query('rbdetailcarousel')[0];
carousel.removeAll(true);
console.log(carousel.getItems().getCount());
data.each(function(rec){
console.log(rec.data);
var rdcp = Ext.create('Rb.view.RbDetailCarouselPanel',{
cur_item: rec.data,
style: 'background-image:url(resources/startup/320x460.jpg);background-repeat:no-repeat;',
});
rdcp.items.get(1).setHtml(rec.data.name);
carousel.setActiveItem(rdcp);
});
carousel.setActiveItem(0);
}
}
}
});
My carousel is super simple:
Ext.define('Rb.view.RbDetailCarousel', {
extend: 'Ext.Carousel',
xtype: 'rbdetailcarousel',
config: {
itemId: 'rbdetailcarousel',
}
});
There are two things that are happening here that are strange:
When I call carousel.getItems().getCount(), right after the carousel.removeAll(true), I always get a return value of 1. If I inspect the carousel, there is still one item left in the carousel (it looks like it's the indicator??).
When I reload the store, it clears out all the items except the first one, so that as I refresh more and more I get repeats of the first item, then the remaining items added to the end. It seems as if the removeAll(true) is not removing that first item.
Any ideas on where I can look to solve this? I have a suspicion that I'm not grabbing the reference to the carousel correctly, because I shouldn't be getting back the indicator as one of the items in it, right?
Thanks
As hinted at by OhmzTech and answered on the sencha forum, I was adding items to my carousel which had duplicate itemId's. I'm still a little fuzzy on the standing of these ids (and to what extend they are used by the framework internally), apparently you don't want to have a single container with duplicate children itemIds.
I have an itemselecor inside a grid, and i have an combobox that should reload only the store inside the itemselector( the value fields should remain intact)
Here is the itemselector
var grid = Ext.widget('form', {
id: 'grid',
title: '',
width: 600,
bodyPadding: 10,
renderTo: 'itemselectorproduto',
items: [{
xtype: 'itemselector',
name: 'itemselector',
id: 'itemsel',
anchor: '100%',
imagePath: '/ux/images/',
store: store,
displayField: 'Nome',
valueField: 'ID',
value: vitrine,
allowBlank: true,
msgTarget: 'side'
}]
});
I tried to call the normal store.load(), but it have no effect and it shows no error on the console
If needed i will post more of the code, but i think just this should be enough
Thanks,
Looking through the code if ItemSelector it doesn't look like it supports any changes in the store once it's been binded. It basically creates local copies of the data. And if you call bindStore method to assign different store - it will erase your selection.
You can always improve code in ItemSelector to allow such behavior. It should not be a problem. You can subscribe to datachanged or load event of the store when binding to it, and then handle situation when store data is changed.
Actually i think the best way to do such thing is using ItemSelector`s "populateFromStore". Sure except of extending item selector. In case of extending you should look on the "onBindStore" function of the ItemSelector.
onBindStore: function(store, initial) {
var me = this;
if (me.fromField) {
me.fromField.store.removeAll()
me.toField.store.removeAll();
// Add everything to the from field as soon as the Store is loaded
if (store.getCount()) {
me.populateFromStore(store);
} else {
me.store.on('load', me.populateFromStore, me);
}
}
}
So as you see in case of the empty store it hooks to the load event. And it should be like this:
onBindStore: function(store, initial) {
var me = this;
if (me.fromField) {
me.fromField.store.removeAll()
me.toField.store.removeAll();
me.store.on('load', me.populateFromStore, me);
// Add everything to the from field as soon as the Store is loaded
if (store.getCount()) {
me.populateFromStore(store);
}
}
}
I'm having trouble redrawing my nested list with sencha touch 2. My code looks something like the following;
var data = {items:[{text:'hello', leaf:true}]};
Ext.application({
name:'main',
launch:function(){
Ext.define('ListItem', {
extend: 'Ext.data.Model',
config: {
fields: ['text']
}
});
var treeStore = Ext.create('Ext.data.TreeStore', {
id: 'mystore',
model: 'ListItem',
defaultRootProperty: 'items',
root: data});
Ext.create('Ext.NestedList', {
id:'mylist',
fullscreen: true,
store: treeStore
});
} // end launch:function()
}); // end Ext.application
During run time, I modify the data variable like so data.items[0].text = 'bye'. How do I get the nestedlist to refresh and show bye? I tried the following but none of them work:
var mystore = Ext.data.StoreManager.lookup('mystore');
mystore.setRoot(data);
Ext.getCmp('mylist').refresh(); // refresh, update, dolayout, repaint etc... does not exist.
Ext.getCmp('mylist').bindstore(mystore); // bindstore is deprecated
you should change data through record/store instances only then the Ext.NestedList will be automatically updated
var record = treeStore.getAt(0);
record.set('text', 'bye');
Working with data within a store is to be done using getById() and getAt(), which return Models that implement NodeInterface. Add data via appendChild, and the rest is self explanatory from there. The id value can be overridden in your data to make navigating the tree easier.
getStore().getById('myFirstLevelId').getById('mySecondLevelId').getById('myThirdLevelId')
http://docs.sencha.com/touch/2-0/#!/api/Ext.data.NodeInterface