Browse Source

persist nav scroll position

Heydon Pickering 8 years ago
parent
commit
aba81a27e5

+ 1 - 0
package.json

@@ -4,6 +4,7 @@
   "description": "An inclusive pattern library builder for documenting inclusive interface design",
   "description": "An inclusive pattern library builder for documenting inclusive interface design",
   "main": "index.js",
   "main": "index.js",
   "scripts": {
   "scripts": {
+    "getURL": "git remote -v | sed -n '/push/p' | awk '{print $2}' | sed 's/.*:\\(.*\\).git/\\1/' | awk -F\"/\" '{print $1\".github.io/\"$2}'",
     "test": "echo \"Error: no test specified\" && exit 1",
     "test": "echo \"Error: no test specified\" && exit 1",
     "serve": "hugo server",
     "serve": "hugo server",
     "clean": "rm -rf content && mkdir content && mkdir content/patterns && hugo new patterns/pattern.md && hugo new _index.md",
     "clean": "rm -rf content && mkdir content && mkdir content/patterns && hugo new patterns/pattern.md && hugo new _index.md",

+ 7 - 0
public/patterns/writing/expandable-sections/index.html

@@ -273,6 +273,13 @@ Here is some markdown including [a link](https://twitter.com/heydonworks). Donec
 
 
 <p>Unfortunately, it is not currently possible to include shortcodes inside other shortcodes, using the &ldquo;<code>%</code>&rdquo; notation (which is designated for markdown content). If you use the angle brackets notation (illustrated below) it is possible, but markdown will no longer be permitted. You will have to code HTML inside such a section manually.</p>
 <p>Unfortunately, it is not currently possible to include shortcodes inside other shortcodes, using the &ldquo;<code>%</code>&rdquo; notation (which is designated for markdown content). If you use the angle brackets notation (illustrated below) it is possible, but markdown will no longer be permitted. You will have to code HTML inside such a section manually.</p>
 
 
+<pre class=" "><code  data-codeblock-shortcode>
+&#x7b;{&lt;expandable label="A section of dummy text" level="2">}}
+&lt;p>Here is a pattern reference shortcode: &#x7b;{% pattern "Writing inline demos" %}}.&lt;/p>
+&#x7b;{&lt;/expandable>}}
+</code></pre>
+
+
   </main>
   </main>
 
 
           <footer role="contentinfo">
           <footer role="contentinfo">

+ 1 - 1
themes/infusion/layouts/_default/baseof.html

@@ -26,7 +26,7 @@
             </a>
             </a>
             <p class="library-desc">{{ .Site.Params.Description | safeHTML }}</p>
             <p class="library-desc">{{ .Site.Params.Description | safeHTML }}</p>
           </div>
           </div>
-          <nav class="patterns" role="navigation">
+          <nav id="patterns-nav" class="patterns" role="navigation">
             {{ $current := . }}
             {{ $current := . }}
             {{ range $.Site.Home.Sections }}
             {{ range $.Site.Home.Sections }}
               <ul>
               <ul>

+ 11 - 3
themes/infusion/static/js/dom-scripts.js

@@ -1,7 +1,5 @@
 /* expandable sections */
 /* expandable sections */
 (function () {
 (function () {
-  'use strict'
-
   function toggle (button, target) {
   function toggle (button, target) {
     var expanded = button.getAttribute('aria-expanded') === 'true' || false
     var expanded = button.getAttribute('aria-expanded') === 'true' || false
     button.setAttribute('aria-expanded', !expanded)
     button.setAttribute('aria-expanded', !expanded)
@@ -11,7 +9,6 @@
   var expanders = document.querySelectorAll('[data-expands]')
   var expanders = document.querySelectorAll('[data-expands]')
 
 
   Array.prototype.forEach.call(expanders, function (expander) {
   Array.prototype.forEach.call(expanders, function (expander) {
-    console.log(expander)
     var target = document.getElementById(expander.getAttribute('data-expands'))
     var target = document.getElementById(expander.getAttribute('data-expands'))
 
 
     expander.addEventListener('click', function () {
     expander.addEventListener('click', function () {
@@ -20,3 +17,14 @@
   })
   })
 
 
 }())
 }())
+
+/* persist navigation scroll point */
+window.addEventListener('unload', function() {
+  var scrollPoint = document.getElementById('patterns-nav').scrollTop
+  localStorage.setItem('scrollPoint', scrollPoint)
+  console.log('scrollPoint:', localStorage.getItem('scrollPoint'))
+})
+
+window.addEventListener('load', function() {
+  document.getElementById('patterns-nav').scrollTop = parseInt(localStorage.getItem('scrollPoint'))
+})

+ 2 - 0
themes/infusion/static/js/webcomponents.js

@@ -147,3 +147,5 @@ k.prototype.setElementClass=k.prototype.Ja;k.prototype._styleInfoForNode=k.proto
 {ScopingShim:G,prepareTemplate:function(a,b,c){G.f();G.prepareTemplate(a,b,c)},styleSubtree:function(a,b){G.f();G.styleSubtree(a,b)},styleElement:function(a){G.f();G.styleElement(a)},styleDocument:function(a){G.f();G.styleDocument(a)},getComputedStyleValue:function(a,b){return G.getComputedStyleValue(a,b)},nativeCss:v,nativeShadow:u};fb&&(window.ShadyCSS.ApplyShim=fb);gb&&(window.ShadyCSS.CustomStyleInterface=gb);(function(){function a(){requestAnimationFrame(function(){window.WebComponents.ready=
 {ScopingShim:G,prepareTemplate:function(a,b,c){G.f();G.prepareTemplate(a,b,c)},styleSubtree:function(a,b){G.f();G.styleSubtree(a,b)},styleElement:function(a){G.f();G.styleElement(a)},styleDocument:function(a){G.f();G.styleDocument(a)},getComputedStyleValue:function(a,b){return G.getComputedStyleValue(a,b)},nativeCss:v,nativeShadow:u};fb&&(window.ShadyCSS.ApplyShim=fb);gb&&(window.ShadyCSS.CustomStyleInterface=gb);(function(){function a(){requestAnimationFrame(function(){window.WebComponents.ready=
 !0;window.document.dispatchEvent(new CustomEvent("WebComponentsReady",{bubbles:!0}))})}function b(){a();c.removeEventListener("readystatechange",b)}var c=window.document;window.WebComponents=window.WebComponents||{};"loading"!==c.readyState?a():c.addEventListener("readystatechange",b)})()})();
 !0;window.document.dispatchEvent(new CustomEvent("WebComponentsReady",{bubbles:!0}))})}function b(){a();c.removeEventListener("readystatechange",b)}var c=window.document;window.WebComponents=window.WebComponents||{};"loading"!==c.readyState?a():c.addEventListener("readystatechange",b)})()})();
 }).call(self)
 }).call(self)
+
+//# sourceMappingURL=webcomponents-sd-ce.js.map