From 08ad3375252807b9b63cc1ae03e1dca9aa21e918 Mon Sep 17 00:00:00 2001
From: 1UnboundedSentience <jsnx21@gmail.com>
Date: Tue, 20 Oct 2015 12:07:12 -0700
Subject: [PATCH 1/4] progress as of noon oct 20, displaying github diffs from
 master

---
 src/index.html  | 13 +++++++++++++
 src/projects.js | 26 ++++++++++++++++++++++----
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/src/index.html b/src/index.html
index 4f13778..0233ab9 100644
--- a/src/index.html
+++ b/src/index.html
@@ -27,6 +27,7 @@ <h2>All active projects</h2>
             <th>Type</th>
             <th>Name</th>
             <th>Last activity</th>
+            <th>Commits ahead of master branch</th>
           </tr>
         </thead>
         <tbody>
@@ -48,6 +49,18 @@ <h2>Add new project</h2>
           <label for="project-name">Project name</label>
           <input type="text" class="form-control" id="project-name">
         </div>
+        <div class="form-group">
+          <label for="github-username">Github Owner's Username</label>
+          <input type="text" class="form-control" id="github-username">
+        </div>
+        <div class="form-group">
+          <label for="github-project">Github Project Name</label>
+          <input type="text" class="form-control" id="github-project">
+        </div>
+        <div class="form-group">
+          <label for="github-new-branch">Enter a name of the branch you want to track against the master branch</label>
+          <input type="text" class="form-control" id="github-new-branch">
+        </div>
         <div class="form-group">
           <input type="submit" class="btn btn-default" value="Add project">
         </div>
