Google Maps Address Interaction(postcode) using

I am using jquery, html5 for this example.

HTML

Load the google maps api link

https://maps.googleapis.com/maps/api/js?sensor=true

This will be the container of the google maps Note: Set height for your google map container.

JS

var map;

var geocoder;

//This function intialize the google maps settings

function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var mapOptions = {
        zoom: 16, center: latlng, disableDoubleClickZoom: true
    }
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

//This function sets the address for the google map
function codeAddress(address) {
    geocoder.geocode({'address': address}, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
        } 
    });
}

//now its time to load the google maps

$(document).ready(function(){

     initialize();
     codeAddress('600'); //set default postcode

});


Enable Cross Domain AJax File Upload using jquery file upload plugin

WHAT TO DO FIRST?
1. Enable Cross Domain Ajax Request

2.  Download Blueimp file upload. (I will be using this jquery file upload plugin for my ajax upload).

START

1. First thing first is to initialize your file upload on the client side.

//html
<input id="fileupload" type="file" name="file">


//javascript
jQuery("#fileupload").fileupload({
    url: //url for upload handler,
    datatype: 'json',
    xhrFields: {
        withCredentials: true
    },
    done: function (e, data) {
       //code for done uploading callback
    }
})

As you can see above i set withCredentials to true which will help me for xdomain request

And for the server side (i use php for this one)

if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
    return YOURRESTRESPONSE('OK');
}

