Δημιουργία και επεξεργασία αναρτήσεων

Αυτό είναι υπέροχο! Έχουμε ένα σούπερ cool νέο blog, οι άνθρωποι συζητούν έντονα στα σχόλια και εμείς έχουμε επιτέλους λίγο χρόνο για περαιτέρω προγραμματισμό. Παρόλο που το Adminer είναι ένα εξαιρετικό εργαλείο, δεν είναι εντελώς ιδανικό για τη συγγραφή νέων αναρτήσεων στο blog. Προφανώς είναι η κατάλληλη στιγμή για να δημιουργήσουμε μια απλή φόρμα για την προσθήκη νέων αναρτήσεων απευθείας από την εφαρμογή. Ας το κάνουμε.

Ας ξεκινήσουμε με τον σχεδιασμό του user interface:

Στην αρχική σελίδα θα προσθέσουμε έναν σύνδεσμο “Γράψτε νέα ανάρτηση”.
Αυτός ο σύνδεσμος θα εμφανίσει μια φόρμα με τίτλο και textarea για το περιεχόμενο της ανάρτησης.
Όταν κάνουμε κλικ στο κουμπί Αποθήκευση, η ανάρτηση θα αποθηκευτεί στη βάση δεδομένων.

Αργότερα θα προσθέσουμε επίσης σύνδεση και θα επιτρέψουμε την προσθήκη αναρτήσεων μόνο σε συνδεδεμένους χρήστες. Αλλά αυτό αργότερα. Ποιον κώδικα πρέπει να γράψουμε τώρα για να λειτουργήσουν όλα;

Θα δημιουργήσουμε έναν νέο presenter με μια φόρμα για την προσθήκη αναρτήσεων.
Θα ορίσουμε ένα callback που θα εκτελεστεί μετά την επιτυχή υποβολή της φόρμας και το οποίο θα αποθηκεύσει τη νέα ανάρτηση στη βάση δεδομένων.
Θα δημιουργήσουμε ένα νέο template στο οποίο θα βρίσκεται αυτή η φόρμα.
Θα προσθέσουμε έναν σύνδεσμο προς τη φόρμα στο template της κύριας σελίδας.

Νέος presenter

Θα ονομάσουμε τον νέο presenter EditPresenter και θα τον αποθηκεύσουμε στο app/Presentation/Edit/. Επίσης, πρέπει να συνδεθεί στη βάση δεδομένων, οπότε θα γράψουμε ξανά έναν constructor που θα απαιτεί σύνδεση στη βάση δεδομένων:

<?php
namespace App\Presentation\Edit;

use Nette;
use Nette\Application\UI\Form;

final class EditPresenter extends Nette\Application\UI\Presenter
{
	public function __construct(
		private Nette\Database\Explorer $database,
	) {
	}
}

Φόρμα για αποθήκευση αναρτήσεων

Έχουμε ήδη εξηγήσει τις φόρμες και τα components κατά τη δημιουργία των σχολίων. Αν ακόμα δεν είναι σαφές, πηγαίνετε να δείτε τη δημιουργία φορμών και components, εμείς θα περιμένουμε εδώ ;)

Τώρα ας προσθέσουμε αυτή τη μέθοδο στον presenter EditPresenter:

protected function createComponentPostForm(): Form
{
	$form = new Form;
	$form->addText('title', 'Τίτλος:')
		->setRequired();
	$form->addTextArea('content', 'Περιεχόμενο:')
		->setRequired();

	$form->addSubmit('send', 'Αποθήκευση και δημοσίευση');
	$form->onSuccess[] = $this->postFormSucceeded(...);

	return $form;
}

Αποθήκευση νέας ανάρτησης από τη φόρμα

Συνεχίζουμε προσθέτοντας τη μέθοδο που επεξεργάζεται τα δεδομένα από τη φόρμα:

private function postFormSucceeded(array $data): void
{
	$post = $this->database
		->table('posts')
		->insert($data);

	$this->flashMessage("Η ανάρτηση δημοσιεύτηκε με επιτυχία.", 'success');
	$this->redirect('Post:show', $post->id);
}

Μόνο μια γρήγορη ανακεφαλαίωση: αυτή η μέθοδος λαμβάνει τα δεδομένα από τη φόρμα, τα εισάγει στη βάση δεδομένων, δημιουργεί ένα μήνυμα για τον χρήστη σχετικά με την επιτυχή αποθήκευση της ανάρτησης και ανακατευθύνει στη σελίδα με τη νέα ανάρτηση, ώστε να δούμε αμέσως πώς φαίνεται.

