/**
* @param $slider N2SmartSliderAbstract
* @param $id
* @param $params
*
* @return string
*/
static function render($slider, $id, $params)
{
N2CSS::addFile(N2Filesystem::translate(dirname(__FILE__) . DIRECTORY_SEPARATOR . 'horizontal' . DIRECTORY_SEPARATOR . 'style.css'), $id);
N2JS::addFile(N2Filesystem::translate(dirname(__FILE__) . '/horizontal/bar.js'), $id);
list($displayClass, $displayAttributes) = self::getDisplayAttributes($params, self::$key);
$styleClass = N2StyleRenderer::render($params->get(self::$key . 'style'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ');
$fontTitle = N2FontRenderer::render($params->get(self::$key . 'font-title'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ', $slider->fontSize);
$fontDescription = N2FontRenderer::render($params->get(self::$key . 'font-description'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ', $slider->fontSize);
list($style, $attributes) = self::getPosition($params, self::$key);
$attributes['data-offset'] = $params->get(self::$key . 'position-offset');
$style .= 'text-align: ' . $params->get(self::$key . 'align') . ';';
$width = $params->get(self::$key . 'width');
if (is_numeric($width) || substr($width, -1) == '%' || substr($width, -2) == 'px') {
$style .= 'width:' . $width . ';';
} else {
$attributes['data-sswidth'] = $width;
}
$innerStyle = '';
if (!$params->get(self::$key . 'full-width')) {
$innerStyle = 'display: inline-block;';
}
$separator = $params->get(self::$key . 'separator');
$showDescription = intval($params->get(self::$key . 'show-description'));
$slides = array();
for ($i = 0; $i < count($slider->slides); $i++) {
$slides[$i] = N2Html::tag('span', array('class' => $fontTitle), $slider->slides[$i]->getTitle());
$description = $slider->slides[$i]->getDescription();
if ($showDescription && !empty($description)) {
$slides[$i] .= N2Html::tag('span', array('class' => $fontDescription), $separator . $description);
}
}
$parameters = array('overlay' => $params->get(self::$key . 'position-mode') != 'simple' || $params->get(self::$key . 'overlay'), 'area' => intval($params->get(self::$key . 'position-area')), 'animate' => intval($params->get(self::$key . 'animate')));
N2JS::addInline('new NextendSmartSliderWidgetBarHorizontal("' . $id . '", ' . json_encode($slides) . ', ' . json_encode($parameters) . ');');
return N2Html::tag("div", $displayAttributes + $attributes + array("class" => $displayClass . "nextend-bar nextend-bar-horizontal", "style" => $style), N2Html::tag("div", array("class" => $styleClass, "style" => $innerStyle), $slides[$slider->_activeSlide]));
}
private function getHtml($data, $id, $slider, $slide)
{
$font = N2FontRenderer::render($data->get('font'), 'link', $slider->elementId, 'div#' . $slider->elementId . ' ', $slider->fontSize);
$html = N2Html::openTag("div", array("class" => "nextend-smartslider-button-container {$font}", "style" => "cursor: pointer; display:" . ($data->get('fullwidth', 0) ? 'block' : 'inline-block') . ";" . ($data->get('nowrap', 1) ? 'white-space:nowrap;' : '')));
$style = N2StyleRenderer::render($data->get('style'), 'heading', $slider->elementId, 'div#' . $slider->elementId . ' ');
$html .= $this->getLink($slide, $data, $slide->fill($data->get("content")), array("style" => "display:" . ($data->get('fullwidth', 0) ? 'block' : 'inline-block') . ";", "class" => "{$style} {$data->get('class', '')}"), true);
$html .= N2Html::closeTag("div");
return $html;
}
private function getHtml($data, $id, $slider, $slide)
{
$attributes = array();
$font = N2FontRenderer::render($data->get('font'), 'hover', $slider->elementId, 'div#' . $slider->elementId . ' ', $slider->fontSize);
$style = N2StyleRenderer::render($data->get('style'), 'heading', $slider->elementId, 'div#' . $slider->elementId . ' ');
$linkAttributes = array();
if ($this->isEditor) {
$linkAttributes['onclick'] = 'return false;';
}
$title = $data->get('title', '');
if (!empty($title)) {
$attributes['title'] = $title;
}
list($link) = (array) N2Parse::parse($data->get('link', '#|*|'));
if (!empty($link) && $link != '#') {
$linkAttributes['class'] = $font;
$font = '';
}
return $this->heading($data->get('priority', 2), $attributes + array("id" => $id, "class" => $font . $style . " " . $data->get('class', ''), "style" => "display:" . ($data->get('fullwidth', 1) ? 'block' : 'inline-block') . ";" . ($data->get('nowrap', 1) ? 'white-space:nowrap;' : '')), $this->getLink($slide, $data, str_replace("\n", '<br />', strip_tags($slide->fill($data->get('heading', '')))), $linkAttributes));
}
private function getHTML($data, $slider, $slide)
{
$font = N2FontRenderer::render($data->get('font'), 'paragraph', $slider->elementId, 'div#' . $slider->elementId . ' ', $slider->fontSize);
$style = N2StyleRenderer::render($data->get('style'), 'heading', $slider->elementId, 'div#' . $slider->elementId . ' ');
$html = '';
$content = str_replace('<p>', '<p class="' . $font . ' ' . $style . ' n2-ow">', $this->wpautop(self::closeTags($slide->fill($data->get('content', '')))));
$contentTablet = str_replace('<p>', '<p class="' . $font . ' ' . $style . ' n2-ow">', $this->wpautop(self::closeTags($slide->fill($data->get('contenttablet', '')))));
$contentMobile = str_replace('<p>', '<p class="' . $font . ' ' . $style . ' n2-ow">', $this->wpautop(self::closeTags($slide->fill($data->get('contentmobile', '')))));
$class = '';
if ($contentMobile == '') {
$class .= ' n2-ss-mobile';
} else {
$html .= N2Html::tag('div', array('class' => 'n2-ss-mobile'), $contentMobile);
}
if ($contentTablet == '') {
$class .= ' n2-ss-tablet';
} else {
$html .= N2Html::tag('div', array('class' => 'n2-ss-tablet' . $class), $contentTablet);
$class = '';
}
$html .= N2Html::tag('div', array('class' => 'n2-ss-desktop' . $class), $content);
return $html;
}
/**
* @param $slider N2SmartSliderAbstract
* @param $id
* @param $params
*
* @return string
*/
static function render($slider, $id, $params)
{
$showImage = intval($params->get(self::$key . 'show-image'));
$showTitle = intval($params->get(self::$key . 'title'));
$showDescription = intval($params->get(self::$key . 'description'));
if (!$showImage && !$showTitle && !$showDescription) {
// Nothing to show
return '';
}
N2JS::addFile(N2Filesystem::translate(dirname(__FILE__) . '/default/thumbnail.js'), $id);
N2LESS::addFile(N2Filesystem::translate(dirname(__FILE__) . DIRECTORY_SEPARATOR . 'default' . DIRECTORY_SEPARATOR . 'style.less'), $slider->cacheId, array("sliderid" => $slider->elementId), NEXTEND_SMARTSLIDER_ASSETS . '/less' . NDS);
list($displayClass, $displayAttributes) = self::getDisplayAttributes($params, self::$key);
list($style, $attributes) = self::getPosition($params, self::$key);
$attributes['data-offset'] = $params->get(self::$key . 'position-offset', 0);
$barStyle = N2StyleRenderer::render($params->get(self::$key . 'style-bar'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ');
$slideStyle = N2StyleRenderer::render($params->get(self::$key . 'style-slides'), 'dot', $slider->elementId, 'div#' . $slider->elementId . ' ');
$width = intval($slider->params->get(self::$key . 'width', 160));
$height = intval($slider->params->get(self::$key . 'height', 100));
$captionPlacement = $slider->params->get(self::$key . 'caption-placement', 'overlay');
if (!$showImage) {
$captionPlacement = 'before';
}
if (!$showTitle && !$showDescription) {
$captionPlacement = 'overlay';
}
$captionSize = intval($slider->params->get(self::$key . 'caption-size', 100));
$showCaption = $showTitle || $showDescription;
if ($showCaption) {
$captionStyle = N2StyleRenderer::render($params->get(self::$key . 'title-style'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ');
if ($showTitle) {
$titleFont = N2FontRenderer::render($params->get(self::$key . 'title-font'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ');
}
if ($showDescription) {
$descriptionFont = N2FontRenderer::render($params->get(self::$key . 'description-font'), 'simple', $slider->elementId, 'div#' . $slider->elementId . ' ');
}
}
$group = max(1, intval($params->get(self::$key . 'group')));
$orientation = self::getOrientationByPosition($params->get(self::$key . 'position-mode'), $params->get(self::$key . 'position-area'), $params->get(self::$key . 'orientation'));
if ($orientation == 'auto') {
$orientation = 'vertical';
}
$slides = N2Html::openTag('table');
$containerStyle = '';
$captionClass = 'n2-caption-' . $captionPlacement;
$captionExtraStyle = '';
switch ($captionPlacement) {
case 'before':
case 'after':
switch ($orientation) {
case 'vertical':
if (!$showImage) {
$width = 0;
}
$containerStyle = "width: " . ($width + $captionSize) . "px; height: {$height}px;";
$captionExtraStyle .= "width: {$captionSize}px";
break;
default:
if (!$showImage) {
$height = 0;
}
$containerStyle = "width: {$width}px; height: " . ($height + $captionSize) . "px;";
$captionExtraStyle .= "height: {$captionSize}px";
}
break;
default:
$containerStyle = "width: {$width}px; height: {$height}px;";
}
$image = '';
$rows = array();
$i = 0;
foreach ($slider->slides as $slide) {
$active = '';
if ($slider->_activeSlide == $i) {
$active = 'n2-active ';
}
if ($orientation == 'horizontal') {
$row = $i % $group;
} else {
$row = intval($i / $group);
}
if (!isset($rows[$row])) {
$rows[$row] = array();
}
if ($showImage) {
$image = N2Html::tag('div', array('class' => 'n2-ss-thumb-image', 'style' => "background-image: URL('" . $slide->getThumbnail() . "'); width: {$width}px; height: {$height}px;"), '');
}
$inner = '';
if ($showCaption) {
$html = '';
if ($showTitle) {
$html .= N2Html::tag('div', array('class' => $titleFont), $slide->getTitle());
}
$description = $slide->getDescription();
if ($showDescription && !empty($description)) {
$html .= N2Html::tag('div', array('class' => $descriptionFont), $description);
}
$inner = N2Html::tag('div', array('class' => $captionStyle . 'n2-ss-caption ' . $captionClass, 'style' => $captionExtraStyle), $html);
}
switch ($captionPlacement) {
case 'before':
$inner .= $image;
break;
case 'after':
default:
$inner = $image . $inner;
}
$rows[$row][] = N2Html::tag('td', array(), N2Html::tag('div', array('class' => $slideStyle . $active, 'style' => $containerStyle), $inner));
$i++;
}
foreach ($rows as $row) {
$slides .= N2Html::tag('tr', array(), implode('', $row));
}
$slides .= N2Html::closeTag('table');
$parameters = array('overlay' => $params->get(self::$key . 'position-mode') != 'simple' || $params->get(self::$key . 'overlay'), 'area' => intval($params->get(self::$key . 'position-area')), 'orientation' => $orientation, 'group' => $group, 'action' => $params->get(self::$key . 'action'));
N2JS::addInline('new NextendSmartSliderWidgetThumbnailDefault("' . $id . '", ' . json_encode($parameters) . ');');
$size = $params->get(self::$key . 'size');
if ($orientation == 'horizontal') {
if (is_numeric($size) || substr($size, -1) == '%' || substr($size, -2) == 'px') {
$style .= 'width:' . $size . ';';
} else {
$attributes['data-sswidth'] = $size;
}
} else {
if (is_numeric($size) || substr($size, -1) == '%' || substr($size, -2) == 'px') {
$style .= 'height:' . $size . ';';
} else {
$attributes['data-ssheight'] = $size;
}
}
$previous = $next = '';
$showArrow = intval($slider->params->get(self::$key . 'arrow', 1));
if ($showArrow) {
$previous = N2Html::image('data:image/svg+xml;base64,' . base64_encode(N2Filesystem::readFile(N2ImageHelper::fixed('$ss$/plugins/widgetthumbnail/default/default/thumbnail-up-arrow.svg', true))), '', array('class' => 'nextend-thumbnail-button nextend-thumbnail-previous'));
$next = N2Html::image('data:image/svg+xml;base64,' . base64_encode(N2Filesystem::readFile(N2ImageHelper::fixed('$ss$/plugins/widgetthumbnail/default/default/thumbnail-down-arrow.svg', true))), '', array('class' => 'nextend-thumbnail-button nextend-thumbnail-next n2-active'));
}
if ($params->get(self::$key . 'position-mode') == 'simple' && $orientation == 'vertical') {
$area = $params->get(self::$key . 'position-area');
switch ($area) {
case '5':
case '6':
case '7':
case '8':
$attributes['data-sstop'] = '0';
break;
}
}
return N2Html::tag('div', $displayAttributes + $attributes + array('class' => $displayClass . 'nextend-thumbnail nextend-thumbnail-default nextend-thumbnail-' . $orientation, 'style' => $style), $previous . $next . N2Html::tag('div', array('class' => 'nextend-thumbnail-inner'), N2Html::tag('div', array('class' => $barStyle . 'nextend-thumbnail-scroller'), $slides)));
}
