4 // This code is adapted from the work of:
5 // Created by Michael Nachbaur on 13/04/09.
6 // Copyright 2009 Decaf Ninja Software. All rights reserved.
11 * This class exposes mobile phone interface controls to JavaScript, such as
12 * native tab and tool bars, etc.
15 function NativeControls() {
17 this.toolBarIndexes = 0;
19 this.tabBarCallbacks = {};
20 this.toolBarCallbacks = {};
22 this.tappedToolBarItem = null;
23 this.selectedTabBarItem = null;
27 * Create a native tab bar that can have tab buttons added to it which can respond to events.
29 NativeControls.prototype.createTabBar = function() {
30 PhoneGap.exec("NativeControls.createTabBar");
34 * Show a tab bar. The tab bar has to be created first.
35 * @param {Object} [options] Options indicating how the tab bar should be shown:
36 * - \c height integer indicating the height of the tab bar (default: \c 49)
37 * - \c position specifies whether the tab bar will be placed at the \c top or \c bottom of the screen (default: \c bottom)
39 NativeControls.prototype.showTabBar = function(options) {
40 if (!options) options = {'position' : 'bottom'};
41 PhoneGap.exec("NativeControls.showTabBar", options);
45 * Hide a tab bar. The tab bar has to be created first.
47 NativeControls.prototype.hideTabBar = function(animate) {
48 if (animate == undefined || animate == null)
50 PhoneGap.exec("NativeControls.hideTabBar", { animate: animate });
54 * Create a new tab bar item for use on a previously created tab bar. Use ::showTabBarItems to show the new item on the tab bar.
56 * If the supplied image name is one of the labels listed below, then this method will construct a tab button
57 * using the standard system buttons. Note that if you use one of the system images, that the \c title you supply will be ignored.
61 * - tabButton:Favorites
62 * - tabButton:Featured
63 * - tabButton:TopRated
65 * - tabButton:Contacts
67 * - tabButton:Bookmarks
69 * - tabButton:Downloads
70 * - tabButton:MostRecent
71 * - tabButton:MostViewed
72 * @param {String} name internal name to refer to this tab by
73 * @param {String} [title] title text to show on the tab, or null if no text should be shown
74 * @param {String} [image] image filename or internal identifier to show, or null if now image should be shown
75 * @param {Object} [options] Options for customizing the individual tab item
76 * - \c badge value to display in the optional circular badge on the item; if null or unspecified, the badge will be hidden
78 NativeControls.prototype.createTabBarItem = function(name, label, image, options) {
80 var tag = this.tabBarTag++;
81 if (options && 'onSelect' in options && typeof(options['onSelect']) == 'function') {
82 this.tabBarCallbacks[tag] = {'onSelect':options.onSelect,'name':name};
83 //delete options.onSelect;
86 PhoneGap.exec("NativeControls.createTabBarItem", name, label, image, tag, options);
90 * Update an existing tab bar item to change its badge value.
91 * @param {String} name internal name used to represent this item when it was created
92 * @param {Object} options Options for customizing the individual tab item
93 * - \c badge value to display in the optional circular badge on the item; if null or unspecified, the badge will be hidden
95 NativeControls.prototype.updateTabBarItem = function(name, options) {
96 if (!options) options = {};
97 PhoneGap.exec("NativeControls.updateTabBarItem", name, options);
101 * Show previously created items on the tab bar
102 * @param {String} arguments... the item names to be shown
103 * @param {Object} [options] dictionary of options, notable options including:
104 * - \c animate indicates that the items should animate onto the tab bar
105 * @see createTabBarItem
108 NativeControls.prototype.showTabBarItems = function() {
109 var parameters = [ "NativeControls.showTabBarItems" ];
110 for (var i = 0; i < arguments.length; i++) {
111 parameters.push(arguments[i]);
113 PhoneGap.exec.apply(this, parameters);
118 * Function to detect currently selected tab bar item
119 * @see createTabBarItem
120 * @see showTabBarItems
122 NativeControls.prototype.getSelectedTabBarItem = function() {
123 return this.selectedTabBarItem;
128 * Manually select an individual tab bar item, or nil for deselecting a currently selected tab bar item.
129 * @param {String} tabName the name of the tab to select, or null if all tabs should be deselected
130 * @see createTabBarItem
131 * @see showTabBarItems
133 NativeControls.prototype.selectTabBarItem = function(tab) {
134 PhoneGap.exec("NativeControls.selectTabBarItem", tab);
138 * Function called when a tab bar item has been selected.
139 * @param {Number} tag the tag number for the item that has been selected
141 NativeControls.prototype.tabBarItemSelected = function(tag)
143 this.selectedTabBarItem = tag;
144 if (typeof(this.tabBarCallbacks[tag].onSelect) == 'function')
145 this.tabBarCallbacks[tag].onSelect(this.tabBarCallbacks[tag].name);
154 NativeControls.prototype.createToolBar = function()
156 PhoneGap.exec("NativeControls.createToolBar");
159 * Function called when a tab bar item has been selected.
160 * @param {String} title the title to set within the toolbar
162 NativeControls.prototype.setToolBarTitle = function(title)
164 PhoneGap.exec("NativeControls.setToolBarTitle", title);
167 * Added by Emile khattar: emile818@gmail.com emile@sign.al
168 * @ 2011-07-08 , 5.00 AM
171 * Set toolBarItems = nil;
173 NativeControls.prototype.resetToolBar = function() {
174 PhoneGap.exec("NativeControls.resetToolBar");
178 * @brief hide the tool bar
180 NativeControls.prototype.hideToolBar = function() {
181 PhoneGap.exec("NativeControls.hideToolBar");
185 * Show the tool bar ( re-render elements )
186 * @brief Show the tool bar
188 NativeControls.prototype.showToolBar = function() {
189 PhoneGap.exec("NativeControls.showToolBar");
193 * Set the toolbar title
196 NativeControls.prototype.setToolBarTitle = function(title) {
197 PhoneGap.exec("NativeControls.setToolBarTitle" , title );
202 * Create a new tool bar button item for use on a previously created tool bar. Use ::showToolBar to show the new item on the tool bar.
204 * If the supplied image name is one of the labels listed below, then this method will construct a button
205 * using the standard system buttons. Note that if you use one of the system images, that the title you supply will be ignored.
207 * <b>Tool Bar Buttons</b>
208 * UIBarButtonSystemItemDone
209 * UIBarButtonSystemItemCancel
210 * UIBarButtonSystemItemEdit
211 * UIBarButtonSystemItemSave
212 * UIBarButtonSystemItemAdd
213 * UIBarButtonSystemItemFlexibleSpace
214 * UIBarButtonSystemItemFixedSpace
215 * UIBarButtonSystemItemCompose
216 * UIBarButtonSystemItemReply
217 * UIBarButtonSystemItemAction
218 * UIBarButtonSystemItemOrganize
219 * UIBarButtonSystemItemBookmarks
220 * UIBarButtonSystemItemSearch
221 * UIBarButtonSystemItemRefresh
222 * UIBarButtonSystemItemStop
223 * UIBarButtonSystemItemCamera
224 * UIBarButtonSystemItemTrash
225 * UIBarButtonSystemItemPlay
226 * UIBarButtonSystemItemPause
227 * UIBarButtonSystemItemRewind
228 * UIBarButtonSystemItemFastForward
229 * UIBarButtonSystemItemUndo, // iOS 3.0 and later
230 * UIBarButtonSystemItemRedo, // iOS 3.0 and later
231 * UIBarButtonSystemItemPageCurl, // iOS 4.0 and later
232 * @param {String} name internal name to refer to this tab by
233 * @param {String} [title] title text to show on the button, or null if no text should be shown
234 * @param {String} [image] image filename or internal identifier to show, or null if now image should be shown
235 * @param {Object} [options] Options for customizing the individual tab item [no option available at this time - this is for future proofing]
238 NativeControls.prototype.createToolBarItem = function(name , title , image , options) {
239 var toolBarIndex = this.toolBarIndexes++;
240 if (options && 'onTap' in options && typeof(options['onTap']) == 'function') {
241 this.toolBarCallbacks[toolBarIndex] = {'onTap':options.onTap,'name':name};
242 //delete options.onSelect;
244 //modify the NativeControls.m to change the options quickly
245 // the instance name on the plugin can be passed with option for now it is hardcode in objc // Emile
246 PhoneGap.exec("NativeControls.createToolBarItem" , name , title , image , options );
250 * Function called when a tool bar item has been tapped.
251 * @param {Number} tag the tag number for the item that has been selected
253 NativeControls.prototype.toolBarButtonTapped = function(tag)
255 this.tappedToolBarItem = tag;
256 if (typeof(this.toolBarCallbacks[tag].onTap) == 'function')
257 this.toolBarCallbacks[tag].onTap(this.toolBarCallbacks[tag].name);
264 NativeControls.prototype.createActionSheet = function(buttonTitles,actionSheetTitle,cancelButtonIndex,destructiveButtonIndex)
268 if(actionSheetTitle != null)
270 options.title = actionSheetTitle;
272 if(cancelButtonIndex != null)
274 options.cancelButtonIndex = cancelButtonIndex;
276 if(destructiveButtonIndex != null)
278 options.destructiveButtonIndex = destructiveButtonIndex;
281 var params = [ "NativeControls.createActionSheet",options ];
282 for (var i = 0; i < buttonTitles.length; i++)
284 params.push(buttonTitles[i]);
286 PhoneGap.exec.apply(this, params);
288 this.actionSheetDelegate = {};
289 return this.actionSheetDelegate;
293 NativeControls.prototype._onActionSheetDismissed = function(index)
295 this.actionSheetDelegate.onActionSheetDismissed(index);
300 NativeControls.prototype.setStatusBarVisibilty = function(bHide)
302 PhoneGap.exec("StatusBar.setHidden",bHide);
309 window.plugins.nativeControls = new NativeControls();