| 1 |
<?php |
| 2 |
|
| 3 |
namespace WPFunnels\Admin\Banner; |
| 4 |
|
| 5 |
/** |
| 6 |
* SpecialOccasionBanner Class |
| 7 |
* |
| 8 |
* This class is responsible for displaying a special occasion banner in the WordPress admin. |
| 9 |
* |
| 10 |
* @package WPFunnels\Admin\Banner |
| 11 |
*/ |
| 12 |
class SpecialOccasionBanner |
| 13 |
{ |
| 14 |
|
| 15 |
/** |
| 16 |
* The occasion identifier. |
| 17 |
* |
| 18 |
* @var string |
| 19 |
*/ |
| 20 |
private $occasion; |
| 21 |
|
| 22 |
/** |
| 23 |
* The button link. |
| 24 |
* |
| 25 |
* @var string |
| 26 |
*/ |
| 27 |
private $btn_link; |
| 28 |
|
| 29 |
/** |
| 30 |
* The start date and time for displaying the banner. |
| 31 |
* |
| 32 |
* @var int |
| 33 |
*/ |
| 34 |
private $start_date; |
| 35 |
|
| 36 |
/** |
| 37 |
* The end date and time for displaying the banner. |
| 38 |
* |
| 39 |
* @var int |
| 40 |
*/ |
| 41 |
private $end_date; |
| 42 |
|
| 43 |
/** |
| 44 |
* Constructor method for SpecialOccasionBanner class. |
| 45 |
* |
| 46 |
* @param string $occasion The occasion identifier. |
| 47 |
* @param string $start_date The start date and time for displaying the banner. |
| 48 |
* @param string $end_date The end date and time for displaying the banner. |
| 49 |
*/ |
| 50 |
public function __construct($occasion, $start_date, $end_date, $btn_link = '#') |
| 51 |
{ |
| 52 |
$this->occasion = $occasion; |
| 53 |
$this->btn_link = $btn_link; |
| 54 |
$this->start_date = strtotime($start_date); |
| 55 |
$this->end_date = strtotime($end_date); |
| 56 |
|
| 57 |
if ('yes' === get_option('_is_show_ugcify_banner', 'yes')) { |
| 58 |
// Hook into the admin_notices action to display the banner |
| 59 |
add_action('admin_notices', [$this, 'display_banner']); |
| 60 |
add_action('admin_head', array($this, 'add_styles')); |
| 61 |
} |
| 62 |
} |
| 63 |
|
| 64 |
/** |
| 65 |
* Calculate time remaining until Halloween |
| 66 |
* |
| 67 |
* @return array Time remaining in days, hours, and minutes |
| 68 |
*/ |
| 69 |
public function wpf_get_promotion_banner_countdown() |
| 70 |
{ |
| 71 |
$end_date = strtotime('2026-01-07 23:59:59'); |
| 72 |
$now = current_time('timestamp'); |
| 73 |
$diff = $end_date - $now; |
| 74 |
|
| 75 |
return array( |
| 76 |
'days' => floor($diff / (60 * 60 * 24)), |
| 77 |
'hours' => floor(($diff % (60 * 60 * 24)) / (60 * 60)), |
| 78 |
'mins' => floor(($diff % (60 * 60)) / 60), |
| 79 |
'secs' => $diff % 60, |
| 80 |
); |
| 81 |
} |
| 82 |
|
| 83 |
/** |
| 84 |
* Displays the special occasion banner if the current date and time are within the specified range. |
| 85 |
*/ |
| 86 |
public function display_banner() |
| 87 |
{ |
| 88 |
$screen = get_current_screen(); |
| 89 |
$promotional_notice_pages = ['dashboard', 'plugins', 'wpfunnels_page_store_checkout','wpfunnels_page_wp_funnels', 'wpfunnels_page_wpfunnels_integrations', 'wpfunnels_page_wpfnl_automations', 'wpfunnels_page_edit_funnel', 'wpfunnels_page_wpfnl_settings']; |
| 90 |
$current_date_time = current_time('timestamp'); |
| 91 |
|
| 92 |
if (!in_array($screen->id, $promotional_notice_pages)) { |
| 93 |
return; |
| 94 |
} |
| 95 |
|
| 96 |
if ($current_date_time < $this->start_date || $current_date_time > $this->end_date) { |
| 97 |
//return; |
| 98 |
} |
| 99 |
|
| 100 |
// Calculate the time remaining in seconds |
| 101 |
$time_remaining = $this->end_date - $current_date_time; |
| 102 |
|
| 103 |
$countdown = $this->wpf_get_promotion_banner_countdown(); |
| 104 |
?> |
| 105 |
<div class="gwpf-promotional-notice <?php echo esc_attr($this->occasion); ?>-banner notice"> |
| 106 |
<div class="gwpf-tb__notification"> |
| 107 |
<div class="banner-overflow"> |
| 108 |
<section class="gwpf-promotional-banner" aria-labelledby="UGCify-offer"> |
| 109 |
<div class="gwpf-container"> |
| 110 |
<div class="promotional-banner"> |
| 111 |
<div class="banner-content"> |
| 112 |
<div class="banner-logo-area"> |
| 113 |
<span class="new-tool-text"><?php echo __('New Tool Coming:', 'wpfunnels'); ?></span> |
| 114 |
<svg xmlns="http://www.w3.org/2000/svg" width="23" height="20" viewBox="0 0 23 20" fill="none"><path d="M1.06618 12.1359C8.90142 22.3152 17.4084 17.0302 21.0104 12.1256C21.0976 12.0069 21.286 12.1052 21.2364 12.2439C17.5346 22.5755 4.52336 22.5942 0.84551 12.2448C0.797424 12.1095 0.97859 12.0221 1.06618 12.1359Z" fill="#201cfe"/><path d="M3.38441 14.7801C7.55671 19.3578 14.4767 19.3577 18.6683 14.7962L19.2305 18.0621C19.4048 19.0746 18.6283 20 17.6009 20H4.4095C3.37407 20 2.59495 19.0608 2.78274 18.0425L3.38441 14.7801ZM18.4936 13.7809C14.7261 17.1915 8.66183 18.7568 3.58106 13.7132L5.28946 4.4507H16.8876L18.4936 13.7809ZM11.4455 8.30703C11.1791 7.76715 10.7417 7.76715 10.4726 8.30703L9.97917 9.30214C9.91189 9.44065 9.73246 9.57354 9.58387 9.59899L8.68947 9.74872C8.11753 9.84484 7.98578 10.2633 8.39511 10.676L9.09037 11.377C9.20812 11.4957 9.27268 11.7247 9.23624 11.8887L9.0371 12.7566C8.88013 13.4406 9.24466 13.7091 9.84463 13.3502L10.6829 12.8498C10.8371 12.7594 11.0866 12.7593 11.238 12.8498L12.0763 13.3502C12.679 13.7091 13.0407 13.4435 12.8837 12.7566L12.6847 11.8887C12.6482 11.7247 12.7127 11.4957 12.8304 11.377L13.5258 10.676C13.9379 10.2633 13.8032 9.84483 13.2313 9.74872L12.337 9.59899C12.1856 9.57355 12.0062 9.44065 11.9389 9.30214L11.4455 8.30703Z" fill="#201cfe"/><path d="M2.13955 12.1528C1.65099 12.0253 0.571895 12.1146 0.164049 13.491C-0.473269 12.5989 0.864968 10.942 2.13955 12.1528Z" fill="#201cfe"/><path d="M21.652 13.492C21.5932 12.9905 21.118 12.0176 19.6874 12.1378C20.287 11.2198 22.3169 11.8646 21.652 13.492Z" fill="#201cfe"/><path d="M14.02 3.50497C14.02 2.57539 13.6977 1.68389 13.1241 1.02658C12.5504 0.369272 11.7724 7.01809e-08 10.9611 0C10.1499 -7.01809e-08 9.37184 0.369272 8.7982 1.02658C8.22455 1.68389 7.90228 2.57539 7.90228 3.50496H8.7852C8.7852 2.84371 9.01445 2.20953 9.42252 1.74195C9.83058 1.27437 10.384 1.01169 10.9611 1.01169C11.5382 1.01169 12.0917 1.27437 12.4997 1.74195C12.9078 2.20953 13.1371 2.84371 13.1371 3.50497H14.02Z" fill="#201cfe"/></svg> |
| 115 |
<span class="tool-name">UGCify</span> |
| 116 |
</div> |
| 117 |
|
| 118 |
<div class="banner-text"> |
| 119 |
<?php echo __('Build trust and increase conversions with UGC for WooCommerce!', 'wpfunnels'); ?> |
| 120 |
</div> |
| 121 |
|
| 122 |
<a href="<?php echo esc_url($this->btn_link); ?>" class="cta-button" role="button" aria-label="get special discount " target="_blank"> |
| 123 |
<?php |
| 124 |
echo __('Request Early Access', 'wpfunnels'); |
| 125 |
?> |
| 126 |
<svg xmlns="http://www.w3.org/2000/svg" width="8" height="9" viewBox="0 0 8 9" fill="none"><path d="M8 0.703124V8.29686C8 8.48334 7.93415 8.66218 7.81694 8.79405C7.69973 8.92591 7.54076 8.99999 7.375 8.99999C7.20924 8.99999 7.05027 8.92591 6.93306 8.79405C6.81585 8.66218 6.75 8.48334 6.75 8.29686V2.40061L1.06695 8.79406C0.949738 8.92592 0.790765 9 0.625004 9C0.459243 9 0.30027 8.92592 0.183059 8.79406C0.0658485 8.6622 0 8.48335 0 8.29687C0 8.11039 0.0658485 7.93155 0.183059 7.79968L5.86613 1.40625H0.625012C0.459252 1.40625 0.300281 1.33217 0.183071 1.20031C0.0658608 1.06845 1.28672e-05 0.889604 1.28672e-05 0.703124C1.28672e-05 0.516644 0.0658608 0.337802 0.183071 0.20594C0.300281 0.0740789 0.459252 0 0.625012 0L7.375 0C7.54076 0 7.69973 0.0740789 7.81694 0.20594C7.93415 0.337802 8 0.516644 8 0.703124Z" fill="#201cfe"/></svg> |
| 127 |
</a> |
| 128 |
</div> |
| 129 |
</div> |
| 130 |
</div> |
| 131 |
</section> |
| 132 |
</div> |
| 133 |
|
| 134 |
<button class="close-promotional-banner" type="button" aria-label="close banner"> |
| 135 |
<svg width="12" height="13" fill="none" viewBox="0 0 12 13" xmlns="http://www.w3.org/2000/svg"><path stroke="#7A8B9A" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 1.97L1 11.96m0-9.99l10 9.99"/></svg> |
| 136 |
</button> |
| 137 |
</div> |
| 138 |
</div> |
| 139 |
<!-- .gwpf-tb-notification end --> |
| 140 |
|
| 141 |
<script> |
| 142 |
function updateCountdown() { |
| 143 |
var endDate = new Date("2026-01-07 23:59:59").getTime(); |
| 144 |
var now = new Date().getTime(); |
| 145 |
var timeLeft = endDate - now; |
| 146 |
|
| 147 |
var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24)); |
| 148 |
var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); |
| 149 |
var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60)); |
| 150 |
var seconds = Math.floor((timeLeft % (1000 * 60)) / 1000); |
| 151 |
|
| 152 |
var daysElement = document.getElementById('wpf-halloween-days'); |
| 153 |
var hoursElement = document.getElementById('wpf-halloween-hours'); |
| 154 |
var minsElement = document.getElementById('wpf-halloween-mins'); |
| 155 |
var secsElement = document.getElementById('wpf-halloween-secs'); |
| 156 |
|
| 157 |
if (daysElement) { |
| 158 |
daysElement.innerHTML = days; |
| 159 |
} |
| 160 |
|
| 161 |
if (hoursElement) { |
| 162 |
hoursElement.innerHTML = hours; |
| 163 |
} |
| 164 |
|
| 165 |
if (minsElement) { |
| 166 |
minsElement.innerHTML = minutes; |
| 167 |
} |
| 168 |
if (secsElement) { |
| 169 |
secsElement.innerHTML = seconds; |
| 170 |
} |
| 171 |
} |
| 172 |
|
| 173 |
document.addEventListener('DOMContentLoaded', function() { |
| 174 |
updateCountdown(); |
| 175 |
setInterval(updateCountdown, 1000); // Update every minute |
| 176 |
}); |
| 177 |
</script> |
| 178 |
<?php |
| 179 |
} |
| 180 |
|
| 181 |
/** |
| 182 |
* Adds internal CSS styles for the special occasion banners. |
| 183 |
*/ |
| 184 |
public function add_styles() { |
| 185 |
?> |
| 186 |
<style type="text/css"> |
| 187 |
.gwpf-tb__notification, |
| 188 |
.gwpf-tb__notification * { |
| 189 |
box-sizing: border-box; |
| 190 |
} |
| 191 |
|
| 192 |
.gwpf-promotional-notice.notice { |
| 193 |
display: block; |
| 194 |
background: none; |
| 195 |
border: none; |
| 196 |
box-shadow: none; |
| 197 |
padding: 0; |
| 198 |
margin: 0; |
| 199 |
} |
| 200 |
|
| 201 |
.gwpf-tb__notification { |
| 202 |
width: calc(100% - 20px); |
| 203 |
margin: 20px 0 20px; |
| 204 |
background-repeat: no-repeat; |
| 205 |
background-size: cover; |
| 206 |
position: relative; |
| 207 |
border: none; |
| 208 |
box-shadow: none; |
| 209 |
display: block; |
| 210 |
max-height: 110px; |
| 211 |
} |
| 212 |
|
| 213 |
.wpfunnels_page_wpfnl_settings .gwpf-tb__notification, |
| 214 |
.wpfunnels_page_wp_funnels .gwpf-tb__notification { |
| 215 |
width: calc(100% - 40px); |
| 216 |
margin: 20px 0 20px 20px; |
| 217 |
} |
| 218 |
|
| 219 |
.gwpf-tb__notification .banner-overflow { |
| 220 |
position: relative; |
| 221 |
width: 100%; |
| 222 |
z-index: 1; |
| 223 |
} |
| 224 |
|
| 225 |
/* ---banner style start--- */ |
| 226 |
.gwpf-promotional-banner { |
| 227 |
position: relative; |
| 228 |
z-index: 1111; |
| 229 |
padding: 6px 0; |
| 230 |
border-radius: 10px; |
| 231 |
background: #FFF; |
| 232 |
box-shadow: 0 1px 1px 0 rgba(32, 28, 254, 0.10); |
| 233 |
} |
| 234 |
.gwpf-promotional-banner .promotional-banner { |
| 235 |
color: white; |
| 236 |
padding: 3px 20px 0; |
| 237 |
/* padding: 12px 20px; */ |
| 238 |
text-align: center; |
| 239 |
font-size: 14px; |
| 240 |
line-height: 1.4; |
| 241 |
position: relative; |
| 242 |
} |
| 243 |
.gwpf-promotional-banner .banner-content { |
| 244 |
max-width: 1200px; |
| 245 |
margin: 0 auto; |
| 246 |
display: inline-flex; |
| 247 |
align-items: center; |
| 248 |
justify-content: center; |
| 249 |
flex-wrap: wrap; |
| 250 |
gap: 30px; |
| 251 |
row-gap: 8px; |
| 252 |
position: relative; |
| 253 |
} |
| 254 |
.gwpf-promotional-banner .banner-logo-area { |
| 255 |
display: flex; |
| 256 |
align-items: center; |
| 257 |
gap: 5px; |
| 258 |
} |
| 259 |
.gwpf-promotional-banner .new-tool-text { |
| 260 |
color: #666; |
| 261 |
font-size: 12px; |
| 262 |
font-weight: 500; |
| 263 |
line-height: 1; |
| 264 |
display: block; |
| 265 |
} |
| 266 |
.gwpf-promotional-banner .tool-name { |
| 267 |
color: #090939; |
| 268 |
font-size: 14px; |
| 269 |
font-weight: 600; |
| 270 |
line-height: 1; |
| 271 |
display: block; |
| 272 |
} |
| 273 |
.gwpf-promotional-banner .banner-text { |
| 274 |
display: flex; |
| 275 |
align-items: center; |
| 276 |
flex-wrap: wrap; |
| 277 |
gap: 6px; |
| 278 |
row-gap: 0; |
| 279 |
justify-content: center; |
| 280 |
font-size: 15px; |
| 281 |
color: #100627; |
| 282 |
font-weight: 400; |
| 283 |
line-height: 1.4; |
| 284 |
text-transform: capitalize; |
| 285 |
letter-spacing: 0; |
| 286 |
} |
| 287 |
.gwpf-promotional-banner .banner-text svg { |
| 288 |
display: block; |
| 289 |
} |
| 290 |
.gwpf-promotional-banner .banner-text .highlighted-text { |
| 291 |
color: #ee8134; |
| 292 |
font-weight: 700; |
| 293 |
} |
| 294 |
.gwpf-promotional-banner .halloween-bird-left { |
| 295 |
position: absolute; |
| 296 |
left: -47px; |
| 297 |
bottom: -7px; |
| 298 |
} |
| 299 |
.gwpf-promotional-banner .halloween-bird-right { |
| 300 |
position: absolute; |
| 301 |
right: -50px; |
| 302 |
top: -5px; |
| 303 |
} |
| 304 |
.gwpf-promotional-banner .cta-button { |
| 305 |
color: #201CFE; |
| 306 |
font-size: 15px; |
| 307 |
font-style: normal; |
| 308 |
font-weight: 500; |
| 309 |
line-height: 1; |
| 310 |
text-decoration: underline; |
| 311 |
text-decoration-thickness: 1px; |
| 312 |
text-underline-offset: 5px; |
| 313 |
display: inline-flex; |
| 314 |
align-items: center; |
| 315 |
gap: 5px; |
| 316 |
transition: all 0.2s ease; |
| 317 |
background: #fff; |
| 318 |
padding: 9px 14px; |
| 319 |
} |
| 320 |
.gwpf-promotional-banner .cta-button svg { |
| 321 |
transition: transform 0.3s ease; |
| 322 |
} |
| 323 |
|
| 324 |
/* .gwpf-promotional-banner .cta-button:focus, |
| 325 |
.gwpf-promotional-banner .cta-button:visited { |
| 326 |
color: #3C1F7D !important; |
| 327 |
} |
| 328 |
.gwpf-promotional-banner .cta-button:hover { |
| 329 |
color: #3C1F7D !important; |
| 330 |
} |
| 331 |
.gwpf-promotional-banner .cta-button:hover svg path { |
| 332 |
stroke: #3C1F7D; |
| 333 |
fill: #3C1F7D; |
| 334 |
} */ |
| 335 |
|
| 336 |
.gwpf-promotional-banner .cta-button:hover { |
| 337 |
text-decoration: none; |
| 338 |
} |
| 339 |
.gwpf-promotional-banner .cta-button:hover svg { |
| 340 |
transform: translateX(3px); |
| 341 |
} |
| 342 |
|
| 343 |
|
| 344 |
.gwpf-tb__notification .close-promotional-banner { |
| 345 |
position: absolute; |
| 346 |
top: 50%; |
| 347 |
right: 10px; |
| 348 |
transform: translateY(-50%); |
| 349 |
background: #fff; |
| 350 |
border: none; |
| 351 |
padding: 0; |
| 352 |
border-radius:0; |
| 353 |
cursor: pointer; |
| 354 |
z-index: 9; |
| 355 |
width: 30px; |
| 356 |
height: 30px; |
| 357 |
display: flex; |
| 358 |
align-items: center; |
| 359 |
justify-content: center; |
| 360 |
} |
| 361 |
|
| 362 |
.gwpf-tb__notification .close-promotional-banner svg { |
| 363 |
width: 11px; |
| 364 |
height: 11px; |
| 365 |
display: block; |
| 366 |
} |
| 367 |
|
| 368 |
@media only screen and (max-width: 1199px) { |
| 369 |
.gwpf-promotional-banner .banner-content { |
| 370 |
gap: 20px; |
| 371 |
row-gap: 8px; |
| 372 |
} |
| 373 |
|
| 374 |
.gwpf-promotional-banner .cta-button { |
| 375 |
padding-top: 0; |
| 376 |
} |
| 377 |
} |
| 378 |
|
| 379 |
@media only screen and (max-width: 991px) { |
| 380 |
.promotional-banner { |
| 381 |
padding: 16px 20px; |
| 382 |
} |
| 383 |
|
| 384 |
.gwpf-tb__notification { |
| 385 |
margin: 60px 0 20px; |
| 386 |
} |
| 387 |
|
| 388 |
.gwpf-tb__notification .close-promotional-banner { |
| 389 |
width: 25px; |
| 390 |
height: 25px; |
| 391 |
} |
| 392 |
} |
| 393 |
|
| 394 |
@media only screen and (max-width: 767px) { |
| 395 |
.wpvr-promotional-banner { |
| 396 |
padding-top: 20px; |
| 397 |
padding-bottom: 30px; |
| 398 |
max-height: none; |
| 399 |
} |
| 400 |
|
| 401 |
.wpvr-promotional-banner { |
| 402 |
max-height: none; |
| 403 |
} |
| 404 |
} |
| 405 |
|
| 406 |
@media only screen and (max-width: 575px) { |
| 407 |
.promotional-banner { |
| 408 |
padding: 16px 55px; |
| 409 |
font-size: 13px; |
| 410 |
} |
| 411 |
.gwpf-promotional-banner .halloween-bird-left { |
| 412 |
left: -12px; |
| 413 |
bottom: inherit; |
| 414 |
top: -5px; |
| 415 |
} |
| 416 |
.gwpf-promotional-banner .halloween-bird-right { |
| 417 |
right: -12px; |
| 418 |
bottom: -7px; |
| 419 |
top: inherit; |
| 420 |
} |
| 421 |
} |
| 422 |
</style> |
| 423 |
<?php |
| 424 |
} |
| 425 |
|
| 426 |
} |
| 427 |
|
