EzDevInfo.com

phonegap - splash screen for Android app

Could anybody please advise how I can add a splash screen to my HTML5 Phonegap based Android App. I just want it to display for 5 seconds on load. Also - can anybody advise what dimensions the splash screen should be.

Phonegap + jQuery Mobile, real world sample or tutorial

Does anyone know of a really good tutorial or sample project where Phonegap and jQuery Mobile is used for a real world example?

All the examples I found were showing fancy transitions or theming in jQuery Mobile. The Phonegap examples mostly showcases the Phonegap API.

I could not find a single example where Phonegap and jQuery Mobile was used to solve real world problems, such as writing a app that combines Phonegap and jQuery Mobile to do user input validation, saving the data, uploading data to a web service, etc.

iOS 7 Status bar with Phonegap

In iOS 7, Phonegap applications will appear underneath the status bar. This can make it difficult to click on buttons/menus that have been placed at the top of the screen.

Is there someone who knows a way to fix this status bar issue on iOS 7 in a Phonegap application?

I've tried to offset the entire web page with CSS but it doesn't seem to work. Is there a way to like offset the entire UIWebView or just make the status bar behave like it did in iOS6?

Thanks

Is there a difference between PhoneGap and Cordova commands?

I just installed Phonegap for the first time and just browsed through the docs. What confuses me is the fact that some docs are using the command "phonegap" and some "cordova".

Android platform guide:

$ cordova create hello com.example.hello "HelloWorld"

Command Line Interface guide tells:

$ phonegap create hello com.example.hello HelloWorld

Is there a difference between those two commands (resulting in different files and folder structures) or are they just aliases for the same thing?

cordova platform add android not working while listing Android targets

I got problem when i want to add an android platform to my phoneGap application. I got this message in my CLI when i execute the command cordova platform add android :

Checking Android requirements... (Error: An error occurred while listing Android targets)

I already try to add my android sdk location in the path variable.

Please help me ! :D

I work on Windows 7 64 bits, i install the android API 17, 18 and 19 with the android SDK. I am on 3.2 phoneGap version.

Error: ANDROID_HOME is not set and android command not in your path You must fulfill at least one of these conditions

I try to install Phonegap and am getting the following error:

"Error: ANDROID_HOME is not set and "android" command not in your PATH. You must fulfill at least one of these conditions.".

Error (screenshot)

What do I do to ensure android is set up correctly for use with Cordova?

Correct way of using JQuery-Mobile/Phonegap together?

What is the correct way (to this date) to use JQuery Mobile and Phonegap together?

Both frameworks need to load before they can be used. How can I be sure that both are loaded before I can use them?

Error executing command 'ant' on Mac OS X 10.9 Mavericks when building for Android with PhoneGap/Cordova

Today I tried PhoneGap/Cordova with Mac OS X Mavericks. Building for iOS went just fine, but building for Android wasn't without some guesswork.

