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.

301 lines
6.1 KiB

5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
  1. var nodes;
  2. var edges;
  3. var options = {
  4. nodes: {
  5. shape: 'dot',
  6. size: 40,
  7. borderWidth:4,
  8. color: {
  9. border: '#222222',
  10. background: '#666666'
  11. },
  12. font:{
  13. color:'#eeeeee',
  14. size: 12
  15. },
  16. },
  17. edges: {
  18. color: 'lightgray'
  19. }
  20. };
  21. /**
  22. * Checks if a user is a node in the graph
  23. *
  24. * @param userID
  25. * @returns {boolean}
  26. */
  27. function alreadyInGraph(userID)
  28. {
  29. for(var i = 0; i < nodes.length; i++)
  30. {
  31. if(nodes[i].id === userID)
  32. {
  33. return true;
  34. }
  35. }
  36. return false;
  37. }
  38. /**
  39. * Greedy function which checks to see if a edge is in the graphs
  40. *
  41. * @param id1
  42. * @param id2
  43. * @returns {boolean}
  44. */
  45. function edgeInGraph(id1, id2)
  46. {
  47. console.log("edge check");
  48. for(var i = 0;i < edges.length; i++)
  49. {
  50. if(edges[i].from === id1 && edges[i].to === id2)
  51. {
  52. return true;
  53. }
  54. if(edges[i].to === id1 && edges[i].from === id2)
  55. {
  56. return true;
  57. }
  58. }
  59. return false;
  60. }
  61. /**
  62. * Adds a connection to the graph
  63. *
  64. * @param person1
  65. * @param person2
  66. */
  67. function addConnection(person1, person2)
  68. {
  69. if(person1.id !== person2.id)
  70. {
  71. if(alreadyInGraph(person2.id) && !edgeInGraph(person1.id, person2.id))
  72. {
  73. edges.push(
  74. {
  75. from: person1.id,
  76. to: person2.id
  77. });
  78. }
  79. }
  80. }
  81. function processConnections(user, apiPoint, page)
  82. {
  83. updateProgress();
  84. return new Promise(function(resolve, reject)
  85. {
  86. queryAPIByUser(apiPoint + "?page=" + page, user.name,
  87. function(data)
  88. {
  89. for(var i = 0; i < data.length; i++)
  90. {
  91. addConnection(user, data[i])
  92. }
  93. if(data.length === 30)
  94. {
  95. processConnections(user, apiPoint, page + 1).then(function()
  96. {
  97. resolve();
  98. });
  99. }
  100. else
  101. {
  102. resolve();
  103. }
  104. }, function(error)
  105. {
  106. console.log(error);
  107. resolve();
  108. })
  109. })
  110. }
  111. /**
  112. * Processes all the connections of a user and adds them to the graph
  113. *
  114. * @param user has .id and .name
  115. * @returns {Promise<any>}
  116. */
  117. function processUserConnections(user)
  118. {
  119. return new Promise(function(resolve, reject)
  120. {
  121. processConnections(user, API_FOLLOWING, 1).then(function()
  122. {
  123. processConnections(user, API_FOLLOWERS, 1).then(function()
  124. {
  125. updateProgress();
  126. resolve();
  127. })
  128. })
  129. });
  130. }
  131. /**
  132. * Creates connections between all the nodes in
  133. * the graph.
  134. *
  135. * @returns {Promise<any>}
  136. */
  137. function createConnections()
  138. {
  139. return new Promise(function(resolve, reject)
  140. {
  141. var prom = [];
  142. for(var i = 0; i < nodes.length; i++)
  143. {
  144. prom.push(processUserConnections(nodes[i]));
  145. }
  146. Promise.all(prom).then(function()
  147. {
  148. resolve();
  149. }).catch(function(error)
  150. {
  151. console.log(error);
  152. resolve();
  153. });
  154. });
  155. }
  156. function bringUpProfileView(id)
  157. {
  158. for(var i = 0; i < nodes.length; i++)
  159. {
  160. if(nodes[i].id === id) {
  161. profileGen(nodes[i].name, "profileGen");
  162. }
  163. }
  164. }
  165. function addOrgUserToGraph(profileData)
  166. {
  167. nodes.push(
  168. {
  169. id:profileData.id,
  170. name:profileData.login,
  171. shape: 'circularImage',
  172. image:profileData.avatar_url
  173. });
  174. }
  175. function connectOrgUsers()
  176. {
  177. return new Promise(function(resolve, reject)
  178. {
  179. resolve();
  180. })
  181. }
  182. function addOrgUsers(orgname, page)
  183. {
  184. return new Promise(function(resolve, reject)
  185. {
  186. queryAPIByOrg(API_ORG_MEMBERS + "?page=" + page, orgname, function(data)
  187. {
  188. for(var i = 0;i < data.length; i++)
  189. {
  190. addOrgUserToGraph(data[i]);
  191. }
  192. if(data.length === 30)
  193. {
  194. addOrgUsers(orgname, page + 1).then(function()
  195. {
  196. resolve();
  197. });
  198. }
  199. else
  200. {
  201. total = 2*(data.length + (page * 30));
  202. resolve();
  203. }
  204. }, function(error)
  205. {
  206. console.log(error);
  207. resolve();
  208. })
  209. })
  210. }
  211. function bringUpProfileView(id)
  212. {
  213. for(var i = 0; i < nodes.length; i++)
  214. {
  215. if(nodes[i].id === id)
  216. {
  217. profileGen(nodes[i].name, "profileGen");
  218. }
  219. }
  220. }
  221. var total = 1;
  222. var indexed = 0;
  223. function updateProgress()
  224. {
  225. indexed++;
  226. var percent = parseInt((indexed/total)*100);
  227. $("#graphLoading").html("<div class=\"progress\">\n" +
  228. " <div class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" style=\"width: " + percent + "%\" aria-valuenow=\"" + percent + "\" aria-valuemin=\"0\" aria-valuemax=\"100\"></div>\n" +
  229. "</div>");
  230. console.log();
  231. }
  232. /**
  233. * Creates a graph
  234. * @param username
  235. * @param containerName
  236. * @param graphsTitle
  237. */
  238. function createOrgRepoGraph(orgname, containerName, graphsTitle)
  239. {
  240. progressID = graphsTitle;
  241. nodes = [];
  242. edges = [];
  243. addOrgUsers(orgname, 1).then(function()
  244. {
  245. createConnections().then( () => {
  246. var container = document.getElementById(containerName);
  247. var data = {
  248. nodes: nodes,
  249. edges: edges
  250. };
  251. var network = new vis.Network(container, data, options);
  252. network.on("click", function (params) {
  253. params.event = "[original event]";
  254. if(Number(this.getNodeAt(params.pointer.DOM)) !== NaN) {
  255. bringUpProfileView(Number(this.getNodeAt(params.pointer.DOM)));
  256. }
  257. });
  258. $("#graphLoading").html("");
  259. });
  260. }).catch(function(error) {
  261. alert("Invalid Organization");
  262. });
  263. }