[NOTE][UI] Add note replying and UI displaying

This commit is contained in:
Hugo Sales 2020-08-28 20:16:26 +00:00 committed by Hugo Sales
parent 459f0bf41f
commit 0b50905ac8
Signed by untrusted user: someonewithpc
GPG Key ID: 7D0C7EAFC9D835A0
14 changed files with 203 additions and 106 deletions

View File

@ -19,27 +19,74 @@
namespace Component\Posting\Controller; namespace Component\Posting\Controller;
use App\Core\DB\DB;
use App\Core\Form; use App\Core\Form;
use App\Core\Module; use function App\Core\I18n\_m;
use App\Entity\FileToNote;
use App\Entity\Note;
use App\Util\Common;
use App\Util\Exception\ClientException;
use Symfony\Component\Form\Extension\Core\Type\FileType; use Symfony\Component\Form\Extension\Core\Type\FileType;
use Symfony\Component\Form\Extension\Core\Type\HiddenType; use Symfony\Component\Form\Extension\Core\Type\HiddenType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType; use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\Extension\Core\Type\TextareaType;
use Symfony\Component\HttpFoundation\Request; use Symfony\Component\HttpFoundation\Request;
use function App\Core\I18n\_m;
class Post extends Module { class Post
public function reply(Request $r) { {
public function reply(Request $request, string $reply_to)
{
$note = DB::find('note', ['id' => $reply_to]);
if ($note == null) {
throw new ClientException(_m('No such note'));
}
$actor_id = Common::ensureLoggedIn()->getActor()->getId();
$form = Form::create([ $form = Form::create([
['avatar', FileType::class, ['label' => _m('Avatar'), 'help' => _m('You can upload your personal avatar. The maximum file size is 2MB.')]], ['reply_to', HiddenType::class, ['data' => (int) $reply_to]],
['reply_to', HiddenType::class, []], ['content', TextareaType::class, ['label' => ' ']],
['save', SubmitType::class, ['label' => _m('Submit')]], ['attachments', FileType::class, ['label' => ' ', 'multiple' => true, 'required' => false]],
['save', SubmitType::class, ['label' => _m('Submit')]],
]); ]);
$form->handleRequest($request); $form->handleRequest($request);
if ($form->isSubmitted() && $form->isValid()) { if ($form->isSubmitted()) {
$data = $form->getData(); $data = $form->getData();
$sfile = null; if ($form->isValid()) {
self::storeNote($actor_id, $data['content'], $data['attachments'], $is_local = true, $data['reply_to']);
} else {
// TODO display errors
}
}
return [
'_template' => 'note/reply.html.twig',
'note' => $note,
'reply' => $form->createView(),
];
}
public static function storeNote(int $actor_id, string $content, array $attachments, bool $is_local, ?int $reply_to = null)
{
$note = Note::create(['gsactor_id' => $actor_id, 'content' => $content, 'is_local' => $is_local, 'reply_to' => $reply_to]);
$files = [];
foreach ($attachments as $f) {
$nf = Media::validateAndStoreFile($f, Common::config('attachments', 'dir'),
Security::sanitize($title = $f->getClientOriginalName()),
$is_local = true, $actor_id);
$files[] = $nf;
DB::persist($nf);
}
DB::persist($note);
// Need file and note ids for the next step
DB::flush();
if ($attachments != []) {
foreach ($files as $f) {
DB::persist(FileToNote::create(['file_id' => $f->getId(), 'note_id' => $note->getId()]));
}
DB::flush();
}
} }
} }

View File

@ -24,11 +24,7 @@ use App\Core\Event;
use App\Core\Form; use App\Core\Form;
use function App\Core\I18n\_m; use function App\Core\I18n\_m;
use App\Core\Module; use App\Core\Module;
use App\Core\Security;
use App\Entity\FileToNote;
use App\Entity\Note;
use App\Util\Common; use App\Util\Common;
use Component\Media\Media;
use Component\Posting\Controller as C; use Component\Posting\Controller as C;
use Symfony\Component\Form\Extension\Core\Type\ChoiceType; use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
use Symfony\Component\Form\Extension\Core\Type\FileType; use Symfony\Component\Form\Extension\Core\Type\FileType;
@ -39,8 +35,7 @@ class Posting extends Module
{ {
public function onAddRoute($r) public function onAddRoute($r)
{ {
$r->connect('note_new', '/note/new/{reply_to<\d*>}', $r->connect('note_reply', '/note/reply/{reply_to<\d*>}', [C\Post::class, 'reply']);
[C\Post::class, 'note'], []);
} }
public function onStartTwigPopulateVars(array &$vars) public function onStartTwigPopulateVars(array &$vars)
@ -49,60 +44,30 @@ class Posting extends Module
return; return;
} }
$to_options = ['public' => _m('public'), 'instance' => _m('instance'), 'private' => _m('private')]; $actor_id = Common::actor()->getId();
$to_tags = [];
$id = Common::actor()->getId(); foreach (DB::dql('select c.tag from App\Entity\GSActorCircle c where c.tagger = :tagger', ['tagger' => $actor_id]) as $t) {
$to_tags = [];
foreach (DB::dql('select c.tag from App\Entity\GSActorCircle c where c.tagger = :tagger', ['tagger' => $id]) as $t) {
$t = $t['tag']; $t = $t['tag'];
$to_tags[$t] = $t; $to_tags[$t] = $t;
} }
$empty_string = ['How are you feeling?...', 'Something to share?...', 'How was your day?...']; $placeholder_string = ['How are you feeling?', 'Have something to share?', 'How was your day?'];
$rand_keys = array_rand($empty_string, 1); $rand_key = array_rand($placeholder_string);
$request = $vars['request']; $request = $vars['request'];
$form = Form::create([ $form = Form::create([
['content', TextareaType::class, [ ['content', TextareaType::class, ['label' => ' ', 'data' => '', 'attr' => ['placeholder' => _m($placeholder_string[$rand_key])]]],
'label' => ' ', ['attachments', FileType::class, ['label' => ' ', 'data' => null, 'multiple' => true, 'required' => false]],
'data' => _m($empty_string[$rand_keys]), ['visibility', ChoiceType::class, ['label' => _m('Visibility:'), 'expanded' => true, 'choices' => [_m('Public') => 'public', _m('Instance') => 'instance', _m('Private') => 'private']]],
]], ['to', ChoiceType::class, ['label' => _m('To:'), 'multiple' => true, 'expanded' => true, 'choices' => $to_tags]],
['attachments', FileType::class, ['label' => _m(' '), 'multiple' => true, 'required' => false]], ['send', SubmitType::class, ['label' => _m('Send')]],
['visibility', ChoiceType::class, [
'label' => 'Visibility:',
'expanded' => true,
'choices' => $to_options,
]],
['to', ChoiceType::class, [
'label' => 'To:',
'multiple' => true,
'expanded' => true,
'choices' => $to_tags,
]],
['send', SubmitType::class, ['label' => _m('Send')]],
]); ]);
$form->handleRequest($request); $form->handleRequest($request);
if ($form->isSubmitted()) { if ($form->isSubmitted()) {
$data = $form->getData(); $data = $form->getData();
if ($form->isValid()) { if ($form->isValid()) {
$content = $data['content']; Post::storeNote($actor_id, $data['content'], $data['attachments'], $is_local = true);
$note = Note::create(['gsactor_id' => $id, 'content' => $content]);
$files = [];
foreach ($data['attachments'] as $f) {
$nf = Media::validateAndStoreFile($f, Common::config('attachments', 'dir'),
Security::sanitize($title = $f->getClientOriginalName()),
$is_local = true, $actor_id = $id);
$files[] = $nf;
DB::persist($nf);
}
DB::persist($note);
// Need file and note ids for the next step
DB::flush();
foreach ($files as $f) {
DB::persist(FileToNote::create(['file_id' => $f->getId(), 'note_id' => $note->getId()]));
}
DB::flush();
} else { } else {
// TODO Display error // TODO Display error
} }

View File

@ -97,13 +97,13 @@
font-size: var(--unit-size); font-size: var(--unit-size);
} }
.notice { .note {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
border: solid 2px var(--accent-low); border: solid 2px var(--accent-low);
border-radius: var(--small-size); border-radius: var(--small-size);
} }
.notice-info { .note-info {
background-color: var(--bg1); background-color: var(--bg1);
box-sizing: border-box; box-sizing: border-box;
padding: 5px; padding: 5px;
@ -114,14 +114,14 @@
flex-shrink: 0; flex-shrink: 0;
width: 100%; width: 100%;
} }
.notice-info b { .note-info b {
margin-left: var(--small-size); margin-left: var(--small-size);
} }
.notice-info a img { .note-info a img {
width: calc(2 * var(--unit-size)); width: calc(2 * var(--unit-size));
height: auto; height: auto;
} }
.notice-content { .note-content {
word-break: break-word; word-break: break-word;
padding: var(--small-size); padding: var(--small-size);
border-radius: 0 0 var(--small-size) var(--small-size); border-radius: 0 0 var(--small-size) var(--small-size);
@ -236,7 +236,7 @@
} }
/* options */ /* options */
.notice-options { .note-options {
order: 3; order: 3;
display: inline-flex; display: inline-flex;
justify-content: flex-start; justify-content: flex-start;

View File

@ -64,7 +64,7 @@
transition: all 0.8s ease; transition: all 0.8s ease;
} }
/* notices */ /* notes */
.notes { .notes {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -97,13 +97,13 @@
font-size: var(--unit-size); font-size: var(--unit-size);
} }
.notice { .note {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
border: solid 2px var(--accent-low); border: solid 2px var(--accent-low);
border-radius: var(--small-size); border-radius: var(--small-size);
} }
.notice-info { .note-info {
background-color: var(--bg1); background-color: var(--bg1);
box-sizing: border-box; box-sizing: border-box;
padding: 5px; padding: 5px;
@ -114,11 +114,11 @@
flex-shrink: 0; flex-shrink: 0;
width: 100%; width: 100%;
} }
.notice-info a img { .note-info a img {
width: calc(2 * var(--unit-size)); width: calc(2 * var(--unit-size));
height: auto; height: auto;
} }
.notice-content { .note-content {
word-break: break-word; word-break: break-word;
padding: var(--small-size); padding: var(--small-size);
border-radius: 0 0 var(--small-size) var(--small-size); border-radius: 0 0 var(--small-size) var(--small-size);
@ -129,7 +129,7 @@
display: flex; display: flex;
flex: max-content; flex: max-content;
} }
.create-notice { .create-note {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
flex: max-content; flex: max-content;
@ -233,7 +233,7 @@
} }
/* options */ /* options */
.notice-options { .note-options {
order: 3; order: 3;
display: inline-flex; display: inline-flex;
justify-content: flex-start; justify-content: flex-start;

View File

@ -64,7 +64,7 @@
transition: all 0.8s ease; transition: all 0.8s ease;
} }
/* notices */ /* notes */
.notes { .notes {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -97,13 +97,13 @@
font-size: var(--unit-size); font-size: var(--unit-size);
} }
.notice { .note {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
border: solid 2px var(--accent-low); border: solid 2px var(--accent-low);
border-radius: var(--small-size); border-radius: var(--small-size);
} }
.notice-info { .note-info {
background-color: var(--bg1); background-color: var(--bg1);
box-sizing: border-box; box-sizing: border-box;
padding: 5px; padding: 5px;
@ -114,11 +114,11 @@
flex-shrink: 0; flex-shrink: 0;
width: 100%; width: 100%;
} }
.notice-info a img { .note-info a img {
width: calc(2 * var(--unit-size)); width: calc(2 * var(--unit-size));
height: auto; height: auto;
} }
.notice-content { .note-content {
word-break: break-word; word-break: break-word;
padding: var(--small-size); padding: var(--small-size);
border-radius: 0 0 var(--small-size) var(--small-size); border-radius: 0 0 var(--small-size) var(--small-size);
@ -129,7 +129,7 @@
display: flex; display: flex;
flex: max-content; flex: max-content;
} }
.create-notice { .create-note {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
flex: max-content; flex: max-content;
@ -233,7 +233,7 @@
} }
/* options */ /* options */
.notice-options { .note-options {
order: 3; order: 3;
display: inline-flex; display: inline-flex;
justify-content: flex-start; justify-content: flex-start;

View File

@ -45,7 +45,7 @@ abstract class DB
self::$em = $m; self::$em = $m;
} }
public static function dql(string $query, ?array $params) public static function dql(string $query, array $params = [])
{ {
$q = new Query(self::$em); $q = new Query(self::$em);
$q->setDQL($query); $q->setDQL($query);

View File

@ -33,7 +33,7 @@ class Entity
$obj = $obj ?: new $class(); $obj = $obj ?: new $class();
$args['created'] = $args['modified'] = new DateTime(); $args['created'] = $args['modified'] = new DateTime();
foreach ($args as $prop => $val) { foreach ($args as $prop => $val) {
if (property_exists($class, $prop)) { if (property_exists($class, $prop) && $val != null) {
$set = 'set' . Formatting::snakeCaseToCamelCase($prop); $set = 'set' . Formatting::snakeCaseToCamelCase($prop);
$obj->{$set}($val); $obj->{$set}($val);
} else { } else {

View File

@ -21,6 +21,7 @@
namespace App\Entity; namespace App\Entity;
use App\Core\Cache;
use App\Core\DB\DB; use App\Core\DB\DB;
use App\Core\Entity; use App\Core\Entity;
use App\Core\Event; use App\Core\Event;
@ -187,6 +188,23 @@ class Note extends Entity
return $url; return $url;
} }
public function getAttachments(): array
{
return Cache::get('note-attachments-' . $this->id, function () {
return DB::dql(
'select f from App\Entity\File f ' .
'join App\Entity\FileToNote ftn with ftn.file_id = f.id ' .
'where ftn.note_id = :note_id',
['note_id' => $this->id]
);
});
}
public function getReplies(): array
{
return Cache::getList('note-replies-' . $this->id, function () { return DB::dql('select n from App\Entity\Note n where n.reply_to = :id', ['id' => $this->id]); });
}
public static function schemaDef(): array public static function schemaDef(): array
{ {
return [ return [

View File

@ -47,8 +47,8 @@ abstract class Main
$r->connect('register', '/register', [C\Security::class, 'register']); $r->connect('register', '/register', [C\Security::class, 'register']);
$r->connect('root', '/', RedirectController::class, ['defaults' => ['route' => 'main_all']]); $r->connect('root', '/', RedirectController::class, ['defaults' => ['route' => 'main_all']]);
$r->connect('main_all', '/main/all', [C\NetworkPublic::class, 'public']); $r->connect('main_all', '/main/all', [C\Network::class, 'public']);
$r->connect('home_all', '/{nickname<' . Nickname::DISPLAY_FMT . '>}/all', [C\NetworkPublic::class, 'home']); $r->connect('home_all', '/{nickname<' . Nickname::DISPLAY_FMT . '>}/all', [C\Network::class, 'home']);
$r->connect('panel', '/panel', [C\AdminPanel::class, 'site']); $r->connect('panel', '/panel', [C\AdminPanel::class, 'site']);
$r->connect('panel_site', '/panel/site', [C\AdminPanel::class, 'site']); $r->connect('panel_site', '/panel/site', [C\AdminPanel::class, 'site']);

View File

@ -81,6 +81,16 @@ abstract class Common
return self::user()->getActor(); return self::user()->getActor();
} }
public static function ensureLoggedIn(): LocalUser
{
if (($user = self::user()) == null) {
throw new NoLoggedInUser();
// TODO Maybe redirect to login page and back
} else {
return $user;
}
}
/** /**
* Is the given string identical to a system path or route? * Is the given string identical to a system path or route?
* This could probably be put in some other class, but at * This could probably be put in some other class, but at

View File

@ -0,0 +1,34 @@
<?php
// {{{ License
// This file is part of GNU social - https://www.gnu.org/software/social
//
// GNU social is free software: you can redistribute it and/or modify
// it under the terms of the GNU Affero General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// GNU social is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Affero General Public License for more details.
//
// You should have received a copy of the GNU Affero General Public License
// along with GNU social. If not, see <http://www.gnu.org/licenses/>.
// }}}
namespace App\Util\Exception;
/**
* No user logged in
*
* @category Exception
* @package GNUsocial
*
* @author Hugo Sales <hugo@fc.up.pt>
* @copyright 2020 Free Software Foundation, Inc http://www.fsf.org
* @license https://www.gnu.org/licenses/agpl.html GNU AGPL v3 or later
*/
class NoLoggedInUser extends NicknameInvalidException
{
}

View File

@ -72,9 +72,11 @@
<li> <li>
<a href="{{ path('main_all') }}" class='hover-effect {{ active('main_all') }}'>Public</a> <a href="{{ path('main_all') }}" class='hover-effect {{ active('main_all') }}'>Public</a>
</li> </li>
<li> {% if user_nickname is defined %}
<li>
<a href="{{ path("home_all", {'nickname' : user_nickname}) }}" class='hover-effect {{ active("home_all") }}'>Home</a> <a href="{{ path("home_all", {'nickname' : user_nickname}) }}" class='hover-effect {{ active("home_all") }}'>Home</a>
</li> </li>
{% endif %}
<li> <li>
<a href="#">Network</a> <a href="#">Network</a>
</li> </li>
@ -84,25 +86,8 @@
<div class="notes"> <div class="notes">
{% if notes is defined and notes is not empty %} {% if notes is defined and notes is not empty %}
{% for note in notes %} {% for note in notes %}
<div class="notice"> {% set id = note.getId() - 1 %}
<div class="notice-info"> {% include '/note/view.html.twig' with {'note': note} only %}
<a href="{{ path('settings_avatar') }}">
<img src="{{ note.getAvatarUrl() }}" alt="{{ note.getActorNickname() }}'s avatar">
</a>
<b>{{ note.getActorNickname() }}</b>
</div>
<div class="notice-content">
{{ note.getContent() }}
{% set id = note.getId() - 1 %}
{% for attachment in attachments[id] %}
<div>
<i> {{ attachment.getTitle() }} </i>
</div>
{% endfor %}
</div>
<div class="notice-actions">
</div>
</div>
{% endfor %} {% endfor %}
{% else %} {% else %}
<h1>{% trans %}No notes here.{% endtrans %}</h1> <h1>{% trans %}No notes here.{% endtrans %}</h1>

View File

@ -0,0 +1,10 @@
{% extends '/base.html.twig' %}
{% block body %}
<div class="content" style="margin-top: 5em">
<div class="main">
{% include '/note/view.html.twig' with {'note': note} only %}
{{ form(reply) }}
</div>
</div>
{% endblock body %}

View File

@ -0,0 +1,28 @@
<div class="note">
<div class="note-info">
<a href="{{ path('settings_avatar') }}">
<img src="{{ note.getAvatarUrl() }}" alt="{{ note.getActorNickname() }}'s avatar">
</a>
<b>{{ note.getActorNickname() }}</b>
</div>
<div class="note-content">
{{ note.getContent() }}
{% for attachment in note.getAttachments() %}
<div>
<i> {{ attachment.getTitle() }} </i>
</div>
{% endfor %}
</div>
<div class="note-actions">
<a href="{{ path('note_reply', {'reply_to': note.getId()}) }}">
<svg class="icon icon-reply">
<use xlink:href="#icon-reply"></use>
</svg>
</a>
</div>
<div class="replies">
{% for reply in note.getReplies() %}
{% include '/note/view.html.twig' with {'note': reply} only %}
{% endfor %}
</div>
</div>