<?php
/*
Plugin Name: WCDEN Notification Bar
Plugin URI: https://fixupfox.com/
Description: Display a notification for 
    visitors on the frontend of your site!
Version: 1.0
Author: wolfpaw
Author URI: https://davidwolfpaw.com/
*/

/**
 * Creates a link to the settings page under 
 * the WordPress Settings in the dashboard
 */
add_action( 'admin_menu', 'wnb_general_settings_page' );
function wnb_general_settings_page() {
	add_submenu_page(
		'options-general.php',
		__( 'WCDEN Notifications Bar', 'wc-notifications' ),
		__( 'Notifications Bar', 'wc-notifications' ),
		'manage_options',
		'wc_notifications',
		'wnb_render_settings_page'
	);
}

/**
 * Creates the settings page
 */
function wnb_render_settings_page() {
?>
  <!-- Create a header in the default WordPress 'wrap' container -->
  <div class="wrap">
    <h2><?php esc_html_e( 'WC Notification Bar Settings',
        'wc-notifications' ); ?></h2>
      <form method="post" action="options.php">
        <?php
        // Get settings for the plugin to display in the form
        settings_fields( 'wnb_general_settings' );
        do_settings_sections( 'wnb_general_settings' );
        // Form submit button
        submit_button();
        ?>
      </form>
    </div><!-- /.wrap -->
<?php
}

/**
 * Creates settings for the plugin
 */
add_action( 'admin_init', 'wnb_initialize_settings' );
function wnb_initialize_settings() {
  add_settings_section(
    // ID used to identify this section and with which to register options
    'general_section',
    // Title to be displayed on the administration page
    __( 'General Settings', 'wc-notifications' ),
    // Callback used to render the description of the section
    'general_settings_callback',
    // Page on which to add this section of options
    'wnb_general_settings'
  );
	

/**
 * Displays the header of the general settings
 */
function general_settings_callback() {
	esc_html_e( 'WC Notification Settings', 'wc-notifications' );
}

add_settings_field(
  // ID used to identify this field
  'notification_text',
  // Title to be displayed for this field
  __( 'Notification Text', 'wcmia-notifications' ),
  // The function that creates this field
  'text_input_callback',
  // The page that this setting goes under
  'wnb_general_settings',
  // The section that this setting goes under
  'general_section',
  // Arguments that describe this field
  array(
    'label_for'    => 'notification_text',
    'option_group' => 'wcmia_general_settings',
    'option_id'    => 'notification_text',
    )
);

add_settings_field(
  'display_location',
  __( 'Where will the notification bar display?', 'wc-notifications' ),
  'radio_input_callback',
  'wnb_general_settings',
  'general_section',
  array(
    'label_for'          => 'display_location',
    'option_group'       => 'wcmia_general_settings',
    'option_id'          => 'display_location',
    'option_description' => 'Display notification bar 
      on bottom of the site',
    'radio_options'      => array(
      'display_none'   => 'Do not display notification bar',
      'display_top'    => 'Display notification bar on the 
      top of the site',
      'display_bottom' => 'Display notification bar on the 
      bottom of the site',
    ),
  )
);

  // Register the settings to the field section  
  register_setting(
    'wnb_general_settings',
    'wc_general_settings'
  );
}

/**
 * Displays the notification bar on the frontend of the site
 */
add_action( 'wp_footer', 'wnb_display_notification_bar' );
function wnb_display_notification_bar() {
  if ( null !== get_option( 'wc_general_settings' ) ) {
    $options = get_option( 'wc_general_settings' );
    ?>
    <div class="wcden-notification-bar 
      <?php echo $options['display_location']; ?>">

      <div class="wcden-notification-text">
        <?php echo $options['notification_text']; ?>
      </div>

    </div>
    <?php
  }
}

/**
 * Loads plugin scripts and styles
 */
add_action( 'wp_enqueue_scripts', 'wnb_scripts' );
function wnb_scripts() {
  wp_enqueue_style(
    'wcmia-notification-bar-css',
    plugin_dir_url( __FILE__ ) . 'wcden-notifications.css',
    array(),
    '1.0.0'
  );
}

.wc-notification-bar {
    position: relative;
    width: 100%;
    background: #000;
    color: #FFFFFF;
    text-align: center;
}
.wc-notification-bar.display_top {
    top: 0;
    position: absolute;
}
.wcmia-notification-bar.display_bottom {
    bottom: 0;
    position: relative;
}

.wc-notification-text {
    padding: 10px
}

.admin-bar .wc-notification-bar.display_top {
    top: 46px;
}

add_settings_field(
  'display_sticky',
  __( 'Will the notificaton bar be sticky?', 'wc-notifications' ),
  'radio_input_callback',
  'wnb_general_settings',
  'general_section',
  array(
    'label_for'          => 'display_sticky',
    'option_group'       => 'wc_general_settings',
    'option_id'          => 'display_sticky',
    'option_description' => 'Make display sticky or not',
    'radio_options'      => array(
      'display_sticky'   => 'Make the notification bar sticky',
      'display_relative' => 'Do not make the notification bar sticky',
    ),
  )
);

<div class="wcden-notification-bar
  <?php echo $options['display_location']; ?> 
  <?php echo $options['display_sticky']; ?>">

.wc-notification-bar.display_top.display_sticky {
    position: fixed;
}

.wc-notification-bar.display_bottom.display_sticky {
    bottom: 0;
    position: sticky;
}

// Original Code - Settings Page
<div class="wcmia-notification-bar 
        <?php echo $options['display_location']; ?>
        <?php echo $options['display_sticky']; ?>">
  <div class="wcmia-notification-text">
    <?php echo $options['notification_text']; ?>
</div>


// Updated Code - Customizer
<div class="wcmia-notification-bar 
        <?php echo get_theme_mod( 'display_location' ); ?> 
        <?php echo get_theme_mod( 'display_sticky' ); ?>">
  <div class="wcmia-notification-text">
    <?php echo get_theme_mod( 'notification_text' ); ?>
</div>

add_action( 'customize_register', 'wc_customize_register' );
function wc_customize_register( WP_Customize_Manager $wp_customize ) {
  $wp_customize->add_section(
    'wc_notification_bar',
    array(
      'title' => __( 'Notification Bar', 'wc-notifications' ),
    )
  );
  $wp_customize->add_setting(
    'display_location',
    array(
      'capability' => 'edit_theme_options',
      'default'    => 'display_none',
    )
  );
  $wp_customize->add_control(
    'display_location',
    array(
      'type'        => 'radio',
      'section'     => 'wc_notification_bar',
      'label'       => __( 'Display Location' ),
      'description' => __( 'Choose where the notification bar is displayed' ),
      'choices'     => array(
        'display_none'   => __( 'Do not display notification bar', 'wc-notifications' ),
        'display_top'    => __( 'Display notification bar on the top of the site', 'wc-notifications' ),
        'display_bottom' => __( 'Display notification bar on the bottom of the site', 'wc-notifications' ),
      ),
    )
  );