I installed Android 4.2.2 via the Android SDK Manager (I had to use the older API v17 since it wasn't compatible with a newer one), added the PATH environment variables for the SDK's platform-tools and tools and thought I was ready to take off by running the command:

phonegap run android

Nevertheless, I got the following error:

[phonegap] detecting Android SDK environment...
[phonegap] using the local environment
[phonegap] adding the Android platform...
[error] An error occured during creation of android sub-project. ERROR : executing command 'ant', make sure you have ant installed and added to your path.

Phonegap Cordova installation windows

The documentation for phonegap/cordova is absolutely horrible. All i'm trying to do is install PhoneGap 3.0 on my windows environment but having no success.

Below are my steps and points of failure. Can anyone advise on solutions?

According to the instructions:

1. Install Node.js (SUCCESSFUL)
2. From nodes.js: "install -g cordova" (SUCCESSFUL)
3. Add Platform: "cordova platform add wp8" (NOTHING HAPPENS)
4. Try with phonegap: "phonegap install wp8" (ERROR project directory could not be found)

From "Windows Phone 8 platform guide"

1. Install Windows SDK (SUCCESSFUL)
2. "Download and extract the latest copy of [PhoneGap. You will be working in the lib\windows-phone-8\wp8 subfolder, lib\windows-phone-8\wp7 contains the Windwos Phone 7 version of Cordova"

HUH?!?! What what location is the directory?!?! So I've found the undocumented phonegap directory buried in AppData\Local... and there IS a libs directory but there certainly is NOT any WP8 subfolders. Where would one install that from? Presumably the add platform command above, but add that simply returns me to a new command prompt.

Tried using the phonegap command: "phonegap plaform add wp8"

ERROR - 'platform add wp8" is not a node.

I get its open source but this is brutal spaghetti reference documentation. If anyone has been able to successfully install 3.0 for WP8 any pointers would be help.

How do I correctly detect orientation change using javascript and Phonegap in IOS?

I found this orientation test code below looking for JQTouch reference material. This works correctly in the IOS simulator in mobile safari but doesn't handle correctly in Phonegap. My project is running into the same issue that is killing this test page. Is there a way to sense the orientation change using javascript in Phonegap?

Any help would be appreciated.

window.onorientationchange = function() {
      /*window.orientation returns a value that indicates whether iPhone is in portrait mode, landscape mode with the screen turned to the
        left, or landscape mode with the screen turned to the right. */
      var orientation = window.orientation;
      switch(orientation) {
        case 0:
            /* If in portrait mode, sets the body's class attribute to portrait. Consequently, all style definitions matching the body[class="portrait"] declaration
               in the iPhoneOrientation.css file will be selected and used to style "Handling iPhone or iPod touch Orientation Events". */
            document.body.setAttribute("class","portrait");

            /* Add a descriptive message on "Handling iPhone or iPod touch Orientation Events"  */
            document.getElementById("currentOrientation").innerHTML="Now in portrait orientation (Home button on the bottom).";
            break; 

        case 90:
            /* If in landscape mode with the screen turned to the left, sets the body's class attribute to landscapeLeft. In this case, all style definitions matching the
               body[class="landscapeLeft"] declaration in the iPhoneOrientation.css file will be selected and used to style "Handling iPhone or iPod touch Orientation Events". */
            document.body.setAttribute("class","landscape");

            document.getElementById("currentOrientation").innerHTML="Now in landscape orientation and turned to the left (Home button to the right).";
            break;

        case -90: 
            /* If in landscape mode with the screen turned to the right, sets the body's class attribute to landscapeRight. Here, all style definitions matching the
               body[class="landscapeRight"] declaration in the iPhoneOrientation.css file will be selected and used to style "Handling iPhone or iPod touch Orientation Events". */
            document.body.setAttribute("class","landscape");

            document.getElementById("currentOrientation").innerHTML="Now in landscape orientation and turned to the right (Home button to the left).";
            break;
      }
    }

PhoneGap: Detect if running on desktop browser

I'm developing a web application that uses PhoneGap:Build for a mobile version and want to have a single codebase for the 'desktop' and mobile versions. I want to be able to detect if PhoneGap calls will work (ie, is the user on a mobile device that will support PhoneGap).

I've searched and cannot believe there is no simple way of doing this. Many people have offered suggestions;

• http://www.sencha.com/forum/showthread.php?144127-Checking-if-running-in-PhoneGap-or-Mobile-Web-Browser
• http://groups.google.com/group/phonegap/browse_thread/thread/322e80bd41bb1a54/a421300eb2a2029f?lnk=gst&q=detect+desktop#a421300eb2a2029f
• http://groups.google.com/group/phonegap/browse_thread/thread/8a95dfeb0f313792/3ff10d8f35211739?lnk=gst&q=detect+desktop+browser#3ff10d8f35211739

None of which work, unless you remove the PhoneGap Javascript file from the desktop version of the app, which defeats my goal of having one codebase.

So far the only solution I have come up with is browser / user agent sniffing, but this is not robust to say the least. Any better solutions welcome!

EDIT: A marginally better solution is to try calling a PhoneGap function after some small timeout - if it doesn't work, then assume the user is on a desktop web browser.

External resource not being loaded by AngularJs

Using Angular and Phonegap, I'm trying to load a video that is on a remote server but came across an issue. In my json, the url is put in as just a plain http url

"src" : "http://www.somesite.com/myvideo.mp4"

My video template

 <video controls poster="img/poster.png">
       <source ng-src="{{object.src}}" type="video/mp4"/>
 </video>

All my other data gets loaded but when I look my console, I get this error:

Error: [$interpolate:interr] Can't interpolate: {{object.src}}
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL

I tried in adding $compileProvider in my config set up but it did not resolve my issue.

$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/);

