Hybrid Application with Crosswalk + Cordova + Eclipse - javascript

I am getting an issue/error while creating/importing crosswalk cordova plugin into eclipse.
Can any one share a simple steps from scratch for creating crosswalk cordova app with eclipse.
Also tell me which eclipse type & version is required.

Steps to Import Crosswalk Lib plugin in Eclipse :-
Download CrossWalk from https://download.01.org/crosswalk/releases/crosswalk/android/stable/12.41.296.9/arm/crosswalk-webview-12.41.296.9-arm.zip
Once the Zip is downloaded extract it and paste it in the same directory where your eclipse project is saved.
Now goto Eclipse New -> Import -> Android ->Existing Code into workspace -> goto your location and make sure you donot copy the crosswalk project into your eclipse workspace.
Once Import is done right click on your project click Properties (Alt+Enter) - > Android -> Add -> Choose crosswalk from your workspace and Done..

I'mnt sure about what you want to say with "importing plugins into eclipse".
If you want to use plugins you have to use CLI ( some plugins installation at the end of the page ).
Otherwise, if you want to create your own plugin, follow this guide.

Related

Create a APK using Javascript UI

If you have a javascript UI and would like to create an APK for Android devices. Please advice how could i compile to get APK.
Use Cordova: cordova.apache.org
Just follow the steps for installation, turn your JavaScript project into a Cordova project with cordova run Android and then build the APK with cordova build android.

Cordova - Adding plugins results to my code getting deleted

Pretty straight forward as what the title suggests.
I have a cordova app that i'm writing (cause I'm trying to learn it) with an android platform. I'm using android studio to do the editing. One funny thing is that every time I add a new plugin, the code gets reset to the beginning.
Does this have anything to do with the www at the root of the project? I have 2 "www" folders. One at the root of the project and the other inside platform/android/assets.
Note that I am editing the one under platform/android.
If you use the command line for building and running the app, the root www-folder and some other things, like icons, splashscreens, are copied to the platform folder(s). So this folder will be overridden.
The faster way for developing an app with cordova is to have a symlink from the root www-folder to the www-platform-folder.
I do the coding with PhpStorm, it has a better support for JS/CSS and HTML than Android Studio and do the platform specific things like building, running and special settings in Xcode and Android Studio.

Error in using AdMob Plugin Pro

