Remade customizer to extend GeneratePress

.phan/stubs/GeneratePress/class-generate-range-slider-control.php

@@ -0,0 +1,6 @@
+<?php
+
+class Generate_Range_Slider_Control {
+	public function __construct( $manager, $id, $args = [] ) {
+	}
+}

.phan/stubs/GeneratePress/class-generate-typography-customize-control.php

@@ -0,0 +1,6 @@
+<?php
+
+class Generate_Typography_Customize_Control {
+	public function __construct( $manager, $id, $args = [] ) {
+	}
+}

.phan/stubs/GeneratePress/functions.php

@@ -0,0 +1,4 @@
+<?php
+
+function generatepress_is_module_active( $module, $definition ) {
+}

.phan/stubs/WordPress/class-wp-control.php

@@ -0,0 +1,18 @@
+<?php
+
+class WP_Customize_Control {
+	public $json;
+	public $settings;
+
+	public function __construct( $a, $b, $c ) {
+	}
+
+	public function get_link( $a ) {
+	}
+
+	public function to_json() {
+	}
+
+	public function value( $a ) {
+	}
+}

.phan/stubs/WordPress/class-wp-customize-color-control.php

@@ -0,0 +1,6 @@
+<?php
+
+class WP_Customize_Color_Control {
+	public function __construct( $manager, $id, $args = [] ) {
+	}
+}

.phan/stubs/WordPress/class-wp-customize-image-control.php

@@ -0,0 +1,6 @@
+<?php
+
+class WP_Customize_Image_Control {
+	public function __construct( $manager, $id, $args = [] ) {
+	}
+}

.phan/stubs/WordPress/class-wp-customize-manager.php

@@ -0,0 +1,18 @@
+<?php
+
+class WP_Customize_manager {
+	public function add_control( $id, $args = [] ) {
+	}
+
+	public function add_panel( $id, $args = [] ) {
+	}
+
+	public function add_section( $id, $args = [] ) {
+	}
+
+	public function add_setting( $id, $args = [] ) {
+	}
+
+	public function register_control_type( $a ) {
+	}
+}

.phan/stubs/WordPress/functions.php

@@ -5,6 +5,14 @@
  * @package skaut-google-drive-gallery
  */
 
+function __($a, $b) {
+	return '';
+}
+
+function absint( $a ) {
+	return 0;
+}
+
 function add_action( $a, $b, $c = '' ) {
 }
 
@@ -34,6 +42,10 @@ function esc_html__( $a, $b ) {
 	return '';
 }
 
