diff --git a/Stored_Analyses/diabetes_projection_per(30)_iter(500)_rate(10).txt b/Stored_Analyses/diabetes_perplexity(30)_iterations(500)_rate(10).txt
similarity index 100%
rename from Stored_Analyses/diabetes_projection_per(30)_iter(500)_rate(10).txt
rename to Stored_Analyses/diabetes_perplexity(30)_iterations(500)_rate(10).txt
diff --git a/index.html b/index.html
index bf2fa03..bafcbbc 100755
--- a/index.html
+++ b/index.html
@@ -36,7 +36,10 @@
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.0/css/all.css" integrity="sha384-Mmxa0mLqhmOeaE8vgOSbKacftZcsNYDjQzuCOm6D02luYSzBG8vpaOykv9lFQ51Y" crossorigin="anonymous">
     
     <!-- Bootstrap -->
+
+    <script src="./modules/popper/popper.min.js"></script>
     <script src="./modules/bootstrap/bootstrap.min.js"></script>
+
   
   </head>
 
@@ -46,12 +49,12 @@
             <div class="col-md-3">
                 <div class="panel panel-default" id="left-side-param">
                     <div class="panel-heading">
-                      <h2 class="panel-title" style="display:inline-block">t-SNE Parameters</h2><div id="cost" style="display:inline-block; float:right"></div>
+                      <h2 class="panel-title" style="display:inline-block" data-toggle="tooltip" data-placement="right" title="Tip: control t-SNE algorithm and its parameters.">t-SNE Parameters</h2><div id="cost" style="display:inline-block; float:right"></div>
                     </div>
                   <div class="panel-body">
                     <div id="control-panel" data-sr="enter left over 8s">
                       <div class="param">
-                          <label id="data" for="param-dataset">Data sets</label>
+                          <label id="data" for="param-dataset" data-toggle="tooltip" data-placement="right" title="Tip: use one of the data sets already provided or upload a new file.">Data sets</label>
                           <select id="param-dataset" name="param-dataset" onChange="changeDataset(this.value);">
                             <option value="diabetes.csv" selected>Pima Indian Diabetes</option>
                             <option value="breast-cancer-wisconsin.csv">Breast Cancer Wisconsin</option>
@@ -59,15 +62,15 @@
                             <option value="winequality-red.csv">Red Wine - Quality</option>
                             <option value="empty">Upload New File</option>
                           </select>
-                          <button type="button" class="button" id="FactRes" onclick="FactoryReset()">Factory reset</button>
+                          <button type="button" class="button" id="FactRes" onclick="FactoryReset()" data-toggle="tooltip" data-placement="right" title="Tip: Restart the entire web page/application.">Factory reset</button>
                       </div>
                           <div class="param">
-                        <label for="param-perplexity">Perplexity</label>
-                        <input id="param-perplexity" type="range" min="5" max="100" value="30", step="1">
+                        <label for="param-perplexity" data-toggle="tooltip" data-placement="right" title="Tip: perplexity is a measure for information that is defined as 2 to the power of the Shannon entropy. The perplexity of a fair die with k sides is equal to k. In t-SNE, the perplexity may be viewed as a knob that sets the number of effective nearest neighbors. (Source: https://lvdmaaten.github.io/tsne/)">Perplexity</label>
+                        <input id="param-perplexity" type="range" min="5" max="100" value="30", step="1" >
                         <output for="param-perplexity" id="param-perplexity-value">30</output>
                           </div>
                           <div class="param">
-                        <label for="param-learningrate">Learning rate</label>
+                        <label for="param-learningrate" data-toggle="tooltip" data-placement="right" title="Tip: if the learning rate is too high, the data may look like a ‘ball’ with any point approximately equidistant from its nearest neighbours. If the learning rate is too low, most points may look compressed in a dense cloud with few outliers. If the cost function gets stuck in a bad local minimum increasing the learning rate may help. (Source: https://scikit-learn.org/stable/modules/generated/sklearn.manifold.TSNE.html)">Learning rate</label>
                         <input id="param-learningrate" type="range" min="1" max="150" value="10", step="1">
                         <output for="param-learningrate" id="param-learningrate-value">10</output>
                           </div>
@@ -77,7 +80,7 @@
                           <div class="param">
                               <div class="row">
                               <div class="col-md-3">
-                              <label for="param-maxiter" style="padding: 25px 0 0 8px">Max iterations</label>
+                              <label for="param-maxiter" style="padding: 25px 0 0 8px" data-toggle="tooltip" data-placement="right" title="Tip: maximum number of iterations for the optimization. Should usually be around 250. (Source: https://scikit-learn.org/stable/modules/generated/sklearn.manifold.TSNE.html)">Max iterations</label>
                               </div>
                               <div class="col-md-4" style="padding: 25px 0 0 0px">
                               <input id="param-maxiter" type="range" min="10" max="1000" value="500", step="10" >
@@ -94,31 +97,31 @@
                           </div>
                           </div>
                           <div class="param">
-                        <label for="param-distance">Distance metric</label>
+                        <label for="param-distance" data-toggle="tooltip" data-placement="right" title="Tip: distance different measurements. Usually Euclidean distance is used.">Distance metric</label>
                         <select id="param-distance" name="param-distance">
                             <option value="euclideanDist" selected>Euclidean distance</option>
                             <option value="jaccardDist">Jaccard dissimilarity</option>
                         </select>
                         <input id="file-input" type="file" name="name" style="display: none;" />
-                        <button type="button" class="button" onclick='loadAnalysis();' style="padding:0 12px 0 12px">Load execut.</button>
+                        <button type="button" class="button" onclick='loadAnalysis();' style="padding:0 12px 0 12px" data-toggle="tooltip" data-placement="right" title="Tip: load previously executed file in .txt format.">Load execut.</button>
                           </div>
                           <div class="param">