I am new to iphone cordova.I want to use AdMob Plugin Pro, so i downloaded the zip file and then copied the .h and .m files to plugin folder and the AdMob.js to js folder inside the www folder.Then registered it in config.xml using the following lines
<plugin name="AdMob" value="AdMob" />
I have included the AdMob.js file in my index.html ,then i called the createBanner function defined in the AdMob.js but it gave me an error saying
ReferenceError: Can't find variable: AdMob adMob plugin
The method which i called is as follows
if(AdMob) {
console.log('entered if babu');
AdMob.createBanner( {
adId: id,
position: AdMob.AD_POSITION.TOP_CENTER,
autoShow: true } );
Can anyone guide me where possibly i am going wrong.
I am the author of the admob plugin pro. The way you are using the plugin is not correct.
Instead of copying the files, please use the cordova command line tool to manage files for you:
[sudo] npm install cordova -g
cordova plugin add cordova-plugin-admobpro
Here are the steps for quickly try the plugin with its sample index.html:
[sudo] npm install plugin-verify -g
plugin-verify cordova-plugin-admobpro
Then you will see the tool is creating a demo project, add the plugin, add ios/android platform, then build and run the app in emulator.
For more details, please check the wiki:
https://github.com/floatinghotpot/cordova-admob-pro/wiki

Setting up PhoneGap on Eclipse

I've been following tutorials to set up a PhoneGap project (Android) on Eclipse, I'm fairly new to JS frameworks so I'm setting it up to start learning how to use them. In the tutorial (and any other I watch), they use an older version of PhoneGap that includes a .jar file and that isn't present with the latest version. I'm guessing it will still be easy to do but I'm just missing something obvious.
Is there another way to set it up now? Or do I simply not need this file? Thank you for any help.
The Documentation specifically shows how to open up the project in Eclipse.
Use the cordova utility to set up a new project, as described in The Cordova The Command-Line Interface. For example, in a source-code directory:
$ cordova create hello com.example.hello "HelloWorld"
$ cd hello
$ cordova platform add android
$ cordova build
Launch the Eclipse Application.
Select New Project menu item.
Choose Android Project from Existing Code from the resulting dialog box, and press Next:
Navigate to hello, or whichever directory you created for the project, then to the platforms/android subdirectory.
Make sure both hello and hello-CordovaLib projects are selected to be imported. The hello-CordovaLib project is needed as of Cordova 3.3.0 because Cordova is now used as an Android Library instead of a .jar file
Press Finish.
This is all in the documentation.

XCode Build not updating JS and HTML

I am using XCode 5.0.2 and Cordova 3.4.0-0.1.3 - What I find is after creating the project using the Cordova CLI and opening in XCode, no changes to the index.html file and index.js file are ever carried over to the simulator when I click run.
I have to open terminal and issues a Cordova Build command and then run the simulator and it works
I followed all the instructions here:
Phonegap - developing and launching app on simulator
xcode 4 + phonegap ... not update JS upon build?
And none of it works! any one a have a solution to this, because having to switch back and forth is becoming a pain.
You can add a pre-action script to your XCode project's build. To do this:
Select Product > Scheme > Edit Scheme from the menu (or ⌘ < on keyboard)
Select Build > Pre-actions from the left
Click + and select "New Run Script Action"
Add a script like this:
cd /path/to/your/cordova/project/
cordova prepare ios > xcode-prepare-results.txt
Now XCode should always run cordova prepare before building your project so you don't have to jump to terminal. You can see the output of prepare in the file xcode-prepare-results.txt.
Note, that depending on how your cordova executable is set up and which shell you use, you might have to either change the shell or modify your PATH in order for the script to find cordova.
So after much searching I seem to have found a solution that works, here is what I did. After looking at other Stackoverflow questions I found someone that said this worked for them.
Find the file called copy-www-build-step.sh.
Mine was in
[project_folder]/platforms/ios/cordova/lib/copy-www-build-step.sh
In that file, find the lines beginning rsync -a "...
Add -c to the rsync lines, so they ready rsync -a -c "...
Well I tried that and it did not work on its own. I also tried the answer from Ville and that pulled closer but no cigar. Finally I took what the command from Ville and put it in the copy-www-build-step.sh file
so my top line is now
cd /path/to/your/cordova/project/
cordova prepare
SRC_DIR="www/"
DST_DIR="$BUILT_PRODUCTS_DIR/$FULL_PRODUCT_NAME/www"
COPY_HIDDEN=
ORIG_IFS=$IFS
IFS=$(echo -en "\n\b")
.....
.....
.....etc etc
And now I make change , and click run , bam all is updated. I hope this helps someone else.
Other answers in this thread either didn't work for me or screwed up cordova plugins e.g. InAppBrowser, so i finally came up with this:
Edit the file copy-www-build-step.sh and add the following row in the beginning:
cp -fR ../../www/ www/
so it should look like:
...
cp -fR ../../www/ www/ # new code
SRC_DIR="www/"
...
This way your code will be updated properly and your plugins will work
I also edited the copy-www-build-step.sh file, however you don't want to use an absolute path from your User folder. If you are working with other developers you would have to change that every time you check out code.
It's not a big deal, just change:
SRC_DIR="www/"
To:
SRC_DIR="../../www/"
UPDATE
Worked for me on Cordova and Phonegap.
To have the source files automatically copied from the www source directory to the platforms/ios/www directory when you click the Run button in XCode:
In XCode, choose Product->Scheme->Edit Scheme...
Expand the triangle for Build->Pre-actions
Click the "+" to create a new Pre-action
You can leave the "Shell" setting blank.
Set "Provide build settings from" to the project you are building. This is important.
In the script area enter:
cd ${PROJECT_DIR}/../..
echo "--- Start ---" > xcode-prepare-ios-results.txt
echo "Running cordova prepare ios command..."
pwd >> xcode-prepare-ios-results.txt
cordova prepare ios --verbose >> xcode-prepare-ios-results.txt
echo "--- Finished ---" >> xcode-prepare-ios-results.txt
This works for me with XCode 8.2 and Apache Cordova 6.x
I suggest you clean before build your xcode project. And one more thing, make sure you build again your project using cordova build, not inside xcode because it's totally different.
cordova build yourproject
#Ksliman
I modified you code a bit to work on my system and make slight bit more generic.
top of file copy-www-build-step.sh
## New Code Begin ###
cd ../../
PATH=${PATH}:/usr/local/bin
cordova prepare ios
## New Code End ###
SRC_DIR="www/"
simply type:
cordova prepare
on your terminal and run your project again in Xcode
Simple solutions is to build the app with cordova using:
sudo cordova build ios
Then go to xcode > Product > Clean
Then go to xcode > Run (Play Button)
Run "cordova prepare ios" during the building phases:
Open Xcode.
Select your project.
Go to "Build Phases".
Go on "+" to add a "New Run Script Phase".
Move this section before "Copy www directory".
Add the following lines (for Mac):
cd /Users/*/YOUR_PROJECT_FOLDER (Change your project folder)
/Users/*/.nvm/versions/node/v?.?.?/bin/node node_modules/cordova/bin/cordova prepare ios (Change the path to node version)
After "Play" the www-folder will automatically refresh!
All I had to do was to include the full absolute src path for my project. For example:
From your project directory, vim platforms/ios/cordova/lib/copy-www-build-step.sh
change SRC_DIR to the absolute path of your www, SRC_DIR="/Users/michael/Documents/Development/SampleMobileApp/www/"
Save, build, and you should be good to go.
I found that sometimes Cordova gets confused... you need to do a "cordova platform rm ios" (just leave your plugins alone), and then do a "cordova platform add iOS", which will reinstall all your plugins into your platform... then try your build again.
Every time I use cordova build its overrides content in my platform specific www file. So I use cordova compile instead.
From help:
compile <platforms> compiles platform project without preparing it
It is important to just compile the changes not to build entire projects especially if you creating mobile app for many platforms and you have to do some platform specific improvements.
For me, there was an error in my code. I simply needed to run npm start to locate it.
If you are directly changing html from the Xcode, then you should change the code/html of the staging folder, not main folder
In the staging folder you will get same structure which you have in the main folder, but it will reflected directly in the xcode (iOS) build
Staging folder
Note: The changes you made in the xcode will be replace when you build again from the cordova build/run, so please copy your changes in the main folder before doing firing cordova commands
You can get more information from this answer: Purpose of Staging folder in PhoneGap 3.4? Only changes to index.html in this folder get recognized?
This is the correct solution taken from:
Cordova + Xcode 7.3 (html + Javascript) not changed or updated when build and emulate

Categories