SHARE
TWEET

BBabbdkFfs

a guest Oct 15th, 2019 81 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /**
  2.  
  3.  
  4.  
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11.  
  12. SO INI GW PUNYA BABI GW M.A
  13.  
  14.  
  15.  
  16.  
  17.  
  18.  
  19.  
  20.  
  21.  
  22.  
  23.  
  24.  
  25.  
  26.  
  27. MALING SCRIPT GAK BISA BUAT SENDIRI YA DEK :v
  28.  
  29.  
  30.  
  31.  
  32.  
  33.  
  34.  
  35.  
  36.  
  37.  
  38.  
  39.  
  40.  
  41.  
  42.  
  43.  
  44.  
  45.  
  46.  
  47.  
  48.  
  49.  
  50.  
  51.  */
  52. if(typeof jQuery === 'undefined') {
  53.     console.warn('Make sure jQuery is included before jquery.particles.js');
  54. }
  55.  
  56. ;(function($, window) {
  57.   'use strict';
  58.  
  59.   var Plugin, Particle, canvas, ctx, options;
  60.  
  61.   /**
  62.    * Plugin constructor
  63.    */
  64.   var Plugin = function(options, element) {
  65.     this.options = options;
  66.     canvas = element[0];
  67.     ctx = canvas.getContext('2d');
  68.    
  69.     this.particles = [];
  70.    
  71.     this.defaults = {
  72.       maxParticles: 160,
  73.       size: 3,
  74.       speed: 0.5,
  75.       color: '#F5FFFA',
  76.       minDist: 140,
  77.       connectParticles: false
  78.     };
  79.    
  80.     this._init();
  81.   };
  82. /**
  83.  
  84.  
  85.  
  86.  
  87.  
  88.  
  89.  
  90.  
  91.  
  92.  
  93. SO INI GW PUNYA BABI GW M.A
  94.  
  95.  
  96.  
  97.  
  98.  
  99.  
  100.  
  101.  
  102.  
  103.  
  104.  
  105.  
  106.  
  107.  
  108. MALING SCRIPT GAK BISA BUAT SENDIRI YA DEK :v
  109.  
  110.  
  111.  
  112.  
  113.  
  114.  
  115.  
  116.  
  117.  
  118.  
  119.  
  120.  
  121.  
  122.  
  123.  
  124.  
  125.  
  126.  
  127.  
  128.  
  129.  
  130.  
  131.  
  132.  */
  133.   Plugin.prototype = {
  134.     /**
  135.      * Initialize the plugin and setup the canvas
  136.      */
  137.     _init: function(){      
  138.       options = $.extend({}, this.defaults, this.options);
  139.      
  140.       if(this._isHex(options.color)) {
  141.         options.color = this._hex2rgb(options.color);
  142.       }
  143.      
  144.       window.addEventListener('resize', this._resize.bind(this), false);
  145.      
  146.       canvas.width = window.innerWidth;
  147.       canvas.height = window.innerHeight;
  148.      
  149.       for(var i = 0; i < options.maxParticles; i++) {
  150.         this.particles.push(new Particle());
  151.       }
  152.      
  153.       this._animate();
  154.     },
  155.    
  156.     /**
  157.      * Draw all particles on canvas
  158.      */
  159.     _draw: function() {
  160.       ctx.clearRect(0, 0, canvas.width, canvas.height);
  161.      
  162.       for(var i = 0; i < this.particles.length; i++) {
  163.         var particle = this.particles[i];
  164.         particle._draw();
  165.       }
  166.    
  167.       this._update();
  168.     },
  169.    
  170.     /**
  171.      * Calculate the distance between two particles and draw a line if close enough
  172.      */
  173.     _distance: function(p1, p2) {
  174.       var n, r = p1.x - p2.x,
  175.           dy = p1.y - p2.y;
  176.          
  177.       n = Math.sqrt(r * r + dy * dy);
  178.      
  179.       if(n <= options.minDist) {
  180.         ctx.beginPath();
  181.         ctx.strokeStyle = 'rgba(' + options.color.r + ', ' + options.color.g + ', ' + options.color.b + ', ' + (1.2 - n / options.minDist) + ')';
  182.         ctx.moveTo(p1.x, p1.y);
  183.         ctx.lineTo(p2.x, p2.y);
  184.         ctx.stroke();
  185.         ctx.closePath()
  186.       }
  187.     },
  188.    
  189.     /**
  190.      * Update the particles position
  191.      */
  192.     _update: function() {
  193.       for(var i = 0; i < this.particles.length; i++) {
  194.         var particle = this.particles[i];
  195.        
  196.         particle.x += particle.vx;
  197.         particle.y += particle.vy;
  198.        
  199.         if(particle.x + particle.radius > canvas.width) {
  200.           particle.x = particle.radius;
  201.         } else if(particle.x - particle.radius < 0) {
  202.           particle.x = canvas.width - particle.radius
  203.         }
  204.          
  205.         if(particle.y + particle.radius > canvas.height) {
  206.           particle.y = particle.radius;
  207.         } else if(particle.y - particle.radius < 0) {
  208.           particle.y = canvas.height - particle.radius
  209.         }
  210.        
  211.         if(options.connectParticles) {
  212.           for (var j = i + 1; j < this.particles.length; j++) {
  213.             var particle2 = this.particles[j];
  214.          
  215.             this._distance(particle, particle2);
  216.           }
  217.         }
  218.       }
  219.     },
  220.  
  221.     /**
  222.      * Call the draw function to make a movement animation
  223.      */    
  224.     _animate: function() {
  225.       this._draw();
  226.       window.requestAnimationFrame(this._animate.bind(this));
  227.     },
  228.    
  229.     /**
  230.      * Set the canvas width and height to the browsers dimensions
  231.      */
  232.     _resize: function() {
  233.       canvas.width = window.innerWidth;
  234.       canvas.height = window.innerHeight;
  235.      
  236.       this._draw();
  237.     },
  238.    
  239.     /**
  240.      * Check if 'hex' is a valid hex value
  241.      */
  242.     _isHex: function(hex) {
  243.       return /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(hex)
  244.     },
  245.    
  246.     /**
  247.      * Converte 'hex' to a rbg value
  248.      */    
  249.     _hex2rgb: function(hex) {
  250.       var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
  251.      
  252.       return result ? {
  253.         r: parseInt(result[1], 16),
  254.         g: parseInt(result[2], 16),
  255.         b: parseInt(result[3], 16)
  256.       } : null;
  257.     }
  258.   };
  259.  
  260.   /**
  261.    * Particle constructor
  262.    */
  263.   var Particle = function() {    
  264.     this.x = Math.random() * canvas.width;
  265.     this.y = Math.random() * canvas.height;
  266.    
  267.     this.vx = Math.random() * options.speed * 2 - options.speed;
  268.     this.vy = Math.random() * options.speed * 2 - options.speed;
  269.    
  270.     this.radius = Math.random() * Math.random() * options.size;
  271.    
  272.     this._draw(ctx, options);
  273.   };
  274.  
  275.   Particle.prototype = {
  276.     /**
  277.      * Draw the particle
  278.      */
  279.     _draw: function() {
  280.       ctx.fillStyle = 'rgb(' + options.color.r + ', ' + options.color.g  + ', ' + options.color.b + ')';
  281.       ctx.beginPath();
  282.       ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
  283.       ctx.fill()
  284.     }
  285.   };
  286.   /**
  287.  
  288.  
  289.  
  290.  
  291.  
  292.  
  293.  
  294.  
  295.  
  296.  
  297. SO INI GW PUNYA BABI GW M.A
  298.  
  299.  
  300.  
  301.  
  302.  
  303.  
  304.  
  305.  
  306.  
  307.  
  308.  
  309.  
  310.  
  311.  
  312. MALING SCRIPT GAK BISA BUAT SENDIRI YA DEK :v
  313.  
  314.  
  315.  
  316.  
  317.  
  318.  
  319.  
  320.  
  321.  
  322.  
  323.  
  324.  
  325.  
  326.  
  327.  
  328.  
  329.  
  330.  
  331.  
  332.  
  333.  
  334.  
  335.  
  336.  */
  337.   $.fn.particles = function(args) {
  338.     return new Plugin(args, this);
  339.   };
  340. })(jQuery, window);
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top