IndexedDBUSC.js

/* eslint array-callback-return: "error" */
/* eslint block-scoped-var: "error" */
/* eslint no-implied-eval: "error" */
/* eslint comma-style: ["error", "first"] */
/* eslint max-len: ["error", 191] */
/* eslint max-params: ["error", 3] */
/* eslint-env es6 */
/* eslint newline-per-chained-call: ["error", { "ignoreChainWithDepth": 1 }] */
/* eslint operator-linebreak: [2, "before"] */

const dataLayerPageData = Object.assign({}, window.dataLayer.filter(({event}) => event === "USC_onLoad"))
const foo = () => {
  let dbVersion = 0
  const dbName = 'db'
  const objStoreName = 'opUSCHistory'
  let action = 'doNothingYet'
  const getAction = () => {
    console.log(action)
    return action
  }

  const isDBavailable = (foo) => {
    const requestRead = window.indexedDB.open(dbName)
    requestRead.onblocked = evt => console.log('requestRead onblocked ', evt)
    requestRead.onerror = evt => console.log('requestRead onerror ', evt)
    requestRead.onupgradeneeded = evt => console.log('requestRead onupgradeneeded ', evt)
    requestRead.onsuccess = evt => {
      console.log('requestRead onsuccess: ', requestRead.result)
      const db = requestRead.result
      db.onabort = evt => console.log('requestRead db onabort: ', evt, db)
      db.onclose = evt => {
        console.log('requestRead db onclose: ', evt, db)
        foo()
      }
      db.onerror = evt => console.log('requestRead db onerror: ', evt, db)
      db.onversionchange = evt => console.log('requestRead db onversionchange: ', evt, db)

      dbVersion = db.version
      const objStores = db.objectStoreNames // [...objStores] ?
      if (objStores.length) {
        console.log('Some objStores available: ', objStores)
        action = 'update'
      } else {
        console.log('Empty objStores')
        action = 'create'
      }
      db.close()
      return evt
    }
  }

  const dbcreate = () => {
    const requestWrite = window.indexedDB.open(dbName, dbVersion + 1)
    requestWrite.onblocked = evt => console.log('requestWrite onblocked: ', evt, requestWrite)
    requestWrite.onerror = evt => console.log('requestWrite onerror: ', evt, requestWrite)
    requestWrite.onsuccess = evt => console.log('requestWrite onsuccess: ', evt, requestWrite)
    requestWrite.onupgradeneeded = evt => {
      console.log('requestWrite onupgradeneeded: ', evt)
      const db = requestWrite.result
      db.onabort = evt => console.log('requestWrite db onabort: ', evt, db)
      db.onclose = evt => console.log('requestWrite db onclose: ', evt, db)
      db.onerror = evt => console.log('requestWrite db onerror: ', evt, db)
      db.onversionchange = evt => console.log('requestWrite db onversionchange: ', evt, db)

      const objStore = db.createObjectStore(objStoreName, {'autoIcrement': true})
      console.log('requestWrite createObjectStore: ', objStore)

      const tr = objStore.transaction
      console.log('requestWrite ObjectStore transaction: ', tr)
      tr.onabort = evt => console.log('requestWrite ObjectStore transaction onabort: ', evt)
      tr.onerror = evt => console.log('requestWrite ObjectStore transaction onerror: ', evt)
      tr.oncomplete = evt => {
        console.log('requestWrite ObjectStore transaction oncomplete: ', evt)
        const openTr = db.transaction(objStoreName, 'readwrite')
        console.log('requestWrite ObjectStore open transaction: ', openTr)
        openTr.onabort = evt => console.log('requestWrite ObjectStore open transaction onabort: ', evt, openTr)
        openTr.onerror = evt => console.log('requestWrite ObjectStore open transaction onerror: ', evt, openTr)
        openTr.oncomplete = evt => {
          console.log('requestWrite ObjectStore open transaction oncomplete: ', evt, openTr)
          openTr.db.close()
        }

        const transObjStore = openTr.objectStore(objStoreName)
        console.log('requestWrite ObjectStore access objectStore: ', transObjStore)
        console.log('requestWrite ObjectStore adding in objectStore: ', dataLayerPageData)
        const objStoreAdd = transObjStore.add(dataLayerPageData)
        console.log('requestWrite ObjectStore adding in objectStore done: ', objStoreAdd)
      }
    }
  }

  return () => ({
    isDBavailable
    , getAction
    , dbcreate
  })
}

const useDB = foo()()
useDB.isDBavailable()

setTimeout(() => {
  if (useDB.getAction() === 'create') {
    useDB.dbcreate()
  } else {
    console.log('Add data')
  }
}, 0)

localStorage.js

// @flow
/* eslint array-callback-return: "error" */
/* eslint block-scoped-var: "error" */
/* eslint no-implied-eval: "error" */
/* eslint comma-style: ["error", "first"] */
/* eslint max-len: ["error", 191] */
/* eslint max-params: ["error", 3] */
/* eslint-env es6 */
/* eslint newline-per-chained-call: ["error", { "ignoreChainWithDepth": 1 }] */
/* eslint operator-linebreak: [2, "before"] */

