Using color schemes with Color Picker

Question

What I'm doing

User interface to change website colors - User can change colors individually (like menu color, footer color, content color), or use color scheme that will change all colors (values pre-defined by me)

The Problem

$color_menu, $color_footer and $color_content already work individually

I need to set the color_scheme now, I tried this, but didn't work:

<?php $color_menu = get_option('color_menu');  ?>
<?php $color_footer = get_option('color_footer ');  ?>
<?php $color_content = get_option('color_content ');  ?>

    <?php
    if ( get_option( $color_scheme ) == 'blue' ) {
        update_option( $color_menu, '#0D5E84' );
        update_option( $color_footer, '#1461A2' );
        update_option( $color_content, '#132C3F' );
    } elseif ( get_option( $color_scheme ) == 'yellow' ) {
        update_option( $color_menu, '#CCCC00' );
        update_option( $color_footer, '#FFFF33' );
        update_option( $color_content, '#FFFFCC' );
    } elseif ( get_option( $color_scheme ) == 'red' ) {
        update_option( $color_menu, '#CC0000' );
        update_option( $color_footer, '#FF0000' );
        update_option( $color_content, '#CC0033' );
    } else {
        update_option( $color_menu, '#252525' );
        update_option( $color_footer, '#252525' );
        update_option( $color_content, '#FFFFFF' );
    }
    ?>

Image: https://i.stack.imgur.com/Ktm7h.png

Extra problem

Be able to change individual colors while using Color Scheme.

Let's suppose I chose a Yellow color scheme, but would like to set the menu color darker, I should be able to change it while using Yellow color scheme, if possible

Another Point of View

A friend that works with me thought of a different solution for this same problem, and he posted it on Stack Overflow, maybe you would like to see his question.

Easier to do? Better? Worse? What path shoud we go?

Answer 1

Don't save everything as individual options, save all of your options as an array under a single key. One query to load it and save it, then just do all your manipulation in php.

example structure and output:

$colors = array(
    'current_scheme' => 'user_scheme',
    'preset_schemes' => array(
        'red' => array(
            'menu' => '#CC0000',
            'footer' => '#FF0000',
            'content' => '#CC0033'
        )
    ),
    'user_scheme' => array(
        'menu' => 'red',
        'footer' => 'red',
        'content' => '#132C3F' // override with custom color
    )
);
update_option( 'prefix_theme_options', $colors );

foreach( $colors['user_scheme'] as $location => $value ):
    echo $location . ': ';
    if( array_key_exists( $value, $colors['preset_schemes'] ) ):
        echo $colors['preset_schemes'][$value][$location];
    else:
        echo $colors['user_scheme'][$location];
    endif;
    echo '<br>';
endforeach;