Merge pull request #13 from CCEM/development

Development

extension/background.js

@@ -1,6 +1,6 @@
 // this is the background code...
 
-// listen for our browerAction to be clicked
+// listen for our browserAction to be clicked
 chrome.browserAction.onClicked.addListener(function (tab) {
 	// for the current tab, inject the "inject.js" file & execute it
 	chrome.tabs.executeScript(tab.ib, {

extension/inject.js

@@ -1,17 +1,27 @@
 (function() {
-  let $grabFromPage = $('div.commentarea div.md p')
+  let $grabFromPage = $('div.commentarea div.md')
   let textToEval = {};
   $grabFromPage.addClass(function(index){
     return 'reddex' + index;
   });
-  // console.log($grabFromPage)
   $grabFromPage.each(function(index){
-    textToEval[$grabFromPage[index].className] = $grabFromPage[index].innerText;
+    textToEval[$grabFromPage[index].className.split(' ')[1]] = $grabFromPage[index].innerText;
   });
   console.log(textToEval)
   $.post('https://reddex.herokuapp.com/inbound', textToEval, function(response){
     console.log(response)
+    for(key in response){
+      $('.' + key).addClass(function(index){
+        if(response[key] <= -.3){
+          return 'neg1'
+        }
+        else if(response[key] > 0.3){
+          return 'pos1'
+        }
+        else{
+          return 'neu'
+        }
+      })
+    }
   });
-  // document.body.style.backgroundColor="red";
-
 })();

extension/manifest.json

@@ -18,8 +18,9 @@
   ],
   "content_scripts": [
     {
-      "matches": ["https://*.reddit.com/r/*"],
-      "js": ["jquery-3.2.1.min.js", "inject.js"]
+      "matches": [ "https://*.reddit.com/r/*" ],
+      "js": [ "jquery-3.2.1.min.js", "inject.js" ],
+      "css": [ "styles.css" ]
     }
   ],
   "web_accessible_resources": ["inject.js"]

extension/styles.css

@@ -0,0 +1,26 @@
+/*styles*/
+div.neg1 {
+  border-style: solid !important;
+  border-width: 2px !important;
+  border-color: rgba(255, 0, 0, 0.5) !important;
+}
+div.neg2 {
+  border-style: solid !important;
+  border-width: 2px !important;
+  border-color: rgba(255, 0, 0, 0.7) !important;
+}
+div.pos1 {
+  border-style: solid !important;
+  border-width: 2px !important;
+  border-color: rgba(0, 245, 33, 0.5) !important;
+}
+div.pos2 {
+  border-style: solid !important;
+  border-width: 2px !important;
+  border-color: rgba(0, 245, 33, 0.7) !important;
+}
+div.neu {
+  border-style: solid !important;
+  border-width: 2px !important;
+  border-color: rgba(0, 78, 245, 0.7) !important;
+}