OEMobile Popup

Posted by Roger Blanchard on 15-Sep-2014 07:42

I have defined a popup called MessagePopup which I use to display an error to the user. Prior to the MAB update in August when I used the Appery.navigateTo('MessagePopup', {transition: 'pop'}); the MessagePopup would be displayed as a popup. Since the MAB updeate in August this is no longer the case. The MessagePopup is displayed but just as a page with the title in the header truncated.

Is this a bug or expected behavior?

Posted by Sanjeva Manchala on 15-Sep-2014 08:04

Hi rblanchard,
 
Seems there is a change in backend code that gets generated for message popup from old version to new version. Can you check by replacing the line “Appery.navigateTo('MessagePopup', {transition: 'pop'});” with “Appery.openPopup('MessagePopup',$(this));”.
 
Hope this helps,
Sanjeev.
 
[collapse]
From: rblanchard [mailto:bounce-rblanchard@community.progress.com]
Sent: 15 September 2014 PM 06:13
To: TU.Mobile@community.progress.com
Subject: [Technical Users - Mobile] OEMobile Popup
 
Thread created by rblanchard

I have defined a popup called MessagePopup which I use to display an error to the user. Prior to the MAB update in August when I used the Appery.navigateTo('MessagePopup', {transition: 'pop'}); the MessagePopup would be displayed as a popup. Since the MAB updeate in August this is no longer the case. The MessagePopup is displayed but just as a page with the title in the header truncated.

Is this a bug or expected behavior?

Stop receiving emails on this subject.

Flag this post as spam/abuse.

[/collapse]

All Replies

Posted by Sanjeva Manchala on 15-Sep-2014 08:04

Hi rblanchard,
 
Seems there is a change in backend code that gets generated for message popup from old version to new version. Can you check by replacing the line “Appery.navigateTo('MessagePopup', {transition: 'pop'});” with “Appery.openPopup('MessagePopup',$(this));”.
 
Hope this helps,
Sanjeev.
 
[collapse]
From: rblanchard [mailto:bounce-rblanchard@community.progress.com]
Sent: 15 September 2014 PM 06:13
To: TU.Mobile@community.progress.com
Subject: [Technical Users - Mobile] OEMobile Popup
 
Thread created by rblanchard

I have defined a popup called MessagePopup which I use to display an error to the user. Prior to the MAB update in August when I used the Appery.navigateTo('MessagePopup', {transition: 'pop'}); the MessagePopup would be displayed as a popup. Since the MAB updeate in August this is no longer the case. The MessagePopup is displayed but just as a page with the title in the header truncated.

Is this a bug or expected behavior?

Stop receiving emails on this subject.

Flag this post as spam/abuse.

[/collapse]

Posted by Roger Blanchard on 15-Sep-2014 08:07

That resolved the issue. Thanks.

Posted by Roger Blanchard on 15-Sep-2014 08:14

Sanjeev,

Is there anyway to search/replace my mobile project to make this change globally?

Posted by Sanjeva Manchala on 15-Sep-2014 08:30

Hi rblanchard,
 
I think we don’t have such support as of now, since we can’t edit the generated source files manually. At present we can only view the generated source code from Mobile App Builder. But you can search for such statements by searching file “MyPhoneApp.js” from Mobile App Builder under ‘Source’ tab (WEB_RESOURCES/MyPhoneApp.js) or from PDS OE (<ProjectName>/<MobileAppName>/src/MyPhoneApp.js) and you have to navigate to each such event manually from ‘Events’ and then have to change the respective statement.
 
Hope this helps,
Sanjeev.
 
[collapse]
From: rblanchard [mailto:bounce-rblanchard@community.progress.com]
Sent: 15 September 2014 PM 06:45
To: TU.Mobile@community.progress.com
Subject: RE: [Technical Users - Mobile] OEMobile Popup
 
Reply by rblanchard

Sanjeev,

Is there anyway to search/replace my mobile project to make this change globally?

Stop receiving emails on this subject.

Flag this post as spam/abuse.

[/collapse]

Posted by Roger Blanchard on 15-Sep-2014 09:58

I spent the last hour going through MyPhoneApp.js in the MAB and made the changes. If I go into PDS OE I can see those changes. However, if I go back to MAB and open a page and then a datasource event the old code is still present. Shouldn't this be changed automatically?

Posted by egarcia on 15-Sep-2014 12:50

Hello,

The MyPhoneApp.js file is generated by the Mobile App Builder.

Even though the Source Tab can be used to edit generated files, these changes are not processed back into the designer.

