how would you rate The Holy Qura'an - Arabic ver?

Wednesday, February 19, 2014

Step by step on how to add Facebook plugin on Phonegap

I have posted an answer on stackoverflow on how to do it and here is more:

Using CLI add the APP_ID and APP_NAME variables to your command. Something like this:

C:\myProject>cordova plugin add https://github.com/phonegap/phonegap-facebook-plugin --variable APP_ID=your_facebook_app_id --variable APP_NAME=your_facebook_app_name
I got it installed this way but not sure if the app is functional or not. Something to test.
I had an issue with phonegap build giving me the error One of your plugins requires a parameter: APP_ID, APP_NAME. That was because I didn't add those variables to the config.xml file.
This solved it

<gap:plugin name="com.phonegap.plugins.facebookconnect">
  <param name="APP_ID" value="your_facebook_app_id" />
  <param name="APP_NAME" value="your_facebook_app_name" />

Please remember to modify the plugin.xml file under root/plugins/com.phonegap.plugins.facebookconnect/plugin.xml
<preference name="APP_ID" />
<preference name="APP_NAME" />

Also, I had issue with facebook failing to initial and it was because my config.xml had this
<widget id="com.app.xxx" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://cordova.apache.org/ns/1.0">

and solved it by changing it to this:
<widget id="com.app.xxx" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">

This should get the app to work.

After you start using it you will notice when you do login facebook will through at you errors like "invalid android_key parameter". This means that you haven't register the app platform on Facebook.

Go to your app facebook page: https://developers.facebook.com/x/apps/app_id/settings/
Under Settings -> Basic -> click on add platform

Now you need to sign your app using command line on windows, for this to work you will need to have java keytool installed and i'm not going through that here, PLEASE KEEP IN MIND TO AVOID ADDING SPACES, SPECIAL CHARACTERS AND ALL LOWER CASE [I had issues with phonegap not recognizing my alias because of that].

C:\mykeystorebox>keytool -genkey -v -keystore mynewkey.keystore -alias mykeyalias -keyalg rsa -keysize 2048 -validity 10000
Enter keystore password:
Re-enter new password:
What is your first and last name?
[Unknown]: sean
What is the name of your organizational unit?
What is the name of your organization?
[Unknown]: testcompany
What is the name of your City or Locality?
[Unknown]: london
What is the name of your State or Province?
[Unknown]: on
What is the two-letter country code for this unit?
[Unknown]: ca
Is CN=sean, OU=Unknown, O=testcompany, L=london, ST=on, C=ca correct?
[no]: yes

Generating 2,048 bit RSA key pair and self-signed certificate (SHA256withRSA) with a validity of 10,000 days
for: CN=sean, OU=Unknown, O=testcompany, L=london, ST=on, C=ca
Enter key password for
(RETURN if same as keystore password):
[Storing mynewkey.keystore]

C:\mykeystorebox>keytool -exportcert -alias mykeyalias -keystore mynewkey.keystore | openssl sha1 -binary | openssl base64
Enter keystore password: *************

Now go back to facebook page and take Abikekw4k3lfmK23kvJl32Ljflw301= and put it under Key Hashes. You will need to add your app class in there too.

Save that.

Now go to Phonegap and upload your keystore as a key for your android and sign your APK with it. It will ask for a title and could be anything, alias and in this case should be mykeyalias.

Sunday, January 19, 2014

Push Notification Android - Phonegap 3.2 Plugin

