Big merge of all recent PRs

design/dashboard.handlebars

@@ -13,7 +13,7 @@
                         🚀 boosted by <a href="{{booster.url}}">{{booster.name}}</a>
                         </div>
                     {{/if}}
-                    {{> note note=note}}
+                    {{> note note=note me=../me}}
                 </div>
             {{/with}}
         {{/each}}
@@ -37,4 +37,4 @@
      {{/if}}{{/each}}
 
     app.pollForPosts();
-</script>
+</script>

design/dms.handlebars

@@ -1,9 +1,11 @@
 <div class="feeds {{#if recipient}}inbox_visible{{/if}}">
     <header>Messages</header>
-    {{#if inboxes}}
-        {{#each inboxes}}
+    {{#if inboxesWithAccounts}}
+        {{#each inboxesWithAccounts}}
             <div class="feed {{#if this.unread}}unread{{/if}} {{#isEq this.id ../recipient.id}}current{{/isEq}}">
-                <a href="/private/dms/{{getUsername this.id}}">{{getUsername this.id}}</a>
+                <a href="/private/dms/{{getUsername this.id}}">
+                {{> avatar actor=this.actor mini=true nolink=true}}
+                {{getUsername this.id}}</a>
             </div>
         {{/each}}
     {{else}}
@@ -38,4 +40,4 @@
 {{/if}}
 <script>
     app.pollForPosts();
-</script>
+</script>

design/layouts/private.handlebars

@@ -19,6 +19,7 @@
           <li><a href="{{rootUrl}}/private/notifications">🔔 <span class="label">Notifications</span></a><span class="badge" id="newNotificationsBadge" hidden></span></li>
           <li><a href="{{rootUrl}}/private/dms">💬 <span class="label">Messages</span></a><span class="badge" id="newDMsBadge" hidden></span></li>
           <li><a href="{{rootUrl}}/private/post">➕ <span class="label">Compose</span></a></li>
+          <li><a href="{{rootUrl}}/private/settings">⚙️ <span class="label">Settings</span></a></li>
 
         </ul>
       </nav>

design/notifications.handlebars

@@ -26,6 +26,9 @@
                 {{{...note.content}}}
             </div>
         {{/isEq}}
+        {{#isEq notification.type "Vote"}}
+            <div class="notification">🗳 <a href="/private/profile/{{getUsername ../actor.id}}">{{../actor.name}}</a> voted on <a href="{{../note.id}}">your poll</a>  {{timesince ../time}}</div>
+        {{/isEq}}
         {{#isEq notification.type "Follow"}}
             <div class="notification">🤷🏽‍♂️ <a href="/private/profile/{{getUsername ../actor.id}}">{{../actor.name}}</a> followed you {{timesince ../time}}</div>
             {{> byline actor=../actor}}
@@ -42,4 +45,4 @@
      {{/if}}{{/each}}
 
     app.pollForPosts();
-</script>
+</script>

design/partials/avatar.handlebars

@@ -1,7 +1,21 @@
+{{#if nolink}}
+{{else}}
 <a href="{{#if public}}{{or actor.url actor.id}}{{else}}/private/profile/{{getUsername actor.id}}{{/if}}">
+{{/if}}
     {{#if actor.icon.url}}
-    <img src="{{actor.icon.url}}" class="avatar">
+        {{#if mini}}
+            <img src="{{actor.icon.url}}" class="mini-avatar">
+        {{else}}
+            <img src="{{actor.icon.url}}" class="avatar">
+        {{/if}}
     {{else}}
-    <img src="/images/avatar-unknown.png" class="avatar">
+        {{#if mini}}
+            <img src="/images/avatar-unknown.png" class="mini-avatar">
+        {{else}}
+            <img src="/images/avatar-unknown.png" class="avatar">
+        {{/if}}
     {{/if}}
+{{#if nolink}}
+{{else}}
 </a>
+{{/if}}

design/partials/composer.handlebars

@@ -6,25 +6,184 @@
             {{{originalPost.content}}}
         </div>
     {{else}}
-        <Header>Compose</Header>
+        {{#if prev}}
+        <Header>Edit</Header>
+        {{else}}
+        {{/if}}
     {{/if}}
-    <form onsubmit="return app.post()" id="composer">
-        <textarea id="post" required placeholder="The coolest thing I can think of right now..." onfocus="this.value = this.value;">{{#if actor}}@{{getUsername actor.id}} {{/if}}</textarea>
-        <input type="text" id="cw" placeholder="content warning" />
+
+    <form onsubmit="return validatePoll() && app.post()" id="composer">
+        {{#if names}} <!-- When voting, show the user's choice before posting -->
+            Vote for:
+            <ul>
+            {{#each names}}
+                <li>{{this}}</li>
+            {{/each}}
+            </ul>
+            <textarea id="post" hidden></textarea> <!-- no post content on poll vote -->
+            <input type="text" id="cw" hidden /> <!-- no cw on poll vote -->
+        {{else}}
+            <textarea id="post" required placeholder="The coolest thing I can think of right now..." onfocus="this.value = this.value;">{{#if actor}}@{{getUsername actor.id}} {{/if}}{{#if prev}}{{stripHTML prev.content}}{{/if}}</textarea>
+            <input type="text" id="cw" placeholder="content warning"
+            {{#if prev}}value="{{{prev.summary}}}"{{/if}}
+            />
+            <input id="inReplyTo" placeholder="in reply to" hidden
+            {{#if prev}}
+            value="{{{prev.inReplyTo}}}"
+            {{else}}
+            value="{{inReplyTo}}"
+            {{/if}}
+            />
+            <input id="to" placeholder="to" hidden value="{{to}}"
+            {{#if prev}}
+            value="{{{prev.to}}}"
+            {{else}}
+            value="{{to}}"
+            {{/if}}
+            />
+            <input id="attachment" type="file" />
+            <input id="description" type="text" placeholder="alt text" />
+            <div id="polldesigner" style="display:none"></div> <!-- The interactive poll designer -->
+            <input id="polldata" type="text" hidden> <!-- JSON data for the designed poll -->
+            <button id="togglepoll" type="button">📊</button>
+            {{#if prev}}
+            <input id="editOf" value="{{{prev.id}}}" hidden/>
+            {{/if}}
+        {{/if}}
+
         <input id="inReplyTo" placeholder="in reply to" value="{{inReplyTo}}" hidden />
         <input id="to" placeholder="to" value="{{to}}" hidden />
+
+        {{#each names}} <!-- replying to a post containing a poll, embed user's choice in field so it can be posted -->
+            <input class="pollchoice" value="{{{this}}}" hidden />
+        {{/each}}
+
         <button id="submit" type="submit">Post</button>
     </form>
 </div>
 <script>
+    let polldata;
+
+    let times = {
+        '5 minutes': 5 * 60,
+        '30 minutes': 30 * 60,
+        '1 hour': 60 * 60,
+        '6 hours': 6 * 60 * 60,
+        '1 day': 24 * 60 * 60,
+        '3 days': 3 * 24 * 60 * 60,
+        '7 days': 7 * 24 * 60 * 60
+    };
+
+    function pollReset() {
+        polldata = {
+            type: 'oneOf',
+            choices: [null, null],
+            time: 86400,
+        };
+    }
+
+    function escapeHTML(str) {
+        return str
+            .replace(/&/g, "&amp;")
+            .replace(/</g, "&lt;")
+            .replace(/>/g, "&gt;")
+            .replace(/"/g, "&quot;")
+            .replace(/'/g, "&#039;");
+    }
+
+    function addChoice() {
+        polldata.choices.push(null);
+        updatePollHTML(false);
+    }
+
+    function deleteChoice(n) {
+        polldata.choices.splice(n, 1);
+        updatePollHTML(false);
+    }
+
+    function changeChoiceText(n, value) {
+        polldata.choices[n] = value;
+        updatePollHTML(true);
+    }
+
+    function togglePollType() {
+        if (polldata.type === 'oneOf') {
+            polldata.type = 'anyOf';
+        } else {
+            polldata.type = 'oneOf';
+        }
+        updatePollHTML(false);
+        return false;
+    }
+
+    function updateTime(value) {
+        polldata.time = parseInt(value);
+        updatePollHTML(true);
+    }
+
+    function validatePoll() {
+        if (document.getElementById('polldesigner')) {
+            if (document.getElementById('polldesigner').style.display === 'none') {
+                return true;
+            }
+            return !polldata.choices.includes(null);    // undefined elements in poll
+        } else {
+            return true;
+        }
+    }
+
+    function updatePollHTML(dataOnly) {
+        let div = document.getElementById('polldesigner');
+        if (!dataOnly) {
+            let html = '';
+            html += '<form>';
+            for (let i=0;i<polldata.choices.length;i++) {
+                let radioOrCheckbox = '<a href="#" onclick="togglePollType()">' + (polldata.type == 'oneOf' ? '🔘' : '🔲') + '</a>';
+                let nameBox = '<input type="text" value="' + escapeHTML(polldata.choices[i] ? polldata.choices[i] : '') + '" size="20" onChange="changeChoiceText(' + i + ', this.value)" placeholder="Choice ' + (i+1) + '">';
+                let deleteButton = '<a href="#" onclick="deleteChoice(' + i + ')">' + (i > 1 ? '❎' : '') + '</a>';
+                html += radioOrCheckbox + nameBox + deleteButton + '<br>';
+            }
+
+            html += '<input type="button" value="➕ Add a choice" onclick="addChoice()">';
+            html += '<select id="time" name="time" onChange="updateTime(this.value)">';
+            Object.keys(times).forEach((k) => {
+                html += '   <option value="' + times[k] + '" ' + (polldata.time == times[k] ? 'selected' : '') + '>' + k + '</option>';
+            });
+            html += '</select>';
+            html += '</form>';
+            // update display
+            div.innerHTML = html;
+        }
+        // update hidden field with data so that it gets posted
+        if (validatePoll()) {
+            document.getElementById('polldata').value = JSON.stringify(polldata);
+        }
+    }
+
+    document.addEventListener("DOMContentLoaded", function(event) {
+        pollReset();
 
-    // scroll to bottom
-    var div = document.getElementById("main");
-    div.scrollTop = div.scrollHeight;
+        // scroll to bottom
+        var div = document.getElementById("main");
+        div.scrollTop = div.scrollHeight;
 
-    // focus the text input
-    const input = document.getElementById('post');
-    input.focus();
-    input.selectionStart = input.selectionEnd = input.value.length;
+        // focus the text input
+        const input = document.getElementById('post');
+        input.focus();
+        input.selectionStart = input.selectionEnd = input.value.length;
 
-</script>
+        let togglepollButton = document.getElementById('togglepoll');
+        togglepollButton.onclick = function() {
+            let div = document.getElementById('polldesigner');
+            if (div.style.display !== 'none') {
+                div.style.display = 'none';
+                pollReset();
+                updatePollHTML(true);
+            } else {
+                pollReset();
+                updatePollHTML(false);
+                div.style.display = 'block';
+            }
+        };
+    });
+</script>

design/partials/note.handlebars

@@ -14,6 +14,28 @@
             <p><a href="{{note.inReplyTo}}" class="showThread">Show Thread</a></p>
             {{/if}}
 
+            {{#if (isEq note.type 'Question')}}
+                <form id="{{note.id}}">
+                    <fieldset>
+                        {{#each note.oneOf}}
+                            <input type="radio" id="poll_option{{@index}}" name="pollchoice" value="{{name}}">
+                            <label for="{{@index}}">{{name}}</label> ({{replies.totalItems}})<br>
+                        {{/each}}
+                        {{#each note.anyOf}}
+                            <input type="checkbox" id="poll_option{{@index}}" name="pollchoice" value="{{name}}">
+                            <label for="{{@index}}">{{name}}</label> ({{replies.totalItems}})<br>
+                        {{/each}}
+                    </fieldset>
+                </form>
+                {{#if (expired note.endTime)}}
+                Ended {{timesince note.endTime}}
+                {{else}}
+                Ends {{timesince note.endTime}}
+                {{/if}}
+                <br>
+                Votes cast: {{note.votersCount}}<br>
+            {{/if}}
+
             {{#each note.attachment}}
                 <div class="attachment">
                     {{#isImage mediaType}}
@@ -25,6 +47,7 @@
                 </div>
             {{/each}}
             <footer>
+                {{#if note}}
                 <div class="tools">
                     <button onclick='return app.replyTo("{{note.id}}","{{{getUsername actor.id}}}")'>↩️</button>
                     <button class="booster {{#if note.isBoosted}}active{{/if}}" onclick='return app.toggleBoost(this, "{{note.id}}")'>
@@ -35,7 +58,13 @@
                         <span class="active">⭐️</span>
                         <span class="inactive">☆</span>
                     </button>
+                    {{#if (isEq note.attributedTo me.id)}}
+                    <button onclick='return app.editPost("{{note.id}}")'>
+                        <span>✏️</span>
+                    </button>
+                    {{/if}}
                 </div>
+                {{/if}}
                 <a href="{{note.url}}" class="permalink">{{timesince note.published}}</a>
             </footer>
         </div>

design/public/note.handlebars

@@ -37,6 +37,27 @@
                     {{/isVideo}}
                 </div>
             {{/each}}
+            {{#if (isEq note.type 'Question')}}
+                <form id="{{note.id}}">
+                    <fieldset>
+                        {{#each note.oneOf}}
+                            <input type="radio" id="poll_option{{@index}}" name="pollchoice" value="{{name}}" disabled>
+                            <label for="{{@index}}">{{name}}</label> ({{replies.totalItems}})<br>
+                        {{/each}}
+                        {{#each note.anyOf}}
+                            <input type="checkbox" id="poll_option{{@index}}" name="pollchoice" value="{{name}}" disabled>
+                            <label for="{{@index}}">{{name}}</label> ({{replies.totalItems}})<br>
+                        {{/each}}
+                    </fieldset>
+                </form>
+                {{#if (expired note.endTime)}}
+                Ended {{timesince note.endTime}}
+                {{else}}
+                Ends {{timesince note.endTime}}
+                {{/if}}
+                <br>
+                Votes cast: {{note.votersCount}}<br>
+            {{/if}}
             <footer>
                 <div class="tools">
                     {{#if stats}}

design/public/tag.handlebars

@@ -0,0 +1,35 @@
+<div class="stream">
+    <div class="follow_box">
+        <p>
+            Follow this site on Mastodon or other fediverse clients: 
+            <input type="text" value="{{user}}@{{domain}}" size="50"/>
+        </p>
+    </div>
+<header class="back">
+    <a  href="#" onclick="history.back(); return false;"><img src="{{actor.icon.url}}" class="avatar"></a>
+    <a href="#" onclick="history.back(); return false;">Back to {{actor.preferredUsername}}</a>
+</header>
+
+<header>
+Posts containing #{{tag}}
+</header>
+
+{{#each notes}}
+<div class="activity">
+    {{#with this}}
+        {{#if summary}}
+        <div class="content_warning">
+            content warning: {{summary}}
+        </div>
+        {{/if}}
+        <div class="content">
+            {{{content}}}
+
+            <a href="{{url}}" class="permalink">{{timesince published}}</a>
+        </div>
+    {{/with}}
+</div>
+{{/each}}
+
+
+</div>