Using an existing sencha project and PhoneGap Build, I have the problem that window.device is not defined if I query for it in the microloader/testing.js code.
Ext.blink = function(options) {
...
Ext.microloaded = true;
// Start my microloader enhancement
isPhonegap = typeof window.device != "undefined";
window.alert("isPhonegap: " + isPhonegap);
The config.xml contains the plugin:
<gap:plugin name="org.apache.cordova.device" />
Sencha is uploading everything to PhoneGap Build for me, it is built there, and then I download and adb install -r the resulting apk on my Android 4.0.4 Smartphone.
Result when starting the app, is the alert: isPhonegap: false.
What is the problem here?
Guessing a bit here, but could it be that you're calling that code before deviceReady has fired?
See http://docs.phonegap.com/en/4.0.0/cordova_events_events.md.html#deviceready for details.
Related
I am newbie in Phonegap.
I did installed latest version of phoneGap app for MAC OSX.
Below is version detail.MAC OSX PhoneGap App version detail :.
I did cerated New PhoneGap project. Now i wants to use cordova-plugin-qrcode in my PhoneGap project.
I am confused it with few days.
I tried many steps for it, But having no success yet :(
I installed below with CLI:
node -v -- v6.1.0
phonegap -v -- 6.2.2
npm -v -- 3.8.6
cordova -v -- 6.1.1
I did add package.json file in my project directoey.Then i applied npm install qrcode-reader command on my Terminal. So node_modules folder created in my project directory. Displaying node_modules hierachy
Then i edited my config.xml file for add below PlugIn tag :
<plugin name="qrcode-reader" source="npm" spec="~0.1.1" />
Now, In my index.html i gave reference for plugin by add below script :
<script type="text/javascript" src="../node_modules/qrcode-reader/dist/browser.js"></script>
Now , In index.js, i did use it according to plugin suggest by below code :
$(document).ready(function(){
var QrCode = require('qrcode-reader');
var qr = new QrCode();
qr.callback = function(result) { console.log(result) }
});
But whenever i run this project i got below error :
ReferenceError: require is not definedvar
var QrCode = require('qrcode-reader');
Though i did search on web till last few days, didn't get any success.
Please help me with this.
Correct me if there any conceptual mistakes.
Thanks !
All,
Could you please help me with following. I am trying to access the camera API using cordova. I have created the project using cordova cli. My config.xml has this option added to allow the camera plugin which is also installed using cordova cli.
<feature name="Camera">
<param name="android-package" value="org.apache.cordova.camera.CameraLauncher" />
</feature>
When I click the camera Button, I find the navigator.camera object as undefined. I have tried it on couple of phones and it seems to be the same issue. I tried remote debugging using chrome and it also shows the camera object as undefined.
Cordova.js load fails with following object as undefined
Uncaught TypeError: Cannot set property 'require' of undefined (cordova.js)
//Export for use in node
if (typeof module === "object" && typeof require === "function") {
module.exports.require = require;
module.exports.define = define;
}
Cordova.js version is 3.7.1 .
Please note :Commenting these 3 lines from Cordova.js in platform_www seems to fix the issue. But i am wondering if someone can help suggest whats wrong here. Modifying the lib is the last option.
the problem could be with the declaration of a variable named module, in my case it was
var module = ons.bootstrap('my-app', ['onsen']);
just rename module in something else.
You can't test hybrid app on browser without proper tools. Use ripple chrome extension to test your app.
https://chrome.google.com/webstore/detail/ripple-emulator-beta/geelfhphabnejjhdalkjhgipohgpdnoc?hl=en
I am trying to force the links in my app to open in external browser. I am working with jQuery mobile & Phonegap build.
My app has a page with generated contact details. Among the details there is an link to the person's website:
row+='<div class="accWWW"> '+ data[i].website +'</div>';
I have these 2 functions defined in my code.
//function which forces open in browser
function openBrowser(url){
if(device.platform === 'Android') {
navigator.app.loadUrl(url, {openExternal:true});
} else {
window.open(url, '_system');
}
}
//opens generated URL's
function openGenerated(obj){
var url = obj.getAttribute("href");
console.log(url);
openBrowser(url);
return false;
}
I also have a simple <div class="accWWW"> Google </div> set in my index.html
So... this link to Google opens perfectly in iOS (haven't yet tested on Android because iOS was my biggest problem), but the generated link wouldn't do anything if I hadn't added the openGenerated function. Now there is an action, but it opens inside the app.
Do you have any idea why that is?
Also when checking on the laptop I get these errors in the console( link is my development url):
Uncaught ReferenceError: device is not defined *link*:277 // makes sense probably, because I am not using a mobile device
Uncaught SecurityError: Blocked a frame with origin "http://www.test.com" from accessing a frame with origin "*link*". Protocols, domains, and ports must match.// what is this?
I was thinking maybe it's an access issue, but I added <access origin="*" browserOnly="true" /> in my config.xml, so there shouldn't be a problem with this.
LATER EDIT: On Android the Google link doesn't work at all and the generated one opens inside the app... Apparently device.platform is always null, but the device plugin is added in xml as I can see in phonegap build this list of plugins:
Installed Plugins
Apps will be built with the latest version of a plugin unless you lock the version in your config.xml (see below). -- Plugin installed as a dependency of another plugin
Third Party VERSION LATEST VERSION
com.phonegap.plugin.statusbar 1.1.0 1.1.0
PhoneGap Core
org.apache.cordova.device 0.2.8 0.2.8
org.apache.cordova.inappbrowser 0.3.3 0.3.3
LATER EDIT:
Device.platform doesn't seem to be working, so I modified my function, adding Ved's suggestion, to:
function openBrowser(url){
if(navigator.app)
navigator.app.loadUrl(url, {openExternal:true});
else {
var ref = window.open(url, '_system', 'location=no');
ref.addEventListener('loadstart', function(event) {
});
ref.addEventListener('loadstop', function(event) {
console.log(event.type + ' - ' + event.url);
});
ref.addEventListener('exit', function(event) {
});
}
}
on iOS still opens inside the app. For Android I think it's working fine.
I fixed my issue.
I was adding cordova.js in my html. Apparently this broke things.
Has anyone gotten the clipboard plugin to work with "PhoneGap Build"?
I can't get it to work. I'm currently useing phonegap 3.1.0
My app is for android and IOS. I've only tested the clipboard plugin on android so far, and it isn't working.
in my config.xml:
<gap:plugin name="com.verso.cordova.clipboard" />
in my javascript:
window.plugins.clipboard.copy('some text',function(){alert('success');},function(response){alert('error:' + response);});
window.plugins.clipboard.paste(function(text){alert('paste success:' + text);},function(response){alert('paste error:' + response);});
The way I have it above, the script runs, but for both the copy and paste calls, the error function is executed and the response is "Class not found".
I have tried the above call window.plugins.copy, cordova.plugins.copy
both of those just cause the script to abort.
phonegap is loading just fine and the deviceready function has already fired before I attempt the above calls.
Under the plugins tab on the phonegap build webpage for my app:
Installed 3rd Party Plugins
com.verso.cordova.clipboard 0.1.0
This appears to be unrelated to the copy/paste plugin. In phonegap 3.1 you have to reference all the phonegap plugins you want to use. In this case, I'm guessing you have a function that checks if the user has an internet connection? If so, you need to add to your config.xml
I'm completely new to phonegap. I started with phonegap build - by running 'npm install -g phonegap'.
My system is windows7.
When i run the command 'phonegap run android' i'm getting console messages as follows:
[phonegap] detecting Android SDK environment..
[phonegap] using the local environment
[phonegap] compiling Android...
[phonegap] successfully compiled Android app
[phonegap] trying to install app onto device
[phonegap] successfully installed onto device
I can see the app running on my device (sony Xperia -E).
But when i put in my javascript code:
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicity call 'app.receivedEvent(...);'
onDeviceReady: function() {
app.receivedEvent('deviceready');
},
// Update DOM on a Received Event
receivedEvent: function(id) {
console.log('Received Event: ' + id);
//HERE
alert(navigator.camera)
}
i keep getting alert which say 'undefined'. I checked the same with navigtaor.geolocation, and it wasnt undefined.
I guess it something to do with camera plugin. Am i right?
Please Help
Thanks Forwards
You have to add these things:
--> app/res/xml/plugins.xml
<plugin name="Camera" value="org.apache.cordova.CameraLauncher" />
--> app/AndroidManifest
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
After looking itno this project i figured out where was my mistake
I tried to use the 'ondeviceready' eventhandler which comes with index.js.
Dont know why yet, but this handler fires when camera is undefined.
After i specified my own handler on the page
document.addEventListener("deviceready",onDeviceReady,false);
function onDeviceReady() {
alert(navigator.camera);
}
camera became defined
It is supposed to have the cordova-plugin-camera plugin added to your PhoneGap/Cordova project, so just this way you'll get the example working.
See the right command:
cordova plugin add cordova-plugin-camera
Before running phonegap application, make sure you add the lib:
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-media-capture.git
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-media.git
If you omit loading the plugin before building the app it will not work, I also had problems sometimes with installed plugins, so if you did install them, try removing and re-adding them, that worked for me. You can check what plugins are installed by:
phonegap local plugin list
For more information please visit: Official Phonegap Documenattion
Regarding: navigtaor.geolocation it is a standard HTML5 call so if the geolocation plugin is not installed (at least on Android) it will be interpreted as a standard HTML5 geolocation call.
This worked for me, I guess someone needs to make a release.
cordova plugin remove cordova-plugin-camera && cordova plugin add https://github.com/apache/cordova-plugin-camera