sandbox/wireit-layout/examples/spring_layout.html from neyric/wireit

sandbox/wireit-layout/examples/spring_layout.html
Summary

Maintainability

Test Coverage

Issues
<?xml version="1.0" encoding="UTF-8"?>
<html>
 <head>
  <title>WireIt Example, Spring model layout</title>
  
  
<!-- YUI -->
<link rel="stylesheet" href="https://yui-s.yahooapis.com/combo?3.6.0/build/cssreset/reset-min.css&3.6.0/build/cssfonts/fonts-min.css">
<script src="https://yui-s.yahooapis.com/3.6.0/build/yui/yui.js"></script>
  
<script type="text/javascript" src="../../../lib/excanvas.js"></script>


<!-- WireIt -->
<script type="text/javascript" src="../../../build/wireit-min.js"></script>
<!-- Animation plugin -->
<script type="text/javascript" src="../../../js/Anim.js"></script>
<!-- WireIt Layout plugin -->
<script type="text/javascript" src="../js/Layout.js"></script>

<link rel="stylesheet" type="text/css" href="../../../assets/WireIt.css" />

<style>

div.WireIt-Terminal {
    background-image: none;
    width: 0px;
    height: 0px;
}

div.WireIt-Container {
    width: 90px
}

</style>

<script>

var layer = null;

window.onload = function() {
    
    
    var nodes = [
                    "WireIt", // 0
                    "librairies", "inputEx", "YUI", "excanvas",  // 1, 2, 3, 4
                     "classes", "Wire", "Terminal", "Container", "Layer", "WiringEditor", // 5, 6, 7, 8, 9, 10
                    "modules", "editor", "inputex", "labels", "layout", "composable", "grouping" // 11, 12, 13, 14, 15,16,17
                ];
    var wires = [ 
                  [0,1], [1,2], [1,3], [2,3], [1,4], // librairies
                   [0,5], [5,6], [5,7], [5,8], [5,9], [5,10], // classes
                    [0, 11], [11, 12], [11, 13], [11, 14], [11, 15], [11, 16], [11, 17]
                 ];
    
    layer = new Y.Layer({});
    for(var i = 0 ; i < nodes.length ; i++) {
        layer.addContainer({
            terminals: [ { offsetPosition: {top: 5, left: 25}, editable: false }],
            title: nodes[i],
            position: [ Math.floor(Math.random()*800)+30, Math.floor(Math.random()*300)+30 ],
            close: false
        });
    }
    for(var i = 0 ; i < wires.length ; i++) {
        var wc = wires[i];
        layer.addWire({
            src: {moduleId: wc[0], terminalId: 0},
            tgt: {moduleId: wc[1], terminalId: 0},
            xtype: "Y.Wire"
        });
    }
    
    layer.startDynamicLayout();
    
    // For example with animation
    /*setInterval(function() {
        var c = layer.containers[0];
        var anim = new Y.Anim( {
          node: c.el, 
          to: {  left: 500 , top: 200}, 
          duration: 1
        });
        anim.on('tween', function() {
          Y.Array.each(c.terminals, function(t) {
              t.redrawAllWires();
            });
       });
        anim.run();
        layer.dynamicLayout.init();
    }, 5000);*/
    
};


</script>

 </head>
 <body>
 </body>
</html>