Fetch/scrape distributions and calculate and dump CI

chrismbryant · Mar 28, 2020 · cba8071 · cba8071
1 parent 59ccdf3
commit cba8071
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 12 deletions.
diff --git a/src/chrome/inject.js b/src/chrome/inject.js
@@ -22,8 +22,9 @@ let scrollTicking = false
 
 function dumpAvgConfidence(product){
     const confidenceDOM = document.createElement("div");
+    confidenceDOM.style.marginTop = '.5em'
     const ci = calculations.evaluateAverageRating(product.rating, product.reviewCount)
-    confidenceDOM.innerHTML = `CI for score ${product.rating}, n=${product.reviewCount} is <br> proportion: ${ci.proportion} <br> lower: ${ci.lower} <br> upper: ${ci.upper}`;
+    confidenceDOM.innerHTML = `AVG CI for ${product.rating}, n=${product.reviewCount} is <br> proportion: ${ci.proportion} <br> lower: ${ci.lower} <br> upper: ${ci.upper}`;
     product.dom.insertAdjacentElement("beforeend", confidenceDOM);
 }
 
@@ -49,8 +50,13 @@ function handleScroll(evt){
 
 
 async function dumpDistConfidence(product){
-    scraper.getDistribution(product)
-    product.dom.style.backgroundColor = 'blue'
+    await scraper.loadDistributions(product)
+    product.dom.style.backgroundColor = 'lightblue'
+    const confidenceDOM = document.createElement("div");
+    confidenceDOM.style.marginTop = '.5em'
+    const ci = calculations.evaluateRatings(product.distributions, product.reviewCount)
+    confidenceDOM.innerHTML = `DIST CI for ${product.distributions}, n=${product.reviewCount} is <br> proportion: ${ci.proportion} <br> lower: ${ci.lower} <br> upper: ${ci.upper}`;
+    product.dom.insertAdjacentElement("beforeend", confidenceDOM);
 }
 
 
@@ -62,10 +68,10 @@ function productInView(product){
         right: window.innerWidth,
         bottom: window.innerHeight
     }
-    return !(
-        rect.right < view.left
-        || rect.left > view.right
-        || rect.bottom < view.top
-        || rect.top > view.bottom
+    return (
+        rect.right >= view.left
+        && rect.left <= view.right
+        && rect.bottom >= view.top
+        && rect.top <= view.bottom
     );
 }
diff --git a/src/shared/scraper.js b/src/shared/scraper.js
@@ -22,6 +22,7 @@ export default {
                 run()
             }
             function run(){
+                //TODO sometimes products are featured together, and this selects the entire block instead of each product
                 const images = document.querySelectorAll('[data-component-type=s-product-image]')
                 const products = [...images].map(image => image.closest('.a-section'))
                 resolve( products.map(product =>{
@@ -38,11 +39,18 @@ export default {
     },
 
     /**
-     * Retrieves the rating distribution for the given product
-     * @param {Product} product
+     * Loads rating distributions into the given product object
+     * @param {Product} product  If distributions are found, they will be added to this object
      */
-    getDistribution(product){
-        console.log(product.dom.querySelector('[data-a-popover]').dataset.aPopover)
+    async loadDistributions(product){
+        if(!product.reviewCount)  return
+        const popover = JSON.parse(product.dom.querySelector('[data-a-popover]').dataset.aPopover)
+        if(!popover.url)  return
+        const body = await fetch(popover.url).then(response => response.text())
+        // noinspection JSCheckFunctionSignatures
+        const dom = (new DOMParser()).parseFromString(body, 'text/html')
+        const distributions = dom.documentElement.querySelectorAll('#histogramTable td.a-text-right a')
+        product.distributions = [...distributions].map( distribution => parseFloat(distribution.innerText.trim()) / 100 )
     }
 
 }