Merge pull request #61 from iVis-at-Bilkent/unstable

Merge unstable to master
iVis-at-Bilkent · Jan 17, 2023 · ba864c9 · ba864c9
2 parents 90b627e + d278fca
commit ba864c9
Show file tree

Hide file tree

Showing 11 changed files with 505 additions and 16,144 deletions.
diff --git a/README.md b/README.md
@@ -9,9 +9,9 @@ fCoSE (pron. "f-cosay", **f**ast **Co**mpound **S**pring **E**mbedder), is a fas
 
 Here are some demos: **simple**, **compound**, and **constraints**, respectively:
 <p align="center">
-<a href="https://ivis-at-bilkent.github.io/cytoscape.js-fcose/demo/demo.html" title="Simple"><img src="https://www.cs.bilkent.edu.tr/~ivis/images/demo1.png" height=42px></a> &emsp;
-<a href="https://ivis-at-bilkent.github.io/cytoscape.js-fcose/demo/demo-compound.html" title="Compound"><img src="https://www.cs.bilkent.edu.tr/~ivis/images/demo2.png" height=42px></a> &emsp;
-<a href="https://ivis-at-bilkent.github.io/cytoscape.js-fcose/demo/demo-constraint.html" title="Constraints"><img src="https://www.cs.bilkent.edu.tr/~ivis/images/demo3.png" height=42px></a>
+<a href="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-fcose/unstable/demo/demo.html" title="Simple"><img src="https://www.cs.bilkent.edu.tr/~ivis/images/demo1.png" height=42px></a> &emsp;
+<a href="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-fcose/unstable/demo/demo-compound.html" title="Compound"><img src="https://www.cs.bilkent.edu.tr/~ivis/images/demo2.png" height=42px></a> &emsp;
+<a href="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-fcose/unstable/demo/demo-constraint.html" title="Constraints"><img src="https://www.cs.bilkent.edu.tr/~ivis/images/demo3.png" height=42px></a>
 </p>
 
 fCoSE layout algorithm combines the speed of spectral layout with the aesthetics of force-directed layout. fCoSE runs up to 2 times as fast as CoSE while achieving similar aesthetics.
