Merge pull request #35 from rumkin/v1.4

V1.4.1

.eslintignore

@@ -1,3 +1,5 @@
 /dist/
 /node_modules/
-/example/
+
+/example/pill.js
+/example/pill.min.js

.npmignore

@@ -2,8 +2,8 @@
 .eslintignore
 .editorconfig
 
-bin/
-example/
-local/
-src/
-tmp/
+/bin/
+/example/
+/local/
+/src/
+/tmp/

example/site.js

@@ -1,3 +1,5 @@
+/* globals pill */
+/* eslint-disable no-console */
 const indicator = document.getElementById('indicator')
 
 let timeout = 0
@@ -12,46 +14,49 @@ pill('#page', {
     indicator.style.display = 'block'
   },
   onUnmounting(page, url, element) {
-    PreserveFormPlugin(element)
+    preserveFormPlugin(element)
   },
   onReady(page, element) {
     // Delay to simulate long content loading
     timeout = setTimeout(() => {
       indicator.style.display = 'none'
     }, 1000)
-    PopulateFormPlugin(element)
+    populateFormPlugin(element)
   },
   onMounting() {
     console.log('updating content')
-  }
+  },
+  listenClickEventOn: '#page',
 })
 
-const PopulateFormPlugin = element =>{
-  const key = location.pathname;
+function populateFormPlugin(element) {
+  const key = location.pathname
   const fields = Array.from(element.querySelectorAll('input, textarea, select'))
   if (fields.length > 0) {
     const obj = JSON.parse(localStorage.getItem(key) || '[]')
     obj.forEach((field) => {
       const input = document.querySelector('[name=' + field.fieldName + ']')
       if (input.type === 'checkbox' || input.type === 'radio') {
         input.checked = field.value
-      } else if (input.nodeName === 'TEXTAREA') {
+      }
+      else if (input.nodeName === 'TEXTAREA') {
         input.textContent = field.value
-      } else {
+      }
+      else {
         input.value = field.value
       }
     })
   }
 }
 
-const PreserveFormPlugin = (element) =>{
+function preserveFormPlugin(element) {
   const key = location.pathname
   const fields = Array.from(element.querySelectorAll('input, textarea, select'))
   if (fields.length > 0) {
     const values = fields.map((val) => {
       return {
         fieldName: val.name,
-        value: val.type == 'checkbox' || val.type == 'radio' ? val.checked : val.value
+        value: val.type === 'checkbox' || val.type === 'radio' ? val.checked : val.value,
       }
     })
     localStorage.setItem(key, JSON.stringify(values))

package.json

@@ -1,7 +1,7 @@
 {
   "name": "pill",
   "description": "Pill dynamic content loading for static sites.",
-  "version": "1.4.0",
+  "version": "1.4.1",
   "main": "dist/node/pill.js",
   "devDependencies": {
     "@codegoods/eslint-config-base": "^1.0.2",

src/pill.js

@@ -109,8 +109,9 @@ export default function pill(selector, options) {
       scrollToAnchor(url.hash.slice(1))
     }
   }
+
   // Initial scroll
-  updateState({scroll: window.scrollY}, currentUrl, currentPage.title, false)
+  updateState({scrollX: window.scrollX, scrollY: window.scrollY}, currentUrl, currentPage.title, false)
 
   function goto(url, push) {
     var cacheKey = keyFromUrl(url)
@@ -191,7 +192,9 @@ export default function pill(selector, options) {
   function onPopState(e) {
     goto(new URL(document.location), false)
     requestAnimationFrame(function() {
-      window.scrollTo(0, e.state.scroll || 0)
+      var scrollY = e.state && e.state.scrollY || 0
+      var scrollX = e.state && e.state.scrollX || 0
+      window.scrollTo(scrollX, scrollY)
     })
   }
 
@@ -202,12 +205,12 @@ export default function pill(selector, options) {
     }
 
     scrollDebounceTimeout = setTimeout(function () {
-      updateState({scroll: window.scrollY}, document.location, document.title, false)
+      updateState({scrollX: window.scrollX, scrollY: window.scrollY}, document.location, document.title, false)
       scrollDebounceTimeout = null
     }, 100)
   }
 
   document.body.addEventListener('click', onClick)
   window.addEventListener('popstate', onPopState)
   window.addEventListener('scroll', onScroll)
-}
+}