How to change a View from inside a view - apache-flex

I have one .mxml file (the Application) with a ViewStack (with 4 views) and a ControlBard, obviously I can change the views with it, but what I want to do is: in view #1 I have an image which I want to convert to a "hyperlink", so when I click it I go to View #2, is this doable? Also I would like to pass somehow some data (like a String) to that View #2 (lets say the it's a user avatar I click so I want to go to the second view which will show me his profile, that's why I need his name/id).

One way, loosely coupling, Create a custom event (SelectAvatarEvent?) with a property for name/id and dispatch it from View1 when the link is clicked. In the Application add an event listener for this custom event, and catch it, change the view index to View2 and create a function/property in View2 that you can pass the string/event to. Depending on how it is implemented, might need to account for delayed instantiation of View2.

Related

How to make pop-up data reflect selected record?

The case:
I have Activities as datamodel.
I have set Activities to have many-to-many relationship with themselves to represent a Parent / Child relationship.
I have set up an accordion widget. Each row of the accordion contain basic data about the Activity record + some buttons.
I have set one of the button's onClick functions to open a popup, which allows me to edit the Activity detail in a form.
When I click a different record from the same accordion, the form from the popup reflects the data in the selected record.
The problem:
I have nested accordions which represent the "Child" Activities of the Parent Activity.
I have also added a similar button, which opens a popup. I can open the popup, which targets the child records, but cannot make it open the specific record, from which I pressed the button.
So the popup open by default on the first child.
Please help - how can I make the popup change naturally to reflect the datasource / selected record of even nested datasources?
What I tried:
In order to try and make to popup work I have tried to set the datasource based on the relationship:
Activities: Sub_Activities(relation)
This works to the extent of showing the related items, but popup content does not dynamically change on clicking a different child record or clicking the button from a different child record.
In both cases what is shown is the first child record.
What I understand is that you have a set up in which you click a button and a popup shows. The popup should let you view/edit the record referenced in the row where the button is. If that is the case, then probably you already have almost everything setup for the next thing to work. First, add a string custom property to the popup and name it selectedKey. Then, on the onClick event of the button that opens the popup, add something like this:
var key = widget.datasource.item._key;
app.popups.MYPOPUP.properties.selectedKey = key;
app.popups.MYPOPUP.visible = true;
Now, go to the popup content and add the following on the onAttach event handler:
var key = widget.root.properties.selectedKey;
widget.datasource.selectKey(key);
This is the general idea of how to make it work; However, in order for it to work, your datsources in the widgets should be properly set up. Good luck!

Populate Data for TextField on change of LinkField in Magnolia

I have a CompositeField consisting of a LinkField and TextField in my dialog.
On select of data for LinkField, I want to populate the TextField also with a value related to the LinkField value.
Any idea how to do this?
This is for Magnolia CMS. I'm using the latest Magnolia version.
Thanks! :)
There is no ootb binding between different fields.
To create it, you would either need to write your own field that will internally encapsulate the link field and text field and register listener for link field value change and upon change set value for the text field.
Or you would need to rewrite dialog presenter to be able to register such listener on the link field when it's being created.
Sorry, don't have any code samples at the moment to demonstrate it. Hope the explanation is clear enough.
HTH,
Jan
Do you need to update the text field in view of the editor?
If not, this can be easily achieved by modifying the save action. Your form should have a commit button defined with class=info.magnolia.ui.admincentral.dialog.action.SaveDialogActionDefinition
Open SaveDialogActionDefinition and you'll see it points to info.magnolia.ui.admincentral.dialog.action.SaveDialogAction which, when executed, can manipulate the node before saving the session.
If you extended SaveDialogAction, added another method similar to setNodeName(Node node, JcrNodeAdapter item) and called it between setNodeName(...) and node.getSession().save(), you could set any additional property you wanted based on those entered by the user.
You would also need another definition class that referenced your new action so your dialog definition knew to use the new action on commit.

How to get picture directly once we capture it? (Without usephoto/cancel step in the middle) (iOS 7)

