theme reorx: remember scroll position

src/editor/main.js

@@ -179,7 +179,7 @@ $btnNewData.on('click', () => {
 })
 
 $btnUploadData.on('click', () => {
-  if (!confirm('Are you sure to upload an existing CV data? Your current data will be covered.')) return
+  if (!confirm('Are you sure to upload an existing CV data? Your current data will be replaced.')) return
   $inputUploadData.trigger('click')
 })
 
@@ -233,7 +233,7 @@ $btnDownloadHTML.on('click', () => {
 })
 
 $btnLoadSample.on('click', () => {
-  if (!confirm('Are you sure to load sample data? Your current data will be covered.')) return
+  if (!confirm('Are you sure to load sample data? Your current data will be replaced.')) return
 
   editor.setValue(sampleModule.default)
 })

src/preview/main.js

@@ -4,17 +4,42 @@ import {
   getCVData,
   getCVSavedTime,
 } from '../lib/store';
-import { applyThemeTo } from '../themes';
+import { renderThemeOn } from '../themes';
 import { getCVTitle } from '../themes/data';
 
 const themeName = 'default'
 const elCV = document.querySelector('.cv-container')
 
+// Save scroll position on page unload
+const storeKeyScroll = 'scroll-position'
+const onScroll = () => {
+  localStorage.setItem(storeKeyScroll, JSON.stringify({
+    scrollX: window.scrollX,
+    scrollY: window.scrollY,
+  }));
+}
+let onScrollTimer
+window.addEventListener("scroll", () => {
+  if (onScrollTimer) clearTimeout(onScrollTimer)
+
+  onScrollTimer = setTimeout(onScroll, 50);
+}, false)
+
+const restoreScrollPosition = () => {
+  const scrollPosition = JSON.parse(localStorage.getItem(storeKeyScroll));
+  if (scrollPosition) {
+    window.scrollTo(scrollPosition.scrollX, scrollPosition.scrollY);
+  }
+}
+
+// Render CV
 const data = getCVData()
 if (data) {
-  applyThemeTo(themeName, elCV, data)
+  renderThemeOn(themeName, elCV, data)
   // change document title
   document.title = getCVTitle(data)
+  // restore scroll position
+  restoreScrollPosition()
 }
 
 const savedTime = getCVSavedTime()

src/themes/index.js

@@ -36,7 +36,7 @@ export function renderTheme(template, cvData, options) {
 
 const cvStyleId = 'cv-style'
 
-export function applyThemeTo(name, el, data) {
+export function renderThemeOn(name, el, data) {
   const theme = getTheme(name)
   el.innerHTML = renderTheme(theme.template, data)