Make messages capable of holding attachments

Web/Models/Entities/Message.php

@@ -2,6 +2,7 @@
 namespace openvk\Web\Models\Entities;
 use openvk\Web\Models\Repositories\Clubs;
 use openvk\Web\Models\Repositories\Users;
+use openvk\Web\Models\Entities\Photo;
 use openvk\Web\Models\RowModel;
 use openvk\Web\Util\DateTime;
 
@@ -86,6 +87,22 @@ class Message extends RowModel
     {
         $author = $this->getSender();
         
+        $attachments = [];
+        foreach($this->getChildren() as $attachment) {
+            if($attachment instanceof Photo) {
+                $attachments[] = [
+                    "type"  => "photo",
+                    "link"  => "/photo" . $attachment->getPrettyId(),
+                    "photo" => [
+                        "url"     => $attachment->getURL(),
+                        "caption" => $attachment->getDescription(),
+                    ],
+                ];
+            } else {
+                throw new \Exception("Unknown attachment type: " . get_class($attachment));
+            }
+        }
+        
         return [
             "uuid"   => $this->getId(),
             "sender" => [
@@ -99,8 +116,10 @@ class Message extends RowModel
                 "edited" => is_null($this->getEditTime()) ? null : (string) $this->getEditTime(),
             ],
             "text"        => $this->getText(),
+            "attachments" => $attachments,
         ];
     }
     
     use Traits\TRichText;
+    use Traits\TAttachmentHost;
 }

Web/Models/Entities/Traits/TAttachmentHost.php

@@ -17,8 +17,9 @@ trait TAttachmentHost
     
     function getChildren(): \Traversable
     {
-        $sel = $this->getRecord()
+        $sel = DatabaseConnection::i()->getContext()
-                    ->related("attachments.target_id")
+                                      ->table("attachments")
+                                      ->where("target_id", $this->getId())
                                       ->where("attachments.target_type", get_class($this));
         foreach($sel as $rel) {
             $repoName = $rel->attachable_type . "s";

Web/Presenters/templates/Messenger/App.xml

@@ -23,12 +23,21 @@
                     <img class="ava" data-bind="attr: { src: sender.avatar, alt: sender.name }" />
                     <div class="_content">
                         <a href="#" data-bind="attr: { href: sender.link }">
-                            <strong data-bind="text: sender.name">Целестина Неонова {* lulz *}</strong>
+                            <strong data-bind="text: sender.name"></strong>
                         </a>
-                        <span class="text" data-bind="html: text">...</span>
+                        <span class="text" data-bind="html: text"></span>
+                        <div data-bind="foreach: attachments" class="attachments">
+                            <div class="msg-attach-j">
+                                <div data-bind="if: type === 'photo'" class="msg-attach-j-photo">
+                                    <a data-bind="attr: { href: link }">
+                                        <img data-bind="attr: { src: photo.url, alt: photo.caption  }" />
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
                     </div>
                     <div class="time" align="right">
-                        <span data-bind="text: timing.sent">Monday, the 1st of January 1970 00:00:00</span>
+                        <span data-bind="text: timing.sent"></span>
                     </div>
                 </div>
             </div>
@@ -171,6 +180,7 @@
                         "edited": null
                     },
                     "text": content,
+                    "attachments": [],
                     "_tuid": Math.ceil(performance.now())
                 };
             }

Web/static/css/style.css

@@ -845,6 +845,18 @@ table.User {
     overflow: hidden;
 }
 
+.messenger-app--messages---message ._content .attachments {
+    width: 100%;
+}
+
+.messenger-app--messages---message ._content .attachments > .msg-attach-j * {
+    max-width: 86%;
+}
+
+.messenger-app--messages---message ._content .attachments:not(:empty) {
+    margin-top: 15px;
+}
+
 .messenger-app--messages---message .time {
     width: 100px;
 }