xref: /template/strap/ComboStrap/Hover.php (revision 4cadd4f8c541149bdda95f080e38a6d4e3a640ca)
137748cd8SNickeau<?php
237748cd8SNickeau
337748cd8SNickeau
437748cd8SNickeaunamespace ComboStrap;
537748cd8SNickeau
637748cd8SNickeau
737748cd8SNickeauclass Hover
837748cd8SNickeau{
937748cd8SNickeau    /**
1037748cd8SNickeau     * Smooth animation
1137748cd8SNickeau     * on hover animation
1237748cd8SNickeau     */
1337748cd8SNickeau    const COMBO_HOVER_EASING_CLASS = "combo-hover-easing";
1437748cd8SNickeau    /**
1537748cd8SNickeau     * Supported Animation name of hover
1637748cd8SNickeau     * float and grow are not in
1737748cd8SNickeau     */
1837748cd8SNickeau    const HOVER_ANIMATIONS = ["shrink", "pulse", "pulse-grow", "pulse-shrink", "push", "pop", "bounce-in", "bounce-out", "rotate", "grow-rotate", "sink", "bob", "hang", "skew", "skew-forward", "skew-backward", "wobble-horizontal", "wobble-vertical", "wobble-to-bottom-right", "wobble-to-top-right", "wobble-top", "wobble-bottom", "wobble-skew", "buzz", "buzz-out", "forward", "backward", "fade", "back-pulse", "sweep-to-right", "sweep-to-left", "sweep-to-bottom", "sweep-to-top", "bounce-to-right", "bounce-to-left", "bounce-to-bottom", "bounce-to-top", "radial-out", "radial-in", "rectangle-in", "rectangle-out", "shutter-in-horizontal", "shutter-out-horizontal", "shutter-in-vertical", "shutter-out-vertical", "icon-back", "hollow", "trim", "ripple-out", "ripple-in", "outline-out", "outline-in", "round-corners", "underline-from-left", "underline-from-center", "underline-from-right", "reveal", "underline-reveal", "overline-reveal", "overline-from-left", "overline-from-center", "overline-from-right", "grow-shadow", "float-shadow", "glow", "shadow-radial", "box-shadow-outset", "box-shadow-inset", "bubble-top", "bubble-right", "bubble-bottom", "bubble-left", "bubble-float-top", "bubble-float-right", "bubble-float-bottom", "bubble-float-left", "curl-top-left", "curl-top-right", "curl-bottom-right", "curl-bottom-left"];
1937748cd8SNickeau    const ON_HOVER_SNIPPET_ID = "onhover";
2037748cd8SNickeau    const ON_HOVER_ATTRIBUTE = "onhover";
2137748cd8SNickeau
2237748cd8SNickeau    /**
2337748cd8SNickeau     * Process hover animation
2437748cd8SNickeau     * @param TagAttributes $attributes
2537748cd8SNickeau     */
2637748cd8SNickeau    public static function processOnHover(&$attributes)
2737748cd8SNickeau    {
2837748cd8SNickeau        if ($attributes->hasComponentAttribute(self::ON_HOVER_ATTRIBUTE)) {
2937748cd8SNickeau            $hover = strtolower($attributes->getValueAndRemove(self::ON_HOVER_ATTRIBUTE));
3037748cd8SNickeau            $hoverAnimations = preg_split("/\s/", $hover);
3137748cd8SNickeau
3237748cd8SNickeau            $comboDataHoverClasses = "";
3337748cd8SNickeau            $snippetManager = PluginUtility::getSnippetManager();
3437748cd8SNickeau            foreach ($hoverAnimations as $hover) {
3537748cd8SNickeau
3637748cd8SNickeau                if (in_array($hover, self::HOVER_ANIMATIONS)) {
37*4cadd4f8SNickeau
38*4cadd4f8SNickeau                    $snippetManager
39*4cadd4f8SNickeau                        ->attachCssExternalStyleSheetForSlot(
40*4cadd4f8SNickeau                            self::ON_HOVER_SNIPPET_ID,
41*4cadd4f8SNickeau                            "https://cdnjs.cloudflare.com/ajax/libs/hover.css/2.3.1/css/hover-min.css",
42*4cadd4f8SNickeau                            "sha512-csw0Ma4oXCAgd/d4nTcpoEoz4nYvvnk21a8VA2h2dzhPAvjbUIK6V3si7/g/HehwdunqqW18RwCJKpD7rL67Xg=="
4337748cd8SNickeau                        )
44*4cadd4f8SNickeau                        ->setCritical(false);
45*4cadd4f8SNickeau
4637748cd8SNickeau                    $attributes->addClassName("hvr-$hover");
4737748cd8SNickeau
4837748cd8SNickeau                } else {
4937748cd8SNickeau
5037748cd8SNickeau                    /**
5137748cd8SNickeau                     * The combo hover effect
5237748cd8SNickeau                     */
5337748cd8SNickeau                    if (in_array($hover, ["float", "grow"])) {
5437748cd8SNickeau                        $hover = "combo-" . $hover;
5537748cd8SNickeau                    }
5637748cd8SNickeau
5737748cd8SNickeau                    /**
5837748cd8SNickeau                     * Shadow translation between animation name
5937748cd8SNickeau                     * and class
6037748cd8SNickeau                     */
6137748cd8SNickeau                    switch ($hover) {
6237748cd8SNickeau                        case "shadow":
6337748cd8SNickeau                            $hover = Shadow::getDefaultClass();
6437748cd8SNickeau                            break;
6537748cd8SNickeau                        case "shadow-md":
6637748cd8SNickeau                            $hover = Shadow::MEDIUM_ELEVATION_CLASS;
6737748cd8SNickeau                            break;
6837748cd8SNickeau                        case "shadow-lg":
6937748cd8SNickeau                            $hover = "shadow";
7037748cd8SNickeau                            break;
7137748cd8SNickeau                        case "shadow-xl":
7237748cd8SNickeau                            $hover = "shadow-lg";
7337748cd8SNickeau                            break;
7437748cd8SNickeau                    }
7537748cd8SNickeau
7637748cd8SNickeau                    /**
7737748cd8SNickeau                     * Add it to the list of class
7837748cd8SNickeau                     */
7937748cd8SNickeau                    $comboDataHoverClasses .= " " . $hover;
8037748cd8SNickeau
8137748cd8SNickeau                }
8237748cd8SNickeau
8337748cd8SNickeau            }
8437748cd8SNickeau            if (!empty($comboDataHoverClasses)) {
8537748cd8SNickeau
8637748cd8SNickeau                // Grow, float and easing are in the css
8737748cd8SNickeau                $snippetManager
88*4cadd4f8SNickeau                    ->attachCssInternalStyleSheetForSlot(self::ON_HOVER_SNIPPET_ID)
8937748cd8SNickeau                    ->setCritical(false);
9037748cd8SNickeau
9137748cd8SNickeau                // Smooth Transition in and out of hover
9237748cd8SNickeau                $attributes->addClassName(self::COMBO_HOVER_EASING_CLASS);
9337748cd8SNickeau
94*4cadd4f8SNickeau                $attributes->addOutputAttributeValue("data-hover-class", trim($comboDataHoverClasses));
9537748cd8SNickeau
9637748cd8SNickeau                // The javascript that manage the hover effect by adding the class in the data-hover class
97*4cadd4f8SNickeau                $snippetManager->attachInternalJavascriptForSlot(self::ON_HOVER_SNIPPET_ID);
9837748cd8SNickeau
9937748cd8SNickeau            }
10037748cd8SNickeau
10137748cd8SNickeau        }
10237748cd8SNickeau
10337748cd8SNickeau    }
10437748cd8SNickeau}
105