Adding multiple custom buttons to TinyMCE

Hi fella,

Have you tried to add custom buttons to TinyMCE. For example, if you want an email and replace some shortcuts to content in your backend, you can customize your body text are on the email adding this couple of buttons: User password [password] and User name [fullname].

The code:

<script type="text/javascript" src="<your installation path>/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
    mode : "textareas",
    theme : "advanced",
    theme_advanced_buttons1 : "bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright, justifyfull,bullist,numlist,undo,redo,link,unlink",
    theme_advanced_buttons2 : "password,fullname",
    theme_advanced_buttons3 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    plugins : 'inlinepopups',
    setup : function(ed) {
        // Add custom buttons
        ed.addButton('password', {
            title : 'User Password',
            image : 'img/example.gif',
            onclick : function() {
                // Add you own code to execute something on click
                ed.focus();
                ed.selection.setContent('[password]');
            }
        });

        ed.addButton('fullname', {
            title : 'User name',
            image : 'img/example.gif',
            onclick : function() {
                // Add you own code to execute something on click
                ed.focus();
                ed.selection.setContent('[fullname]');
            }
        });
    }
});
</script>
 
<form method="post" action="somepage">
        <textarea name="content" style="width:100%">
        </textarea>
</form>

How to enable remote access to MySql server

Hello,
If you need to enable remote access to your MySql sever, these are the steps that you need to follow:

1. Make sure these lines are commented:
on Linux:
sudo vi /etc/mysql/my.conf

# bind-address = localhost
# skip-external-locking

2. restart mysql server

3. Set access on the mysql.user table to all the user and IP's. For example, the following one it's for root and IP: 10.0.0.1

