- 724 Posts
- 3 Reply Likes
Posted 4 years ago
- 724 Posts
- 3 Reply Likes
<script>
document.addEventListener("deviceready", onDeviceReady, false);
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, showError);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
var latlon = position.coords.latitude + "," + position.coords.longitude;
var img_url = "http://maps.googleapis.com/maps/api/staticmap?center="
+latlon+"&zoom=22&size=220x220&sensor=false&markers="+latlon+"&size:mid%7Ccolor:0xff0000%7Clabel:%7Camroha,+uttar+pradesh";
document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
}
function showError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
}
</script>
HTML SOURCE
<body onLoad="getLocation()">
<p id="demo"></p>
<div id="mapholder"></div>When I am calling function "getLocation()" at device ready event, its not showing map, but as same as above code, It's showing map but like before only on PC(WIN) not on phone.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
If not, how did you whitelist the external source for the image?
- 724 Posts
- 3 Reply Likes
-and for whitelist here is the config.xml:
<?xml version="1.0" encoding="UTF-8" ?>
<widget xmlns = "http://www.w3.org/ns/widgets"
xmlns:gap = "http://phonegap.com/ns/1.0"
id = "com.phonegap.example"
versionCode = "10"
version = "1.0.0" >
<!-- versionCode is optional and Android only -->
<name>AmroClean</name>
<description>
This app let you Clean your City within no time, Keep your City Clean and Green, Regards: Nagar Palika Parishad
</description>
<author href="https://build.phonegap.com" email="support@phonegap.com">
Saba Rais
</author>
<icon src="images/icon.png"/>
<content src="index.html"/>
<access origin="*"/>
<access origin="*.googleapis.com"/>
<plugin name="cordova-plugin-whitelist" />
<plugin name="cordova-plugin-device" source="npm" spec="1.0.1" />
<plugin name="call-number" source="npm" spec="0.0.2" />
<access origin="http://phonegap.com" subdomains="true" />
<gap:platform name="ios" />
<gap:platform name="android" />
<gap:platform name="winphone" />
<preference name="permissions" value="none"/>
<gap:plugin name="org.apache.cordova.device" version="0.3.0" source="npm"/>
<gap:plugin name="org.apache.cordova.camera" version="0.3.6" source="npm"/>
<gap:plugin name="cordova-plugin-socialsharing" source="npm" version="4.3.81" />
<plugin name="cordova-plugin-geolocation"/>
<plugin name="cordova-plugin-file-transfer"/>
<plugin name="cordova-plugin-camera"/>
<plugin name="cordova-plugin-device-motion"/>
<access origin="tel:*" launch-external="yes" />
</widget>
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
There isn't showing anything.Then you should check and see which functions are being executed, and which not. You want to see where the execution stops, if anywhere.
About your config:
1. Do you really want to attempt to publish the app with this id?
id = "com.phonegap.example"
The author attributes seem incorrect, too.
2. The default icon must be in the root. See the Icons and Splashscreen section in the PGB Docs
3. You're missing icons and splashes, which are strongly recommended for Android and required for iOS
4. Since you already have
<access origin="*"/>, the other access origin rules are redundant (except for 'tel:')
5. You have no whitelisting for the display of external sources in the webview. Add an allow-navigation rule. See the whitelist plugin's documentation. Also, Jesse showed you a whitelist tutorial in this thread, about a month ago
6. You are using a couple of old, deprecated plugins from the PGB repo. You can't do that, especially if you also have a later version from the npm repo.
7. You're missing the statusbar plugin from npm, which is necessary for iPad.
- 724 Posts
- 3 Reply Likes
1.Then which I should use? or I can leave that id?
2. Root folder means www folder?
3.I will read more about icons and splashes.
4.I will remove all unnecessary
<access origins>.
5.Okay I will read about webview allow navigation rules.
6.I will update all the old versions.
7. Let me check about status bar plugin.
Thanks alot Petra.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
2. No. The root directory is /, not /www
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Just try all possibilities in a mobile browser and pick the best!
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
1.Now, I want to ask that, You were talking about GOOD LOOK , so how can i give a good look to this map?
2.And how I can use that checkbox with current location, should I call to getcurrent position by a checkbox? How i can store lat and lon values to send to the database?
Thanks
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
You need to get that appp working, first. Then, if there is still time left, you can start playing with fancy colors, rounded corners and whatnot.
There won't be time left; you'll run into plenty more trouble and things you haven't thought about, yet.
2. ????
- Do you want to get the current location...again?
- Why would you want to store lat/lon prior to sending them?
I think you should re-read this thread carefully to find the main goals of this screen. It appears to me that you may have lost track about what each part is meant for.
- 724 Posts
- 3 Reply Likes
2. No, i don't want current position again, I am asking when a user will click on check box, e.g. Or use Current Location.
How it will work?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
- EITHER the user says: "My current position is where the complaint is all about" (that's where he ticks the checkbox)
- OR the user says: I'm somewhere else, now. But this complaint is about Main Avenue, third tree on the East side." (that's where he types his text in the text box)
So, you need to make a clear user interface which offers him/her these two options, in such a way that no confusion arises.
Depending on what the user does, you should either:
- issue an error message if he does neither
- post the text if he filled in text
- post the current location if he ticks the checkbox
It would be nice if you:
a. did not display the map and the checkbox if the location couldn't be determined or the map couldn't be loaded
b. would hide the text box if he ticks the checkbox and show the textbox again if he unticks the checkbox
c. would disable the checkbox if he typed text, and eabled the checkbox if he emptied the textbox
They were asking again and again about the App, and i took some time to complete it.So, did you at least show them a first prototype and did you offer them to start testing a first prototype version, in order to receive feedback as soon as possible?
BTW: where do you want the user to describe the complaint itself?
- 724 Posts
- 3 Reply Likes
-And yes I will validate form's field, which can be null, and which are mandatory.
-This is really nice programming about show / hide fields, I will study about that.
-I showed them my this version of app, but because It's still not complete I will submit them after successful testing on every platform.
- 724 Posts
- 3 Reply Likes
When I am opening "Post Complain" option, The page taking little time to load,
Can i give a small loader gif image to page? How? Is there any plugin required for it?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
No plugin required.
- 724 Posts
- 3 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
- 724 Posts
- 3 Reply Likes
<script type="text/javascript">
document.onreadystatechange = function () {
var state = document.readyState
if (state == 'complete') {
setTimeout(function(){
document.getElementById('interactive');
document.getElementById('load').style.visibility="hidden";
},5000);
}
}
</script>
CSS:
#load{
width:100%;
height:100%;
position:fixed;
z-index:9999;
background:url("images/preloader.gif") no-repeat center center rgba(0,0,0,0.25);
}
HTML:
<div id="load"></div>
NOW?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
- 724 Posts
- 3 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
<img src="images/preloader.gif"/>
?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Must it really be a background image of a div? Can't you simply use the img element you just tested?
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
JesseMonroy650 (Volunteer), Champion
- 3325 Posts
- 122 Reply Likes
quit bugging Petra. Move from your place to another
city and find someone to help you.
Jesse
- 724 Posts
- 3 Reply Likes
Petra, is with me since begining, Petra never said these lines, even I make Petra, many time disappointed and irretated, then Y u are saying this?
JesseMonroy650 (Volunteer), Champion
- 3325 Posts
- 122 Reply Likes
Best of Luck
Jesse
- 724 Posts
- 3 Reply Likes
Related Categories
-
PhoneGap Build
- 15111 Conversations
- 275 Followers
-
Plugins
- 1283 Conversations
- 38 Followers






