// remap jQuery to $
(function($){
if ($('canvas').hasClass('stars')) {
        
        /*
         * Starfield effect done in HTML 5
         *
         * The MIT License (MIT)
         *
         * Copyright (c) 2015 TimeWaster - sebi@timewaster.de
         *
         * Permission is hereby granted, free of charge, to any person obtaining a copy
         * of this software and associated documentation files (the "Software"), to deal
         * in the Software without restriction, including without limitation the rights
         * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
         * copies of the Software, and to permit persons to whom the Software is
         * furnished to do so, subject to the following conditions:
         *
         * The above copyright notice and this permission notice shall be included in all
         * copies or substantial portions of the Software.
         *
         * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
         * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
         * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
         * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
         * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
         * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
         * SOFTWARE.
         */
        window.onload = function() {

            /* --- config start --- */

            var starfieldCanvasId     = "stars",          // id of the canvas to use
                framerate             = 100,                // frames per second this animation runs at (this is not exact)
                numberOfStarsModifier = 0.5,               // Number of stars, higher numbers have performance impact
                flightSpeed           = 0.075;             // speed of the flight, the higher this number the faster

            /* ---- config end ---- */

            var canvas        = document.querySelector('.stars');
                context       = canvas.getContext("2d"),
                width         = canvas.width,
                height        = canvas.height,
                numberOfStars = width * height / 1000 * numberOfStarsModifier,
                dirX          = width / 2,
                dirY          = height / 2,
                stars         = [],
                TWO_PI        = Math.PI * 2;

            // initialize starfield
            for(var x = 0; x < numberOfStars; x++) {
                stars[x] = {
                    x: range(0, width),
                    y: range(0, height),
                    size: range(0, 1)
                };
            }

            // when mouse moves over canvas change middle point of animation
//            canvas.onmousemove = function(event) {
//                dirX = event.offsetX/100,
//                dirY = event.offsetY/100;
//            }

            // start tick at specified fps
            window.setInterval(tick, Math.floor(1000 / framerate));

            // main routine
            function tick() {
                var oldX,
                    oldY;

                // reset canvas for next frame
                context.clearRect(0, 0, width, height);

                for(var x = 0; x < numberOfStars; x++) {
                    // save old status
                    oldX = stars[x].x;
                    oldY = stars[x].y;

                    // calculate changes to star
                    stars[x].x += (stars[x].x - dirX) * stars[x].size * flightSpeed;
                    stars[x].y += (stars[x].y - dirY) * stars[x].size * flightSpeed;
                    stars[x].size += flightSpeed;

                    // if star is out of bounds, reset
                    if(stars[x].x < 0 || stars[x].x > width || stars[x].y < 0 || stars[x].y > height) {
                        stars[x] = {
                            x: range(0, width),
                            y: range(0, height),
                            size: 0
                        };
                    }

                    // draw star
                    context.strokeStyle = "rgba(255, 255, 255, " + Math.min(stars[x].size, 1) + ")";
                    context.lineWidth = stars[x].size;
                    context.beginPath();
                    context.moveTo(oldX, oldY);
                    context.lineTo(stars[x].x, stars[x].y);
                    context.stroke();
                }
            }

            // get a random number inside a range
            function range(start, end) {
                return Math.random() * (end - start) + start;
            }
        };
}
})(window.jQuery);