Titanium Mobile 3.0 Navigation Controller pass variables between windows - titanium

I am using swanify's Titanium Navigation Controller https://github.com/swanify/Titanium-Navigation-Controller for my app deployed in Android device.
i am trying to pass data that i have selected from a table row here back to the previous page and populate a text field there.
Anyone has any ideas how to do it? i am looking into using events but it doesnt seem to be working for me.
thank you. :)

Here is what I have done in this situation, It makes use of the eventing aspects of JavaScript and Titanium, the general principle is to have your own custom events, fire them on a control, and listen elsewhere.
First lets say we have a file named NextWindow.js that is a CommonJS module encapsulating a window and a tableview, everytime the a row is clicked we capture that event, then fire our own custom event on the window:
function NextWindow() {
var self = Ti.UI.createWindow();
var tableView = Ti.UI.createTableView();
// Other initialization
....
....
tableView.addEventListener('click', function(e) {
// You may have to use e.rowData.title depending on how you created the table view
var rowTitle = e.row.title;
// Now fire a custom event on the window whenever a row is selected
// send the title through as data
self.fireEvent('table_row_selected', {title : rowTitle});
});
return self;
}
module.exports = NextWindow;
When you create a NextWindow to push onto the navigation stack, add a listener for a custom event to it, this is inside of the previous window with the text box:
var NextWindow = require('NextWindow');
var nextWindow = new NextWindow();
nextWindow.addEventListener('table_row_selected', function(e) {
// Do what you want here with the passed back data
var title = e.title;
some_label.text = title;
});
// Open the next window on the NavigationController stack
nav.open(nextWindow);
Now were listening for a custom event attached to the nextWindow. Say you have a TableView in your nextWindow, listen for the TableView click, and fire the custom event:

Related

Titanium/ Alloy: Add event listener to a window

I have the following code in index.js:
var win = Alloy.createController('foo').getView();
win.open();
win.addEventListener('exampleEvent', function () {
Ti.API.info('Event Run!'); // does not seem to run
});
on foo.js I have the following:
function runEvent() {
$.trigger('exampleEvent');
$.getView().close();
}
// execute runEvent() somewhere later
However, the function in the event listener does not seem to run.
What am I doing wrong?
You are missing a point that custom events can only be added on a controller, not on the view.
var win = Alloy.createController('foo').getView();
In this line, you are holding the view by using getView() in win variable.
Now, it should be like this:
var win = Alloy.createController('foo');
win.on('exampleEvent', function () {
Ti.API.info('Event Run!'); // it will run now as you have added custom event on controller (means $ in .js file) itself.
});
// now you can get the top-most view (which is a window in this case) and can further use open() method on window
win.getView().open();
foo.js will remain same:
function runEvent() {
$.trigger('exampleEvent');
$.getView().close();
}
// execute runEvent() somewhere later
In my case, i was using
var controller = Alloy.createController('myController');
controller.addEventListener("customEvent",function(){});
I've been smacking my head for the last hour...
on top of what #PrashantSaini presented, there s no addEventListener on controller objects, controllers have the on function, so it should be :
controller.on("customEvent",function(){});
update
My answer is a heads up for the fact that there no addeventlistener on controller object.

Google Script app.createServerHandler Missing ; before statement line 8

I'm working on a Leave Request form on our Google site. If I comment out the app.createServerHandler line it is fine. What am I missing from the below code?
var app = UiApp.createApplication().setTitle('OIT Leave Request');
//Create a panel to hold the form elements
var panel = app.createVerticalPanel().setId('panel');
//Create event handlers for form
var AllDayBoxHandler() = app.createServerHandler('AllDayBoxEvent');
Check this link.
I believe what you're trying to do is depreciated. But either way I think your setting the handler wrong. Something like:
function doGet(e) {
var app = UiApp.createApplication().setTitle('OIT Leave Request');
//Create a panel to hold the form elements
var panel = app.createVerticalPanel().setId('panel');
app.add(panel);
//Create event handlers for form
var AllDayBoxHandler = app.createServerHandler('AllDayBoxEvent');
//Not exactly sure what events a panel can get
//A button would have a .addClickHandler method
panel.addOpenHandler(AllDayBoxHandler);
return app;
}
//The event handler method
function AllDayBoxEvent(e) {
// your code
}

stop sounds after going back to the previous tab

