';
switch ($layout) {
case 'tiles':
$skeleton_html .= $this->get_responsive_tiles_skeleton($gallery_options, $image_count);
break;
case 'masonry':
$skeleton_html .= $this->get_responsive_masonry_skeleton($gallery_options, $image_count);
break;
case 'square':
$skeleton_html .= $this->get_responsive_square_skeleton($gallery_options, $image_count);
break;
case 'justified':
$skeleton_html .= $this->get_responsive_justified_skeleton($gallery_options, $image_count);
break;
case 'cascade':
$skeleton_html .= $this->get_responsive_cascade_skeleton($gallery_options, $image_count);
break;
case 'horizontal':
case 'carousel':
$skeleton_html .= $this->get_responsive_horizontal_skeleton($gallery_options, $image_count);
break;
case 'map':
$skeleton_html .= $this->get_map_skeleton($gallery_options, $image_count);
break;
default:
$skeleton_html .= $this->get_responsive_tiles_skeleton($gallery_options, $image_count);
}
$skeleton_html .= '';
return $skeleton_html;
}
private function get_responsive_tiles_skeleton($gallery_options, $image_count = null) {
$gutter = $gallery_options['tiles_gutter'] ?? 10;
$columns = $gallery_options['tiles_columns'] ?? 2;
$count = $image_count ?? 4; // Default to 4 if no count provided
// Limit the skeleton to a reasonable number to prevent performance issues
$count = min($count, 12);
$html = '
';
// Calculate rows needed
$rows = ceil($count / $columns);
$rows = min($rows, 3); // Limit to 3 rows maximum
for ($row = 0; $row < $rows; $row++) {
$html .= '
';
// Items in this row
$items_in_row = min($columns, $count - ($row * $columns));
for ($col = 0; $col < $items_in_row; $col++) {
$html .= '
';
$html .= '
';
$html .= '
';
$html .= '
';
}
$html .= '
';
}
$html .= '
';
return $html;
}
private function get_responsive_masonry_skeleton($gallery_options, $image_count = null) {
$columns = $gallery_options['masonry_columns'] ?? 3;
$gutter = $gallery_options['masonry_gutter'] ?? 5;
$count = $image_count ?? 6; // Default to 6 if no count provided
// Limit the skeleton to a reasonable number
$count = min($count, $columns * 3); // Max 3 rows worth
$html = '';
for ($i = 0; $i < $count; $i++) {
$height = 120 + ($i % 3) * 40; // Vary heights slightly
$html .= '
';
$html .= '
';
$html .= '
';
}
$html .= '
';
return $html;
}
private function get_responsive_square_skeleton($gallery_options, $image_count = null) {
$columns = $gallery_options['square_columns_desktop'] ?? 5;
$gutter = $gallery_options['square_gutter'] ?? 5;
$count = $image_count ?? $columns; // Default to one row if no count provided
// Limit the skeleton to a reasonable number
$count = min($count, $columns * 2); // Max 2 rows worth
$html = '';
for ($i = 0; $i < $count; $i++) {
$html .= '
';
$html .= '
';
$html .= '
';
}
$html .= '
';
return $html;
}
private function get_responsive_justified_skeleton($gallery_options, $image_count = null) {
$gutter = $gallery_options['justified_gutter'] ?? 5;
$row_height = min($gallery_options['justified_row_height'] ?? 200, 180); // Cap at 180px
$count = $image_count ?? 6; // Default to 6 if no count provided
// Limit the skeleton to a reasonable number
$count = min($count, 9); // Max 9 items
$items_per_row = 3;
$rows = min(ceil($count / $items_per_row), 3); // Max 3 rows
$html = '';
for ($row = 0; $row < $rows; $row++) {
$items_in_row = min($items_per_row, $count - ($row * $items_per_row));
$html .= '
';
for ($i = 0; $i < $items_in_row; $i++) {
$html .= '
';
$html .= '
';
$html .= '
';
}
$html .= '
';
}
$html .= '
';
return $html;
}
private function get_responsive_cascade_skeleton($gallery_options, $image_count = null) {
$gutter = $gallery_options['cascade_gutter'] ?? 10;
$count = $image_count ?? 4; // Default to 4 if no count provided
// Limit the skeleton to a reasonable number
$count = min($count, 6); // Max 6 items for cascade
$html = '';
for ($i = 0; $i < $count; $i++) {
$width = ($i % 2 === 0) ? '60%' : '40%';
$height = 100 + ($i * 20);
$margin_left = ($i % 2 === 0) ? '0' : 'auto';
$html .= '
';
$html .= '
';
$html .= '
';
$html .= '
';
}
$html .= '
';
return $html;
}
private function get_responsive_horizontal_skeleton($gallery_options, $image_count = null) {
$image_height = min($gallery_options['horizontal_image_height'] ?? $gallery_options['carousel_image_height'] ?? 300, 250); // Cap at 250px
$gutter = $gallery_options['horizontal_gutter'] ?? $gallery_options['carousel_gutter'] ?? 5;
$count = $image_count ?? 5; // Default to 5 if no count provided
// Limit the skeleton to a reasonable number
$count = min($count, 8); // Max 8 items for horizontal
$html = '';
$html .= '
';
for ($i = 0; $i < $count; $i++) {
$width = $image_height * 0.8; // Fixed ratio
$html .= '
';
$html .= '
';
$html .= '
';
}
$html .= '
';
return $html;
}
private function get_map_skeleton($gallery_options, $image_count = null) {
$height = $gallery_options['map_height'] ?? 400;
$html = '';
$html .= '
';
$html .= '
';
return $html;
}
}
?>