[Favourite][TWIG][CSS] Favourite now works.

plugins/Favourite/Favourite.php

@@ -28,6 +28,7 @@ use App\Core\Modules\Plugin;
 use App\Core\Router\RouteLoader;
 use App\Entity\Note;
 use App\Util\Common;
+use App\Util\Exception\RedirectException;
 use App\Util\Formatting;
 use App\Util\Nickname;
 use Symfony\Component\Form\Extension\Core\Type\HiddenType;
@@ -39,31 +40,56 @@ class Favourite extends Plugin
     /**
      * HTML rendering event that adds the favourite form as a note
      * action, if a user is logged in
+     *
+     * @param Request $request
+     * @param Note    $note
+     * @param array   $actions
+     *
+     * @throws RedirectException
+     * @throws \App\Util\Exception\InvalidFormException
+     * @throws \App\Util\Exception\NoSuchNoteException
+     *
+     * @return bool Event hook
      */
     public function onAddNoteActions(Request $request, Note $note, array &$actions): bool
     {
-        if (($user = Common::user()) == null) {
+        if (($user = Common::user()) === null) {
             return Event::next;
         }
 
+        // if note is favourited, "is_set" is 1
         $opts   = ['note_id' => $note->getId(), 'gsactor_id' => $user->getId()];
         $is_set = DB::find('favourite', $opts) != null;
         $form   = Form::create([
             ['is_set',    HiddenType::class, ['data' => $is_set ? '1' : '0']],
             ['note_id',   HiddenType::class, ['data' => $note->getId()]],
-            ['favourite', SubmitType::class, ['label' => ' ']],
+            ["favourite-{$note->getId()}", SubmitType::class, ['label' => ' ', 'attr' => ['class' => $is_set ? 'favourite-button-on' : 'favourite-button-off']]],
         ]);
 
         // Form handler
-        $ret = self::noteActionHandle($request, $form, $note, 'favourite', function ($note, $data) use ($opts) {
+        $ret = self::noteActionHandle(
+         $request, $form, $note, "favourite-{$note->getId()}",          /**
+         * Called from form handler
+         *
+         * @param $note Note to be favourited
+         * @param $data Form input
+         *
+         * @throws RedirectException Always thrown in order to prevent accidental form re-submit from browser
+         */ function ($note, $data) use ($opts, $request) {
              $fave = DB::find('favourite', $opts);
-            if (!$data['is_set'] && ($fave == null)) {
+             if ($data['is_set'] === '0' && $fave === null) {
                  DB::persist(Entity\Favourite::create($opts));
                  DB::flush();
              } else {
+                 if ($data['is_set'] === '1' && $fave !== null) {
                      DB::remove($fave);
                      DB::flush();
                  }
+             }
+
+             // Prevent accidental refreshes from resubmitting the form
+             throw new RedirectException();
+
              return Event::stop;
          });
 

public/assets/css/base.css

@@ -190,6 +190,34 @@
     height: var(--main-size);
 }
 
+/* TODO: icons */
+.note-actions {
+    display: block;
+}
+
+.favourite-button-off {
+    all: unset;
+
+    cursor: pointer !important;
+    border: none !important;
+    width: 1em !important;
+    height: 1em !important;
+    background-size: cover !important;
+    background-image: url(../icons/heart.svg) !important;
+    filter: invert(26%) sepia(21%) saturate(580%) hue-rotate(201deg) brightness(96%) contrast(93%);
+}
+.favourite-button-on {
+    all: unset;
+
+    cursor: pointer !important;
+    border: none !important;
+    width: 1em !important;
+    height: 1em !important;
+    background-size: cover !important;
+    background-image: url(../icons/heart.svg) !important;
+    filter: invert(100%);
+}
+
 .note-content {
     padding: var(--small-size);
 }

public/assets/css/left/left.css

@@ -37,7 +37,7 @@
 
 #user-avatar img {
     border-radius: 50%;
-    max-width: calc(3 * var(--main-size));
+    width: calc(3 * var(--main-size));
     height: auto;
 
     margin-right: var(--unit-size);

public/assets/css/reset.css

@@ -81,6 +81,7 @@ html {
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     text-rendering: optimizeLegibility;
+    scroll-behavior: smooth;
 
     background-attachment: fixed;
     color: var(--white);

src/Core/Modules/Module.php

@@ -19,8 +19,12 @@
 
 namespace App\Core\Modules;
 
+use App\Core\Event;
+use App\Core\Log;
 use App\Entity\Note;
 use App\Util\Common;
+use App\Util\Exception\InvalidFormException;
+use App\Util\Exception\NoSuchNoteException;
 use Symfony\Component\Form\Form;
 use Symfony\Component\HttpFoundation\Request;
 
@@ -51,6 +55,17 @@ abstract class Module
      * This function is called when a user interacts with a note, such as through favouriting or commenting
      *
      * @codeCoverageIgnore
+     *
+     * @param Request  $request
+     * @param Form     $form
+     * @param Note     $note
+     * @param string   $form_name
+     * @param callable $handle
+     *
+     * @throws InvalidFormException
+     * @throws NoSuchNoteException
+     *
+     * @return bool|void
      */
     public static function noteActionHandle(Request $request, Form $form, Note $note, string $form_name, callable $handle)
     {
@@ -65,7 +80,7 @@ abstract class Module
                     $user = Common::user();
                     if (!$note->isVisibleTo($user)) {
                         // ^ Ensure user isn't trying to trip us up
-                        Log::error('Suspicious activity: user ' . $user->getNickname() .
+                        Log::warning('Suspicious activity: user ' . $user->getNickname() .
                                    ' tried to interact with note ' . $note->getId() .
                                    ', but they shouldn\'t have access to it');
                         throw new NoSuchNoteException();

templates/base.html.twig

@@ -29,7 +29,7 @@
 </head>
 
 <body class="bg">
-    {% block header %}
+{% block header %}
         <div id='header'>
             <details class="panel" id="left-container">
                 <summary tabindex="1">
@@ -59,7 +59,6 @@
             {% block javascripts %}{% endblock javascripts %}
         </div>
     </div>
-
 </body>
 </html>
 

templates/note/view.html.twig

@@ -12,6 +12,16 @@
         {% if reply_to is not null and not skip_reply_to is defined %}
             {% trans with {'%name%': reply_to} %} in reply to %name% {% endtrans %}
         {% endif %}
+
+        <div class="note-actions">
+
+            {% if have_user %}
+                {% for act in get_note_actions(note) %}
+                    {{ form(act) }}
+                {% endfor %}
+            {% endif %}
+        </div>
+
     </div>
     <div class="e-content entry-content note-content">
         {% block markdown %}
@@ -32,13 +42,7 @@
             </div>
         {% endif %}
     </div>
-    <div class="note-actions">
+
-        {# {% if have_user %} #}
-        {# {\#{% for act in get_note_actions(note) %}#\} #}
-        {# {\#{{ form(act) }}#\} #}
-        {# {\#{% endfor %}#\} #}
-        {# {% endif %} #}
-    </div>
     {% if replies is defined %}
         <div class="u-in-reply-to replies">
             {% for conversation in replies %}