I have a simple tabbed app where the user can click a button and then a view will load in the active tab where a picture is displayed and a sound is being played.
However if the user tabs on the back button the sound doesn't stop playing.
How can I make the sound stop when I go to the previous view?
Thanks in advance!
My index.js:
function viewSelectedItem() {
var args = { image : 'images/photo/farm/chicken1.jpg', title : 'kip' };
var win = Alloy.createController('viewItem', args).getView();
Alloy.Globals.tabgroup.activeTab.open(win);
}
my viewItem.js
var args = arguments[0] || {};
$.itemImage.image = args.image;
$.itemTextLabel.text = args.title;
var sound = Ti.Media.createSound({
url: 'sounds/farm/chicken1.mp3'
});
sound.play();
I assume you target Android with this and that each Alloy Controller represents a Window.
You need to set allowBackground to true to allow the audio to continue when the Activity the Window belongs to is stopped because the Window closed.
http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.Media.AudioPlayer-property-allowBackground
I fixed it like this:
$.itemView.addEventListener('close', windowClosed);
function windowClosed() {
sound.stop();
}

Handling Windows 8 lifecycle

i have run into a problem, that my app sometimes Activates and sometimes Launches when i open something via:
var options = new Windows.System.LauncherOptions();
options.DisplayApplicationPicker = false;
bool success = await Windows.System.Launcher.LaunchFileAsync(sampleFile, options);
When app re-activates it shows the same window - when i went to an external app using LaunchFileAsync - this is nice.
But sometimes the app launches, i see a SplashPage and app is beginning from the MainPage. - how can i make this also to return to the page, that i left when used LaunchFileAsync?
Example:
I have a MainPage and a BlankPage1
So here is my page on suspend+shutdown (terminate) 8 buttons:
On Restore 0 buttons, I WANT TO SAVE MY VIEW XAML CODE when app gets killed by system:
It depends entirely on the conditions of your application shutdown. Was it suspended and terminated automatically by the OS ? or did you close it yourself ? (ex : ALT-F4)
You can see here the application lifecyle : http://msdn.microsoft.com/en-us/library/windows/apps/hh464925.aspx
If you want your application to restore its previous state on a user shutdown, I think you can enable it on your OnLaunched method in you App.xaml.cs :
if (args.PreviousExecutionState == ApplicationExecutionState.Terminated
|| args.PreviousExecutionState == ApplicationExecutionState.ClosedByUser)
{
try
{
await SuspensionManager.RestoreAsync();
}
catch (SuspensionManagerException)
{
}
}
Then, if your Page extends LayoutAwarePage, you have two methods, SaveState and LoadState.
These methods are called automatically when navigating from or to the frame (including suspending/restoring/opening...).
If you save your data behind your buttons in your SaveState method, you can restore it in the LoadState method (and thus redraw your buttons). There is a detailled exemple here : http://msdn.microsoft.com/en-us/library/windows/apps/hh986968.aspx

How do I determine open/closed state of a dijit dropdownbutton?

I'm using a dijit DropDownButton with an application I'm developing. As you know, if you click on the button once, a menu appears. Click again and it disappears. I can't seem to find this in the API documentation but is there a property I can read to tell me whether or not my DropDownButton is currently open or closed?
I'm trying to use a dojo.connect listener on the DropDownButton's OnClick event in order to perform another task, but only if the DropDownButton is clicked "closed."
THANK YOU!
Steve
I had a similar problem. I couldn't find such a property either, so I ended up adding a custom property dropDownIsOpen and overriding openDropDown() and closeDropDown() to update its value, like this:
myButton.dropDownIsOpen = false;
myButton.openDropDown = function () {
this.dropDownIsOpen = true;
this.inherited("openDropDown", arguments);
};
myButton.closeDropDown = function () {
this.dropDownIsOpen = false;
this.inherited("closeDropDown", arguments);
};
You may track it through its CSS classes. When the DropDown is open, the underlying DOM node that gets the focus (property focusNode) receives an additional class, dijitHasDropDownOpen. So, for your situation:
// assuming "d" is a dijit.DropDownButton
dojo.connect(d, 'onClick', function() {
if (dojo.hasClass(d.focusNode, 'dijitHasDropDownOpen') === false) {
performAnotherTask(); // this fires only if the menu is closed.
}
});
This example is for dojo 1.6.2, since you didn't specify your version. It can, of course, be converted easily for other versions.