<!doctype html>
<html ng-app="RocketReachDemoApp">

<head>
  <base href="/plunks/w5egAjJ6NVbHlemkX7rJ/" />
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-sanitize.js"></script>
  <script src="rocketReachDemo.js"></script>
</head>
<body>
  <div ng-controller="RocketReachDemoController">
    <h1>Search for people at {{formData.company}}</h1>

    <form name="SampleForm" ng-submit="searchForEmployees()">
      <label>Title: </label>
      <input ng-model="formData.title" /> at
      <label>Company: </label>
      <input ng-model="formData.company" />
      <input type="submit" value="Search">
    </form>
    <div>
      <h1>Results</h1>
      <!-- navigation -->
      <ul class="nav nav-tabs">
        <li role="presentation" ng-class="{'active':nav=='sr'}">
          <a href ng-click="nav='sr'">Search Results</a>
        </li>
        <li role="presentation" ng-class="{'active':nav=='ab'}">
          <a href ng-click="nav='ab'" ng-class="{}">Address Book ({{addressBook.length}})</a>
        </li>
      </ul>
    </div>
    <!-- search results -->
    <table class="table table-striped" ng-show="nav=='sr'">
      <thead>
        <tr>
          <th>Image</th>
          <th>ID</th>
          <th>Name, Title, Company</th>
          <th> Action</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="person in people">
          <td>
            <a ng-href="{{person.links.linkedin}}" target="_blank"><img width="50" height="50" ng-src="{{person.profile_pic || 'http://rocketreach.co/static/images/default_thumb.png'}}" /></a>
          </td>
          <td>{{person.id}}</td>
          <td>
            {{person.name}} - {{person.current_title}}, {{person.current_employer}} <br>
            <p ng-bind-html="person.summary"></p>
            <a ng-show="person.links.linkedin" ng-href="{{person.links.linkedin}}" target="_blank">(LinkedIn)</a>
          </td>
          <td><button 
          type="button" class="btn btn-primary" ng-show="!person.inAddressBook" ng-click="getContactInfo(person)">Add to contacts</button></td>
        </tr>
      </tbody>
    </table>
    
    <!-- address book -->
    <table class="table table-striped" ng-show="nav=='ab'">
      <thead>
        <tr>
          <th>Image</th>
          <th>ID</th>
          <th>Name, Title, Company</th>
          <th>Contact Info</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="person in addressBook">
          <td>
            <a ng-href="{{person.links.linkedin}}" target="_blank"><img 
            width="50" height="50" 
            ng-src="{{person.profile_pic || 'http://rocketreach.co/static/images/default_thumb.png'}}" 
            /></a>
          </td>
          <td>{{person.id}}</td>
          <td>
            {{person.name}} - {{person.current_title}}, {{person.current_employer}}
            <a ng-show="person.links.linkedin" ng-href="{{person.links.linkedin}}" target="_blank">(LinkedIn)</a>
          </td>
          <td>
            Status: {{person.status}}<br>
            <hr>
            Emails :<span ng-repeat = "e in person.emails">{{e.email}}<br></span>
            <hr>
            Phones: <span ng-repeat = "p in person.phones">{{p.phone}}<br></span>
            <hr>
            Links: <span ng-repeat = "l in person.links">{{l}}<br></span>
            </td>
        </tr>
      </tbody>
    </table>
  </div>
</body>
</html>
# RocketReach Demo Application
RocketReach Demo

* http://rocketreach.co
* http://rocketreach.co/api

## Find people by title (role) and company, and retrieve their contact information.
E.g. search for all people with title "VP" at Salesforce.
 angular.module('RocketReachDemoApp', ['ngSanitize'])

 angular.module('RocketReachDemoApp').controller('RocketReachDemoController', function($scope, $log, $http, $timeout, $location) {
   //Initialse some data
   $scope.formData = {
     "title": "Vice President",
     "company": "Salesforce"
   };
   //read params
   try{
     if($location && $location.search()["company"] && $location.search()["company"].length){
      $scope.formData.company = $location.search()["company"];
    }
   }catch(e){}
   
   
   $scope.people = [];
   $scope.addressBook = [];
   $scope.nav = 'sr';
   //API Constants
   var API_BASE = '//api.rocketreach.co/v1/api';
   var API_SEARCH_URL = API_BASE + '/search';
   var API_LOOKUP_CONTACT_INFO_URL = API_BASE + '/lookupProfile';
   var API_CHECK_STATUS =  API_BASE +'/checkStatus';
   var API_KEY = '55ck9d6b41ed1ab762cc889d9345133ffa4b';


   //Call Search
   $scope.searchForEmployees = function() {
     $http({
       method: 'GET',
       url: API_SEARCH_URL,
       params: {
         'api_key': API_KEY,
         'k': $scope.formData.title,
         'c': $scope.formData.company
       }
     }).then(function(response) {
       if (response && response.data) {
         $scope.people = response.data.profiles;
       }
     })
   }

   //Add to address Book and look for contact information
   $scope.getContactInfo = function(person) {
     person.inAddressBook=true;
      $http({
         method: 'GET',
         url: API_LOOKUP_CONTACT_INFO_URL,
         params: {
           'api_key': API_KEY,
           'id': person.id,
         }
       }).then(function(response){
         if(response && response.data){
           Array.prototype.push.apply($scope.addressBook, response.data);
       }
     })
   }
   
   //Poll for Results...
   var poller = function(){
     var ids = [];
     for (var i =0;i<$scope.addressBook.length;i++){
        var aProfile= $scope.addressBook[i];
        if(aProfile.status !== 'complete' && aProfile.status !== 'failed'){
            //System is still searching.
            ids.push(aProfile.id);
          }
       }
     //If there are pending calls...then call check Status
     if(ids.length){
       $http({
         method: 'GET',
         url: API_CHECK_STATUS,
         params: {
           'api_key': API_KEY,
           'ids': ids.join(",")
         }
       }).then(function(response){
         //Use the results and Update the address Book.
         if(response && response.data && response.data.length){
           for (var r = 0;r<response.data.length; r++) {
             var rProfile = response.data[r];
             for (var j = 0;j<$scope.addressBook.length;j++){
               var jProfile = $scope.addressBook[j];
               if(rProfile.id == jProfile.id){
                 $log.log("Updating id",rProfile.id,"at index",j);
                 $scope.addressBook[j] = rProfile;
               }
             }
           }
         }
       })
     }
     //Call the poller every 2 seconds
     $timeout(poller,2000);
   }

   //Initialize results
   $scope.searchForEmployees();
   poller();

 })