From 7e6c23a13f9faa99da9905d2767014ba7d9bbb4a Mon Sep 17 00:00:00 2001 From: Alexei Samarschi Date: Tue, 25 Oct 2022 17:10:25 +0300 Subject: [PATCH] Make it work with css for now --- .gitignore | 13 +++++ assets/js/wpzoom-style-switcher-values.js | 6 --- assets/js/wpzoom-style-switcher.js | 20 +++++-- assets/variations/bitter.css | 6 +++ assets/variations/default.css | 0 assets/variations/epilogue.css | 0 assets/variations/montserrat.css | 0 assets/variations/poppins.css | 0 assets/variations/yeseva-one.css | 3 ++ wpzoom-style-switcher.php | 66 ++++++++++++++--------- 10 files changed, 77 insertions(+), 37 deletions(-) create mode 100644 .gitignore delete mode 100644 assets/js/wpzoom-style-switcher-values.js create mode 100644 assets/variations/bitter.css create mode 100644 assets/variations/default.css create mode 100644 assets/variations/epilogue.css create mode 100644 assets/variations/montserrat.css create mode 100644 assets/variations/poppins.css create mode 100644 assets/variations/yeseva-one.css diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..451c746 --- /dev/null +++ b/.gitignore @@ -0,0 +1,13 @@ +.DS_Store +phpcs.xml +phpunit.xml +Thumbs.db +wp-cli.local.yml +node_modules/ +*.sql +*.tar.gz +*.zip +*.map +.sass-cache + +/vendor/ diff --git a/assets/js/wpzoom-style-switcher-values.js b/assets/js/wpzoom-style-switcher-values.js deleted file mode 100644 index 0ea263f..0000000 --- a/assets/js/wpzoom-style-switcher-values.js +++ /dev/null @@ -1,6 +0,0 @@ -// wrapped into IIFE - to leave global space clean. -( function( window, wp ){ - - //console.log( window ); - -})( window, wp ); \ No newline at end of file diff --git a/assets/js/wpzoom-style-switcher.js b/assets/js/wpzoom-style-switcher.js index 23c5dd2..8d2f021 100644 --- a/assets/js/wpzoom-style-switcher.js +++ b/assets/js/wpzoom-style-switcher.js @@ -4,10 +4,20 @@ $(function () { - $("#panel a").click(function(e){ +$( "#panel a" ).on( 'click', function(e){ e.preventDefault(); - $('#panel').find('a.active').removeClass("active"); + + $('#panel').find('a.active').removeClass("active"); $(this).addClass("active"); + $('#wpzoom-theme-css').remove(); + + var href = $(this).attr('href'); + var link_stylesheet = ''; + + $('head').append( link_stylesheet ); + + //console.log( link_stylesheet ); + //return false; }); }); @@ -18,7 +28,7 @@ $(function () { jQuery(document).ready(function(){ jQuery(".wpzoom-style-picker").fadeIn(); - jQuery(".wpzoom-style-picker .close-button").bind("click", function(e){ + jQuery(".wpzoom-style-picker .close-button").on("click", function(e){ jQuery(".wpzoom-style-picker").toggleClass("closed"); e.preventDefault(); }); @@ -38,7 +48,7 @@ jQuery(document).ready(function(){ }); }); - jQuery('label[id^="wpzoom-style-picker-"]').bind( "click" , function(e){ + jQuery('label[id^="wpzoom-style-picker-"]').on( "click" , function(e){ var $inputid = "#" + jQuery(this).attr( 'data-input' ); var $input = jQuery( $inputid ); @@ -66,7 +76,7 @@ jQuery(document).ready(function(){ jQuery(this).data("old", jQuery(this).val() ); }); - jQuery('[name^="wpzoom-style-picker-"]').bind( "change" , function(e){ + jQuery('[name^="wpzoom-style-picker-"]').on( "change" , function(e){ jQuery(this).data("new", jQuery(this).val()); var $selector = jQuery(this).attr("data-selector"); diff --git a/assets/variations/bitter.css b/assets/variations/bitter.css new file mode 100644 index 0000000..d17a443 --- /dev/null +++ b/assets/variations/bitter.css @@ -0,0 +1,6 @@ +:root { + --wp--preset--color--primary:#D80032; +} +.wp-block-button__link { + background-color: red; +} \ No newline at end of file diff --git a/assets/variations/default.css b/assets/variations/default.css new file mode 100644 index 0000000..e69de29 diff --git a/assets/variations/epilogue.css b/assets/variations/epilogue.css new file mode 100644 index 0000000..e69de29 diff --git a/assets/variations/montserrat.css b/assets/variations/montserrat.css new file mode 100644 index 0000000..e69de29 diff --git a/assets/variations/poppins.css b/assets/variations/poppins.css new file mode 100644 index 0000000..e69de29 diff --git a/assets/variations/yeseva-one.css b/assets/variations/yeseva-one.css new file mode 100644 index 0000000..ddc140e --- /dev/null +++ b/assets/variations/yeseva-one.css @@ -0,0 +1,3 @@ +:root { + --wp--preset--color--primary:#40916C; +} \ No newline at end of file diff --git a/wpzoom-style-switcher.php b/wpzoom-style-switcher.php index 0b343af..de0fc03 100644 --- a/wpzoom-style-switcher.php +++ b/wpzoom-style-switcher.php @@ -65,7 +65,7 @@ public static function instance() { */ public function __construct() { - add_action( 'wp_head', array( $this, 'output_css' ) ); + //add_action( 'wp_head', array( $this, 'output_css' ) ); add_action( 'wp_footer', array( $this, 'output_switcher' ) ); @@ -76,7 +76,42 @@ public function __construct() { public function output_switcher() { - $styles = WP_Theme_JSON_Resolver::get_style_variations(); + //$styles = WP_Theme_JSON_Resolver::get_style_variations(); + + $style_directory = WPZOOM_STYLE_SWITCHER_URL . 'assets/variations/'; + + $styles = array( + array( + 'title' => 'Default', + 'css' => $style_directory . 'default.css', + 'color' => '#fff' + ), + array( + 'title' => 'Bitter', + 'css' => $style_directory . 'bitter.css', + 'color' => '#D80032' + ), + array( + 'title' => 'Epilogue', + 'css' => $style_directory . 'epilogue.css', + 'color' => '#FFD100' + ), + array( + 'title' => 'Montserrat', + 'css' => $style_directory . 'montserrat.css', + 'color' => '#5A13F1' + ), + array( + 'title' => 'Poppins', + 'css' => $style_directory . 'poppins.css', + 'color' => '#FF9505' + ), + array( + 'title' => 'Yeseva One', + 'css' => $style_directory . 'yeseva-one.css', + 'color' => '#40916C' + ) + ); if( empty( $styles ) ) { return; @@ -88,11 +123,10 @@ public function output_switcher() {