gravity-angular - npm Package Compare versions

Comparing version 1.0.26 to 1.1.2

dist/gravity-angular.js

+/*
+ * gravity-angular
+ * @Description Gravity 2D model with Velocity & Angular
+ * @version v1.1.2 - 2015-12-29
+ * @link 
+ * @author Enrique Daimiel Ruiz <[e-mail]>
+ * @license MIT License, http://www.opensource.org/licenses/MIT
+ */
+angular.module('Gravity.Constants', []);
+angular.module('Gravity.Factories', ['Gravity.Constants']);
+angular.module('Gravity.Services', ['Gravity.Factories']);
+angular.module('Gravity.Directives', ['Gravity.Services']);
+angular.module('Gravity.Controllers', ['Gravity.Services']);
+
+angular.module('gravity', [
+    'Gravity.Controllers',
+    'Gravity.Directives'
+  ]).run([
+    '$log',
+    function ($log) {
+      $log.debug('Gravity run');
+    }
+  ]);
+
+
+(function () {
+  angular.module('Gravity.Controllers')
+    .controller('GravityController', GravityController);
+
+  GravityController.$inject = ['gravityService', '$log'];
+
+  function GravityController(gravityService, $log){
+
+    var vm = this;
+    vm.nextSkin = gravityService.nextSkin;
+    vm.previousSkin = gravityService.previousSkin;
+    $log.info('GravityController invoked');
+  }
+})();
+
+
+(function (){
+  angular.module('Gravity.Directives')
+    .directive('gravity', gravityDirective);
+
+  gravityDirective.$inject = ['$log', 'gravityService'];
+
+  function gravityDirective($log, gravityService) {
+    return {
+      link: link,
+      restrict: 'E',
+      template: '<div class="gravity"><canvas ></canvas></div>'
+    };
+
+    function link (scope, element, attrs) {
+      var canvas = element[0].firstChild.firstChild;
+      gravityService.init(canvas);
+
+      element.bind('mousedown', function(e){
+        gravityService.onMouseDown(e);
+      });
+
+      element.bind('mousemove', function(e){
+        gravityService.onMouseMove(e);
+      });
+
+      element.bind('mouseup', function(e){
+        gravityService.onMouseUp(e);
+      });
+
+      angular.element(window).bind('resize', function(){
+        gravityService.onWindowResize();
+      });
+
+      $log.info('Gravity directive loaded');
+    }
+  }
+})();
+
+
+(function() {
+  'use strict';
+
+  angular.module('Gravity.Services')
+    .service('gravityService', gravityService);
+
+  gravityService.$inject = ['$log', 'MAGNETS_AT_START', 'PARTICLES_PER_MAGNET', 'MAGNETIC_FORCE_THRESHOLD', 'SCREEN'];
+
+  function gravityService($log, MAGNETS_AT_START, PARTICLES_PER_MAGNET, MAGNETIC_FORCE_THRESHOLD, SCREEN) {
+
+    var canvas;
+    var context;
+    var particles = [];
+    var magnets = [];
+
+    var mouseX;
+    var mouseY;
+    var mouseIsDown = false;
+    var mouseDownTime = 0;
+
+    var skinIndex = 0;
+    var skins = [
+      { glowA: 'rgba(0,200,250,0.3)', glowB: 'rgba(0,200,250,0.0)', particleFill: '#ffffff', fadeFill: 'rgba(22,22,22,.6)', useFade: true },
+      { glowA: 'rgba(230,0,0,0.3)', glowB: 'rgba(230,0,0,0.0)', particleFill: '#ffffff', fadeFill: 'rgba(22,22,22,.6)', useFade: true },
+      { glowA: 'rgba(0,230,0,0.3)', glowB: 'rgba(0,230,0,0.0)', particleFill: 'rgba(0,230,0,0.7)', fadeFill: 'rgba(22,22,22,.6)', useFade: true },
+      { glowA: 'rgba(0,0,0,0.3)', glowB: 'rgba(0,0,0,0.0)', particleFill: '#333333', fadeFill: 'rgba(255,255,255,.6)', useFade: true },
+      { glowA: 'rgba(0,0,0,0.0)', glowB: 'rgba(0,0,0,0.0)', particleFill: '#333333', fadeFill: 'rgba(255,255,255,.2)', useFade: true },
+      { glowA: 'rgba(230,230,230,0)', glowB: 'rgba(230,230,230,0.0)', particleFill: '#ffffff', fadeFill: '', useFade: false }
+    ];
+
+    var service = {
+      init : init,
+      nextSkin: nextSkin,
+      onMouseDown: mouseDownHandler,
+      onMouseMove: mouseMoveHandler,
+      onMouseUp: mouseUpHandler,
+      onWindowResize : windowResizeHandler,
+      previousSkin: previousSkin,
+      log: $log.log
+    };
+
+    return service;
+
+    function createMagnets() {
+      for (var i = 0; i < MAGNETS_AT_START; i++) {
+        var position = {
+          x: (Math.random() * canvas.clientWidth),
+          y: (Math.random() * canvas.clientHeight)
+        };
+
+        createMagnet( position );
+      }
+    }
+
+    function createMagnet( position ) {
+      var m = new Magnet();
+      m.position.x = position.x;
+      m.position.y = position.y;
+
+      magnets.push( m );
+
+      createParticles( m.position );
+      $log.info('Magnet created');
+    }
+
+    function createParticles( position ) {
+      for (var i = 0; i < PARTICLES_PER_MAGNET; i++) {
+        var p = new Particle();
+        p.position.x = position.x;
+        p.position.y = position.y;
+        p.shift.x = position.x;
+        p.shift.y = position.y;
+        p.color = skins[skinIndex].particleFill;
+
+        particles.push( p );
+      }
+    }
+
+    function distanceBetween(p1,p2) {
+      var dx = p2.x-p1.x;
+      var dy = p2.y-p1.y;
+      return Math.sqrt(dx*dx + dy*dy);
+    }
+
+    function init(element) {
+
+      particles = [];
+      magnets = [];
+      clearInterval();
+
+      canvas = element;
+
+      if (canvas && canvas.getContext) {
+        context = canvas.getContext('2d');
+
+        windowResizeHandler();
+
+        createMagnets();
+
+        setInterval( loop, 1000 / 60 );
+
+        $log.info('Gravity model initialized');
+      }
+    }
+
+    function loop() {
+
+      if( skins[skinIndex].useFade) {
+        context.fillStyle = skins[skinIndex].fadeFill;
+        context.fillRect(0, 0, context.canvas.width, context.canvas.height);
+      }
+      else {
+        context.clearRect(0,0,canvas.width,canvas.height);
+      }
+
+      var particle, magnet;
+      var i, j, ilen, jlen;
+
+      // Render the magnets
+      for( j = 0, jlen = magnets.length; j < jlen; j++ ) {
+        magnet = magnets[j];
+
+        if( magnet.dragging ) {
+          magnet.position.x += ( mouseX - magnet.position.x ) * 0.2;
+          magnet.position.y += ( mouseY - magnet.position.y ) * 0.2;
+        }
+
+        // Increase the size of the magnet center point depending on # of connections
+        magnet.size += ( (magnet.connections/3) - magnet.size ) * 0.025;
+        magnet.size = Math.max(magnet.size,2);
+
+        var gradientFill = context.createRadialGradient(magnet.position.x,magnet.position.y,0,magnet.position.x,magnet.position.y,magnet.size*10);
+        gradientFill.addColorStop(0,skins[skinIndex].glowA);
+        gradientFill.addColorStop(1,skins[skinIndex].glowB);
+
+        context.beginPath();
+        context.fillStyle = gradientFill;
+        context.arc(magnet.position.x, magnet.position.y, magnet.size*10, 0, Math.PI*2, true);
+        context.fill();
+
+        context.beginPath();
+        context.fillStyle = '#00000000';
+        context.arc(magnet.position.x, magnet.position.y, magnet.size, 0, Math.PI*2, true);
+        context.fill();
+
+        magnet.connections = 0;
+      }
+
+      // Render the particles
+      for (i = 0, ilen = particles.length; i < ilen; i++) {
+        particle = particles[i];
+
+        var currentDistance = -1;
+        var closestDistance = -1;
+        var closestMagnet = null;
+
+        var force = { x: 0, y: 0 };
+
+        // For each particle, we check what the closes magnet is
+        for( j = 0, jlen = magnets.length; j < jlen; j++ ) {
+          magnet = magnets[j];
+
+          currentDistance = distanceBetween( particle.position, magnet.position ) - ( magnet.orbit * 0.5 );
+
+          if( particle.magnet !== magnet ) {
+            var fx = magnet.position.x - particle.position.x;
+            if( fx > -MAGNETIC_FORCE_THRESHOLD && fx < MAGNETIC_FORCE_THRESHOLD ) {
+              force.x += fx / MAGNETIC_FORCE_THRESHOLD;
+            }
+
+            var fy = magnet.position.y - particle.position.y;
+            if( fy > -MAGNETIC_FORCE_THRESHOLD && fy < MAGNETIC_FORCE_THRESHOLD ) {
+              force.y += fy / MAGNETIC_FORCE_THRESHOLD;
+            }
+
+          }
+
+          if( closestMagnet === null || currentDistance < closestDistance ) {
+            closestDistance = currentDistance;
+            closestMagnet = magnet;
+          }
+        }
+
+        if( particle.magnet === null || particle.magnet !== closestMagnet ) {
+          particle.magnet = closestMagnet;
+        }
+
+        closestMagnet.connections += 1;
+
+        // Rotation
+        particle.angle += particle.speed;
+
+        // Translate towards the magnet position
+        particle.shift.x += ( (closestMagnet.position.x+(force.x*8)) - particle.shift.x) * particle.speed;
+        particle.shift.y += ( (closestMagnet.position.y+(force.y*8)) - particle.shift.y) * particle.speed;
+
+        // Appy the combined position including shift, angle and orbit
+        particle.position.x = particle.shift.x + Math.cos(i+particle.angle) * (particle.orbit*particle.force);
+        particle.position.y = particle.shift.y + Math.sin(i+particle.angle) * (particle.orbit*particle.force);
+
+        // Limit to screen bounds
+        particle.position.x = Math.max( Math.min( particle.position.x, canvas.clientWidth-particle.size/2 ), particle.size/2 );
+        particle.position.y = Math.max( Math.min( particle.position.y, canvas.clientHeight-particle.size/2 ), particle.size/2 );
+
+        // Slowly inherit the cloest magnets orbit
+        particle.orbit += ( closestMagnet.orbit - particle.orbit ) * 0.1;
+
+        context.beginPath();
+        context.fillStyle = particle.color;
+        context.arc(particle.position.x, particle.position.y, particle.size/2, 0, Math.PI*2, true);
+        context.fill();
+      }
+    }
+
+    function mouseDownHandler(event) {
+      event.preventDefault();
+
+      mouseIsDown = true;
+
+      if( new Date().getTime() - mouseDownTime < 300 ) {
+        // The mouse was pressed down twice with a < 300 ms interval: add a magnet
+        createMagnet( { x: mouseX, y: mouseY } );
+
+        mouseDownTime = 0;
+      }
+
+      mouseDownTime = new Date().getTime();
+
+      for( var i = 0, len = magnets.length; i < len; i++ ) {
+        var magnet = magnets[i];
+
+        if( distanceBetween( magnet.position, { x: mouseX, y: mouseY } ) < magnet.orbit * 0.5) {
+          magnet.dragging = true;
+          break;
+        }
+      }
+    }
+
+    function mouseMoveHandler(event) {
+      mouseX = event.clientX - canvas.offsetLeft + window.pageXOffset;
+      mouseY = event.clientY - canvas.offsetTop + window.pageYOffset ;
+    }
+
+    function mouseUpHandler(event) {
+      mouseIsDown = false;
+
+      for( var i = 0, len = magnets.length; i < len; i++ ) {
+        var magnet = magnets[i];
+        magnet.dragging = false;
+      }
+    }
+
+    function nextSkin() {
+      event.preventDefault();
+      ++skinIndex;
+      updateSkin();
+    }
+
+    function previousSkin() {
+      event.preventDefault();
+      --skinIndex;
+      updateSkin();
+    }
+
+    function updateSkin() {
+      skinIndex = skinIndex < 0 ? skins.length-1 : skinIndex;
+      skinIndex = skinIndex > skins.length-1 ? 0 : skinIndex;
+
+      for (var i = 0, len = particles.length; i < len; i++) {
+        particles[i].color = skins[skinIndex].particleFill;
+      }
+
+      $log.info('Skin updated');
+    }
+
+    function windowResizeHandler() {
+      canvas.width = document.getElementById('gravity') ? document.getElementById('gravity').clientWidth : SCREEN.WIDTH;
+      canvas.height = document.getElementById('gravity') ? document.getElementById('gravity').clientHeight : SCREEN.HEIGHT;
+
+      mouseX = canvas.clientWidth - canvas.offsetLeft;
+      mouseY = canvas.clientHeight - canvas.offsetTop;
+
+      $log.info('Windows resized invoked');
+    }
+  }
+
+})();
+
+
+(function (){
+  'use strict';
+
+  angular.module('Gravity.Constants')
+    .constant('MAGNETS_AT_START', 4) // Number of magnets after initiation
+    .constant('MAGNETIC_FORCE_THRESHOLD', 300) // Attraction force threshold of magnet 
+    .constant('PARTICLES_PER_MAGNET', 20) // Number of particles per magnet
+
+    .constant('SCREEN', { // Screen size only used when a gravity id is not defined
+      HEIGHT: 400,
+      WIDTH: 400,
+    });
+
+})();
+angular.module('Gravity.Factories')
+  .factory('Particle', Particle);
+
+function Particle(){
+  this.size = 0.5+Math.random()*3.5;
+  this.position = { x: 0, y: 0 };
+  this.shift = { x: 0, y: 0 };
+  this.angle = 0;
+  this.speed = 0.01 + (this.size/4) * 0.0015;
+  this.force = 1 - (Math.random()*0.15);
+  this.color = '#ffffff';
+  this.orbit = 1;
+  this.magnet = null;
+}
+
+function Magnet(){
+  this.orbit = 100;
+  this.position = { x: 0, y: 0 };
+  this.dragging = false;
+  this.connections = 0;
+  this.size = 1;
+}
+
+angular.module('Gravity.Factories')
+  .factory('Magnet', Magnet);

