Introduce day-increment prop & increase days loaded at once

aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue

@@ -102,6 +102,16 @@ export default {
       required: false,
       default: null,
     },
+    /**
+     * Number of consecutive to load at once
+     * This number of days is initially loaded and loaded
+     * incrementally while scrolling.
+     */
+    dayIncrement: {
+      type: Number,
+      required: false,
+      default: 7,
+    },
     /**
      * Margin from coursebook list to top of viewport in pixels
      */
@@ -190,8 +200,8 @@ export default {
 
       const date = DateTime.fromISO(this.currentDate);
       this.initDate = date;
-      this.dateStart = date.minus({ days: 3 }).toISODate();
-      this.dateEnd = date.plus({ days: 4 }).toISODate();
+      this.dateStart = date.minus({ days: this.dayIncrement }).toISODate();
+      this.dateEnd = date.plus({ days: this.dayIncrement }).toISODate();
     },
     transition() {
       this.initDate = false
@@ -274,7 +284,7 @@ export default {
           if (once && this.ready && first) {
             console.log('load up', date.toISODate());
             this.ready = false;
-            this.fetchMore(date.minus({ days: 5 }).toISODate(),
+            this.fetchMore(date.minus({ days: this.dayIncrement }).toISODate(),
                            date.minus({ days: 1 }).toISODate(),
                           () => {
                             this.fixScrollPos(document.documentElement.scrollHeight,
@@ -285,7 +295,7 @@ export default {
             console.log('load down', date.toISODate());
             this.ready = false;
             this.fetchMore(date.plus({ days: 1 }).toISODate(),
-                           date.plus({ days: 5 }).toISODate(),
+                           date.plus({ days: this.dayIncrement }).toISODate(),
                            () => { this.ready = true });
             once = false;
           }