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

                    if (intval($oProductgroup->__get('infopage')) > 0) echo \get_permalink(intval($oProductgroup->__get('infopage')));
                    else echo $page_url.'show='.$oProductgroup->getId();

                    ?>" class="productgroup <?php
                        
                                                echo (($oProductgroup->hasActiveDiscount())?'active_discount':'');
                        
                                        ?>">
                                        
                    <div class="title"><?php echo $oProductgroup->getLabel(); ?></div>

                    <?php echo \wp_get_attachment_image($oProductgroup->getImage(), [462, 462], false, [
                        'class' => 'bg'
                    ]); ?>
                                        
                                        <?php if ($oProductgroup->hasActiveDiscount()) { ?>
                                                <div class="badge_overlay"><div class="badge">SALE</div></div>
                                        <?php } ?>

                </a>

            <?php } ?>

        </div>

        <style>

            .wpsg_mod_productgroup_layout2.productgroups { all:revert; width:100%; 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 { z-index:2; 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; }

                        .wpsg_mod_productgroup_layout2 .productgroup.active_discount { position:relative; }
                        .wpsg_mod_productgroup_layout2 .productgroup.active_discount .badge_overlay { position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; pointer-events:none; z-index:100; }
                        .wpsg_mod_productgroup_layout2 .productgroup.active_discount .badge_overlay .badge {
                                margin:0; color:white; padding:3px 10px; font-size:1rem; text-align:center;
                                background:#ed1b24; position:absolute; top:0; right:0; transform:translateX(30%) translateY(0%) rotate(45deg); transform-origin:top left;
                        }
                        .wpsg_mod_productgroup_layout2 .productgroup.active_discount .badge_overlay .badge:before {
                                content:''; position:absolute; top:0; right:100%; margin:0 -1px; width:100%; height:100%; background:inherit; min-width:55px;
                        }
                        .wpsg_mod_productgroup_layout2 .productgroup.active_discount .badge_overlay .badge:after {
                                content:''; position:absolute; top:0; left:100%; margin:0 -1px; width:100%; height:100%; background:inherit; min-width:55px;
            }
                        
            @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:100%; }

            }

        </style>

    <?php } ?>
</div>