dist/gravity-angular.min.js

+/*
+ * gravity-angular
+ * @Description Gravity 2D model with Velocity & Angular
+ * @version v1.1.2 - 2015-12-29
+ * @link 
+ * @author Enrique Daimiel Ruiz <[e-mail]>
+ * @license MIT License, http://www.opensource.org/licenses/MIT
+ */
+function Particle(){this.size=.5+3.5*Math.random(),this.position={x:0,y:0},this.shift={x:0,y:0},this.angle=0,this.speed=.01+this.size/4*.0015,this.force=1-.15*Math.random(),this.color="#ffffff",this.orbit=1,this.magnet=null}function Magnet(){this.orbit=100,this.position={x:0,y:0},this.dragging=!1,this.connections=0,this.size=1}angular.module("Gravity.Constants",[]),angular.module("Gravity.Factories",["Gravity.Constants"]),angular.module("Gravity.Services",["Gravity.Factories"]),angular.module("Gravity.Directives",["Gravity.Services"]),angular.module("Gravity.Controllers",["Gravity.Services"]),angular.module("gravity",["Gravity.Controllers","Gravity.Directives"]).run(["$log",function(a){a.debug("Gravity run")}]),function(){function a(a,b){var c=this;c.nextSkin=a.nextSkin,c.previousSkin=a.previousSkin,b.info("GravityController invoked")}angular.module("Gravity.Controllers").controller("GravityController",a),a.$inject=["gravityService","$log"]}(),function(){function a(a,b){function c(c,d,e){var f=d[0].firstChild.firstChild;b.init(f),d.bind("mousedown",function(a){b.onMouseDown(a)}),d.bind("mousemove",function(a){b.onMouseMove(a)}),d.bind("mouseup",function(a){b.onMouseUp(a)}),angular.element(window).bind("resize",function(){b.onWindowResize()}),a.info("Gravity directive loaded")}return{link:c,restrict:"E",template:'<div class="gravity"><canvas ></canvas></div>'}}angular.module("Gravity.Directives").directive("gravity",a),a.$inject=["$log","gravityService"]}(),function(){"use strict";function a(a,b,c,d,e){function f(){for(var a=0;b>a;a++){var c={x:Math.random()*s.clientWidth,y:Math.random()*s.clientHeight};g(c)}}function g(b){var c=new Magnet;c.position.x=b.x,c.position.y=b.y,x.push(c),h(c.position),a.info("Magnet created")}function h(a){for(var b=0;c>b;b++){var d=new Particle;d.position.x=a.x,d.position.y=a.y,d.shift.x=a.x,d.shift.y=a.y,d.color=B[A].particleFill,w.push(d)}}function i(a,b){var c=b.x-a.x,d=b.y-a.y;return Math.sqrt(c*c+d*d)}function j(b){w=[],x=[],clearInterval(),s=b,s&&s.getContext&&(t=s.getContext("2d"),r(),f(),setInterval(k,1e3/60),a.info("Gravity model initialized"))}function k(){B[A].useFade?(t.fillStyle=B[A].fadeFill,t.fillRect(0,0,t.canvas.width,t.canvas.height)):t.clearRect(0,0,s.width,s.height);var a,b,c,e,f,g;for(e=0,g=x.length;g>e;e++){b=x[e],b.dragging&&(b.position.x+=.2*(u-b.position.x),b.position.y+=.2*(v-b.position.y)),b.size+=.025*(b.connections/3-b.size),b.size=Math.max(b.size,2);var h=t.createRadialGradient(b.position.x,b.position.y,0,b.position.x,b.position.y,10*b.size);h.addColorStop(0,B[A].glowA),h.addColorStop(1,B[A].glowB),t.beginPath(),t.fillStyle=h,t.arc(b.position.x,b.position.y,10*b.size,0,2*Math.PI,!0),t.fill(),t.beginPath(),t.fillStyle="#00000000",t.arc(b.position.x,b.position.y,b.size,0,2*Math.PI,!0),t.fill(),b.connections=0}for(c=0,f=w.length;f>c;c++){a=w[c];var j=-1,k=-1,l=null,m={x:0,y:0};for(e=0,g=x.length;g>e;e++){if(b=x[e],j=i(a.position,b.position)-.5*b.orbit,a.magnet!==b){var n=b.position.x-a.position.x;n>-d&&d>n&&(m.x+=n/d);var o=b.position.y-a.position.y;o>-d&&d>o&&(m.y+=o/d)}(null===l||k>j)&&(k=j,l=b)}(null===a.magnet||a.magnet!==l)&&(a.magnet=l),l.connections+=1,a.angle+=a.speed,a.shift.x+=(l.position.x+8*m.x-a.shift.x)*a.speed,a.shift.y+=(l.position.y+8*m.y-a.shift.y)*a.speed,a.position.x=a.shift.x+Math.cos(c+a.angle)*(a.orbit*a.force),a.position.y=a.shift.y+Math.sin(c+a.angle)*(a.orbit*a.force),a.position.x=Math.max(Math.min(a.position.x,s.clientWidth-a.size/2),a.size/2),a.position.y=Math.max(Math.min(a.position.y,s.clientHeight-a.size/2),a.size/2),a.orbit+=.1*(l.orbit-a.orbit),t.beginPath(),t.fillStyle=a.color,t.arc(a.position.x,a.position.y,a.size/2,0,2*Math.PI,!0),t.fill()}}function l(a){a.preventDefault(),y=!0,(new Date).getTime()-z<300&&(g({x:u,y:v}),z=0),z=(new Date).getTime();for(var b=0,c=x.length;c>b;b++){var d=x[b];if(i(d.position,{x:u,y:v})<.5*d.orbit){d.dragging=!0;break}}}function m(a){u=a.clientX-s.offsetLeft+window.pageXOffset,v=a.clientY-s.offsetTop+window.pageYOffset}function n(a){y=!1;for(var b=0,c=x.length;c>b;b++){var d=x[b];d.dragging=!1}}function o(){event.preventDefault(),++A,q()}function p(){event.preventDefault(),--A,q()}function q(){A=0>A?B.length-1:A,A=A>B.length-1?0:A;for(var b=0,c=w.length;c>b;b++)w[b].color=B[A].particleFill;a.info("Skin updated")}function r(){s.width=document.getElementById("gravity")?document.getElementById("gravity").clientWidth:e.WIDTH,s.height=document.getElementById("gravity")?document.getElementById("gravity").clientHeight:e.HEIGHT,u=s.clientWidth-s.offsetLeft,v=s.clientHeight-s.offsetTop,a.info("Windows resized invoked")}var s,t,u,v,w=[],x=[],y=!1,z=0,A=0,B=[{glowA:"rgba(0,200,250,0.3)",glowB:"rgba(0,200,250,0.0)",particleFill:"#ffffff",fadeFill:"rgba(22,22,22,.6)",useFade:!0},{glowA:"rgba(230,0,0,0.3)",glowB:"rgba(230,0,0,0.0)",particleFill:"#ffffff",fadeFill:"rgba(22,22,22,.6)",useFade:!0},{glowA:"rgba(0,230,0,0.3)",glowB:"rgba(0,230,0,0.0)",particleFill:"rgba(0,230,0,0.7)",fadeFill:"rgba(22,22,22,.6)",useFade:!0},{glowA:"rgba(0,0,0,0.3)",glowB:"rgba(0,0,0,0.0)",particleFill:"#333333",fadeFill:"rgba(255,255,255,.6)",useFade:!0},{glowA:"rgba(0,0,0,0.0)",glowB:"rgba(0,0,0,0.0)",particleFill:"#333333",fadeFill:"rgba(255,255,255,.2)",useFade:!0},{glowA:"rgba(230,230,230,0)",glowB:"rgba(230,230,230,0.0)",particleFill:"#ffffff",fadeFill:"",useFade:!1}],C={init:j,nextSkin:o,onMouseDown:l,onMouseMove:m,onMouseUp:n,onWindowResize:r,previousSkin:p,log:a.log};return C}angular.module("Gravity.Services").service("gravityService",a),a.$inject=["$log","MAGNETS_AT_START","PARTICLES_PER_MAGNET","MAGNETIC_FORCE_THRESHOLD","SCREEN"]}(),function(){"use strict";angular.module("Gravity.Constants").constant("MAGNETS_AT_START",4).constant("MAGNETIC_FORCE_THRESHOLD",300).constant("PARTICLES_PER_MAGNET",20).constant("SCREEN",{HEIGHT:400,WIDTH:400})}(),angular.module("Gravity.Factories").factory("Particle",Particle),angular.module("Gravity.Factories").factory("Magnet",Magnet);