-                        <label for="param-transform">Data transform</label>
+                        <label for="param-transform" data-toggle="tooltip" data-placement="right" title="Tip: distance transformation measurements. Usually either no transformation or Log10/Asinh (logarithmic/hyperbolic) distance are used.">Data transform</label>
                         <select id="param-transform" name="param-transform">
                             <option value="noTrans" selected>No transform</option>
                             <option value="logTrans">Log10</option>
                             <option value="asinhTrans">Asinh</option>
                             <option value="binTrans">Binarize</option>
                         </select>
-                        <button type="button" class="button" onclick="SaveAnalysis()" style="padding:0 10px 0 10px">Store execut.</button>
+                        <button type="button" class="button" onclick="SaveAnalysis()" style="padding:0 10px 0 10px" data-toggle="tooltip" data-placement="right" title="Tip: save/store previously executed file in .txt format.">Store execut.</button>
                           </div>
                         <div class="row">
                           <div class="col-md-8">
                               <p><div id="run-button"><button id="ExecuteBut" class="btn btn-primary btn-block" onclick="getData();" value="Execute new t-SNE analysis" style="margin-top: 4px"><i class="fas fa-running fa-lg" style="margin-right: 10px"></i>Execute new t-SNE analysis</button></div></p>
                           </div>
                           <div class="col-md-4" style="margin-top: 10px">
-                            <label>
-                                <input id="downloadDists" checked type="checkbox">
+                            <label data-toggle="tooltip" data-placement="right" title="Tip: if you store distances the file size will be larger but on a loading of this execution it will be processed much quicker than without this option enabled.">
+                                <input id="downloadDists" checked type="checkbox" >
                                 Distances cached on "Store execution"
                             </label>
                           </div>
@@ -155,7 +158,7 @@
             <div class="col-md-3"  style="margin-top:-4px">
                 <div class="panel panel-default" style="padding-bottom: 35px;">
                   <div class="panel-heading">
-                      <h2 class="panel-title" style="display:inline-block">t-SNE Overview</h2><div id="datasetDetails"style="display:inline-block; float:right"></div>
+                      <h2 class="panel-title" style="display:inline-block" data-toggle="tooltip" data-placement="right" title="Tip: t-SNE overview with or without labels depending on each data set. To determine the feature of a data set that corresponds to classes set a * mark after this feature.">t-SNE Overview</h2><div id="datasetDetails"style="display:inline-block; float:right"></div>
                   </div>
                   <div class="row">
                     <div class="panel-body">
@@ -195,20 +198,20 @@
                            <div class="param">
                               <div class="row" style="margin-top: 30px">
                                   <div class="col-md-6">
-                              <label for="param-corr">Correlation threshold</label>
-                              </div>
+                                <label for="param-corr" data-toggle="tooltip" data-placement="right" title="Tip: percentage of all points taken into account by Dimension Correlation.">Correlation threshold (%)</label>
+                                  </div>
                               <div class="col-md-5">
-                              <input id="param-corr" type="range" min="0" max="750" value="150", step="25" onchange="CalculateCorrel(true);" style="margin-left: -20px;">
+                              <input id="param-corr" type="range" min="0" max="100" value="25", step="1" onchange="CalculateCorrel(true);" style="margin-left: -20px;">
                             </div>
                             <div class="col-md-1">
-                              <output for="param-corr" id="param-corr-value" style="margin-left: -20px;">150</output>
+                              <output for="param-corr" id="param-corr-value" style="margin-left: -20px;">25</output>
                             </div>
                             </div>
                             </div>
                               <div class="param">
                                 <div class="row" style="margin-top: 30px">
                                   <div class="col-md-6">
-                                  <label for="param-lim" >Points radius scaling</label>
+                                  <label for="param-lim" data-toggle="tooltip" data-placement="right" title="Tip: x*times the actual radius (increase/decrease points radius).">Points radius scaling</label>
                                 </div>
                                 <div class="col-md-5">
                                   <input id="param-lim" type="range" min="1" max="4" value="3", step="0.5" onchange="setReInitialize(false);" style="margin-left: -20px;">
@@ -252,7 +255,7 @@
             <div class="col-md-3"  style="margin-top:-4px">
                 <div class="panel panel-default" style="padding-bottom : 60px">
                   <div class="panel-heading">
-                    <h2 class="panel-title">Shepard Heatmap</h2>
+                    <h2 class="panel-title" data-toggle="tooltip" data-placement="right" title="Tip: a view related to the overall quality of the projection.">Shepard Heatmap</h2>
                   </div>
                 <div class="panel-body">
                   <div class="row">
@@ -286,11 +289,11 @@
         <div class="col-md-3" id="extra-information" style="width: 24.8vw">
             <div class="panel panel-default right-side-hist">
                 <div class="panel-heading">
-                      <h2 class="panel-title" style="display:inline-block;">Density and Remaining Cost Distributions</h2>
+                      <h2 class="panel-title" style="display:inline-block;" data-toggle="tooltip" data-placement="right" title="Tip: it might be useful to take a look at this histogram, to observe the density and remaining cost distributions, when remaining cost values are low and have an idea about the distributions.">Density and Remaining Cost Distributions</h2>
                     <div class="col-md-7"></div>
                     <div class="col-md-5">
                       <div class="param" style="display:inline-block; float:right; margin-top:-21.5px; margin-right: -18px">
-                      <label for="param-costlim" style="display:inline-block; float: right">Min. Visible Cost Rate: #<output for="param-costlim" id="param-costlim-value" style="display:inline-block; float:right">1</output></label>
+                      <label for="param-costlim" style="display:inline-block; float: right" data-toggle="tooltip" data-placement="right" title="Tip: set the rate of the limiter for the minimum acceptable visible cost at the main visualization view.">Min. Visible Cost Rate: #<output for="param-costlim" id="param-costlim-value" style="display:inline-block; float:right">1</output></label>
                       <input id="param-costlim" type="range" min="0.1" max="1" value="1", step="0.1" style="display:inline-block; float:right" onchange="setReInitialize(false);">
                     </div>
                   </div>
@@ -305,7 +308,16 @@
         <div class = col-md-6>
           <div class="panel panel-default med-bottom">
             <div class="panel-heading">
