Current File : /home/pacjaorg/public_html/nsa/components/com_sppagebuilder/addons/icon/site.php |
<?php
/**
* @package SP Page Builder
* @author JoomShaper http://www.joomshaper.com
* @copyright Copyright (c) 2010 - 2021 JoomShaper
* @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or later
*/
//no direct accees
defined ('_JEXEC') or die ('Restricted access');
class SppagebuilderAddonIcon extends SppagebuilderAddons {
public function render() {
$settings = $this->addon->settings;
$class = (isset($settings->class) && $settings->class) ? $settings->class : '';
$class .= (isset($settings->alignment) && $settings->alignment) ? ' ' . $settings->alignment : '';
$class .= (isset($settings->hover_effect) && $settings->hover_effect) ? ' sppb-icon-hover-effect-' . $settings->hover_effect : '';
$name = (isset($settings->name) && $settings->name) ? $settings->name : '';
$link = (isset($settings->link) && $settings->link) ? $settings->link : '';
$target = (isset($settings->target) && $settings->target) ? 'rel="noopener noreferrer" target="' . $settings->target . '"' : '';
if($name) {
$output = '<div class="sppb-icon ' . $class . '">';
if (!empty($link)) {
$output .= '<a ' . $target . ' href="'.$link.'">';
}
$output .= '<span class="sppb-icon-inner">';
$icon_arr = array_filter(explode(' ', $name));
if (count($icon_arr) === 1) {
$name = 'fa ' . $name;
}
$output .= '<i class="' . $name . '" aria-hidden="true"></i>';
$output .= '</span>';
if (!empty($link)) {
$output .= '</a>';
}
$output .= '</div>';
return $output;
}
}
public function css() {
$addon_id = '#sppb-addon-' . $this->addon->id;
$settings = $this->addon->settings;
// Normal
$icon_style = '';
$icon_style_sm = '';
$icon_style_xs = '';
$font_size = '';
$font_size_sm = '';
$font_size_xs = '';
if(isset($settings->margin) && trim($settings->margin) != ""){
$margin_md = '';
$margins = explode(' ', $settings->margin);
foreach($margins as $margin){
if(empty(trim($margin))){
$margin_md .= ' 0';
} else {
$margin_md .= ' '.$margin;
}
}
$icon_style .= "margin: " . $margin_md . ";\n";
}
if(isset($settings->margin_sm) && trim($settings->margin_sm) != ""){
$margin_sm_full = '';
$margins_sm = explode(' ', $settings->margin_sm);
foreach($margins_sm as $margin_sm){
if(empty(trim($margin_sm))){
$margin_sm_full .= ' 0';
} else {
$margin_sm_full .= ' '.$margin_sm;
}
}
$icon_style_sm .= "margin: " . $margin_sm_full . ";\n";
}
if(isset($settings->margin_xs) && trim($settings->margin_xs) != ""){
$margin_xs_full = '';
$margins_xs = explode(' ', $settings->margin_xs);
foreach($margins_xs as $margin_xs){
if(empty(trim($margin_xs))){
$margin_xs_full .= ' 0';
} else {
$margin_xs_full .= ' '.$margin_xs;
}
}
$icon_style_xs .= "margin: " . $margin_xs_full . ";\n";
}
$icon_style .= (isset($settings->height) && $settings->height) ? 'height: ' . (int) $settings->height . 'px;' : '';
$icon_style_sm .= (isset($settings->height_sm) && $settings->height_sm) ? 'height: ' . (int) $settings->height_sm . 'px;' : '';
$icon_style_xs .= (isset($settings->height_xs) && $settings->height_xs) ? 'height: ' . (int) $settings->height_xs . 'px;' : '';
$font_size .= (isset($settings->height) && $settings->height) ? 'line-height: ' . (int) $settings->height . 'px;' : '';
$font_size_sm .= (isset($settings->height_sm) && $settings->height_sm) ? 'line-height: ' . (int) $settings->height_sm . 'px;' : '';
$font_size_xs .= (isset($settings->height_xs) && $settings->height_xs) ? 'line-height: ' . (int) $settings->height_xs . 'px;' : '';
$icon_style .= (isset($settings->width) && $settings->width) ? 'width: ' . (int) $settings->width . 'px;' : '';
$icon_style_sm .= (isset($settings->width_sm) && $settings->width_sm) ? 'width: ' . (int) $settings->width_sm . 'px;' : '';
$icon_style_xs .= (isset($settings->width_xs) && $settings->width_xs) ? 'width: ' . (int) $settings->width_xs . 'px;' : '';
$icon_style .= (isset($settings->color) && $settings->color) ? 'color: ' . $settings->color . ';' : '';
$icon_style .= (isset($settings->background) && $settings->background) ? 'background-color: ' . $settings->background . ';' : '';
$icon_style .= (isset($settings->border_color) && $settings->border_color) ? 'border-style: solid; border-color: ' . $settings->border_color . ';' : '';
$icon_style .= (isset($settings->border_width) && $settings->border_width) ? 'border-width: ' . (int) $settings->border_width . 'px;' : '';
$icon_style_sm .= (isset($settings->border_width_sm) && $settings->border_width_sm) ? 'border-width: ' . (int) $settings->border_width_sm . 'px;' : '';
$icon_style_xs .= (isset($settings->border_width_xs) && $settings->border_width_xs) ? 'border-width: ' . (int) $settings->border_width_xs . 'px;' : '';
$icon_style .= (isset($settings->border_radius) && $settings->border_radius) ? 'border-radius: ' . (int) $settings->border_radius . 'px;' : '';
$icon_style_sm .= (isset($settings->border_radius_sm) && $settings->border_radius_sm) ? 'border-radius: ' . (int) $settings->border_radius_sm . 'px;' : '';
$icon_style_xs .= (isset($settings->border_radius_xs) && $settings->border_radius_xs) ? 'border-radius: ' . (int) $settings->border_radius_xs . 'px;' : '';
$font_size .= (isset($settings->size) && $settings->size) ? 'font-size: ' . (int) $settings->size . 'px;' : '';
$font_size_sm .= (isset($settings->size_sm) && $settings->size_sm) ? 'font-size: ' . (int) $settings->size_sm . 'px;' : '';
$font_size_xs .= (isset($settings->size_xs) && $settings->size_xs) ? 'font-size: ' . (int) $settings->size_xs . 'px;' : '';
$font_size .= (isset($settings->border_width) && $settings->border_width) ? 'margin-top: -' . (int) $settings->border_width . 'px;' : '';
$font_size_sm .= (isset($settings->border_width_sm) && $settings->border_width_sm) ? 'margin-top: -' . (int) $settings->border_width_sm . 'px;' : '';
$font_size_xs .= (isset($settings->border_width_xs) && $settings->border_width_xs) ? 'margin-top: -' . (int) $settings->border_width_xs . 'px;' : '';
// Mouse Hover
$icon_style_hover = '';
$icon_style_hover_sm = '';
$icon_style_hover_xs = '';
$icon_style_hover .= (isset($settings->hover_color) && $settings->hover_color) ? 'color: ' . $settings->hover_color . ';' : '';
$icon_style_hover .= (isset($settings->hover_background) && $settings->hover_background) ? 'background-color: ' . $settings->hover_background . ';' : '';
$icon_style_hover .= (isset($settings->hover_border_color) && $settings->hover_border_color) ? 'border-color: ' . $settings->hover_border_color . ';' : '';
$icon_style_hover .= (isset($settings->hover_border_width) && $settings->hover_border_width) ? 'border-width: ' . (int) $settings->hover_border_width . 'px;' : '';
$icon_style_hover_sm .= (isset($settings->hover_border_width_sm) && $settings->hover_border_width_sm) ? 'border-width: ' . (int) $settings->hover_border_width_sm . 'px;' : '';
$icon_style_hover_xs .= (isset($settings->hover_border_width_xs) && $settings->hover_border_width_xs) ? 'border-width: ' . (int) $settings->hover_border_width_xs . 'px;' : '';
$icon_style_hover .= (isset($settings->hover_border_radius) && $settings->hover_border_radius) ? 'border-radius: ' . (int) $settings->hover_border_radius . 'px;' : '';
$icon_style_hover_sm .= (isset($settings->hover_border_radius_sm) && $settings->hover_border_radius_sm) ? 'border-radius: ' . (int) $settings->hover_border_radius_sm . 'px;' : '';
$icon_style_hover_xs .= (isset($settings->hover_border_radius_xs) && $settings->hover_border_radius_xs) ? 'border-radius: ' . (int) $settings->hover_border_radius_xs . 'px;' : '';
$css = '';
if($icon_style) {
$css .= $addon_id . ' .sppb-icon-inner {';
$css .= $icon_style;
$css .= "\n" . '}' . "\n" ;
}
if($font_size) {
$css .= $addon_id . ' .sppb-icon-inner i {';
$css .= $font_size;
$css .= "\n" . '}' . "\n" ;
}
// Hover
if($icon_style_hover) {
$css .= $addon_id . ' .sppb-icon-inner:hover {';
$css .= $icon_style_hover;
$css .= "\n" . '}' . "\n" ;
}
if(!empty($icon_style_hover_sm) || !empty($icon_style_sm) || !empty($font_size_sm)) {
$css .= '@media (min-width: 768px) and (max-width: 991px) {';
if($icon_style_sm) {
$css .= $addon_id . ' .sppb-icon-inner {';
$css .= $icon_style_sm;
$css .= "\n" . '}' . "\n" ;
}
if($font_size_sm) {
$css .= $addon_id . ' .sppb-icon-inner i {';
$css .= $font_size_sm;
$css .= "\n" . '}' . "\n" ;
}
// Hover
if($icon_style_hover_sm) {
$css .= $addon_id . ' .sppb-icon-inner:hover {';
$css .= $icon_style_hover_sm;
$css .= "\n" . '}' . "\n" ;
}
$css .= '}';
}
if(!empty($icon_style_hover_xs) || !empty($icon_style_xs) || !empty($font_size_xs)) {
$css .= '@media (max-width: 767px) {';
if($icon_style_xs) {
$css .= $addon_id . ' .sppb-icon-inner {';
$css .= $icon_style_xs;
$css .= "\n" . '}' . "\n" ;
}
if($font_size_xs) {
$css .= $addon_id . ' .sppb-icon-inner i {';
$css .= $font_size_xs;
$css .= "\n" . '}' . "\n" ;
}
// Hover
if($icon_style_hover_xs) {
$css .= $addon_id . ' .sppb-icon-inner:hover {';
$css .= $icon_style_hover_xs;
$css .= "\n" . '}' . "\n" ;
}
$css .= '}';
}
return $css;
}
public static function getTemplate() {
$output = '
<#
var margin = "";
var margin_sm = "";
var margin_xs = "";
if(data.margin){
if(_.isObject(data.margin)){
if(data.margin.md.trim() != ""){
margin = data.margin.md.split(" ").map(item => {
if(_.isEmpty(item)){
return "0";
}
return item;
}).join(" ")
}
if(data.margin.sm.trim() != ""){
margin_sm = data.margin.sm.split(" ").map(item => {
if(_.isEmpty(item)){
return "0";
}
return item;
}).join(" ")
}
if(data.margin.xs.trim() != ""){
margin_xs = data.margin.xs.split(" ").map(item => {
if(_.isEmpty(item)){
return "0";
}
return item;
}).join(" ")
}
} else {
if(data.margin.trim() != ""){
margin = data.margin.split(" ").map(item => {
if(_.isEmpty(item)){
return "0";
}
return item;
}).join(" ")
}
}
}
#>
<style type="text/css">
#sppb-addon-{{ data.id }} .sppb-icon-inner {
margin: {{ margin }};
<# if(_.isObject(data.height)){ #>
height: {{ data.height.md }}px;
<# } else { #>
height: {{ data.height }}px;
<# } #>
<# if(_.isObject(data.width)){ #>
width: {{ data.width.md }}px;
<# } else { #>
width: {{ data.width }}px;
<# } #>
color: {{ data.color }};
background-color: {{ data.background }};
<# if(data.border_width){ #>
border-style: solid;
border-color: {{ data.border_color }};
<# if(_.isObject(data.border_width)){ #>
border-width: {{ data.border_width.md }}px;
<# } else { #>
border-width: {{ data.border_width }}px;
<# } #>
<# } #>
<# if(_.isObject(data.border_radius)){ #>
border-radius: {{ data.border_radius.md }}px;
<# } else { #>
border-radius: {{ data.border_radius }}px;
<# } #>
}
#sppb-addon-{{ data.id }} .sppb-icon-inner i{
<# if(_.isObject(data.size)){ #>
font-size: {{ data.size.md }}px;
<# } else { #>
font-size: {{ data.size }}px;
<# } #>
<# if(_.isObject(data.height)){ #>
line-height: {{ data.height.md }}px;
<# } else { #>
line-height: {{ data.height }}px;
<# } #>
<# if(data.border_width){ #>
<# if(_.isObject(data.border_width)){ #>
margin-top: -{{ data.border_width.md }}px;
<# } else { #>
margin-top: -{{ data.border_width }}px;
<# } #>
<# } #>
}
#sppb-addon-{{ data.id }} .sppb-icon-inner:hover {
color: {{ data.hover_color }};
background-color: {{ data.hover_background }};
border-color: {{ data.hover_border_color }};
<# if(_.isObject(data.hover_border_width)){ #>
border-width: {{ data.hover_border_width.md }}px;
<# } else { #>
border-width: {{ data.hover_border_width }}px;
<# } #>
<# if(_.isObject(data.hover_border_radius)){ #>
border-radius: {{ data.hover_border_radius.md }}px;
<# } else { #>
border-radius: {{ data.hover_border_radius }}px;
<# } #>
}
@media (min-width: 768px) and (max-width: 991px) {
#sppb-addon-{{ data.id }} .sppb-icon-inner {
margin: {{ margin_sm }};
<# if(_.isObject(data.height)){ #>
height: {{ data.height.sm }}px;
<# } #>
<# if(_.isObject(data.width)){ #>
width: {{ data.width.sm }}px;
<# } #>
<# if(data.border_width){ #>
<# if(_.isObject(data.border_width)){ #>
border-width: {{ data.border_width.sm }}px;
<# } #>
<# } #>
<# if(_.isObject(data.border_radius)){ #>
border-radius: {{ data.border_radius.sm }}px;
<# } #>
}
#sppb-addon-{{ data.id }} .sppb-icon-inner i{
<# if(_.isObject(data.size)){ #>
font-size: {{ data.size.sm }}px;
<# } #>
<# if(_.isObject(data.height)){ #>
line-height: {{ data.height.sm }}px;
<# } #>
<# if(data.border_width){ #>
<# if(_.isObject(data.border_width)){ #>
margin-top: -{{ data.border_width.sm }}px;
<# } #>
<# } #>
}
#sppb-addon-{{ data.id }} .sppb-icon-inner:hover {
<# if(_.isObject(data.hover_border_width)){ #>
border-width: {{ data.hover_border_width.sm }}px;
<# } #>
<# if(_.isObject(data.hover_border_radius)){ #>
border-radius: {{ data.hover_border_radius.sm }}px;
<# } #>
}
}
@media (max-width: 767px) {
#sppb-addon-{{ data.id }} .sppb-icon-inner {
margin: {{ margin_xs }};
<# if(_.isObject(data.height)){ #>
height: {{ data.height.xs }}px;
<# } #>
<# if(_.isObject(data.width)){ #>
width: {{ data.width.xs }}px;
<# } #>
<# if(data.border_width){ #>
<# if(_.isObject(data.border_width)){ #>
border-width: {{ data.border_width.xs }}px;
<# } #>
<# } #>
<# if(_.isObject(data.border_radius)){ #>
border-radius: {{ data.border_radius.xs }}px;
<# } #>
}
#sppb-addon-{{ data.id }} .sppb-icon-inner i{
<# if(_.isObject(data.size)){ #>
font-size: {{ data.size.xs }}px;
<# } #>
<# if(_.isObject(data.height)){ #>
line-height: {{ data.height.xs }}px;
<# } #>
<# if(data.border_width){ #>
<# if(_.isObject(data.border_width)){ #>
margin-top: -{{ data.border_width.xs }}px;
<# } #>
<# } #>
}
#sppb-addon-{{ data.id }} .sppb-icon-inner:hover {
<# if(_.isObject(data.hover_border_width)){ #>
border-width: {{ data.hover_border_width.xs }}px;
<# } #>
<# if(_.isObject(data.hover_border_radius)){ #>
border-radius: {{ data.hover_border_radius.xs }}px;
<# } #>
}
}
</style>
<#
if(data.name){
#>
<div class="sppb-icon {{ data.alignment }} {{ data.class }}">
<# if(!_.isEmpty(data.link)){ #>
<a target="{{data.target}}" href=\'{{ data.link }}\'>
<# }
let icon_arr = (typeof data.name !== "undefined" && data.name) ? data.name.split(" ") : "";
let icon_name = icon_arr.length === 1 ? "fa "+data.name : data.name;
#>
<span class="sppb-icon-inner">
<i class="{{ icon_name }}"></i>
</span>
<# if(!_.isEmpty(data.link)){ #>
</a>
<# } #>
</div>
<# } #>
';
return $output;
}
}