From a2378ad8e2c3f588358f05b86524ecfafed0a8ee Mon Sep 17 00:00:00 2001
From: Clemens Wolff <clewolff@microsoft.com>
Date: Mon, 28 Jan 2019 13:02:24 -0500
Subject: [PATCH] Sync current offset state to URL

![Screenshot showing offset state in URL](https://user-images.githubusercontent.com/1086421/51856321-6e0e1e00-22fd-11e9-8420-1204b8a3d3b7.png)
---
 app/server/static/js/mixin.js | 40 ++++++++++++++++++++++++++++++++++-
 1 file changed, 39 insertions(+), 1 deletion(-)

diff --git a/app/server/static/js/mixin.js b/app/server/static/js/mixin.js
index bb3aa328..1de7b7f1 100644
--- a/app/server/static/js/mixin.js
+++ b/app/server/static/js/mixin.js
@@ -1,5 +1,37 @@
 import HTTP from './http';
 
+const getOffsetFromUrl = function(url) {
+  const offsetMatch = url.match(/[?#].*offset=(\d+)/);
+  if (offsetMatch == null) {
+    return 0;
+  }
+
+  return parseInt(offsetMatch[1], 10);
+};
+
+const storeOffsetInUrl = function(offset) {
+  let href = window.location.href;
+
+  const fragmentStart = href.indexOf('#') + 1;
+  if (fragmentStart === 0) {
+    href += '#offset=' + offset;
+  } else {
+    const prefix = href.substring(0, fragmentStart);
+    const fragment = href.substring(fragmentStart);
+
+    const newFragment = fragment.split('&').map(function(fragmentPart) {
+      const keyValue = fragmentPart.split('=');
+      return keyValue[0] === 'offset'
+        ? 'offset=' + offset
+        : fragmentPart;
+    }).join('&');
+
+    href = prefix + newFragment;
+  }
+
+  window.location.href = href;
+};
+
 const annotationMixin = {
   data() {
     return {
@@ -12,6 +44,7 @@ const annotationMixin = {
       remaining: 0,
       searchQuery: '',
       url: '',
+      offset: getOffsetFromUrl(window.location.href),
       picked: 'all',
       count: 0,
       isActive: false,
@@ -56,6 +89,7 @@ const annotationMixin = {
           const doc = this.docs[i];
           this.annotations.push(doc.annotations);
         }
+        this.offset = getOffsetFromUrl(this.url);
       });
     },
 
@@ -71,7 +105,7 @@ const annotationMixin = {
 
     async submit() {
       const state = this.getState();
-      this.url = `docs/?q=${this.searchQuery}&is_checked=${state}`;
+      this.url = `docs/?q=${this.searchQuery}&is_checked=${state}&offset=${this.offset}`;
       await this.search();
       this.pageNumber = 0;
     },
@@ -97,6 +131,10 @@ const annotationMixin = {
         this.remaining = response.data.remaining;
       });
     },
+
+    offset() {
+      storeOffsetInUrl(this.offset);
+    },
   },
 
   created() {