Key power of Phonegap project is its cloud base build service.
You create website, build it using Phonegap Build and you get native app.
Great!
But another part of Phonegap project is Phonegap API.
You use it to access mobile device's resources (GPS, storage etc.).
So you extend your website/app with support for Phonegap API.
But how to build it ?
Official docs guides, depending on OS development platform, install Eclipse, SDK's etc.
In this approach we are responsible to build app.
So you say no! I want to build my website/api that uses Cordova (phonegap) API using Phonegap Build cloud service.
Now here comes the catch 22 !
When you develop website with Cordova API and build it on your own you are expected to use something like this:
<script type="text/javascript" src="js/cordova-2.5.0.js"></script>
But when you want the very same code to build on Phonegap Build service you must drop above line and use this :
<script type="text/javascript" src="phonegap.js"></script>
Already twice I've lost some time to figure this out.
I don't know am I dumb or what but this info is not on any get started pages or I did not find them.
Here is officially Github repo of phonegap examples that uses above approach:
https://github.com/phonegap/phonegap-app-hello-world
Showing posts with label phonegap. Show all posts
Showing posts with label phonegap. Show all posts
Apr 15, 2012
ASP.NET WEB API vs MVC or what?
Now this was confusing at first.
So what's with this new ASP.NET component WEBAPI?
While ago I've got task to create lightweight back end for mobile JSON consumer app.
Ok, let's roll WCF, contracts, binding WCF ABC and that stuff.
But no my colleague came with another acronym:
"No man, we'll use WEBAPI REST services. Where have you been, locked up somewhere ? :) "
And on top of it came another statement:
"Look, we must install ASP.NET MVC 4 so we can plug it in ..."
MVC ? What a ...?
Now wait a minute. There is that giant stuff that communicates with everything in the world (and they are building protocol for aliens :) ) called WCF? Right?
It inherited good ol' SOAP like in stone age.
To my humble knowledge that baby goes along and host virtually on anything that can host .NET.
It has nothing to do with MVC or webforms.
So what's the catch?
Well you'd better listen to this great Scott Hanselman minutes (no, I'm not on his marketing payroll :) ):
http://www.hanselminutes.com/264/this-is-not-your-fathers-wcf-all-about-the-webapi-with-glenn-block
Ok, now google REST and you got the picture.
Now, reason for this post was something else. On introduction videos on http://www.asp.net/web-api
there is very important statement about WEBAPI in MVC "skin".
When you create routing for WEBAPI you DON'T define actions as in classic MVC model.
WEBAPI defines standard HTTP REST statements POST, PUT, GET ... as actions.
For me that punches the whole idea on integrating this "baby" wanna be REST WCF into MVC model and it fits just fine give it a try.
So what's with this new ASP.NET component WEBAPI?
While ago I've got task to create lightweight back end for mobile JSON consumer app.
Ok, let's roll WCF, contracts, binding WCF ABC and that stuff.
But no my colleague came with another acronym:
"No man, we'll use WEBAPI REST services. Where have you been, locked up somewhere ? :) "
And on top of it came another statement:
"Look, we must install ASP.NET MVC 4 so we can plug it in ..."
MVC ? What a ...?
Now wait a minute. There is that giant stuff that communicates with everything in the world (and they are building protocol for aliens :) ) called WCF? Right?
It inherited good ol' SOAP like in stone age.
To my humble knowledge that baby goes along and host virtually on anything that can host .NET.
It has nothing to do with MVC or webforms.
So what's the catch?
Well you'd better listen to this great Scott Hanselman minutes (no, I'm not on his marketing payroll :) ):
http://www.hanselminutes.com/264/this-is-not-your-fathers-wcf-all-about-the-webapi-with-glenn-block
Ok, now google REST and you got the picture.
Now, reason for this post was something else. On introduction videos on http://www.asp.net/web-api
there is very important statement about WEBAPI in MVC "skin".
When you create routing for WEBAPI you DON'T define actions as in classic MVC model.
WEBAPI defines standard HTTP REST statements POST, PUT, GET ... as actions.
For me that punches the whole idea on integrating this "baby" wanna be REST WCF into MVC model and it fits just fine give it a try.
Apr 11, 2012
Proper referencing of PhoneGap with JQuery mobile
Ok, so you've setup Eclipse, Android SDK, PhoneGap or XCode and you want to use best from the two javascript libs:
- PhoneGap
- JQuery Mobile
JQuery Mobile is not just another JQuery plugin. So you don't just reference it and use it per scenario.
After its loading it runs asynchronously number of tasks to change DOM structure so it fits into JQMobile UI layout conventions.
Bottom line is that any other yours peace of javascript has to be put in proper place inside this JQM model or you won't get results you expect.
How to reference PhoneGap with JQuery Mobile?
It depends what and mostly when you want it to be done.
If you need to run it as the very first thing before JQM and you don't need nothing from JQM for this task you must reference it on the top before referencing JQM library like this:
If you need to run it as the very first thing before JQM and you don't need nothing from JQM for this task you must reference it on the top before referencing JQM library like this:
<head>
...
...
<script type="text/javascript" >
function OnDeviceReady() {
// Do something when PhoneGap is initialized
}
$(document).ready(function(){
document.addEventListener("deviceready", OnDeviceReady, false);
});
</script>
<script type="text/javascript" src="jquery.mobile-1.0.1.min.js"></script>
...
</head>
Now this will work but there is a catch. Both PhoneGap and JQmobile libs are based on event driven model. They run bunch of task in their own processes asynchronously. What this means is that when you tell PhoneGap that you want OnDeviceReady executed it will not be executed until phonegap in separate thread says I'm ready.
After line:
document.addEventListener("deviceready", OnDeviceReady, false);
; execution continues and JQM starts to kick in. So they run parallel and no one can tell will OnDeviceReady really get executed before JQM starts.
Now someone will say that this is exactly what is expected from async process to behave but its just not plain obvious when you start to play with this things.
Hence I figure out I'll have to do some more reading on JQM :)
To cut long story short as a manual for lazy developers, like I'am, here it is.
<div id="MyPageUniqueName" data-role="page" data-theme="e">
<script type="text/javascript">
$("#MyPageUniqueName").bind("pagebeforecreate", function (event) {
});
</script>
...
JQM recommends injecting your code in appropriate JQM events. Read JQM docs for details on events and their purpose.
Although in proper place this code still does not guarantee that OnDeviceReady will get executed before JQM thread kicks in.
This represents a problem only if you need PhoneGap to prepare some stuff BEFORE JQM starts.
For example you need to obtain some data from mobile device internal storage using phonegap, inject it to DOM of page and let JQM render UI with new data.
Although you could try to wait using setTimeOut() while PhonGap loads and do its work and then let go JQM continue it is simple not right approach.
Right approach is to have Page A that prepares DATA using PhoneGap and then POST's this DATA to PageB. Page B then does not care about when PhoneGap is loaded since it already has its required DATA and can render it in proper JQM event PageBeforeCreate.
...
</head>
Now this will work but there is a catch. Both PhoneGap and JQmobile libs are based on event driven model. They run bunch of task in their own processes asynchronously. What this means is that when you tell PhoneGap that you want OnDeviceReady executed it will not be executed until phonegap in separate thread says I'm ready.
After line:
document.addEventListener("deviceready", OnDeviceReady, false);
; execution continues and JQM starts to kick in. So they run parallel and no one can tell will OnDeviceReady really get executed before JQM starts.
Now someone will say that this is exactly what is expected from async process to behave but its just not plain obvious when you start to play with this things.
Hence I figure out I'll have to do some more reading on JQM :)
To cut long story short as a manual for lazy developers, like I'am, here it is.
<div id="MyPageUniqueName" data-role="page" data-theme="e">
<script type="text/javascript">
$("#MyPageUniqueName").bind("pagebeforecreate", function (event) {
function OnDeviceReady() {
// Do something when PhoneGap is initialized
}
document.addEventListener("deviceready", OnDeviceReady, false);
});
</script>
...
JQM recommends injecting your code in appropriate JQM events. Read JQM docs for details on events and their purpose.
Although in proper place this code still does not guarantee that OnDeviceReady will get executed before JQM thread kicks in.
This represents a problem only if you need PhoneGap to prepare some stuff BEFORE JQM starts.
For example you need to obtain some data from mobile device internal storage using phonegap, inject it to DOM of page and let JQM render UI with new data.
Although you could try to wait using setTimeOut() while PhonGap loads and do its work and then let go JQM continue it is simple not right approach.
Right approach is to have Page A that prepares DATA using PhoneGap and then POST's this DATA to PageB. Page B then does not care about when PhoneGap is loaded since it already has its required DATA and can render it in proper JQM event PageBeforeCreate.
Subscribe to:
Posts (Atom)