| Server IP : 46.105.57.169 / Your IP : 216.73.216.144 Web Server : Apache System : Linux webd003.cluster120.gra.hosting.ovh.net 5.15.206-ovh-vps-grsec-zfs-classid #1 SMP Fri May 15 02:41:25 UTC 2026 x86_64 User : maitricfuz ( 93378) PHP Version : 8.4.10 Disable Function : _dyuweyrj4,_dyuweyrj4r,dl MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /home/maitricfuz/www/new-saint-martin/plugins/pagebuilderck/animnumber/layouts/ |
Upload File : |
<?php
/**
* @name Page Builder CK
* @package com_pagebuilderck
* @copyright Copyright (C) 2015. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
* @author Cedric Keiflin - https://www.template-creator.com - https://www.joomlack.fr
*/
defined('_JEXEC') or die;
$prefix = 'bloc';
?>
<div id="elementscontainer">
<div style="text-align:center;">
<br />
<div class="ckbuttonstyle" onclick="ckUpdatePreviewArea()"><?php echo \Joomla\CMS\Language\Text::_('CK_REPLAY_ANIMATION'); ?></div>
</div>
<div class="menulink" tab="tab_animnumbercircle"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_CIRCLE'); ?></div>
<div class="tab menustyles ckproperty" id="tab_animnumbercircle">
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>switch.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('CK_ENABLE'); ?>
</span>
<span class="ckoption-field ckbutton-group">
<input type="radio" class="inputbox" name="circleEnable" id="circleEnableYes" onclick="ckUpdatePreviewArea()" value="1" />
<label for="circleEnableYes" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JYES') ?></label>
<input type="radio" class="inputbox" name="circleEnable" id="circleEnableNo" onclick="ckUpdatePreviewArea()" value="0" />
<label for="circleEnableNo" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JNO') ?></label>
</span>
</div>
<div class="menupanetitle"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_APPEARANCE'); ?></div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>color.png" width="15" height="15"/>
<?php echo \Joomla\CMS\Language\Text::_('CK_COLOR'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox colorPicker" type="text" value="" name="pieColor" id="pieColor" placeholder="#20B2AA" />
</span>
<div class="clr"></div>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_PIE_DIAMETER'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="pieDiameter" id="pieDiameter" onchange="ckUpdatePreviewArea()" placeholder="380"/>
</span>
<span class="ckoption-suffix">px</span>
<div class="clr"></div>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_PIE_THICKNESS'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="pieThickness" id="pieThickness" onchange="ckUpdatePreviewArea()" placeholder="70" />
</span>
<span class="ckoption-suffix">px</span>
<div class="clr"></div>
</div>
<div class="menupanetitle"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_EFFECT_OPTIONS'); ?></div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('CK_DURATION'); ?>
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>hourglass.png" width="16" height="16" />
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" name="time" id="time" value="" onchange="ckUpdatePreviewArea()" placeholder="2000" />
</span>
<span class="ckoption-suffix">ms</span>
<div class="clr"></div>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('CK_START'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="startRadius" id="startRadius" onchange="ckUpdateSliderRadius()" />
</span>
<span class="ckoption-suffix">%</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('CK_END'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="endRadius" id="endRadius" onchange="ckUpdateSliderRadius()" />
</span>
<span class="ckoption-suffix">%</span>
</div>
<div class="ckoption">
<div id="sliderrange"></div>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('CK_OFFSET'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="offsetRadius" id="offsetRadius" onchange="ckUpdateSliderOffset()" />
</span>
<span class="ckoption-suffix">%</span>
</div>
<div class="ckoption">
<div id="slideroffset"></div>
</div>
</div>
<div class="menulink" tab="tab_animnumbernumber"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_NUMBER'); ?></div>
<div class="tab menustyles ckproperty" id="tab_animnumbernumber">
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_START_NUMBER'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="startValue" id="startValue" onchange="ckUpdatePreviewArea()" placeholder="0" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_END_NUMBER'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="endValue" id="endValue" onchange="ckUpdatePreviewArea()" placeholder="100" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_STEP_NUMBER'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="step" id="step" onchange="ckUpdatePreviewArea()" placeholder="1" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_THOUSANDS'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="thousands" id="thousands" onchange="ckUpdatePreviewArea()" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_DECIMAL'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="decimal" id="decimal" onchange="ckUpdatePreviewArea()" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_ANIMNUMBER_SUFFIX'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" value="" name="suffix" id="suffix" onchange="ckUpdatePreviewArea()" />
</span>
</div>
<?php echo $this->menustyles->createFont('bloc', false) ?>
<div class="menustyles-row">
<div class="menustyles-field" >
<input class="inputbox" type="text" name="<?php echo $prefix; ?>lineheight" id="<?php echo $prefix; ?>lineheight" />
</div>
<div class="menustyles-text">
<?php echo \Joomla\CMS\Language\Text::_('CK_LINEHEIGHT'); ?>
</div>
</div>
</div>
<div class="menulink" tab="tab_blocstyles"><?php echo \Joomla\CMS\Language\Text::_('CK_STYLES'); ?></div>
<div class="tab menustyles ckproperty" id="tab_blocstyles">
<?php echo $this->menustyles->createBlocStyles('bloc', 'animnumber', '') ?>
</div>
</div>
<script language="javascript" type="text/javascript">
function ckLoadEditionPopup() {
var focus = $ck('.editfocus');
ckFillEditionPopup(focus.attr('id'));
var list = getAnimNumberParamsList();
for(i=0;i<list.length;i++) {
$ck('#elementscontainer #'+list[i]).val(focus.find('.animnumberck').attr('data-'+list[i]));
}
ckUpdatePreviewArea();
ckInitializeSliders();
ckUpdateSliderRadius();
ckUpdateSliderOffset();
}
function getAnimNumberParamsList() {
var list = ["pieDiameter", "pieThickness", "piePadding", "pieColor", "startRadius", "endRadius", "offsetRadius", "startValue", "endValue", "time", "step", "thousands", "decimal", "suffix"];
return list;
}
function ckBeforeSaveEditionPopup() {
var focus = $ck('.editfocus');
pbckAnimnumberInit(focus.find('.animnumberck').attr('id'));
ckSaveEditionPopup(focus.attr('id'));
ckCloseEditionPopup();
}
function ckInitializeSliders() {
$ck('#elementscontainer #sliderrange').slider({
range: true,
min: 0,
max: 100,
values: [ 0, 100 ],
slide: function( event, ui ) {
$ck('#startRadius').val(ui.values[ 0 ]);
$ck('#endRadius').val(ui.values[ 1 ]);
},
stop: function( event, ui ) {
ckUpdatePreviewArea();
}
});
$ck('#elementscontainer #slideroffset' ).slider({
range: false,
min: 0,
max: 100,
slide: function( event, ui ) {
$ck('#offsetRadius').val(ui.value);
},
stop: function( event, ui ) {
ckUpdatePreviewArea();
}
});
}
function ckUpdateSliderRadius() {
$ck('#elementscontainer #sliderrange').slider( "option", "values", [ $ck('#startRadius').val(), $ck('#endRadius').val() ] );
ckUpdatePreviewArea();
}
function ckUpdateSliderOffset() {
$ck('#elementscontainer #slideroffset').slider( "option", "value", $ck('#offsetRadius').val() );
ckUpdatePreviewArea();
}
function ckUpdatePreviewArea() {
var focus = $ck('.editfocus');
var list = getAnimNumberParamsList();
for(i=0;i<list.length;i++) {
$ck('.editfocus .animnumberck').attr('data-'+list[i], $ck('#elementscontainer #'+list[i]).val());
}
var disableCircle = 1 - $ck('[name="circleEnable"]:checked').val();
focus.find('> .inner').attr('data-disable-circle', disableCircle)
focus.find('> .inner').attr('data-running', '0')
pbckAnimnumberInit(focus.attr('id') + ' .animnumberck');
}
</script>
<style type="text/css">
#elementscontainer #sliderrange, #elementscontainer #slideroffset {
background: #ffffff;
border: 1px solid #aaaaaa;
color: #222222;
}
#elementscontainer .ui-widget-header {
background: #cccccc;
border: 1px solid #aaaaaa;
color: #222222;
font-weight: bold;
}
#elementscontainer .ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 1.1em;
}
#elementscontainer .ui-slider-horizontal {
height: 0.8em;
}
#elementscontainer .ui-slider {
position: relative;
text-align: left;
}
#elementscontainer .ui-state-default, #elementscontainer .ui-widget-content .ui-state-default, #elementscontainer .ui-widget-header .ui-state-default {
background: #e6e6e6;
border: 1px solid #d3d3d3;
color: #555555;
font-weight: normal;
}
#elementscontainer .ui-slider-horizontal .ui-slider-handle {
margin-left: -0.6em;
top: -0.3em;
}
#elementscontainer .ui-slider .ui-slider-handle {
cursor: default;
height: 1.2em;
position: absolute;
width: 1.2em;
z-index: 2;
}
</style>