kblincoe / VisualGit_SE701_2019_3

1 stars 0 forks source link

GitHub profile pictures on nodes #52

Open victorlian opened 5 years ago

victorlian commented 5 years ago

Currently, only the first letter of GitHub users' names appears on the nodes. It would be more useful to have their GitHub profile pictures so they can be more easily identified.

BennyChun commented 5 years ago

Waiting on issue #11 to be fixed, to use the username to grab picture

BennyChun commented 5 years ago

Requiring a lot of effort to understand outside libraries, and creating calls to store image, and then linking images to required note, changing to large.

BennyChun commented 5 years ago

Spent well over 20 hours investigating multiple ways of doing it. The last attempt got close however, due to other commitments and the upcoming deadline, it could not be complete. The 3 attempts can be seen on my fork (the branches beginning with 52). What was tried: Understanding the uncommented graphing.ts file was the most difficult challenge. Took a long time to understand why there were multiple makeNode methods and how the graph was drawn.

  1. Fixed the imageForUser function to be able to get the avatar URLs, then download the images to be stored for use. This attempt took the longest as this is when I needed to try to understand the code. Investigated the various packages to get the right information to get the avatar image. These were the findings
    • github-username was not working, giving the email address would lead to errors
    • github-avatar was tried, it doesn't work as it give the same incorrect generic image for each call.
    • The nodegit commit object method c.getAuthor sometimes gives either:
      • The user's first and last name for name, and their github email address
      • The user's username and github ID+ username@users.noreply.github.com
      • This made things very problematic as the retrieving the avatar through the email yielded incorrect results. This method did not work due to issues with async. In the end found that using the avatarURL was sufficient and I didn't need to download the image as this process would cause the code to take longer to run.
  2. In attempt two, I stuck with using just the avatar URL. Retrieved from the imageForUser function. In this attempt I attemped to use promises to solve the sync issue with no success. I tried to have each of the make node methods return a promise when they were done before drawing the rest of the graph. This was not successful as the edges would not be drawn.
  3. In this last attempt I tried to put the URL retrieving method at a higher level to make it run first before processing the graph. This attempt got close, avatars were retrieved but they were not mapped by users instead it was based on which commit number it was, and this lead the incorrect population of avatars to the nodes.