var BASE_URL = localStorage['api_endpoint'];

function getDelta(change) {
  var td = document.createElement('td');
  var ins = change.insertions ? change.insertions : 0;
  var del = change.deletions ? change.deletions : 0;
  td.textContent = '+' + ins + ',-' + del;
  return td;
}

function getCodeReview(change) {
  var review = change.labels['Code-Review'];
  var cr = review.rejected ? -2
    : review.disliked ? -1
    : review.recommended ? 1
    : review.approved ? 2
    : 0;
  var td = document.createElement('td');
  td.textContent = cr == 2 ? '+2'
    : cr == 1 ? '+1'
    : cr == 0 ? ''
    : cr == -1 ? '-1'
    : '-2';
  td.style['color'] = cr > 0 ? 'green'
    : cr < 0 ? 'red'
    : '';
  return td;
}

function getVerified(change) {
  var verified = change.labels.Verified.approved ? 1
    : change.labels.Verified.rejeced ? -1
    : false;
  var td = document.createElement(td);
  td.textContent = verified > 0 ? '+1'
    : verified < 0 ? '-1'
    : '';
  td.style['color'] = verified > 0 ? 'green'
    : verified < 0 ? 'red'
    : '';
  return td;
}

function initUI(items) {
  var list = document.getElementById('list_body');
  list.innerHTML = '';
  for (var i = 0; i < items.changes.length; i++) {
    var change = items.changes[i];
    if (change.reviewed)
        continue;

    try {
      change.read = new Date(items.timestamps[change._number]) >= new Date(change.updated);
    } catch (e) {
    }

    var tr = document.createElement('tr');
    var link = document.createElement('td');
    var message = document.createElement('td');

    var a = document.createElement('a');
    a.href = '#';
    a.addEventListener('click', function(e) {
        chrome.tabs.update(null, {
            url: BASE_URL + '/' + change._number
          });
      });

    a.textContent = 'cl/' + change._number;
    link.appendChild(a);

    message.textContent = change.subject;

    tr.appendChild(link);
    tr.appendChild(message);
    tr.appendChild(getDelta(change));
    if (typeof change.labels != 'undefined') {
      tr.appendChild(getCodeReview(change));
      tr.appendChild(getVerified(change));
    }

    if (change.read) {
      tr.className = 'read';
    }

    // TODO Use change.labels.Verified and change.labels.Code-Review here
    // See https://gerrit.magicleap.com/Documentation/rest-api-changes.html#list-changes
    list.appendChild(tr);
  }
}

document.addEventListener('DOMContentLoaded', function() {
    chrome.storage.local.get(['changes', 'timestamps'], initUI);
  });

chrome.storage.onChanged.addListener(function(changes, namespace) {
    if (changes.changes && changes.timestamps) {
      initUI({
          'changes': changes.changes.newValue,
          'timestamps': changes.timestamps.newValue
        });
    } else {
      chrome.storage.local.get(['changes', 'timestamps'], initUI);
    }
  });

@@ -1,50 +1,4 @@
-var BASE_URL = localStorage%5B'api_endpoint'%5D;%0A%0A
 func
@@ -1568,16 +1568,65 @@
  = '#';%0A
+    var BASE_URL = localStorage%5B'api_endpoint'%5D;%0A
     a.ad
@@ -1659,26 +1659,24 @@
 nction(e) %7B%0A
-  
       chrome
@@ -1706,18 +1706,16 @@
         
-  
 url: BAS
@@ -1732,48 +1732,107 @@
 ' + 
-change._number%0A          %7D);%0A      %7D
+this.getAttribute('change-id')%0A      %7D);%0A    %7D);%0A%0A    a.setAttribute('change-id', change._number
 );%0A
-%0A
     
@@ -2489,18 +2489,16 @@
 ion() %7B%0A
-  
   chrome
@@ -2552,18 +2552,16 @@
 nitUI);%0A
-  
 %7D);%0A%0Achr
@@ -2625,18 +2625,16 @@
 pace) %7B%0A
-  
   if (ch
@@ -2676,18 +2676,16 @@
 ) %7B%0A    
-  
 initUI(%7B
@@ -2685,18 +2685,16 @@
 nitUI(%7B%0A
-  
         
@@ -2730,18 +2730,16 @@
 wValue,%0A
-  
         
@@ -2784,20 +2784,16 @@
 lue%0A
-    
     %7D);%0A
     
@@ -2788,18 +2788,16 @@
     %7D);%0A
-  
   %7D else
@@ -2799,18 +2799,16 @@
  else %7B%0A
-  
     chro
@@ -2870,14 +2870,10 @@
 ;%0A  
-  %7D%0A  
+%7D%0A
 %7D);%0A

Fix link on popup (#17)