Generally we use UIImagePickerDelegate to get the selected image from user. I need the image after the user captured it without asking usephoto/ cancel. Is it possible?
Step 1 : Remove default camera controls by this method.
[pickerController setShowsCameraControls:NO];
Step 2 : Create an Overlay view and put one button on the overlay view to capture image.Set the view as picker controller's overlay view.
[pickerController setCameraOverlayView:camOverlay];
In the button action write this method:
[pickerController takePicture];
This automatically calls the delegate method and we will get the image directly with out use photo or cancel Step.
NOTE: Source type of picker controller should be camera to implement the above stuff.
pickerController.sourceType = UIImagePickerControllerSourceTypeCamera;
set delegate to self.

Show alert if moving on without saving in Flex?

Functionnaly :
On one of my components of my application, I have an editing/lock system. When a user starts editing, he locks the file so other users cannot edit it.
Problem scenario : When the user activates "edition mode" and leaves screen, I would like to show a alert with two options : save changes, or discard changes.
There are different ways to exit screen :
There is a List on the left side containing other possible editabel data. A click changes the data in my component.
There is a menubar on top leading to other screens.
The edition component is embedded in a Tab navigator. When changing tabs, the alert has to show.
Closing browser.
Do I have to catch all of these events and plug at all those places?
Is there any kind of focusout mecanism?
The answer to the first question is: YES.
You need to watch all possible exit events that could harm the currently edited data.
Well, the problem is now how to manage this properly. Using an MVC framework you would trigger the appropriate commands from your components:
CHANGE_LIST_ITEM (new item)
CHANGE_TAB (new tab)
CHANGE_SCREEN (new screen)
Each command then checks if the currently edited tab has been saved or not. If not, it displays the Alert. Else, if there are no changes, it allows the list, the screen chooser and the tab bar to continue.
So your components (list, screens, tabs) need to implement some kind of rollback or preventDefault mechanism. Generally, changing their state must be allowed by a central validator (in MVC the command).
In the case of the list: I would suggest that the list is not selectable by mouse click but only programmatically. You set a listener on the list item click event. If the command allows setting of a new item it will notify the list. In MVC usually by sending an async message that gets received by the list's mediator. [[And even more correct: The command would set some model properties (e.g. currentListItem) and the model than sends an async message.]]
Edit: For the browser close event, you need to call a JavaScript expert.

Flex 4, multiple instances of a custom component listening the same event of a parent

In short:
I need an event listener in a custom component so all its instances (without editing them) react at the same time, fired by a dispatched event in its parent container.
In detail:
I have a custom component with Tab navigator. (The tabs are intended to show different preferences for different Languages.)
I have a button bar with buttons for all the languages.
There are a lot of instances of the custom component.
I want to click in a button of the languages bar and get ALL the instances switched to the same tab (the custom component contains the logic to change the tab).
I can do it by adding the event listener for EACH INSTANCE of the custom component, so it calls an internal function that changes the tab. But it seems to be very coupled, isn't it?
I wonder if it can be done in the master CLASS of the component, so it listen for events in its parent container, whichever it is.
In my mind this code shoud work, but it doesn´t (obviously ill'use a custom event to pass the new language value):
this.parent.addEventListener("lang_change", this.change_tab);
This way I can just drop an instance of the component, and see it working for itself.
Thank you in advance
I need an event listener in a custom
component so all its instances
(without editing them) react at the
same time, fired by a dispatched event
in its parent container.
The very thing you want to do, by definition, breaks encapsulation. In an ideal world, a component should know nothing of it's parent. If the component needs to communicate with it's parent, it should dispatch an event. IF a parent needs to communicate to children it should call a public method on that child (or change a public property). From an encapsulation stand point, I cannot recommend that the child listen for events on the parent.
I want to click in a button of the
languages bar and get ALL the
instances switched to the same tab
(the custom component contains the
logic to change the tab).
So, then put a click handler for the button and do something like this:
public function onClick():void{
myCustomTabNavigator1.selectedIndex = 1
myCustomTabNavigator2.selectedIndex = 1
myCustomTabNavigator2.selectedIndex = 1
}
You can also set the selectedItem if you a reference to it. , If you have your custom TabNavigators in an Array, you can loop over them. IF the custom TabNavigators are child of your custom component you can create a method in that custom component to set the defaults and call that method on each component instead of setting selectedIndex directly.
I think you should to use some MVC model like:
Cairngorm
http://code.google.com/p/swizframework/
http://www.robotlegs.org/
http://puremvc.org/

Resources