-              <h2 class="panel-title" style="display:inline-block">Neighborhood Preservation</h2><div id="knnBarChartDetails"style="display:inline-block; float:right"></div>
+              <h2 class="panel-title" style="display:inline-block">Neighborhood Preservation </h2>
+              [Visualization:
+              <select id="param-NB-view" name="param-NB-view" onchange="LineBar()">
+                  <option value="1" selected>Bar Chart</option>
+                  <option value="2">Line Plot</option>
+                  <option value="3">Difference Line Plot</option>
+                </select>
+              ]
+              <div id="knnBarChartDetails"style="display:inline-block; float:right">
+              </div>
             </div>
             <div class="panel-body">
               <div id="hider"></div>
@@ -328,6 +340,10 @@
     </div>
 
     <script>
+      // Tooltip
+      $(document).ready(function(){
+        $(this).tooltip();
+      });
 
       $("#cost").html('(Unknown Iteration and Cost Values)');
       $("#datasetDetails").html('(Unknown Number of Dimensions and Instances)');
@@ -369,7 +385,7 @@
         this.className += " active";
         });
       }
-      
+
     </script>
 
     <script>
diff --git a/js/tsne_vis.js b/js/tsne_vis.js
index f9258b8..478c86b 100755
--- a/js/tsne_vis.js
+++ b/js/tsne_vis.js
@@ -29,7 +29,8 @@ var ArrayWithCosts = []; var Iterations = [];
 var VisiblePoints = [];
 
 // This variable is for the kNN Bar Chart in order to store the first execution.
-var inside = 0;  
+var inside = 0; var kValuesLegend = []; var findNearestTable = []; var howManyPoints;
+var maxKNN = Math.round(document.getElementById("param-perplexity-value").value*1.25); // Specify the amount of k neighborhoods that we are going to calculate. According to "perplexity."
 
 var format; 
 
@@ -1553,6 +1554,13 @@ function click(){ // This is the click of the Schema Investigation scenario
 
 }
 
+function sortByKey(array, key) {
+  return array.sort(function(a, b) {
+      var x = a[key]; var y = b[key];
+      return ((x < y) ? -1 : ((x > y) ? 1 : 0));
+  });
+}
+
 function CalculateCorrel(flagForSchema){ // Calculate the correlation is a function which has all the computations for the schema ordering (investigation).
  
   if (flagForSchema == false){
@@ -1611,14 +1619,16 @@ function CalculateCorrel(flagForSchema){ // Calculate the correlation is a funct
         }
       }
     }
