Browse Source

improved checkcollision performance

Bachir Soussi Chiadmi 6 years ago
parent
commit
79071bf0cc

+ 28 - 19
sites/all/modules/figli/edlp_corpus/assets/dist/scripts/corpus.min.js

@@ -73,6 +73,9 @@
         // _scrambler_CL,
         // _scrambler_CR;
 
+    var check_parts_colid_frq = 2;
+    var check_parts_colid_tick = 1;
+
     //     ____      _ __
     //    /  _/___  (_) /______
     //    / // __ \/ / __/ ___/
@@ -230,13 +233,14 @@
 
       this.e_color = 'e_col_'+this.entrees[Math.floor(Math.random(this.entrees.length))];
 
+      // pre-rendering node virtual canvas
       this.canvas = document.createElement('canvas');
       this.canvas_ctx = this.canvas.getContext('2d');
-
-      this.line_width = 1.5;
-      this.canvas_w = this.r*2+this.line_width*2;
-      this.canvas.width = this.canvas_w;
-      this.canvas.height = this.canvas_w;
+      this.line_width = 1;
+      this.w = this.r*2+this.line_width*2;
+      this.w_2 = this.w/2;
+      this.canvas.width = this.w;
+      this.canvas.height = this.w;
       this.canvas_ctx.fillStyle = 'rgb(255,255,255)';
       this.canvas_ctx.lineWidth = this.line_width;
 
@@ -250,8 +254,6 @@
       this.aside = false;
       this.scrambling = false;
 
-      // this.n_repulses = {};
-
       // prototypes
       if (typeof Node.initialized == "undefined") {
 
@@ -266,15 +268,14 @@
 
           this.draw();
           this.initPhysics();
-
         };
 
         Node.prototype.draw = function(){
-          _ctx.clearRect(0, 0, this.canvas_w, this.canvas_w);
+          _ctx.clearRect(0, 0, this.w, this.w);
 
           this.canvas_ctx.beginPath();
           // white background
-          this.canvas_ctx.fillRect(0,0,this.canvas_w,this.canvas_w);
+          this.canvas_ctx.fillRect(0,0,this.w,this.w);
 
           this.canvas_ctx.globalAlpha = this.faded ? 0.15 : 1;
 
@@ -537,7 +538,7 @@
 
         Node.prototype.move = function(){
           // just draw the virtual node canvas into the main scene canvas at the right position
-          _ctx.drawImage(this.canvas, this.x-this.r, this.y-this.r);
+          _ctx.drawImage(this.canvas, this.x-this.w_2, this.y-this.w_2);
         };
 
         Node.initialized = true;
@@ -545,9 +546,18 @@
 
       this.init();
     };
+
     // TODO: we may convert a lot of computation into a web worker
     // https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers
     function checkParticulesCollisions(){
+
+      // do not run particule collision every frames
+      if(check_parts_colid_tick < check_parts_colid_frq){
+        check_parts_colid_tick++;
+        return;
+      }
+      check_parts_colid_tick = 1;
+
       // pre create vars to save memory;
       var na,nb,
           ma,mb,
@@ -562,7 +572,7 @@
         // avoid colliding for centered nodes
         // if(_nodes[n].center) continue;
         // avoid colliding for scrambling nodes
-        if(na.scrambling) continue;
+        if(na.scrambling || na.aside || na.center) continue;
 
         ma = na.p.mass;
 
@@ -571,16 +581,16 @@
           // avoid impact between center and aside particules
           // if((na.center && nb.aside) || (na.aside && nb.center))
           // and between aside particules
-          if(na.aside || nb.aside)
+          if(nb.aside)
             continue;
 
 
           // avoid impact between two centered particulses that comes to the center
-          if(na.center && nb.center){
-            if(Math.min(na.p.distanceTo(_attracter), nb.p.distanceTo(_attracter)) > 300){
-              if( Math.random()>0.3 ) continue;
-            }
-          }
+          // if(na.center && nb.center){
+          //   if(Math.min(na.p.distanceTo(_attracter), nb.p.distanceTo(_attracter)) > 300){
+          //     if( Math.random()>0.3 ) continue;
+          //   }
+          // }
 
           w = h = (na.r+nb.r);
           // if(!na.aside && !nb.aside){
@@ -684,7 +694,6 @@
       // console.log('_physics.attractions.length', _physics.attractions.length);
     };
 
-
     //  ___              _             ___ _           _ _    _
     // | _ \__ _ _ _  __| |___ _ __   | _ \ |__ _ _  _| (_)__| |_
     // |   / _` | ' \/ _` / _ \ '  \  |  _/ / _` | || | | (_-<  _|

+ 28 - 19
sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js

@@ -73,6 +73,9 @@
         // _scrambler_CL,
         // _scrambler_CR;
 
+    var check_parts_colid_frq = 2;
+    var check_parts_colid_tick = 1;
+
     //     ____      _ __
     //    /  _/___  (_) /______
     //    / // __ \/ / __/ ___/
@@ -230,13 +233,14 @@
 
       this.e_color = 'e_col_'+this.entrees[Math.floor(Math.random(this.entrees.length))];
 