if (window.pageMeta_PageType === 'Home') {
  const opPersona = window.localStorage.getItem('opPersonna') || 'misc'
  window.saitama.log(`USC Homepage Takeover, personna is `, opPersona)
} else if (window.pageMeta_PageType === 'ProductDetail') {
  const getopStikyId = () => {
    let opgumCookie = false
    document.cookie.replace(/.*op1717plppages-backtotopgum=([^; ]*).*/, (match, p1) => {
      opgumCookie = p1
    })
    return opgumCookie
  }

  const fromSimilarItems = () => {
    const categoryTrim = category => category
    .replace(/.*\W?(Womens).*/, '$1')
    .replace(/.*\W?(Mens).*/, '$1')

    const byRecognisedCategory = (pool, cat) => {
      const segment = /\WMens|\WWomens/i.test(cat) ? categoryTrim(cat) : 'Misc'
      pool[segment] = (pool[segment] || 0) + 1
      return pool
    }

    return [...document.querySelectorAll('div#MoreFromLinks ul li')]
      .map(li => li.innerText)
      .reduce(byRecognisedCategory, {})
  }

  const findMainSegment = segments => {
    let mainCategory = 'Misc'
    if (segments.Mens) {
      if (segments.Womens && segments.Mens < segments.Womens) {
        mainCategory = 'Womens'
      }
      mainCategory = 'Mens'
    } else if (segments.Womens) {
      mainCategory = 'Womens'
    }
    return mainCategory
  }

  const pageData = Object.assign(
    {}
    , window.dataLayer
    .filter(({event}) => event === 'USC_onLoad')
    .reduce((x, {productId}) => ({
      productId
    }), {})
    , {
      'timestamp': Date.now()
      , 'stickyId': getopStikyId()
      , 'category': findMainSegment(fromSimilarItems())
    }
  )

  const refreshOpHistory = () => {
    const oldOpHistory = JSON.parse(window.localStorage.getItem('opHistory') || '[]')
    const opStikyId = getopStikyId()
    return oldOpHistory.filter(({stickyId}) => stickyId === opStikyId)
  }

  const updateOpHistory = pageData => {
    const opHistory = refreshOpHistory()
    if (3 <= opHistory.length) {
      opHistory.shift()
    }
    opHistory.push(pageData)
    return opHistory
  }

  const newOpHistory = updateOpHistory(pageData)
  window.localStorage.setItem('opHistory', JSON.stringify(newOpHistory))

  const decidePersona = (newOpHistory = []) => {
    const byCategory = (pool, cat) => {
      pool[cat] = (pool[cat] || 0) + 1
      return pool
    }
    const fromNewOpHistory = () => newOpHistory
      .map(({category}) => category)
      .reduce(byCategory, {})

    let persona = 'Misc'
    if (3 <= newOpHistory.length) {
      persona = findMainSegment(fromNewOpHistory())
    }
    return persona
  }
  window.localStorage.setItem('opPersonna', decidePersona(newOpHistory) || 'Misc')
}
// 'op1717homepagecookietakeovergum' 'op1717plppages-backtotopgum'

simple.js

// @flow
/* eslint array-callback-return: "error" */
/* eslint block-scoped-var: "error" */
/* eslint no-implied-eval: "error" */
/* eslint comma-style: ["error", "first"] */
/* eslint max-len: ["error", 191] */
/* eslint max-params: ["error", 3] */
/* eslint-env es6 */
/* eslint newline-per-chained-call: ["error", { "ignoreChainWithDepth": 1 }] */
/* eslint operator-linebreak: [2, "before"] */

const dataLayerPageData = Object.assign(
  {}
  , window.dataLayer
      .filter(({event}) => event === 'USC_onLoad')
      .reduce((x, y) => y, {})
    )
const foo = () => {
  let dbVersion = 0
  const dbName = 'db'
  const objStoreName = 'opUSCHistory'
  let action = 'doNothingYet'
  const getAction = () => {
    console.log(action)
    return action
  }

  const isDBavailable = () => {
    const requestRead = window.indexedDB.open(dbName)
    requestRead.onblocked = evt => console.log('requestRead onblocked ', evt)
    requestRead.onerror = evt => console.log('requestRead onerror ', evt)
    requestRead.onupgradeneeded = evt => console.log('requestRead onupgradeneeded ', evt)
    requestRead.onsuccess = evt => {
      console.log('requestRead onsuccess: ', requestRead.result)
      const db = requestRead.result
      db.onabort = evt => console.log('requestRead db onabort: ', evt, db)
      db.onclose = evt => {
        console.log('requestRead db onclose: ', evt, db)
      }
      db.onerror = evt => console.log('requestRead db onerror: ', evt, db)
      db.onversionchange = evt => console.log('requestRead db onversionchange: ', evt, db)

      dbVersion = db.version
      const objStores = db.objectStoreNames // [...objStores] ?
      if (objStores.length) {
        console.log('Some objStores available: ', objStores)
        action = 'update'
      } else {
        console.log('Empty objStores')
        action = 'create'
      }
      db.close()
      return evt
    }
  }

  const dbcreate = () => {
    const requestWrite = window.indexedDB.open(dbName, dbVersion + 1)
    requestWrite.onupgradeneeded = evt => {
      const db = requestWrite.result
      const objectStore = db.createObjectStore(
        objStoreName
        , {'autoIncrement': true}
      )
      objectStore.transaction.oncomplete = evt => {
        db.transaction(objStoreName, 'readwrite')
          .objectStore(objStoreName)
          .add(dataLayerPageData)
      }
    }
  }

  return () => ({
    isDBavailable
    , getAction
    , dbcreate
  })
}

const useDB = foo()()
useDB.isDBavailable()

setTimeout(() => {
  if (useDB.getAction() === 'create') {
    useDB.dbcreate()
  } else {
    console.log('Add data')
  }
}, 1000)