script to show known instances from cookie, mmoving it to localstorage

app.py

@@ -68,7 +68,7 @@ def install_security_headers(resp):
         csp += "script-src 'self' https://cdn.ravenjs.com/;"
         csp += "connect-src 'self' https://sentry.io/;"
     else:
-        csp += "script-src 'self';"
+        csp += "script-src 'self' 'unsafe-eval';"
         csp += "connect-src 'self';"
 
     if 'CSP_REPORT_URI' in app.config:

assets/instance_buttons.js

@@ -0,0 +1,51 @@
+(function instance_buttons(){
+
+    const STORAGE_KEY = 'forget_known_instances';
+
+    const container = document.querySelector('#mastodon_instance_buttons');
+    const button_template = Function('first', 'instance',
+        'return `' + document.querySelector('#instance_button_template').innerHTML + '`;');
+    const another_button_template = Function(
+        'return `' +
+            document.querySelector('#another_instance_button_template').innerHTML + '`;');
+    const top_instances =
+        Function('return JSON.parse(`' + document.querySelector('#top_instances').innerHTML + '`);')();
+
+    async function get_known(){
+        let known = JSON.parse(localStorage.getItem(STORAGE_KEY));
+        let has_been_fetched = false;
+        if(!known){
+            let resp = await fetch('/api/known_instances');
+            if(resp.ok && resp.headers.get('content-type') == 'application/json'){
+                known = await resp.json();
+            }
+            else {
+                known = [];
+            }
+            localStorage.setItem(STORAGE_KEY, JSON.stringify(known));
+            fetch('/api/known_instances', {method: 'DELETE'})
+        }
+
+        return known;
+    }
+
+    async function replace_buttons(){
+        let known = await get_known();
+
+        let instances = known.concat(top_instances).slice(0, 5);
+
+        let html = '';
+
+        let first = true;
+        for(let instance of instances){
+            html += button_template(first, instance['instance'])
+            first = false;
+        }
+
+        html += another_button_template();
+
+        container.innerHTML = html;
+    }
+
+    replace_buttons();
+})();

dodo.py

@@ -116,7 +116,7 @@ def task_minify_css():
 def task_rollup():
     """rollup javascript bundle"""
 
-    filenames = ['settings.js']
+    filenames = ['settings.js', 'instance_buttons.js']
     for filename in filenames:
         src = 'assets/{}'.format(filename)
         dst = 'static/{}'.format(filename)

routes/api.py

@@ -67,7 +67,7 @@ def known_instances():
     if request.method == 'GET':
         known = request.cookies.get('forget_known_instances', '')
         if not known:
-            return Response('[]', 404, mimetype='application/json')
+            return Response('[]', 200, mimetype='application/json')
 
         # pad to avoid oracle attacks
         for _ in range(random.randint(0, 1000)):

templates/about.html

@@ -64,7 +64,7 @@
 <script type="application/json" id="top_instances">
 [
 {% for instance in mastodon_instances %}
-    "{{instance}}"
+    {"instance": "{{instance}}"}
     {%- if not loop.last -%}
     ,
     {%- endif %}
@@ -74,7 +74,7 @@
 
 <script type="text/html+template" id="instance_button_template">
     <a style='background-color:#282c37' class='btn primary'
-        href="{{ url_for('mastodon_login_step1') }}/${encodeURIcomponent(instance)}">
+        href="{{ url_for('mastodon_login_step1') }}/${encodeURIComponent(instance)}">
         ${ !first? '' : `
             {{picture(st, 'mastodon', (20,40,80), ('webp', 'png'))}}
             Log in with
@@ -89,5 +89,11 @@
     </a>
 </script>
 
+
 {% endif %}
 {% endblock %}
+
+
+{% block scripts %}
+<script defer src="{{st('instance_buttons.js')}}"></script>
+{% endblock %}