Merge branch 'reviewCells' into main

rollup.config.js

@@ -19,7 +19,10 @@ export default {
     chunkFileNames: path.join('chunks', '[name]-[hash].js'),
   },
   plugins: [
-    chromeExtension({ browserPolyfill: true, dynamicImportWrapper: false }),
+    chromeExtension({
+      browserPolyfill: true,
+      dynamicImportWrapper: false,
+    }),
     // Adds a Chrome extension reloader during watch mode
     simpleReloader(),
     resolve(),

src/content/components/index.tsx

@@ -11,7 +11,7 @@ function reducer(state: any, action: any) {
   return state
 }
 
-const initialState = {};
+const initialState = {}
 
 export const WayfarerUltra = (): JSX.Element => {
   const [state, dispatch] = useReducer(reducer, initialState)

src/content/components/presets.tsx

@@ -16,6 +16,7 @@ import Icon from '@material-ui/core/Icon'
 
 import { PresetsTable } from './presets-table'
 import { SmartSubmit } from './smart-submit'
+import { ReviewCells } from './review-cells'
 import type { PresetConfig, PresetScoreKey, FlatPreset } from '../config'
 import { applyPreset } from '../utils'
 
@@ -183,6 +184,7 @@ const PresetsNoMemo = (): JSX.Element => {
           </Fab>
         </Tooltip>
         <SmartSubmit />
+        <ReviewCells />
         <Dialog
           fullWidth
           maxWidth="xl"

src/content/components/review-cells.tsx

@@ -0,0 +1,25 @@
+import React from 'react'
+import Tooltip from '@material-ui/core/Tooltip'
+
+import Fab from '@material-ui/core/Fab'
+import Icon from '@material-ui/core/Icon'
+
+export const ReviewCells = (): JSX.Element | null => {
+
+  const handleClick = () => {
+    window.postMessage(
+      { sender: 'wfpu', type: 'reviewCells' },
+      window.location.origin,
+    )
+  }
+
+  return (
+    <>
+      <Tooltip title="Apply Map Mods">
+        <Fab color="primary" onClick={handleClick}>
+          <Icon>map</Icon>
+        </Fab>
+      </Tooltip>
+    </>
+  )
+}

src/content/hook.ts

@@ -19,7 +19,7 @@ declare const window: Window &
 
 const DEBUG = false
 
-function codeToInject() {
+function codeToInject(WFPU) {
   // const oldDevTools = window['__REDUX_DEVTOOLS_EXTENSION__']
   const sendMessage =
     (type: string) =>
@@ -53,14 +53,102 @@ function codeToInject() {
     send: sendMessage('send'),
   }
 
+  function addLowestDistCircle(gMap, lat, lng) {
+    const latLng = new google.maps.LatLng(lat, lng)
+    const c = new google.maps.Circle({
+      map: gMap,
+      center: latLng,
+      radius: 20,
+      strokeColor: 'red',
+      fillColor: 'red',
+      strokeOpacity: 0.8,
+      strokeWeight: 1,
+      fillOpacity: 0.2,
+    })
+    return c
+  }
+
   window.__REDUX_DEVTOOLS_EXTENSION__ = devTools
+  window.WFPU = WFPU
+
+  window.addEventListener('message', (ev) => {
+    if (ev.origin !== location.origin) {
+      console.log('not good origin')
+
+      return
+    }
+
+    if (ev.data && ev.data.type === 'reviewCells') {
+      const map1 = document.querySelector('app-check-duplicates nia-map')
+      const map2 = document.querySelector('app-location-accuracy nia-map')
+      const map1Ctx = map1.__ngContext__.at(-1)
+      const map2Ctx = map2.__ngContext__.at(-1)
+
+      // Add Precise Markers
+      map1Ctx.markers.nearby.markers = map1Ctx.markers.nearby.markers.map(
+        (marker) => ({
+          ...marker,
+          icon: {
+            ...marker.icon,
+            url: WFPU.extensionURL + 'icons/precise-marker.svg',
+          },
+        }),
+      )
+      map1Ctx.markers.default.markers = map1Ctx.markers.default.markers.map(
+        (marker) => ({
+          ...marker,
+          icon: {
+            ...marker.icon,
+            url: WFPU.extensionURL + 'icons/precise-marker-green.svg',
+          },
+        }),
+      )
+
+      map2Ctx.markers.nearby = map1Ctx.markers.nearby
+
+      // Controls
+      Array.from(document.querySelectorAll('nia-map')).forEach((map) => {
+        const i = map.__ngContext__.length - 1
+        const c = map.__ngContext__[i].componentRef
+        c.showMapTypeControl =
+          c.showRotateControl =
+          c.showStreetViewControl =
+          c.showZoomControl =
+            true
+      })
+
+      // Cells
+      Array.from(document.querySelectorAll('agm-map')).forEach((map) => {
+        const c = map.__ngContext__[8]
+        c.updateS2CellLevel(17)
+      })
+      // circle to check duplicates
+
+      const ref1 = map1Ctx.componentRef
+      addLowestDistCircle(
+        ref1.map,
+        ref1.markers.default.markers[0].latitude,
+        ref1.markers.default.markers[0].longitude,
+      )
+
+      // circle to check duplicates
+      const ref2 = map2Ctx.componentRef
+      const target = ref2.markers.default || ref2.markers.suggested
+      addLowestDistCircle(
+        ref2.map,
+        target.markers[0].latitude,
+        target.markers[0].longitude,
+      )
+    }
+  })
 }
 
 export const embed = (fn: () => void): void => {
+  const WFPU = { extensionURL: browser.runtime.getURL('') }
   const script = document.createElement('script')
   const target = document.head || document.documentElement
   script.id = 'wfpu'
-  script.text = `(${fn.toString()})();`
+  script.text = `(${fn.toString()})(${JSON.stringify(WFPU, null, 4)});`
   target.insertBefore(script, target.firstChild)
 }
 

src/manifest.json

@@ -4,8 +4,13 @@
     {
       "run_at": "document_start",
       "js": ["content/index.tsx"],
-      "matches": ["https://wayfarer.nianticlabs.com/new/*", "https://wayfarer.nianticlabs.com/*"]
+      "matches": [
+        "https://wayfarer.nianticlabs.com/new/*",
+        "https://wayfarer.nianticlabs.com/*"
+      ]
     }
   ],
+  "web_accessible_resources": ["**/*.svg"],
+
   "browser_action": { "default_popup": "pages/popup/index.html" }
 }