+function esc_url( $a ) {
+	return '';
+}
+
 function get_option( $a, $b ) {
 	switch ( wp_rand( 0, 2 ) ) {
 		case 0:
@@ -85,6 +97,10 @@ function remove_action( $a, $b, $c = '' ) {
 	return false;
 }
 
+function sanitize_text_field( $a ) {
+	return '';
+}
+
 function switch_theme( $a ) {
 }
 
@@ -101,11 +117,27 @@ function trailingslashit( $a ) {
 	return '';
 }
 
+function wp_add_inline_style( $a, $b ) {
+}
+
 function wp_enqueue_script( $a, $b, $c, $d, $e ) {
 }
 
-function wp_enqueue_style( $a, $b, $c, $d ) {
+function wp_enqueue_style( $a, $b = '', $c = [], $d = false ) {
+}
+
+function wp_localize_script( $a, $b, $c ) {
+}
+
+/**
+ * @return array
+ */
+function wp_parse_args( $a, $b ) {
+	return [];
 }
 
 function wp_rand( $a, $b ) {
 }
+
+function wp_register_style( $a, $b, $c, $d ) {
+}

src/js/admin/colors_live_preview.js

@@ -0,0 +1,6 @@
+'use strict';
+
+jQuery( 'document' ).ready( function( $ ) {
+    generatepress_colors_live_update( 'h1_color', 'h1', 'color', '', 'text_color' );
+    generatepress_colors_live_update( 'h2_color', 'h2', 'color', '', 'text_color' );
+});

src/js/admin/preset_customize_control.js

@@ -0,0 +1,45 @@
+import '../../scss/admin/preset_customize_control.scss';
+'use strict';
+
+jQuery( 'document' ).ready( function( $ ) {
+    function flatten( input ) {
+        const ret = {};
+        $.each( input, function( key, value ) {
+            if ( 'object' === typeof ( value ) ) {
+                $.each( value, function( subKey, subValue ) {
+                    ret[key + '[' + subKey + ']'] = subValue;
+                });
+            } else {
+                ret[key] = value;
+            }
+        });
+        return ret;
+    }
+
+    wp.customize.control(
+        'crdm_basic_preset',
+        function( control ) {
+            const presets = [];
+            $.each( crdmbasicPresetCustomizeControlLocalize, function( key, value ) {
+                presets[key] = flatten( value );
+            });
+            control.container.find( 'input[name=crdm_basic_preset]' ).change( function() {
+                control.container.find( '.button' ).prop( 'disabled', false );
+            });
+            control.container.find( '.button' ).on( 'click', function() {
+                const chosen =  control.container.find( 'input[name=crdm_basic_preset]:checked' ).val();
+                if ( ! chosen ) {
+                    console.log( 'FAIL' );
+                    return;
+                }
+                $.each( presets[chosen], function( key, value ) {
+                    const setting = wp.customize( key );
+                    if ( ! setting ) {
+                        return;
+                    }
+                    setting.set( value );
+                });
+            });
+        }
+    );
+});

src/js/admin/typography_live_preview.js

@@ -0,0 +1,22 @@
+'use strict';
+
+jQuery( 'document' ).ready( function( $ ) {
+    generatepress_typography_live_update( 'navigation_font_size', '.main-navigation a, .menu-toggle', 'font-size', 'px', crdmTypographyLivePreview.desktop );
+    generatepress_typography_live_update( 'mobile_navigation_font_size', '.main-navigation:not(.slideout-navigation) a, .menu-toggle', 'font-size', 'px', crdmTypographyLivePreview.mobile );
+    generatepress_typography_live_update( 'navigation_font_weight', '.main-navigation a, .menu-toggle', 'font-weight' );
+    generatepress_typography_live_update( 'navigation_font_transform', '.main-navigation a, .menu-toggle', 'text-transform' );
+
+    generatepress_typography_live_update( 'heading_1_font_size', 'h1', 'font-size', 'px', crdmTypographyLivePreview.desktop );
+    generatepress_typography_live_update( 'mobile_heading_1_font_size', 'h1', 'font-size', 'px', crdmTypographyLivePreview.mobile );
+    generatepress_typography_live_update( 'heading_1_weight', 'h1', 'font-weight' );
+    generatepress_typography_live_update( 'heading_1_transform', 'h1', 'text-transform' );
+    generatepress_typography_live_update( 'heading_1_line_height', 'h1', 'line-height', 'em' );
+    generatepress_typography_live_update( 'heading_1_margin_bottom', 'h1', 'margin-bottom', 'px' );
+
+    generatepress_typography_live_update( 'heading_2_font_size', 'h2', 'font-size', 'px', crdmTypographyLivePreview.desktop );
+    generatepress_typography_live_update( 'mobile_heading_2_font_size', 'h2', 'font-size', 'px', crdmTypographyLivePreview.mobile );
+    generatepress_typography_live_update( 'heading_2_weight', 'h2', 'font-weight' );
+    generatepress_typography_live_update( 'heading_2_transform', 'h2', 'text-transform' );
+    generatepress_typography_live_update( 'heading_2_line_height', 'h2', 'line-height', 'em' );
+    generatepress_typography_live_update( 'heading_2_margin_bottom', 'h2', 'margin-bottom', 'px' );
+});

src/php/CrdmBasic/Customizer/Controls/class-background-image-customize-control.php

@@ -0,0 +1,92 @@
+<?php
+/**
+ * Contains the Background_Image_Customize_Control class.
+ *
+ * @package crdm-basic
+ */
+
+declare(strict_types = 1);
+
+namespace CrdmBasic\Customizer\Controls;
+
+/**
+ * A WP_Customize_Control for background image configuration
+ *
+ * Allows for controlling the repeat, size, attachment and position of a background image.
+ */
+class Background_Image_Customize_Control extends \WP_Customize_Control {
+
+	/**
+	 * Control's type.
+	 *
+	 * @var string
+	 */
+	public $type = 'crdm-basic-background-image';
+
+	/**
+	 * Exports control parameters for JS.
+	 *
+	 * @inheritDoc
+	 */
+	public function to_json() {
+		parent::to_json();
+
+		$this->json['position_description'] = esc_html__( 'left top, x%, y%, xpos ypos (px)', 'crdm-basic' );
+		$this->json['position_placeholder'] = esc_html__( 'Position', 'crdm-basic' );
+
+		foreach ( $this->settings as $key => $id ) {
+			$this->json['settings'][ $key ] = array(
+				'link'  => $this->get_link( $key ),
+				'value' => $this->value( $key ),
+				'id'    => $id->id ?? '',
+			);
+		}
+
+		$this->json['repeat_choices']     = array(
+			''          => esc_html__( 'Repeat', 'crdm-basic' ),
+			'repeat-x'  => esc_html__( 'Repeat x', 'crdm-basic' ),
+			'repeat-y'  => esc_html__( 'Repeat y', 'crdm-basic' ),
+			'no-repeat' => esc_html__( 'No Repeat', 'crdm-basic' ),
+		);
+		$this->json['size_choices']       = array(
+			''        => esc_html__( 'Size (Auto)', 'crdm-basic' ),
+			'100'     => esc_html__( '100% Width', 'crdm-basic' ),
+			'cover'   => esc_html__( 'Cover', 'crdm-basic' ),
+			'contain' => esc_html__( 'Contain', 'crdm-basic' ),
+		);
+		$this->json['attachment_choices'] = array(
+			''        => esc_html__( 'Attachment', 'crdm-basic' ),
+			'fixed'   => esc_html__( 'Fixed', 'crdm-basic' ),
+			'local'   => esc_html__( 'Local', 'crdm-basic' ),
+			'inherit' => esc_html__( 'Inherit', 'crdm-basic' ),
+		);
+	}
+
+	/**
+	 * Prints the Underscore.js template for the control.
+	 *
+	 * @inheritDoc
+	 */
+	public function content_template() {
+		?>
+<# _.each( [ [ data.settings.repeat, data.repeat_choices ], [ data.settings.size, data.size_choices ], [ data.settings.attachment, data.attachment_choices] ], function( tuple ) {
+	if ( tuple[0] ) { #>
+		<label>
+			<select {{{ tuple[0].link }}}>
+				<# _.each( tuple[1], function( label, choice ) { #>
+					<option value="{{{ choice }}}" <# if ( choice === tuple[0].value ) { #> selected="selected" <# } #>>{{{ label }}}</option>
+				<# } ) #>
+			</select>
+		</label>
+	<# }
+} ); #>
+
+<# if ( data.settings.position ) { #>
+	<label>
+		<input name="{{{ data.settings.position.id }}}" type="text" {{{ data.settings.position.link }}} value="{{{ data.settings.position.value }}}" placeholder="{{{ data.position_placeholder }}}" />
+			<p class="description">{{{ data.position_description }}}</p>
+	</label>
+<# } #>
+		<?php
+	}
+}