@@ -163,7 +163,14 @@ var defaultOptions = {
   // Maximum number of iterations to perform - this is a suggested value and might be adjusted by the algorithm as required
   numIter: 2500,
   // For enabling tiling
-  tile: true,  
+  tile: true,
+  // The comparison function to be used while sorting nodes during tiling operation.
+  // Takes the ids of 2 nodes that will be compared as a parameter and the default tiling operation is performed when this option is not set.
+  // It works similar to ``compareFunction`` parameter of ``Array.prototype.sort()``
+  // If node1 is less then node2 by some ordering criterion ``tilingCompareBy(nodeId1, nodeId2)`` must return a negative value
+  // If node1 is greater then node2 by some ordering criterion ``tilingCompareBy(nodeId1, nodeId2)`` must return a positive value
+  // If node1 is equal to node2 by some ordering criterion ``tilingCompareBy(nodeId1, nodeId2)`` must return 0
+  tilingCompareBy: undefined, 
   // Represents the amount of the vertical space to put between the zero degree members during the tiling operation(can also be a function)
   tilingPaddingVertical: 10,
   // Represents the amount of the horizontal space to put between the zero degree members during the tiling operation(can also be a function)

diff --git a/cytoscape-fcose.js b/cytoscape-fcose.js
diff --git a/demo/demo-compound.html b/demo/demo-compound.html
@@ -14,9 +14,9 @@
       <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">       
 
       <script src="https://unpkg.com/cytoscape/dist/cytoscape.min.js"></script>
-      <script src="https://unpkg.com/layout-base/layout-base.js"></script>
-      <script src="https://unpkg.com/cose-base/cose-base.js"></script>
-      <script src="https://unpkg.com/cytoscape-layout-utilities/cytoscape-layout-utilities.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/layout-base/unstable/layout-base.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/cose-base/unstable/cose-base.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-layout-utilities/unstable/cytoscape-layout-utilities.js"></script>
 
       <!-- for testing with local version of cytoscape.js -->
       <!--<script src="../cytoscape.js/build/cytoscape.js"></script>-->
@@ -308,6 +308,7 @@
               randomize: !(document.getElementById("randomize").checked),
               animate: document.getElementById("animate").checked,
               animationEasing: 'ease-out',
+              fit: document.getElementById("fit").checked,
               uniformNodeDimensions: document.getElementById("uniformNodeDimensions").checked,
               packComponents: document.getElementById("packComponents").checked,
               tile: document.getElementById("tile").checked,
@@ -369,6 +370,15 @@ <h1 class="ml-2">cytoscape-fcose demo (compound)</h1>
                     </div>                  
                   </td>
                 </tr>
+                <tr>
+                  <td><span class="add-on layout-text" title="Whether to fit the viewport to the repositioned nodes"> Fit </span></td>
+                  <td>
+                    <div class="custom-control custom-control-inline custom-checkbox">
+                      <input type="checkbox" class="custom-control-input" id="fit" name="fit" checked>
+                      <label class="custom-control-label" for="fit"></label>
+                    </div>
+                  </td>
+                </tr>
                 <tr>
                   <td><span class="add-on layout-text" title="Whether nodes are of uniform dimensions"> Uniform Node Dimensions </span></td>
                   <td>

diff --git a/demo/demo-constraint.html b/demo/demo-constraint.html
@@ -16,8 +16,8 @@
 
       <!-- Cytoscape and fcose -->
       <script src="https://unpkg.com/cytoscape/dist/cytoscape.min.js"></script>
-      <script src="https://unpkg.com/layout-base/layout-base.js"></script> 
-      <script src="https://unpkg.com/cose-base/cose-base.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/layout-base/unstable/layout-base.js"></script> 
+      <script src="https://raw.githack.com/iVis-at-Bilkent/cose-base/unstable/cose-base.js"></script>
       <script src="../cytoscape-fcose.js"></script>
 
       <script src="demo-constraint-control.js" defer></script>
@@ -26,7 +26,7 @@
       <!-- <script src="https://unpkg.com/webcola/WebCola/cola.min.js"></script> -->
       <!-- <script src="cytoscape-cola.js"></script> -->      
 
-      <script src="https://unpkg.com/cytoscape-layout-utilities/cytoscape-layout-utilities.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-layout-utilities/unstable/cytoscape-layout-utilities.js"></script>
       <script src="https://unpkg.com/cytoscape-view-utilities/cytoscape-view-utilities.js"></script>
       <script src="https://unpkg.com/cytoscape-graphml/cytoscape-graphml.js"></script>  <!-- graphml - for demo purpose only--> 	
       <!-- <script src="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-layvo/unstable/cytoscape-layvo.js"></script> -->  <!-- For quality metrics -->

diff --git a/demo/demo.html b/demo/demo.html
@@ -14,9 +14,9 @@
       <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">      
 
       <script src="https://unpkg.com/cytoscape/dist/cytoscape.min.js"></script>
-      <script src="https://unpkg.com/layout-base/layout-base.js"></script>
-      <script src="https://unpkg.com/cose-base/cose-base.js"></script>
-      <script src="https://unpkg.com/cytoscape-layout-utilities/cytoscape-layout-utilities.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/layout-base/unstable/layout-base.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/cose-base/unstable/cose-base.js"></script>
+      <script src="https://raw.githack.com/iVis-at-Bilkent/cytoscape.js-layout-utilities/unstable/cytoscape-layout-utilities.js"></script>
 
       <!-- for testing with local version of cytoscape.js -->
       <!--<script src="../cytoscape.js/build/cytoscape.js"></script>-->
@@ -300,6 +300,7 @@
               randomize: !(document.getElementById("randomize").checked),
               animate: document.getElementById("animate").checked,
               animationEasing: 'ease-out',
+              fit: document.getElementById("fit").checked,
               uniformNodeDimensions: document.getElementById("uniformNodeDimensions").checked,
               packComponents: document.getElementById("packComponents").checked,
               tile: document.getElementById("tile").checked,
@@ -361,6 +362,15 @@ <h1 class="ml-2">cytoscape-fcose demo</h1>
                     </div>                  
                   </td>
                 </tr>
+                <tr>
+                  <td><span class="add-on layout-text" title="Whether to fit the viewport to the repositioned nodes"> Fit </span></td>
+                  <td>
+                    <div class="custom-control custom-control-inline custom-checkbox">
+                      <input type="checkbox" class="custom-control-input" id="fit" name="fit" checked>
+                      <label class="custom-control-label" for="fit"></label>
+                    </div>
+                  </td>
+                </tr>
                 <tr>
                   <td><span class="add-on layout-text" title="Whether nodes are of uniform dimensions"> Uniform Node Dimensions </span></td>
                   <td>