Akun FollowMap

// ==UserScript==
// Displayable Name of your script
// @name           Akun FollowMap

// Brief description
// @description    Playing around with svgs and data

// Version Number
// @version        1

// @include          https://anonkun.com/user
// @include          http://anonkun.com/user

//@require           https://raw.githubusercontent.com/adobe-webplatform/Snap.svg/master/dist/snap.svg-min.js

// ==/UserScript==
console.log("Followmap active!");

$(document).ready(function(){
    $('body').children().remove(); // Clear the space
    $('head').after('<style type="text/css" id="FollowMap-css"></style>'); // Insert the FollowMap style element
    $('#FollowMap-css').append('g{opacity:1}html{overflow-y: auto;}.fullscreen{position: fixed; height:100%; width:100%;}#svg{position:relative; top:0px; left:0px; height:100px; width:100px; overflow:visible;}circle{fill: rgb(215, 109, 37); stroke: white; stroke-width: 1px}line{stroke: white; stroke-width: 1px}');
    $('body').append('<div class="fullscreen" style="display:flex; justify-content: center; align-items: center;"><form id="UsernameForm" onsubmit="return false;"><input id="UsernameInput" type="text" autofocus placeholder="Enter username" style="width:300px; height:31px;"></form></div>');
    $('#UsernameForm').on("submit", function(){
        var username = $('#UsernameInput')[0].value.toLowerCase();
        $.ajax({
            url: "http://anonkun.com/api/user/"+encodeURI(username)
        }).done(function(response){
            if (response.username === undefined){
                $('#UsernameForm').append('<div style="position:relative; height:0px;">Username not found</div>');
                $('#UsernameForm > :last-child').fadeOut(600, function(){
                    $(this).remove();
                });
            }else{
                $('.fullscreen').html('<svg id="svg"></svg>');
                var s = Snap("#svg");
                s.g().attr({id:'u-'+response._id, transform:"translate(50, 50)"});
                $('g#u-'+response._id).html('<a xlink:href="http://anonkun.com/user/'+encodeURI(username)+'"><circle cx="0" cy="0" r="5"></circle></a>');
                //$('g#u-'+response._id).html('<a xlink:href="http://anonkun.com/user/'+encodeURI(username)+'"></a>');
                //$('g#u-'+response._id+'>a').html('<circle cx="0" cy="0" r="5"></circle>');
                //Snap('g#u-'+response._id).circle(0,0,5);
                obj[response._id] = {"username":username, "followersChecked":false, "followingChecked":false, "followers":[], "following":[]};
                addFollowers(response._id);
                //addFollowing(username);
                clickToDrag();
            }
        });
    });
});

function clickToDrag(){
    var oldX = 0;
    var oldY = 0;
    $(document).on("mousedown", function(e){
        oldX = parseInt($('#svg').css('left')) - e.clientX;
        oldY = parseInt($('#svg').css('top')) - e.clientY;
        $(document).on("mousemove", function(e){
            $('#svg').css({
                "left":oldX + e.clientX,
                "top":oldY + e.clientY
            });
        });
    });
    $(document).on("mouseup", function(){
        $(document).off("mousemove");
    });
}

var obj = {};
var CountIng = 0;
var CountErs = 0;

function addFollowers(id){
    CountErs++;
    //if(CountErs > 5){return;}
    obj[id].followersChecked = true;
    $.ajax({
        url: "http://anonkun.com/api/anonkun/followers/"+id // Get its followers list
    }).done(function(response){
        $('g#u-'+id+' > a > circle').attr('r',(response.length/2)+5);
        var angle = 2*Math.PI/response.length;
        var lengthFollower = 20+(3*response.length);

        if (response.length && $('g#u-'+id).data('angle') !== undefined){
            var oldAngle = $('g#u-'+id).data('angle');
            var oldLengthFollower = $('g#u-'+id).data('lengthFollower');
            var newLengthFollower = oldLengthFollower + 2*lengthFollower;
            var newX = Math.round(newLengthFollower * Math.sin(oldAngle) * 10000) / 10000;
            var newY = Math.round(newLengthFollower * Math.cos(oldAngle) * 10000) / 10000;
            $('g#u-'+id)[0].transform.baseVal[0].matrix.e = newX;
            $('g#u-'+id)[0].transform.baseVal[0].matrix.f = newY;
            $('#l-'+id).attr({'x2':newX,'y2':newY});
        }
        //console.log(angle);
        $.each(response, function(i,v){
            //window.setTimeout(function(){
            obj[id].followers.push(v._id);
            if (obj[v._id] === undefined){
                obj[v._id] = {"username":v.username, "followersChecked":false, "followingChecked":false, "followers":[], "following":[]};
            }

            if (!$('g#u-'+v._id).length){
                var x = lengthFollower * Math.sin(angle*i);
                var y = lengthFollower * Math.cos(angle*i);
                x = Math.round(x * 10000) / 10000; // Stop the issues that ~0 values cause
                y = Math.round(y * 10000) / 10000;
                Snap('g#u-'+id).line(Math.round(((response.length/2)+5) * Math.sin(angle*i) * 10000) / 10000,Math.round(((response.length/2)+5) * Math.cos(angle*i) * 10000) / 10000,x,y).attr({id:'l-'+v._id});
                Snap('g#u-'+id).g().attr({id:'u-'+v._id, transform:'translate('+x+', '+y+')'});
                //$('g#u-'+id).prepend('<line x1="0" y1="0" x2="200" y2="200"/>');
                $('g#u-'+v._id).data({'angle':angle*i, 'lengthFollower':lengthFollower});
                //Snap('g#u-'+v._id).circle(0,0,5);
                $('g#u-'+v._id).html('<a xlink:href="http://anonkun.com/user/'+encodeURI(v.username)+'"><circle cx="0" cy="0" r="5"></circle></a>');
            }else{
                x = 0;
                y = 0;
                //Snap('g#u-'+id).line(Math.round(((response.length/2)+5) * Math.sin(angle*i) * 10000) / 10000,Math.round(((response.length/2)+5) * Math.cos(angle*i) * 10000) / 10000,x,y).attr({id:'l-'+v._id});
            }

            if (!obj[v._id].followersChecked){
                addFollowers(v._id);
            }
            if (!obj[v._id].followingChecked){
                //addFollowing(v._id);
            }
            //},1000);
        });
        //console.log(obj);
    });
}

function addFollowing(username){
    CountIng++;
    if(CountIng > 5){return;}
    obj[username].followingChecked = true;
    $.ajax({
        url: "http://anonkun.com/api/anonkun/following/"+obj[username].id // Get its followers list
    }).done(function(response){
        $.each(response, function(i,v){
            obj[username].following.push(v.username);
            if (obj[v.username] === undefined){
                obj[v.username] = {"id":v._id, "followersChecked":false, "followingChecked":false, "followers":[], "following":[]};
            }
            if (!obj[v.username].followersChecked){
                addFollowers(v.username);
            }
            if (!obj[v.username].followingChecked){
                addFollowing(v.username);
            }
        });
        //console.log(obj);
    });
}