New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
mpa-enhancer
Advanced tools
mpa-enhancer - npm Package Compare versions
Comparing version 2.1.1 to 2.2.0
@@ -17,3 +17,5 @@ // @ts-check | ||
| function getCleanUrlPath() { | ||
| function getPageName() { | ||
| let pageName = doc.body.getAttribute('mpa-page-name') | ||
| if (pageName) return pageName | ||
| let url = new URL(doc.location.href) | ||
@@ -23,2 +25,3 @@ return url.pathname.replace(/\/$/, "") | ||
| let lastClick = null | ||
@@ -30,6 +33,17 @@ w.addEventListener('click', e => { | ||
| w.addEventListener('beforeunload', () => { | ||
| let data = getData() || {} | ||
| let persistedPages = new Set(data.__ || []) | ||
| let pageName = getPageName() | ||
| if (hasAttr(doc.body, 'mpa-persist')) { | ||
| persistedPages.add(pageName) | ||
| data.__ = Array.from(persistedPages) | ||
| } | ||
| for (let key in Object.keys(data)) { | ||
| if (persistedPages.has(key) || key === '__') continue | ||
| delete data[key] | ||
| } | ||
| let active = doc.activeElement | ||
| let target = doc.activeElement === doc.body ? lastClick : active | ||
| localStorage.pageLocation = JSON.stringify({ | ||
| href: getCleanUrlPath(), | ||
| data[pageName] = { | ||
| y: w.scrollY, | ||
@@ -41,3 +55,4 @@ height: doc.body.scrollHeight, | ||
| } | ||
| }) | ||
| } | ||
| localStorage.pageLocations = JSON.stringify(data) | ||
| }) | ||
@@ -47,5 +62,5 @@ | ||
| if (query('[autofocus]')) return | ||
| let location = localStorage.pageLocation | ||
| let location = getData(getPageName()) | ||
| if (!location) return | ||
| let { y, height, href, active: { id, name } } = JSON.parse(location) | ||
| let { y, height, active: { id, name } } = location | ||
@@ -60,5 +75,3 @@ let active = | ||
| if (!hasAttr(doc.body, 'mpa-skip-scroll') | ||
| && href === getCleanUrlPath() | ||
| && y) { | ||
| if (!hasAttr(doc.body, 'mpa-skip-scroll') && y) { | ||
| w.scrollTo({ top: y + doc.body.scrollHeight - height }) | ||
@@ -76,2 +89,11 @@ } | ||
| /** | ||
| * @param {string} [name] | ||
| */ | ||
| function getData(name) { | ||
| let data = localStorage.pageLocations | ||
| data = data && JSON.parse(data) | ||
| return name == null ? data : data && data[name] | ||
| } | ||
| load() | ||
@@ -78,0 +100,0 @@ |
| { | ||
| "name": "mpa-enhancer", | ||
| "version": "2.1.1", | ||
| "version": "2.2.0", | ||
| "description": "Minimalist JavaScript to make your MPA work that much better", | ||
| "bugs": { | ||
| "url": "https://github.com/jon49/mpa-enhancer/issues" | ||
| }, | ||
| "homepage": "https://github.com/jon49/mpa-enhancer#readme", | ||
| "main": "src/mpa.js", | ||
@@ -16,4 +20,4 @@ "scripts": { | ||
| }, | ||
| "author": "", | ||
| "license": "ISC", | ||
| "author": "Jon Nyman", | ||
| "license": "MIT", | ||
| "devDependencies": { | ||
@@ -20,0 +24,0 @@ "esbuild": "^0.18.3" |
@@ -8,8 +8,51 @@ # MPA Enhancer | ||
| Under 1 kB of minified JavaScript. | ||
| At 1.1 kB of minified JavaScript. | ||
| [Example TODO MVC application.](https://jon49.github.io/mpa-enhancer/todo/) | ||
| ## Docs | ||
| Install by downloading and linking to the script. You can use NPM too and copy | ||
| it from there. | ||
| ### Attributes | ||
| These attributes can enable the enhancer to make special accommodation to your | ||
| pages. | ||
| `mpa-page-name`: This overrides the default page name (the pathname in your | ||
| URL). Use it like so: | ||
| ```html | ||
| <body mpa-page-name="my-page-name"> | ||
| ``` | ||
| `mpa-persist`: This will persist the page location even when you change pages | ||
| and come back later. Use it like so: | ||
| ```html | ||
| <body mpa-persist> | ||
| ``` | ||
| `mpa-skip-focus`: This will skip the focus of the element that you are on on | ||
| page refresh. Use it like so: | ||
| ```html | ||
| <input name=my-name mpa-skip-focus> | ||
| ``` | ||
| `mpa-skip-scroll`: This will skip the scrolling of the page. This is useful | ||
| when you focus in a location and don't want the scroll to move it to the new | ||
| spot. Use it like so: | ||
| ```html | ||
| <input name=my-name mpa-skip-scroll> | ||
| ``` | ||
| ## Change Log | ||
| **2.2.0** | ||
| Added ability to persist pages and name a page different than the URL pathname. | ||
| **2.1.1**: | ||
@@ -16,0 +59,0 @@ |
@@ -17,3 +17,5 @@ // @ts-check | ||
| function getCleanUrlPath() { | ||
| function getPageName() { | ||
| let pageName = doc.body.getAttribute('mpa-page-name') | ||
| if (pageName) return pageName | ||
| let url = new URL(doc.location.href) | ||
@@ -23,2 +25,3 @@ return url.pathname.replace(/\/$/, "") | ||
| let lastClick = null | ||
@@ -30,6 +33,17 @@ w.addEventListener('click', e => { | ||
| w.addEventListener('beforeunload', () => { | ||
| let data = getData() || {} | ||
| let persistedPages = new Set(data.__ || []) | ||
| let pageName = getPageName() | ||
| if (hasAttr(doc.body, 'mpa-persist')) { | ||
| persistedPages.add(pageName) | ||
| data.__ = Array.from(persistedPages) | ||
| } | ||
| for (let key in Object.keys(data)) { | ||
| if (persistedPages.has(key) || key === '__') continue | ||
| delete data[key] | ||
| } | ||
| let active = doc.activeElement | ||
| let target = doc.activeElement === doc.body ? lastClick : active | ||
| localStorage.pageLocation = JSON.stringify({ | ||
| href: getCleanUrlPath(), | ||
| data[pageName] = { | ||
| y: w.scrollY, | ||
@@ -41,3 +55,4 @@ height: doc.body.scrollHeight, | ||
| } | ||
| }) | ||
| } | ||
| localStorage.pageLocations = JSON.stringify(data) | ||
| }) | ||
@@ -47,5 +62,5 @@ | ||
| if (query('[autofocus]')) return | ||
| let location = localStorage.pageLocation | ||
| let location = getData(getPageName()) | ||
| if (!location) return | ||
| let { y, height, href, active: { id, name } } = JSON.parse(location) | ||
| let { y, height, active: { id, name } } = location | ||
@@ -60,5 +75,3 @@ let active = | ||
| if (!hasAttr(doc.body, 'mpa-skip-scroll') | ||
| && href === getCleanUrlPath() | ||
| && y) { | ||
| if (!hasAttr(doc.body, 'mpa-skip-scroll') && y) { | ||
| w.scrollTo({ top: y + doc.body.scrollHeight - height }) | ||
@@ -76,2 +89,11 @@ } | ||
| /** | ||
| * @param {string} [name] | ||
| */ | ||
| function getData(name) { | ||
| let data = localStorage.pageLocations | ||
| data = data && JSON.parse(data) | ||
| return name == null ? data : data && data[name] | ||
| } | ||
| load() | ||
@@ -78,0 +100,0 @@ |
@@ -1,1 +0,1 @@ | ||
| (()=>{let l=document,a=window,n=l.querySelector.bind(l);function o(e,t){return e?.hasAttribute(t)}function r(){return new URL(l.location.href).pathname.replace(/\/$/,"")}let c=null;a.addEventListener("click",e=>{c=e.target}),a.addEventListener("beforeunload",()=>{let e=l.activeElement,t=l.activeElement===l.body?c:e;localStorage.pageLocation=JSON.stringify({href:r(),y:a.scrollY,height:l.body.scrollHeight,active:{id:t?.id,name:t?.getAttribute("name")}})});function s(){if(n("[autofocus]"))return;let e=localStorage.pageLocation;if(!e)return;let{y:t,height:d,href:f,active:{id:g,name:h}}=JSON.parse(e),i=l.getElementById(g)||n(`[name="${h}"]`);o(i,"mpa-skip-focus")||(u("focus",i),u("select",i)),!o(l.body,"mpa-skip-scroll")&&f===r()&&t&&a.scrollTo({top:t+l.body.scrollHeight-d})}function u(e,t){t&&t[e]&&t[e]()}s()})(); | ||
| (()=>{let a=document,l=window,u=a.querySelector.bind(a);function o(e,t){return e?.hasAttribute(t)}function s(){let e=a.body.getAttribute("mpa-page-name");return e||new URL(a.location.href).pathname.replace(/\/$/,"")}let d=null;l.addEventListener("click",e=>{d=e.target}),l.addEventListener("beforeunload",()=>{let e=f()||{},t=new Set(e.__||[]),n=s();o(a.body,"mpa-persist")&&(t.add(n),e.__=Array.from(t));for(let i in Object.keys(e))t.has(i)||i==="__"||delete e[i];let c=a.activeElement,r=a.activeElement===a.body?d:c;e[n]={y:l.scrollY,height:a.body.scrollHeight,active:{id:r?.id,name:r?.getAttribute("name")}},localStorage.pageLocations=JSON.stringify(e)});function p(){if(u("[autofocus]"))return;let e=f(s());if(!e)return;let{y:t,height:n,active:{id:c,name:r}}=e,i=a.getElementById(c)||u(`[name="${r}"]`);o(i,"mpa-skip-focus")||(g("focus",i),g("select",i)),!o(a.body,"mpa-skip-scroll")&&t&&l.scrollTo({top:t+a.body.scrollHeight-n})}function g(e,t){t&&t[e]&&t[e]()}function f(e){let t=localStorage.pageLocations;return t=t&&JSON.parse(t),e==null?t:t&&t[e]}p()})(); |
Fixed alerts
Mixed license
License(Experimental) Package contains multiple licenses.
Found 1 instance in 1 package
No contributors or author data
MaintenancePackage does not specify a list of contributors or an author in package.json.
Found 1 instance in 1 package
No bug tracker
MaintenancePackage does not have a linked bug tracker in package.json.
Found 1 instance in 1 package
No website
QualityPackage does not have a website.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by5.88%
45686
- Number of low license alerts
- decreased by-100%
0
- Lines of code
- increased by2.77%
1448
- Number of low maintenance alerts
- decreased by-100%
0
- Number of low quality alerts
- decreased by-100%
0
- Number of lines in readme file
- increased by148.28%
72
No dependency changes