mrtonyhuynh/custom-social-share.html

## custom-social-share.html
<html>
<head>
    <title>Social Share</title>
</head>

<body>
    <h2>Custom Social Share Button with Callback</h2>

    <button id="share-facebook">Share on Facebook</button>
    <button id="share-twitter">Share on Twitter</button>

    <div id="fb-root"></div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
    <script>
        (function(doc, script) {
            var js,
                fjs = doc.getElementsByTagName(script)[0],
                frag = doc.createDocumentFragment(),
                add = function(url, id) {
                    if (doc.getElementById(id)) {return;}
                    js = doc.createElement(script);
                    js.src = url;
                    id && (js.id = id);
                    frag.appendChild(js);
                };

            add('https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3&appId=', 'facebook-jssdk');
            add('https://platform.twitter.com/widgets.js');

            fjs.parentNode.insertBefore(frag, fjs);
        }(document, 'script'));
    </script>
    <script>
        var app = app || {};

        app.facebook = {
            share : function() {
                alert('clicked');

                FB.ui({
                    method: 'share',
                    href: 'https://developers.facebook.com/docs/dialogs/',
                }, function(response) {
                    console.log(response);

                    if (response && response.post_id) {
                        alert('published');
                    } else {
                        alert('not published');
                    }
                });
            },
            feed : function() {
                alert('clicked');

                FB.ui({
                    method: 'feed',
                    name: '',
                    link: '',
                    picture: '',
                    caption: '',
                    description: ''
                }, function(response) {
                    console.log(response);

                    if (response && response.post_id) {
                        alert('published');
                    } else {
                        alert('not published');
                    }
                });
            },
        };

        app.twitter = {
            share : function() {
                alert('clicked');

                twttr.ready(function (twttr) {
                    twttr.events.bind('tweet', function (event) {
                        console.log(event);

                        alert('published');
                    });
                });

                var popup = window.open('https://twitter.com/intent/tweet?text=', 'popupwindow', 'scrollbars=yes,width=800,height=400');

                popup.focus();
            }
        };
    </script>
    <script>
        $(document).ready(function() {
            $('#share-facebook').on('click', function() {
                app.facebook.share();
            });

            $('#share-twitter').on('click', function() {
                app.twitter.share();
            });
        });
    </script>
</body>
</html>
	<html>
	<head>
	<title>Social Share</title>
	</head>

	<body>
	<h2>Custom Social Share Button with Callback</h2>

	<button id="share-facebook">Share on Facebook</button>
	<button id="share-twitter">Share on Twitter</button>

	<div id="fb-root"></div>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
	<script>
	(function(doc, script) {
	var js,
	fjs = doc.getElementsByTagName(script)[0],
	frag = doc.createDocumentFragment(),
	add = function(url, id) {
	if (doc.getElementById(id)) {return;}
	js = doc.createElement(script);
	js.src = url;
	id && (js.id = id);
	frag.appendChild(js);
	};

	add('https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3&appId=', 'facebook-jssdk');
	add('https://platform.twitter.com/widgets.js');

	fjs.parentNode.insertBefore(frag, fjs);
	}(document, 'script'));
	</script>
	<script>
	var app = app \|\| {};

	app.facebook = {
	share : function() {
	alert('clicked');

	FB.ui({
	method: 'share',
	href: 'https://developers.facebook.com/docs/dialogs/',
	}, function(response) {
	console.log(response);

	if (response && response.post_id) {
	alert('published');
	} else {
	alert('not published');
	}
	});
	},
	feed : function() {
	alert('clicked');

	FB.ui({
	method: 'feed',
	name: '',
	link: '',
	picture: '',
	caption: '',
	description: ''
	}, function(response) {
	console.log(response);

	if (response && response.post_id) {
	alert('published');
	} else {
	alert('not published');
	}
	});
	},
	};

	app.twitter = {
	share : function() {
	alert('clicked');

	twttr.ready(function (twttr) {
	twttr.events.bind('tweet', function (event) {
	console.log(event);

	alert('published');
	});
	});

	var popup = window.open('https://twitter.com/intent/tweet?text=', 'popupwindow', 'scrollbars=yes,width=800,height=400');

	popup.focus();
	}
	};
	</script>
	<script>
	$(document).ready(function() {
	$('#share-facebook').on('click', function() {
	app.facebook.share();
	});

	$('#share-twitter').on('click', function() {
	app.twitter.share();
	});
	});
	</script>
	</body>
	</html>