Spade
Mini Shell
| Directory:~$ /proc/self/root/home/lmsyaran/public_html/j3/components/com_sppagebuilder/addons/pricing/ |
| [Home] [System Details] [Kill Me] |
<?php
/**
* @package SP Page Builder
* @author JoomShaper http://www.joomshaper.com
* @copyright Copyright (c) 2010 - 2023 JoomShaper
* @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or later
*/
//no direct access
defined('_JEXEC') or die('Restricted access');
use Joomla\CMS\Layout\FileLayout;
class SppagebuilderAddonPricing extends SppagebuilderAddons
{
/**
* The addon frontend render method.
* The returned HTML string will render to the frontend page.
*
* @return string The HTML string.
* @since 1.0.0
*/
public function render()
{
$settings = $this->addon->settings;
$class = (isset($settings->class) && $settings->class) ?
$settings->class : '';
$title = (isset($settings->title) && $settings->title) ?
$settings->title : '';
$heading_selector = (isset($settings->heading_selector) &&
$settings->heading_selector) ? $settings->heading_selector :
'div';
//Options
$price_position = (isset($settings->price_position) &&
$settings->price_position) ? $settings->price_position :
'before';
$price = (isset($settings->price) && $settings->price) ?
$settings->price : '';
$price_symbol = (isset($settings->price_symbol) &&
$settings->price_symbol) ? $settings->price_symbol : '';
$duration = (isset($settings->duration) &&
$settings->duration) ? $settings->duration : '';
$pricing_content = (isset($settings->pricing_content) &&
$settings->pricing_content) ? $settings->pricing_content :
'';
$button_text = (isset($settings->button_text) &&
$settings->button_text) ? $settings->button_text : '';
$button_url = (isset($settings->button_url) &&
$settings->button_url) ? $settings->button_url : '';
$button_classes = (isset($settings->button_size) &&
$settings->button_size) ? ' sppb-btn-' .
$settings->button_size : '';
$button_classes .= (isset($settings->button_type) &&
$settings->button_type) ? ' sppb-btn-' .
$settings->button_type : '';
$button_classes .= (isset($settings->button_shape) &&
$settings->button_shape) ? ' sppb-btn-' .
$settings->button_shape : ' sppb-btn-rounded';
$button_classes .= (isset($settings->button_appearance) &&
$settings->button_appearance) ? ' sppb-btn-' .
$settings->button_appearance : '';
$button_classes .= (isset($settings->button_block) &&
$settings->button_block) ? ' ' . $settings->button_block :
'';
$button_icon = (isset($settings->button_icon) &&
$settings->button_icon) ? $settings->button_icon : '';
$button_icon_position = (isset($settings->button_icon_position)
&& $settings->button_icon_position) ?
$settings->button_icon_position : 'left';
$button_position = (isset($settings->button_position) &&
$settings->button_position) ? $settings->button_position :
'';
$featured = (isset($settings->featured) &&
$settings->featured) ? $settings->featured : '';
list($button_url, $button_target) = AddonHelper::parseLink($settings,
'button_url', ['url' => 'button_url',
'new_tab' => 'button_target']);
$button_attribs = (isset($button_target) && $button_target) ?
' rel="noopener noreferrer" ' . $button_target :
'';
$button_attribs .= (isset($button_url) && $button_url) ? '
href="' . $button_url . '"' : '';
$icon_arr = array_filter(explode(' ', $button_icon));
if (count($icon_arr) === 1)
{
$button_icon = 'fa ' . $button_icon;
}
if ($button_icon_position == 'left')
{
$button_text = ($button_icon) ? '<i class="' .
$button_icon . '" aria-hidden="true"></i>
' . $button_text : $button_text;
}
else
{
$button_text = ($button_icon) ? $button_text . ' <i
class="' . $button_icon . '"
aria-hidden="true"></i>' : $button_text;
}
$button_output = ($button_text) ? '<a' . $button_attribs .
' id="btn-' . $this->addon->id . '"
class="sppb-btn' . $button_classes . '">' .
$button_text . '</a>' : '';
$pricesymbol = ($price_symbol) ? '<span
class="sppb-pricing-price-symbol">' . $price_symbol .
'</span>' : '';
//Output
$output = '<div class="sppb-addon sppb-addon-pricing-table
' . $class . '">';
$output .= '<div class="sppb-pricing-box ' . $featured
. '">';
$output .= '<div class="sppb-pricing-header">';
$output .= ($title) ? '<' . $heading_selector . '
class="sppb-addon-title sppb-pricing-title">' . $title .
'</' . $heading_selector . '>' : '';
if ($price_position == 'after')
{
$output .= '<div
class="sppb-pricing-price-container">';
$output .= ($price) ? '<span
class="sppb-pricing-price">' . $pricesymbol . $price .
'</span>' : '';
$output .= ($duration) ? '<span
class="sppb-pricing-duration">' . $duration .
'</span>' : '';
$output .= '</div>';
}
$output .= '</div>';
if ($pricing_content)
{
$output .= '<div
class="sppb-pricing-features">';
$output .= '<ul>';
$features = explode("\n", $pricing_content);
foreach ($features as $feature)
{
$output .= '<li>' . $feature . '</li>';
}
$output .= '</ul>';
$output .= '</div>';
}
if ($price_position == 'before')
{
$output .= '<div
class="sppb-pricing-price-container">';
$output .= ($price) ? '<span class="sppb-pricing-price
after">' . $pricesymbol . $price . '</span>' :
'';
$output .= ($duration) ? '<span
class="sppb-pricing-duration">' . $duration .
'</span>' : '';
$output .= '</div>';
}
$output .= '<div class="sppb-pricing-footer">';
$output .= $button_output;
$output .= '</div>';
$output .= '</div>';
$output .= '</div>';
return $output;
}
/**
* Generate the CSS string for the frontend page.
*
* @return string The CSS string for the page.
* @since 1.0.0
*/
public function css()
{
$settings = $this->addon->settings;
$addon_id = '#sppb-addon-' . $this->addon->id;
$cssHelper = new CSSHelper($addon_id);
$settings->alignment = CSSHelper::parseAlignment($settings,
'alignment');
$priceStyle =
$cssHelper->generateStyle('.sppb-pricing-price', $settings,
['price_color' => 'color'], false);
$priceTypographyStyle =
$cssHelper->typography('.sppb-pricing-title', $settings,
'title_typography', ['font' =>
'title_font_family', 'size' =>
'title_fontsize', 'line_height' =>
'title_lineheight', 'letter_spacing' =>
'title_letterspace', 'uppercase' =>
'title_font_style.uppercase', 'italic' =>
'title_font_style.italic', 'underline' =>
'title_font_style.underline', 'weight' =>
'title_font_style.weight']);
$priceFontStyle =
$cssHelper->typography('.sppb-pricing-price', $settings,
'price_typography', ['font' =>
'price_font_family', 'size' =>
'price_font_size', 'weight' =>
'price_font_weight']);
$priceSymbolStyle =
$cssHelper->generateStyle('.sppb-pricing-price-symbol',
$settings, ['price_symbol_color' => 'color',
'price_symbol_alignment' => 'vertical-align',
'price_symbol_font_size' => 'font-size'],
['price_symbol_color' => false,
'price_symbol_alignment' => false]);
$durationStyle =
$cssHelper->generateStyle('.sppb-pricing-duration', $settings,
['duration_color' => 'color',
'duration_font_size' => 'font-size'],
['duration_color' => false]);
$pricingContentStyle =
$cssHelper->generateStyle('.sppb-pricing-features ul li',
$settings, ['pricing_content_gap' =>
'margin-bottom']);
$pricingContentFontStyle =
$cssHelper->typography('.sppb-pricing-features', $settings,
'pricing_content_typography', ['font' =>
'pricing_content_font_family', 'size' =>
'pricing_content_font_size']);
$pricingContentParentStyle =
$cssHelper->generateStyle('.sppb-pricing-features', $settings,
['pricing_content_margin_bottom' =>
'margin-bottom']);
$priceContainerStyle = $cssHelper->generateStyle(
'.sppb-pricing-price-container',
$settings,
[
'price_margin_bottom' => 'margin-bottom',
'price_padding_bottom' => 'padding-bottom',
'price_border_bottom' => 'border-style: solid;
border-width: 0 0 %s',
'price_border_bottom_color' => 'border-color',
],
['price_border_bottom_color' => false]
);
$settings->pricing_hover_boxshadow =
CSSHelper::parseBoxShadow($settings, 'pricing_hover_boxshadow');
$pricingHoverStyle =
$cssHelper->generateStyle('&:hover', $settings,
['pricing_hover_bg' => 'background-color',
'pricing_hover_scale' => 'transform: scale(%s)',
'pricing_hover_boxshadow' => 'box-shadow'], false);
$pricingHoverColorStyle = $cssHelper->generateStyle('&:hover
.sppb-pricing-header .sppb-pricing-duration,&:hover
.sppb-pricing-header .sppb-pricing-price,&:hover .sppb-pricing-header
.sppb-addon-title,&:hover .sppb-pricing-features ul li',
$settings, ['pricing_hover_color' => 'color'],
false);
$pricingHoverBorderColorStyle =
$cssHelper->generateStyle('&:hover', $settings,
['pricing_hover_border_color' => 'border-color'],
false);
$settings->pricing_transition_duration = '0.4s';
$pricingTransitionDurationStyle =
$cssHelper->generateStyle(':self', $settings,
['pricing_transition_duration' => "transition"],
false);
$priceAlignment =
$cssHelper->generateStyle('.sppb-addon-pricing-table',
$settings, ['alignment' => 'text-align'], false);
$css = '';
$css .= $priceStyle;
$css .= $durationStyle;
$css .= $priceAlignment;
$css .= $priceFontStyle;
$css .= $priceSymbolStyle;
$css .= $pricingHoverStyle;
$css .= $priceContainerStyle;
$css .= $pricingContentStyle;
$css .= $priceTypographyStyle;
$css .= $pricingHoverColorStyle;
$css .= $pricingContentFontStyle;
$css .= $pricingContentParentStyle;
$css .= $pricingHoverBorderColorStyle;
$css .= $pricingTransitionDurationStyle;
// Button css
$layoutPath = JPATH_ROOT .
'/components/com_sppagebuilder/layouts';
$buttonLayout = new FileLayout('addon.css.button',
$layoutPath);
$css .= $buttonLayout->render(array('addon_id' =>
$addon_id, 'options' => $settings, 'id' =>
'btn-' . $this->addon->id));
return $css;
}
/**
* Generate the lodash template string for the frontend editor.
*
* @return string The lodash template string.
* @since 1.0.0
*/
public static function getTemplate()
{
$lodash = new Lodash('#sppb-addon-{{ data.id }}');
$output = '
<#
let price_position = data.price_position || "before";
var heading_selector = data.heading_selector || "div";
let price_symbol = "";
if(data.price_symbol){
price_symbol = \'<span
class="sppb-pricing-price-symbol">\'+data.price_symbol+\'</span>\';
}
let buttonText = "";
const isMenu = _.isObject(data.button_url) &&
data.button_url.type === "menu" && data.button_url?.menu;
const isPage = _.isObject(data.button_url) &&
data.button_url.type === "page" && data.button_url?.page;
const isUrl = _.isObject(data.button_url) &&
data.button_url.type === "url" && data.button_url?.url;
const isOldUrl = _.isString(data.button_url) && data.button_url
!== "";
const urlObj = _.isObject(data.button_url) ? data.button_url :
window.getSiteUrl(data?.button_url || "", data?.button_target ||
"");
const {url, page, menu, type, new_tab, nofollow, noopener, noreferrer} =
urlObj;
const target = new_tab ? "_blank" : "";
let rel="";
rel += nofollow ? "nofollow" : "";
rel += noreferrer ? " noreferrer" : "";
rel += noopener ? " noopener" : "";
let newUrl = "";
if(type === "url") newUrl = url;
if(type === "menu") newUrl = menu;
if(type === "page") newUrl = page ?
`index.php?option=com_sppagebuilder&view=page&id=${page}` :
"";
let buttonAttribs = (new_tab)? "
target=\"_blank\"":"";
buttonAttribs += (isMenu || isPage || isUrl || isOldUrl)? "
href=\""+ newUrl +"\"":"";
buttonAttribs += (rel)? " rel=\""+ rel
+"\"": "";
let buttonClasses = (data.button_size)? " sppb-btn-"+
data.button_size : "";
buttonClasses += (data.button_type)? " sppb-btn-"+
data.button_type : ""
buttonClasses += (data.button_shape)? " sppb-btn-"+
data.button_shape : ""
buttonClasses += (data.button_appearance)? " sppb-btn-"+
data.button_appearance : ""
buttonClasses += (data.button_block)? " "+ data.button_block :
""
let icon_arr = (typeof data.button_icon !== "undefined"
&& data.button_icon) ? data.button_icon.split(" ") :
"";
let icon_name = icon_arr.length === 1 ? "fa "+data.button_icon
: data.button_icon;
if ( data.button_icon_position == "left" ) {
buttonText = ( data.button_icon )? ` <i
class="${icon_name}"></i> ` + data.button_text :
data.button_text
} else {
buttonText = ( data.button_icon )? data.button_text + ` <i
class="${icon_name}"></i> ` : data.button_text
}
let buttonOutput = (buttonText)? "<a" + buttonAttribs +
" id=\"btn-" + data.id + "\"
class=\"sppb-btn"+ buttonClasses + "\">"+
buttonText +"</a>":""
var modern_font_style = false;
var button_fontstyle = data.button_fontstyle || "";
var button_font_style = data.button_font_style || "";
#>
<style type="text/css"> ';
$output .= '
#sppb-addon-{{ data.id }} .sppb-pricing-header .sppb-pricing-duration,
#sppb-addon-{{ data.id }} .sppb-pricing-header .sppb-pricing-price,
#sppb-addon-{{ data.id }} .sppb-pricing-header .sppb-addon-title,
#sppb-addon-{{ data.id }} .sppb-pricing-features ul li,
#sppb-addon-{{ data.id }} .sppb-pricing-price-container,
#sppb-addon-{{ data.id }} {
transition:.4s;
}
<# if(data.price_border_bottom || data.price_border_bottom_color) {
#>
#sppb-addon-{{ data.id }} .sppb-pricing-price-container {
border-style: solid;
border-width:0 0 0 0;
}
<# } #>';
$output .= $lodash->unit('margin-bottom',
'.sppb-pricing-price-container',
'data.price_margin_bottom', 'px');
$output .= $lodash->unit('padding-bottom',
'.sppb-pricing-price-container',
'data.price_padding_bottom', 'px');
$output .= $lodash->unit('border-bottom-width',
'.sppb-pricing-price-container',
'data.price_border_bottom', 'px');
$output .= $lodash->border('border-color',
'.sppb-pricing-price-container',
'data.price_border_bottom_color');
$output .= $lodash->color('color',
'.sppb-pricing-price', 'data.price_color');
$output .= $lodash->unit('font-size',
'.sppb-pricing-price', 'data.price_font_size',
'px');
$output .= $lodash->unit('line-height',
'.sppb-pricing-price', 'data.price_font_size',
'px');
$output .= $lodash->unit('font-weight',
'.sppb-pricing-price', 'data.price_font_weight');
$output .= $lodash->color('color',
'.sppb-pricing-price-symbol',
'data.price_symbol_color');
$output .= $lodash->unit('vertical-align',
'.sppb-pricing-price-symbol',
'data.price_symbol_alignment');
$output .= $lodash->unit('font-size',
'.sppb-pricing-price-symbol',
'data.price_symbol_font_size', 'px');
$output .= $lodash->unit('line-height',
'.sppb-pricing-price-symbol',
'data.price_symbol_font_size', 'px');
$output .= $lodash->color('color',
'.sppb-pricing-duration', 'data.duration_color');
$output .= $lodash->unit('font-size',
'.sppb-pricing-duration', 'data.duration_font_size',
'px');
$output .= $lodash->unit('line-height',
'.sppb-pricing-duration', 'data.duration_font_size',
'px');
$output .= $lodash->unit('margin-bottom',
'.sppb-pricing-features ul li',
'data.pricing_content_gap', 'px');
$output .= $lodash->unit('margin-bottom',
'.sppb-pricing-features',
'data.pricing_content_margin_bottom', 'px');
$output .= '<# if (data.button_type == "custom") {
#>';
$output .= $lodash->color('color', '#btn-{{ data.id
}}.sppb-btn-custom', 'data.button_color');
$output .= $lodash->color('color', '#btn-{{ data.id
}}.sppb-btn-custom:hover', 'data.button_color_hover');
$output .= $lodash->color('background-color', '#btn-{{
data.id }}.sppb-btn-custom:hover',
'data.button_background_color_hover');
$output .= $lodash->spacing('padding', '#btn-{{ data.id
}}.sppb-btn-custom', 'data.button_padding');
$output .= '<# if (data.button_appearance == "outline")
{ #>';
$output .= $lodash->border('border-color', '#btn-{{
data.id }}.sppb-btn-custom',
'data.button_background_color');
$output .= $lodash->border('border-color', '#btn-{{
data.id }}.sppb-btn-custom:hover',
'data.button_background_color_hover');
$output .= '<# } else if (data.button_appearance ==
"3d") { #>';
$output .= $lodash->border('border-bottom-color',
'#btn-{{ data.id }}.sppb-btn-custom',
'data.button_background_color_hover');
$output .= $lodash->color('background-color', '#btn-{{
data.id }}.sppb-btn-custom',
'data.button_background_color');
$output .= '<# } else if (data.button_appearance ==
"gradient") { #>';
$output .= '#sppb-addon-{{ data.id }} #btn-{{ data.id
}}.sppb-btn-custom { border: none; }';
$output .= $lodash->color('background-color', '#btn-{{
data.id }}.sppb-btn-custom',
'data.button_background_gradient');
$output .= $lodash->color('background-color', '#btn-{{
data.id }}.sppb-btn-custom:hover',
'data.button_background_gradient_hover');
$output .= '<# } else { #>';
$output .= $lodash->color('background-color', '#btn-{{
data.id }}.sppb-btn-custom',
'data.button_background_color');
$output .= '<# } #>';
$output .= '<# } #>';
$buttonTypographyFallbacks = [
'font' => 'data.button_font_family',
'letter_spacing' => 'data.button_letterspace',
'weight' =>
'data.button_fontstyle?.weight',
'italic' =>
'data.button_fontstyle?.italic',
'underline' =>
'data.button_fontstyle?.underline',
'uppercase' =>
'data.button_fontstyle?.uppercase',
];
$output .= $lodash->typography('#btn-{{ data.id }}.sppb-btn-{{
data.button_type }}', 'data.button_typography',
$buttonTypographyFallbacks);
$titleFallbacks = [
'font' => 'data.title_font_family',
'size' => 'data.title_fontsize',
'line_height' => 'data.title_lineheight',
'letter_spacing' => 'data.title_letterspace',
'uppercase' =>
'data.title_font_style?.uppercase',
'italic' =>
'data.title_font_style?.italic',
'underline' =>
'data.title_font_style?.underline',
'weight' =>
'data.title_font_style?.weight',
];
$output .= $lodash->typography('.sppb-pricing-title',
'data.title_typography', $titleFallbacks);
$priceContentFallbacks = [
'font' => 'data.price_font_family',
'size' => 'data.price_font_size',
'weight' => 'data.price_font_weight',
];
$output .= $lodash->typography('.sppb-pricing-price',
'data.price_typography', $priceContentFallbacks);
$priceFeaturesFallbacks = [
'font' => 'data.pricing_content_font_family',
'size' => 'data.pricing_content_font_size',
];
$output .= $lodash->typography('.sppb-pricing-features',
'data.pricing_content_typography', $priceFeaturesFallbacks);
$output .= $lodash->transform('scale',
'&:hover', 'data.pricing_hover_scale');
$output .= $lodash->boxShadow('&:hover',
'data.pricing_hover_boxshadow');
$output .= $lodash->color('background-color',
'&:hover', 'data.pricing_hover_bg');
$output .= $lodash->color('color', '&:hover
.sppb-pricing-header .sppb-pricing-duration, &:hover
.sppb-pricing-header .sppb-pricing-price, &:hover .sppb-pricing-header
.sppb-addon-title, &:hover .sppb-pricing-features ul li',
'data.pricing_hover_color');
$output .= $lodash->border('border-color',
'&:hover', 'data.pricing_hover_border_color');
$output .= $lodash->alignment('text-align',
'.sppb-addon-pricing-table', 'data.alignment');
$output .= '
</style>
<div class="sppb-addon sppb-addon-pricing-table {{ data.class
}}">
<div class="sppb-pricing-box {{ data.featured }}">
<div class="sppb-pricing-header">
<# if( data.title ) { #>
<{{ heading_selector }} class="sppb-addon-title
sppb-pricing-title sp-inline-editable-element" data-id={{data.id}}
data-fieldName="title" contenteditable="true">{{{
data.title }}}</{{ heading_selector }}>
<# } #>
<# if( price_position == "after" ) { #>
<div class="sppb-pricing-price-container">
<# if( data.price ) { #>
<span class="sppb-pricing-price">{{{ price_symbol
}}}{{{ data.price }}}</span>
<# } #>
<# if( data.duration ) { #>
<span class="sppb-pricing-duration">{{
data.duration }}</span>
<# } #>
</div>
<# } #>
</div>
<# if(data.pricing_content) { #>
<div class="sppb-pricing-features">
<ul>
<# let pContentArray =
data.pricing_content?.split("\n") #>
<# _.each(pContentArray,function(item,index){ #>
<# if(item) { #> <li>{{{ item }}}</li><# }
#>
<# }) #>
</ul>
</div>
<# } #>
<# if( price_position == "before" ) { #>
<div class="sppb-pricing-price-container">
<# if( data.price ) { #>
<span class="sppb-pricing-price">{{{ price_symbol
}}}{{{ data.price }}}</span>
<# } #>
<# if( data.duration ) { #>
<span class="sppb-pricing-duration">{{ data.duration
}}</span>
<# } #>
</div>
<# } #>
<div class="sppb-pricing-footer">{{{ buttonOutput
}}}</div>
</div>
</div>
';
return $output;
}
}