Putting It All Together: SpellDial php class and Android Application – Part Two
Sunday, July 10th, 2011I’m back, and I’ve got a little time on my hands. Let’s continue on how to use the spelldial php class now in an android phonegap application.
Now, let’s look at the actual php code that will make the spelldial call based on what your android spelldial app will send:
You can save this code snippet in a file named droidspell.php:
include "spelldial.php";
$spell = new Spelldial();
$result = $spell->get_info($_POST['spelldial'],$_POST['calltype']);
if($result->error_code !== '0')
{
die("error");
}
echo $result->content[0]->info[0]->uri;
This is a typical use of the spelldial class I made (this uses post variables spelldial and calltype, ie. tel or skype to determine what to return as output to the android application).
Now for the html code snippet:
<script src="jquery-1.4.2.min.js">jquery-1.4.2.min.js</script>
<form id="spellform" name="spellform" method="post" action="http://yoursite/droidspell.php">
<table width="300" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="27" colspan="2">SpellDial Name</td>
</tr>
<tr>
<td height="31" colspan="2"><label>
<input type="text" name="spelldial" id="spelldial" />
</label></td>
</tr>
<tr>
<td height="42" colspan="2" valign="top"><label>
<select name="calltype" id="calltype">
<option value="TEL">Telephone</option>
<option value="SKYPE">Skype</option>
</select>
</label></td>
</tr>
<tr>
<td colspan="2"><label>
<input type="submit" name="dial" id="dial" value="Call me using SpellDial" />
</label></td>
</tr>
</table>
</form>
<script>
$("#spellform").submit(function(event) {
event.preventDefault();
var $form = $( this ), spelldial = $form.find( 'input[name="spelldial"]' ).val(), calltype = $form.find( 'select[name="calltype"]' ).val(),
url = $form.attr( 'action' );
$.post( url, { 'spelldial': spelldial, 'calltype': calltype },
function( data ) {
if(data == 'error' || data == '')
{
alert('Spelldial API returned an error: '+data);
} else {
location.href = data;
}
}
);
});
</script>
As you may see, this is typical html form/jquery event code to get the result of the droidspell.php call and then determine if an error occurred and if not, go ahead to the android dialer to make a call.
You’ll see some stuff like jquery-1.4.2.min.js in the code above. Where is it placed? It is placed where the index.html is placed in the assets/www folder:
If you want to use the phonegap wrapper functions place this snippet in the <head> portion of your index.html file:
<script type="text/javascript" charset="utf-8" src="phonegap.0.9.6.js"></script>
You may rename phonegap.0.9.6.js to phonegap.js if you wish.
This is how a finished phonegap application looks like in the emulator (yeah yeah, ugliness noted, I made this quickly!):
Once you see this application running in your emulator, you might want to package this application into an apk. Simply right click on your project in the project window and select Android Tools->Export Unsigned Application Package – once you follow the instructions, this will create an unsigned apk file for you automatically.
You can also create signed apk files for distribution into the Market. For further reference, please see http://developer.android.com/guide/publishing/app-signing.html for details.
And there you have it, we have now made an android application in phonegap using the spelldial php class, tested it in an emulator, and published it as an apk file.
– yipee ).
