(function ($) {

    $.fn.socialCircle = function (options) {
        var $this = $(this);
        // Make everything a circle and center
        $(this).siblings().addBack().each(function () {
            var iconRadius = $(this).width() / 2;
            $(this).css({
                "border-radius": "50%",
               
                "line-height": $(this).width() + "px",
                "opacity": "0"

            });
        });
        var centerCircle = $(this)
        // Default Options
        var settings = $.extend({
            // Rotate in degrees around the circle 0 to 360
            rotate: 0,
            // Distance of icons from the center
            radius: 10,
            // Divide circle by
            circleSize: 30,
            // Animation speed
            speed: 300
        }, options);

        // Click handling for socialCircle       
        $(this).click(function (event) {
            event.stopPropagation();
            if ($(this).hasClass("closed")) {
                $(this).removeClass("closed").addClass("open");
                expand();
            } else {
                $(this).removeClass("open").addClass("closed");
                retract();
            }
            event.preventDefault();

        });

        $(document).on('click', function () {
            if ($this.hasClass("open")) {
                $this.removeClass("open").addClass("closed");
                retract();
            }
        });

        //add handling for 0 values to avoid division error	     
        if (settings.rotate == 0) {
            var rotate = 0;
        } else {
            var rotate = (Math.PI) * 2 * settings.rotate / 360;
        }
        if (settings.circleSize == 0) {
            var rotate = 0;
        } else {
            var circleSize = settings.circleSize;
        }
        function expand() {
            // variables for expand function	
            var radius = settings.radius,
            icons = centerCircle.siblings(),
            container = centerCircle.parent(),
            width = container.width(),
            height = container.height(),
            step = (2 * Math.PI) / icons.length / settings.circleSize,
            angle = rotate + (step / 2);
            // Determine placement of icons	
            icons.each(function () {
                var x = Math.round(width / 2 + radius * Math.cos(angle) - $(this).width() / 2);
                var y = Math.round(height / 2 + radius * Math.sin(angle) - $(this).height() / 2);
                // Animate Expansion
                $(this).css({
                    "background": "#07074e",
                });
                $(this).animate({
                  
                    margin: '0px',
                    opacity: '1'

                }, {
                    duration: settings.speed,
                    queue: false
                });
                angle += step;
            });
        }

        function retract() {
            var radius = 0,
            icons = centerCircle.siblings(),
            container = centerCircle.parent(),
            width = container.width(),
            height = container.height(),
            angle = rotate,
            step = (3 * Math.PI) / icons.length / settings.circleSize;
            // Determine placement of icons	
            icons.each(function () {
                var x = Math.round(width / 3 + radius * Math.cos(angle) - $(this).width() / 3);
                var y = Math.round(height / 3 + radius * Math.sin(angle) - $(this).height() / 3);
                // Animate Retractions
                $(this).css({
                    "background": "none",
                });
                $(this).animate({
                   
                    margin: '0px',
                    opacity: '0'

                }, {
                    duration: settings.speed,
                    queue: false
                });
                angle += step;
            });
        }
    };

}(jQuery));