Convert base64 to Blob

I'm developing android app with AngularJs & ngCordova,
and in my case, I just can choose to get image file from it's URI.

We don't have "[Select file...]" button to click to set our file directly into $scope object.
For example:

$scope.insertFile = function (file) {

    $scope.fileObject = file;

};

I then use Cordova's plugin, $cordovaFile - readAsDataURL, to get the base64 formatted file.
It's so I can upload my picture through $http and data parameter in form of FormData().

Simply convert into Blob as below does not work:

$cordovaFile.readAsDataURL(file.directory, file.name).then(function(response) {
 // take jpeg image as example
 var imageFile = new Blob(response, {type: 'image/jpeg'}); 
 formData.append('photo', imageFile, file.name);
};

It (the conversion) breaks my image file, because `new Blob()` doesn't automatically encode base64.

I have been struggling to get a non-broken image uploaded for some time until I found a solution that solved my problem below.

Solution
I found a useful HTML5 Filesystem API library code has method that helps correctly converting base64 into Blob.

With this I corrected my code into:

$cordovaFile.readAsDataURL(file.directory, file.name).then(function(response) {
 // take jpeg image as example
 var imageFile = dataURLToBlob(response);
 formData.append('photo', imageFile, file.name);
};

It does convert my image file correctly, and my app is no longer uploading broken image again.

Reference:
http://stackoverflow.com/questions/12168909/blob-from-dataurl

Default Hash key of Android apk

I found the solution from this,
every IDE will have the default keystore password.

Like the case when I build my apk (android app package),
it will generated with the default hash key.

Generating an APK in the Debug Mode

• Keystore name: debug.keystore
• Keystore password: android
• Key alias: androiddebugkey
• Key password: android
• CN (common name): CN=Android Debug,O=Android,C=US

In order to get the hash key with the keytool command, 

you need the "Key alias" and "Key password" values.

keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore | openssl sha1 -binary | openssl base64

(command for mac)

Enable PHP extension

Since I use homebrew to install PHP (Command: brew install php56)

And so, we'll have my php.ini file located in other directory.
which is,

/usr/local/etc/php/5.6/php.ini

so you'll have to edit this file in order to activate extension.
In the file, in the Dynamic Extensions part, you will see a list of commented out extensions.

;extension=php_bz2.dll
;extension=php_curl.dll
;extension=php_fileinfo.dll
;extension=php_gd2.dll
;extension=php_gettext.dll
;extension=php_gmp.dll
;extension=php_intl.dll
;extension=php_imap.dll
;extension=php_interbase.dll
;extension=php_ldap.dll
;extension=php_mbstring.dll

Install desired extension eg.

brew install php56-mcrypt

remove the semicolon ";" at the desired extension to enable it.
and then restart apache server with

sudo apachectl restart 

your extension would be ready for action.

OnsenUI: Change tab without pressing ons-tabber's ons-tab (with AngularJs)

I have been searching around for changing tab with AngularJs $scope function, without pressing on the ons-tabber's tab.
This function will do the trick setActiveTab()
First, you have to specify name for the tabbar,

(eg. ons-tabbar[var="myTabbar"])

use setActiveTab() with index (just like array, start from 0) for myTabbar:
myTabbar.setActiveTab(1) for my case below.

AngularJs

var app = angular.module('app', ['onsen']);

app.controller('myCtrl', ['$scope', function($scope) {
  $scope.goHome = function() {
    // setActiveTab(index, options)
    myTabbar.setActiveTab(1, {animation: 'fade'});
  };
}]);

Html

<ons-page ng-controller="myCtrl">
  <ons-toolbar>
    <div class="right">
      Toolbar - myCtrl
    </div>
  </ons-toolbar>
  
  <ons-button ng-click="goHome()">Go Home</ons-button>

  <ons-tabbar var="myTabbar">
    <ons-tab active="true" icon="ion-images" label="App" no-reload="" page="app.html" persistent=""></ons-tab>
    <ons-tab icon="fa-user" label="Home" no-reload="" page="home.html" persistent=""></ons-tab>
  </ons-tabbar>
</ons-page>

Summary
The main part:

• use variable name for ons-tabbar
• use setActiveTab(index) with the tabbar variable name to redirect

The meaning of OAuth redirect URIs

Because of my limited understanding about the technical term used in Facebook Developer,

I have been struggling hard to implement even the login provided by Facebook. 

SO I'm writing this for future reference:

Valid OAuth redirect URIs = the URL (or link) of where your Facebook login placed.

Meaning of OAuth redirect URIs

Eg. 

if your Facebook placed under the URL http://localhost/facebook/login/
then you can insert either http://localhost/ or http://localhost/facebook/login/ (exact URL) in the Valid OAuth redirect URIs input box.