Subversion Repositories wpShopGermany4

<?php

    /** Template für die Anzeige von Produktgruppen Layout 2 */

    namespace wpsg;

    $page_url = \get_permalink(\get_the_ID());
    $page_url .= ((strpos($page_url, '?') === false)?'?':'&');

    if (isset($_REQUEST['show'])) {

        $oProductgroup = \wpsg_productgroup::getInstance(intval($_REQUEST['show']));
        $arProducts = $oProductgroup->findProducts();
        $view = 'products';

    } else {

        $arProductgroups = \wpsg_productgroup::find();
        $view = 'productgroups';

    }

?>

<div class="wpsg_mod_productgroup_layout2_wrap">
    <?php if ($view === 'products') { ?>

        <div class="wpsg_mod_productgroup_layout2 products">

            <?php foreach ($arProducts as $oProduct) { ?>

                <?php echo $this->renderProdukt($oProduct->getId(), $oProductgroup->getTemplate()); ?>

            <?php } ?>

            <br />

            <a href="<?php echo $page_url; ?>"><?php echo __('Zurück zur Übersicht', 'wpsg'); ?></a>
            
        </div>

    <?php } else if ($view === 'productgroups') { ?>

        <div class="wpsg_mod_productgroup_layout2 productgroups">

            <?php foreach ($arProductgroups as $k => $oProductgroup) { ?>

                <a href="<?php echo $page_url; ?>show=<?php echo $oProductgroup->getId(); ?>" class="productgroup">

                    <div class="title"><?php echo $oProductgroup->getName(); ?></div>

                    <?php echo \wp_get_attachment_image($oProductgroup->getImage(), 'full', false, [
                        'class' => 'bg'
                    ]); ?>

                </a>

            <?php } ?>

        </div>

        <style>

            .wpsg_mod_productgroup_layout2.productgroups { all:revert; display:grid; grid-template-columns:repeat(2, 1fr); grid-template-rows:repeat(10, 1fr); grid-column-gap:1rem; grid-row-gap:1rem; }
            .wpsg_mod_productgroup_layout2.productgroups > .productgroup { grid-column:span 2; padding-top:100%; text-decoration:none; position:relative; overflow:hidden; transition:all 0.3s ease; overflow:hidden width:100%; }
            .wpsg_mod_productgroup_layout2.productgroups > .productgroup  .bg { position:absolute; left:0; top:0; object-position:50% 50%; background-color:#DEDEDE; width:100%; height:100%; object-fit:cover; z-index:-1; }
            .wpsg_mod_productgroup_layout2.productgroups > .productgroup .title {  border-radius:2px; transition:all 0.3s ease; position:absolute; left:1rem; top:1rem; background-color:#000000; color:#FFFFFF; padding:0 0.5rem; }
            .wpsg_mod_productgroup_layout2.productgroups > .productgroup:hover .title { background-color:#FFFFFF; color:#000000; }

            @media screen and (min-width:768px) {

                .wpsg_mod_productgroup_layout2.productgroups > .productgroup { padding-top:initial; grid-column:initial; }
                .wpsg_mod_productgroup_layout2.productgroups > .productgroup:nth-child(6n + 1),
                .wpsg_mod_productgroup_layout2.productgroups > .productgroup:nth-child(6n + 5) { grid-row:span 2; padding-top:200px; }

            }

        </style>

    <?php } ?>
</div>