I saw this post about cross domain issues but I'm not sure how to resolve this or what direction I should go in. Any ideas? Any help is appreciated

.gitignore for PhoneGap/Cordova 3.0 projects - what should I commit?

I just tried to create a new phonegap 3.0 project... Note: I'm new to phonegap. Anyways, I see the project folder contains:

• .cordova
• merges
• platforms
• plugins
• www

And having tried phonegap local run android I see a lot of binary/generated files in platforms/android. This leaves me wondering, what parts of this folder structure should I add to my git repository. Normally, I would consider it extremely poor practice to commit binary files. Hence, I would normally add patterns like bin/, obj/, *.o, *.pyc etc. to .gitignore to avoid polluting my git repository with things that only serves to create merge conflicts.

Surely, www should be added to git, but what about the other parts of the project. To what extend are they products of the source code, and to what extend are they project configuration?

What do you do? Granted I'm new so I barely understand what makes sense here...

Struggling between native and phonegap, simple app requirements

I'm going to make a native (meaning; not in the browser) mobile app. Since I'm a web-developer I'm struggling to decide whether or not I should try Phonegap or just build an native app in java or objective-c.

The app requirements are simple. GPS/wifi location, Facebook integration and I guess I'll need a database to handle some of the application specific Facebook-friend relations. Like the highscores in a game, for example - stuff like that.

I'm a web-developer, and don't know neither java or objective-c, yet. I've never used Phonegap before, so I don't know if it's capable of fulfilling my requirements.

So my question is as follows; Can I use Phonegap for my app, or do I need to dive into a new language?

xcode 5.1: libCordova.a architecture problems

Yesterday (3/10/14) when iOS 7.1 was released I also upgraded to Xcode 5.1 and found that my PhoneGap/Cordova project would no longer compile to my iPhone 5s. I also upgraded Cordova to the most recent release: v 3.4.0-0.1.3.

I have read many different solutions on SO that relate so changing active architectures and building only active architectures, and none of them work. So here's what I've tried and the errors I get. Initially I got the error:

missing required architecture arm64 in file <long file path omitted> libCordova.a
Undefined symbols for architecture arm64

So I tried the following. I selected the CordovaLib sub-project in my project, and in both the project and target, I went to Build Settings under Architectures and made sure that arm64 was not included in any of the Debug or Release architectures. At this time Build Active Architecture Only is set to "Yes". That resulted in the following error:

file was built for archive which is not the architecture being linked (armv7): 
<long file path omitted> libCordova.a
Undefined symbols for architecture armv7

Setting Build Active Architecture Only to "No", the error again becomes:

missing required architecture arm64 in file <long file path omitted> libCordova.a
Undefined symbols for architecture arm64

I'm not sure what else to try. The project's architecture settings only includes the key "Base SDK" which is set to iOS 7.1. The project's target does not have architectures settings. Anyway I'm fairly certain the problem lies with the embedded CordovaLib sub-project. What can I do to make this thing compile to my device successfully?

Update: same issue on Apache's Jira: https://issues.apache.org/jira/browse/CB-6223