Změna obrázku po kliknutí na tlačítko

Alyxx
Člen | 9
+
0
-

Dobrý den, už druhý den se snažím vymyslet jak propojit tlačítka v latte s presenterem kvůli vykreslování obrázků.
Princip je takový, že v presenteru mám paths k obrázkům v poli, odkud je posílám na vykreslení do latte a potřebuji po kliknutí na tlačítko změnit obrázek. Problém je že pracuji na verzi Nette 2.3 a php 7.1. Děkuji za nápad či odpověď.

nightfish
Člen | 474
+
0
-

@Alyxx Pokud něco potřebuješ udělat po kliknutí na tlačítko v PHP, tak tlačítko buď musí být součástí formuláře nebo to musí být odkaz (např. na signál). Předání správných dat do šablony pak dosáhneš v onSuccess() metodě formuláře nebo handle metodě signálu.

Tohle jsou zrovna věci, které se mezi Nette 2.3 a PHP 7.1 a aktuálním Nette/PHP neliší, snad s výjimkou PHP syntaxe.

Alyxx
Člen | 9
+
0
-

nightfish napsal(a):

@Alyxx Pokud něco potřebuješ udělat po kliknutí na tlačítko v PHP, tak tlačítko buď musí být součástí formuláře nebo to musí být odkaz (např. na signál). Předání správných dat do šablony pak dosáhneš v onSuccess() metodě formuláře nebo handle metodě signálu.

Tohle jsou zrovna věci, které se mezi Nette 2.3 a PHP 7.1 a aktuálním Nette/PHP neliší, snad s výjimkou PHP syntaxe.

Děkuji za odpověď, tohle mi vůbec nedošlo. Je nějaká možnost jak mít image a form ve stejné komponentě, případně z form komponenty měnit promněnné v image komponentě?

nightfish
Člen | 474
+
0
-

@Alyxx
Jak v tuto chvíli vypadá kód tvého presenteru (stačí ta část v presenteru mám paths k obrázkům v poli, odkud je posílám na vykreslení do latte) a kód šablony (která hádám nějak ty obrázky a tlačítka vykresluje)?
Kód nemusí fungovat, ani dělat to co potřebuješ, ale bude jednodušší se bavit o konkrétním kódu než tu řešit rozdělení neznámého kódu do komponent…

Alyxx
Člen | 9
+
0
-

nightfish napsal(a):

@Alyxx
Jak v tuto chvíli vypadá kód tvého presenteru (stačí ta část v presenteru mám paths k obrázkům v poli, odkud je posílám na vykreslení do latte) a kód šablony (která hádám nějak ty obrázky a tlačítka vykresluje)?
Kód nemusí fungovat, ani dělat to co potřebuješ, ale bude jednodušší se bavit o konkrétním kódu než tu řešit rozdělení neznámého kódu do komponent…

Kód presenteru vypadá následovně, omlouvám se za pozdní odpověď ale neměl jsem k tomu přes víkend přístup.

public function createComponentTestPatra(): Form
    {
        $form = new Form;
        $branch_office_id = 1;
        $idtest = 8;

        $idZamestnanec = $this->template->google = $this->googleMap
                ->getidZamestnanec($idtest);

        $idZakaznik  = $this->template->google = $this->googleMap
                ->getidZakaznik($idZamestnanec);

        ;

        $branch_office_id =$this->template->google = $this->googleMap
                ->getidPobockaZakaznik($idZakaznik);

        $img_paths =

                $this->template->patra = $this->googleMap
                    ->getImgPath($branch_office_id[0]);

        $imgSelect = $form->addSelect('path', 'Img_paths:', $img_paths);

        $form->addButton('previous','Previous')
            ->setHtmlAttribute('onclick','ahoj()');
        $form->addButton('next','Next');

        return $form;
    }

    public function ahoj()
    {
        echo ("Ahoj");
    }

    public function renderDefault()
    {

        /*$form = new Form;
        $form->addButton('previous','Previous');
        $form->addButton('next','Next');


        $branch_office_id = 1;
        $img_paths =
                $this->template->patra = $this->googleMap
                    ->getImgPath($branch_office_id);
        ;
        $index = 2;
        $image = Image::fromFile('C:/Users/venhm/Desktop/chyba.png');
        image = "C:/Users/venhm/Desktop/chyba.png";*/
        $paths = array("C:/xampp/htdocs/timerservice/www/uploads/localhost/docs/branch_customer/construction_drawings/2021-02-05_10-22-02_E5GYSYPWP.jpg", "C:/xampp/htdocs/timerservice/www/uploads/localhost/docs/branch_customer/construction_drawings/2021-02-09_21-52-53_26LTDHW08.png");
        $image = Image::fromFile($img_paths[$index]);
        $this->template->patraMap = $image;

        //return $form;
        //$image->send(Image::JPEG);
    }



Editoval Alyxx (18. 9. 2023 7:12)

nightfish
Člen | 474
+
0
-

@Alyxx Vidím, že tam máš nějaký formulář, v rámci kterého máš selectbox s cestami k obrázku.
A pak v presenteru kód, který z jednoho obrázku udělá Image a pošle jej do šablony.

