Website for visualizing a persons github network.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

102 lines
4.5 KiB

5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
  1. function profileGen(username, container)
  2. {
  3. queryAPIByUser("", username, (user) =>
  4. {
  5. if(!user.hasOwnProperty("id"))
  6. {
  7. alert("User Does Not Exist");
  8. window.location.href = "./GraphGenerator.html";
  9. }
  10. parseOrgs(user.login).then( (orgsReturn) => {
  11. let html =
  12. "<div class=\"card\" style=\"w-100\"> \
  13. <img class=\"card-img-top\" src=\""+user.avatar_url+"\"></img> \
  14. <div class=\"row\"> \
  15. <div class=\"col-8\"> \
  16. <div class=\"card-body\"> \
  17. <h5 class=\"card-title\">"+user.name+"</h1> \
  18. <h6 class=\"card-subtitle\">"+user.login+"</h2> \
  19. </div> \
  20. </div> \
  21. <div class=\"col-4\"> \
  22. <button type=\"button\" class=\"btn btn-link pt-3\"> \
  23. <a href=\""+makeUrl(user.login)+"\"> \
  24. <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> \
  25. <path d=\"M5 9.2h3V19H5zM10.6 5h2.8v14h-2.8zm5.6 8H19v6h-2.8z\"/> \
  26. <path fill=\"none\" d=\"M0 0h24v24H0z\"/> \
  27. </svg> \
  28. </a> \
  29. </button> \
  30. </div> \
  31. </div> \
  32. <div class=\"card border-secondary mb-3 mx-auto text-left\" style=\"width:90%\"> \
  33. <div class=\"card-body\"> \
  34. <p class=\"card-text\"><a href=\""+user.html_url+"\" class=\"card-link\">"+user.html_url+"</a></p> \ " +
  35. (user.blog != null ? "<p class=\"card-text \"><a href="+user.blog+" class=\"card-link\">"+user.blog+"</a></p>" : "")+" \
  36. </div> \
  37. </div> \
  38. <ul class=\"list-group list-group-flush\"> \
  39. <li class=\"list-group-item\">Followers: "+user.followers+"</li> \
  40. <li class=\"list-group-item\">Following: "+user.following+"</li> \
  41. <li class=\"list-group-item\">Repositories: "+user.public_repos+"</li>" +
  42. (user.bio != null ? "<li class=\"list-group-item\">Bio: "+user.bio+"</li>" : "")+
  43. (user.location != null ? "<li class=\"list-group-item\">Location: "+user.location+"</li>" : "")+
  44. (user.email != null ? "<li class=\"list-group-item\">Email: "+user.email+"</li>" : "")+
  45. (user.company != null ? "<li class=\"list-group-item\">Company: "+user.company+"</li>" : "")+
  46. (orgsReturn != [] ? "<li class=\"list-group-item\">"+orgsReturn+"</li>" : "")+ " \
  47. </ul> \
  48. </div>"
  49. $("#"+container).html(html);
  50. })
  51. }, () => {
  52. console.error("error getting user info");
  53. });
  54. }
  55. function parseOrgs(name) {
  56. return new Promise( (resolve, reject) => {
  57. let urlpath = `api/users/${name}/orgs`;
  58. let orgs_final = [];
  59. queryUrl(urlpath, (orgs) => {
  60. var prom= [];
  61. for(var i = 0;i < orgs.length; i++) {
  62. prom.push( new Promise( (res, rej) => {
  63. url = orgs[i].url;
  64. queryUrl(url, (orgData) => {
  65. orgs_final.push("<a href=\""+orgData.html_url+"\"><img src=\""+orgData.avatar_url+"\" class=\"img-fluid\" style=\"max-width:49%\"></img></a>");
  66. res();
  67. }, (error) => {
  68. console.log(error);
  69. rej(error);
  70. console.error("error getting org info");
  71. });
  72. })
  73. )
  74. }
  75. Promise.all(prom).then(function() {
  76. resolve(orgs_final.join(" "));
  77. })
  78. }, (error) => {
  79. console.error("error getting orgs");
  80. reject(error);
  81. });
  82. })
  83. }
  84. function queryUrl(url, successCallBack, errorCallBack) {
  85. url = url.split("https://api.github.com/").join("api/");
  86. $.ajax({
  87. type:'GET',
  88. url: url,
  89. crossDomain: true,
  90. dataType: "json",
  91. success: successCallBack,
  92. error:errorCallBack,
  93. timeout: 3000
  94. });
  95. }
  96. function makeUrl(user) {
  97. return "/FriendsGraph.html?name="+user;
  98. }