sql->INSERT INTO `mysql.user` (`Host`, `User`, `Password`, `Select_priv`, `Insert_priv`, `Update_priv`, `Delete_priv`, `Create_priv`, `Drop_priv`, `Reload_priv`, `Shutdown_priv`, `Process_priv`, `File_priv`, `Grant_priv`, `References_priv`, `Index_priv`, `Alter_priv`, `Show_db_priv`, `Super_priv`, `Create_tmp_table_priv`, `Lock_tables_priv`, `Execute_priv`, `Repl_slave_priv`, `Repl_client_priv`, `Create_view_priv`, `Show_view_priv`, `Create_routine_priv`, `Alter_routine_priv`, `Create_user_priv`, `Event_priv`, `Trigger_priv`, `Create_tablespace_priv`, `ssl_type`, `ssl_cipher`, `x509_issuer`, `x509_subject`, `max_questions`, `max_updates`, `max_connections`, `max_user_connections`, `plugin`, `authentication_string`) VALUES
('10.0.0.1', 'root', '*2470C0C06DEE42FD1618BB99005ADCA2EC9D1E19', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', 'Y', '', '', '', '', 0, 0, 0, 0, '', NULL);

4. Finally flush the privileges.
sql->flush privileges;

How to get distances between different places

Hello,
This article is about how to get the distance between different places. Basically I'm going to explain how to do in easy way a PHP interface to get the distance from a origin place to different destinations.
Nowadays this functionality can be required for quite a lot of web sites. Imagine if you're looking for the nearest restaurant, shop,.... from you home address, current position...
I'm going to explain this solution using the Google Matrix API. Please have a look the following website an specially the usage limits before starting using the API ( https://developers.google.com/maps/documentation/distancematrix/ )

This is my interface written in PHP:

Input 

• $origin: it's an address. It can be any place: a postcode, a city, ....
• $destinations: it's an address or list or address.
• $elements: It's an array.
• $mode: (optional, defaults to driving) — specifies what mode of transport to use when calculating directions. Valid values are:
  • driving (default) indicates standard driving directions using the road network.
  • walking requests walking directions via pedestrian paths & sidewalks (where available).
  • bicycling requests bicycling directions via bicycle paths & preferred streets (currently only available in the US and some Canadian cities).
• $units: (optional) — Specifies the unit system to use when expressing distance as text. The unit system to use can be specified: metric (default), returns distances in kilometers and meters or imperial returns distances in miles and feet.
• sensor:  (required) — Indicates whether your application is using a sensor (such as a GPS locator) to determine the user's location. This value must be either true or false.

 Output

• If the result of the integration with Google Matrix API has been sucessfull, each element of the array elements, will have a property call ['distance'] including the distance in miles or kilometers,....
• Moreover I've include a new function to return this elements ordering by the distance "sortmulti".

/**
    * Use Google API Matrix Distance to get the distance and order them
    * @param type $origin
    * @param type $destinations
    * @param type $elements
    * @return type
    */

    public static function orderByDistance($origin, $destinations, $elements, $mode = 'driving', $units='metric', $sensor=false) {
 
        // Calling Google API
        $resultGMaps = json_decode(file_get_contents($gMapsDistanceAPI));

        if ($resultGMaps->status === 'OK') {

            // Adding the distance got on Google maps to each element
            $elementAddDistance = current($elements);

            for ($index = 0; $index < count($elements); $index++) {

                $key = array_search($elementAddDistance, $elements);

                $elements[$key]['distance'] = $resultGMaps->rows[0]->elements[$index]->distance;

                $elementAddDistance = next($elements);
            }

            // Order the elements by distance ascending
            $elements = (sortmulti($elements, 'distance', 'asc'));
        }
       
        return $elements;
    }


/**
     * Order an array multidimensional
     * @param type $array
     * @param type $index
     * @param type $order
     * @param type $natsort
     * @param type $case_sensitive
     * @return type
     */
    public static function sortmulti($array, $index, $order, $natsort = FALSE, $case_sensitive = FALSE) {
        if (is_array($array) && count($array) > 0) {
            foreach (array_keys($array) as $key)
                $temp[$key] = $array[$key][$index];
            if (!$natsort) {
                if ($order == 'asc')
                    asort($temp);
                else
                    arsort($temp);
            }
            else {
                if ($case_sensitive === true)
                    natsort($temp);
                else
                    natcasesort($temp);
                if ($order != 'asc')
                    $temp = array_reverse($temp, TRUE);
            }
            foreach (array_keys($temp) as $key)
                if (is_numeric($key))
                    $sorted[] = $array[$key];
                else
                    $sorted[$key] = $array[$key];
            return $sorted;
        }
        return $sorted;
    }

Show places on your google maps

Hey fella,
The last version on Google maps API v3, include a service to show places next to a location. For example, imagine if you have a website to buy/rent properties. On the view property map, it would be interested if a customer can see some places next to the property, for example: schools, stores, restaurants,.....

You can have a look the API Places Library on Google maps (https://developers.google.com/maps/documentation/javascript/places)

I also want to explain a basic example that can be useful:
The following example uses Geocoder API services to get the coordinates of a location "Leeds, England". The location is marked in red colour and the places ( restaurants, stores and hotels ) in blue color.

Now have a look the code. Please feel free to use it in your application ( Copy&Paste ).


<html>
<head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=true&amp;libraries=places"></script>
</head>
<body>
<h1>Show restaurants, stores and hotels</h1>
<div id="gmap_output" style="height:400px;width:530px;margin:20px 0 0 0;clear:both"></div>
</body>
<script type="text/javascript">


   function load() {


var map;
      var infowindow;


      function initialize() {


geocoder = new google.maps.Geocoder();
   var myOptions = {
     zoom: 14,
     mapTypeId: google.maps.MapTypeId.ROADMAP,
streetViewControl: true,
   }
   map = new google.maps.Map(document.getElementById("gmap_output"), myOptions);


var address = 'Leeds';
    geocoder.geocode( { 'address': address}, function(results, status) {
       if (status == google.maps.GeocoderStatus.OK) {
       map.setCenter(results[0].geometry.location);


var latitude = results[0].geometry.location.ab;
var longitude = results[0].geometry.location.$a;


       var marker = new google.maps.Marker({
           map: map,


           position: results[0].geometry.location
      });

// Showing the places
var coordinates = new google.maps.LatLng(longitude, latitude);
   
       var request = {
         location: coordinates,
         radius: 500,
         types: ['restaurant','store','hotel'],
       };
       infowindow = new google.maps.InfoWindow();
       var service = new google.maps.places.PlacesService(map);
       service.search(request, callback);



   } else {
       alert("Geocode was not successful for the following reason: " + status);
   }
   });

  }


     function callback(results, status) {
       if (status == google.maps.places.PlacesServiceStatus.OK) {
         for (var i = 0; i < results.length; i++) {
           createMarker(results[i]);
          }
       }
     }


     function createMarker(place) {
       var placeLoc = place.geometry.location;
       var marker = new google.maps.Marker({
         map: map,
     icon: 'http://maps.google.com/intl/en_us/mapfiles/ms/micons/blue-dot.png',
         position: place.geometry.location
       });


       google.maps.event.addListener(marker, 'click', function() {
         infowindow.setContent(place.name);
         infowindow.open(map, this);
       });
     }

     google.maps.event.addDomListener(window, 'load', initialize);
   
   }


  load();
       
    </script>


</html>

Google maps by address

Hi fella,
If you want to add a google map section looking for the address instead of the coordinates, this is your article.
As I explained before in an previous article you will need to load the google javascript API and then write something like that:


<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=true">
</script>
</head>

<script type='text/javascript'>
  var geocoder;
  var map;
  function initialize() {
    geocoder = new google.maps.Geocoder();
    var myOptions = {
      zoom: 14,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
 streetViewControl: true,
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

var address = 'ls27ee, uk';
    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
        });
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });


  }
</script>

<body onload="initialize()">
 <div id="map_canvas" style="width: 400px; height: 400px;"></div>
 
</body>