New dev branch

2024-12-16 20:12:25 -08:00
parent f356906bb1
commit 1234341241
139 changed files with 9837 additions and 14 deletions
--- a/blocks/lcp-dynamic-container/lcp-dynamic-container.php
+++ b/blocks/lcp-dynamic-container/lcp-dynamic-container.php
@ -0,0 +1,131 @@
+<?php /**
+ * Function to generate random class and add dynamic padding styles
+ */
+function render_lcp_container( $attributes, $content ) {
+    // Debugging: Check the passed attributes
+    //var_dump($attributes);
+
+    // Generate a random class name (optional, could be customized)
+    $random_class = 'lcp-container-' . wp_generate_password( 12, false, false );
+
+    // Get the padding and backgroundColor attributes
+    $padding = isset( $attributes['padding'] ) ? $attributes['padding'] : array();
+    $background_color = isset( $attributes['backgroundColor'] ) ? $attributes['backgroundColor'] : '#ffffff'; // Default color
+
+    // Debugging: Check padding and background color
+    error_log(print_r($padding, true)); 
+    error_log(print_r($background_color, true)); 
+
+    // Check if all padding values are the same across all sizes
+    $same_padding = true;
+    $padding_top = $padding['extraLarge']['top'];
+    $padding_right = $padding['extraLarge']['right'];
+    $padding_bottom = $padding['extraLarge']['bottom'];
+    $padding_left = $padding['extraLarge']['left'];
+
+    // Compare the padding for all other sizes (large, medium, small)
+    foreach ( ['large', 'medium', 'small'] as $size ) {
+        if (
+            $padding[$size]['top'] !== $padding_top ||
+            $padding[$size]['right'] !== $padding_right ||
+            $padding[$size]['bottom'] !== $padding_bottom ||
+            $padding[$size]['left'] !== $padding_left
+        ) {
+            $same_padding = false;
+            break;
+        }
+    }
+
+    // Prepare the inline style or media queries
+    $style = '';
+
+    // Add background-color to the inline style
+    $style .= sprintf( 'background-color: %s;', esc_attr( $background_color ) );
+
+    if ( $same_padding ) {
+        // If all padding values are the same, use inline style
+        $style .= sprintf(
+            'padding-top: %s; padding-right: %s; padding-bottom: %s; padding-left: %s;',
+            esc_attr( $padding_top ),
+            esc_attr( $padding_right ),
+            esc_attr( $padding_bottom ),
+            esc_attr( $padding_left )
+        );
+    } else {
+        // If padding is different, generate media queries for different sizes
+        $style .= sprintf(
+            '@media (min-width: 1200px) { .%s { padding-top: %s; padding-right: %s; padding-bottom: %s; padding-left: %s; } }',
+            esc_attr( $random_class ),
+            esc_attr( $padding['extraLarge']['top'] ),
+            esc_attr( $padding['extraLarge']['right'] ),
+            esc_attr( $padding['extraLarge']['bottom'] ),
+            esc_attr( $padding['extraLarge']['left'] )
+        );
+
+        $style .= sprintf(
+            '@media (min-width: 1024px) { .%s { padding-top: %s; padding-right: %s; padding-bottom: %s; padding-left: %s; } }',
+            esc_attr( $random_class ),
+            esc_attr( $padding['large']['top'] ),
+            esc_attr( $padding['large']['right'] ),
+            esc_attr( $padding['large']['bottom'] ),
+            esc_attr( $padding['large']['left'] )
+        );
+
+        $style .= sprintf(
+            '@media (min-width: 768px) { .%s { padding-top: %s; padding-right: %s; padding-bottom: %s; padding-left: %s; } }',
+            esc_attr( $random_class ),
+            esc_attr( $padding['medium']['top'] ),
+            esc_attr( $padding['medium']['right'] ),
+            esc_attr( $padding['medium']['bottom'] ),
+            esc_attr( $padding['medium']['left'] )
+        );
+
+        $style .= sprintf(
+            '@media (max-width: 767px) { .%s { padding-top: %s; padding-right: %s; padding-bottom: %s; padding-left: %s; } }',
+            esc_attr( $random_class ),
+            esc_attr( $padding['small']['top'] ),
+            esc_attr( $padding['small']['right'] ),
+            esc_attr( $padding['small']['bottom'] ),
+            esc_attr( $padding['small']['left'] )
+        );
+    }
+
+    // Generate the <style> tag with the final CSS (either inline or media queries)
+    $style_tag = '';
+    if ( ! empty( $style ) ) {
+        $style_tag = sprintf( '<style>.%s { %s }</style>', esc_attr( $random_class ), $style );
+    }
+
+    // Output the content wrapped in the div with the random class and padding styles
+    return $style_tag . sprintf(
+        '<div class="lcp-container %s">%s</div>',
+        esc_attr( $random_class ),
+        $content
+    );
+}
+
+
+/**
+ * Function to return the media query breakpoint based on the size
+ */
+function get_media_query_breakpoint( $size ) {
+    // Define breakpoints for each size
+    $breakpoints = array(
+        'extraLarge' => '1200px',
+        'large' => '1024px',
+        'medium' => '768px',
+        'small' => '480px',
+    );
+
+    return isset( $breakpoints[$size] ) ? $breakpoints[$size] : '480px';
+}
+
+/**
+ * Function to initialize the block
+ */
+function lcp_dynamic_container_block_init() {
+    register_block_type( __DIR__ . '/build', array(
+        'render_callback' => 'render_lcp_dynamic_container', // Add the render callback here
+    ));
+}
+add_action( 'init', 'lcp_dynamic_container_block_init' );