Feature: Add on-no-more method to enable "end" display

pinry/static/js/vue/main.js

@@ -199,6 +199,9 @@ Vue.component('pin-container', {
       this.$emit(
           "loaded",
       );
+      if (!hasNext) {
+        this.$emit("no-more-pins")
+      }
     },
     markAsLoading: function() {
       this.status.loading = true;
@@ -294,6 +297,7 @@ var app = new Vue({
   data() {
     return {
       loading: true,
+      noMore: false,
     }
   },
   methods: {
@@ -303,5 +307,8 @@ var app = new Vue({
     onLoading: function(){
       this.loading = true;
     },
+    onNoMore: function () {
+      this.noMore = true;
+    }
   },
 });

pinry/templates/core/pins.html

@@ -1,7 +1,12 @@
 {% extends "base.html" %}
 
 {% block yield %}
-    <pin-container v-on:loaded="onLoaded()" v-on:loading="onLoading()">
+  <pin-container
-    </pin-container>
+      v-on:loaded="onLoaded()"
-    <div v-show="loading" class="spinner"></div>
+      v-on:loading="onLoading()"
+      v-on:no-more-pins="onNoMore()"
+  >
+  </pin-container>
+  <div v-show="loading" class="spinner"></div>
+  <div v-show="noMore">&mdash; End &mdash;</div>
 {% endblock %}