/**
 * Created by Pascal on 26/10/16.
 */

/*
 * requestAnimationFrame pollyfill
 */
if (!window.requestAnimationFrame) {
    window.requestAnimationFrame = (window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame || function (callback) {
        return window.setTimeout(callback, 1000 / 60);
    });
}

/*!
 * Mantis.js / jQuery / Zepto.js plugin for Constellation
 * @version 1.2.2
 * @author Acauã Montiel <contato@acauamontiel.com.br>
 * @license http://acaua.mit-license.org/
 */
(function ($, window) {
    /**
     * Makes a nice constellation on canvas
     * @constructor Constellation
     */
    function Constellation (canvas, options) {
        var $canvas = $(canvas),
            context = canvas.getContext('2d'),
            defaults = {
                star: {
                    color: 'rgba(255,255,255,0.8)',
                    width: 3
                },
                line: {
                    color: 'rgba(255,255,255,0.1)',
                    width: 1
                },
                position: {
                    x: 0, // This value will be overwritten at startup
                    y: 0 // This value will be overwritten at startup
                },
                width: window.innerWidth,
                height: window.innerHeight,
                velocity: 0.2,
                length: 100,
                distance: 120,
                radius: 800,
                stars: []
            },
            config = $.extend(true, {}, defaults, options);

        // Create the Star class
        function Star () {

            // Give it a random position on the canvas
            this.x = Math.random() * canvas.width;
            this.y = Math.random() * canvas.height;

            // Give it a random speed
            this.vx = (config.velocity - (Math.random() * 0.5));
            this.vy = (config.velocity - (Math.random() * 0.5));

            // Give it a random size
            this.radius = (Math.random()+0.3) * config.star.width;
        }

        // Add some methods to the star class
        Star.prototype = {

            // Create/draw the star
            create: function(){
                // start drawing
                context.beginPath();
                // draw a circle
                // arc( Y, X, R, startAngle, endAngle, direction (false = clockwise)
                context.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
                // fill circle
                context.fill();
            },

            // Crate function that moves the star
            animate: function(){
                var i;
                // For every created star
                for (i = 0; i < config.length; i++) {

                    var star = config.stars[i];

                    // If the star reaches the top/bottom edge, reverse the y-speed
                    if (star.y < 0 || star.y > canvas.height) {
                        star.vy = - star.vy;
                        // If the star reaches the left/right edge, reverse the x-speed
                    } else if (star.x < 0 || star.x > canvas.width) {
                        star.vx = - star.vx;
                    }

                    // Update stars x and y
                    star.x += star.vx;
                    star.y += star.vy;
                }
            },

            // Draw a line
            line: function(){
                var length = config.length,
                    iStar,
                    jStar,
                    i,
                    j;

                // Loop through each star
                for (i = 0; i < length; i++) {
                    // Check every other star
                    for (j = 0; j < length; j++) {
                        // The first star we are checking
                        iStar = config.stars[i];
                        // Every other star we are comparing
                        jStar = config.stars[j];

                        // If the star is near
                        if (
                            // Check distance on the right
                        (iStar.x - jStar.x) < config.distance &&
                        // Check distance on the bottom
                        (iStar.y - jStar.y) < config.distance &&
                        // Check distance on the left
                        (iStar.x - jStar.x) > - config.distance &&
                        // Check distance on the top
                        (iStar.y - jStar.y) > - config.distance
                        ) {
                            // Draw line when the stars are close to each other
                            context.beginPath();
                            context.moveTo(iStar.x, iStar.y);
                            context.lineTo(jStar.x, jStar.y);
                            context.stroke();
                            context.closePath();

                            // Check if the mouse is near
                            /*if (
                             (iStar.x - config.position.x) < config.radius &&
                             (iStar.y - config.position.y) < config.radius &&
                             (iStar.x - config.position.x) > - config.radius &&
                             (iStar.y - config.position.y) > - config.radius
                             ) {
                             context.beginPath();
                             context.moveTo(iStar.x, iStar.y);
                             context.lineTo(jStar.x, jStar.y);
                             context.stroke();
                             context.closePath();
                             }*/
                        }
                    }
                }
            }
        };

        // Create the stars
        this.createStars = function () {
            var length = config.length,
                star,
                i;

            // Clear the canvas
            context.clearRect(0, 0, canvas.width, canvas.height);

            // Loop through the amount of stars
            for (i = 0; i < length; i++) {
                // Push a new star in the array
                config.stars.push(new Star());
                // Save that new star in a variable
                star = config.stars[i];
                // Call the create method to draw the star
                star.create();
            }

            // Check if any star is close to any other star
            star.line();
            // Move the stars
            star.animate();
        };

        // Set canvas size
        this.setCanvas = function () {
            canvas.width = config.width;
            canvas.height = config.height;
        };

        // Set color for stars and lines
        this.setContext = function () {
            context.fillStyle = config.star.color;
            context.strokeStyle = config.line.color;
            context.lineWidth = config.line.width;
        };

        // Set initial mouse position
        this.setInitialPosition = function () {
            if (!options || !options.hasOwnProperty('position')) {
                config.position = {
                    x: canvas.width * 0.5,
                    y: canvas.height * 0.5
                };
            }
        };

        // Loop a function
        this.loop = function (callback) {
            // Call the function the first time
            callback();
            // Setup the loop
            window.requestAnimationFrame(function () {
                this.loop(callback);
            }.bind(this));
        };

        // Initialise plugin
        this.init = function () {
            this.setCanvas();
            this.setContext();
            this.setInitialPosition();
            this.loop(this.createStars);
            //this.bind();
        };
    }

    $.fn.constellation = function (options) {
        return this.each(function () {
            var c = new Constellation(this, options);
            c.init();
        });
    };
})($, window);