WordPress.org
Get WordPress

Plugin Directory

Changeset 2999436 for cookiehub


Ignore:
Timestamp:
11/21/2023 09:16:50 AM (2 years ago)
Author:
cookiehub
Message:

Updated admin user interface

Location:
cookiehub/trunk
Files:
15 added
6 edited

Legend:

Unmodified
Added
Removed

  • cookiehub/trunk/changelog.txt

    r2938538 r2999436  
    11=== CookieHub ===
     2
     3= 1.0.0 =
     4*Release Date - 21 November 2023*
     5
     6Updated admin user interface
    27
    38= 0.4.0 =

  • cookiehub/trunk/cookiehub.php

    r2938538 r2999436  
    1414require_once plugin_dir_path(__FILE__) . 'includes/ch-admin.php';
    1515require_once plugin_dir_path(__FILE__) . 'includes/ch-generate.php';
     16require_once plugin_dir_path(__FILE__) . 'includes/ch-register-domain.php';
     17require_once plugin_dir_path(__FILE__) . 'includes/ch-settings.php';
     18require_once plugin_dir_path(__FILE__) . 'includes/ch-sidebar.php';
     19require_once plugin_dir_path(__FILE__) . 'includes/ch-toolbar.php';
     20require_once plugin_dir_path(__FILE__) . 'includes/ch-api.php';

  • cookiehub/trunk/includes/ch-admin.php

    r2938538 r2999436  
    11<?php
    2 class DCCHUBSettingsPage
     2class DCCHUBAdmin
    33{
    44    /**
    … …  
    1414        add_action( 'admin_menu', array( $this, 'dcchub_add_plugin_page' ) );
    1515        add_action( 'admin_init', array( $this, 'dcchub_page_init' ) );
     16
    1617    }
    17 
    1818    /**
    1919     * Add options page
    … …  
    2727            'manage_options',
    2828            'my-setting-admin',
    29             array( $this, 'dcchub_create_admin_page' )
     29            array( $this, 'dcchub_display_pages' )
    3030        );
    3131    }
    3232   
    33     /**
    34      * Options page callback
    35      */
    36     public function dcchub_create_admin_page()
    37     {
     33    public function dcchub_display_pages() {
    3834        // Set class property
    39         $this->options = get_option( 'dcchub_option_name' );
    40         ?>
    41         <div class="wrap dcchub-admin">
    42             <img class="dcchub-logo" src="https://dash.cookiehub.com/images/cookiehub.svg" />
    43             <div class="dcchub-wrap">
    44                 <form method="post" action="options.php">
    45                 <?php
    46                     // This prints out all hidden setting fields
    47                     settings_fields( 'dcchub_option_group' );
    48                     do_settings_sections( 'dcchub-setting-admin' );                   
    49                 ?>
    50                 <h3>Integration</h3>
    51                 <p style="max-width: 700px">CookieHub will conditionally load 3rd party javascript code when configured correctly. Refer to the <a href="https://support.cookiehub.com/article/73-how-to-implement-cookiehub" target="_blank">Integration documentation</a> for further details.</p>
    52                 <p style="max-width: 700px">Below you can paste javascript tags that should be conditionally loaded based on the user's cookie choices. The CookieHub Wordpress plugin will automatically modify your scripts to using the delay inline javascripts method as described in the <a href="https://support.cookiehub.com/article/73-how-to-implement-cookiehub" target="_blank">documentation</a>. Please make sure the &lt;script&gt; tags are included.</p>
    53                 <p style="max-width: 700px">The tabs represent each cookie category offered by CookieHub and you can choose to either include the script in the &lt;head&gt; tag or at the end of the &lt;body&gt; tag.</p>
     35        $this->options = get_option('dcchub_option_name');
    5436
    55                 <ul class="dcchub-tab-buttons">
    56                     <li class="active" data-tab="#dcchub_analytics">Analytics</li>
    57                     <li data-tab="#dcchub_marketing">Marketing</li>
    58                     <li data-tab="#dcchub_preferences">Preference</li>
    59                     <li data-tab="#dcchub_others">Others</li>
    60                 </ul>
    61                 <ul class="dcchub-tabs-content">
    62                     <li id="dcchub_analytics" class="active">
    63                     <?php do_settings_sections( 'dcchub-setting-admin-analytics' ); ?>
    64                     </li>
    65                     <li id="dcchub_marketing">
    66                     <?php do_settings_sections( 'dcchub-setting-admin-marketing' ); ?>
    67                     </li>
    68                     <li id="dcchub_preferences">
    69                     <?php do_settings_sections( 'dcchub-setting-admin-preferences' ); ?>
    70                     </li>
    71                     <li id="dcchub_others">
    72                     <?php do_settings_sections( 'dcchub-setting-admin-other' ); ?>
    73                     </li>
    74                 </ul>
    75                 <?php
    76                     submit_button();
    77                 ?>
    78                 </form>
    79             </div>
    80         </div>
    81         <?php
     37        // Display the toolbar
     38        DCCHUBToolbar::toolbar();
     39
     40        if (isset( $this->options['dcchub_api_key'] )) {
     41            DCCHUBSettings::dcchub_register_page_html($this->options);
     42        }
     43        else {
     44            DCCHUBRegisterDomain::dcchub_register_page_html();
     45        }
    8246    }
    8347
    … …  
    8751    public function dcchub_page_init()
    8852    {   
    89         register_setting(
    90             'dcchub_option_group', // Option group
    91             'dcchub_option_name', // Option name
    92             array( $this, 'dcchub_sanitize' ) // Sanitize
    93         );
    94 
    95         add_settings_section(
    96             'dcchub_settings', // ID
    97             'General Settings', // Title
    98             array( $this, 'dcchub_print_section_info' ), // Callback
    99             'dcchub-setting-admin' // Page
    100         ); 
    101 
    102         add_settings_field(
    103             'dcchub_api_key', // ID
    104             'Code', // Title
    105             array( $this, 'dcchub_api_key_callback' ), // Callback
    106             'dcchub-setting-admin', // Page
    107             'dcchub_settings' // Section           
    108         );     
    109        
    110         add_settings_field(
    111             'dcchub_blocking', // ID
    112             'Automatic cookie blocking', // Title
    113             array( $this, 'dcchub_blocking_callback' ), // Callback
    114             'dcchub-setting-admin', // Page
    115             'dcchub_settings' // Section           
    116         );   
    117        
    118         add_settings_field(
    119             'dcchub_gcm', // ID
    120             'Google Consent Mode', // Title
    121             array( $this, 'dcchub_gcm_callback' ), // Callback
    122             'dcchub-setting-admin', // Page
    123             'dcchub_settings' // Section           
    124         );   
    125        
    126         add_settings_field(
    127             'dcchub_dev', // ID
    128             'Development mode', // Title
    129             array( $this, 'dcchub_dev_callback' ), // Callback
    130             'dcchub-setting-admin', // Page
    131             'dcchub_settings' // Section           
    132         );   
    133 
    134         add_settings_field(
    135             'dcchub_language', // ID
    136             'Use language setting from Wordpress or WPML', // Title
    137             array( $this, 'dcchub_language_callback' ), // Callback
    138             'dcchub-setting-admin', // Page
    139             'dcchub_settings' // Section           
    140         );   
    141 
    142         add_settings_section(
    143             'dcchub_settings_analytics', // ID
    144             '', // Title
    145             '', // Callback
    146             'dcchub-setting-admin-analytics' // Page
    147         ); 
    148 
    149         add_settings_field(
    150             'dcchub_analytics_head', // ID
    151             'Head', // Title
    152             array( $this, 'dcchub_analytics_head_callback' ), // Callback
    153             'dcchub-setting-admin-analytics', // Page
    154             'dcchub_settings_analytics' // Section           
    155         );
    156        
    157         add_settings_field(
    158             'dcchub_analytics_body', // ID
    159             'Body', // Title
    160             array( $this, 'dcchub_analytics_body_callback' ), // Callback
    161             'dcchub-setting-admin-analytics', // Page
    162             'dcchub_settings_analytics' // Section           
    163         );
    164 
    165        
    166         add_settings_section(
    167             'dcchub_settings_marketing', // ID
    168             '', // Title
    169             '', // Callback
    170             'dcchub-setting-admin-marketing' // Page
    171         ); 
    172 
    173         add_settings_field(
    174             'dcchub_marketing_head', // ID
    175             'Head', // Title
    176             array( $this, 'dcchub_marketing_head_callback' ), // Callback
    177             'dcchub-setting-admin-marketing', // Page
    178             'dcchub_settings_marketing' // Section           
    179         );
    180        
    181         add_settings_field(
    182             'dcchub_marketing_body', // ID
    183             'Body', // Title
    184             array( $this, 'dcchub_marketing_body_callback' ), // Callback
    185             'dcchub-setting-admin-marketing', // Page
    186             'dcchub_settings_marketing' // Section           
    187         );
    188 
    189         add_settings_section(
    190             'dcchub_settings_preferences', // ID
    191             '', // Title
    192             '', // Callback
    193             'dcchub-setting-admin-preferences' // Page
    194         ); 
    195 
    196         add_settings_field(
    197             'dcchub_preferences_head', // ID
    198             'Head', // Title
    199             array( $this, 'dcchub_preferences_head_callback' ), // Callback
    200             'dcchub-setting-admin-preferences', // Page
    201             'dcchub_settings_preferences' // Section           
    202         );
    203        
    204         add_settings_field(
    205             'dcchub_preferences_body', // ID
    206             'Body', // Title
    207             array( $this, 'dcchub_preferences_body_callback' ), // Callback
    208             'dcchub-setting-admin-preferences', // Page
    209             'dcchub_settings_preferences' // Section           
    210         );
    211 
    212         add_settings_section(
    213             'dcchub_settings_other', // ID
    214             '', // Title
    215             '', // Callback
    216             'dcchub-setting-admin-other' // Page
    217         ); 
    218 
    219         add_settings_field(
    220             'dcchub_other_head', // ID
    221             'Head', // Title
    222             array( $this, 'dcchub_other_head_callback' ), // Callback
    223             'dcchub-setting-admin-other', // Page
    224             'dcchub_settings_other' // Section           
    225         );
    226        
    227         add_settings_field(
    228             'dcchub_other_body', // ID
    229             'Body', // Title
    230             array( $this, 'dcchub_other_body_callback' ), // Callback
    231             'dcchub-setting-admin-other', // Page
    232             'dcchub_settings_other' // Section           
    233         );
    234        
    23553        wp_register_style( 'dcchub_style', plugins_url( '/css/dcchub-admin.css?0.1', __FILE__ ));
    23654        wp_enqueue_style('dcchub_style');     
    23755        wp_register_script( 'dcchub_test', plugins_url( '/js/dcchub-test.js', __FILE__ ),  array ('jquery') ,'', false);
    23856        wp_enqueue_script('dcchub_test');
    239     }
     57        wp_localize_script('my-script', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php')));
    24058
    241     public function dcchub_print_section_info()
    242     {
    243         echo '<p>Before enabling the CookieHub plugin on your web site, create an account and your domain on <a href="https://www.cookiehub.com" target="_blank">cookiehub.com</a>.</p>';
    244     }
    245 
    246     /**
    247      * Sanitize each setting field as needed
    248      *
    249      * @param array $input Contains all settings fields as array keys
    250      */
    251     public function dcchub_sanitize( $input )
    252     {
    253         $new_input = array();
    254         if( isset( $input['dcchub_api_key']))
    255             $new_input['dcchub_api_key'] =  $input['dcchub_api_key'] ;
    256        
    257         if( isset( $input['dcchub_blocking']))
    258             $new_input['dcchub_blocking'] = $input['dcchub_blocking'];
    259        
    260         if( isset( $input['dcchub_gcm']))
    261             $new_input['dcchub_gcm'] = $input['dcchub_gcm'];
    262        
    263         if( isset( $input['dcchub_dev']))
    264             $new_input['dcchub_dev'] = $input['dcchub_dev'];
    265        
    266             if( isset( $input['dcchub_language']))
    267             $new_input['dcchub_language'] = $input['dcchub_language'];
    268 
    269         if( isset( $input['dcchub_analytics_head']))
    270             $new_input['dcchub_analytics_head'] = $input['dcchub_analytics_head'];
    271         if( isset( $input['dcchub_analytics_body']))
    272             $new_input['dcchub_analytics_body'] = $input['dcchub_analytics_body'];
    273 
    274         if( isset( $input['dcchub_marketing_head']))
    275             $new_input['dcchub_marketing_head'] = $input['dcchub_marketing_head'];
    276         if( isset( $input['dcchub_marketing_body']))
    277             $new_input['dcchub_marketing_body'] = $input['dcchub_marketing_body'];
    278        
    279         if( isset( $input['dcchub_preferences_head']))
    280             $new_input['dcchub_preferences_head'] = $input['dcchub_preferences_head'];
    281         if( isset( $input['dcchub_preferences_body']))
    282             $new_input['dcchub_preferences_body'] = $input['dcchub_preferences_body'];
    283        
    284         if( isset( $input['dcchub_other_head']))
    285             $new_input['dcchub_other_head'] = $input['dcchub_other_head'];
    286         if( isset( $input['dcchub_other_body']))
    287             $new_input['dcchub_other_body'] = $input['dcchub_other_body'];
    288 
    289         return $new_input;
    290     }
    291 
    292     /**
    293      * Get the settings option array and print one of its values
    294      */
    295     public function dcchub_api_key_callback()
    296     {
    297         printf(
    298             '<input type="text" id="dcchub_api_key" name="dcchub_option_name[dcchub_api_key]" value="%s" />',
    299             isset( $this->options['dcchub_api_key'] ) ? esc_attr( $this->options['dcchub_api_key']) : ''
    300         );
    301 
    302         printf('<p style="max-width:500px">Use the 8 character domain code that you can find in the CookieHub dashboard for your domain.</p>');
    303     }
    304 
    305     public function dcchub_dev_callback()
    306     {
    307         printf(
    308             '<input type="checkbox" id="dev" name="dcchub_option_name[dcchub_dev]" value="1" '. checked( 1, $this->options['dcchub_dev'], false ) .' /> <p style="max-width:500px">Enabling development mode will avoid edge caching and can be used to see changes made to your domain in the CookieHub dashboard quickly. Please note that a watermark will be shown on your web site. Make sure you disable development mode before publishing your site.</p>'           
    309         );
    310     }
    311    
    312     public function dcchub_blocking_callback()
    313     {
    314         printf(
    315             '<input type="checkbox" id="dcchub_blocking" name="dcchub_option_name[dcchub_blocking]" value="1" '. checked( 1, $this->options['dcchub_blocking'], false ) .' /> <p style="max-width:500px">Automatically block common services that set cookies until the user has consented making it easier to implement CookieHub to your website. Please note that you must also enable the feature in the CookieHub dashboard.</p>'           
    316         );
    317     }
    318 
    319     public function dcchub_gcm_callback()
    320     {
    321         printf(
    322             '<input type="checkbox" id="gcm" name="dcchub_option_name[dcchub_gcm]" value="1" '. checked( 1, $this->options['dcchub_gcm'], false ) .' /> <p style="max-width:500px">When Google Consent Mode (GCM) is enabled, Google Analytics and Google Ads won\'t set any cookies until the user has consented without any modifications to the integration codes.</p>'           
    323         );
    324     }
    325    
    326     public function dcchub_language_callback()
    327     {
    328         printf(
    329             '<input type="checkbox" id="language" name="dcchub_option_name[dcchub_language]" value="1" '. checked( 1, $this->options['dcchub_language'], false ) .' /> <p style="max-width:500px">When this feature is enabled, the CookieHub display language will match your web sites language either by using the configured language (in Settings -> General) or the language configured by the WPML or Polylang plugins. Please note that you will have to enable all languages supported by your web site in the CookieHub dashboard.</p>'           
    330         );
    331     }
    332 
    333     public function dcchub_necessary_body_callback()
    334     {
    335         printf(
    336             '<textarea id="dcchub_necessary_body" class="dcchub_script" name="dcchub_option_name[dcchub_necessary_body]">%s</textarea>',
    337             isset( $this->options['dcchub_necessary_body'] ) ? esc_textarea( $this->options['dcchub_necessary_body']) : ''
    338         );
    339     }
    340    
    341     public function dcchub_analytics_head_callback()
    342     {
    343         printf(
    344             '<textarea id="dcchub_analytics_head" class="dcchub_script" name="dcchub_option_name[dcchub_analytics_head]">%s</textarea>',
    345             isset( $this->options['dcchub_analytics_head'] ) ? esc_textarea( $this->options['dcchub_analytics_head']) : ''
    346         );
    347     }
    348 
    349     public function dcchub_analytics_body_callback()
    350     {
    351         printf(
    352             '<textarea id="dcchub_analytics_body" class="dcchub_script" name="dcchub_option_name[dcchub_analytics_body]">%s</textarea>',
    353             isset( $this->options['dcchub_analytics_body'] ) ? esc_textarea( $this->options['dcchub_analytics_body']) : ''
    354         );
    355     }
    356 
    357     public function dcchub_marketing_head_callback()
    358     {
    359         printf(
    360             '<textarea id="dcchub_marketing_head" class="dcchub_script" name="dcchub_option_name[dcchub_marketing_head]">%s</textarea>',
    361             isset( $this->options['dcchub_marketing_head'] ) ? esc_textarea( $this->options['dcchub_marketing_head']) : ''
    362         );
    363     }
    364 
    365     public function dcchub_marketing_body_callback()
    366     {
    367         printf(
    368             '<textarea id="dcchub_marketing_body" class="dcchub_script" name="dcchub_option_name[dcchub_marketing_body]">%s</textarea>',
    369             isset( $this->options['dcchub_marketing_body'] ) ? esc_textarea( $this->options['dcchub_marketing_body']) : ''
    370         );
    371     }
    372 
    373     public function dcchub_preferences_head_callback()
    374     {
    375         printf(
    376             '<textarea id="dcchub_preferences_head" class="dcchub_script" name="dcchub_option_name[dcchub_preferences_head]">%s</textarea>',
    377             isset( $this->options['dcchub_preferences_head'] ) ? esc_textarea( $this->options['dcchub_preferences_head']) : ''
    378         );
    379     }
    380 
    381     public function dcchub_preferences_body_callback()
    382     {
    383         printf(
    384             '<textarea id="dcchub_preferences_body" class="dcchub_script" name="dcchub_option_name[dcchub_preferences_body]">%s</textarea>',
    385             isset( $this->options['dcchub_preferences_body'] ) ? esc_textarea( $this->options['dcchub_preferences_body']) : ''
    386         );
    387     }
    388 
    389     public function dcchub_other_head_callback()
    390     {
    391         printf(
    392             '<textarea id="dcchub_other_head" class="dcchub_script" name="dcchub_option_name[dcchub_other_head]">%s</textarea>',
    393             isset( $this->options['dcchub_other_head'] ) ? esc_textarea( $this->options['dcchub_other_head']) : ''
    394         );
    395     }
    396 
    397     public function dcchub_other_body_callback()
    398     {
    399         printf(
    400             '<textarea id="dcchub_other_body" class="dcchub_script" name="dcchub_option_name[dcchub_other_body]">%s</textarea>',
    401             isset( $this->options['dcchub_other_body'] ) ? esc_textarea( $this->options['dcchub_other_body']) : ''
    402         );
    40359    }
    40460}
    … …  
    40662if( is_admin() )
    40763{   
    408     $dcchub_settings_page = new DCCHUBSettingsPage();
     64    $dcchub_admin = new DCCHUBAdmin();
    40965}

  • cookiehub/trunk/includes/css/dcchub-admin.css

    r2674340 r2999436  
    1 .dcchub-logo
    2 {
    3     height: 80px;
    4     margin: 20px 10px;
    5 }
    6 
    7 .dcchub-wrap
    8 {
     1@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;900&display=swap');
     2
     3.settings_page_my-setting-admin #wpcontent {
     4    padding-left: 0;
     5}
     6
     7.dcchub-logo {
     8    width: 145px;
     9}
     10
     11.dcchub-wrap {
     12    padding: 23px;
     13    margin: 30px 0px;
     14}
     15
     16.dcchub-wrap.dcchub-box {
     17    border-radius: 5px;
     18    border: 1px solid #C3C4C7;
     19    background: #FFF;
     20    position: relative;
     21    width: 600px;
     22    box-sizing: border-box;
     23}
     24
     25@media only screen and (max-width: 600px) {
     26    .dcchub-wrap.dcchub-box {
     27        border-radius: 5px;
     28        border: 1px solid #C3C4C7;
     29        background: #FFF;
     30        position: relative;
     31        width: 100%;
     32        box-sizing: border-box;
     33    }
     34}
     35
     36.dcchub-wrap.dcchub-box.wide {
     37    width: 80%;
     38    max-width: 854px;
     39}
     40
     41.dcchub-wrap.dcchub-box.side {
     42    width: 100%;
     43}
     44
     45.dcchub-register-domain {
     46    margin-left: 26px;
     47}
     48
     49.dcchub-wrap>*:last-child,
     50.dcchub-wrap>*:last-child>*:last-child {
     51    margin-bottom: 0;
     52}
     53
     54.dcchub_script {
     55    width: 100%;
     56    height: 117px;
     57    flex-shrink: 0;
     58    border-radius: 5px;
     59    border: 1px solid #CECECE;
     60    background: #FAFAFA;
     61}
     62
     63.dcchub-tab-buttons {
     64    display: flex;
     65    justify-content: flex-start;
     66}
     67
     68.dcchub-tab-buttons>li {
     69    border: 1px solid #C3C4C7;
     70    cursor: pointer;
     71    padding: 8px 12px;
     72    margin: 0px 0px 0px 8px;
     73    color: #000;
     74    background: rgb(232, 233, 237);
     75    font-family: 'Roboto', sans-serif;
     76    font-size: 14px;
     77    font-style: normal;
     78    font-weight: 500;
     79}
     80
     81.dcchub-tab-buttons>li.active {
     82    background: rgb(255, 255, 255);
     83    color: rgba(0, 0, 0, 0.5);
     84    border: 1px solid #C3C4C7;
     85    border-width: 1px 1px 0 1px;
     86}
     87
     88.dcchub-tabs-content {
     89    padding: 28px 44px 53px 40px;
     90}
     91
     92.dcchub-tabs-content li {
     93    display: none;
     94}
     95
     96.dcchub-tabs-content li.active {
     97    display: block;
     98}
     99
     100.dcchub-toolbar {
    9101    background: #fff;
    10     padding:10px;
    11     margin: 10px 0;
    12 }
    13 
    14 .dcchub-wrap > *:first-child ,
    15 .dcchub-wrap > *:first-child > *:first-child {
     102    height: 50px;
     103    padding: 0px 30px 0px 15px;
     104    display: flex;
     105    align-items: center;
     106}
     107
     108.dcchub-toolbar-link {
     109    color: rgba(0, 0, 0, 0.80);
     110    font-family: 'Roboto', sans-serif;
     111    font-size: 15px;
     112    font-style: normal;
     113    font-weight: 500;
     114    text-decoration: none;
     115    padding: 15px 0px;
     116    line-height: 20px;
     117}
     118
     119.dcchub-horizontal {
     120    display: flex;
     121    align-items: center;
     122}
     123
     124.dcchub-header {
     125    color: #000;
     126    font-family: 'Roboto', sans-serif;
     127    font-size: 22px;
     128    font-style: normal;
     129    font-weight: 500;
     130    line-height: 130%;
    16131    margin-top: 0;
    17132    padding-top: 0;
    18 }
    19 
    20 .dcchub-wrap > *:last-child,
    21 .dcchub-wrap > *:last-child > *:last-child {
    22133    margin-bottom: 0;
    23     padding-bottom: 0;
    24 }
    25 
    26 .dcchub-tab-buttons
    27 {
     134}
     135
     136.dcchub-header.small {
     137    font-size: 20px;
     138    font-style: normal;
     139    font-weight: 400;
     140    line-height: 150%;
     141}
     142
     143.dcchub-header.page-header {
     144    font-size: 24px;
     145    margin: 40px 30px;
     146}
     147
     148.dcchub-separator {
     149    height: 1px;
     150    background: #C3C4C780;
     151    margin: 18px 0px 20px 0px;
     152}
     153
     154.dcchub-p {
     155    color: #000;
     156    font-family: 'Roboto', sans-serif;
     157    font-size: 16px;
     158    font-style: normal;
     159    font-weight: 400;
     160    line-height: 130%;
     161    /* 20.8px */
     162}
     163
     164.dcchub-hint {
     165    color: #37373b80;
     166    font-family: 'Roboto', sans-serif;
     167    font-size: 15px;
     168    font-style: normal;
     169    font-weight: 400;
     170    text-decoration-line: underline;
     171    margin-top: 19px;
     172    display: inline-block;
     173}
     174
     175.dcchub-hint.center {
     176    margin-top: 0px;
     177}
     178
     179.dcchub-input-box {
     180    height: 44px;
     181}
     182
     183.dcchub-input-box.wide {
     184    height: 44px;
     185    width: 366px;
     186}
     187
     188.dcchub-flex {
    28189    display: flex;
    29     justify-content: flex-start;
    30 }
    31 
    32 .dcchub-tab-buttons > li
    33 {
    34     border: 1px solid #ccc;
    35     border-radius: 5px 5px 0px 0px;
    36     cursor: pointer;
    37     padding:3px 5px;
    38 }
    39 
    40 .dcchub-tab-buttons > li.active
    41 {
    42     background: rgba(207, 31, 37, 1);
    43     border-color: rgba(207, 31, 37, 1);
     190    flex-wrap: wrap;
     191    margin: 0px 26px;
     192}
     193
     194.dcchub-content {
     195    flex-grow: 1;
     196    box-sizing: border-box;
     197}
     198
     199.dcchub-sidebar {
     200    width: 550px;
     201    margin-top: 23px;
     202    margin-right: 40px;
     203}
     204
     205.dcchub-bullet-links {
     206    color: #000;
     207    font-family: 'Roboto', sans-serif;
     208    font-size: 16px;
     209    font-style: normal;
     210    font-weight: 400;
     211    line-height: 130%;
     212    /* 20.8px */
     213    text-decoration-line: underline;
     214}
     215
     216.dcchub-promotion-banner {
     217    display: flex;
     218    width: 854px;
     219    height: 323px;
     220    border-radius: 10px;
     221    border: 0px solid #E51E25;
     222    background: linear-gradient(262deg, rgba(95, 0, 0, 0.20) 2.16%, rgba(0, 0, 0, 0.00) 81.02%), #E51E25;
     223}
     224
     225.dcchub-promotion-banner-content {
     226    padding: 34px 40px 40px 35px;
     227    flex-grow: 1;
     228    flex-direction: column;
     229}
     230
     231.dcchub-promotion-banner-header {
     232    color: #FFF;
     233    font-family: 'Roboto', sans-serif;
     234    font-size: 44px;
     235    font-style: normal;
     236    font-weight: 900;
     237    line-height: 44px;
     238    margin: 0px;
     239}
     240
     241/* Hide the default checkbox */
     242.dcchub-checkbox input {
     243    display: none;
     244}
     245
     246.dcchub-checkbox label {
     247    position: relative;
     248    padding-left: 45px;
     249    cursor: pointer;
     250    display: inline-block;
     251    line-height: 26px;
     252}
     253
     254.dcchub-checkbox label:before {
     255    content: "";
     256    position: absolute;
     257    left: 0;
     258    top: 0;
     259    width: 26px;
     260    height: 26px;
     261    flex-shrink: 0;
     262    border-radius: 5px;
     263    border: 1px solid #CECECE;
     264    background: #FAFAFA;
     265}
     266
     267/* Style the checkmark when checked */
     268.dcchub-checkbox input:checked+label:after {
     269    content: "\2713";
     270    /* Unicode character for checkmark */
     271    font-size: 18px;
     272    color: #000000;
     273    position: absolute;
     274    left: 6px;
     275    top: 2px;
     276}
     277
     278.dcchub-success-message {
     279    border-radius: 5px;
     280    border: 1px solid #058E6E;
     281    background: rgba(98, 172, 97, 0.84);
     282    height: 47px;
     283    margin: 22px 64px 12px 26px;
     284}
     285
     286.dcchub-error-message {
     287    border-radius: 5px;
     288    border: 1px solid #E51E25;
     289    background: rgba(255, 0, 0, 0.64);
     290    height: 47px;
     291    margin: 22px 64px 12px 26px;
     292}
     293
     294.dcchub-message-text {
     295    color: #FFF;
     296    font-family: Roboto;
     297    font-size: 16px;
     298    font-style: normal;
     299    font-weight: 400;
     300    line-height: 130%;
     301    /* 20.8px */
     302    padding-left: 26px;
     303}
     304
     305@keyframes spin {
     306    0% {
     307        transform: rotate(0deg);
     308    }
     309
     310    100% {
     311        transform: rotate(360deg);
     312    }
     313}
     314
     315/* Buttons */
     316
     317.dcchub-button {
     318    overflow: hidden;
     319    position: relative;
     320    background-color: #E51E25;
     321    border: 0px;
     322    height: 44px;
     323    line-height: 16px;
     324    padding: 0px 30px;
     325    color: #FFF;
     326    font-family: 'Roboto', sans-serif;
     327    font-size: 15px;
     328    font-style: normal;
     329    font-weight: 500;
     330    border-radius: 5px;
     331    border: 1px solid #E51E25;
     332    cursor: pointer;
     333    min-width: 135px;
     334}
     335
     336.dcchub-button:hover {
     337    background-color: #FFF;
     338    color: #E51E25;
     339    border: 1px solid #E51E25;
     340}
     341
     342.dcchub-button.dcchub-spinner {
     343    background-color: #FFF;
     344    color: #E51E25;
     345    border: 1px solid #E51E25;
     346}
     347
     348.dcchub-button.dcchub-spinner::after {
     349    position: absolute;
     350    top: 50%;
     351    left: 50%;
     352    margin: -12px 0px 0px -12px;
     353    display: block;
     354    content: '';
     355    border: 4px solid #565656;
     356    border-top: 4px solid #E51E25;
     357    border-radius: 50%;
     358    width: 16px;
     359    height: 16px;
     360    animation: spin 1s linear infinite;
     361}
     362
     363.dcchub-button-gray {
     364    overflow: hidden;
     365    position: relative;
     366    background-color: #565656;
     367    border: 0px;
     368    height: 44px;
     369    min-width: 125px;
     370    line-height: 16px;
     371    padding: 0px 30px;
     372    color: #FFF;
     373    font-family: 'Roboto', sans-serif;
     374    font-size: 15px;
     375    font-style: normal;
     376    font-weight: 500;
     377    border-radius: 5px;
     378    border: 1px solid #565656;
     379    cursor: pointer;
     380}
     381
     382.dcchub-button-gray:hover {
     383    background-color: #FFF;
     384    color: #565656;
     385    border: 1px solid #565656;
     386}
     387
     388.dcchub-button-gray.dcchub-spinner {
     389    background-color: #FFF;
     390    color: #565656;
     391    border: 1px solid #565656;
     392}
     393
     394.dcchub-button-gray.dcchub-spinner::after {
     395    position: absolute;
     396    top: 50%;
     397    left: 50%;
     398    margin: -12px 0px 0px -12px;
     399    display: block;
     400    content: '';
     401    border: 4px solid #565656;
     402    border-top: 4px solid #E51E25;
     403    border-radius: 50%;
     404    width: 16px;
     405    height: 16px;
     406    animation: spin 1s linear infinite;
     407}
     408
     409.dcchub-green-button {
     410    text-align: center;
     411    text-decoration: none;
     412    background-color: #62AC61;
    44413    color: #fff;
    45 }
    46 
    47 .dcchub_script
    48 {
    49     width:600px;
    50     height:200px;
    51     max-width:100%;
    52 }
    53 
    54 .dcchub-tabs-content li
    55 {
    56     display:none;
    57 }
    58 
    59 .dcchub-tabs-content li.active
    60 {
    61     display: block;
    62 }
     414    border: none;
     415    cursor: pointer;
     416    font-family: 'Roboto', sans-serif;
     417    font-size: 15px;
     418    font-style: normal;
     419    font-weight: 500;
     420    border-radius: 5px;
     421    padding: 10px 30px;
     422    border: 1px solid #62AC61;
     423}
     424
     425.dcchub-green-button:hover {
     426    background-color: #fff;
     427    color: #62AC61;
     428}
     429
     430.dcchub-white-button {
     431    text-align: center;
     432    text-decoration: none;
     433    background-color: #fff;
     434    color: #333132;
     435    border: none;
     436    cursor: pointer;
     437    font-family: 'Roboto', sans-serif;
     438    font-size: 15px;
     439    font-style: normal;
     440    font-weight: 500;
     441    border-radius: 5px;
     442    padding: 10px 30px;
     443    border: 1px solid #fff;
     444}
     445
     446.dcchub-white-button:hover {
     447    background-color: rgba(173, 21, 25, 0.40);
     448    color: #FFF;
     449    border: 1px solid #fff;
     450}

  • cookiehub/trunk/includes/js/dcchub-test.js

    r2392341 r2999436  
    11
    2     jQuery(function(){
    3         var $buttons = jQuery('.dcchub-tab-buttons > li');
    4         var $contents = jQuery('.dcchub-tabs-content > li');
    5        
    6         $buttons.click(function(){
    7             $buttons.removeClass('active');
    8             $contents.removeClass('active');
    9 
    10             jQuery(this).addClass('active');
    11             var _target = jQuery(this).data('tab');
    12             jQuery(_target).addClass('active');
    13 
    14             return false;
    15         });
    16 
    17     })
    18    
     2jQuery(function($){
     3    var $buttons = jQuery('.dcchub-tab-buttons > li');
     4    var $contents = jQuery('.dcchub-tabs-content > li');
     5   
     6    $buttons.click(function(){
     7        $buttons.removeClass('active');
     8        $contents.removeClass('active');
     9
     10        jQuery(this).addClass('active');
     11        var _target = jQuery(this).data('tab');
     12        jQuery(_target).addClass('active');
     13
     14        return false;
     15    });
     16
     17
     18    $('#domain_code_form_submit').on('click', function() {
     19        var code = $('input[name=dcchub_domain_code]').val();
     20       
     21        blockUI();
     22       
     23        // Spinner
     24        var buttonId = 'domain_code_form_submit'
     25        var text = document.getElementById(buttonId).innerHTML;
     26        document.getElementById(buttonId).innerHTML = '';
     27        $(this).addClass('dcchub-spinner');
     28
     29        $.ajax({
     30            type: 'POST',
     31            url: ajaxurl,
     32            data: {
     33                action: 'register_domain_code',
     34                dcchub_domain_code: code
     35            },
     36            success: function(response) {
     37                // Remove Spinner
     38                $('#domain_code_form_submit').removeClass('dcchub-spinner');
     39                document.getElementById(buttonId).innerHTML = text;
     40
     41                if (response["success"] != null && response["success"]) {
     42                    showSuccess("Domain code registered!");
     43           
     44                    blockUI();
     45                    setTimeout(function()
     46                    {
     47                        location.reload();
     48                    }, 2200);
     49
     50                }
     51                else {
     52                    showError(response["data"]["errorMessage"] ?? "Unknown error occurred.");
     53                }
     54            },
     55            error: (function(data)
     56            {
     57                // Remove Spinner
     58                $('#domain_code_form_submit').removeClass('dcchub-spinner');
     59                document.getElementById(buttonId).innerHTML = text;
     60
     61                showError("Unknown error occurred.");
     62            }),
     63        });
     64    });
     65
     66    $('#register_account_form_submit').on('click', function() {
     67        var email = $('input[name=dcchub_email]').val();
     68        var domain = $('input[name=dcchub_domain]').val();
     69       
     70        blockUI();
     71       
     72        // Spinner
     73        var buttonId = 'register_account_form_submit'
     74        var text = document.getElementById(buttonId).innerHTML;
     75        document.getElementById(buttonId).innerHTML = '';
     76        $(this).addClass('dcchub-spinner');
     77
     78        $.ajax({
     79            type: 'POST',
     80            url: ajaxurl,
     81            data: {
     82                action: 'register_account',
     83                dcchub_email: email,
     84                dcchub_domain: domain
     85            },
     86            success: function(response) {
     87                // Remove Spinner
     88                $('#register_account_form_submit').removeClass('dcchub-spinner');
     89                document.getElementById(buttonId).innerHTML = text;
     90
     91                if (response["success"] != null && response["success"]) {
     92                    showSuccess("Account and Domain registered!");
     93           
     94                    blockUI();
     95                    setTimeout(function()
     96                    {
     97                        location.reload();
     98                    }, 2200);
     99
     100                }
     101                else {
     102                    showError(response["data"]["errorMessage"] ?? "Unknown error occurred.");
     103                }
     104            },
     105            error: (function(data)
     106            {
     107                // Remove Spinner
     108                $('#register_account_form_submit').removeClass('dcchub-spinner');
     109                document.getElementById(buttonId).innerHTML = text;
     110
     111                showError("Unknown error occurred.");
     112            }),
     113        });
     114    });
     115
     116    $('#dcchub_general_settings_form_submit').on('click', function() {
     117        var code = $('input[name=dcchub_domain_code]').val();
     118
     119        blockUI();
     120        // Spinner
     121        var buttonId = 'dcchub_general_settings_form_submit'
     122        var text = document.getElementById(buttonId).innerHTML;
     123        document.getElementById(buttonId).innerHTML = '';
     124        $(this).addClass('dcchub-spinner');
     125       
     126        $.ajax({
     127            type: 'POST',
     128            url: ajaxurl,
     129            data: {
     130                action: 'update_domain_code',
     131                dcchub_domain_code: code
     132            },
     133            success: function(response) {
     134                // Remove Spinner
     135                $('#dcchub_general_settings_form_submit').removeClass('dcchub-spinner');
     136                document.getElementById(buttonId).innerHTML = text;
     137
     138                if (response["success"] != null && response["success"]) {
     139                    var data = response["data"];
     140                    if (data != null && data["starter"] != null) {
     141                        document.getElementById('dcchub-product-type').innerText = data["starter"] ? 'Starter (FREE)' : 'Paid';
     142                        document.getElementById('dcchub-product-text').innerText = data["starter"] ? 'Upgrade to a paid plan for more monthly session and more features.' : 'You are currently subscribed to CookieHub with a paid plan.';
     143                        document.getElementById('dcchub-promotion-banner').style.display = data["starter"] ? null : 'none';
     144                    }
     145                   
     146                    showSuccess("Domain Code updated successfully");
     147                }
     148                else {
     149                    showError(response["data"]["errorMessage"] ?? "Unknown error occurred.");
     150                }
     151            },
     152            error: (function(data)
     153            {
     154                // Remove Spinner
     155                $('#dcchub_general_settings_form_submit').removeClass('dcchub-spinner');
     156                document.getElementById(buttonId).innerHTML = text;
     157
     158                showError("Unknown error occurred.");
     159            }),
     160        });
     161    });
     162
     163    $('#dcchub_advanced_settings_form_submit').on('click', function() {
     164       
     165        var form = document.getElementById("dcchub-advanced-settings-form");
     166        var formData = new FormData(form);
     167
     168        var data = {
     169            action: 'update_advanced_settings'
     170        };
     171        formData.forEach(function(value, key) {
     172            data[key] = value;
     173        });
     174
     175        blockUI();
     176       
     177        // Spinner
     178        var buttonId = 'dcchub_advanced_settings_form_submit'
     179        var text = document.getElementById(buttonId).innerHTML;
     180        document.getElementById(buttonId).innerHTML = '';
     181        $(this).addClass('dcchub-spinner');
     182
     183        $.ajax({
     184            type: 'POST',
     185            url: ajaxurl,
     186            data: data,
     187            success: function(response) {
     188                // Remove Spinner
     189                $('#dcchub_advanced_settings_form_submit').removeClass('dcchub-spinner');
     190                document.getElementById(buttonId).innerHTML = text;
     191
     192                showSuccess("Settings saved");
     193            },
     194            error: (function(data)
     195            {
     196                // Remove Spinner
     197                $('#dcchub_advanced_settings_form_submit').removeClass('dcchub-spinner');
     198                document.getElementById(buttonId).innerHTML = text;
     199
     200                showSuccess("Settings saved");
     201            }),
     202        });
     203    });
     204   
     205    /* functions */
     206
     207    function blockUI() {
     208        var inputElements = document.querySelectorAll('input, button');
     209        inputElements.forEach(function(element) {
     210            element.disabled = true;
     211        });
     212    }
     213
     214    function enableUI() {
     215        var inputElements = document.querySelectorAll('input, button');
     216        inputElements.forEach(function(element) {
     217            element.disabled = false;
     218        });
     219    }
     220
     221    function showSuccess(message)
     222    {
     223        enableUI();
     224
     225        window.scrollTo({ top: 0, behavior: 'smooth' });
     226        $('.dcchub-success-message').remove();
     227        $('.dcchub-error-message').remove();
     228        var m = $('<div />').addClass('dcchub-success-message');
     229        m.append($('<p />').addClass('dcchub-message-text').html(message));
     230   
     231        $('#message-container').append(m);
     232        $('#message-container').fadeIn();
     233           
     234        setTimeout(function()
     235        {
     236            $('#message-container').fadeOut();
     237        }, 2500);
     238    }
     239   
     240    function showError(message)
     241    {
     242        enableUI();
     243
     244        window.scrollTo({ top: 0, behavior: 'smooth' });
     245        $('.dcchub-error-message').remove();
     246        $('.dcchub-success-message').remove();
     247       
     248        var m = $('<div />').addClass('dcchub-error-message');
     249        m.append($('<p />').addClass('dcchub-message-text').html(message));
     250   
     251        $('#message-container').append(m);
     252        $('#message-container').fadeIn();
     253           
     254        setTimeout(function()
     255        {
     256            $('#message-container').fadeOut();
     257        }, 2500);
     258    }
     259});
     260

  • cookiehub/trunk/readme.txt

    r2995683 r2999436  
    44Requires at least: 5.2
    55Tested up to: 6.4.1
    6 Stable tag: 0.4.3
     6Stable tag: 1.0.0
    77License: GPLv2 or later
    88
    … …  
    4747== Changelog ==
    4848
     49= 1.0.0 =
     50*Release Date - 21 November 2023*
     51
     52Updated admin user interface
     53
    4954= 0.4.0 =
    5055*Release Date - 13 July 2023*
Note: See TracChangeset for help on using the changeset viewer.