Σελίδα για δημιουργία νέας ανάρτησης

Ας δημιουργήσουμε τώρα το template Edit/create.latte:

{block content}
<h1>Νέα ανάρτηση</h1>

{control postForm}

Όλα θα πρέπει να είναι ήδη σαφή. Η τελευταία γραμμή αποδίδει τη φόρμα που μόλις δημιουργήσαμε.

Θα μπορούσαμε επίσης να δημιουργήσουμε την αντίστοιχη μέθοδο renderCreate, αλλά δεν είναι απαραίτητο. Δεν χρειαζόμαστε να λάβουμε δεδομένα από τη βάση δεδομένων και να τα περάσουμε στο template, οπότε αυτή η μέθοδος θα ήταν κενή. Σε τέτοιες περιπτώσεις, η μέθοδος δεν χρειάζεται καν να υπάρχει.

Σύνδεσμος για δημιουργία αναρτήσεων

Πιθανότατα ήδη ξέρετε πώς να προσθέσετε έναν σύνδεσμο στον EditPresenter και την action create του. Δοκιμάστε το.

Απλά προσθέστε στο αρχείο app/Presentation/Home/default.latte:

<a n:href="Edit:create">Γράψτε νέα ανάρτηση</a>

Επεξεργασία αναρτήσεων

Τώρα θα προσθέσουμε επίσης τη δυνατότητα επεξεργασίας της ανάρτησης. Θα είναι πολύ απλό. Έχουμε ήδη έτοιμη τη φόρμα postForm και μπορούμε να τη χρησιμοποιήσουμε και για επεξεργασία.

Θα προσθέσουμε μια νέα σελίδα edit στον presenter EditPresenter:

public function renderEdit(int $id): void
{
	$post = $this->database
		->table('posts')
		->get($id);

	if (!$post) {
		$this->error('Post not found');
	}

	$this->getComponent('postForm')
		->setDefaults($post->toArray());
}

Και θα δημιουργήσουμε ένα άλλο template Edit/edit.latte:

{block content}
<h1>Επεξεργασία ανάρτησης</h1>

{control postForm}

Και θα τροποποιήσουμε τη μέθοδο postFormSucceeded, η οποία θα μπορεί τόσο να προσθέσει ένα νέο άρθρο (όπως κάνει τώρα) όσο και να επεξεργαστεί ένα ήδη υπάρχον άρθρο:

private function postFormSucceeded(array $data): void
{
	$id = $this->getParameter('id');

	if ($id) {
		$post = $this->database
			->table('posts')
			->get($id);
		$post->update($data);

	} else {
		$post = $this->database
			->table('posts')
			->insert($data);
	}

	$this->flashMessage('Η ανάρτηση δημοσιεύτηκε με επιτυχία.', 'success');
	$this->redirect('Post:show', $post->id);
}

Εάν η παράμετρος id είναι διαθέσιμη, σημαίνει ότι θα επεξεργαστούμε την ανάρτηση. Σε αυτήν την περίπτωση, θα επαληθεύσουμε ότι η ζητούμενη ανάρτηση υπάρχει πραγματικά και, αν ναι, θα την ενημερώσουμε στη βάση δεδομένων. Εάν η παράμετρος id δεν είναι διαθέσιμη, τότε σημαίνει ότι θα πρέπει να προστεθεί μια νέα ανάρτηση.

Αλλά από πού προέρχεται αυτή η παράμετρος id; Είναι η παράμετρος που εισήχθη στη μέθοδο renderEdit.

Τώρα μπορούμε να προσθέσουμε έναν σύνδεσμο στο template app/Presentation/Post/show.latte:

<a n:href="Edit:edit $post->id">Επεξεργασία ανάρτησης</a>

Σύνοψη

Το blog είναι τώρα λειτουργικό, οι επισκέπτες σχολιάζουν ενεργά και δεν χρειαζόμαστε πλέον το Adminer για δημοσίευση. Η εφαρμογή είναι πλήρως ανεξάρτητη και ο καθένας μπορεί να προσθέσει μια νέα ανάρτηση. Μια στιγμή, αυτό μάλλον δεν είναι εντάξει, ότι ο καθένας – και εννοώ πραγματικά οποιονδήποτε με πρόσβαση στο διαδίκτυο – μπορεί να προσθέσει νέες αναρτήσεις. Απαιτείται κάποια ασφάλεια, ώστε μόνο ένας συνδεδεμένος χρήστης να μπορεί να προσθέσει μια νέα ανάρτηση. Θα το δούμε αυτό στο επόμενο κεφάλαιο.