Extjs best practice of communication between several ViewControllers and Views - extjs

The question is, how to build a common application using extjs5 where within the west region I have a treepanel and within the center region I want to add panels depending on the treepanel items click. The panels should go in separate files and should have it's own ViewControllers in separate files also. Regions are in a viewport. The viewport has it's own MainViewController.
I've tried to get a ViewController from MainViewController, but unfortunately I didn't find the right solution.
I've also tried instead of several ViewControllers create common Controllers and call their methods from MainViewController like this:
MyApp.app.getController('ConnectionController').showPanel();
but i can't get an idea how to get a View from it's Controller - all of the bellow return undefined:
console.log(Ext.ComponentQuery.query('#connection')[0]);
console.log(Ext.getCmp('connection'));
console.log(this.lookupReference('connection'));
After all I decided it is a wrong communication model. Any suggestions will be appreciated.

I've finally figured it out. To make a communication between MainViewController and Panels it is possible to create already defined panel from view controller like this:
var panelToAddName = Ext.create('MyApp.view.Panel1View', {});

Related

Reference a combobox within a grid with a cell editing plugin in Sencha Test (without global search)

Given there is a Grid using a cell editing plugin is there a way to reference a combobox editor without doing it in a global way ?
I have this working:
this.grid().rowAt(0).cellAt(0).click(); // click to show the combo
ST.comboBox('combobox[itemId=someID]').expand().setValue(1); // this works but looks for the combo globally
BUT I think I should be able to do:
this.grid().gotoComboBox('combobox[itemId=someID]'); // this doesn't work
or something like:
this.window().gotoComboBox('combobox[itemId=someID]'); // this doesn't work either (grid is within a window)
All of the goto() methods ultimately use Ext.ComponentQuery/down() to traverse the component hierarchy to resolve the future's component. If you were to try this yourself apart from the ST API, you'd find that you can't get the instance of the combobox by doing down() on the grid or its parent (e.g, grid.down('combobox[itemId=someId]').
I think a nice feature would be to have some apis in the row/cell futures that would enable specific actions on editors. It's an area we see a lot of questions in, so that would probably be a more robust solution. I'll add a feature request for it.

What is alternative to use customised alert views in ios7?

in ios6 I had UITextfield placed on UIAlertview to take inputs from user.
but in ios7 it don't seem to be working.
Any idea how to achieve that in ios7?
Thanks,
Virat
For the same task I'm creating UIView subclasses that I add as subviews to the main window. This way they will appear on top of everything and I'm in control of the layout & functionality.

MVVM - dynamically create multiple instances of view/viewmodel

I have a requirement to display a number of graph/chart "thumbnails". Clicking one will show an "expanded view" (in a separate panel) that displays a larger version of the chart, plus controls to view and manipulate the chart.
There will be a number of different charts, each plotting my data in different ways. Also, a given chart type may appear several times, each plotting a different subset of the data. The controls in the "expanded" view will also differ from one chart type to the next, so there is little commonality here.
I'm struggling to get my head around how to model all this in MVVM, especially given the need to dynamically create an unknown number of thumbnails (and in some cases multiple instances of the same type).
Thinking aloud, I guess I need a view/viewmodel that represents a single thumbnail (the view contains the chart component and the VM exposes the data to plot). I guess I also need a V/VM for the "thumbnail list" UI, responsible for creating the thumbnails and exposing them via a collection for binding to the list. But how does it instantiate these? A VM gets injected into its view, suggesting the "thumbnail list" VM would have to dynamically instantiate the thumbnail views - but a VM shouldn't have knowledge of views should it?!
Lastly, when I display the "expanded" view, it would make sense to (somehow) pass it the charting component/view that was used in the thumbnail, to avoid having to render the chart again, but how?
If it's relevant/helps, I'm using Castle Windsor for dependency injection, and the navigation features of Prism.
This is indeed a complex topic,...
I would suggest a VM for the list of icons not necessarily for the icon itself. this can be bound to properities of the IconListViewModels. Then you should think about a ChartViewModelFactory. Which works in conjunction with your DIC.
An important discussion is the VM-V marriage. View first or View Model first... one way could also be ViewResolver if which returns the matching view based on your view model... this can rely on some sort of conventions. So the final steps could be ask the factory for a view model find the matching view glue them together and bind them to a content presenter...
I hope this helps to get you started...