diff --git a/src/projects.js b/src/projects.js
index 6c11b49..16add85 100644
--- a/src/projects.js
+++ b/src/projects.js
@@ -1,8 +1,9 @@
-function Project(id, type, name, lastActivity) {
+function Project(id, type, name, lastActivity, gitDiff) {
     this.id = id;
     this.type = type;
     this.name = name;
     this.lastActivity = lastActivity;
+    this.gitDiff = gitDiff;
 }
 
 // The list of all projects currently in the system.
@@ -19,22 +20,38 @@ var MAX_ID = Math.max.apply(null, $.map(CURRENT_PROJECTS, function(pj) { return
 $(function(){
     var loadProjects = function($container, projects) {
         $.fn.append.apply($container, $.map(projects, function(pj) {
+            debugger
             return $("<tr>").append(
                 $("<td>").text(pj.id),
                 $("<td>").text(pj.type),
                 $("<td>").text(pj.name),
-                $("<td>").text(pj.lastActivity.toString())
+                $("<td>").text(pj.lastActivity.toString()),
+                $("<td>").text(pj.gitDiff)
             );
         }));
     };
-
+    // GET /repos/:owner/:repo/compare/:base...:head
     // Creates a new project based on the user input in the form.
     var createProject = function($form) {
+        var githubUsername = $form.find("#github-username").val();
+        var githubProject = $form.find("#github-project").val();
+        var githubBranch = $form.find("#github-new-branch").val();
+        var githubCompare = "https://api.github.com/repos/" + githubUsername + "/" + githubProject + "/compare/master..." + githubBranch
+        differences;
+        $.ajax({
+                method: 'GET',
+                url: githubCompare
+        }).done(function(response) {
+            differences = response['ahead_by'];
+        }).fail(function(response) {
+        });
+        console.log(differences);
         return new Project(
             MAX_ID + 1,
             $form.find("#project-type").val(),
             $form.find("#project-name").val(),
-            new Date()
+            new Date(),
+            differences
         );
     };
 
@@ -42,6 +59,7 @@ $(function(){
     var resetForm = function($form) {
         $form.find("#project-type").val("");
         $form.find("#project-name").val("");
+        $form.find("#github-name").val("");
         $form.find("input:first").focus();
     };
 

From e8a18f13f0a598e5e0d5a3b922be7880ffa2dc3a Mon Sep 17 00:00:00 2001
From: 1UnboundedSentience <jsnx21@gmail.com>
Date: Wed, 21 Oct 2015 17:01:50 -0700
Subject: [PATCH 2/4] displaying git commits

---
 README.md       | 86 +++----------------------------------------------
 src/index.html  |  7 +++-
 src/projects.js | 29 +++++++++++++++--
 3 files changed, 37 insertions(+), 85 deletions(-)

diff --git a/README.md b/README.md
index 1d8ca39..c547396 100644
--- a/README.md
+++ b/README.md
@@ -1,86 +1,10 @@
-Quixey web development exercise
-===============================
 
-* [About this repo](#about-this-repo)
-* [The problem](#the-problem)
-* [Your task](#your-task)
-* [Notes and resources](#notes-and-resources)
-* [Afterward](#afterward)
+# Github Commit Tracker
 
-Hi! If you're here then you are probably interested in working for [Quixey](https://quixey.com/careers). We set up this exercise so that our candidates could have a clear way to demonstrate their front-end-web-dev ability in a realistic way that (hopefully) isn't too stressful or time-consuming.
+This app allows you enter a branch name to compare to master. It will fetch data from Github’s API and display the number of commits ahead or behind.  
 
-Ideally, this exercise should probably take around an hour for you to do a good job, or maybe a little more if you need to brush up on front-end tools or git. If you want to spend more time to add bells and whistles, then that's great, and you'll get bonus points from us if you do it well, but please don't feel like you have to spend half a day on it.
 
-About this repo
----------------
 
-This repository is set up to simulate the front end of a small internal tool, like the kind you might realistically be working on. The best way to run it will be to fork & clone this repository and serve it from your local machine; for example, if you have Python installed, you can serve it like
-
-```sh
-$ cd src
-$ python -m SimpleHTTPServer
-Serving HTTP on 0.0.0.0 port 8000 ...
-```
-
-and then visiting `http://localhost:8000` in your browser.
-
-This tool is built to keep track of "projects" &ndash; experiments done by search engineers trying to improve search relevance. It shows a list of all the current projects, and has a little UI for adding new projects to the list. Each project has an ID, a name, a type (there are only a few different project types), and an activity date. (Realistically, it might load this information from a database, but for the purposes of this exercise the 'database' is just an array in `projects.js`.)
-
-The problem
------------
-
-The engineers collaborate via GitHub, and usually their projects are associated with a specific commit or feature branch in their repository. They say that things like this happen:
-
-1. Engineer Alice makes branch "search-experiment"
-2. Alice sets up a project for "search-experiment" using this tool
-3. Engineer Bob makes further changes in master
-4. Testers start working on the "search-experiment" project
-
-(If you don't know what I mean by this, you might want to review how [git branching](http://rypress.com/tutorials/git/branches-2.html) works.)
-
-Alice is worried when this happens, because it means the testers might not be testing the latest code. She wishes that the project administration tool would let her know that her branch was outdated with respect to master, so that she could merge or rebase it to make it up-to-date.
-
-Your task
----------
-
-Alice thinks you should make the tool work like this:
-
-- Allow her to specify a commit or branch or tag that goes along with a particular project.
-- Talk to the GitHub API to figure out whether or not each project is up-to-date with master.
-- Add a UI element to the project list that helps her see which projects are OK and which need updating.
-
-If you agree that this is a good idea, then you should give it a shot and implement it. (If you don't, then prepare to argue for your better idea!)
-
-Notes and resources
--------------------
-
-**There are some branches in this repository that you can test your changes on.** There are some outdated and up-to-date branches with respect to the branch called "baseline-branch". Your code should be able to accurately report the status of these branches.
-
-Here are some helpful sections of the documentation for the GitHub API:
-
-- [Overview](https://developer.github.com/v3/)
-- [Repositories](https://developer.github.com/v3/repos/)
-- [Commits](https://developer.github.com/v3/repos/commits/)
-
-Note that you can access the GitHub API and ask queries about public repositories (like this one!) without any authentication, but there's a rate limit of 60 queries per hour. If you run into the rate limit, then you can [authenticate via HTTP basic authentication or an OAuth token for your account](https://developer.github.com/v3/#authentication) to up the limit to 5000.
-
-Please use any online resources you like, or ask anyone questions, but clearly attribute any code which isn't your own. (And we'll probably ask you some questions about what you did, so it won't be advisable to write something you don't understand.)
-
-If you think it would be helpful to write some backend code or anything else we didn't anticipate, feel free to write it using whatever languages, libraries, and tools you think are a good fit for the task.
-
-Qualities we're looking for in your solution:
-
-- You should solve the stated problem well for users of the tool
-- Your work is clear, concise, correct, maintainable, and the code is appropriately efficient
-- Code and UI that you add should be consistent with the existing codebase and interface
-- Design decisions you make are clearly thought-through
-
-Afterward
----------
-
-After you're finished, please let us know and either:
-
-- (Ideal) Make a pull request from your forked repo for your changes
-- (Also OK) Link us to your code, or send us your code via email.
-
-If you have any feedback, please let us know; we care about making sure that our interview process doesn't suck for you and does a fair job of assessing your skill. Thanks for taking the time to do this!
+----
+## Sample Usage: 
+Branch to Compare: outdated-branch-1
\ No newline at end of file
diff --git a/src/index.html b/src/index.html
index 4f13778..ee65eaf 100644
--- a/src/index.html
+++ b/src/index.html
@@ -27,6 +27,7 @@ <h2>All active projects</h2>
             <th>Type</th>
             <th>Name</th>
             <th>Last activity</th>
+            <th>Commits ahead of master branch</th>
           </tr>
         </thead>
         <tbody>
@@ -48,6 +49,10 @@ <h2>Add new project</h2>
           <label for="project-name">Project name</label>
           <input type="text" class="form-control" id="project-name">
         </div>
+        <div class="form-group">
+          <label for="github-new-branch">Enter a name to compare to master:</label>
+          <input type="text" class="form-control" id="github-new-branch">
+        </div>
         <div class="form-group">
           <input type="submit" class="btn btn-default" value="Add project">
         </div>
@@ -57,4 +62,4 @@ <h2>Add new project</h2>
     <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
     <script src="projects.js"></script>
   </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/src/projects.js b/src/projects.js
index 6c11b49..e68451a 100644
--- a/src/projects.js
+++ b/src/projects.js
@@ -1,8 +1,9 @@
-function Project(id, type, name, lastActivity) {
+function Project(id, type, name, lastActivity, gitDiff) {
     this.id = id;
     this.type = type;
     this.name = name;
     this.lastActivity = lastActivity;
+    this.gitDiff = gitDiff;
 }
 
 // The list of all projects currently in the system.
@@ -23,25 +24,47 @@ $(function(){
                 $("<td>").text(pj.id),
                 $("<td>").text(pj.type),
                 $("<td>").text(pj.name),
-                $("<td>").text(pj.lastActivity.toString())
+                $("<td>").text(pj.lastActivity.toString()),
+                $("<td>").text(pj.gitDiff)
             );
         }));
     };
 
+    var githubCall = function(githubCompare) {
+
+        var differences = 0;
+        $.ajax({
+                method: 'GET',
+                url: githubCompare
+        }).done(function(response) {
+            differences = response['ahead_by'];
+            console.log(differences);
+            return differences;
+        }).fail(function(response) {
+            return "Request to GitHub failed"
+        });
+    }
     // Creates a new project based on the user input in the form.
     var createProject = function($form) {
+        var githubUsername = $form.find("#github-username").val();
+        var githubProject = $form.find("#github-project").val();
+        var githubBranch = $form.find("#github-new-branch").val();
+        var githubCompare = "https://api.github.com/repos/quixey/webdev-exercise/compare/master..." + githubBranch
         return new Project(
             MAX_ID + 1,
             $form.find("#project-type").val(),
             $form.find("#project-name").val(),
-            new Date()
+            new Date(),
+            githubCall(githubCompare)
         );
+
     };
 
     // Clears the data in the form so that it's easy to enter a new project.
     var resetForm = function($form) {
         $form.find("#project-type").val("");
         $form.find("#project-name").val("");
+        $form.find("#github-new-branch").val("");
         $form.find("input:first").focus();
     };
 

From 0509bae37322d61b1a60dd31cdbca21970740597 Mon Sep 17 00:00:00 2001
From: 1UnboundedSentience <jsnx21@gmail.com>
Date: Wed, 21 Oct 2015 17:18:42 -0700
Subject: [PATCH 3/4] modifying grab of commits ahead

---
 src/projects.js | 18 ++++--------------
 1 file changed, 4 insertions(+), 14 deletions(-)

diff --git a/src/projects.js b/src/projects.js
index 8fcf394..e7351e8 100644
--- a/src/projects.js
+++ b/src/projects.js
@@ -32,7 +32,6 @@ $(function(){
     };
 
     var githubCall = function(githubCompare) {
-
         var differences = 0;
         $.ajax({
                 method: 'GET',
@@ -49,25 +48,16 @@ $(function(){
 
     // Creates a new project based on the user input in the form.
     var createProject = function($form) {
-        var githubUsername = $form.find("#github-username").val();
-        var githubProject = $form.find("#github-project").val();
         var githubBranch = $form.find("#github-new-branch").val();
-        var githubCompare = "https://api.github.com/repos/" + githubUsername + "/" + githubProject + "/compare/master..." + githubBranch
-        differences;
-        $.ajax({
-                method: 'GET',
-                url: githubCompare
-        }).done(function(response) {
-            differences = response['ahead_by'];
-        }).fail(function(response) {
-        });
-        console.log(differences);
+        var githubCompare = "https://api.github.com/repos/quixey/webdev-exercise/compare/master..." + githubBranch;
+        var diffs = githubCall(githubCompare);
+        console.log(diffs);
         return new Project(
             MAX_ID + 1,
             $form.find("#project-type").val(),
             $form.find("#project-name").val(),
             new Date(),
-            githubCall(githubCompare)
+            diffs
         );
 
     };

From 15358335a6240592a5a9e67e614be66372f2da3d Mon Sep 17 00:00:00 2001
From: 1UnboundedSentience <jsnx21@gmail.com>
Date: Wed, 21 Oct 2015 21:10:53 -0700
Subject: [PATCH 4/4] working versiondisplaying the correct commits behind by,
 modified UI elems in ajax to display it

---
 src/index.html  |  3 ++-
 src/projects.js | 26 +++++++++++++++-----------
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/index.html b/src/index.html
index ee65eaf..46efe8a 100644
--- a/src/index.html
+++ b/src/index.html
@@ -20,6 +20,7 @@
 
     <div class="container main-content">
       <h2>All active projects</h2>
+      <p id="result"></p>
       <table id="project-list" class="table">
         <thead>
           <tr>
@@ -27,7 +28,7 @@ <h2>All active projects</h2>
             <th>Type</th>
             <th>Name</th>
             <th>Last activity</th>
-            <th>Commits ahead of master branch</th>
+            <th>Commits behind of master branch</th>
           </tr>
         </thead>
         <tbody>
diff --git a/src/projects.js b/src/projects.js
index e7351e8..a154abe 100644
--- a/src/projects.js
+++ b/src/projects.js
@@ -26,31 +26,36 @@ $(function(){
                 $("<td>").text(pj.type),
                 $("<td>").text(pj.name),
                 $("<td>").text(pj.lastActivity.toString()),
-                $("<td>").text(pj.gitDiff)
+                $("<td id='git-diff"+ pj.id +"'>").text(pj.gitDiff)
             );
         }));
     };
 
-    var githubCall = function(githubCompare) {
-        var differences = 0;
-        $.ajax({
+    var githubCall = function(githubCompare, MAX_ID) {
+        var behindBy;
+        console.log('function called')
+        var promise = $.ajax({
                 method: 'GET',
-                url: githubCompare
+                url: githubCompare,
         }).done(function(response) {
-            differences = response['ahead_by'];
-            console.log(differences);
-            return differences;
+                behindBy = response['behind_by'];
+                $('#git-diff' + (MAX_ID+1) ).text(behindBy);
+                console.log(behindBy);
+                //return behindBy;
         }).fail(function(response) {
-            return "Request to GitHub failed"
+                    return "Request to GitHub failed"
         });
+        return behindBy;
     }
 
 
     // Creates a new project based on the user input in the form.
     var createProject = function($form) {
+        var differences = 99;
         var githubBranch = $form.find("#github-new-branch").val();
         var githubCompare = "https://api.github.com/repos/quixey/webdev-exercise/compare/master..." + githubBranch;
-        var diffs = githubCall(githubCompare);
+        var diffs = githubCall(githubCompare, MAX_ID);
+        diffs
         console.log(diffs);
         return new Project(
             MAX_ID + 1,
@@ -59,7 +64,6 @@ $(function(){
             new Date(),
             diffs
         );
-
     };
 
     // Clears the data in the form so that it's easy to enter a new project.