implement basic interaction controls

1 files changed, 21 insertions, 9 deletions

diff --git a/templates/note/write_form.php b/templates/note/write_form.php
index 647dcac..abd916c 100644
--- a/templates/note/write_form.php
+++ b/templates/note/write_form.php
@@ -27,6 +27,27 @@
             _="on keydown[ctrlKey and key is 'Enter'] set b to #writeNoteSubmitButton then b.click()"></textarea>
         <?php call_template('formatting_hint'); ?>
     </div>
+
+    <div class="row">
+        <fieldset class="column noteScopeButtons">
+            <legend><?= __('writeNote.scope.label') ?></legend>
+            <?php foreach (['none' => 'lock', 'mutuals' => 'group', 'followers' => 'groups', 'public' => 'public'] as $scope => $icon): ?>
+                <input type="radio" name="scope" value="<?= $scope ?>" id="noteScope-<?= $scope ?>" <?= $scope == 'public' ? 'checked' : '' ?> autocomplete="off">
+                <label for="noteScope-<?= $scope ?>" class="material-symbols <?= $icon ?>"
+                    title="<?= __("note.privacy.scope.$scope") ?>"></label>
+            <?php endforeach; ?>
+        </fieldset>
+        <fieldset class="column noteInteractorButtons">
+            <legend><?= __('writeNote.interactors.label') ?></legend>
+            <?php foreach (['none' => 'person-off', 'mutuals' => 'group', 'followers' => 'groups', 'all' => 'select-all'] as $group => $icon): ?>
+                <input type="radio" name="interactors" value="<?= $group ?>" id="noteInteractors-<?= $group ?>"
+                    <?= $group == 'all' ? 'checked' : '' ?> autocomplete="off">
+                <label for="noteInteractors-<?= $group ?>" class="material-symbols <?= $icon ?>"
+                    title="<?= __("note.privacy.interactors.$group") ?>"></label>
+            <?php endforeach; ?>
+        </fieldset>
+    </div>
+
     <details>
         <summary><?= __('writeNote.moreOptions') ?></summary>
         <div class="row">
@@ -37,15 +58,6 @@
             <label class="standalone"><?= __('writeNote.attachments.label') ?></label>
             <?php call_template('note/attachment_pill'); ?>
         </div>
-        <div class="row">
-            <label for="noteScope"><?= __('writeNote.scope.label') ?></label>
-            <select name="scope" id="noteScope" required autocomplete="off">
-                <option value="none"><?= __('note.privacy.scope.none') ?></option>
-                <option value="mutuals"><?= __('note.privacy.scope.mutuals') ?></option>
-                <option value="followers"><?= __('note.privacy.scope.followers') ?></option>
-                <option value="public" selected><?= __('note.privacy.scope.public') ?></option>
-            </select>
-        </div>
     </details>
     <div class="row">
         <button class="primary" id="writeNoteSubmitButton"><?= __('writeNote.action') ?></button>