V nejjednodušším případě bych to udělal následovně (snažil jsem se používat co nejméně moderní syntaxi, protože už si popravdě nepamatuji, co bylo povolené už v PHP 7.1 a co bylo přidáno později; stejně tak u Nette/Latte):

Celá myšlenka je jednoduchá – máš pole s obrázky (nejspíš k nim nechceš přistupovat přes filesystém, protože bys potom pro vykreslení v šabloně musel v každém requestu každý obrázek obalit přes Image::fromFile(), což by bylo imho zbytečně pomalé; z toho důvodu jsou v poli jen části URL, které po složení se standardní nette $basePath budou validní URL sloužící ke stažení/zobrazení obrázků), toto pole předáš do presenteru a vykreslíš. Každý obrázek (kromě aktuálně vybraného) je obalen odkazem, který slouží k vybrání obrázku po kliknutí. Vybrání obrázku není řešeno ani formulářem, ani signálem, nýbrž jen odkazem na renderDefault() s předáním příslušného indexu obrázku.

Presenter (index vybraného obrázku se do presenteru předává jako argument render metody; žádný obrázek nemusí být vybraný):

public function renderDefault($selectedImageIndex = null)
{
    $images = $this->getImages();
    $selectedImageUrlPart = null;

    if (!empty($selectedImageIndex)) {
        $selectedImageUrlPart = $images[$selectedImageIndex];
    }

    $this->template->images = $images;
    $this->template->selectedImageUrlPart = $selectedImageUrlPart;
}

/**
 * Vraci pole casti URL, ktere dohromady s $basePath daji funkcni URL
 * ke stazeni obrazku.
 */
private function getImages(): array
{
    return [
        "uploads/localhost/docs/branch_customer/construction_drawings/2021-02-05_10-22-02_E5GYSYPWP.jpg",
        "uploads/localhost/docs/branch_customer/construction_drawings/2021-02-09_21-52-53_26LTDHW08.png",
    ];
}

Šablona (vykreslí jednotlivé obrázky, obalené odkazem; aktuálně zvolený obrázek odkazem obalený není):

{foreach $images as $imageIndex => $imageUrlPart}
    <a n:tag-if="$imageUrlPart !== $selectedImageUrlPart" n:href="Presenter:default $imageIndex"><img src="{$basePath}/{$imageUrlPart}" /></a>
{/foreach}
Alyxx
Člen | 9
+
0
-

nightfish napsal(a):

@Alyxx Vidím, že tam máš nějaký formulář, v rámci kterého máš selectbox s cestami k obrázku.
A pak v presenteru kód, který z jednoho obrázku udělá Image a pošle jej do šablony.

V nejjednodušším případě bych to udělal následovně (snažil jsem se používat co nejméně moderní syntaxi, protože už si popravdě nepamatuji, co bylo povolené už v PHP 7.1 a co bylo přidáno později; stejně tak u Nette/Latte):

Celá myšlenka je jednoduchá – máš pole s obrázky (nejspíš k nim nechceš přistupovat přes filesystém, protože bys potom pro vykreslení v šabloně musel v každém requestu každý obrázek obalit přes Image::fromFile(), což by bylo imho zbytečně pomalé; z toho důvodu jsou v poli jen části URL, které po složení se standardní nette $basePath budou validní URL sloužící ke stažení/zobrazení obrázků), toto pole předáš do presenteru a vykreslíš. Každý obrázek (kromě aktuálně vybraného) je obalen odkazem, který slouží k vybrání obrázku po kliknutí. Vybrání obrázku není řešeno ani formulářem, ani signálem, nýbrž jen odkazem na renderDefault() s předáním příslušného indexu obrázku.

Presenter (index vybraného obrázku se do presenteru předává jako argument render metody; žádný obrázek nemusí být vybraný):

public function renderDefault($selectedImageIndex = null)
{
    $images = $this->getImages();
    $selectedImageUrlPart = null;

    if (!empty($selectedImageIndex)) {
        $selectedImageUrlPart = $images[$selectedImageIndex];
    }

    $this->template->images = $images;
    $this->template->selectedImageUrlPart = $selectedImageUrlPart;
}

/**
 * Vraci pole casti URL, ktere dohromady s $basePath daji funkcni URL
 * ke stazeni obrazku.
 */
private function getImages(): array
{
    return [
        "uploads/localhost/docs/branch_customer/construction_drawings/2021-02-05_10-22-02_E5GYSYPWP.jpg",
        "uploads/localhost/docs/branch_customer/construction_drawings/2021-02-09_21-52-53_26LTDHW08.png",
    ];
}

Šablona (vykreslí jednotlivé obrázky, obalené odkazem; aktuálně zvolený obrázek odkazem obalený není):

{foreach $images as $imageIndex => $imageUrlPart}
    <a n:tag-if="$imageUrlPart !== $selectedImageUrlPart" n:href="Presenter:default $imageIndex"><img src="{$basePath}/{$imageUrlPart}" /></a>
{/foreach}

Děkuji mockrát, konečně jsem schopný to dokončit.