Backbone.js - Moving data from one view to another

How to send data from one view to another which are on different urls?
A little bit strange question, but OK, let's try to imagine your problem in complex and give an answer.
Imagine application for reading books (like iBooks in web). We have one parent View called ApplicationView which creates several children views and some of them are BookshelfView (available on #bookshelf url) and BookView (available on #book/:id url).
Now, you mark your book as unread from your BookView and you know that your BookshelfView should change the appearance of this book. OK, it is not "moving data from one view to another". You just change the state of your model and your views catch this "change" event and update their html.
Let's describe more complicated situation. Imagine the same application. But at this time you decide to switch portrait orientation to landscape orientation. You make it in one view and you want this change to affect other application views. This can be done in several ways:
Views should stay loosely coupled you should use some kind of mediator pattern.
From Backbone 0.9.9 you can use global Backbone object as Mediator, as Backbone supports Events interface
You can create and additional model for Mediation between two or more views but there is more beautiful solution:
If you have one parent view for several child views you already have that mediator. Just send events to parent view from one view and listen to that events on parent from other view.
I also recommend you check this question

WPF/Prism: Nested views and toolbar

I have a WPF/prism application similar to the mockup shown below:
Both TabControls contain a separate Prism region, the second one being nested into the first one. Now the toolbar should activate/deactive items depending on which view is currently active.
The toolbar is currently defined in the shell.
I tried using some sort of registry, where each ViewModel could register the toolbar commands it supports. However I then realized that the toolbar cannot know which view (and therefore which viewmodel) is active.
The problem is in the nesting, without that I could probably achieve what I wanted by binding the TabControl.SelectedItem property to the toolbar and use my registry from above.
Maybe there is a better way to do this? Or a way to let the toolbar find out which view is active?
edit: I now tried to use ActiveAware ViewModels as descriped in this article: http://www.codeproject.com/Articles/56826/ViewModel-Active-Awareness-in-a-Prism-Based-Applic, however I now have the problem that when I switch from Tab "One" to Tab "Two" and back, the nested tab's "First Tab" GotFocus event is not fired, meaning the toolbar will represent the wrong view.
Maybe this is the way to go?
edit 2: The problem seems to be that the second tabcontrol is not inside it's own scoped region. I'm using the ViewDiscovery approach to add views to my regions, so I'm not explicity creating the regionmanager in a scope. SyncActiveState seems to work only with scoped regions, as the first tabcontrol viewmodels correctly get updated when switching views.
Is there a way to use XAML to create a scoped region instead of a normal one?
The problem here is that the toolbar does not know anything about the active region; they are deliberately decoupled.
I would (personally) use the Event Aggregator to publish messages from the active ViewModel to say "I am currently active" and have the toolbar subscribe to those messages and update the buttons as appropriate.
If I were attempting to do this, I would probably create an IToolbarManager which has bool properties for each of the available toolbar actions, and an ICommand for the actions themselves.
Then, implement this interface in a concrete type where the bool properties change the CanExecute values of the commands, and call CommandManager.InvalidRequerySuggested. Register this type as a singleton with the container, then use DI to inject it into each of the views and into the shell. The Shell can then databind the Toolbar buttons to the Commands in the IToolbarManager, and the views can then set whether or not the actions are enabled as they get initialized.
I don't have a code sample because I'm just thinking through how I'd solve this, but hopefully you can follow what I'm suggesting, and it proves helpful.
I now ended up with creating an extended TabControl that uses the SelectionChanged event to set IsActive on all items implementing a specific interface. Also it walks down the VisualTree and finds any extended TabControl and does the same for the items of these and so on.
Work pretty well here, we only use TabControls so far, so this solution works for me.

Resources