autonomic.zone/assets/js/main.js

/*
  Spectral by HTML5 UP
  html5up.net | @ajlkn
  Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

(function($) {
  skel
    .breakpoints({
      xlarge: '(max-width: 1680px)',
      large: '(max-width: 1280px)',
      medium: '(max-width: 980px)',
      small: '(max-width: 736px)',
      xsmall: '(max-width: 480px)'
    });

  $(function() {

    var $window = $(window),
      $body = $('body'),
      $wrapper = $('#page-wrapper'),
      $banner = $('#banner'),
      $header = $('#header');

    // Disable animations/transitions until the page has loaded.
    $body.addClass('is-loading');

    $window.on('load', function() {
      window.setTimeout(function() {
        $body.removeClass('is-loading');
      }, 100);
    });

    // Mobile?
    if (skel.vars.mobile)
      $body.addClass('is-mobile');
    else
      skel
      .on('-medium !medium', function() {
        $body.removeClass('is-mobile');
      })
      .on('+medium', function() {
        $body.addClass('is-mobile');
      });

    // Fix: Placeholder polyfill.
    $('form').placeholder();

    // Prioritize "important" elements on medium.
    skel.on('+medium -medium', function() {
      $.prioritize(
        '.important\\28 medium\\29',
        skel.breakpoint('medium').active
      );
    });

    // Scrolly.
    $('.scrolly')
      .scrolly({
        speed: 1500,
        offset: $header.outerHeight()
      });

    $("#menu").show();

    // Menu.
    $('#menu')
      .append('<a href="#menu" class="close"></a>')
      .appendTo($body)
      .panel({
        delay: 500,
        hideOnClick: true,
        hideOnSwipe: true,
        resetScroll: true,
        resetForms: true,
        side: 'right',
        target: $body,
        visibleClass: 'is-menu-visible'
      });

    // Header.
    if (skel.vars.IEVersion < 9)
      $header.removeClass('alt');

    if ($banner.length > 0 &&
      $header.hasClass('alt')) {

      $window.on('resize', function() {
        $window.trigger('scroll');
      });

      $banner.scrollex({
        bottom: $header.outerHeight() + 1,
        terminate: function() {
          $header.removeClass('alt');
        },
        enter: function() {
          $header.addClass('alt');
        },
        leave: function() {
          $header.removeClass('alt');
        }
      });

    // Particles
    if ($( window ).width() > 980) {
      particlesJS('banner', {
        "particles": {
          "number": {
          "value": 65,
          "density": {
            "enable": false,
            "value_area": 800
          }
          },
          "color": {
          "value": "#f99081"
          },
          "shape": {
          "type": "circle",
          "stroke": {
            "width": 0,
            "color": "#000000"
          },
          "polygon": {
            "nb_sides": 5
          },
          "image": {
            "src": "img/github.svg",
            "width": 100,
            "height": 100
          }
          },
          "opacity": {
          "value": 0.6,
          "random": true,
          "anim": {
            "enable": false,
            "speed": 1,
            "opacity_min": 0.4,
            "sync": false
          }
          },
          "size": {
          "value": 14,
          "random": true,
          "anim": {
            "enable": true,
            "speed": 6,
            "size_min": 4,
            "sync": false
          }
          },
          "line_linked": {
          "enable": true,
          "distance": 250,
          "color": "#f99081",
          "opacity": 0.8,
          "width": 2
          },
          "move": {
          "enable": true,
          "speed": 0.4,
          "direction": "none",
          "random": true,
          "straight": false,
          "out_mode": "out",
          "bounce": false,
          "attract": {
            "enable": false,
            "rotateX": 600,
            "rotateY": 1200
          }
          }
        },
        "interactivity": {
          "detect_on": "canvas",
          "events": {
          "onhover": {
            "enable": true,
            "mode": "grab"
          },
          "onclick": {
            "enable": true,
            "mode": "push"
          },
          "resize": true
          },
          "modes": {
          "grab": {
            "distance": 200,
            "line_linked": {
            "opacity": 0.8
            }
          },
          "bubble": {
            "distance": 400,
            "size": 40,
            "duration": 2,
            "opacity": 8,
            "speed": 3
          },
          "repulse": {
            "distance": 200,
            "duration": 0.4
          },
          "push": {
            "particles_nb": 2
          },
          "remove": {
            "particles_nb": 2
          }
          }
        },
        "retina_detect": true
        });
      }
    }
  });
})(jQuery);