Gades,
Take the Yahoo! News widget as an example. You have a main sidebar where the buttons are dynamically generated based upon the number of categories retrieved from the web service. Then, depending upon which button is selected, you're taken to the next view which is basically a grid that lists all of the news stories in the selected category. If you then select one of the news stories, you're then taken to that story's detail view. So, basically you have three different views; the main sidebar with the buttons, the selected category view with its grid of news stories, and the news detail view.
The only thing that changes is the data used to populate the grid and the information presented on the detail view, and you should retrieve this information from your web service(s). Nothing is hardcoded. When you select a category, the next view (the category list view) is passed the information it needs in the persist object. When you select an individual story, the data the detail view needs is passed along and can be accessed via its this.persist object.
So, think of the basic building blocks that you'll widget will need and then reuse them. Remember, the goal is code reuse.
- Ben
Hi, I'm facing an issue with adding dynamic sidebars. I scanned the forum to see if any one had the same issue, but couldn't find any threads with the exact issue. If I'm not supposed to reply to an old thread my apologies!!
I'm trying to create dynamic buttons on a side bar view and then when one of those buttons is selected it will open up another view (a dynamic parameter is passed in the loadview method).
I basically copied the Snippet Example of the widget and changed the subview2.js and added the below for loop code which will add buttons dynamically and will load subview1.js (the same one which comes with the snippet example) by passing the foo parameter. Every thing works fine if the code is not in a for loop and if I statically define 2 buttons and call subview1 from each button with different values for foo. But when I put the whole thing in a for loop , the buttons appear correctly but whichever button I select subview1 comes up with the value of the foo corresponding to the last iteration of the for loop (in this case k will be 1 in the last iteration and foo has value 1 when i click on both buttons).
Here is the code in subview2.js which adds the button dynamically
CODEBOX
for(var k=0;k<2;k++){
var buttonnmame = "buttonname"+k;
this.controls.buttonname = new KONtx.control.TextButton({
label: k,
guid: "buttonguid"+k,
events: {
onSelect: function(event) {
KONtx.application.loadView('view-Sub1', {foo: k });
}
},
styles: {
width: Theme.viewSpecs.SIDE_BAR.width,
height: KONtx.utility.scale(35),
vOffset: KONtx.utility.scale(35*(k+1)),
}
}).appendTo(this);
}
I have been scratching my head on this for couple of days since I didn't want to post something if it was already addressed else where in the forum, but now I'm desperate for help :)Please note the code of subview1.js is exactly same as the one which comes with snippet sample and subview2.js was modified to add the dynamic buttons. Not sure if this has anything to do with the snippatableview.js from which these 2 views are extended.