| Server IP : 46.105.57.169 / Your IP : 216.73.216.84 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/m/a/i/maitricfuz/www/new-saint-martin/plugins/pagebuilderck/audio/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;
?>
<div id="elementscontainer">
<div class="menulink" tab="tab_audio"><?php echo \Joomla\CMS\Language\Text::_('CK_AUDIO_EDITION'); ?></div>
<div class="tab menustyles ckproperty" id="tab_audio">
<div class="menupanetitle"><?php echo \Joomla\CMS\Language\Text::_('CK_AUDIO_FILE'); ?></div>
<div class="ckoption ckoption">
<input class="inputbox" type="text" value="" name="audiourl" id="audiourl" style="width:283px;margin:2px;"/>
<a class="ckbuttonstyle" href="javascript:void(0)" onclick="ckCallMediaManagerPopup('audiourl', 'audio')"><?php echo \Joomla\CMS\Language\Text::_('CK_SELECT') ?></a>
</div>
<div class="menupanetitle"><?php echo \Joomla\CMS\Language\Text::_('CK_OPTIONS'); ?></div>
<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_TYPE'); ?>
</span>
<span class="ckoption-field ckbutton-group">
<select class="inputbox" name="player_type" id="player_type" value="1" >
<option value="native"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_PLAYER_NATIVE') ?></option>
<option value="advanced"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_PLAYER_ADVANCED') ?></option>
</select>
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>control_play.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('CK_AUTOPLAY'); ?>
</span>
<span class="ckoption-field ckbutton-group">
<input type="radio" class="inputbox" name="autoplay" id="autoplayyes" value="1" />
<label for="autoplayyes" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JYES') ?></label>
<input type="radio" class="inputbox" name="autoplay" id="autoplayno" value="0" checked />
<label for="autoplayno" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JNO') ?></label>
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>control_repeat.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('CK_LOOP'); ?>
</span>
<span class="ckoption-field ckbutton-group">
<input type="radio" class="inputbox" name="loop" id="loopyes" value="1" />
<label for="loopyes" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JYES') ?></label>
<input type="radio" class="inputbox" name="loop" id="loopno" value="0" checked />
<label for="loopno" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JNO') ?></label>
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>text_signature.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('CK_CSS_CLASS'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" name="audiocssclass" id="audiocssclass" value="" />
</span>
</div>
<hr style="margin:5px;" />
<p style="margin:5px;"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_ADVANCED_OPTIONS'); ?></p>
<div class="menupanetitle"><?php echo \Joomla\CMS\Language\Text::_('CK_THUMB'); ?></div>
<div class="ckoption">
<input class="inputbox" type="text" value="" name="playerimage" id="playerimage" style="width:283px;margin:2px;" />
<a class="ckbuttonstyle" href="javascript:void(0)" onclick="ckCallLinkManagerPopup('playerimage', 'image')"" ><?php echo \Joomla\CMS\Language\Text::_('CK_SELECT'); ?></a>
<a class="ckbuttonstyle" href="javascript:void(0)" onclick="$ck('#playerimage').val('').trigger('change');"><?php echo \Joomla\CMS\Language\Text::_('CK_CLEAR'); ?></a>
<div class="clr"></div>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>width.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('CK_WIDTH'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" name="thumb_width" id="thumb_width" value="" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>height.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('CK_HEIGHT'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" name="thumb_height" id="thumb_height" value="" />
</span>
</div>
<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_DISPLAY_TIME'); ?>
</span>
<span class="ckoption-field ckbutton-group">
<input type="radio" class="inputbox" name="displaytime" id="displaytimeyes" value="1" checked />
<label for="displaytimeyes" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JYES') ?></label>
<input type="radio" class="inputbox" name="displaytime" id="displaytimeno" value="0" />
<label for="displaytimeno" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JNO') ?></label>
</span>
</div>
<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::_('PLG_PAGEBUILDERCK_AUDIO_DISPLAY_TOTAL_TIME'); ?>
</span>
<span class="ckoption-field ckbutton-group">
<input type="radio" class="inputbox" name="displaytime_total" id="displaytime_totalyes" value="1" checked />
<label for="displaytime_totalyes" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JYES') ?></label>
<input type="radio" class="inputbox" name="displaytime_total" id="displaytime_totalno" value="0" />
<label for="displaytime_totalno" class="ckbutton"><?php echo \Joomla\CMS\Language\Text::_('JNO') ?></label>
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>text_signature.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_ALBUM'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" name="album" id="album" value="" />
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<img class="ckoption-icon" src="<?php echo $this->imagespath; ?>text_signature.png" width="16" height="16" />
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_ARTIST'); ?>
</span>
<span class="ckoption-field">
<input class="inputbox" type="text" name="artist" id="artist" value="" />
</span>
</div>
<div class="clr"></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', 'audio', '') ?>
</div>
<div class="menulink" tab="tab_playerstyles"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_PLAYER'); ?></div>
<div class="tab menustyles ckproperty menustylescustom" id="tab_playerstyles" data-prefix="player" data-rule=".pbck-audio-player">
<?php echo $this->menustyles->createBlocStyles('player', 'audio', '') ?>
</div>
<div class="menulink" tab="tab_thumbstyles"><?php echo \Joomla\CMS\Language\Text::_('CK_IMAGE'); ?></div>
<div class="tab menustyles ckproperty menustylescustom" id="tab_thumbstyles" data-prefix="thumb" data-rule=".pbck-audio-thumb img">
<?php echo $this->menustyles->createBlocStyles('thumb', 'audio', '') ?>
</div>
<div class="menulink" tab="tab_albumstyles"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_ALBUM'); ?></div>
<div class="tab menustyles ckproperty menustylescustom" id="tab_albumstyles" data-prefix="album" data-rule=".pbck-audio-album">
<?php echo $this->menustyles->createBlocStyles('album', 'audio', '') ?>
</div>
<div class="menulink" tab="tab_artiststyles"><?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_ARTIST'); ?></div>
<div class="tab menustyles ckproperty menustylescustom" id="tab_artiststyles" data-prefix="artist" data-rule=".pbck-audio-artist">
<?php echo $this->menustyles->createBlocStyles('artist', 'audio', '') ?>
</div>
<div class="menulink" tab="tab_controlsstyles"><?php echo \Joomla\CMS\Language\Text::_('CK_CONTROLS'); ?></div>
<div class="tab menustyles ckproperty menustylescustom" id="tab_controlsstyles" data-prefix="controls" data-rule=".pbck-audio-player-bar">
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_SLIDER_COLOR'); ?>
<img class="ckoption-icon" src="/media/com_pagebuilderck/images/menustyles/color.png" width="15" height="15">
</span>
<span class="ckoption-field">
<input class="inputbox colorPicker" type="text" value="" name="audio-slider-color" id="audio-slider-color" >
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_SLIDER_CURSOR_COLOR'); ?>
<img class="ckoption-icon" src="/media/com_pagebuilderck/images/menustyles/color.png" width="15" height="15">
</span>
<span class="ckoption-field">
<input class="inputbox colorPicker" type="text" value="" name="audio-slider-cursor-color" id="audio-slider-cursor-color" >
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_SVG_ICON_COLOR'); ?>
<img class="ckoption-icon" src="/media/com_pagebuilderck/images/menustyles/color.png" width="15" height="15">
</span>
<span class="ckoption-field">
<input class="inputbox colorPicker" type="text" value="" name="audio-svg-icon-color" id="audio-svg-icon-color" >
</span>
</div>
<div class="ckoption">
<span class="ckoption-label">
<?php echo \Joomla\CMS\Language\Text::_('PLG_PAGEBUILDERCK_AUDIO_TIME_COLOR'); ?>
<img class="ckoption-icon" src="/media/com_pagebuilderck/images/menustyles/color.png" width="15" height="15">
</span>
<span class="ckoption-field">
<input class="inputbox colorPicker" type="text" value="" name="audio-time-color" id="audio-time-color" >
</span>
</div>
<?php echo $this->menustyles->createBlocStyles('controls', 'audio', '') ?>
</div>
<div class="menulink" tab="tab_presets"><?php echo \Joomla\CMS\Language\Text::_('CK_PRESETS'); ?></div>
<div class="tab menustyles ckproperty" id="tab_presets">
<input class="inputbox" type="hidden" value="" name="preset_layout" id="preset_layout" />
<?php echo PagebuilderckHelper::loadPresets('audio'); ?>
</div>
</div>
<script language="javascript" type="text/javascript">
var focus = $ck('.editfocus');
function ckLoadEditionPopup() {
ckFillEditionPopup(focus.attr('id'));
}
function ckBeforeSaveEditionPopup() {
ckUpdatePreviewArea();
}
function ckUpdatePreviewArea() {
var thumb = $ck('#elementscontainer #playerimage').val();
var player_type = $ck('#elementscontainer #player_type').val();
var autoplay = $ck('#elementscontainer [name="autoplay"]:checked').val() == '1';
var loop = $ck('#elementscontainer [name="loop"]:checked').val() == '1';
var displaytime = $ck('#elementscontainer [name="displaytime"]:checked').val() == '1';
var displaytime_total = $ck('#elementscontainer [name="displaytime_total"]:checked').val() == '1';
var audioSrc = $ck('#elementscontainer #audiourl').val();
if (audioSrc.substr(0,1) == '/') {
audioSrc = audioSrc.slice(1,audioSrc.length);
}
audioSrc = (/^(f|ht)tps?:\/\//i.test(audioSrc)) ? audioSrc : PAGEBUILDERCK.URIROOT + '/' + audioSrc;
if (audioSrc) {
// BC for old addons
if (! focus.find('audio').length) {
PBCK_audio(focus.attr('id')).destroy();
var audioPlayerHtml = '<audio controls src="'+audioSrc+'" '+autoplay+loop+'>'
+'Your browser does not support the audio element.'
+ '</audio>';
focus.find('.pbck-audio-element').empty().append(audioPlayerHtml);
}
var audio = focus.find('audio');
if (player_type == 'advanced') {
let options = {
'src' : audioSrc
, 'loop' : loop
, 'autoplay' : autoplay
, 'displaytime' : displaytime
, 'displaytime_total' : displaytime_total
, 'thumb' : getImgPathFromImgSrc(thumb, true)
, 'thumb_width' : ckTestUnit($ck('#elementscontainer #thumb_width').val())
, 'thumb_height' : ckTestUnit($ck('#elementscontainer #thumb_height').val())
, 'album' : $ck('#elementscontainer #album').val()
, 'artist' : $ck('#elementscontainer #artist').val()
}
PBCK_audio(focus.attr('id')).create(options);
} else {
PBCK_audio(focus.attr('id')).destroy();
audio.attr('src', audioSrc);
if (autoplay) {
audio.attr('autoplay', '1');
} else {
audio.removeAttr('autoplay');
}
if (loop) {
audio.attr('loop', '1');
} else {
audio.removeAttr('loop');
}
focus.find('.pbck-audio-advanced').empty().attr('style', '');
}
} else {
alert('Error : please select the audio file to play');
}
ckSetPresetLayout();
}
function selectaudiofile(file) {
$ck('#audiourl').val(file);
CKBox.close();
ckUpdateAudioPreview();
}
function ckAfterSaveEditionPopup() {
// set the colors for the player
var focusid = focus.attr('id');
var slidercolor = $ck('#elementscontainer #audio-slider-color').val();
var slidercursorcolor = $ck('#elementscontainer #audio-slider-cursor-color').val();
var svgiconcolor = $ck('#elementscontainer #audio-svg-icon-color').val();
var timecolor = $ck('#elementscontainer #audio-time-color').val();
var styles = '';
if (slidercolor) styles += '#' + focusid + ' .inner { --pbck-audio-slider-color: ' + slidercolor + '; }';
if (slidercursorcolor) styles += '#' + focusid + ' .inner { --pbck-audio-slider-cursor-color: ' + slidercursorcolor + '; }';
if (svgiconcolor) styles += '#' + focusid + ' .inner { --pbck-audio-svg-icon-color: ' + svgiconcolor + '; }';
if (timecolor) styles += '#' + focusid + ' .inner { --pbck-audio-time-color: ' + timecolor + '; }';
$ck('.editfocus > .ckstyle style').append(styles);
}
</script>