File manager

File manager - Edit - /home/jardides/www/Jardi-design/old/plugins/pagebuilderck/gallery/layouts/edit_gallery.php

Back
<?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 * @item Cedric Keiflin - https://www.template-creator.com - https://www.joomlack.fr / // TODO : ajout lien sur image, target blank ou autre, option lightbox, autolink image, ou lightbox sur lien defined('_JEXEC') or die; $input = JFactory::getApplication()->input; $this->imagespath_plugin = JUri::root(true) . '/plugins/pagebuilderck/gallery/assets/images/'; ?> <div id="elementscontainer"> <div class="menulink" tab="tab_items"><?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_EDITION'); ?></div> <div class="tab menustyles ckproperty" id="tab_items"> <div class="tab_fullscreen" style="background:#fff;"> <div class="ckoption"> <span class="ckoption-label"> <?php echo JText::_('CK_SOURCE'); ?> </span> <span class="ckoption-field ckbutton-group"> <select id="imagesource" class="inputbox" name="imagesource" style="width: 125px;" onchange="ckUpdateSource()"> <option value="editor"><?php echo JText::_('CK_EDITOR'); ?></option> <option value="folder"><?php echo JText::_('CK_FOLDER'); ?></option> </select> </span> <div class="ckclr"></div> </div> <div id="imagesource_editor"> <div id="items_edition_list" class="expandable"> </div> <div onclick="ckAddNewListItem()" class="item_add btn btn-small btn-info"><?php echo JText::_('CK_ADD_NEW_ITEM'); ?></div> <div class="ckclr"></div> </div> <div id="imagesource_folder"> <div class="ckoption"> <div> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>folder.png" width="16" height="16" /> <?php echo JText::_('CK_FOLDER_PATH'); ?> </span> <span class="ckoption-field"> <input id="autoloadfoldername" name="autoloadfoldername" class="inputbox" value="" type="text" placeholder="images/demo" /> </span> <div class="ckclr"></div> </div> </div> </div> </div> </div> <div class="menulink" tab="tab_galleryoptions"><?php echo JText::_('CK_OPTIONS'); ?></div> <div class="tab menustyles ckproperty" id="tab_galleryoptions"> <div class="ckoption"> <div> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>height.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_IMG_HEIGHT'); ?> </span> <span class="ckoption-field"> <input id="imgheight" name="imgheight" class="inputbox" value="" type="text" placeholder="180 " /> </span> <div class="ckclr"></div> </div> </div> <div class="ckoption"> <div> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>width.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_IMG_MIN_WIDTH'); ?> </span> <span class="ckoption-field"> <input id="imgminwidth" name="imgminwidth" class="inputbox" value="" type="text" placeholder="150" /> </span> <div class="ckclr"></div> </div> </div> <div class="ckoption"> <div> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath_plugin; ?>application_tile_horizontal.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_NUMBER_COLS'); ?> </span> <span class="ckoption-field"> <input id="nbcols" name="nbcols" class="inputbox" value="" type="text" placeholder="0" /> </span> <div class="ckclr"></div> </div> </div> <div class="ckoption"> <div> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath_plugin; ?>text_padding_left.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_GUTTER_VALUE'); ?> </span> <span class="ckoption-field"> <input id="gutter" name="gutter" class="inputbox" value="" type="text" placeholder="10"/> </span> <div class="ckclr"></div> </div> </div> <div class="ckoption"> <div> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>width.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_RESPONSIVE'); ?> </span> <span class="ckoption-field"> <input id="responsiveresolution" name="responsiveresolution" class="inputbox" value="" type="text" placeholder="640" /> </span> <div class="ckclr"></div> </div> <div class="ckclr"></div> </div> <div class="ckoption"> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath_plugin; ?>folder_wrench.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_USE_CAPTION'); ?> </span> <span class="ckoption-field ckbutton-group"> <input id="usecaption1" class="inputbox" name="usecaption" value="1" type="radio"> <label class="ckbutton" for="usecaption1"> <?php echo JText::_('JYES'); ?> </label> <input id="usecaption0" class="inputbox" name="usecaption" value="0" type="radio"> <label class="ckbutton" for="usecaption0"> <?php echo JText::_('JNO'); ?> </label> </span> <div class="ckclr"></div> </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 JText::_('CK_CSS_CLASS'); ?></span> <span class="ckoption-field"> <input class="inputbox" type="text" name="imagecssclass" id="imagecssclass" value="" style="" onchange="ckUpdateImageAttribute('class', this.value)" /> </span> <div class="ckclr"></div> </div> <div class="ckoption"> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>link_add.png" width="16" height="16" /> <?php echo JText::_('PLG_PAGEBUILDERCK_AUTOLINK_IMAGES'); ?> </span> <span class="ckoption-field ckbutton-group"> <input id="autolinkimages1" class="inputbox" name="autolinkimages" value="1" type="radio"> <label class="ckbutton" for="autolinkimages1"> <?php echo JText::_('JYES'); ?> </label> <input id="autolinkimages0" class="inputbox" name="autolinkimages" value="0" type="radio" checked> <label class="ckbutton" for="autolinkimages0"> <?php echo JText::_('JNO'); ?> </label> </span> <div class="ckclr"></div> </div> <div class="ckoption"> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>link.png" width="16" height="16" /> <?php echo JText::_('CK_LINK_TARGET'); ?> </span> <span class="ckoption-field ckbutton-group"> <select id="linktarget" class="inputbox" name="linktarget" style="width: 125px;"> <option value="_parent"><?php echo JText::_('CK_LINK_TARGET_SAME'); ?></option> <option value="_blank"><?php echo JText::_('CK_LINK_TARGET_NEW'); ?></option> </select> </span> <div class="ckclr"></div> </div> <div class="ckoption"> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath_plugin; ?>folder_wrench.png" width="16" height="16" /> <?php echo JText::_('CK_IMAGE_EFFECT'); ?> </span> <?php if (! JPluginHelper::isEnabled('system', 'imageeffectck') \|\| ! JPluginHelper::isEnabled('editors-xtd', 'imageeffectckbutton')) { ?> <div class="alert alert-warning"> <?php if (! JPluginHelper::isEnabled('system', 'imageeffectck')) { ?><b><?php echo JText::_('CK_IMAGEEFFECTCK_NOT_INSTALLED') ?></b> <br /><a href="https://www.joomlack.fr/en/joomla-extensions/image-effect-ck" target="_blank"><?php echo JText::_('CK_DOWNLOAD') ?> : Image Effect CK</a> <div class="ckclr"></div> <?php } ?> <?php if (! JPluginHelper::isEnabled('editors-xtd', 'imageeffectckbutton')) { ?><b><?php echo JText::_('CK_IMAGEEFFECTCK_BUTTON_NOT_INSTALLED') ?></b> <br /><a href="https://www.joomlack.fr/en/component/dms/view_document/147-image-effect-ck-params" target="_blank"><?php echo JText::_('CK_DOWNLOAD') ?> : Image Effect CK Params</a> <?php } ?> </div> <?php } else { ?> <script src="<?php echo JUri::root(true) ?>/plugins/editors-xtd/imageeffectckbutton/assets/imageeffectckbutton.js"></script> <a style="display:block;float:left;padding:0 5px;width:80px;" class="ckbuttonstyle" href="javascript:void(0)" onclick="CKApi.Imageeffect.showInterface('ckValidateImageEffect()');"><?php echo JText::_('CK_SELECT'); ?></a> <?php } ?> <div class="ckclr"></div> </div> <?php if (! JPluginHelper::isEnabled('system', 'mediabox_ck')) { ?> <div class="alert alert-danger"><b><?php echo JText::_('CK_MEDIABOXCK_NOT_INSTALLED') ?></b><br /><a href="https://www.joomlack.fr/en/joomla-extensions/mediabox-ck" target="_blank"><?php echo JText::_('CK_DOWNLOAD') ?> : Mediabox CK</a></div> <?php } ?> <div class="ckoption"> <span class="ckoption-label"> <img class="ckoption-icon" src="<?php echo $this->imagespath; ?>magnifier.png" width="16" height="16" /> <?php echo JText::_('CK_USE_LIGHTBOX'); ?></span> <span class="ckoption-field"> <span class="ckoption-field ckbutton-group"> <input id="uselightbox1" class="inputbox" name="uselightbox" value="1" type="radio"> <label class="ckbutton" for="uselightbox1"> <?php echo JText::_('JYES'); ?> </label> <input id="uselightbox0" class="inputbox" name="uselightbox" value="0" type="radio" checked> <label class="ckbutton" for="uselightbox0"> <?php echo JText::_('JNO'); ?> </label> </span> </span> <div class="ckclr"></div> </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 JText::_('PLG_PAGEBUILDERCK_SHOW_LIGHTBOX_TITLE'); ?> </span> <span class="ckoption-field ckbutton-group"> <input id="showlightboxtitle1" class="inputbox" name="showlightboxtitle" value="1" type="radio"> <label class="ckbutton" for="showlightboxtitle1"> <?php echo JText::_('JYES'); ?> </label> <input id="showlightboxtitle0" class="inputbox" name="showlightboxtitle" value="0" type="radio" checked> <label class="ckbutton" for="showlightboxtitle0"> <?php echo JText::_('JNO'); ?> </label> </span> <div class="ckclr"></div> </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 JText::_('PLG_PAGEBUILDERCK_SHOW_LIGHTBOX_DESC'); ?> </span> <span class="ckoption-field ckbutton-group"> <input id="showlightboxdesc1" class="inputbox" name="showlightboxdesc" value="1" type="radio"> <label class="ckbutton" for="showlightboxdesc1"> <?php echo JText::_('JYES'); ?> </label> <input id="showlightboxdesc0" class="inputbox" name="showlightboxdesc" value="0" type="radio" checked> <label class="ckbutton" for="showlightboxdesc0"> <?php echo JText::_('JNO'); ?> </label> </span> <div class="ckclr"></div> </div> </div> <div class="menulink" tab="tab_blocstyles"><?php echo JText::_('CK_STYLES'); ?></div> <div class="tab menustyles ckproperty" id="tab_blocstyles"> <?php echo $this->menustyles->createBlocStyles('bloc', 'gallery', '') ?> </div> <div class="menulink" tab="tab_itemstyles"><?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_IMAGE'); ?></div> <div class="tab menustyles ckproperty" id="tab_itemstyles"> <div class="menustylescustom" data-prefix="item" data-rule=".pbck_gallery .pbck_gallery_item"><?php echo $this->menustyles->createBlocStyles('item') ?></div> </div> <div class="menulink" tab="tab_captionstyles"><?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_CAPTION'); ?></div> <div class="tab menustyles ckproperty" id="tab_captionstyles"> <div class="menustylescustom" data-prefix="caption" data-rule=".pbck_gallery .pbck_gallery_item_caption"><?php echo $this->menustyles->createBlocStyles('caption') ?></div> </div> <div class="menulink" tab="tab_titlestyles"><?php echo JText::_('CK_TITLE'); ?></div> <div class="tab menustyles ckproperty" id="tab_titlestyles"> <div class="menustylescustom" data-prefix="title" data-rule=".pbck_gallery .pbck_gallery_item_title"><?php echo $this->menustyles->createBlocStyles('title') ?></div> </div> <div class="menulink" tab="tab_descriptionstyles"><?php echo JText::_('PLG_PAGEBUILDERCK_GALLERY_DESCRIPTION'); ?></div> <div class="tab menustyles ckproperty" id="tab_descriptionstyles"> <div class="menustylescustom" data-prefix="description" data-rule=".pbck_gallery .pbck_gallery_item_desc"><?php echo $this->menustyles->createBlocStyles('description') ?></div> </div> </div> <script language="javascript" type="text/javascript"> var focus = $ck('.editfocus'); function ckLoadEditionPopup() { var focus = $ck('.editfocus'); ckFillEditionPopup(focus.attr('id')); $ck('.editfocus .pbck_gallery_item').each(function(i, el) { var itemInfos = { "title" : $ck('.pbck_gallery_item_title', el).length ? $ck('.pbck_gallery_item_title', el).html() : '', "alt" : $ck('.pbck_gallery_item_img img', el).attr('alt') ? $ck('.pbck_gallery_item_img img', el).attr('alt') : '', "url_href" : $ck('.pbck_gallery_item_link', el).attr('href') && $ck('[name="autolinkimages"]:checked').val() !== '1' ? $ck('.pbck_gallery_item_link', el).attr('href') : '', "url_target" : ($ck('.pbck_gallery_item_link', el).attr('target') && $ck('.pbck_gallery_item_link', el).attr('target') != $ck('#linktarget').val()) ? $ck('.pbck_gallery_item_link', el).attr('target') : 'default' }; var itemedition = ckCreateEditGalleryItem(i, $ck('#items_edition_list'), ckContentToEditor($ck('.pbck_gallery_item_desc', el).html()), $ck('.pbck_gallery_item_img img', el), itemInfos); ckMakeEditItemAccordion(itemedition); }); $ck('#items_edition_list .item_content_edition').each(function() { ckLoadEditorOnTheFly($ck(this).attr('id')); }); var nbcols = $ck('#elementscontainer #nbcols').val() ? $ck('#elementscontainer #nbcols').val() : '3'; $ck('#elementscontainer [name="nbcols"][type="radio"]').removeAttr('checked'); $ck('#elementscontainer [id="nbcols_' + nbcols + '"][type="radio"]').prop('checked', 'checked'); $ck('#elementscontainer [name="nbcols"][type="radio"]').change(function() { $ck('#elementscontainer #nbcols').val($ck('#elementscontainer [name="nbcols"][type="radio"]:checked').val()).trigger('change'); ckUpdatePreviewArea(); }); ckMakeEditItemsSortable(); ckUpdateSource(); } function ckBeforeSaveEditionPopup() { ckUpdatePreviewArea(); } function ckAfterSaveEditionPopup() { var imgminwidth = $ck('#elementscontainer #imgminwidth').val() ? $ck('#elementscontainer #imgminwidth').val() : '150'; var imgheight = $ck('#elementscontainer #imgheight').val() ? $ck('#elementscontainer #imgheight').val() : '180'; var focusid = $ck('.editfocus').attr('id'); var styles = '#' + focusid + ' .pbck_gallery_item_img img { min-width : ' + ckTestUnit(imgminwidth) + '; height: ' + ckTestUnit(imgheight) + ';}'; $ck('.editfocus > .ckstyle style').append(styles); } function ckSaveInlineEditionPopup() { ckBeforeSaveEditionPopup(); } / * Method automatically called in ckCloseEditionPopup() if exists (needed if you are using an editor !!) / function ckBeforeCloseEditionPopup() { $ck('.item_content_edition').each(function() { ckRemoveEditorOnTheFly($ck(this).attr('id')); }); } function ckUpdatePreviewArea() { if ($ck('#imagesource').val() === 'folder') { var imgsrc = PAGEBUILDERCK.URIROOT + '/' + 'media/com_pagebuilderck/images/image_fake_2.jpg'; $ck('.editfocus .pbck_gallery_item').find('.pbck_gallery_item_img img').css('opacity', '0'); $ck('.editfocus .pbck_gallery_item').find('.pbck_gallery_item_img').attr('style', 'background-image: url(\'' + imgsrc + '\');').addClass('fitie') .parent().removeClass('fitie'); // then if the source is the slides editor } else { $ck('#items_edition_list .item_edition').each(function(i, el) { // update the edition item image source with the input value $ck('.item_image img', el).attr('src', getImgPathFromImgSrc($ck('.item_imageurl_edition', el).val(), true)); var autolinkimages = $ck('[name="autolinkimages"]:checked').val() == '1'; var uselightbox = $ck('[name="uselightbox"]:checked').val() == '1'; if (! autolinkimages) { if ($ck('.item_url_href_edition',el).val() == $ck('.item_image img', el).attr('src')) $ck('.item_url_href_edition',el).val(''); } var ahref = $ck('.item_url_href_edition',el).val() \|\| autolinkimages; // manage title and desc in lightbox var showlightboxtitle = $ck('[name="showlightboxtitle"]:checked').val() == '1'; var showlightboxdesc = $ck('[name="showlightboxdesc"]:checked').val() == '1'; var lightboxtitle = ''; if (showlightboxtitle) { lightboxtitle += $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_title').text(); } if (showlightboxdesc) { lightboxtitle += '::' + $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_desc').text(); } if (ahref) { $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').remove(); $ck('.editfocus .pbck_gallery_item').eq(i).prepend('<a class="pbck_gallery_item_link"></a>'); if (autolinkimages) { var linkhref = $ck('.item_image img', el).attr('src'); } else { var linkhref = $ck('.item_url_href_edition',el).val() ? $ck('.item_url_href_edition',el).val() : ''; } $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').attr('href', linkhref); if (uselightbox) { $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').attr('rel', 'lightbox[' + focus.attr('id') + ']').attr('title', lightboxtitle); } else { $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').removeAttr('rel').removeAttr('title'); var target = $ck('.item_url_target_edition',el).val() == 'default' ? $ck('#linktarget').val() : $ck('.item_url_target_edition',el).val(); if (target != '_parent') { $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').attr('target', target); } else { $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').removeAttr('target'); } } } else { $ck('.editfocus .pbck_gallery_item').eq(i).find(' > a').remove(); } // update the caption $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_caption').remove(); if (! $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_caption').length) { $ck('.editfocus .pbck_gallery_item_img').eq(i).append( '<figcaption class="pbck_gallery_item_caption">' + '<div>' + '<div class="pbck_gallery_item_title"></div>' + '<div class="pbck_gallery_item_desc"></div>' + '</div>' + '</figcaption>' ); } // update the title var titlecontent = ($ck('.item_title_edition',el).val()); $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_title').html(titlecontent); // update the content ckSaveEditorOnTheFly($ck('.item_content_edition', el).attr('id')); var content = $ck('.item_content_edition', el).val(); content = ckEditorToContent(content); $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_desc').html(content); // remove caption if empty if (!content && !$ck('.item_title_edition',el).val()) { $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_caption').remove(); } if ($ck('[name="usecaption"]:checked').val() == '1') { $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_caption').show(); } else { $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_caption').hide(); } // update the image source and image alt tag var alt = $ck('.item_alt_edition',el).val() ? $ck('.item_alt_edition',el).val() : $ck('.item_title_edition',el).val(); var imgsrc = $ck('.item_image img', el).attr('src'); $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_img img').attr('src', imgsrc).attr('data-src', imgsrc).attr('alt', alt).css('opacity', ''); $ck('.editfocus .pbck_gallery_item').eq(i).find('.pbck_gallery_item_img').attr('style', 'background-image: url(\'' + $ck('.item_image img', el).attr('src') + '\');').removeClass('fitie') .parent().addClass('fitie'); }); } var gutter = ($ck('#gutter').val() != '') ? ckTestUnit($ck('#gutter').val()) : '10px'; // var gutter = ($ck('#gutter').val() != '') ? ' - ' + ckTestUnit($ck('#gutter').val()) : ' - 10px'; var nbcols = $ck('#elementscontainer #nbcols').val() ? $ck('#elementscontainer #nbcols').val() : '0'; var witem = 'calc(100% / ' + nbcols + ' - ' + gutter + ' ' + (nbcols-1) + ' / ' + nbcols + ')'; var marginitem = '0 0 ' + gutter + ' 0'; if (parseInt(nbcols) > 0) { focus.find('.pbck_gallery').addClass('pbck_gallery_hascolumns'); } else { focus.find('.pbck_gallery').removeClass('pbck_gallery_hascolumns'); witem = ''; marginitem = '0 ' + gutter + ' ' + gutter + ' 0'; } // if (nbcols === '0') witem = ''; $ck('.editfocus .pbck_gallery_item').css('width', witem).css('margin', marginitem); } function ckCreateEditGalleryItem(i, itemlist, itemcontent, itemimg, itemInfos) { var itemimgsrc = itemimg.attr('src'); var itemedition = $ck('<div class="item_edition clearfix" data_index="'+i+'">' +'<div class="item_move"></div>' +'<div class="item_image">' +'<a class="item_image_selection" href="javascript:void(0)" onclick="ckCallImageManagerPopup(\'item_imageurl_'+i+'\')" >' +'<img src="'+itemimgsrc+'" />' +'</a>' +'</div>' +'<div class="item_imageurl"><label for="item_imageurl_'+i+'">'+Joomla.JText._('CK_IMAGE_URL','Image url')+'</label><input type="text" id="item_imageurl_'+i+'" name="item_imageurl_'+i+'" class="item_imageurl_edition" value="'+getImgPathFromImgSrc(itemimgsrc)+'" style="width: 400px;" onchange="ckUpdatePreviewArea()"/></div>' +'<div class="item_title"><label for="item_title_'+i+'">'+Joomla.JText._('CK_TITLE','Title')+'</label><input type="text" id="item_title_'+i+'" name="item_title_'+i+'" class="item_title_edition" value="'+itemInfos["title"]+'" style="width: 400px;" onchange="ckUpdatePreviewArea()"/></div>' +'<div class="item_alt"><label for="item_alt_'+i+'">'+Joomla.JText._('CK_ALT','Alt')+'</label><input type="text" id="item_alt_'+i+'" name="item_alt_'+i+'" class="item_alt_edition" value="'+itemInfos["alt"]+'" style="width: 400px;" onchange="ckUpdatePreviewArea()"/></div>' +'<div class="item_url_href"><label for="item_url_href_'+i+'">'+Joomla.JText._('CK_AUTHOR_URL_LINK','Url link')+'</label><input type="text" id="item_url_href_'+i+'" name="item_url_href_'+i+'" class="item_url_href_edition" value="'+itemInfos["url_href"]+'" style="width: 400px;" onchange="ckUpdatePreviewArea()"/></div>' +'<div class="item_url_target"><label for="item_url_target_'+i+'">'+Joomla.JText._('CK_URL_TARGET','Url target')+'</label><select id="item_url_target_'+i+'" name="item_url_target_'+i+'" class="item_url_target_edition" value="'+itemInfos["url_target"]+'" onchange="ckUpdatePreviewArea()">' +'<option value="default" ' + (itemInfos["url_target"] == 'default' ? 'selected' : '') + '>'+Joomla.JText._('CK_DEFAULT','Default')+'</option>' +'<option value="_parent" ' + (itemInfos["url_target"] == '_parent' ? 'selected' : '') + '>'+Joomla.JText._('CK_SAME_WINDOW','Same window')+'</option>' +'<option value="_blank" ' + (itemInfos["url_target"] == '_blank' ? 'selected' : '') + '>'+Joomla.JText._('CK_NEW_WINDOW','New window')+'</option>' +'</select></div>' +'<div class="item_toggler">'+Joomla.JText._('CK_CLICK_TO_EDIT_CONTENT','Click to edit the content')+'</div>' +'<div class="item_content"><textarea id="item_content_'+i+'" name="item_title_'+i+'" class="item_content_edition" onchange="ckUpdatePreviewArea()">'+itemcontent+'</textarea></div>' +'<br />' +'<div class="item_delete btn-small btn btn-danger" onclick="ckDeleteEditItem($ck(this).parent())">'+Joomla.JText._('CK_DELETE','Delete')+'</div>' +'<div class="item_close ckbutton">×</div>' +'<div class="item_overlay"></div>' +'</div>'); itemlist.append(itemedition); return itemedition; } function selectimagefile(file, id) { $ck('#'+id).val(file).trigger('change'); } function ckAddNewListItem() { // add the element in the teams var index = $ck('#items_edition_list .item_edition').length; ckAddNewGalleryItem(); // add the element in the list for the interface var itemInfos = {"title" : "", "url_text" : "", "url_href" : "", "url_target": "default"}; var itemedition = ckCreateEditGalleryItem(index, $ck('#items_edition_list'), 'Lorem Ipsum', $ck('<img src="'+PAGEBUILDERCK_MEDIA_URI+'/images/photo.png" />'), itemInfos ) ckMakeEditItemAccordion(itemedition); ckLoadEditorOnTheFly('item_content_' + index); ckMakeExpandable(); ckUpdatePreviewArea(); } function ckAddNewGalleryItem() { var lastitem = $ck('.editfocus .pbck_gallery_item').last(); var item = lastitem.clone(); $ck('.editfocus .pbck_gallery_wrap').append(item); return item; } function ckBeforeDeleteEditItem(item) { var index_item = item.index('.item_edition'); ckRemoveEditorOnTheFly(item.find('.item_content_edition').attr('id')); $ck('.editfocus .pbck_gallery_item').eq(index_item).remove(); } function ckMakeEditItemsSortable() { $ck( "#items_edition_list" ).sortable({ items: ".item_edition", helper: "clone", handle: ".item_move", forcePlaceholderSize: true, tolerance: "pointer", placeholder: "placeholderck", start: function(e, ui){ $ck(this).find('.item_content_edition').each(function(){ if (tinymce.get($ck(this).attr('id'))) { ckRemoveEditorOnTheFly($ck(this).attr('id')); } }); }, stop: function( event, ui ) { $ck(this).find('.item_content_edition:not(.ui-sortable-helper)').each(function(){ ckLoadEditorOnTheFly($ck(this).attr('id')); }); ckUpdatePreviewArea(); }, }); ckMakeExpandable(); } function ckValidateImageEffect() { // var title = $ck('#imageeffectckbuttonimgdesc').val() ? $ck('#imageeffectckbuttonimgtitle').val() + '::' + $ck('#imageeffectckbuttonimgdesc').val() : $ck('#imageeffectckbuttonimgtitle').val(); var imgCustomClasses = $ck('#imageeffectckbuttonimgclass').val() != '' ? ' ' + $ck('#imageeffectckbuttonimgclass').val() : ''; var cssclass = $ck('#imageeffectckbuttoneffectslist').val() + imgCustomClasses; // $ck('#imagetitle').val(title); $ck('#imagecssclass').val(cssclass).trigger('change'); } /* * Triggered from the Image Effect CK Params plugin, used to fill the data * @returns {undefined} */ function onImageeffectckmodalLoaded() { var focus_img = $ck('.editfocus img'); var imgsrc = focus_img.attr('src'); var imgclass = $ck('#imagecssclass').val(); CKApi.Imageeffect.setFieldsValue(imgsrc, 'Demo title::This is a description', imgclass); } function ckUpdateImageAttribute(attribute, value) { if (attribute == 'class') value += ' pbck_gallery_item fitie'; var focus_img = $ck('.editfocus figure'); if (value) { focus_img.attr(attribute, value); } else { focus_img.removeAttr(attribute); } } function ckUpdateSource() { var source = $ck('#imagesource').val(); if (source === 'folder') { $ck('#imagesource_editor').hide(); $ck('#imagesource_folder').show(); } else { $ck('#imagesource_editor').show(); $ck('#imagesource_folder').hide(); } } </script> <style type="text/css"> .item_image { float: left; box-shadow: #888 0 0 10px; margin: 0 10px 0 0; cursor: pointer; border: 5px solid #fff; } .item_image:hover { border-color: rgba(82, 168, 236, 0.8); } .item_image img { width: 150px; height: 150px; } .item_edition .item_toggler { display: inline-block; } #items_edition_list label { display: inline-block; width: 180px; } </style>

| ver. 1.4 | Github | . | PHP 7.4.33 | Generation time: 0.02 | proxy | phpinfo | Settings