Javascript: Connect to facebook (need to set FB_APPID first !)

Facebook .js

/*
 *	FACEBOOK Loading
 */
window.fbAsyncInit = function () {
    FB.init({
        appId: FB_APPID,
            fileUpload: true,
	    status: true, // check login status
	    cookie: true, // enable cookies to allow the server to access the session
	    xfbml: true,  // parse social plugins on this page
	    version: 'v2.1' // use version 2.1
    });

    FB.Event.subscribe('auth.authResponseChange', function (response) {
	    if (response.status === 'connected')
		    $(document).trigger('fbload');  //  <---- THIS RIGHT HERE TRIGGERS A CUSTOM EVENT CALLED 'fbload'
	    else
		    $(document).trigger('fbunload');
    });
};

(function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

Post canvas to Facebook .js

/*
 * Adapted from : https://coderwall.com/p/4qpmfw/sharing-html5-canvas-images-to-directly-to-facebook
 */
function postCanvasToFacebook() {
  var data = canvas.toDataURL("image/png");
  var encodedPng = data.substring(data.indexOf(',') + 1, data.length);
  var decodedPng = Base64Binary.decode(encodedPng);
  postMessage(message, decodedPng, pageID, isUserProfile);
  // ...
}
            
function postImageToFeed(message, imageData, pageID, authToken) {
    // this is the multipart/form-data boundary we'll use
    var boundary = '----ThisIsTheBoundary1234567890';
    // let's encode our image file, which is contained in the var
    var formData = '--' + boundary + '\r\n'
    formData += 'Content-Disposition: form-data; name="source"; filename="imageSharepoint";\r\n';
    formData += 'Content-Type: image/png\r\n\r\n';
    for (var i = 0; i < imageData.length; ++i) {
        formData += String.fromCharCode(imageData[i] & 0xff);
    }
    formData += '\r\n';
    formData += '--' + boundary + '\r\n';
    formData += 'Content-Disposition: form-data; name="message"\r\n\r\n';
    formData += message + '\r\n'
    formData += '--' + boundary + '--\r\n';

    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'https://graph.facebook.com/' + pageID+ '/photos?access_token=' + authToken, true);
    xhr.setRequestHeader("Content-Type", "multipart/form-data; boundary=" + boundary);
    var nBytes = formData.length;
    var ui8Data = new Uint8Array(nBytes);
    for (var nIdx = 0; nIdx < nBytes; nIdx++) {
        ui8Data[nIdx] = formData.charCodeAt(nIdx) & 0xff;
    }
    xhr.onload = function (data) {
        alert("Votre message a été partagé !");
        close_popupWindow();
    };
    xhr.onerror = function (shr, status, data) {
        alert(JSON.stringify(shr));
    };
    xhr.send(ui8Data);
};

Triggers .js

        /*
         * Add listener to fbload et fbunload
         * Then add/remove items from option list
         */
		$(document).trigger('pageLoad');

		//FBLOAD
		$(document).on('fbload',
            function () {
                document.getElementById("selectPage").innerHTML = "";
                FB.api("/me", processResponse);
                FB.api("/me/accounts", processResponse);
            }
        );

		//FBUNLOAD
		$(document).on('fbunload',
            function () {
                document.getElementById("selectPage").innerHTML = "";
                $("#ShareButton").hide();
            }
        );
        
        /*
         *  When we get the user ID and the list pages IDs
         */
		function processResponse(response) {
		    if (!response || response.error) {
		        alert(JSON.stringify(response.error));
		    } else {
		        $("#ShareButton").show();
		        if (response.data instanceof Array) {
		            for (var item in response.data) {
		                addSelectorOption(response.data[item]);
		            }
		        } else {
		            addSelectorOption(response, 0);
		        }		        
		    }
		}

Utilities (Post message & images) .js

/*
 *  Post a message on feed (User profile or one of the User page)
 *  linkToShare and image optional (can be null)
 */
function postMessage(messageToShare, /*linkToShare,*/ image, pageID, isUserProfile) {
    var imageExist = typeof image != 'undefined'

    if (isUserProfile) {   // Post on user page
        if (imageExist)
            postImageToFeed(messageToShare, image, pageID, accessToken);
        else
            postTextToFeed(messageToShare, /*linkToShare,*/ pageID, true);
    }
    else {                      // Else we need an access_token to post on a page
        FB.api("/" + pageID + "?fields=access_token",
                function (response) {
                    if (!response || response.error) {
                        alert(JSON.stringify(response.error));
                    } else {
                        if (imageExist)
                            postImageToFeed(messageToShare, image, pageID, response["access_token"]);
                        else
                            postTextToFeed(messageToShare, /*linkToShare,*/ pageID, false, response["access_token"])
                    }
                }
            );
    }

    /*
     *  Post to the page feed with the given access_token
     *  DEPRECATED: use postToFeedAdvanced
     */
    function postTextToFeed(messageToShare, /*linkToShare,*/ pageID, isUserProfile, accessToken) {
        var data;
        if (isUserProfile) {
            data = {
                message: messageToShare,
                /*link: linkToShare*/
            }
        }
        else {
            data = {
                access_token: accessToken,
                message: messageToShare,
                /*link: linkToShare*/
            }
        }

        FB.api("/" + pageID + "/feed",
            "post", data,
            function (response) {
                if (!response || response.error) {
                    alert(JSON.stringify(response.error));
                } else {
                    alert("Votre message a été partagé !");
                    close_popupWindow();
                }
            }
        );
    }
    

    function postImageToFeed(message, image, pageID, accessToken) {
        var formData = new FormData();
        formData.append("access_token", accessToken);
        formData.append("message", message);
        formData.append("file", image);

        $.ajax({
            url: "https://graph.facebook.com/" + pageID + "/photos",
            data: formData,
            type: "POST",
            cache: false,
            processData: false,
            contentType: false,
            success: function (data) {
                alert("Votre message a été partagé !");
                close_popupWindow();
            },
            error: function (shr, status, data) {
                alert(JSON.stringify(shr));
            }
        });
    }
}