Grigoriy Petukhov avatar Grigoriy Petukhov committed ba9870b

auto calculation feature

Comments (0)

Files changed (3)

 
         #map {
             position: relative;
-            width: 100%;
+            width: 500px;
             height: 90%;
         }
     </style>
 <script src="static/bootstrap/js/bootstrap.min.js"></script>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
 <script type="text/javascript" src="static/jsplumb-1.3.16/js/jquery.jsPlumb-1.3.16-all.js"></script>
-<script type="text/javascript" src="util.js"></script>
+<script type="text/javascript" src="static/js/util.js"></script>
 </head>
 <body>
 <div class="navbar navbar-inverse navbar-fixed-top">
             <a class="brand" href="#">Javascript Page Rank</a>
             <div class="nav-collapse collapse">
                 <ul class="nav">
+                    <li class="divider-vertical"></li>
+                    <li><a href="http://gpetukhov.com">&copy; Gregory Petukhov</a></li>
                 </ul>
             </div>
         </div>
             <br/>
             <br/>
             <button class="btn btn-success" onclick="calculatePageRank()">Calculate PR</button>
+            <br/>
+            <br/>
+            <button class="btn btn-warning" onclick="resetAll()">Reset All</button>
+            <br/><br/>
+            <form>
+                <label class="checkbox">
+                    <input checked="checked" name="auto-calc" type="checkbox" /> Auto Calculation
+                </label>
+            </form>
             <h3>Links</h3>
             <ul id="page-link-list" class="unstyled">
             </ul>
         </div>
-        <div class="span2">
+        <div class="span8">
             <div id="map">
             </div>
+            &nbsp;
+        </div>
+        <div class="span2">
+            <h3>Credits</h3>
+            <ul class="unstyled">
+                <li><a href="http://twitter.github.com/bootstrap/index.html">Twitter Bootstrap</a></li>
+                <li><a href="http://jsplumb.org/">jsPlumb</a></li>
+                <li><a href="http://jquery.org/">jQuery</a></li>
+            </ul>
         </div>
     </div>
 </div>

static/js/util.js

+var pageRegistry = {}
+var pageCounter = 0;
+var connections = {};
+var initialOffset = [0, 0];
+
+//function getRandomInt(min, max) {
+  //return Math.floor(Math.random() * (max - min + 1)) + min;
+//}
+
+function makeConnection(res) {
+    var cid = res.sourceId + res.targetId;
+    if (typeof(connections[cid]) != "undefined") {
+        alert('Such connection already exists');
+    } else {
+        connections[cid] = {'src': res.sourceId, 'dst': res.targetId}
+        var page = pageRegistry[res.sourceId];
+        page.links[page.links.length] = res.targetId;
+        refreshSidebarLinks();
+        if (typeof(connections[res.targetId + res.sourceId]) != "undefined") {
+            var color = '#c33';
+        } else {
+            var color = '#33c';
+        }
+        jsPlumb.connect({
+            source: res.sourceId,
+            target: res.targetId,
+            anchor: 'Continuous',
+            overlays: [
+                ['Arrow', {'location': 1}],
+            ],
+            paintStyle: {strokeStyle: color, lineWidth: 3},
+            endpointStyle: {fillStyle: '#c33', radius: 3},
+        });
+
+        if ($('input[name="auto-calc"]:checked').length) {
+            calculatePageRank();
+        }
+
+    }
+}
+
+function createNewPage() {
+    pageCounter += 1;
+
+    var pid = 'page' + pageCounter;
+    var page = {id: pid, links: []};
+    pageRegistry[page.id] = page;
+
+    var node = $(
+        '<div class="box" id="' + page.id + '">' + 
+        '<span class="name">' + pid + '</span>' + 
+        '<span class="pr">1<span>' + 
+        '</div>'
+    );
+    node.css('left', initialOffset[0]);
+    node.css('top', initialOffset[1]);
+    initialOffset[0] += 20;
+    initialOffset[1] += 20;
+
+    $('#map').append(node);
+    page.node = node;
+    jsPlumb.draggable(pid);
+
+    var options = {
+        isSource: true,
+        isTarget: true,
+        paintStyle: {
+            radius: 10,
+            fillStyle: '#666',
+        },
+        anchor: [0.9, 0.5, 0, 0],
+        beforeDrop: function(res) {
+            makeConnection(res);
+        },
+    }
+    var ep = jsPlumb.addEndpoint(pid, options); 
+
+    return page;
+}
+
+function refreshSidebarLinks() {
+    var lst = $('#page-link-list').empty();
+    for(pid in pageRegistry) {
+        var page = pageRegistry[pid];
+        if (page.links.length) {
+            lst.append($('<li>' + pid + '</li>'));
+            $.each(page.links, function(idx, link_id) {
+                lst.append($('<li> &rarr;' + link_id + '</li>'));
+            });
+        }
+    }
+}
+
+function calculatePageRank() {
+    var D = 0.85
+
+    $.each(pageRegistry, function(pid, page) {
+        page.rank = 1;
+        page.rank_new = 0;
+    });
+
+    for(var x=0; x<5; x++) {
+        $.each(pageRegistry, function(pid, page) {
+            if (page.links.length) {
+                var rank_share = page.rank / page.links.length;
+                $.each(page.links, function(idx, link_id) {
+                    var dst = pageRegistry[link_id];
+                    dst.rank_new += rank_share;
+                });
+            }
+        });
+        $.each(pageRegistry, function(pid, page) {
+            page.rank = (1- D) + D * page.rank_new;
+            page.rank_new = 0;
+        });
+    }
+    $.each(pageRegistry, function(pid, page) {
+        page.rank = Math.round(page.rank * 1000)/1000;
+    });
+    refreshPageInfo();
+}
+
+function refreshPageInfo() {
+    $.each(pageRegistry, function(pid, page) {
+        var node = $('#' + pid);
+        node.find('.pr').text(page.rank);
+    });
+}
+
+function resetAll() {
+    $.each(pageRegistry, function(pid, page) {
+        jsPlumb.deleteEveryEndpoint(pid);
+        $('#' + pid).remove();
+    });
+    pageRegistry = {}
+    pageCounter = 0;
+    connections = {};
+    initialOffset = [0, 0];
+}
+
+$(function() {
+    p1 = createNewPage();
+    p2 = createNewPage();
+    makeConnection({'sourceId': p1.id, 'targetId': p2.id})
+    calculatePageRank();
+});

