Reputation: 65
Normally a user interacts with MyApp, that is, first scrolls, and then select an employee in a scrollview. A new feature is 'deeplinking' from another application, and then the sequence is based on the id in the given URL, that is programmatically select the employee and then scroll to it.
I noticed a difference in the behaviour of the following situations/workflows. 1) user scrolls and select in a employee, the details are shown, then alter the id in the URL to view another employee, the listview select and scrolls down automatically.
2) After loading the app, and copy paste a url with an employee id and date, the employee in the listview is selected (selectObject), but there is no automatic scroll action.
So, we have a own routine, called scrollToSelection, but also an deprecated message.
I have a state (loading_state) with a representRoute and a enterStateByRoute function.
representRoute: 'employee/:id/:date',
enterStateByRoute: function(context){
if ( this.get('loadingState').get('requiredDataLoaded') == YES ){
this.get('statechart').sendEvent('showEmployee', context.get('params'));
}
},
And in the next state (main_state) the called showEmployee function.
showEmployee: function(routeParams){
if (! this.isCurrentState()){
return;
}
if ( routeParams.hasOwnProperty('id') ) {
var id = routeParams.id;
var item = MyApp.store.find(MyApp.Employee, id);
if (! SC.none(item) && (item.get('status') & SC.Record.READY) ){
MyApp.employeeController.selectObject(item);
MyApp.employeeController.scrollToSelection();
}
},
And in the employeeController
scrollToSelection: function(){
this.invokeLast('realScrollToSelection');
},
realScrollToSelection: function(){
return;
var viewItems = $('.employeeListView').view();
var selectedItem = this.get('selection').firstObject();
if (viewItems.length > 0 && ! SC.none(selectedItem)){
var viewItem = viewItems[0];
var targetView = viewItem.itemViewForContentObject(selectedItem);
viewItem.scrollToItemView(targetView);
}
}.observes('status', 'length'),
Question: Is it possible to get the second workflow (deeplinking) working the same way as it is working in workflow 1 (user is altering the id in the url? So no need for a own routine at all.
I saw several a postings with suggestions, of making it a firstresponder?, use SC.ViewFor?, etc etc. But I wonder what is the correct/simple/short solution. Thanks in advance.
employeeScrollView
..
contentView: SC.ListView
contentBinding: 'MyApp.employeeController.arrangedObjects'
selectionBinding: 'MyApp.employeeController.selection'
How to apply the scrollToIndex correct? I got now a message 'not a function'. In the main_state.js/showEmployee(routeParams)
var id = routeParams.id
var item = App.store.find(App.Employee.id)
var contentIndex = App.employeeController.indexOf(item);
App.employeeController.selectObject(item)
App.employeeController.scrollToIndex(contentIndex)
This did the trick:
var view = App.calendarOverviewPage.getPath('calendarOverviewMainPane.calendarOverviewSplitView.leftView.employeeScrollView.contentView');
view.scrollToContentIndex(contentIndex);
Upvotes: 0
Views: 35