I have been trying to test the native phonegap push notification on version 3.2 but almost everything I tried resulted in "Class not found" issue". After a couple of days of trials here is how I finally got it to work.

  1. Using the CLI install the push notification plugin: 
    • $ phonegap local plugin add https://github.com/phonegap-build/PushPlugin
  2. Add
     <script type="text/javascript" src="PushNotification.js"></script>  
    to the header of your index.html
  3. Add the following to your index.html body
               <div id="home" style="position:absolute; bottom:0; left:0; z-index:99999;">  
                    <div id="app-status-div">  
                         <ul id="app-status-ul">  
                              <li>Cordova PushNotification Plugin Demo</li>  
  4. In your javascript add
     var pushNotification;  
           function onDeviceReady() {  
             $("#app-status-ul").append('<li>deviceready event received</li>');  
                         document.addEventListener("backbutton", function(e)  
                  $("#app-status-ul").append('<li>backbutton event received</li>');  
                            if( $("#home").length > 0)  
                                   // call this to get a new token each time. don't call it to reuse existing token.  
                                   //pushNotification.unregister(successHandler, errorHandler);  
                         }, false);  
                  pushNotification = window.plugins.pushNotification;  
                  if (device.platform == 'android' || device.platform == 'Android') {  
                                   $("#app-status-ul").append('<li>registering android</li>');  
                    pushNotification.register(successHandler, errorHandler, {"senderID":"661780372179","ecb":"onNotificationGCM"});          // required!  
                              } else {  
                                   $("#app-status-ul").append('<li>registering iOS</li>');  
                    pushNotification.register(tokenHandler, errorHandler, {"badge":"true","sound":"true","alert":"true","ecb":"onNotificationAPN"});     // required!  
                              txt="There was an error on this page.\n\n";   
                              txt+="Error description: " + err.message + "\n\n";   
           // handle APNS notifications for iOS  
           function onNotificationAPN(e) {  
             if (e.alert) {  
                $("#app-status-ul").append('<li>push-notification: ' + e.alert + '</li>');  
             if (e.sound) {  
               var snd = new Media(e.sound);  
             if (e.badge) {  
               pushNotification.setApplicationIconBadgeNumber(successHandler, e.badge);  
           // handle GCM notifications for Android  
           function onNotificationGCM(e) {  
             $("#app-status-ul").append('<li>EVENT -> RECEIVED:' + e.event + '</li>');  
             switch( e.event )  
               case 'registered':  
                              if ( e.regid.length > 0 )  
                                   $("#app-status-ul").append('<li>REGISTERED -> REGID:' + e.regid + "</li>");  
                                   // Your GCM push server needs to know the regID before it can push to this device  
                                   // here is where you might want to send it the regID for later use.  
                                   console.log("regID = " + e.regid);  
               case 'message':  
                    // if this flag is set, this notification happened while we were in the foreground.  
                    // you might want to play a sound to get the user's attention, throw up a dialog, etc.  
                    if (e.foreground)  
                                        $("#app-status-ul").append('<li>--INLINE NOTIFICATION--' + '</li>');  
                                        // if the notification contains a soundname, play it.  
                                        var my_media = new Media("/android_asset/www/"+e.soundname);  
                                   {     // otherwise we were launched because the user touched a notification in the notification tray.  
                                        if (e.coldstart)  
                                             $("#app-status-ul").append('<li>--COLDSTART NOTIFICATION--' + '</li>');  
                                        $("#app-status-ul").append('<li>--BACKGROUND NOTIFICATION--' + '</li>');  
                                   $("#app-status-ul").append('<li>MESSAGE -> MSG: ' + e.payload.message + '</li>');  
                                   $("#app-status-ul").append('<li>MESSAGE -> MSGCNT: ' + e.payload.msgcnt + '</li>');  
               case 'error':  
                                   $("#app-status-ul").append('<li>ERROR -> MSG:' + e.msg + '</li>');  
                                   $("#app-status-ul").append('<li>EVENT -> Unknown, an event was received and we do not know what it is</li>');  
           function tokenHandler (result) {  
             $("#app-status-ul").append('<li>token: '+ result +'</li>');  
             // Your iOS push server needs to know the token before it can push to this device  
             // here is where you might want to send it the token for later use.  
           function successHandler (result) {  
             $("#app-status-ul").append('<li>success:'+ result +'</li>');  
           function errorHandler (error) {  
             $("#app-status-ul").append('<li>error:'+ error +'</li>');  
                    document.addEventListener('deviceready', onDeviceReady, true);  
  5. Now go to your www/config.xml and add
     <gap:plugin name="com.phonegap.plugins.PushPlugin" />  
Now build and compile your project. You should get it working now.

So what's next?! When you run your app and registration is success what you need to play with is e.regid under the case: "registered".

 So what you could do is using ajax send the e.regid to a php file to store that regid in the database as an identity to this user's device.

Next you could test sending the user messages using something like:
 function send_gcm_notify($reg_id, $message) {  
      $apiKey = "AIzaSyDXlsn2rlbTxZsa3apYfQu0kaSNzzzzzag8"; //google browser api key  
      $url = 'https://android.googleapis.com/gcm/send';  
   $fields = array(  
     'registration_ids' =>; array( $reg_id ),  
     'data'       =>; array( "message" => $message ),  
   $headers = array(  
     'Authorization: key=' . $apiKey,  
     'Content-Type: application/json'  
   $ch = curl_init();  
   curl_setopt($ch, CURLOPT_URL, $url);  
   curl_setopt($ch, CURLOPT_POST, true);  
   curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);  
   curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);  
   curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);  
   curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($fields));  
   $result = curl_exec($ch);  
   if ($result === FALSE) {  
     die('Problem occurred: ' . curl_error($ch));  
   echo $result;  
 $reg_id = "APA91bxxxsszzjVXv9jW4O2mD0Nvljf_0BLzjHzCqKa-9VthTYYDqB9BfKj88Fd3234fscARTRaNsm3xKk73V-xWZIM3ETuptUFxxYVwik1234WmeABgcf_yG4Gkd0GSk3Zfydw8Cv6H3b0K";  
 $msg = "Google Cloud Messaging working well";  
 send_gcm_notify($reg_id, $msg);  

Wednesday, January 15, 2014

Push Notification - Phonegap 3.0+ with pushwoosh

I had so much trouble integrating Push Notification using all the documentation available. After two days of struggle I got to the bottom of it and finally it's working. Here's what I did.
  1. If you installed Push plugin before, then delete it and start fresh.
  2. Follow the instructions in here integrating phonegap on android
  3. In your config.xml file add < gap:plugin name="com.pushwoosh.plugins.pushwoosh" version="3.0.1" > < /gap:plugin > ....... PLEASE NOTE THE SPACES I ADDED BEFORE AND AFTER THE TAGS IN HERE. REMOVE THE EXTRA SPACING
  4. projectid: is actually the Project Number under your Developers Console > overview.
  5. That's it.

Friday, May 13, 2011

new website for vicrandom

new website for vicrandom is http://www.vicrandom.com

Saturday, March 12, 2011

Passing parameters from HTML to swf(Flash Builder) AS3

I spent countless hours to get this done. Pulled my hair broke my glasses and kicked out my cat all because of lack of finding the right directions on how to get it done.

simple as this:

your flex file is ready! OK

private var in1:String;
private function initHandler():void {
var obj:Object = this.parameters;
in1= obj.name;
Alert.show("OK " + in1);

There goes the flex file
Now, when you publish your project using the project>Export Release Build... you need to edit the exported html file (it should be under the same name as your project). So go and edit it

Find the line

//within the 3rd [script] and after (REPLACE [ WITH < )
var xiSwfUrlStr = "playerProductInstall.swf";
//add this line
flashvars.in1= "WELCOME"; // don't forget ;
var ver= {};
var params = {};

//then you will have [nonscript][object]

//then another[object]


Thursday, January 13, 2011


I will be listing answers for some emails i received in here

Dear Khalid,

Thank you for the last update, I really like the zoom capability and I also appreciate the ability to move the app to the memory card, but I notices couple of issues:
1. Although I have the whole Quran downloaded on my memory card, every time I open the app it starts downloading!
2. The fast bookmarks in the previous version, it used, when click on it to read it, it clears awaiting the new bookmark, but right now it does not clear and bookmarks keeps piling although you don't need them any more and I looked for a way to clear them but I did not find, am I missing it? if there is a way could you please let me know?
Thanks, and JAK!


I am so glad you like this new update. For some reason i receive some issues with this version! In your case I have no idea why it keeps downloading everytime you open the app. My suggestion is to delete more than 100 pages by going to FIX in the main menu. That way, the app will delete all pages and start downloading a fresh copy of all pages which by the way I updated so that could be the reason. Also, about the bookmarks, it should keep your bookmarks, and yes they'll pile up. However, if you decided to delete any bookmark just long press on the one you wish to delete and it should be gone immediately.

I really hope this helps
Walsalmo Alikum,

Sunday, January 9, 2011








مصحف المدينة المنورة

ترجمة المصحف الإنجليزية

مصحف الشمرلي

ترجمة المصحف الفرنسية

ترجمة المصحف الألمانية

ترجمة المصحف الصينية

لدعمكم وتبرعكم لبرامج القرآن الكريم على الاندرويد الرجاء الضغط على هذا الزر