The MyPhoneApp.js file would now be marked as modified and will not be regenerated.

(You can see this by adding code or by looking a the code via the web browser.)

Sanjeev Reddy's suggestion was to change them in the Event tab and use the source code to find the references.

The only cases where you needed to change navigateTo() to openPopup() would be for events using the "Run JavaScript" action.

Events using "Open as popup" action should generate the new code automatically.

You may probably want to revert this change so that MyPhoneApp.js is managed by the Mobile App Builder and be regenerated when adding/updating events in the app.

You could contact Technical Support so that they can give you assistance on reverting this action by using a backup file.

I found a way to do this from the Mobile App Builder for MyPhoneApp.js, in case you want to try.

Here are the steps:

1) Backup Mobile App. (The version option can also be used to create a restore to restore from.)

2) Remove MyPhoneApp.js.

3) Turn off "Render all pages in one HTML file" in App settings.

4) Test Mobile app. The Mobile App Builder will generate the HTML, CSS and JS files for all the pages in the app.

5) Turn on "Render all pages in one HTML file" in App settings.

5) Test Mobile app. The Mobile App Builder will generate all pages in one HTML, CSS and JS. This will then regenerate MyPhoneApp.js and clear the modfied flag.

I hope this helps.

Posted by Roger Blanchard on 16-Sep-2014 07:39

Edsel,

I recovered MyPhoneApp.js...thank you.

I will make these changes manually.

As far as the popup I do have a question. In the phone/tablet template that progress ships there is a popup called MessagePopup. On 'LOAD' is sets the text property of messagePopupText. This was probably an oversight as LOAD only fires once...the first time it is loaded. I changed this in our implementation to use PageShow to set the text of messagePopupText. This worked until the August release when the navigateto no longer worked. I now use Appery.openPopup but the PageShow does not fire. I have tried other events with no success. I am trying to set the text in messagePopupText from local storage when the popup is displayed. Any ideas?

Posted by egarcia on 16-Sep-2014 07:57

Hello Roger,

Thank you for letting me know.

There have been some changes to the popup implementation because changes in JQuery/JQuery Mobile.

The "Page Show" event no longer applies to popup. Instead, you could use the "After open" event instead. This event is listed in the "Popup events" section in the list of events.

Another change to popups is that you cannot do nested popups. You need close one popup before opening another.

I hope this helps.

Posted by Roger Blanchard on 16-Sep-2014 08:15

IT does help. I actually tried that yesterday but tried to use js to display an alert and that did not work...I now understand why.

Thanks.

Posted by Roger Blanchard on 18-Sep-2014 11:55

Edsel,

I thought I had my popup working but on certain pages it is opened with the header cut off and the content hidden partially by the header. I can email you a sample...not sure how to paste an image in this forum.

Posted by egarcia on 18-Sep-2014 12:33

Hello Roger,

A couple of things to check.

Do you see the issue only when running on iOS or also when running on in a web browser?

Are you using the latest library version for JQuery/JQuery Mobile?

Could you try setting the library version to 3.0 (App settings-->External resources)?

It looks like you are using the built-in ios7 theme.

Could you confirm the version of the theme (Project->Themes->ios7)?

I am guessing that the issue that you are seeing might be caused by a mismatch between the version of the libraries and the theme being used.

If you set the library version to 3.0 and use the latest version of the ios7 theme (JQuery Mobile 1.4.0) then the header should show correctly.

If the version of the theme is old, you can create a new theme and copy the new version from a new project or you can use themeroller.jquerymobile.com/index.php to upgrade a custom theme.

I hope this helps.

Posted by Roger Blanchard on 18-Sep-2014 12:51

I see it in iOS and web browser. I have not tested Android yet.

I am using the latest library version (3.0)..I just confirmed again.

Yes, iOS7 theme...just confirmed.

Should not the iOS7 theme version change when I upgraded the project?

Posted by Roger Blanchard on 18-Sep-2014 12:53

I just confirmed the jquery mobile is 1.4.0.

Posted by egarcia on 18-Sep-2014 14:27

Your set up seems to be fine. ios7  theme with version 1.4.0 and latest library (3.0).

You are also using openPopup() to open the popups.

The similar issues that I had seen in the past could be fixed by changing these.

I would suggest to contact Technical Support to report the issue.

It would help to have a reproducible case.

I wonder if you the rendering of the header would work if you add a button to it (perhaps on the right side).

(Notice that it is not common for iOS alert messages to have a close button in the header.)

I hope this helps.

This thread is closed