-    
+    var compareThreshold = ((correlLimit/100)*arraysCleared.length)
+    compareThreshold = Math.ceil(compareThreshold);
+
+    arraysCleared = sortByKey(arraysCleared, 5);
     ArrayLimit = [];
     for (var i=0; i<arraysCleared.length; i++) {
-      if (arraysCleared[i][5] < correlLimit) { // Now we add a limit to the distance that we search according to the thresholder which the user changes through a slider.
+      if (i <= compareThreshold) { // Now we add a limit to the distance that we search according to the thresholder which the user changes through a slider.
         ArrayLimit.push(arraysCleared[i]);
       }
     }
-
     var temparray = [];
     var count = new Array(paths.nodes().length).fill(0);
 
@@ -1793,15 +1803,20 @@ function CalculateCorrel(flagForSchema){ // Calculate the correlation is a funct
 
   for (var j = 0; j < correlationResultsFinal.length; j++) {
     for (var i = 0; i < SignStore.length; i++) {
-      if (SignStore[i][1]*(-1) == correlationResults[j][1]) {
-        correlationResultsFinal[j][1] = parseFloat((correlationResultsFinal[j][1])).toFixed(2) * (-1); // Give the negative sign if needed and multiply by 100
-      }
-      if (SignStore[i][1] == correlationResults[j][1]) {
-        correlationResultsFinal[j][1] = parseFloat((correlationResultsFinal[j][1])).toFixed(2); // Give a positive sign and multiply by 100
+      if (SignStore[i][0] == correlationResults[j][2]){
+        if (SignStore[i][1] < 0)
+        {
+          correlationResultsFinal[j][1] = parseFloat((correlationResultsFinal[j][1])).toFixed(2) * (-1); // Give the negative sign if needed and multiply by 100
+        }
+        else 
+        {
+          correlationResultsFinal[j][1] = parseFloat((correlationResultsFinal[j][1])).toFixed(2); // Give a positive sign and multiply by 100
+        }
       }
     }
   }
 }
+//console.log(correlationResultsFinal);
     drawBarChart(); // Draw the horizontal barchart with the correlations.
     
     }
@@ -2328,8 +2343,7 @@ inside = inside + 1;
 if (points.length) { // If points exist (at least 1 point)
 
     selectedPoints = [];
-    var findNearestTable = [];
-    var howManyPoints = 0;
+    howManyPoints = 0;
     for (let m=0; m<points.length; m++){
       //if (points[m].id == 257){
       if (points[m].selected == true){
@@ -2345,16 +2359,11 @@ if (points.length) { // If points exist (at least 1 point)
 
       var findNearest;
 
-      var viewport = getViewport(); // Get the main viewport width height
-      var vw = viewport[0] * 0.5;
-      var vh = viewport[1] * 0.042;
-
-      var maxKNN = Math.round(document.getElementById("param-perplexity-value").value*1.25); // Specify the amount of k neighborhoods that we are going to calculate. According to "perplexity."
       //var maxKNN = 1;
       selectedPoints.sort(function(a, b) { // Sort the points according to ID.
         return parseFloat(a.id) - parseFloat(b.id);
       });
-    
+      findNearestTable = [];
       for (k=maxKNN; k>0; k--){ // Start from the maximum k value and go to the minimum (k=2).
 
         var findNearest = [];
@@ -2430,67 +2439,22 @@ if (points.length) { // If points exist (at least 1 point)
       }
          
       findNearestTable.reverse();
-
+      
       d3.select("#hider").style("z-index", 1);
       d3.select("#knnBarChart").style("z-index", 2);
 
       var data = [];
       var layout = [];
-      var kValuesLegend = [];
+      kValuesLegend = [];
       for (var i=1; i<=maxKNN; i++){
         kValuesLegend.push(i);
       }
       if (inside == 1){
         StoreInitialFindNearestTable = findNearestTable;
-      }
-
-        var trace1 = {
-          x: kValuesLegend, 
-          y: StoreInitialFindNearestTable, 
-          name: 'Projection average', 
-          type: 'bar',
-          marker: {
-            color: 'rgb(0,0,0)'
-          }
-        };
-        var trace2 = {
-          x: kValuesLegend, 
-          y: findNearestTable, 
-          name: 'Selected points', 
-          type: 'bar',
-          marker: {
-            color: 'rgb(0, 187, 187)'
-          }
-        };
-        var LimitXaxis = Number(maxKNN) + 1;
-        data = [trace1, trace2];
-        layout = {
-          barmode: 'group',autosize: false,
-          width: dimensions*0.97,
-          height: vh * 1.38,
-          margin: {
-            l: 50,
-            r: 30,
-            b: 30,
-            t: 5,
-            pad: 4
-          },
-          xaxis: {range: [0, LimitXaxis],
-            title: 'Number of neighbors',
-            titlefont: {
-              size: 12,
-              color: 'black'
-            }},
-          yaxis: {
-            title: 'Pres., %',
-            titlefont: {
-              size: 12,
-              color: 'black'
-            }}};
-        $("#knnBarChartDetails").html("(Number of Selected Points: "+howManyPoints+"/"+dataFeatures.length+")");
-        Plotly.newPlot('knnBarChart', data, layout, {displayModeBar:false}, {staticPlot: true});
-
+      }  
               
+      LineBar();
+
         // Here we have the code for the pcp
         d3.select("#PCP").selectAll('g').remove(); // Remove the pcp if there was one before
 
@@ -3300,7 +3264,7 @@ view.on("mouseleave", () => {
       tooltipComb = "-";
     }
     $group_tip.innerText = tooltipComb;
-  }
+  }    
 
   function showTooltip(mouse_position, datum) {
     let tooltip_width = 240;
@@ -3341,6 +3305,117 @@ view.on("mouseleave", () => {
   
 }
 
+function LineBar() {
+  // Get the checkbox
+  var NBViewOptions = document.getElementById("param-NB-view").value; // Get the threshold value with which the user set's the boundaries of the schema investigation
+  NBViewOptions = parseInt(NBViewOptions);
+  console.log(NBViewOptions);
+  // Get the output text
+
+  var viewport = getViewport(); // Get the main viewport width height
+  var vh = viewport[1] * 0.042;
+
+  if (NBViewOptions == 1){
+    var type = 'bar';
+  } else if (NBViewOptions == 2){
+    var type = 'line';
+  } else {
+    var type = 'difference';
+  }
+  var difference = [];
+  for (var i=0; i<StoreInitialFindNearestTable.length; i++){
+    difference.push(findNearestTable[i] - StoreInitialFindNearestTable[i]);
+  }
+
+  if (type == 'difference'){
+    var trace = {
+      x: kValuesLegend, 
+      y: difference, 
+      name: 'Average difference', 
+      showlegend:  true,
+      type: 'line',
+      marker: {
+        color: 'rgb(128,128,0)'
+      }
+    };
+    var LimitXaxis = Number(maxKNN) + 1;
+    data = [trace];
+    layout = {
+      barmode: 'group',autosize: false,
+      width: dimensions*0.97,
+      height: vh * 1.38,
+      margin: {
+        l: 50,
+        r: 30,
+        b: 30,
+        t: 5,
+        pad: 4
+      },
+      xaxis: {range: [0, LimitXaxis],
+        title: 'Number of neighbors',
+        titlefont: {
+          size: 12,
+          color: 'black'
+        }},
+      yaxis: {
+        title: '+/- Pres.',
+        titlefont: {
+          size: 12,
+          color: 'black'
+        }}};
+
+  Plotly.newPlot('knnBarChart', data, layout, {displayModeBar:false}, {staticPlot: true});
+  } else{
+    var trace1 = {
+      x: kValuesLegend, 
+      y: StoreInitialFindNearestTable, 
+      name: 'Projection average', 
+      type: type,
+      marker: {
+        color: 'rgb(0,0,0)'
+      }
+    };
+    var trace2 = {
+      x: kValuesLegend, 
+      y: findNearestTable, 
+      name: 'Selected points', 
+      type: type,
+      marker: {
+        color: 'rgb(0, 187, 187)'
+      }
+    };
+    var LimitXaxis = Number(maxKNN) + 1;
+    data = [trace1, trace2];
+    layout = {
+      barmode: 'group',autosize: false,
+      width: dimensions*0.97,
+      height: vh * 1.38,
+      margin: {
+        l: 50,
+        r: 30,
+        b: 30,
+        t: 5,
+        pad: 4
+      },
+      xaxis: {range: [0, LimitXaxis],
+        title: 'Number of neighbors',
+        titlefont: {
+          size: 12,
+          color: 'black'
+        }},
+      yaxis: {
+        title: 'Pres., %',
+        titlefont: {
+          size: 12,
+          color: 'black'
+        }}};
+
+  Plotly.newPlot('knnBarChart', data, layout, {displayModeBar:false}, {staticPlot: true});
+  }
+  $("#knnBarChartDetails").html("(Number of Selected Points: "+howManyPoints+"/"+dataFeatures.length+")");
+  // If the checkbox is checked, display the output text
+}
+ 
   function getViewport() { // Return the width and height of the main visualization
 
     var viewPortWidth;
diff --git a/modules/popper/popper.min.js b/modules/popper/popper.min.js
new file mode 100644
index 0000000..95e9ef5
--- /dev/null
+++ b/modules/popper/popper.min.js
@@ -0,0 +1,5 @@
+/*
+ Copyright (C) Federico Zivolo 2017
+ Distributed under the MIT License (license terms are at http://opensource.org/licenses/MIT).
+ */(function(e,t){'object'==typeof exports&&'undefined'!=typeof module?module.exports=t():'function'==typeof define&&define.amd?define(t):e.Popper=t()})(this,function(){'use strict';function e(e){return e&&'[object Function]'==={}.toString.call(e)}function t(e,t){if(1!==e.nodeType)return[];var o=window.getComputedStyle(e,null);return t?o[t]:o}function o(e){return'HTML'===e.nodeName?e:e.parentNode||e.host}function n(e){if(!e||-1!==['HTML','BODY','#document'].indexOf(e.nodeName))return window.document.body;var i=t(e),r=i.overflow,p=i.overflowX,s=i.overflowY;return /(auto|scroll)/.test(r+s+p)?e:n(o(e))}function r(e){var o=e&&e.offsetParent,i=o&&o.nodeName;return i&&'BODY'!==i&&'HTML'!==i?-1!==['TD','TABLE'].indexOf(o.nodeName)&&'static'===t(o,'position')?r(o):o:window.document.documentElement}function p(e){var t=e.nodeName;return'BODY'!==t&&('HTML'===t||r(e.firstElementChild)===e)}function s(e){return null===e.parentNode?e:s(e.parentNode)}function d(e,t){if(!e||!e.nodeType||!t||!t.nodeType)return window.document.documentElement;var o=e.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING,i=o?e:t,n=o?t:e,a=document.createRange();a.setStart(i,0),a.setEnd(n,0);var f=a.commonAncestorContainer;if(e!==f&&t!==f||i.contains(n))return p(f)?f:r(f);var l=s(e);return l.host?d(l.host,t):d(e,s(t).host)}function a(e){var t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:'top',o='top'===t?'scrollTop':'scrollLeft',i=e.nodeName;if('BODY'===i||'HTML'===i){var n=window.document.documentElement,r=window.document.scrollingElement||n;return r[o]}return e[o]}function f(e,t){var o=2<arguments.length&&void 0!==arguments[2]&&arguments[2],i=a(t,'top'),n=a(t,'left'),r=o?-1:1;return e.top+=i*r,e.bottom+=i*r,e.left+=n*r,e.right+=n*r,e}function l(e,t){var o='x'===t?'Left':'Top',i='Left'==o?'Right':'Bottom';return+e['border'+o+'Width'].split('px')[0]+ +e['border'+i+'Width'].split('px')[0]}function m(e,t,o,i){return _(t['offset'+e],o['client'+e],o['offset'+e],ie()?o['offset'+e]+i['margin'+('Height'===e?'Top':'Left')]+i['margin'+('Height'===e?'Bottom':'Right')]:0)}function h(){var e=window.document.body,t=window.document.documentElement,o=ie()&&window.getComputedStyle(t);return{height:m('Height',e,t,o),width:m('Width',e,t,o)}}function c(e){return se({},e,{right:e.left+e.width,bottom:e.top+e.height})}function g(e){var o={};if(ie())try{o=e.getBoundingClientRect();var i=a(e,'top'),n=a(e,'left');o.top+=i,o.left+=n,o.bottom+=i,o.right+=n}catch(e){}else o=e.getBoundingClientRect();var r={left:o.left,top:o.top,width:o.right-o.left,height:o.bottom-o.top},p='HTML'===e.nodeName?h():{},s=p.width||e.clientWidth||r.right-r.left,d=p.height||e.clientHeight||r.bottom-r.top,f=e.offsetWidth-s,m=e.offsetHeight-d;if(f||m){var g=t(e);f-=l(g,'x'),m-=l(g,'y'),r.width-=f,r.height-=m}return c(r)}function u(e,o){var i=ie(),r='HTML'===o.nodeName,p=g(e),s=g(o),d=n(e),a=t(o),l=+a.borderTopWidth.split('px')[0],m=+a.borderLeftWidth.split('px')[0],h=c({top:p.top-s.top-l,left:p.left-s.left-m,width:p.width,height:p.height});if(h.marginTop=0,h.marginLeft=0,!i&&r){var u=+a.marginTop.split('px')[0],b=+a.marginLeft.split('px')[0];h.top-=l-u,h.bottom-=l-u,h.left-=m-b,h.right-=m-b,h.marginTop=u,h.marginLeft=b}return(i?o.contains(d):o===d&&'BODY'!==d.nodeName)&&(h=f(h,o)),h}function b(e){var t=window.document.documentElement,o=u(e,t),i=_(t.clientWidth,window.innerWidth||0),n=_(t.clientHeight,window.innerHeight||0),r=a(t),p=a(t,'left'),s={top:r-o.top+o.marginTop,left:p-o.left+o.marginLeft,width:i,height:n};return c(s)}function y(e){var i=e.nodeName;return'BODY'===i||'HTML'===i?!1:'fixed'===t(e,'position')||y(o(e))}function w(e,t,i,r){var p={top:0,left:0},s=d(e,t);if('viewport'===r)p=b(s);else{var a;'scrollParent'===r?(a=n(o(e)),'BODY'===a.nodeName&&(a=window.document.documentElement)):'window'===r?a=window.document.documentElement:a=r;var f=u(a,s);if('HTML'===a.nodeName&&!y(s)){var l=h(),m=l.height,c=l.width;p.top+=f.top-f.marginTop,p.bottom=m+f.top,p.left+=f.left-f.marginLeft,p.right=c+f.left}else p=f}return p.left+=i,p.top+=i,p.right-=i,p.bottom-=i,p}function v(e){var t=e.width,o=e.height;return t*o}function E(e,t,o,i,n){var r=5<arguments.length&&void 0!==arguments[5]?arguments[5]:0;if(-1===e.indexOf('auto'))return e;var p=w(o,i,r,n),s={top:{width:p.width,height:t.top-p.top},right:{width:p.right-t.right,height:p.height},bottom:{width:p.width,height:p.bottom-t.bottom},left:{width:t.left-p.left,height:p.height}},d=Object.keys(s).map(function(e){return se({key:e},s[e],{area:v(s[e])})}).sort(function(e,t){return t.area-e.area}),a=d.filter(function(e){var t=e.width,i=e.height;return t>=o.clientWidth&&i>=o.clientHeight}),f=0<a.length?a[0].key:d[0].key,l=e.split('-')[1];return f+(l?'-'+l:'')}function x(e,t,o){var i=d(t,o);return u(o,i)}function O(e){var t=window.getComputedStyle(e),o=parseFloat(t.marginTop)+parseFloat(t.marginBottom),i=parseFloat(t.marginLeft)+parseFloat(t.marginRight),n={width:e.offsetWidth+i,height:e.offsetHeight+o};return n}function L(e){var t={left:'right',right:'left',bottom:'top',top:'bottom'};return e.replace(/left|right|bottom|top/g,function(e){return t[e]})}function S(e,t,o){o=o.split('-')[0];var i=O(e),n={width:i.width,height:i.height},r=-1!==['right','left'].indexOf(o),p=r?'top':'left',s=r?'left':'top',d=r?'height':'width',a=r?'width':'height';return n[p]=t[p]+t[d]/2-i[d]/2,n[s]=o===s?t[s]-i[a]:t[L(s)],n}function T(e,t){return Array.prototype.find?e.find(t):e.filter(t)[0]}function C(e,t,o){if(Array.prototype.findIndex)return e.findIndex(function(e){return e[t]===o});var i=T(e,function(e){return e[t]===o});return e.indexOf(i)}function N(t,o,i){var n=void 0===i?t:t.slice(0,C(t,'name',i));return n.forEach(function(t){t.function&&console.warn('`modifier.function` is deprecated, use `modifier.fn`!');var i=t.function||t.fn;t.enabled&&e(i)&&(o.offsets.popper=c(o.offsets.popper),o.offsets.reference=c(o.offsets.reference),o=i(o,t))}),o}function k(){if(!this.state.isDestroyed){var e={instance:this,styles:{},attributes:{},flipped:!1,offsets:{}};e.offsets.reference=x(this.state,this.popper,this.reference),e.placement=E(this.options.placement,e.offsets.reference,this.popper,this.reference,this.options.modifiers.flip.boundariesElement,this.options.modifiers.flip.padding),e.originalPlacement=e.placement,e.offsets.popper=S(this.popper,e.offsets.reference,e.placement),e.offsets.popper.position='absolute',e=N(this.modifiers,e),this.state.isCreated?this.options.onUpdate(e):(this.state.isCreated=!0,this.options.onCreate(e))}}function W(e,t){return e.some(function(e){var o=e.name,i=e.enabled;return i&&o===t})}function B(e){for(var t=[!1,'ms','Webkit','Moz','O'],o=e.charAt(0).toUpperCase()+e.slice(1),n=0;n<t.length-1;n++){var i=t[n],r=i?''+i+o:e;if('undefined'!=typeof window.document.body.style[r])return r}return null}function D(){return this.state.isDestroyed=!0,W(this.modifiers,'applyStyle')&&(this.popper.removeAttribute('x-placement'),this.popper.style.left='',this.popper.style.position='',this.popper.style.top='',this.popper.style[B('transform')]=''),this.disableEventListeners(),this.options.removeOnDestroy&&this.popper.parentNode.removeChild(this.popper),this}function H(e,t,o,i){var r='BODY'===e.nodeName,p=r?window:e;p.addEventListener(t,o,{passive:!0}),r||H(n(p.parentNode),t,o,i),i.push(p)}function P(e,t,o,i){o.updateBound=i,window.addEventListener('resize',o.updateBound,{passive:!0});var r=n(e);return H(r,'scroll',o.updateBound,o.scrollParents),o.scrollElement=r,o.eventsEnabled=!0,o}function A(){this.state.eventsEnabled||(this.state=P(this.reference,this.options,this.state,this.scheduleUpdate))}function M(e,t){return window.removeEventListener('resize',t.updateBound),t.scrollParents.forEach(function(e){e.removeEventListener('scroll',t.updateBound)}),t.updateBound=null,t.scrollParents=[],t.scrollElement=null,t.eventsEnabled=!1,t}function I(){this.state.eventsEnabled&&(window.cancelAnimationFrame(this.scheduleUpdate),this.state=M(this.reference,this.state))}function R(e){return''!==e&&!isNaN(parseFloat(e))&&isFinite(e)}function U(e,t){Object.keys(t).forEach(function(o){var i='';-1!==['width','height','top','right','bottom','left'].indexOf(o)&&R(t[o])&&(i='px'),e.style[o]=t[o]+i})}function Y(e,t){Object.keys(t).forEach(function(o){var i=t[o];!1===i?e.removeAttribute(o):e.setAttribute(o,t[o])})}function F(e,t,o){var i=T(e,function(e){var o=e.name;return o===t}),n=!!i&&e.some(function(e){return e.name===o&&e.enabled&&e.order<i.order});if(!n){var r='`'+t+'`';console.warn('`'+o+'`'+' modifier is required by '+r+' modifier in order to work, be sure to include it before '+r+'!')}return n}function j(e){return'end'===e?'start':'start'===e?'end':e}function K(e){var t=1<arguments.length&&void 0!==arguments[1]&&arguments[1],o=ae.indexOf(e),i=ae.slice(o+1).concat(ae.slice(0,o));return t?i.reverse():i}function q(e,t,o,i){var n=e.match(/((?:\-|\+)?\d*\.?\d*)(.*)/),r=+n[1],p=n[2];if(!r)return e;if(0===p.indexOf('%')){var s;switch(p){case'%p':s=o;break;case'%':case'%r':default:s=i;}var d=c(s);return d[t]/100*r}if('vh'===p||'vw'===p){var a;return a='vh'===p?_(document.documentElement.clientHeight,window.innerHeight||0):_(document.documentElement.clientWidth,window.innerWidth||0),a/100*r}return r}function G(e,t,o,i){var n=[0,0],r=-1!==['right','left'].indexOf(i),p=e.split(/(\+|\-)/).map(function(e){return e.trim()}),s=p.indexOf(T(p,function(e){return-1!==e.search(/,|\s/)}));p[s]&&-1===p[s].indexOf(',')&&console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.');var d=/\s*,\s*|\s+/,a=-1===s?[p]:[p.slice(0,s).concat([p[s].split(d)[0]]),[p[s].split(d)[1]].concat(p.slice(s+1))];return a=a.map(function(e,i){var n=(1===i?!r:r)?'height':'width',p=!1;return e.reduce(function(e,t){return''===e[e.length-1]&&-1!==['+','-'].indexOf(t)?(e[e.length-1]=t,p=!0,e):p?(e[e.length-1]+=t,p=!1,e):e.concat(t)},[]).map(function(e){return q(e,n,t,o)})}),a.forEach(function(e,t){e.forEach(function(o,i){R(o)&&(n[t]+=o*('-'===e[i-1]?-1:1))})}),n}for(var z=Math.min,V=Math.floor,_=Math.max,X=['native code','[object MutationObserverConstructor]'],Q=function(e){return X.some(function(t){return-1<(e||'').toString().indexOf(t)})},J='undefined'!=typeof window,Z=['Edge','Trident','Firefox'],$=0,ee=0;ee<Z.length;ee+=1)if(J&&0<=navigator.userAgent.indexOf(Z[ee])){$=1;break}var i,te=J&&Q(window.MutationObserver),oe=te?function(e){var t=!1,o=0,i=document.createElement('span'),n=new MutationObserver(function(){e(),t=!1});return n.observe(i,{attributes:!0}),function(){t||(t=!0,i.setAttribute('x-index',o),++o)}}:function(e){var t=!1;return function(){t||(t=!0,setTimeout(function(){t=!1,e()},$))}},ie=function(){return void 0==i&&(i=-1!==navigator.appVersion.indexOf('MSIE 10')),i},ne=function(e,t){if(!(e instanceof t))throw new TypeError('Cannot call a class as a function')},re=function(){function e(e,t){for(var o,n=0;n<t.length;n++)o=t[n],o.enumerable=o.enumerable||!1,o.configurable=!0,'value'in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}return function(t,o,i){return o&&e(t.prototype,o),i&&e(t,i),t}}(),pe=function(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e},se=Object.assign||function(e){for(var t,o=1;o<arguments.length;o++)for(var i in t=arguments[o],t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},de=['auto-start','auto','auto-end','top-start','top','top-end','right-start','right','right-end','bottom-end','bottom','bottom-start','left-end','left','left-start'],ae=de.slice(3),fe={FLIP:'flip',CLOCKWISE:'clockwise',COUNTERCLOCKWISE:'counterclockwise'},le=function(){function t(o,i){var n=this,r=2<arguments.length&&void 0!==arguments[2]?arguments[2]:{};ne(this,t),this.scheduleUpdate=function(){return requestAnimationFrame(n.update)},this.update=oe(this.update.bind(this)),this.options=se({},t.Defaults,r),this.state={isDestroyed:!1,isCreated:!1,scrollParents:[]},this.reference=o.jquery?o[0]:o,this.popper=i.jquery?i[0]:i,this.options.modifiers={},Object.keys(se({},t.Defaults.modifiers,r.modifiers)).forEach(function(e){n.options.modifiers[e]=se({},t.Defaults.modifiers[e]||{},r.modifiers?r.modifiers[e]:{})}),this.modifiers=Object.keys(this.options.modifiers).map(function(e){return se({name:e},n.options.modifiers[e])}).sort(function(e,t){return e.order-t.order}),this.modifiers.forEach(function(t){t.enabled&&e(t.onLoad)&&t.onLoad(n.reference,n.popper,n.options,t,n.state)}),this.update();var p=this.options.eventsEnabled;p&&this.enableEventListeners(),this.state.eventsEnabled=p}return re(t,[{key:'update',value:function(){return k.call(this)}},{key:'destroy',value:function(){return D.call(this)}},{key:'enableEventListeners',value:function(){return A.call(this)}},{key:'disableEventListeners',value:function(){return I.call(this)}}]),t}();return le.Utils=('undefined'==typeof window?global:window).PopperUtils,le.placements=de,le.Defaults={placement:'bottom',eventsEnabled:!0,removeOnDestroy:!1,onCreate:function(){},onUpdate:function(){},modifiers:{shift:{order:100,enabled:!0,fn:function(e){var t=e.placement,o=t.split('-')[0],i=t.split('-')[1];if(i){var n=e.offsets,r=n.reference,p=n.popper,s=-1!==['bottom','top'].indexOf(o),d=s?'left':'top',a=s?'width':'height',f={start:pe({},d,r[d]),end:pe({},d,r[d]+r[a]-p[a])};e.offsets.popper=se({},p,f[i])}return e}},offset:{order:200,enabled:!0,fn:function(e,t){var o,i=t.offset,n=e.placement,r=e.offsets,p=r.popper,s=r.reference,d=n.split('-')[0];return o=R(+i)?[+i,0]:G(i,p,s,d),'left'===d?(p.top+=o[0],p.left-=o[1]):'right'===d?(p.top+=o[0],p.left+=o[1]):'top'===d?(p.left+=o[0],p.top-=o[1]):'bottom'===d&&(p.left+=o[0],p.top+=o[1]),e.popper=p,e},offset:0},preventOverflow:{order:300,enabled:!0,fn:function(e,t){var o=t.boundariesElement||r(e.instance.popper);e.instance.reference===o&&(o=r(o));var i=w(e.instance.popper,e.instance.reference,t.padding,o);t.boundaries=i;var n=t.priority,p=e.offsets.popper,s={primary:function(e){var o=p[e];return p[e]<i[e]&&!t.escapeWithReference&&(o=_(p[e],i[e])),pe({},e,o)},secondary:function(e){var o='right'===e?'left':'top',n=p[o];return p[e]>i[e]&&!t.escapeWithReference&&(n=z(p[o],i[e]-('right'===e?p.width:p.height))),pe({},o,n)}};return n.forEach(function(e){var t=-1===['left','top'].indexOf(e)?'secondary':'primary';p=se({},p,s[t](e))}),e.offsets.popper=p,e},priority:['left','right','top','bottom'],padding:5,boundariesElement:'scrollParent'},keepTogether:{order:400,enabled:!0,fn:function(e){var t=e.offsets,o=t.popper,i=t.reference,n=e.placement.split('-')[0],r=V,p=-1!==['top','bottom'].indexOf(n),s=p?'right':'bottom',d=p?'left':'top',a=p?'width':'height';return o[s]<r(i[d])&&(e.offsets.popper[d]=r(i[d])-o[a]),o[d]>r(i[s])&&(e.offsets.popper[d]=r(i[s])),e}},arrow:{order:500,enabled:!0,fn:function(e,t){if(!F(e.instance.modifiers,'arrow','keepTogether'))return e;var o=t.element;if('string'==typeof o){if(o=e.instance.popper.querySelector(o),!o)return e;}else if(!e.instance.popper.contains(o))return console.warn('WARNING: `arrow.element` must be child of its popper element!'),e;var i=e.placement.split('-')[0],n=e.offsets,r=n.popper,p=n.reference,s=-1!==['left','right'].indexOf(i),d=s?'height':'width',a=s?'top':'left',f=s?'left':'top',l=s?'bottom':'right',m=O(o)[d];p[l]-m<r[a]&&(e.offsets.popper[a]-=r[a]-(p[l]-m)),p[a]+m>r[l]&&(e.offsets.popper[a]+=p[a]+m-r[l]);var h=p[a]+p[d]/2-m/2,g=h-c(e.offsets.popper)[a];return g=_(z(r[d]-m,g),0),e.arrowElement=o,e.offsets.arrow={},e.offsets.arrow[a]=Math.round(g),e.offsets.arrow[f]='',e},element:'[x-arrow]'},flip:{order:600,enabled:!0,fn:function(e,t){if(W(e.instance.modifiers,'inner'))return e;if(e.flipped&&e.placement===e.originalPlacement)return e;var o=w(e.instance.popper,e.instance.reference,t.padding,t.boundariesElement),i=e.placement.split('-')[0],n=L(i),r=e.placement.split('-')[1]||'',p=[];switch(t.behavior){case fe.FLIP:p=[i,n];break;case fe.CLOCKWISE:p=K(i);break;case fe.COUNTERCLOCKWISE:p=K(i,!0);break;default:p=t.behavior;}return p.forEach(function(s,d){if(i!==s||p.length===d+1)return e;i=e.placement.split('-')[0],n=L(i);var a=e.offsets.popper,f=e.offsets.reference,l=V,m='left'===i&&l(a.right)>l(f.left)||'right'===i&&l(a.left)<l(f.right)||'top'===i&&l(a.bottom)>l(f.top)||'bottom'===i&&l(a.top)<l(f.bottom),h=l(a.left)<l(o.left),c=l(a.right)>l(o.right),g=l(a.top)<l(o.top),u=l(a.bottom)>l(o.bottom),b='left'===i&&h||'right'===i&&c||'top'===i&&g||'bottom'===i&&u,y=-1!==['top','bottom'].indexOf(i),w=!!t.flipVariations&&(y&&'start'===r&&h||y&&'end'===r&&c||!y&&'start'===r&&g||!y&&'end'===r&&u);(m||b||w)&&(e.flipped=!0,(m||b)&&(i=p[d+1]),w&&(r=j(r)),e.placement=i+(r?'-'+r:''),e.offsets.popper=se({},e.offsets.popper,S(e.instance.popper,e.offsets.reference,e.placement)),e=N(e.instance.modifiers,e,'flip'))}),e},behavior:'flip',padding:5,boundariesElement:'viewport'},inner:{order:700,enabled:!1,fn:function(e){var t=e.placement,o=t.split('-')[0],i=e.offsets,n=i.popper,r=i.reference,p=-1!==['left','right'].indexOf(o),s=-1===['top','left'].indexOf(o);return n[p?'left':'top']=r[t]-(s?n[p?'width':'height']:0),e.placement=L(t),e.offsets.popper=c(n),e}},hide:{order:800,enabled:!0,fn:function(e){if(!F(e.instance.modifiers,'hide','preventOverflow'))return e;var t=e.offsets.reference,o=T(e.instance.modifiers,function(e){return'preventOverflow'===e.name}).boundaries;if(t.bottom<o.top||t.left>o.right||t.top>o.bottom||t.right<o.left){if(!0===e.hide)return e;e.hide=!0,e.attributes['x-out-of-boundaries']=''}else{if(!1===e.hide)return e;e.hide=!1,e.attributes['x-out-of-boundaries']=!1}return e}},computeStyle:{order:850,enabled:!0,fn:function(e,t){var o=t.x,i=t.y,n=e.offsets.popper,p=T(e.instance.modifiers,function(e){return'applyStyle'===e.name}).gpuAcceleration;void 0!==p&&console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!');var s,d,a=void 0===p?t.gpuAcceleration:p,f=r(e.instance.popper),l=g(f),m={position:n.position},h={left:V(n.left),top:V(n.top),bottom:V(n.bottom),right:V(n.right)},c='bottom'===o?'top':'bottom',u='right'===i?'left':'right',b=B('transform');if(d='bottom'==c?-l.height+h.bottom:h.top,s='right'==u?-l.width+h.right:h.left,a&&b)m[b]='translate3d('+s+'px, '+d+'px, 0)',m[c]=0,m[u]=0,m.willChange='transform';else{var y='bottom'==c?-1:1,w='right'==u?-1:1;m[c]=d*y,m[u]=s*w,m.willChange=c+', '+u}var v={"x-placement":e.placement};return e.attributes=se({},v,e.attributes),e.styles=se({},m,e.styles),e},gpuAcceleration:!0,x:'bottom',y:'right'},applyStyle:{order:900,enabled:!0,fn:function(e){return U(e.instance.popper,e.styles),Y(e.instance.popper,e.attributes),e.offsets.arrow&&U(e.arrowElement,e.offsets.arrow),e},onLoad:function(e,t,o,i,n){var r=x(n,t,e),p=E(o.placement,r,t,e,o.modifiers.flip.boundariesElement,o.modifiers.flip.padding);return t.setAttribute('x-placement',p),U(t,{position:'absolute'}),o},gpuAcceleration:void 0}}},le});
+//# sourceMappingURL=popper.min.js.map