class-thumbnail-gallery-template.php
371 lines
| 1 | <?php |
| 2 | |
| 3 | if ( ! defined( 'ABSPATH' ) ) { |
| 4 | exit; |
| 5 | } |
| 6 | |
| 7 | if ( !class_exists( 'FooGallery_Thumbnail_Gallery_Template' ) ) { |
| 8 | |
| 9 | define('FOOGALLERY_THUMBNAIL_GALLERY_TEMPLATE_URL', plugin_dir_url( __FILE__ )); |
| 10 | |
| 11 | class FooGallery_Thumbnail_Gallery_Template { |
| 12 | |
| 13 | const template_id = 'thumbnail'; |
| 14 | |
| 15 | /** |
| 16 | * Wire up everything we need to run the extension |
| 17 | */ |
| 18 | function __construct() { |
| 19 | add_filter( 'foogallery_gallery_templates', array( $this, 'add_template' ) ); |
| 20 | add_filter( 'foogallery_gallery_templates_files', array( $this, 'register_myself' ) ); |
| 21 | |
| 22 | //build up the thumb dimensions from some arguments |
| 23 | add_filter( 'foogallery_calculate_thumbnail_dimensions-thumbnail', array( $this, 'build_thumbnail_dimensions_from_arguments' ), 10, 2 ); |
| 24 | |
| 25 | //build up the thumb dimensions on save |
| 26 | add_filter( 'foogallery_template_thumbnail_dimensions-thumbnail', array( $this, 'get_thumbnail_dimensions' ), 10, 2 ); |
| 27 | |
| 28 | //add additional link attributes to each item |
| 29 | add_filter( 'foogallery_attachment_html_link_attributes', array( $this, 'alter_link_attributes'), 10, 3 ); |
| 30 | |
| 31 | //build up the arguments needed for rendering this template |
| 32 | add_filter( 'foogallery_gallery_template_arguments-thumbnail', array( $this, 'build_gallery_template_arguments' ) ); |
| 33 | |
| 34 | // Add specific caption fields |
| 35 | add_filter( 'foogallery_override_gallery_template_fields-thumbnail', array( $this, 'add_caption_fields' ), 999, 2 ); |
| 36 | |
| 37 | // Adjust the default settings for this layout |
| 38 | add_filter( 'foogallery_override_gallery_template_fields_defaults-thumbnail', array( $this, 'field_defaults' ), 10, 1 ); |
| 39 | |
| 40 | // Add responsive position rules for the single thumbnail. |
| 41 | add_action( 'foogallery_template_style_block-thumbnail', array( $this, 'add_css' ), 10, 2 ); |
| 42 | } |
| 43 | |
| 44 | /** |
| 45 | * Build up the arguments needed for rendering this gallery template |
| 46 | * |
| 47 | * @param $args |
| 48 | * |
| 49 | * @return array |
| 50 | */ |
| 51 | function build_gallery_template_arguments( $args ) { |
| 52 | $args = foogallery_gallery_template_setting( 'thumbnail_dimensions', array() ); |
| 53 | $args['crop'] = '1'; //we now force thumbs to be cropped |
| 54 | |
| 55 | if ( foogallery_gallery_template_setting( 'link_custom_url', '' ) === 'on' ) { |
| 56 | $args['link'] = 'custom'; |
| 57 | } |
| 58 | |
| 59 | return $args; |
| 60 | } |
| 61 | |
| 62 | /** |
| 63 | * Add a rel attribute to all image links to make the lightboxes work |
| 64 | * |
| 65 | * @param $attr |
| 66 | * @param $args |
| 67 | * @param $foogallery_attachment FooGalleryAttachment |
| 68 | * |
| 69 | * @return mixed |
| 70 | */ |
| 71 | function alter_link_attributes($attr, $args, $foogallery_attachment) { |
| 72 | global $current_foogallery; |
| 73 | if ( isset( $current_foogallery ) && self::template_id === $current_foogallery->gallery_template ) { |
| 74 | |
| 75 | //always set the rel so that lightboxes will group the images |
| 76 | $attr['rel'] = 'lightbox[' . $current_foogallery->ID . ']'; |
| 77 | |
| 78 | //check if we must hide the featured image within the lightbox |
| 79 | if ( isset( $foogallery_attachment->featured ) && foogallery_gallery_template_setting( 'exclude_featured_image', '' ) === 'on' ) { |
| 80 | $attr['class'] = 'fg-panel-hide'; |
| 81 | } |
| 82 | } |
| 83 | |
| 84 | return $attr; |
| 85 | } |
| 86 | |
| 87 | /** |
| 88 | * Register myself so that all associated JS and CSS files can be found and automatically included |
| 89 | * @param $extensions |
| 90 | * |
| 91 | * @return array |
| 92 | */ |
| 93 | function register_myself( $extensions ) { |
| 94 | $extensions[] = __FILE__; |
| 95 | return $extensions; |
| 96 | } |
| 97 | |
| 98 | /** |
| 99 | * Add our gallery template to the list of templates available for every gallery |
| 100 | * @param $gallery_templates |
| 101 | * |
| 102 | * @return array |
| 103 | */ |
| 104 | function add_template( $gallery_templates ) { |
| 105 | $gallery_templates[self::template_id] = array( |
| 106 | 'slug' => self::template_id, |
| 107 | 'name' => __( 'Single Thumbnail', 'foogallery' ), |
| 108 | 'preview_support' => true, |
| 109 | 'common_fields_support' => true, |
| 110 | 'lazyload_support' => true, |
| 111 | 'mandatory_classes' => 'fg-thumbnail', |
| 112 | 'thumbnail_dimensions' => true, |
| 113 | 'paging_support' => false, |
| 114 | 'enqueue_core' => true, |
| 115 | 'icon' => '<svg viewBox="0 0 24 24"> |
| 116 | <rect x="3" y="5" width="18" height="14"/> |
| 117 | <polyline points="6,15 10,12 14,16 18,12"/> |
| 118 | <circle cx="9" cy="9" r="1.5"/> |
| 119 | </svg>', |
| 120 | 'fields' => array( |
| 121 | array( |
| 122 | 'id' => 'help', |
| 123 | 'type' => 'html', |
| 124 | 'section' => __( 'General', 'foogallery' ), |
| 125 | 'help' => true, |
| 126 | 'title' => __( 'Single Thumbnail Layout', 'foogallery' ), |
| 127 | 'desc' => __( 'This gallery layout only shows a single thumbnail, but the true power shines through when the thumbnail is clicked, because then the lightbox takes over and the user can view all the images in the gallery.', 'foogallery' ), |
| 128 | ), |
| 129 | array( |
| 130 | 'id' => 'thumbnail_dimensions', |
| 131 | 'title' => __( 'Size', 'foogallery' ), |
| 132 | 'desc' => __( 'Choose the size of your thumbnail.', 'foogallery' ), |
| 133 | 'section' => __( 'General', 'foogallery' ), |
| 134 | 'alias' => 'thumbnail_size', |
| 135 | 'type' => 'thumb_size_no_crop', |
| 136 | 'for' => 'thumbnail_dimensions_width', |
| 137 | 'default' => array( |
| 138 | 'width' => 350, |
| 139 | 'height' => 250 |
| 140 | ), |
| 141 | 'row_data'=> array( |
| 142 | 'data-foogallery-change-selector' => 'input', |
| 143 | 'data-foogallery-preview' => 'shortcode' |
| 144 | ) |
| 145 | ), |
| 146 | array( |
| 147 | 'id' => 'position', |
| 148 | 'title' => __( 'Position', 'foogallery' ), |
| 149 | 'desc' => __( 'The position of the thumbnail related to the content around it.', 'foogallery' ), |
| 150 | 'section' => __( 'General', 'foogallery' ), |
| 151 | 'default' => 'fg-center', |
| 152 | 'type' => 'select', |
| 153 | 'choices' => array( |
| 154 | 'fg-center' => __( 'Full Center', 'foogallery' ), |
| 155 | 'fg-left' => __( 'Full Left', 'foogallery' ), |
| 156 | 'fg-right' => __( 'Full Right', 'foogallery' ), |
| 157 | 'fg-float-left' => __( 'Float Left', 'foogallery' ), |
| 158 | 'fg-float-right' => __( 'Float Right', 'foogallery' ), |
| 159 | ), |
| 160 | 'mobile' => true, |
| 161 | 'row_data'=> array( |
| 162 | 'data-foogallery-change-selector' => 'select', |
| 163 | 'data-foogallery-preview' => 'shortcode' |
| 164 | ) |
| 165 | ), |
| 166 | array( |
| 167 | 'id' => 'show_as_stack', |
| 168 | 'title' => __( 'Stacked Effect', 'foogallery' ), |
| 169 | 'section' => __( 'General', 'foogallery' ), |
| 170 | 'default' => 'fg-stacked', |
| 171 | 'type' => 'radio', |
| 172 | 'desc' => __( 'Show the thumbnails as a stack or pile of images.', 'foogallery' ), |
| 173 | 'choices' => array( |
| 174 | '' => __( 'None', 'foogallery' ), |
| 175 | 'fg-stacked' => __( 'Stacked', 'foogallery' ) |
| 176 | ), |
| 177 | 'row_data'=> array( |
| 178 | 'data-foogallery-change-selector' => 'input', |
| 179 | 'data-foogallery-preview' => 'shortcode', |
| 180 | 'data-foogallery-value-selector' => 'input:checked', |
| 181 | ) |
| 182 | ), |
| 183 | array( |
| 184 | 'id' => 'link_custom_url', |
| 185 | 'title' => __( 'Link To Custom URL', 'foogallery' ), |
| 186 | 'section' => __( 'General', 'foogallery' ), |
| 187 | 'default' => '', |
| 188 | 'type' => 'checkbox', |
| 189 | 'desc' => __( 'You can link your thumbnails to Custom URL\'s (if they are set on your attachments). Fallback will be to the full size image.', 'foogallery' ), |
| 190 | 'row_data'=> array( |
| 191 | 'data-foogallery-change-selector' => 'input', |
| 192 | 'data-foogallery-preview' => 'shortcode', |
| 193 | 'data-foogallery-value-selector' => 'input:checked', |
| 194 | ) |
| 195 | ), |
| 196 | array( |
| 197 | 'id' => 'lightbox', |
| 198 | 'type' => 'lightbox', |
| 199 | ), |
| 200 | array( |
| 201 | 'id' => 'exclude_featured_image', |
| 202 | 'title' => __( 'Exclude Featured Image', 'foogallery' ), |
| 203 | 'section' => __( 'General', 'foogallery' ), |
| 204 | 'default' => '', |
| 205 | 'type' => 'checkbox', |
| 206 | 'desc' => __( 'You can exclude the featured image from the images shown in the lightbox.', 'foogallery' ), |
| 207 | 'row_data'=> array( |
| 208 | 'data-foogallery-hidden' => true, |
| 209 | 'data-foogallery-show-when-field' => 'lightbox', |
| 210 | 'data-foogallery-show-when-field-operator' => '===', |
| 211 | 'data-foogallery-show-when-field-value' => 'foogallery', |
| 212 | 'data-foogallery-change-selector' => 'input', |
| 213 | 'data-foogallery-preview' => 'shortcode', |
| 214 | 'data-foogallery-value-selector' => 'input:checked', |
| 215 | ) |
| 216 | ) |
| 217 | ) |
| 218 | ); |
| 219 | |
| 220 | return $gallery_templates; |
| 221 | } |
| 222 | |
| 223 | /** |
| 224 | * Add caption fields to the gallery template if supported |
| 225 | * |
| 226 | * @param $fields |
| 227 | * @param $template |
| 228 | * |
| 229 | * @return array |
| 230 | */ |
| 231 | function add_caption_fields( $fields, $template ) { |
| 232 | |
| 233 | $new_fields[] = array( |
| 234 | 'id' => 'caption_override_help', |
| 235 | 'title' => __( 'Caption Override Help', 'foogallery' ), |
| 236 | 'desc' => __( 'You can include dynamic placeholders in the override title and description, eg. <code>{{gallery-count}}</code> and <code>{{gallery-title}}</code>.', 'foogallery' ), |
| 237 | 'section' => __( 'Captions', 'foogallery' ), |
| 238 | 'type' => 'help' |
| 239 | ); |
| 240 | |
| 241 | $new_fields[] = array( |
| 242 | 'id' => 'caption_title', |
| 243 | 'title' => __('Override Title', 'foogallery'), |
| 244 | 'section' => __( 'Captions', 'foogallery' ), |
| 245 | 'desc' => __('Leave blank if you do not want a caption title.', 'foogallery'), |
| 246 | 'type' => 'text', |
| 247 | 'row_data'=> array( |
| 248 | 'data-foogallery-change-selector' => 'input', |
| 249 | 'data-foogallery-preview' => 'shortcode' |
| 250 | ) |
| 251 | ); |
| 252 | $new_fields[] = array( |
| 253 | 'id' => 'caption_description', |
| 254 | 'title' => __('Override Description', 'foogallery'), |
| 255 | 'section' => __( 'Captions', 'foogallery' ), |
| 256 | 'desc' => __('Leave blank if you do not want a caption description.', 'foogallery'), |
| 257 | 'type' => 'textarea', |
| 258 | 'row_data'=> array( |
| 259 | 'data-foogallery-change-selector' => 'textarea', |
| 260 | 'data-foogallery-preview' => 'shortcode' |
| 261 | ) |
| 262 | ); |
| 263 | |
| 264 | $field_index = foogallery_admin_fields_find_index_of_field( $fields, 'caption_alignment' ); |
| 265 | |
| 266 | array_splice( $fields, $field_index + 1, 0, $new_fields ); |
| 267 | |
| 268 | return $fields; |
| 269 | } |
| 270 | |
| 271 | /** |
| 272 | * Builds thumb dimensions from arguments |
| 273 | * |
| 274 | * @param array $dimensions |
| 275 | * @param array $arguments |
| 276 | * |
| 277 | * @return mixed |
| 278 | */ |
| 279 | function build_thumbnail_dimensions_from_arguments( $dimensions, $arguments ) { |
| 280 | if ( array_key_exists( 'thumbnail_dimensions', $arguments) ) { |
| 281 | return array( |
| 282 | 'height' => intval($arguments['thumbnail_dimensions']['height']), |
| 283 | 'width' => intval($arguments['thumbnail_dimensions']['width']), |
| 284 | 'crop' => true |
| 285 | ); |
| 286 | } |
| 287 | return null; |
| 288 | } |
| 289 | |
| 290 | /** |
| 291 | * Get the thumb dimensions arguments saved for the gallery for this gallery template |
| 292 | * |
| 293 | * @param array $dimensions |
| 294 | * @param FooGallery $foogallery |
| 295 | * |
| 296 | * @return mixed |
| 297 | */ |
| 298 | function get_thumbnail_dimensions( $dimensions, $foogallery ) { |
| 299 | $dimensions = $foogallery->get_meta( 'thumbnail_thumbnail_dimensions', array( |
| 300 | 'width' => get_option( 'thumbnail_size_w' ), |
| 301 | 'height' => get_option( 'thumbnail_size_h' ), |
| 302 | 'crop' => true |
| 303 | ) ); |
| 304 | if ( !array_key_exists( 'crop', $dimensions ) ) { |
| 305 | $dimensions['crop'] = true; |
| 306 | } |
| 307 | return $dimensions; |
| 308 | } |
| 309 | |
| 310 | /** |
| 311 | * Add a mobile-only position override for the single thumbnail. |
| 312 | * |
| 313 | * @param array $css Gallery CSS rules. |
| 314 | * @param FooGallery $gallery Gallery instance. |
| 315 | * |
| 316 | * @return array |
| 317 | */ |
| 318 | function add_css( $css, $gallery ) { |
| 319 | $position = foogallery_gallery_template_setting( 'mobile_position', null ); |
| 320 | $rules = array( |
| 321 | 'fg-center' => array( 'text-align:center;float:none;width:100%;', 'grid-template-columns:1fr auto 1fr;', 'grid-column:2 / 3;' ), |
| 322 | 'fg-left' => array( 'text-align:left;float:none;width:100%;', 'grid-template-columns:auto 1fr;', 'grid-column:1 / 2;' ), |
| 323 | 'fg-right' => array( 'text-align:right;float:none;width:100%;', 'grid-template-columns:1fr auto;', 'grid-column:2 / 3;' ), |
| 324 | 'fg-float-left' => array( 'text-align:left;float:left;width:auto;', 'display:inline-grid;grid-template-columns:auto;', 'grid-column:1 / 2;' ), |
| 325 | 'fg-float-right' => array( 'text-align:right;float:right;width:auto;', 'display:inline-grid;grid-template-columns:auto;', 'grid-column:1 / 2;' ), |
| 326 | ); |
| 327 | |
| 328 | if ( ! isset( $rules[ $position ] ) ) { |
| 329 | return $css; |
| 330 | } |
| 331 | |
| 332 | $id = sanitize_html_class( $gallery->container_id() ); |
| 333 | $rule = $rules[ $position ]; |
| 334 | $mobile_rule = '#' . $id . '{' . $rule[0] . '}#' . $id . '.fg-stacked{' . $rule[1] . '}#' . $id . '.fg-stacked .fg-item{' . $rule[2] . '}'; |
| 335 | $preview = '.foogallery-preview-wrapper.viewport-mobile #' . $id . '{' . $rule[0] . '}.foogallery-preview-wrapper.viewport-mobile #' . $id . '.fg-stacked{' . $rule[1] . '}.foogallery-preview-wrapper.viewport-mobile #' . $id . '.fg-stacked .fg-item{' . $rule[2] . '}'; |
| 336 | |
| 337 | $css[] = '@media only screen and (max-width:' . foogallery_get_mobile_size() . 'px){' . $mobile_rule . '}'; |
| 338 | $css[] = $preview; |
| 339 | |
| 340 | return $css; |
| 341 | } |
| 342 | |
| 343 | /** |
| 344 | * Return an array of field defaults for the template |
| 345 | * |
| 346 | * @param $field_defaults |
| 347 | * |
| 348 | * @return string[] |
| 349 | */ |
| 350 | function field_defaults( $field_defaults ) { |
| 351 | return array_merge( $field_defaults, array( |
| 352 | 'theme' => 'fg-light', |
| 353 | 'hover_effect_caption_visibility' => 'fg-caption-always', |
| 354 | 'caption_visibility_no_hover_effect' => 'fg-caption-always', |
| 355 | 'border_size' => 'fg-border-medium', |
| 356 | 'drop_shadow' => 'fg-shadow-small', |
| 357 | 'rounded_corners' => 'fg-round-small', |
| 358 | 'inner_shadow' => 'fg-shadow-inset-medium', |
| 359 | 'hover_effect_type' => 'normal', |
| 360 | 'hover_effect_scale' => 'fg-hover-semi-zoomed', |
| 361 | 'hover_effect_icon' => 'fg-hover-zoom4', |
| 362 | 'caption_title' => '{{gallery-title}}', |
| 363 | 'caption_description' => '{{gallery-count}} Images', |
| 364 | 'caption_alignment' => 'fg-c-c', |
| 365 | 'show_as_stack' => 'fg-stacked', |
| 366 | 'loaded_effect' => '' |
| 367 | ) ); |
| 368 | } |
| 369 | } |
| 370 | } |
| 371 |