util.js

-var pageRegistry = {}
-var pageCounter = 0;
-var connections = {};
-var initialOffset = [0, 0];
-
-//function getRandomInt(min, max) {
-  //return Math.floor(Math.random() * (max - min + 1)) + min;
-//}
-
-function makeConnection(res) {
-    var cid = res.sourceId + res.targetId;
-    if (typeof(connections[cid]) != "undefined") {
-        alert('Such connection already exists');
-    } else {
-        connections[cid] = {'src': res.sourceId, 'dst': res.targetId}
-        var page = pageRegistry[res.sourceId];
-        page.links[page.links.length] = res.targetId;
-        refreshSidebarLinks();
-        if (typeof(connections[res.targetId + res.sourceId]) != "undefined") {
-            var color = '#c33';
-        } else {
-            var color = '#33c';
-        }
-        jsPlumb.connect({
-            source: res.sourceId,
-            target: res.targetId,
-            anchor: 'Continuous',
-            overlays: [
-                ['Arrow', {'location': 1}],
-            ],
-            paintStyle: {strokeStyle: color, lineWidth: 3},
-            endpointStyle: {fillStyle: '#c33', radius: 3},
-        });
-    }
-}
-
-function createNewPage() {
-    pageCounter += 1;
-
-    var pid = 'page' + pageCounter;
-    var page = {id: pid, links: []};
-    pageRegistry[page.id] = page;
-
-    var node = $(
-        '<div class="box" id="' + page.id + '">' + 
-        '<span class="name">' + pid + '</span>' + 
-        '<span class="pr">1<span>' + 
-        '</div>'
-    );
-    node.css('left', initialOffset[0]);
-    node.css('top', initialOffset[1]);
-    initialOffset[0] += 20;
-    initialOffset[1] += 20;
-
-    $('#map').append(node);
-    page.node = node;
-    jsPlumb.draggable(pid);
-
-    var options = {
-        isSource: true,
-        isTarget: true,
-        paintStyle: {
-            radius: 10,
-            fillStyle: '#666',
-        },
-        anchor: [0.9, 0.5, 0, 0],
-        beforeDrop: function(res) {
-            makeConnection(res);
-        },
-    }
-    var ep = jsPlumb.addEndpoint(pid, options); 
-
-    return page;
-}
-
-function refreshSidebarLinks() {
-    var lst = $('#page-link-list').empty();
-    for(pid in pageRegistry) {
-        var page = pageRegistry[pid];
-        if (page.links.length) {
-            lst.append($('<li>' + pid + '</li>'));
-            $.each(page.links, function(idx, link_id) {
-                lst.append($('<li> &rarr;' + link_id + '</li>'));
-            });
-        }
-    }
-}
-
-function calculatePageRank() {
-    var D = 0.85
-
-    $.each(pageRegistry, function(pid, page) {
-        page.rank = 1;
-        page.rank_new = 0;
-    });
-
-    for(var x=0; x<1; x++) {
-        $.each(pageRegistry, function(pid, page) {
-            if (page.links.length) {
-                var rank_share = page.rank / page.links.length;
-                $.each(page.links, function(idx, link_id) {
-                    var dst = pageRegistry[link_id];
-                    dst.rank_new += rank_share;
-                });
-            }
-        });
-        $.each(pageRegistry, function(pid, page) {
-            page.rank = (1- D) + D * page.rank_new;
-            page.rank_new = 0;
-        });
-    }
-    $.each(pageRegistry, function(pid, page) {
-        page.rank = Math.round(page.rank * 1000)/1000;
-    });
-    refreshPageInfo();
-}
-
-function refreshPageInfo() {
-    $.each(pageRegistry, function(pid, page) {
-        var node = $('#' + pid);
-        node.find('.pr').text(page.rank);
-    });
-}
-
-$(function() {
-    p1 = createNewPage();
-    p2 = createNewPage();
-    makeConnection({'sourceId': p1.id, 'targetId': p2.id})
-    calculatePageRank();
-});
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.