if (isset($_FILES['file']) && $_FILES['file']['error'] == 0) { // handle upload heare}

You should be wondering why there is a blocking for REQUEST METHOD “OPTION” because it will validate if the request is authentic which will depend on the response header YOURRESTRESPONSE is a custom function i created for modified header response. The functin contains modifying

Access-Control-Allow-Credentials your_other_origin
Access-Control-Allow-Origin  'true'
Access-Control-Allow-Methods  'POST PUT DELETE GET OPTIONS'

Above Properties are stated on Enable Cross Domain Ajax Request

If YOURRESTRESPONSE is success. Blueimp ajax upload will automatically send another request for file upload.
And after that your upload file should be working.

Enable Cross Domain Ajax Request with Zend Framework 2

Cross Domain Ajax Request  are forbidden by default because of their ability to perform advanced requests (POST, PUT, DELETE and other types of HTTP request, along with specifying custom HTTP Headers) that introduce many security issues as described in cross-site scripting.

I discover some hack(i dont know whether it is an appropriate term for this but i think its not 😉 ) on how to deal with this.

Using jquery on front end and zf2 for back-end this is what i did.

This line customizes the ajax option that i will be sending , as you could see i enable crossDomain , and the credentials

jQuery.ajaxPrefilter(function (options, originalOptions, jqXHR) {
    options.crossDomain = {
        crossDomain: true
    };
    options.xhrFields = {
        withCredentials: true
    };
});

Then from the back-end using ZF2, i set value for Access-Control-Allow-Origin which will be the specific domain note if you set allow credential to true Access-Control-Allow-Origin can only be set to a specific domain therefore using wildcard like ‘*’ is not allowed.

$response = $this->getResponse();
$response->getHeaders()->addHeaderLine('Access-Control-Allow-Origin', 'http://test.com');
$response->getHeaders()->addHeaderLine('Access-Control-Allow-Credentials', 'true');
$response->getHeaders()->addHeaderLine('Access-Control-Allow-Methods', 'POST PUT DELETE GET');

$response->setStatusCode(200);
$response->setContent('content here');
return $response;

Then back to the file where you put the ajaxfilter.
The final step is adding the actual ajax request.

jQuery.ajax({
    url: //yourdestinationFile,
    type: 'POST',
    data: {somedata:value},
    success: function (data) {

    }
});

Then FINISH!!! Your ajax request to other domain should work.

MindBody WordPress Integration

You might be familiar of how awesome HealCode is. They provide some awesome plug and play widgets. Like Classes, Scheduling, Store etc.. For more awesomeness please visit https://www.healcode.com/ .

Now you might wonder how they made it. Healcode is using  MindBody available API which you will be granted once your are registered as a mindbody developer.

I made similar(will correct me i might be similar perhaps) way on how they do it.

What to do first?

  1. You have to register as a mindbody developer, here is the link https://developers.mindbodyonline.com/
  2. Upon registration you will be given your own api key, resourse name and siteid (This is for the mindbody sandbox only if you want you can activate your site to go live and you will be given a siteid).
  3. Setup your apache, mysql, php. I advice use xampp for windows. And you should perhaps enable the open ssl cause we will be using https request for the mindbody request.
  4. Setup your WordPress site.

Lets go!

  1. You can add/download the mzoo mindbody plugin on your wordpress site and modify it later for the lacking services. Incase you dont know the structure you can find the mzoo plugin file here projectdir/wp-content/plugins/mz-mindbody-api .
  2. On your wp-admin you can go to Settings-> MZ Mindbody. These is where you will be going to fillout the necessary information(The mindbody credential you are granted after you register as a mindbody developer) . Please see the image below.

  3. Then Save.

  4. Now you have already completed setting up your mindbody connection then now as you can see from the image above they are providing shortcodes use that shortcode to implement mindbody widget.

  5. Create a page then make[mz-mindbody-show-schedule] shortcode as a content.

  6. There you go you have a schedule widget , you can see above they only provide few widgets now you can modify the plugin projectdir/wp-content/plugins/mz-mindbody-api . There are lots of available service mindbody can provide, found on this link https://developers.mindbodyonline.com/Develop/GettingStarted(note you should first login as a mindbody developer). Please see api methods.

COMMIT/ROLLBACK on Database recursive queries

This topic is about how you handle error on recursive/looped database transaction.

Imagine Inserting a batches(rows) of data from the database if ones batch(row) fails, the next rows to be inserted will be disregarded which results to a not complete batch of data inserted.

So below is how you handle this common scenario.

try {

            $wpdb->query(‘START TRANSACTION’);

            //recursive query here

            $wpdb->query(‘COMMIT’);

}catch(Exception $e){

     //some error handling code here

      $wpdb->query(‘ROLLBACK’);

}

Note i am using wpcodex functions, can be applied in any platforms as long as you have START TRANSACTION,COMMIT on success and ROLLBACK on failure.

1. START TRANSACTION will start the db TRANSACTION

2. Recursive queries examples are, multiple inserts from db.

foreach ($step->controls as $control) {

                    $wpdb->insert(‘controls’, array(

                        ‘control’ => $control->name,

                        ‘step_id’ => $step_id,

                    ));

      }

Assuming line above will insert multiple rows to the DB unless there is no error will occur it will fire the COMMIT that will execute all the inserts, else transaction will fire the ROLLBACK which will undo all the changes from the db within the transaction

Install Apache Tika on Debian

  1. 1. Update java (your current java should be java7 or higher, if its already updated proceed to step 2.

    echo “deb http://ppa.launchpad.net/webupd8team/java/ubuntu trusty main” | tee /etc/apt/sources.list.d/webupd8team-java.list

    echo “deb-src http://ppa.launchpad.net/webupd8team/java/ubuntu trusty main” | tee -a /etc/apt/sources.list.d/webupd8team-java.list

    apt-key adv –keyserver hkp://keyserver.ubuntu.com:80 –recv-keys EEA14886

    apt-get update

    apt-get install oracle-java8-installer

    now check the java version: eg. java -version

    I should show like 

    java version “1.8.0_25”

    Java(TM) SE Runtime Environment (build 1.8.0_25-b17)

    Java HotSpot(TM) 64-Bit Server VM (build 25.25-b02, mixed mode)

    If its still an old version you can follow the link below

    2. Donwload Tika

       b. Unzip:    eg. unzip tika-1.6-src.zip

    3. Intall Maven 2 for our Tika build system

       b. Unzip: eg. unzip apache-maven-3.2.3-bin.zip

       c. Follow the installation guide here-> http://maven.apache.org/download.cgi#Installation

    4. Install Tika

       a. Enter to tika base directory eg. cd tika-1.6

       b. build tika using maven2: eg mvn install

    5. Finish. Now you can test tika 

       a. From the base directory of tika you can do

          java -jar tika-app/target/tika-app-1.6.jar -j [file]  

          The output should be a json encoded metadata of a file

          For some options you can see http://tika.apache.org/1.6/gettingstarted.html or java -jar tika-app/target/tika-app-1.6.jar –help