bower.json

 {
-  "name": "gravity",
-  "version": "1.0.26",
+  "name": "gravity-angular",
+  "version": "1.1.2",
   "description": "Gravity 2D model with Velocity & Angular",
@@ -5,0 +5,0 @@ "keywords": [

Gruntfile.js

@@ -136,3 +136,3 @@ module.exports = function(grunt) {
         // if the workspace is dirty, abort publishing (to avoid publishing local changes)
-        abortIfDirty: true
+        abortIfDirty: false
       }
@@ -143,2 +143,3 @@ }
   // Load grunt plugings
+  grunt.loadNpmTasks('grunt-npm');
   grunt.loadNpmTasks('grunt-git');
@@ -168,3 +169,2 @@ grunt.loadNpmTasks('grunt-contrib-uglify');
   grunt.registerTask('release', [
-    'test',
     'build',
@@ -174,3 +174,3 @@ 'gitadd',
     'npm-publish',
-    'bump-only',
+    'bump-only'
   ]);
@@ -177,0 +177,0 @@

package.json

 {
   "name": "gravity-angular",
-  "version": "1.0.26",
+  "version": "1.1.2",
   "description": "Gravity 2D model with Velocity & Angular",
-  "repository": "https://github.com/KenEDR/gravity-angular-velocity",
+  "repository": "https://github.com/kdaimiel/gravity-angular",
   "directories": {
@@ -27,4 +27,6 @@ "test": "test"
     "grunt-contrib-watch": "^0.6.1",
+    "grunt-git": "^0.3.7",
     "grunt-karma": "^0.11.1",
     "grunt-ng-annotate": "^1.0.1",
+    "grunt-npm": "0.0.2",
     "jasmine": "^2.3.1",
@@ -31,0 +33,0 @@ "jasmine-core": "^2.3.4",

dist/gravity.js

-/*
- * gravity
- * @Description Gravity 2D model with Velocity & Angular
- * @version v1.0.25 - 2015-08-31
- * @link 
- * @author Enrique Daimiel Ruiz <[e-mail]>
- * @license MIT License, http://www.opensource.org/licenses/MIT
- */
-angular.module('Gravity.Constants', []);
-angular.module('Gravity.Factories', ['Gravity.Constants']);
-angular.module('Gravity.Services', ['Gravity.Factories']);
-angular.module('Gravity.Directives', ['Gravity.Services']);
-angular.module('Gravity.Controllers', ['Gravity.Services']);
-
-angular.module('gravity', [
-    'Gravity.Controllers',
-    'Gravity.Directives'
-  ]).run([
-    '$log',
-    function ($log) {
-      $log.debug('Gravity run');
-    }
-  ]);
-
-
-(function () {
-  angular.module('Gravity.Controllers')
-    .controller('GravityController', GravityController);
-
-  GravityController.$inject = ['gravityService', '$log'];
-
-  function GravityController(gravityService, $log){
-
-    var vm = this;
-    vm.nextSkin = gravityService.nextSkin;
-    vm.previousSkin = gravityService.previousSkin;
-    $log.info('GravityController invoked');
-  }
-})();
-
-
-(function (){
-  angular.module('Gravity.Directives')
-    .directive('gravity', gravityDirective);
-
-  gravityDirective.$inject = ['$log', 'gravityService'];
-
-  function gravityDirective($log, gravityService) {
-    return {
-      link: link,
-      restrict: 'E',
-      template: '<div class="gravity"><canvas ></canvas></div>'
-    };
-
-    function link (scope, element, attrs) {
-      var canvas = element[0].firstChild.firstChild;
-      gravityService.init(canvas);
-
-      element.bind('mousedown', function(e){
-        gravityService.onMouseDown(e);
-      });
-
-      element.bind('mousemove', function(e){
-        gravityService.onMouseMove(e);
-      });
-
-      element.bind('mouseup', function(e){
-        gravityService.onMouseUp(e);
-      });
-
-      angular.element(window).bind('resize', function(){
-        gravityService.onWindowResize();
-      });
-
-      $log.info('Gravity directive loaded');
-    }
-  }
-})();
-
-
-(function() {
-  'use strict';
-
-  angular.module('Gravity.Services')
-    .service('gravityService', gravityService);
-
-  gravityService.$inject = ['$log', 'MAGNETS_AT_START', 'PARTICLES_PER_MAGNET', 'MAGNETIC_FORCE_THRESHOLD', 'SCREEN'];
-
-  function gravityService($log, MAGNETS_AT_START, PARTICLES_PER_MAGNET, MAGNETIC_FORCE_THRESHOLD, SCREEN) {
-
-    var canvas;
-    var context;
-    var particles = [];
-    var magnets = [];
-
-    var mouseX;
-    var mouseY;
-    var mouseIsDown = false;
-    var mouseDownTime = 0;
-
-    var skinIndex = 0;
-    var skins = [
-      { glowA: 'rgba(0,200,250,0.3)', glowB: 'rgba(0,200,250,0.0)', particleFill: '#ffffff', fadeFill: 'rgba(22,22,22,.6)', useFade: true },
-      { glowA: 'rgba(230,0,0,0.3)', glowB: 'rgba(230,0,0,0.0)', particleFill: '#ffffff', fadeFill: 'rgba(22,22,22,.6)', useFade: true },
-      { glowA: 'rgba(0,230,0,0.3)', glowB: 'rgba(0,230,0,0.0)', particleFill: 'rgba(0,230,0,0.7)', fadeFill: 'rgba(22,22,22,.6)', useFade: true },
-      { glowA: 'rgba(0,0,0,0.3)', glowB: 'rgba(0,0,0,0.0)', particleFill: '#333333', fadeFill: 'rgba(255,255,255,.6)', useFade: true },
-      { glowA: 'rgba(0,0,0,0.0)', glowB: 'rgba(0,0,0,0.0)', particleFill: '#333333', fadeFill: 'rgba(255,255,255,.2)', useFade: true },
-      { glowA: 'rgba(230,230,230,0)', glowB: 'rgba(230,230,230,0.0)', particleFill: '#ffffff', fadeFill: '', useFade: false }
-    ];
-
-    var service = {
-      init : init,
-      nextSkin: nextSkin,
-      onMouseDown: mouseDownHandler,
-      onMouseMove: mouseMoveHandler,
-      onMouseUp: mouseUpHandler,
-      onWindowResize : windowResizeHandler,
-      previousSkin: previousSkin,
-      log: $log.log
-    };
-
-    return service;
-
-    function createMagnets() {
-      for (var i = 0; i < MAGNETS_AT_START; i++) {
-        var position = {
-          x: (Math.random() * canvas.clientWidth),
-          y: (Math.random() * canvas.clientHeight)
-        };
-
-        createMagnet( position );
-      }
-    }
-
-    function createMagnet( position ) {
-      var m = new Magnet();
-      m.position.x = position.x;
-      m.position.y = position.y;
-
-      magnets.push( m );
-
-      createParticles( m.position );
-      $log.info('Magnet created');
-    }
-
-    function createParticles( position ) {
-      for (var i = 0; i < PARTICLES_PER_MAGNET; i++) {
-        var p = new Particle();
-        p.position.x = position.x;
-        p.position.y = position.y;
-        p.shift.x = position.x;
-        p.shift.y = position.y;
-        p.color = skins[skinIndex].particleFill;
-
-        particles.push( p );
-      }
-    }
-
-    function distanceBetween(p1,p2) {
-      var dx = p2.x-p1.x;
-      var dy = p2.y-p1.y;
-      return Math.sqrt(dx*dx + dy*dy);
-    }
-
-    function init(element) {
-
-      particles = [];
-      magnets = [];
-      clearInterval();
-
-      canvas = element;
-
-      if (canvas && canvas.getContext) {
-        context = canvas.getContext('2d');
-
-        windowResizeHandler();
-
-        createMagnets();
-
-        setInterval( loop, 1000 / 60 );
-
-        $log.info('Gravity model initialized');
-      }
-    }
-
-    function loop() {
-
-      if( skins[skinIndex].useFade) {
-        context.fillStyle = skins[skinIndex].fadeFill;
-        context.fillRect(0, 0, context.canvas.width, context.canvas.height);
-      }
-      else {
-        context.clearRect(0,0,canvas.width,canvas.height);
-      }
-
-      var particle, magnet;
-      var i, j, ilen, jlen;
-
-      // Render the magnets
-      for( j = 0, jlen = magnets.length; j < jlen; j++ ) {
-        magnet = magnets[j];
-
-        if( magnet.dragging ) {
-          magnet.position.x += ( mouseX - magnet.position.x ) * 0.2;
-          magnet.position.y += ( mouseY - magnet.position.y ) * 0.2;
-        }
-
-        // Increase the size of the magnet center point depending on # of connections
-        magnet.size += ( (magnet.connections/3) - magnet.size ) * 0.025;
-        magnet.size = Math.max(magnet.size,2);
-
-        var gradientFill = context.createRadialGradient(magnet.position.x,magnet.position.y,0,magnet.position.x,magnet.position.y,magnet.size*10);
-        gradientFill.addColorStop(0,skins[skinIndex].glowA);
-        gradientFill.addColorStop(1,skins[skinIndex].glowB);
-
-        context.beginPath();
-        context.fillStyle = gradientFill;
-        context.arc(magnet.position.x, magnet.position.y, magnet.size*10, 0, Math.PI*2, true);
-        context.fill();
-
-        context.beginPath();
-        context.fillStyle = '#00000000';
-        context.arc(magnet.position.x, magnet.position.y, magnet.size, 0, Math.PI*2, true);
-        context.fill();
-
-        magnet.connections = 0;
-      }
-
-      // Render the particles
-      for (i = 0, ilen = particles.length; i < ilen; i++) {
-        particle = particles[i];
-
-        var currentDistance = -1;
-        var closestDistance = -1;
-        var closestMagnet = null;
-
-        var force = { x: 0, y: 0 };
-
-        // For each particle, we check what the closes magnet is
-        for( j = 0, jlen = magnets.length; j < jlen; j++ ) {
-          magnet = magnets[j];
-
-          currentDistance = distanceBetween( particle.position, magnet.position ) - ( magnet.orbit * 0.5 );
-
-          if( particle.magnet !== magnet ) {
-            var fx = magnet.position.x - particle.position.x;
-            if( fx > -MAGNETIC_FORCE_THRESHOLD && fx < MAGNETIC_FORCE_THRESHOLD ) {
-              force.x += fx / MAGNETIC_FORCE_THRESHOLD;
-            }
-
-            var fy = magnet.position.y - particle.position.y;
-            if( fy > -MAGNETIC_FORCE_THRESHOLD && fy < MAGNETIC_FORCE_THRESHOLD ) {
-              force.y += fy / MAGNETIC_FORCE_THRESHOLD;
-            }
-
-          }
-
-          if( closestMagnet === null || currentDistance < closestDistance ) {
-            closestDistance = currentDistance;
-            closestMagnet = magnet;
-          }
-        }
-
-        if( particle.magnet === null || particle.magnet !== closestMagnet ) {
-          particle.magnet = closestMagnet;
-        }
-
-        closestMagnet.connections += 1;
-
-        // Rotation
-        particle.angle += particle.speed;
-
-        // Translate towards the magnet position
-        particle.shift.x += ( (closestMagnet.position.x+(force.x*8)) - particle.shift.x) * particle.speed;
-        particle.shift.y += ( (closestMagnet.position.y+(force.y*8)) - particle.shift.y) * particle.speed;
-
-        // Appy the combined position including shift, angle and orbit
-        particle.position.x = particle.shift.x + Math.cos(i+particle.angle) * (particle.orbit*particle.force);
-        particle.position.y = particle.shift.y + Math.sin(i+particle.angle) * (particle.orbit*particle.force);
-
-        // Limit to screen bounds
-        particle.position.x = Math.max( Math.min( particle.position.x, canvas.clientWidth-particle.size/2 ), particle.size/2 );
-        particle.position.y = Math.max( Math.min( particle.position.y, canvas.clientHeight-particle.size/2 ), particle.size/2 );
-
-        // Slowly inherit the cloest magnets orbit
-        particle.orbit += ( closestMagnet.orbit - particle.orbit ) * 0.1;
-
-        context.beginPath();
-        context.fillStyle = particle.color;
-        context.arc(particle.position.x, particle.position.y, particle.size/2, 0, Math.PI*2, true);
-        context.fill();
-      }
-    }
-
-    function mouseDownHandler(event) {
-      event.preventDefault();
-
-      mouseIsDown = true;
-
-      if( new Date().getTime() - mouseDownTime < 300 ) {
-        // The mouse was pressed down twice with a < 300 ms interval: add a magnet
-        createMagnet( { x: mouseX, y: mouseY } );
-
-        mouseDownTime = 0;
-      }
-
-      mouseDownTime = new Date().getTime();
-
-      for( var i = 0, len = magnets.length; i < len; i++ ) {
-        var magnet = magnets[i];
-
-        if( distanceBetween( magnet.position, { x: mouseX, y: mouseY } ) < magnet.orbit * 0.5) {
-          magnet.dragging = true;
-          break;
-        }
-      }
-    }
-
-    function mouseMoveHandler(event) {
-      mouseX = event.clientX - canvas.offsetLeft + window.pageXOffset;
-      mouseY = event.clientY - canvas.offsetTop + window.pageYOffset ;
-    }
-
-    function mouseUpHandler(event) {
-      mouseIsDown = false;
-
-      for( var i = 0, len = magnets.length; i < len; i++ ) {
-        var magnet = magnets[i];
-        magnet.dragging = false;
-      }
-    }
-
-    function nextSkin() {
-      event.preventDefault();
-      ++skinIndex;
-      updateSkin();
-    }
-
-    function previousSkin() {
-      event.preventDefault();
-      --skinIndex;
-      updateSkin();
-    }
-
-    function updateSkin() {
-      skinIndex = skinIndex < 0 ? skins.length-1 : skinIndex;
-      skinIndex = skinIndex > skins.length-1 ? 0 : skinIndex;
-
-      for (var i = 0, len = particles.length; i < len; i++) {
-        particles[i].color = skins[skinIndex].particleFill;
-      }
-
-      $log.info('Skin updated');
-    }
-
-    function windowResizeHandler() {
-      canvas.width = document.getElementById('gravity') ? document.getElementById('gravity').clientWidth : SCREEN.WIDTH;
-      canvas.height = document.getElementById('gravity') ? document.getElementById('gravity').clientHeight : SCREEN.HEIGHT;
-
-      mouseX = canvas.clientWidth - canvas.offsetLeft;
-      mouseY = canvas.clientHeight - canvas.offsetTop;
-
-      $log.info('Windows resized invoked');
-    }
-  }
-
-})();
-
-
-(function (){
-  'use strict';
-
-  angular.module('Gravity.Constants')
-    .constant('MAGNETS_AT_START', 4) // Number of magnets after initiation
-    .constant('MAGNETIC_FORCE_THRESHOLD', 300) // Attraction force threshold of magnet 
-    .constant('PARTICLES_PER_MAGNET', 20) // Number of particles per magnet
-
-    .constant('SCREEN', { // Screen size only used when a gravity id is not defined
-      HEIGHT: 400,
-      WIDTH: 400,
-    });
-
-})();
-angular.module('Gravity.Factories')
-  .factory('Particle', Particle);
-
-function Particle(){
-  this.size = 0.5+Math.random()*3.5;
-  this.position = { x: 0, y: 0 };
-  this.shift = { x: 0, y: 0 };
-  this.angle = 0;
-  this.speed = 0.01 + (this.size/4) * 0.0015;
-  this.force = 1 - (Math.random()*0.15);
-  this.color = '#ffffff';
-  this.orbit = 1;
-  this.magnet = null;
-}
-
-function Magnet(){
-  this.orbit = 100;
-  this.position = { x: 0, y: 0 };
-  this.dragging = false;
-  this.connections = 0;
-  this.size = 1;
-}
-
-angular.module('Gravity.Factories')
-  .factory('Magnet', Magnet);

dist/gravity.min.js

-/*
- * gravity
- * @Description Gravity 2D model with Velocity & Angular
- * @version v1.0.25 - 2015-08-31
- * @link 
- * @author Enrique Daimiel Ruiz <[e-mail]>
- * @license MIT License, http://www.opensource.org/licenses/MIT
- */
-function Particle(){this.size=.5+3.5*Math.random(),this.position={x:0,y:0},this.shift={x:0,y:0},this.angle=0,this.speed=.01+this.size/4*.0015,this.force=1-.15*Math.random(),this.color="#ffffff",this.orbit=1,this.magnet=null}function Magnet(){this.orbit=100,this.position={x:0,y:0},this.dragging=!1,this.connections=0,this.size=1}angular.module("Gravity.Constants",[]),angular.module("Gravity.Factories",["Gravity.Constants"]),angular.module("Gravity.Services",["Gravity.Factories"]),angular.module("Gravity.Directives",["Gravity.Services"]),angular.module("Gravity.Controllers",["Gravity.Services"]),angular.module("gravity",["Gravity.Controllers","Gravity.Directives"]).run(["$log",function(a){a.debug("Gravity run")}]),function(){function a(a,b){var c=this;c.nextSkin=a.nextSkin,c.previousSkin=a.previousSkin,b.info("GravityController invoked")}angular.module("Gravity.Controllers").controller("GravityController",a),a.$inject=["gravityService","$log"]}(),function(){function a(a,b){function c(c,d,e){var f=d[0].firstChild.firstChild;b.init(f),d.bind("mousedown",function(a){b.onMouseDown(a)}),d.bind("mousemove",function(a){b.onMouseMove(a)}),d.bind("mouseup",function(a){b.onMouseUp(a)}),angular.element(window).bind("resize",function(){b.onWindowResize()}),a.info("Gravity directive loaded")}return{link:c,restrict:"E",template:'<div class="gravity"><canvas ></canvas></div>'}}angular.module("Gravity.Directives").directive("gravity",a),a.$inject=["$log","gravityService"]}(),function(){"use strict";function a(a,b,c,d,e){function f(){for(var a=0;b>a;a++){var c={x:Math.random()*s.clientWidth,y:Math.random()*s.clientHeight};g(c)}}function g(b){var c=new Magnet;c.position.x=b.x,c.position.y=b.y,x.push(c),h(c.position),a.info("Magnet created")}function h(a){for(var b=0;c>b;b++){var d=new Particle;d.position.x=a.x,d.position.y=a.y,d.shift.x=a.x,d.shift.y=a.y,d.color=B[A].particleFill,w.push(d)}}function i(a,b){var c=b.x-a.x,d=b.y-a.y;return Math.sqrt(c*c+d*d)}function j(b){w=[],x=[],clearInterval(),s=b,s&&s.getContext&&(t=s.getContext("2d"),r(),f(),setInterval(k,1e3/60),a.info("Gravity model initialized"))}function k(){B[A].useFade?(t.fillStyle=B[A].fadeFill,t.fillRect(0,0,t.canvas.width,t.canvas.height)):t.clearRect(0,0,s.width,s.height);var a,b,c,e,f,g;for(e=0,g=x.length;g>e;e++){b=x[e],b.dragging&&(b.position.x+=.2*(u-b.position.x),b.position.y+=.2*(v-b.position.y)),b.size+=.025*(b.connections/3-b.size),b.size=Math.max(b.size,2);var h=t.createRadialGradient(b.position.x,b.position.y,0,b.position.x,b.position.y,10*b.size);h.addColorStop(0,B[A].glowA),h.addColorStop(1,B[A].glowB),t.beginPath(),t.fillStyle=h,t.arc(b.position.x,b.position.y,10*b.size,0,2*Math.PI,!0),t.fill(),t.beginPath(),t.fillStyle="#00000000",t.arc(b.position.x,b.position.y,b.size,0,2*Math.PI,!0),t.fill(),b.connections=0}for(c=0,f=w.length;f>c;c++){a=w[c];var j=-1,k=-1,l=null,m={x:0,y:0};for(e=0,g=x.length;g>e;e++){if(b=x[e],j=i(a.position,b.position)-.5*b.orbit,a.magnet!==b){var n=b.position.x-a.position.x;n>-d&&d>n&&(m.x+=n/d);var o=b.position.y-a.position.y;o>-d&&d>o&&(m.y+=o/d)}(null===l||k>j)&&(k=j,l=b)}(null===a.magnet||a.magnet!==l)&&(a.magnet=l),l.connections+=1,a.angle+=a.speed,a.shift.x+=(l.position.x+8*m.x-a.shift.x)*a.speed,a.shift.y+=(l.position.y+8*m.y-a.shift.y)*a.speed,a.position.x=a.shift.x+Math.cos(c+a.angle)*(a.orbit*a.force),a.position.y=a.shift.y+Math.sin(c+a.angle)*(a.orbit*a.force),a.position.x=Math.max(Math.min(a.position.x,s.clientWidth-a.size/2),a.size/2),a.position.y=Math.max(Math.min(a.position.y,s.clientHeight-a.size/2),a.size/2),a.orbit+=.1*(l.orbit-a.orbit),t.beginPath(),t.fillStyle=a.color,t.arc(a.position.x,a.position.y,a.size/2,0,2*Math.PI,!0),t.fill()}}function l(a){a.preventDefault(),y=!0,(new Date).getTime()-z<300&&(g({x:u,y:v}),z=0),z=(new Date).getTime();for(var b=0,c=x.length;c>b;b++){var d=x[b];if(i(d.position,{x:u,y:v})<.5*d.orbit){d.dragging=!0;break}}}function m(a){u=a.clientX-s.offsetLeft+window.pageXOffset,v=a.clientY-s.offsetTop+window.pageYOffset}function n(a){y=!1;for(var b=0,c=x.length;c>b;b++){var d=x[b];d.dragging=!1}}function o(){event.preventDefault(),++A,q()}function p(){event.preventDefault(),--A,q()}function q(){A=0>A?B.length-1:A,A=A>B.length-1?0:A;for(var b=0,c=w.length;c>b;b++)w[b].color=B[A].particleFill;a.info("Skin updated")}function r(){s.width=document.getElementById("gravity")?document.getElementById("gravity").clientWidth:e.WIDTH,s.height=document.getElementById("gravity")?document.getElementById("gravity").clientHeight:e.HEIGHT,u=s.clientWidth-s.offsetLeft,v=s.clientHeight-s.offsetTop,a.info("Windows resized invoked")}var s,t,u,v,w=[],x=[],y=!1,z=0,A=0,B=[{glowA:"rgba(0,200,250,0.3)",glowB:"rgba(0,200,250,0.0)",particleFill:"#ffffff",fadeFill:"rgba(22,22,22,.6)",useFade:!0},{glowA:"rgba(230,0,0,0.3)",glowB:"rgba(230,0,0,0.0)",particleFill:"#ffffff",fadeFill:"rgba(22,22,22,.6)",useFade:!0},{glowA:"rgba(0,230,0,0.3)",glowB:"rgba(0,230,0,0.0)",particleFill:"rgba(0,230,0,0.7)",fadeFill:"rgba(22,22,22,.6)",useFade:!0},{glowA:"rgba(0,0,0,0.3)",glowB:"rgba(0,0,0,0.0)",particleFill:"#333333",fadeFill:"rgba(255,255,255,.6)",useFade:!0},{glowA:"rgba(0,0,0,0.0)",glowB:"rgba(0,0,0,0.0)",particleFill:"#333333",fadeFill:"rgba(255,255,255,.2)",useFade:!0},{glowA:"rgba(230,230,230,0)",glowB:"rgba(230,230,230,0.0)",particleFill:"#ffffff",fadeFill:"",useFade:!1}],C={init:j,nextSkin:o,onMouseDown:l,onMouseMove:m,onMouseUp:n,onWindowResize:r,previousSkin:p,log:a.log};return C}angular.module("Gravity.Services").service("gravityService",a),a.$inject=["$log","MAGNETS_AT_START","PARTICLES_PER_MAGNET","MAGNETIC_FORCE_THRESHOLD","SCREEN"]}(),function(){"use strict";angular.module("Gravity.Constants").constant("MAGNETS_AT_START",4).constant("MAGNETIC_FORCE_THRESHOLD",300).constant("PARTICLES_PER_MAGNET",20).constant("SCREEN",{HEIGHT:400,WIDTH:400})}(),angular.module("Gravity.Factories").factory("Particle",Particle),angular.module("Gravity.Factories").factory("Magnet",Magnet);

New alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

43653

0.13%

Worsened metrics

Dev dependency count

18

12.5%

No dependency changes