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