How i created facemash app in Angular

Visit facemash for wallpaper
After watching The Social Network movie i was very excited to create similar like facemash so i decided to create webapp for ranking wallpapers.

So first of all i needed a ranking algorithm so i did some research about elo rating algorithms and how it work for ranking chess players

So here's the ranking algorithm that you can use if you plan to create something like this.

float Probability(int rating1, int rating2) 
{ 
    return 1.0 * 1.0 / (1 + 1.0 *  
           pow(10, 1.0 * (rating1 - rating2) / 400)); 
} 

// Function to calculate Elo rating 
// K is a constant. 
// d determines whether Player A wins or Player B.  
void EloRating(float Ra, float Rb, int K, bool d) 
{   

    // To calculate the Winning 
    // Probability of Player B 
    float Pb = Probability(Ra, Rb); 

    // To calculate the Winning 
    // Probability of Player A 
    float Pa = Probability(Rb, Ra); 

    // Case -1 When Player A wins 
    // Updating the Elo Ratings 
    if (d == 1) { 
        Ra = Ra + K * (1 - Pa); 
        Rb = Rb + K * (0 - Pb); 
    } 

    // Case -2 When Player B wins 
    // Updating the Elo Ratings 
    else { 
        Ra = Ra + K * (0 - Pa); 
        Rb = Rb + K * (1 - Pb); 
    } 

    cout << "Updated Ratings:-\n"; 
    cout << "Ra = " << Ra << " Rb = " << Rb; 
} 

This code is from Geeks for Geeks

So phase 1 is completed
Now another task was to finding enough images for ranking them.
For that stuff i recommend to use open source images from site like Unsplash, pexles, pixabay, etc..

After then using my angular skills i developed a webapp with simple UI which shows two random images and when you click them it's rank will be updated and you will get new images for further ranking

There's also a dashboard where you can check ranking of all images.

Source Code Github