WDI 13 | Project 3 | Andrew, Sara, Alaina
People say pets look like their owners. Doggleganger allows you to find the perfect pet based on a percentage look-alike match, as well as personality information about the animal.
Pet lovers who love to procrastinate real-world tasks will love the hours of entertainment Doggleganger provides, while also tempting them to adopt more animals!
- CSS3, implementing CSS Grid
- Angular.js: handles data from petfinder and our comparison before display
- Petfinder API: We use the Petfinder to find adoptable pets users can compare their face to.
- gm (graphics magic) npm module. Using the file system, we temporarily download two images, then resize them to be the same with gm. After resizing, gm performs a pixel-by-pixel comparison of the two images and returns the percent equality. The files are then deleted.
We began the project by delegating general tasks for the week, and narrowing down each task list every morning. Sara and Andrew focused primary on back-end, while Alaina focused primarily on front-end, although the project was a true team effort.
Sara began by focusing on the image-to-image comparison, getting a headstart over the weekend. This put us in a great position to jump-in to everything on Monday morning. Andrew started off working with the PetFinder API to ensure we could get the data we needed to combine with the image comparison. This was crucial to making our app practical, and he was an expert on PetFinder by Day One. Alaina worked as Git Master and Project Manager, so she began the week by setting up project guidelines, including MVP and designated roles. Alaina also led the design for the site, beginning with wireframing, all the way through to font choice.
"I approached my portion of the project by starting with the most difficult and central part of my responsibilites, the image-to-image comparison. I tested with images locally saved and then broadened it to allow for dynamic, user input. Once that piece was done I could work on other sections as needed." — Sara
To install this project locally perform the following steps: Installation Instructions
- Fork and/or clone this repo to your local device.
- Run "npm install" in terminal to install all dependencies
- You will also need to install ImageMagick which you can find on their site or by running "brew install imagemagick" on MacOSX or "sudo apt-get imagemagick" on Linux
- Create a .env file, and save a random string into a variable named JWT_SECRET.
- Also, get an API key from petfinder.com and save that key to a variable named API_KEY in your .env file.
Getting a new auth token when a user updates their profile. Success!
Setting up a watch and doing an API call for a list of breeds, so our dropdown is populated with the relevant animal breeds. Success!
Occasionally user profiles will become unretrievable. We have debugged a few causes (mostly related to Auth tokens), but a few cases still have issues and we have not been able to reliably reproduce the issue.
In Progress: Issues getting animations to work with angular insted of jQuery. Looking forward to taking those on at a later date for version 2.0