+      // pre-rendering node virtual canvas
       this.canvas = document.createElement('canvas');
       this.canvas_ctx = this.canvas.getContext('2d');
-
-      this.line_width = 1.5;
-      this.canvas_w = this.r*2+this.line_width*2;
-      this.canvas.width = this.canvas_w;
-      this.canvas.height = this.canvas_w;
+      this.line_width = 1;
+      this.w = this.r*2+this.line_width*2;
+      this.w_2 = this.w/2;
+      this.canvas.width = this.w;
+      this.canvas.height = this.w;
       this.canvas_ctx.fillStyle = 'rgb(255,255,255)';
       this.canvas_ctx.lineWidth = this.line_width;
 
@@ -250,8 +254,6 @@
       this.aside = false;
       this.scrambling = false;
 
-      // this.n_repulses = {};
-
       // prototypes
       if (typeof Node.initialized == "undefined") {
 
@@ -266,15 +268,14 @@
 
           this.draw();
           this.initPhysics();
-
         };
 
         Node.prototype.draw = function(){
-          _ctx.clearRect(0, 0, this.canvas_w, this.canvas_w);
+          _ctx.clearRect(0, 0, this.w, this.w);
 
           this.canvas_ctx.beginPath();
           // white background
-          this.canvas_ctx.fillRect(0,0,this.canvas_w,this.canvas_w);
+          this.canvas_ctx.fillRect(0,0,this.w,this.w);
 
           this.canvas_ctx.globalAlpha = this.faded ? 0.15 : 1;
 
@@ -537,7 +538,7 @@
 
         Node.prototype.move = function(){
           // just draw the virtual node canvas into the main scene canvas at the right position
-          _ctx.drawImage(this.canvas, this.x-this.r, this.y-this.r);
+          _ctx.drawImage(this.canvas, this.x-this.w_2, this.y-this.w_2);
         };
 
         Node.initialized = true;
@@ -545,9 +546,18 @@
 
       this.init();
     };
+
     // TODO: we may convert a lot of computation into a web worker
     // https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers
     function checkParticulesCollisions(){
+
+      // do not run particule collision every frames
+      if(check_parts_colid_tick < check_parts_colid_frq){
+        check_parts_colid_tick++;
+        return;
+      }
+      check_parts_colid_tick = 1;
+
       // pre create vars to save memory;
       var na,nb,
           ma,mb,
@@ -562,7 +572,7 @@
         // avoid colliding for centered nodes
         // if(_nodes[n].center) continue;
         // avoid colliding for scrambling nodes
-        if(na.scrambling) continue;
+        if(na.scrambling || na.aside || na.center) continue;
 
         ma = na.p.mass;
 
@@ -571,16 +581,16 @@
           // avoid impact between center and aside particules
           // if((na.center && nb.aside) || (na.aside && nb.center))
           // and between aside particules
-          if(na.aside || nb.aside)
+          if(nb.aside)
             continue;
 
 
           // avoid impact between two centered particulses that comes to the center
-          if(na.center && nb.center){
-            if(Math.min(na.p.distanceTo(_attracter), nb.p.distanceTo(_attracter)) > 300){
-              if( Math.random()>0.3 ) continue;
-            }
-          }
+          // if(na.center && nb.center){
+          //   if(Math.min(na.p.distanceTo(_attracter), nb.p.distanceTo(_attracter)) > 300){
+          //     if( Math.random()>0.3 ) continue;
+          //   }
+          // }
 
           w = h = (na.r+nb.r);
           // if(!na.aside && !nb.aside){
@@ -684,7 +694,6 @@
       // console.log('_physics.attractions.length', _physics.attractions.length);
     };
 
-
     //  ___              _             ___ _           _ _    _
     // | _ \__ _ _ _  __| |___ _ __   | _ \ |__ _ _  _| (_)__| |_
     // |   / _` | ' \/ _` / _ \ '  \  |  _/ / _` | || | | (_-<  _|

+ 1 - 1
sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css

@@ -2589,7 +2589,7 @@ footer {
         footer .block-block-edlp-entrees div.item-list ul li.opened .entree-content {
           width: 350px;
           opacity: 1; }
-    footer .block-block-edlp-entrees div.item-list.opened li:not(.opened):not(.highlighted) a.term-link, footer .block-block-edlp-entrees div.item-list.highlighted li:not(.opened):not(.highlighted) a.term-link {
+    footer .block-block-edlp-entrees div.item-list.opened li:not(.opened):not(.highlighted):not(:hover) a.term-link, footer .block-block-edlp-entrees div.item-list.highlighted li:not(.opened):not(.highlighted):not(:hover) a.term-link {
       color: #a1a1a1; }
   footer .block.random-player {
     margin-bottom: 1em;

+ 1 - 1
sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -1744,7 +1744,7 @@ footer{
         }
       }
       &.opened, &.highlighted{
-        li:not(.opened):not(.highlighted){
+        li:not(.opened):not(.highlighted):not(:hover){
           a.term-link{
             color:#a1a1a1;
           }