removed perfect scrollbar

css/infobar.css

@@ -163,7 +163,7 @@
     /* width: 450px; */
     float: left;
     height: 100%;
-    /* overflow-y: auto; */
+     overflow-y: auto; 
     /* overflow-x: hidden; */
 }
 

css/perfect-scrollbar.css

-/* perfect-scrollbar v0.6.10 */
-.ps-container {
-  -ms-touch-action: none;
-  touch-action: none;
-  overflow: hidden !important;
-  -ms-overflow-style: none;
-  }
-  @supports (-ms-overflow-style: none) {
-    .ps-container {
-      overflow: auto !important; } }
-  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    .ps-container {
-      overflow: auto !important; } }
-  .ps-container.ps-active-x > .ps-scrollbar-x-rail,
-  .ps-container.ps-active-y > .ps-scrollbar-y-rail {
-    left: 3px;
-    top: 0!important;
-    display: block;
-    background-color: transparent;
-    }
-  .ps-container.ps-in-scrolling {
-    pointer-events: none; }
-    .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
-      background-color: #6B6B6B;
-      opacity: 0.9; }
-      .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
-        background-color: #999; }
-    .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
-      background-color: #6B6B6B;
-      opacity: 0.9; }
-      .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
-        background-color: #999; }
-  .ps-container > .ps-scrollbar-x-rail {
-    display: none;
-    position: absolute;
-    /* please don't change 'position' */
-    -webkit-border-radius: 4px;
-    -moz-border-radius: 4px;
-    border-radius: 4px;
-    opacity: 0;
-    -webkit-transition: background-color .2s linear, opacity .2s linear;
-    -moz-transition: background-color .2s linear, opacity .2s linear;
-    -o-transition: background-color .2s linear, opacity .2s linear;
-    transition: background-color .2s linear, opacity .2s linear;
-    bottom: 3px;
-    /* there must be 'bottom' for ps-scrollbar-x-rail */
-    height: 8px; }
-    .ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
-      position: absolute;
-      /* please don't change 'position' */
-      background-color: #aaa;
-      -webkit-border-radius: 4px;
-      -moz-border-radius: 4px;
-      border-radius: 4px;
-      -webkit-transition: background-color .2s linear;
-      -moz-transition: background-color .2s linear;
-      -o-transition: background-color .2s linear;
-      transition: background-color .2s linear;
-      bottom: 0;
-      /* there must be 'bottom' for ps-scrollbar-x */
-      height: 8px; }
-  .ps-container > .ps-scrollbar-y-rail {
-    display: none;
-    position: absolute;
-    /* please don't change 'position' */
-    -webkit-border-radius: 4px;
-    -moz-border-radius: 4px;
-    border-radius: 4px;
-    opacity: 0;
-    -webkit-transition: background-color .2s linear, opacity .2s linear;
-    -moz-transition: background-color .2s linear, opacity .2s linear;
-    -o-transition: background-color .2s linear, opacity .2s linear;
-    transition: background-color .2s linear, opacity .2s linear;
-    right: 3px;
-    /* there must be 'right' for ps-scrollbar-y-rail */
-    width: 8px; }
-    .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
-      position: absolute;/* please don't change 'position' */
-      background-color: #AFAFAF;
-      -webkit-border-radius: 4px;
-      -moz-border-radius: 4px;
-      border-radius: 4px;
-      -webkit-transition: background-color .2s linear;
-      -moz-transition: background-color .2s linear;
-      -o-transition: background-color .2s linear;
-      transition: background-color .2s linear;
-      right: 0;/* there must be 'right' for ps-scrollbar-y */
-      width: 8px;
-      }
-  .ps-container:hover.ps-in-scrolling {
-    pointer-events: none; }
-    .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
-      background-color: #eee;
-      opacity: 0.9; }
-      .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
-        background-color: #999; }
-    .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
-      background-color: #6B6B6B;
-      opacity: 0.9; }
-      .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
-        background-color: #999; }
-  .ps-container:hover > .ps-scrollbar-x-rail,
-  .ps-container:hover > .ps-scrollbar-y-rail {
-    opacity: 0.6;
-    }
-  .ps-container:hover > .ps-scrollbar-x-rail:hover {
-    background-color: #eee;
-    opacity: 0.9; }
-    .ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
-      background-color: #999; }
-  .ps-container:hover > .ps-scrollbar-y-rail:hover {
-    background-color: #6B6B6B;
-    opacity: 0.9;
-    }
-    .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
-      background-color: #999; }

js/viz.js

@@ -35,22 +35,16 @@
 
 utils.welcome();
 
-
 var data;
-var imagesMap = d3.map([]);;
-var imagesMap2 = d3.map([]);
 var tags;
 var canvas;
 var search;
-var c = console.log.bind(console);
 var ping;
-var feedbacked = false;
-
 
 if (Modernizr.webgl) {
   init();
 } else {
-  alert("sorry you need webGL") 
+  alert("Sorry your device doesn't support webGL") 
 }
 
 
@@ -69,43 +63,24 @@ function init() {
       d3.csv(config.loader.timeline, function(timeline) {
           Loader(config.loader.items).finished(function(data) {
 
-              window.data = data;
-              window.config = config
-
               utils.clean(data);
 
-              tags.init(data);
+              tags.init(data, config);
               search.init();
-        
-              data.forEach(function (d) {
-                  imagesMap.set(d.id, PIXI.Texture.WHITE)
-              })
-              canvas.init(data, timeline);
-
-
-              tags.mouseenterCallback(function(d) {
-                  canvas.highlight(d);
-              })
-
-              tags.mouseclickCallback(function(d) {
-                  canvas.project(d);
-              })
+              canvas.init(data, timeline, config);
 
               LoaderSprites()
                 .progress(function(textures){
-                  for(var id in textures) {
+                  Object.keys(textures).forEach(function(id){
                     data
                       .filter(function (d) { return d.id === id })
                       .forEach(function(d) { 
-                        var texture = textures[id]
-                        d.sprite.texture = texture
-
+                        d.sprite.texture = textures[id]
+                      })
                   })
-                  }
                   canvas.wakeup()
                 })
                 .load(config.loader.textures.medium.url)
-         
           });
         });
     });
@@ -142,7 +117,6 @@ d3.select(".infobutton")
   })
 
 
-
 var browserInfo = d3.select(".browserInfo");
 
 if(utils.isMobile()){
@@ -156,7 +130,3 @@ if(utils.isMobile()){
       })
       
 }
\ No newline at end of file
-
-var infoscroll = d3.select('.infobar .outer').node();
-Ps.initialize(infoscroll);
-