Call Now Button - Version 1.3.2

Version Description

  • [Multibutton] Icon picker for main button
  • [Multibutton] Custom image selector for main button
  • [Multibutton] Add label to main button
  • Content Windows have Slim option
  • Introduced PRO accounts
  • Black friday & Cyber monday promotions
  • Support links point to nowbuttons.com
  • Small UI changes
Download this release

Release Info

Developer jasperroel
Plugin Icon 128x128 Call Now Button
Version 1.3.2
Comparing to
See all releases

Code changes from version 1.3.1 to 1.3.2

Files changed (34) hide show
  1. call-now-button.php +3 -2
  2. readme.txt +11 -1
  3. resources/font/cnb.woff +0 -0
  4. resources/js/action-edit.js +13 -6
  5. resources/js/action-type-to-icon-text.js +15 -18
  6. resources/js/button-edit-icon-color.js +18 -0
  7. resources/js/call-now-button.js +2 -2
  8. resources/js/domain-upgrade.js +1 -0
  9. resources/js/preview.js +2 -0
  10. resources/style/call-now-button.css +37 -23
  11. src/CallNowButton.php +6 -0
  12. src/admin/action/CnbActionViewEdit.php +9 -284
  13. src/admin/action/partials/class-action-icon-picker.php +330 -0
  14. src/admin/action/partials/class-action-iframe-settings.php +3 -3
  15. src/admin/api/CnbAdminCloud.php +1 -1
  16. src/admin/button/CnbButton.php +93 -42
  17. src/admin/button/CnbButtonView.php +37 -12
  18. src/admin/button/CnbButtonViewEdit.php +1 -0
  19. src/admin/button/partials/class-button-edit-table.php +25 -177
  20. src/admin/button/partials/class-button-icon-picker.php +280 -0
  21. src/admin/button/partials/class-button-label.php +138 -0
  22. src/admin/domain/CnbDomain.php +9 -0
  23. src/admin/domain/CnbDomainViewEdit.php +49 -17
  24. src/admin/domain/partials/CnbDomainViewUpgradeOverview.php +144 -24
  25. src/admin/legacy/CnbLegacyEdit.php +11 -11
  26. src/admin/legacy/CnbLegacyUpgrade.php +209 -29
  27. src/admin/partials/CnbFooter.php +1 -1
  28. src/admin/partials/CnbHeaderNotices.php +1 -1
  29. src/admin/settings/CnbApiKeyActivatedView.php +81 -56
  30. src/admin/settings/CnbSettingsViewEdit.php +25 -24
  31. src/autoload.php +3 -0
  32. src/notices/CnbAdminNotices.php +10 -0
  33. src/notices/CnbNotices.php +5 -2
  34. src/utils/CnbUtils.php +3 -2
call-now-button.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: Call Now Button
4
  Plugin URI: https://callnowbutton.com
5
  Description: Shows a <strong>Call Now Button</strong> to your mobile visitors. Easy to use but flexible to meet more demanding requirements. Change placement and color, hide on specific pages, track how many people click them or conversions of your Google Ads campaigns. Create an account to enable extra actions such as <strong>WhatsApp</strong>, <strong>Messenger</strong>, <strong>Telegram</strong>, <strong>Signal</strong>, <strong>Email</strong>, <strong>SMS</strong>, <strong>Maps</strong> and <strong>links</strong>. Also offers additional functionality such as advanced display rules, scheduling, geo rules, appear after scrolling, button animations and much more.
6
- Version: 1.3.1
7
  Author: NowButtons.com
8
  Author URI: https://nowbuttons.com
9
  GitHub Plugin URI: https://github.com/callnowbutton/wp-plugin
@@ -26,7 +26,7 @@ License: GPL2
26
  Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
27
  */
28
 
29
- define('CNB_VERSION', '1.3.1');
30
  define('CNB_NAME', 'Call Now Button');
31
  define('CNB_CLOUD_NAME', 'NowButtons for WordPress');
32
  define('CNB_BASENAME', plugin_basename(__FILE__));
@@ -34,6 +34,7 @@ define('CNB_BASEFOLDER', plugin_basename(dirname(__FILE__)));
34
  define('CNB_FILENAME', str_replace(CNB_BASEFOLDER . '/', '', CNB_BASENAME));
35
  define('CNB_WEBSITE', 'https://nowbuttons.com/');
36
  define('CNB_SUPPORT', CNB_WEBSITE . 'support/');
 
37
  define('CNB_APP', 'https://app.nowbuttons.com/');
38
  define('CNB_SLUG', sanitize_title(CNB_NAME));
39
 
3
  Plugin Name: Call Now Button
4
  Plugin URI: https://callnowbutton.com
5
  Description: Shows a <strong>Call Now Button</strong> to your mobile visitors. Easy to use but flexible to meet more demanding requirements. Change placement and color, hide on specific pages, track how many people click them or conversions of your Google Ads campaigns. Create an account to enable extra actions such as <strong>WhatsApp</strong>, <strong>Messenger</strong>, <strong>Telegram</strong>, <strong>Signal</strong>, <strong>Email</strong>, <strong>SMS</strong>, <strong>Maps</strong> and <strong>links</strong>. Also offers additional functionality such as advanced display rules, scheduling, geo rules, appear after scrolling, button animations and much more.
6
+ Version: 1.3.2
7
  Author: NowButtons.com
8
  Author URI: https://nowbuttons.com
9
  GitHub Plugin URI: https://github.com/callnowbutton/wp-plugin
26
  Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
27
  */
28
 
29
+ define('CNB_VERSION', '1.3.2');
30
  define('CNB_NAME', 'Call Now Button');
31
  define('CNB_CLOUD_NAME', 'NowButtons for WordPress');
32
  define('CNB_BASENAME', plugin_basename(__FILE__));
34
  define('CNB_FILENAME', str_replace(CNB_BASEFOLDER . '/', '', CNB_BASENAME));
35
  define('CNB_WEBSITE', 'https://nowbuttons.com/');
36
  define('CNB_SUPPORT', CNB_WEBSITE . 'support/');
37
+ define('CNB_SUPPORT_LEGACY', 'https://callnowbutton.com/support/');
38
  define('CNB_APP', 'https://app.nowbuttons.com/');
39
  define('CNB_SLUG', sanitize_title(CNB_NAME));
40
 
readme.txt CHANGED
@@ -5,7 +5,7 @@ Tags: call button, click to call, convert, call now button, contact button
5
  Requires at least: 4.1
6
  Requires PHP: 5.4
7
  Tested up to: 6.1
8
- Stable tag: 1.3.1
9
  License: GPLv2 or later
10
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
11
 
@@ -132,6 +132,16 @@ Yes, you can connect the plugin to our cloud service NowButton.com. That already
132
 
133
 
134
  == Changelog ==
 
 
 
 
 
 
 
 
 
 
135
  = 1.3.1 =
136
  * Minor bugfixes and UI improvements
137
 
5
  Requires at least: 4.1
6
  Requires PHP: 5.4
7
  Tested up to: 6.1
8
+ Stable tag: 1.3.2
9
  License: GPLv2 or later
10
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
11
 
132
 
133
 
134
  == Changelog ==
135
+ = 1.3.2 =
136
+ * [Multibutton] Icon picker for main button
137
+ * [Multibutton] Custom image selector for main button
138
+ * [Multibutton] Add label to main button
139
+ * Content Windows have Slim option
140
+ * Introduced PRO accounts
141
+ * Black friday & Cyber monday promotions
142
+ * Support links point to nowbuttons.com
143
+ * Small UI changes
144
+
145
  = 1.3.1 =
146
  * Minor bugfixes and UI improvements
147
 
resources/font/cnb.woff ADDED
Binary file
resources/js/action-edit.js CHANGED
@@ -77,15 +77,18 @@ function cnb_add_sortable_to_action_table() {
77
  }
78
 
79
  function cnb_action_icon_background_image() {
80
- jQuery('#cnb_action_icon_background_image').on('change input', () => {
81
- jQuery('#cnb_action_icon_type').val('CUSTOM')
 
 
 
82
  // Clear the custom icons
83
- cnb_remove_all_icon_highlights()
84
  })
85
  }
86
 
87
  function cnb_init_image_select() {
88
- jQuery('#cnb_select_image').on('click', () => {
89
  const image_frame = wp.media({
90
  title: 'Select Image',
91
  multiple : false,
@@ -94,6 +97,8 @@ function cnb_init_image_select() {
94
  }
95
  });
96
 
 
 
97
  image_frame.on('close',function() {
98
  const selection = image_frame.state().get('selection')
99
  if (!selection || selection.length === 0) return
@@ -104,8 +109,10 @@ function cnb_init_image_select() {
104
  const selected = first.toJSON();
105
  if (!selected) return
106
 
107
- jQuery('#cnb_action_icon_background_image').val('url(' + selected.url + ')').trigger('change')
108
- jQuery('#cnb_selected_action_background_image').css({backgroundImage: 'url(' + selected.url + ')', display: "flex" })
 
 
109
  });
110
 
111
  image_frame.open();
77
  }
78
 
79
  function cnb_action_icon_background_image() {
80
+ jQuery('.cnb_action_icon_background_image').on('change input', (event) => {
81
+ const jEle = jQuery(event.target).parent()
82
+ const findIcontypeEle = jEle.data('iconTypeTarget')
83
+ const cnb_action_icon_type = jQuery('#' + findIcontypeEle)
84
+ cnb_action_icon_type.val('CUSTOM')
85
  // Clear the custom icons
86
+ cnb_remove_all_icon_highlights(jEle)
87
  })
88
  }
89
 
90
  function cnb_init_image_select() {
91
+ jQuery('.cnb_select_image').on('click', (event) => {
92
  const image_frame = wp.media({
93
  title: 'Select Image',
94
  multiple : false,
97
  }
98
  });
99
 
100
+ const target = jQuery(event.target).parent()
101
+
102
  image_frame.on('close',function() {
103
  const selection = image_frame.state().get('selection')
104
  if (!selection || selection.length === 0) return
109
  const selected = first.toJSON();
110
  if (!selected) return
111
 
112
+ // Update the real property
113
+ target.find('.cnb_action_icon_background_image').val('url(' + selected.url + ')').trigger('change')
114
+ // Preview window
115
+ target.find('.cnb_selected_action_background_image').css({backgroundImage: 'url(' + selected.url + ')', display: "flex" })
116
  });
117
 
118
  image_frame.open();
resources/js/action-type-to-icon-text.js CHANGED
@@ -28,8 +28,7 @@ function cnbActiontypeToIcontext($actionType) {
28
  }
29
  }
30
 
31
- function cnb_trigger_rerender(jEle, doNotExpand = false) {
32
- window.cnbMultiDoNotExpand = doNotExpand
33
  jEle.trigger('change')
34
  }
35
  /**
@@ -53,12 +52,8 @@ function cnb_change_icon_text(ele) {
53
  const cnb_action_icon_type = jQuery('#' + findIcontypeEle)
54
  cnb_action_icon_type.val(jQuery(ele).data('icon-type'))
55
 
56
- // Since the open icon changed, ensure it is CLOSED now (so you can see the change)
57
- // Only trigger this if the source is the BUTTON main icon, not an ACTION icon
58
- const doNotExpand = findIcontextEle.includes("button-")
59
-
60
  // Force an update to the preview
61
- cnb_trigger_rerender(cnb_action_icon_text, doNotExpand)
62
  } else {
63
  // Maybe it's the button-edit multibutton options
64
  // If so, get the parent and find if the 2 data attributes are set
@@ -129,15 +124,16 @@ function cnb_show_icon_text_advanced(ele) {
129
  function cnb_hightlight_selected_icon_all() {
130
  const all = jQuery("[data-icon-text-target]")
131
  all.each(function() {
132
- const findIcontextEle = jQuery(this).data('iconTextTarget')
133
- const findIcontypeEle = jQuery(this).data('iconTypeTarget')
 
134
  const iconTextEle = jQuery('#' + findIcontextEle)
135
  const iconTypeEle = jQuery('#' + findIcontypeEle)
136
- cnb_hightlight_selected_icon_each(iconTextEle, iconTypeEle)
137
  })
138
  }
139
 
140
- function cnb_hightlight_selected_icon_each(iconTextEle, iconTypeEle) {
141
  // In case of "DEFAULT", we should match that to FONT
142
  const iconTextVal = iconTextEle.val()
143
  const iconTypeVal = iconTypeEle.val() === 'DEFAULT' ? 'FONT' : iconTypeEle.val()
@@ -154,17 +150,18 @@ function cnb_hightlight_selected_icon_each(iconTextEle, iconTypeEle) {
154
  }
155
 
156
  // Clear the custom image
157
- cnb_remove_icon_background_image()
158
  }
159
 
160
- function cnb_remove_all_icon_highlights() {
161
- jQuery('.cnb_icon_active').removeClass('cnb_icon_active')
162
  }
163
 
164
- function cnb_remove_icon_background_image() {
165
- jQuery('#cnb_action_icon_background_image').val('')
166
- jQuery('#cnb_action_icon_background_image').attr('value', '')
167
- jQuery('#cnb_selected_action_background_image').css({backgroundImage: '', display: "none" })
 
168
  }
169
 
170
  function initUpdateIconText() {
28
  }
29
  }
30
 
31
+ function cnb_trigger_rerender(jEle) {
 
32
  jEle.trigger('change')
33
  }
34
  /**
52
  const cnb_action_icon_type = jQuery('#' + findIcontypeEle)
53
  cnb_action_icon_type.val(jQuery(ele).data('icon-type'))
54
 
 
 
 
 
55
  // Force an update to the preview
56
+ cnb_trigger_rerender(cnb_action_icon_text)
57
  } else {
58
  // Maybe it's the button-edit multibutton options
59
  // If so, get the parent and find if the 2 data attributes are set
124
  function cnb_hightlight_selected_icon_all() {
125
  const all = jQuery("[data-icon-text-target]")
126
  all.each(function() {
127
+ const root = jQuery(this)
128
+ const findIcontextEle = root.data('iconTextTarget')
129
+ const findIcontypeEle = root.data('iconTypeTarget')
130
  const iconTextEle = jQuery('#' + findIcontextEle)
131
  const iconTypeEle = jQuery('#' + findIcontypeEle)
132
+ cnb_highlight_selected_icon_each(iconTextEle, iconTypeEle, root)
133
  })
134
  }
135
 
136
+ function cnb_highlight_selected_icon_each(iconTextEle, iconTypeEle, root) {
137
  // In case of "DEFAULT", we should match that to FONT
138
  const iconTextVal = iconTextEle.val()
139
  const iconTypeVal = iconTypeEle.val() === 'DEFAULT' ? 'FONT' : iconTypeEle.val()
150
  }
151
 
152
  // Clear the custom image
153
+ cnb_remove_icon_background_image(root)
154
  }
155
 
156
+ function cnb_remove_all_icon_highlights(jEle) {
157
+ jEle.find('.cnb_icon_active').removeClass('cnb_icon_active')
158
  }
159
 
160
+ function cnb_remove_icon_background_image(root) {
161
+ // TODO Find the one that belongs to this "group", instead of wiping all!
162
+ root.find('.cnb_action_icon_background_image').val('')
163
+ root.find('.cnb_action_icon_background_image').attr('value', '')
164
+ root.find('.cnb_selected_action_background_image').css({backgroundImage: '', display: "none" })
165
  }
166
 
167
  function initUpdateIconText() {
resources/js/button-edit-icon-color.js ADDED
@@ -0,0 +1,18 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /**
2
+ * When the "open" colors for the multi button change, we want to reset the "close" colors.
3
+ *
4
+ * The close can be changed in "advanced mode", but under normal circumstances, when a user changes
5
+ * the primary (open) colors, the expanded (close) colors should match that
6
+ */
7
+ function cnb_change_icon_color() {
8
+ jQuery('#button-multiButtonOptions-iconBackgroundColorOpen').on('cnb-change', () => {
9
+ jQuery('#button-multiButtonOptions-iconBackgroundColorClose').val('').change()
10
+ })
11
+ jQuery('#button-multiButtonOptions-iconColorOpen').on('cnb-change', () => {
12
+ jQuery('#button-multiButtonOptions-iconColorClose').val('').change()
13
+ })
14
+ }
15
+
16
+ jQuery(() => {
17
+ cnb_change_icon_color()
18
+ })
resources/js/call-now-button.js CHANGED
@@ -6,7 +6,8 @@ function cnb_setup_colors() {
6
  // we update it. Cannot not be done via an ".on('change')", since the wpColorPicker cannot
7
  // respond to those events
8
  const options = {
9
- change: () => {
 
10
  jQuery(() => {
11
  if (typeof livePreview !== 'undefined') {
12
  livePreview()
@@ -18,7 +19,6 @@ function cnb_setup_colors() {
18
 
19
  // Add color picker
20
  jQuery('.cnb-color-field').wpColorPicker(options)
21
- jQuery('.cnb-iconcolor-field').wpColorPicker(options)
22
  }
23
 
24
  function cnb_setup_placements() {
6
  // we update it. Cannot not be done via an ".on('change')", since the wpColorPicker cannot
7
  // respond to those events
8
  const options = {
9
+ change: (event) => {
10
+ jQuery(event.target).trigger('cnb-change')
11
  jQuery(() => {
12
  if (typeof livePreview !== 'undefined') {
13
  livePreview()
19
 
20
  // Add color picker
21
  jQuery('.cnb-color-field').wpColorPicker(options)
 
22
  }
23
 
24
  function cnb_setup_placements() {
resources/js/domain-upgrade.js CHANGED
@@ -32,6 +32,7 @@ function cnb_domain_upgrade_currency() {
32
 
33
  function cnbShowStarterFeatures() {
34
  jQuery(".cnb-starter").show();
 
35
  }
36
 
37
  /**
32
 
33
  function cnbShowStarterFeatures() {
34
  jQuery(".cnb-starter").show();
35
+ jQuery(".cnbShowStarterFeatures").remove();
36
  }
37
 
38
  /**
resources/js/preview.js CHANGED
@@ -287,6 +287,8 @@ function initButtonEdit() {
287
  formToJson()
288
  livePreview()
289
  jQuery("form.cnb-container :input").on('change input', function() {
 
 
290
  livePreview()
291
  })
292
  // No need to call "livePreview", this is done via the ".done()" handler on cnb_delete_action()
287
  formToJson()
288
  livePreview()
289
  jQuery("form.cnb-container :input").on('change input', function() {
290
+ // An input can signal that the MultiButton should stay closed
291
+ window.cnbMultiDoNotExpand = !!jQuery(this).closest("[data-cnb-multi-do-not-expand]").length
292
  livePreview()
293
  })
294
  // No need to call "livePreview", this is done via the ".done()" handler on cnb_delete_action()
resources/style/call-now-button.css CHANGED
@@ -165,7 +165,15 @@ p.submit .cnb-form-validation-notice {
165
  #TB_window #TB_title {
166
  background-color:#f4f4f4;
167
  color: #1d2327;
168
- font-size: 14px;
 
 
 
 
 
 
 
 
169
  }
170
 
171
  #TB_window {
@@ -335,12 +343,11 @@ input[type='range'] {
335
 
336
  .cnb_type_selector .cnb_type_selector {
337
  transition: all 0.5s;
338
- opacity: 0.3;
339
  filter: grayscale(1);
340
  }
341
  .cnb_type_selector .cnb_type_selector:hover {
342
- opacity: 0.5;
343
- filter: grayscale(0.6);
344
  }
345
 
346
  .cnb_type_selector .cnb_type_selector_item {
@@ -364,25 +371,23 @@ input[type='range'] {
364
  position: relative;
365
  cursor: not-allowed;
366
  }
367
- .cnb_type_only_pro + .cnb-pro-overlay {
 
368
  display: block;
369
- opacity: 0.7;
370
  position: absolute;
371
  top: 40px;
372
  background: #fff;
373
  padding: 10px;
374
  text-align: center;
375
- border: 1px solid #666;
376
- width: 30%;
377
- max-width: 33%;
378
- left: calc(50% - 15%);
379
  z-index: 5;
380
  box-sizing: border-box;
381
  }
382
- .cnb_type_only_pro:hover + .cnb-pro-overlay,
383
- .cnb_type_only_pro + .cnb-pro-overlay:hover {
384
- opacity: 0.9;
385
  }
 
386
  @media (max-width:530px) {
387
  .cnb_type_only_pro + .cnb-pro-overlay {
388
  padding:0 3px 3px;
@@ -821,12 +826,15 @@ input[type=checkbox].cnb_day_selector:checked + label.cnb_day_selector {
821
  border: 1px solid #006600;
822
  color: #fff;
823
  }
824
- .cnb-promobox.cnb-promobox-green .button-primary {
 
825
  background: #00aa00;
826
  border-color: #00aa00;
827
  }
828
  .cnb-promobox.cnb-promobox-green .button-primary:hover,
829
- .cnb-promobox.cnb-promobox-green .button-primary:active {
 
 
830
  background: #007600;
831
  border-color: #007600;
832
  }
@@ -1528,7 +1536,8 @@ span.cnb-pro-badge {
1528
  width: 100%;
1529
  }
1530
  }
1531
- .cnb-welcome-blocks .button.button-primary {
 
1532
  background: #009900;
1533
  border-color: #009900;
1534
  font-size:16px;
@@ -1656,9 +1665,6 @@ span.cnb-pro-badge {
1656
  width:100%;
1657
  border-collapse: collapse;
1658
  }
1659
- .cnb-prod-cnb {
1660
- background: #eee;
1661
- }
1662
  .cnb-prod-nb,
1663
  .cnb-prod-nb h3 {
1664
  background: #0a0;
@@ -1674,9 +1680,8 @@ span.cnb-pro-badge {
1674
  #cnb_upgrade_box .font-22 {
1675
  font-size: 22px;
1676
  }
1677
- .cnb-nb-plans thead tr:last-child,
1678
- .cnb-nb-plans tfoot tr:last-child {
1679
- background-color:#f4f4f4
1680
  }
1681
  .cnb-nb-plans thead tr:last-child h4,
1682
  .cnb-nb-plans tfoot tr:last-child h4 {
@@ -1705,7 +1710,8 @@ span.cnb-pro-badge {
1705
  text-align: center;
1706
  }
1707
  .cnb-nb-plans tbody tr:not(.line):hover {
1708
- background-color:#f4f4f4;
 
1709
  }
1710
  .cnb-compare-features .cnb-promobox .inside .cnb-promobox-copy {
1711
  padding: 0;
@@ -1757,3 +1763,11 @@ span.cnb-pro-badge {
1757
  height:30px;
1758
  }
1759
  }
 
 
 
 
 
 
 
 
165
  #TB_window #TB_title {
166
  background-color:#f4f4f4;
167
  color: #1d2327;
168
+ font-size: 18px;
169
+ }
170
+ #TB_window .cnb_button_name th,
171
+ #TB_window .cnb_button_type th {
172
+ font-size: 16px;
173
+ font-weight: 600;
174
+ }
175
+ #TB_window .cnb_button_name #button_name {
176
+ width: 100%;
177
  }
178
 
179
  #TB_window {
343
 
344
  .cnb_type_selector .cnb_type_selector {
345
  transition: all 0.5s;
346
+ opacity: 0.7;
347
  filter: grayscale(1);
348
  }
349
  .cnb_type_selector .cnb_type_selector:hover {
350
+ filter: grayscale(0);
 
351
  }
352
 
353
  .cnb_type_selector .cnb_type_selector_item {
371
  position: relative;
372
  cursor: not-allowed;
373
  }
374
+ .cnb_type_only_pro .cnb-pro-overlay {
375
+ opacity: 0;
376
  display: block;
 
377
  position: absolute;
378
  top: 40px;
379
  background: #fff;
380
  padding: 10px;
381
  text-align: center;
382
+ border: 1px solid #bdbdbd;
383
+ width: 100%;
 
 
384
  z-index: 5;
385
  box-sizing: border-box;
386
  }
387
+ .cnb_type_selector .cnb_type_selector:hover .cnb-pro-overlay {
388
+ opacity: 1;
 
389
  }
390
+
391
  @media (max-width:530px) {
392
  .cnb_type_only_pro + .cnb-pro-overlay {
393
  padding:0 3px 3px;
826
  border: 1px solid #006600;
827
  color: #fff;
828
  }
829
+ .cnb-promobox.cnb-promobox-green .button-primary,
830
+ .cnb-compare-features .button-primary {
831
  background: #00aa00;
832
  border-color: #00aa00;
833
  }
834
  .cnb-promobox.cnb-promobox-green .button-primary:hover,
835
+ .cnb-promobox.cnb-promobox-green .button-primary:active,
836
+ .cnb-compare-features .button-primary:hover,
837
+ .cnb-compare-features .button-primary:active {
838
  background: #007600;
839
  border-color: #007600;
840
  }
1536
  width: 100%;
1537
  }
1538
  }
1539
+ .cnb-welcome-blocks .button.button-primary,
1540
+ .notice-blackfriday .button.button-primary {
1541
  background: #009900;
1542
  border-color: #009900;
1543
  font-size:16px;
1665
  width:100%;
1666
  border-collapse: collapse;
1667
  }
 
 
 
1668
  .cnb-prod-nb,
1669
  .cnb-prod-nb h3 {
1670
  background: #0a0;
1680
  #cnb_upgrade_box .font-22 {
1681
  font-size: 22px;
1682
  }
1683
+ .cnb-nb-plans thead tr:last-child {
1684
+ background-color:#e4e4e4;
 
1685
  }
1686
  .cnb-nb-plans thead tr:last-child h4,
1687
  .cnb-nb-plans tfoot tr:last-child h4 {
1710
  text-align: center;
1711
  }
1712
  .cnb-nb-plans tbody tr:not(.line):hover {
1713
+ background-color:#eee;
1714
+ cursor: default;
1715
  }
1716
  .cnb-compare-features .cnb-promobox .inside .cnb-promobox-copy {
1717
  padding: 0;
1763
  height:30px;
1764
  }
1765
  }
1766
+ .notice-blackfriday {
1767
+ background-color: black;
1768
+ color: white;
1769
+ border-left-color: #00aa00;
1770
+ }
1771
+ .notice-blackfriday p {
1772
+ font-size: 16px;
1773
+ }
src/CallNowButton.php CHANGED
@@ -349,6 +349,12 @@ class CallNowButton {
349
  array( CNB_SLUG . '-call-now-button' ),
350
  CNB_VERSION,
351
  true );
 
 
 
 
 
 
352
  wp_register_script(
353
  CNB_SLUG . '-action-edit',
354
  plugins_url( '../resources/js/action-edit.js', __FILE__ ),
349
  array( CNB_SLUG . '-call-now-button' ),
350
  CNB_VERSION,
351
  true );
352
+ wp_register_script(
353
+ CNB_SLUG . '-button-edit-icon-color',
354
+ plugins_url( '../resources/js/button-edit-icon-color.js', __FILE__ ),
355
+ array( CNB_SLUG . '-button-edit' ),
356
+ CNB_VERSION,
357
+ true );
358
  wp_register_script(
359
  CNB_SLUG . '-action-edit',
360
  plugins_url( '../resources/js/action-edit.js', __FILE__ ),
src/admin/action/CnbActionViewEdit.php CHANGED
@@ -63,6 +63,7 @@ class CnbActionViewEdit {
63
  *
64
  * WP_Locale considers "0" to be Sunday, whereas the CallNowButton APi considers "0" to be Monday. See the below table:
65
  *
 
66
  * +-----------+-----------+------------+
67
  * | Day | WP_Locale | API Server |
68
  * +-----------+-----------+------------+
@@ -80,7 +81,7 @@ class CnbActionViewEdit {
80
  * +-----------+-----------+------------+
81
  * | Sunday | 0 | 6 |
82
  * +-----------+-----------+------------+
83
- *
84
  * So, we need to translate.
85
  *
86
  * @param int $wp_locale_day
@@ -97,9 +98,9 @@ class CnbActionViewEdit {
97
 
98
  /**
99
  * CNB week starts on Monday (0), WP_Local starts on Sunday (0)
100
- * See wp_locale_day_to_daysofweek_array_index()
101
  *
102
- * This array only signifies the order to DISPLAY the days in the UI according to WP_Locale
103
  * So, in this case, we make the UI render the week starting on Monday (1) and end on Sunday (0).
104
  */
105
  function get_order_of_days() {
@@ -239,287 +240,10 @@ class CnbActionViewEdit {
239
  </td>
240
  </tr>
241
 
242
- <tr class="cnb_hide_on_modal">
243
- <th scope="row"><label for="actions-<?php echo esc_attr( $action->id ) ?>-iconText">Button icon/image</label></th>
244
- <td data-icon-text-target="cnb_action_icon_text" data-icon-type-target="cnb_action_icon_type">
245
- <?php if ( $button->domain->type !== 'STARTER' ) { ?>
246
- <div class="icon-text-options" id="icon-text-ANCHOR">
247
- <div class="cnb-button-icon">
248
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="anchor">anchor</i>
249
- </div>
250
- <div class="cnb-button-icon">
251
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="close_down">close_down</i>
252
- </div>
253
- <div class="cnb-button-icon">
254
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="anchor_up">anchor_up</i>
255
- </div>
256
- </div>
257
- <div class="icon-text-options" id="icon-text-EMAIL">
258
- <div class="cnb-button-icon">
259
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="email">email</i>
260
- </div>
261
- <div class="cnb-button-icon">
262
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="mail2">mail2</i>
263
- </div>
264
- <div class="cnb-button-icon">
265
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="mail3">mail3</i>
266
- </div>
267
- </div>
268
- <div class="icon-text-options" id="icon-text-HOURS">
269
- <div class="cnb-button-icon">
270
- <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
271
- data-icon-text="access_time">access_time</i>
272
- </div>
273
- <div class="cnb-button-icon">
274
- <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
275
- data-icon-text="access_time_filled">access_time_filled</i>
276
- </div>
277
- </div>
278
- <div class="icon-text-options" id="icon-text-LINK">
279
- <div class="cnb-button-icon">
280
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link">link</i>
281
- </div>
282
- <div class="cnb-button-icon">
283
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link2">link2</i>
284
- </div>
285
- <div class="cnb-button-icon">
286
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link3">link3</i>
287
- </div>
288
- <div class="cnb-button-icon">
289
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link4">link4</i>
290
- </div>
291
- <div class="cnb-button-icon">
292
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link5">link5</i>
293
- </div>
294
- <div class="cnb-button-icon">
295
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="calendar">calendar</i>
296
- </div>
297
- </div>
298
-
299
- <div class="icon-text-options" id="icon-text-MAP">
300
- <div class="cnb-button-icon">
301
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions">directions</i>
302
- </div>
303
- <div class="cnb-button-icon">
304
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions2">directions2</i>
305
- </div>
306
- <div class="cnb-button-icon">
307
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions3">directions3</i>
308
- </div>
309
- <div class="cnb-button-icon">
310
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions4">directions4</i>
311
- </div>
312
- <div class="cnb-button-icon">
313
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions5">directions5</i>
314
- </div>
315
- <div class="cnb-button-icon">
316
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions6">directions6</i>
317
- </div>
318
- </div>
319
-
320
- <div class="icon-text-options" id="icon-text-PHONE">
321
- <div class="cnb-button-icon">
322
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call">call</i>
323
- </div>
324
- <div class="cnb-button-icon">
325
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call2">call2</i>
326
- </div>
327
- <div class="cnb-button-icon">
328
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call3">call3</i>
329
- </div>
330
- <div class="cnb-button-icon">
331
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call4">call4</i>
332
- </div>
333
- </div>
334
- <div class="icon-text-options" id="icon-text-SMS">
335
- <div class="cnb-button-icon">
336
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="chat">chat</i>
337
- </div>
338
- <div class="cnb-button-icon">
339
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="sms">sms</i>
340
- </div>
341
- </div>
342
- <div class="icon-text-options" id="icon-text-WHATSAPP">
343
- <div class="cnb-button-icon">
344
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="whatsapp">whatsapp</i>
345
- </div>
346
- </div>
347
- <div class="icon-text-options" id="icon-text-FACEBOOK">
348
- <div class="cnb-button-icon">
349
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="facebook_messenger">facebook_messenger</i>
350
- </div>
351
- </div>
352
- <div class="icon-text-options" id="icon-text-TELEGRAM">
353
- <div class="cnb-button-icon">
354
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="telegram">telegram</i>
355
- </div>
356
- </div>
357
- <div class="icon-text-options" id="icon-text-SIGNAL">
358
- <div class="cnb-button-icon">
359
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="signal">signal</i>
360
- </div>
361
- </div>
362
- <div class="icon-text-options" id="icon-text-IFRAME">
363
- <div class="cnb-button-icon">
364
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="open_modal">open_modal</i>
365
- </div>
366
- <div class="cnb-button-icon">
367
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="calendar">calendar</i>
368
- </div>
369
- <div class="cnb-button-icon">
370
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="communicate">communicate</i>
371
- </div>
372
- <div class="cnb-button-icon">
373
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="conversation">conversation</i>
374
- </div>
375
- <div class="cnb-button-icon">
376
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="more_info">more_info</i>
377
- </div>
378
- <div class="cnb-button-icon">
379
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call_back">call_back</i>
380
- </div>
381
- <div class="cnb-button-icon">
382
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="donate">donate</i>
383
- </div>
384
- <div class="cnb-button-icon">
385
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="payment">payment</i>
386
- </div>
387
- </div>
388
- <div class="icon-text-options" id="icon-text-TALLY">
389
- <div class="cnb-button-icon">
390
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call3">call3</i>
391
- </div>
392
- <div class="cnb-button-icon">
393
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="email">email</i>
394
- </div>
395
- <div class="cnb-button-icon">
396
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="chat">chat</i>
397
- </div>
398
- <div class="cnb-button-icon">
399
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="communicate">communicate</i>
400
- </div>
401
- <div class="cnb-button-icon">
402
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="open_modal">open_modal</i>
403
- </div>
404
- <div class="cnb-button-icon">
405
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="donate">donate</i>
406
- </div>
407
- <div class="cnb-button-icon">
408
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="payment">payment</i>
409
- </div>
410
- </div>
411
- <div class="icon-text-options" id="icon-text-INTERCOM">
412
- <div class="cnb-button-icon">
413
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="intercom">intercom</i>
414
- </div>
415
- </div>
416
- <?php } ?>
417
-
418
- <?php if ( $button->domain->type === 'STARTER' ) { ?>
419
- <p class="description">
420
- Icon selection and custom images are <span class="cnb-pro-badge">Pro</span> features.
421
- <a href="<?php echo esc_url( $upgrade_link ) ?>">Upgrade</a>.
422
- </p>
423
- <?php } ?>
424
-
425
- <div class="cnb-button-icon cnb-button-image cnb_icon_active" id="cnb_selected_action_background_image" style="background-image:<?php echo esc_attr( $action->iconBackgroundImage ) ?>">
426
-
427
- </div>
428
- <input
429
- type="hidden"
430
- name="actions[<?php echo esc_attr( $action->id ) ?>][iconBackgroundImage]"
431
- value="<?php echo esc_attr( $action->iconBackgroundImage ) ?>"
432
- id="cnb_action_icon_background_image"/>
433
-
434
- <?php if ( $button->domain->type !== 'STARTER' ) { ?>
435
- <input
436
- type='button'
437
- class="button-secondary" value="<?php esc_attr_e( 'Select image' ); ?>"
438
- id="cnb_select_image"
439
- <?php if (!$isPro) { ?>disabled="disabled" title="Upgrade to PRO to enable custom images"<?php } ?>
440
- />
441
- <?php } ?>
442
-
443
-
444
- <a
445
- href="#"
446
- onclick="return cnb_show_icon_text_advanced(this)"
447
- data-icon-text="cnb_action_icon_text"
448
- data-icon-type="cnb_action_icon_type"
449
- data-description="cnb_action_icon_text_description"
450
- class="cnb_advanced_view">Use a custom icon</a>
451
- <input
452
- type="hidden"
453
- name="actions[<?php echo esc_attr( $action->id ) ?>][iconText]"
454
- value="<?php if ( isset( $action->iconText ) ) {
455
- echo esc_attr( $action->iconText );
456
- } ?>"
457
- id="cnb_action_icon_text"/>
458
- <input
459
- type="hidden"
460
- readonly="readonly"
461
- name="actions[<?php echo esc_attr( $action->id ) ?>][iconType]"
462
- value="<?php if ( isset( $action->iconType ) ) {
463
- echo esc_attr( $action->iconType );
464
- } ?>"
465
- id="cnb_action_icon_type"/>
466
- <p class="description" id="cnb_action_icon_text_description" style="display: none">
467
- You can enter a custom Material Design font code here. Search the full library at <a
468
- href="https://fonts.google.com/icons" target="_blank">Google Fonts</a>.<br/>
469
- The Call Now Button uses the <code>filled</code> version of icons.</p>
470
- </td>
471
- </tr>
472
-
473
- <?php if ( $button && $button->type === 'SINGLE' ) { ?>
474
- <tr class="cnb_hide_on_modal cnb_advanced_view">
475
- <th colspan="2">
476
- <h3>Colors for a Single button are defined on the Presentation tab.</h3>
477
- </th>
478
- </tr>
479
- <?php } else { ?>
480
-
481
- <tr>
482
- <th scope="row"><label for="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]">Button
483
- color</label></th>
484
- <td>
485
- <input name="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]"
486
- id="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]" type="text"
487
- value="<?php echo esc_attr( $action->backgroundColor ) ?>"
488
- class="cnb-color-field" data-default-color="#009900"/>
489
- </td>
490
- </tr>
491
- <tr>
492
- <th scope="row"><label for="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]">Icon
493
- color</label></th>
494
- <td>
495
- <input name="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]"
496
- id="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]" type="text"
497
- value="<?php echo esc_attr( $action->iconColor ) ?>"
498
- class="cnb-iconcolor-field" data-default-color="#FFFFFF"/>
499
- </td>
500
- </tr>
501
- <?php if ( $button && $button->type === 'MULTI' ) { ?>
502
- <input name="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]" type="hidden" value="1"/>
503
- <?php } else { ?>
504
- <tr>
505
- <th scope="row"></th>
506
- <td>
507
- <input type="hidden" name="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]"
508
- id="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]" value="0"/>
509
- <input id="cnb-action-icon-enabled" class="cnb_toggle_checkbox" type="checkbox"
510
- name="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]"
511
- id="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]"
512
- value="true" <?php checked( true, $action->iconEnabled ); ?>>
513
- <label for="cnb-action-icon-enabled" class="cnb_toggle_label">Toggle</label>
514
- <span data-cnb_toggle_state_label="cnb-action-icon-enabled"
515
- class="cnb_toggle_state cnb_toggle_false">Hide icon</span>
516
- <span data-cnb_toggle_state_label="cnb-action-icon-enabled"
517
- class="cnb_toggle_state cnb_toggle_true">Show icon</span>
518
- </td>
519
- </tr>
520
- <?php
521
- } // End Multi/Buttonbar
522
- } // End Single (/"button" options)
523
 
524
  $action_sms_settings = new ActionSmsSettings();
525
  $action_sms_settings->render($action);
@@ -742,6 +466,7 @@ class CnbActionViewEdit {
742
  $this->add_header( $action );
743
  } );
744
 
 
745
  $button = null;
746
  $bid = ( new CnbUtils() )->get_query_val( 'bid', null );
747
  if ( $bid !== null && ! is_wp_error( $action ) ) {
63
  *
64
  * WP_Locale considers "0" to be Sunday, whereas the CallNowButton APi considers "0" to be Monday. See the below table:
65
  *
66
+ * ```
67
  * +-----------+-----------+------------+
68
  * | Day | WP_Locale | API Server |
69
  * +-----------+-----------+------------+
81
  * +-----------+-----------+------------+
82
  * | Sunday | 0 | 6 |
83
  * +-----------+-----------+------------+
84
+ *```
85
  * So, we need to translate.
86
  *
87
  * @param int $wp_locale_day
98
 
99
  /**
100
  * CNB week starts on Monday (0), WP_Local starts on Sunday (0)
101
+ * See `wp_locale_day_to_daysofweek_array_index()`.
102
  *
103
+ * This array only signifies the order to DISPLAY the days in the UI according to WP_Locale.
104
  * So, in this case, we make the UI render the week starting on Monday (1) and end on Sunday (0).
105
  */
106
  function get_order_of_days() {
240
  </td>
241
  </tr>
242
 
243
+ <?php
244
+ $icon_picker = new ActionIconPicker();
245
+ $icon_picker->render($action, $button);
246
+ $icon_picker->render_icon_color_chooser($action, $button);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
247
 
248
  $action_sms_settings = new ActionSmsSettings();
249
  $action_sms_settings->render($action);
466
  $this->add_header( $action );
467
  } );
468
 
469
+ $back_to_button_link = '#';
470
  $button = null;
471
  $bid = ( new CnbUtils() )->get_query_val( 'bid', null );
472
  if ( $bid !== null && ! is_wp_error( $action ) ) {
src/admin/action/partials/class-action-icon-picker.php ADDED
@@ -0,0 +1,330 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ namespace cnb\admin\action;
3
+
4
+ use cnb\admin\button\CnbButton;
5
+
6
+ // don't load directly
7
+ defined( 'ABSPATH' ) || die( '-1' );
8
+
9
+ class ActionIconPicker {
10
+ /**
11
+ * @param $action CnbAction
12
+ * @param $button CnbButton
13
+ *
14
+ * @return void
15
+ */
16
+ public function render($action, $button) {
17
+ $upgrade_link =
18
+ add_query_arg( array(
19
+ 'page' => 'call-now-button-domains',
20
+ 'action' => 'upgrade',
21
+ 'id' => $button->domain->id
22
+ ),
23
+ admin_url( 'admin.php' ) );
24
+
25
+ ?>
26
+ <tr class="cnb_hide_on_modal">
27
+ <th scope="row"><label for="actions-<?php echo esc_attr( $action->id ) ?>-iconText">Button icon/image </label></th>
28
+ <td data-icon-text-target="cnb_action_icon_text" data-icon-type-target="cnb_action_icon_type">
29
+ <?php if ( $button->domain->type !== 'STARTER' ) { ?>
30
+ <div class="icon-text-options" id="icon-text-ANCHOR">
31
+ <div class="cnb-button-icon">
32
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="anchor">anchor</i>
33
+ </div>
34
+ <div class="cnb-button-icon">
35
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="close_down">close_down</i>
36
+ </div>
37
+ <div class="cnb-button-icon">
38
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="anchor_up">anchor_up</i>
39
+ </div>
40
+ </div>
41
+ <div class="icon-text-options" id="icon-text-EMAIL">
42
+ <div class="cnb-button-icon">
43
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="email">email</i>
44
+ </div>
45
+ <div class="cnb-button-icon">
46
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="mail2">mail2</i>
47
+ </div>
48
+ <div class="cnb-button-icon">
49
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="mail3">mail3</i>
50
+ </div>
51
+ </div>
52
+ <div class="icon-text-options" id="icon-text-HOURS">
53
+ <div class="cnb-button-icon">
54
+ <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
55
+ data-icon-text="access_time">access_time</i>
56
+ </div>
57
+ <div class="cnb-button-icon">
58
+ <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
59
+ data-icon-text="access_time_filled">access_time_filled</i>
60
+ </div>
61
+ </div>
62
+ <div class="icon-text-options" id="icon-text-LINK">
63
+ <div class="cnb-button-icon">
64
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link">link</i>
65
+ </div>
66
+ <div class="cnb-button-icon">
67
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link2">link2</i>
68
+ </div>
69
+ <div class="cnb-button-icon">
70
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link3">link3</i>
71
+ </div>
72
+ <div class="cnb-button-icon">
73
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link4">link4</i>
74
+ </div>
75
+ <div class="cnb-button-icon">
76
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="link5">link5</i>
77
+ </div>
78
+ <div class="cnb-button-icon">
79
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="calendar">calendar</i>
80
+ </div>
81
+ </div>
82
+ <div class="icon-text-options" id="icon-text-MAP">
83
+ <div class="cnb-button-icon">
84
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions">directions</i>
85
+ </div>
86
+ <div class="cnb-button-icon">
87
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions2">directions2</i>
88
+ </div>
89
+ <div class="cnb-button-icon">
90
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions3">directions3</i>
91
+ </div>
92
+ <div class="cnb-button-icon">
93
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions4">directions4</i>
94
+ </div>
95
+ <div class="cnb-button-icon">
96
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions5">directions5</i>
97
+ </div>
98
+ <div class="cnb-button-icon">
99
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="directions6">directions6</i>
100
+ </div>
101
+ </div>
102
+ <div class="icon-text-options" id="icon-text-PHONE">
103
+ <div class="cnb-button-icon">
104
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call">call</i>
105
+ </div>
106
+ <div class="cnb-button-icon">
107
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call2">call2</i>
108
+ </div>
109
+ <div class="cnb-button-icon">
110
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call3">call3</i>
111
+ </div>
112
+ <div class="cnb-button-icon">
113
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call4">call4</i>
114
+ </div>
115
+ </div>
116
+ <div class="icon-text-options" id="icon-text-SMS">
117
+ <div class="cnb-button-icon">
118
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="chat">chat</i>
119
+ </div>
120
+ <div class="cnb-button-icon">
121
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="sms">sms</i>
122
+ </div>
123
+ </div>
124
+ <div class="icon-text-options" id="icon-text-WHATSAPP">
125
+ <div class="cnb-button-icon">
126
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="whatsapp">whatsapp</i>
127
+ </div>
128
+ </div>
129
+ <div class="icon-text-options" id="icon-text-FACEBOOK">
130
+ <div class="cnb-button-icon">
131
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="facebook_messenger">facebook_messenger</i>
132
+ </div>
133
+ </div>
134
+ <div class="icon-text-options" id="icon-text-TELEGRAM">
135
+ <div class="cnb-button-icon">
136
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="telegram">telegram</i>
137
+ </div>
138
+ </div>
139
+ <div class="icon-text-options" id="icon-text-SIGNAL">
140
+ <div class="cnb-button-icon">
141
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="signal">signal</i>
142
+ </div>
143
+ </div>
144
+ <div class="icon-text-options" id="icon-text-IFRAME">
145
+ <div class="cnb-button-icon">
146
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="open_modal">open_modal</i>
147
+ </div>
148
+ <div class="cnb-button-icon">
149
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="calendar">calendar</i>
150
+ </div>
151
+ <div class="cnb-button-icon">
152
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="communicate">communicate</i>
153
+ </div>
154
+ <div class="cnb-button-icon">
155
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="conversation">conversation</i>
156
+ </div>
157
+ <div class="cnb-button-icon">
158
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="more_info">more_info</i>
159
+ </div>
160
+ <div class="cnb-button-icon">
161
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call_back">call_back</i>
162
+ </div>
163
+ <div class="cnb-button-icon">
164
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="donate">donate</i>
165
+ </div>
166
+ <div class="cnb-button-icon">
167
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="payment">payment</i>
168
+ </div>
169
+ </div>
170
+ <div class="icon-text-options" id="icon-text-TALLY">
171
+ <div class="cnb-button-icon">
172
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call3">call3</i>
173
+ </div>
174
+ <div class="cnb-button-icon">
175
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="email">email</i>
176
+ </div>
177
+ <div class="cnb-button-icon">
178
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="chat">chat</i>
179
+ </div>
180
+ <div class="cnb-button-icon">
181
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="communicate">communicate</i>
182
+ </div>
183
+ <div class="cnb-button-icon">
184
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="open_modal">open_modal</i>
185
+ </div>
186
+ <div class="cnb-button-icon">
187
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="donate">donate</i>
188
+ </div>
189
+ <div class="cnb-button-icon">
190
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="payment">payment</i>
191
+ </div>
192
+ </div>
193
+ <div class="icon-text-options" id="icon-text-INTERCOM">
194
+ <div class="cnb-button-icon">
195
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="intercom">intercom</i>
196
+ </div>
197
+ </div>
198
+ <?php } ?>
199
+
200
+ <?php if ( $button->domain->type === 'STARTER' ) { ?>
201
+ <p class="description">
202
+ Icon selection and custom images are <span class="cnb-pro-badge">Pro</span> features.
203
+ <a href="<?php echo esc_url( $upgrade_link ) ?>">Upgrade</a>.
204
+ </p>
205
+ <?php } else {
206
+ $this->render_image_selector($action, $button);
207
+ } ?>
208
+
209
+ <a
210
+ href="#"
211
+ onclick="return cnb_show_icon_text_advanced(this)"
212
+ data-icon-text="cnb_action_icon_text"
213
+ data-icon-type="cnb_action_icon_type"
214
+ data-description="cnb_action_icon_text_description"
215
+ class="cnb_advanced_view">Use a custom icon</a>
216
+ <input
217
+ type="hidden"
218
+ name="actions[<?php echo esc_attr( $action->id ) ?>][iconText]"
219
+ value="<?php if ( isset( $action->iconText ) ) {
220
+ echo esc_attr( $action->iconText );
221
+ } ?>"
222
+ id="cnb_action_icon_text"/>
223
+ <input
224
+ type="hidden"
225
+ readonly="readonly"
226
+ name="actions[<?php echo esc_attr( $action->id ) ?>][iconType]"
227
+ value="<?php if ( isset( $action->iconType ) ) {
228
+ echo esc_attr( $action->iconType );
229
+ } ?>"
230
+ id="cnb_action_icon_type"/>
231
+ <p class="description" id="cnb_action_icon_text_description" style="display: none">
232
+ You can enter a custom Material Design font code here. Search the full library at <a
233
+ href="https://fonts.google.com/icons" target="_blank">Google Fonts</a>.<br/>
234
+ The Call Now Button uses the <code>filled</code> version of icons.</p>
235
+ </td>
236
+ </tr>
237
+ <?php
238
+ }
239
+
240
+ private function render_image_selector( $action, $button ) { ?>
241
+ <div
242
+ class="cnb-button-icon cnb-button-image cnb_icon_active cnb_selected_action_background_image"
243
+ style="background-image:<?php echo esc_attr( $action->iconBackgroundImage ) ?>"
244
+ ></div>
245
+
246
+ <input
247
+ type="hidden"
248
+ name="actions[<?php echo esc_attr( $action->id ) ?>][iconBackgroundImage]"
249
+ value="<?php echo esc_attr( $action->iconBackgroundImage ) ?>"
250
+ class="cnb_action_icon_background_image"
251
+ />
252
+
253
+ <input
254
+ type='button'
255
+ class="cnb_select_image button-secondary"
256
+ value="<?php esc_attr_e( 'Select image' ); ?>"
257
+ <?php if ( $button->domain->type !== 'PRO' ) { ?>disabled="disabled"
258
+ title="Upgrade to PRO to enable custom images"<?php } ?>
259
+ />
260
+ <?php
261
+ }
262
+
263
+ /**
264
+ * @param $action CnbAction
265
+ * @param $button CnbButton
266
+ *
267
+ * @return void
268
+ */
269
+ public function render_icon_color_chooser($action, $button) {
270
+ // SINGLE does not configure the color via the Action, but via the Button
271
+ // (On the Presentation tab)
272
+ if ( $button && $button->type === 'SINGLE' ) {
273
+ return;
274
+ } ?>
275
+
276
+ <tr>
277
+ <th scope="row">
278
+ <label for="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]">
279
+ Button color
280
+ </label>
281
+ </th>
282
+ <td>
283
+ <input name="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]"
284
+ id="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]" type="text"
285
+ value="<?php echo esc_attr( $action->backgroundColor ) ?>"
286
+ class="cnb-color-field" data-default-color="#009900"/>
287
+ </td>
288
+ </tr>
289
+ <tr>
290
+ <th scope="row">
291
+ <label for="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]">
292
+ Icon color
293
+ </label>
294
+ </th>
295
+ <td>
296
+ <input name="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]"
297
+ id="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]" type="text"
298
+ value="<?php echo esc_attr( $action->iconColor ) ?>"
299
+ class="cnb-color-field" data-default-color="#FFFFFF"/>
300
+ </td>
301
+ </tr>
302
+ <?php
303
+
304
+ // Actions on a Single or Multi button are not allowed to hide their Icon.
305
+ // Only the Actions on a Full (Buttonbar) are allowed to hide their Icon.
306
+ if ( $button && $button->type === 'MULTI' ) { ?>
307
+ <input name="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]" type="hidden" value="1"/>
308
+ <?php
309
+ return;
310
+ } ?>
311
+
312
+ <tr>
313
+ <th scope="row"></th>
314
+ <td>
315
+ <input type="hidden" name="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]"
316
+ id="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]" value="0"/>
317
+ <input id="cnb-action-icon-enabled" class="cnb_toggle_checkbox" type="checkbox"
318
+ name="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]"
319
+ id="actions[<?php echo esc_attr( $action->id ) ?>][iconEnabled]"
320
+ value="true" <?php checked( true, $action->iconEnabled ); ?>>
321
+ <label for="cnb-action-icon-enabled" class="cnb_toggle_label">Toggle</label>
322
+ <span data-cnb_toggle_state_label="cnb-action-icon-enabled"
323
+ class="cnb_toggle_state cnb_toggle_false">Hide icon</span>
324
+ <span data-cnb_toggle_state_label="cnb-action-icon-enabled"
325
+ class="cnb_toggle_state cnb_toggle_true">Show icon</span>
326
+ </td>
327
+ </tr>
328
+ <?php
329
+ }
330
+ }
src/admin/action/partials/class-action-iframe-settings.php CHANGED
@@ -149,10 +149,10 @@ class ActionIframeSettings {
149
  <td>
150
  <select id="cnb-action-properties-modal-width"
151
  name="actions[<?php echo esc_attr( $action->id ) ?>][properties][modal-width]">
152
- <option value="400px" <?php selected( '400px', $action_properties_modal_width ) ?>>Normal</option>
 
153
  <option value="500px" <?php selected( '500px', $action_properties_modal_width ) ?>>Wide</option>
154
- <option value="600px" <?php selected( '600px', $action_properties_modal_width ) ?>>Extra Wide
155
- </option>
156
  </select>
157
  </td>
158
  </tr>
149
  <td>
150
  <select id="cnb-action-properties-modal-width"
151
  name="actions[<?php echo esc_attr( $action->id ) ?>][properties][modal-width]">
152
+ <option value="250px" <?php selected( '250px', $action_properties_modal_width ) ?>>Slim</option>
153
+ <option value="400px" <?php selected( '400px', $action_properties_modal_width ); selected( '', $action_properties_modal_width ) ?>>Normal</option>
154
  <option value="500px" <?php selected( '500px', $action_properties_modal_width ) ?>>Wide</option>
155
+ <option value="600px" <?php selected( '600px', $action_properties_modal_width ) ?>>Extra Wide</option>
 
156
  </select>
157
  </td>
158
  </tr>
src/admin/api/CnbAdminCloud.php CHANGED
@@ -471,7 +471,7 @@ class CnbAdminCloud {
471
  if ( isset( $cnb_options['advanced_view'] ) && $cnb_options['advanced_view'] == 1 ) {
472
  $advanced = ' at <strong>' . esc_html( CnbAppRemote::cnb_get_api_base() ) . '</strong>';
473
  }
474
- $message = '<p>Your ' . $type . ' <strong>' . esc_html( $id ) . '</strong> has been ' . $verb . $advanced . '!</p>';
475
  $notice = new CnbNotice( 'success', $message );
476
  $notice->dismissable = true;
477
 
471
  if ( isset( $cnb_options['advanced_view'] ) && $cnb_options['advanced_view'] == 1 ) {
472
  $advanced = ' at <strong>' . esc_html( CnbAppRemote::cnb_get_api_base() ) . '</strong>';
473
  }
474
+ $message = '<p>Your ' . $type . ' <strong>' . esc_html( $id ) . '</strong> has been ' . $verb . $advanced . '</p>';
475
  $notice = new CnbNotice( 'success', $message );
476
  $notice->dismissable = true;
477
 
src/admin/button/CnbButton.php CHANGED
@@ -157,7 +157,7 @@ class CnbButton implements JsonSerializable {
157
 
158
  /**
159
  * If a stdClass is passed, it is transformed into a CnbButton.
160
- * a WP_Error is ignored and return immediatly
161
  * a null if converted into an (empty) CnbButton
162
  *
163
  * @param $object stdClass|array|WP_Error|null
@@ -172,16 +172,16 @@ class CnbButton implements JsonSerializable {
172
  $button = new CnbButton();
173
  $button->id = CnbUtils::getPropertyOrNull( $object, 'id' );
174
  // phpcs:ignore PHPCompatibility.FunctionUse
175
- $button->active = boolval( CnbUtils::getPropertyOrNull( $object, 'active' ) );
176
- $button->name = CnbUtils::getPropertyOrNull( $object, 'name' );
177
- $button->type = CnbUtils::getPropertyOrNull( $object, 'type' );
178
- $button->domain = CnbUtils::getPropertyOrNull( $object, 'domain' );
179
- $button->actions = CnbUtils::getPropertyOrNull( $object, 'actions' );
180
- $button->conditions = CnbUtils::getPropertyOrNull( $object, 'conditions' );
181
- $options = CnbUtils::getPropertyOrNull( $object, 'options' );
182
- $button->options = CnbButtonOptions::fromObject( $options );
183
- $multiButtonOptions = CnbUtils::getPropertyOrNull( $object, 'multiButtonOptions' );
184
- if ($multiButtonOptions != null) {
185
  $button->multiButtonOptions = CnbMultiButtonOptions::fromObject( $multiButtonOptions );
186
  }
187
 
@@ -295,8 +295,8 @@ class CnbButtonOptions implements JsonSerializable {
295
  $options->iconBackgroundColor = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundColor' );
296
  $options->iconColor = CnbUtils::getPropertyOrNull( $object, 'iconColor' );
297
  $options->displayMode = CnbUtils::getPropertyOrNull( $object, 'displayMode' );
298
- $scrollOptions = CnbUtils::getPropertyOrNull( $object, 'scroll' );
299
- if ($scrollOptions != null) {
300
  $options->scroll = CnbScrollOptions::fromObject( $scrollOptions );
301
  }
302
 
@@ -310,40 +310,91 @@ class CnbButtonOptions implements JsonSerializable {
310
 
311
  class CnbMultiButtonOptions implements JsonSerializable {
312
  public $id;
 
 
313
  public $iconColor;
 
314
  public $iconBackgroundColor;
315
- public $iconTextOpen;
316
  public $iconTypeOpen;
317
- public $iconTextClose;
 
 
 
 
 
318
  public $iconTypeClose;
319
- public $labelText;
320
- public $labelBackgroundColor;
 
 
 
 
 
 
 
 
 
 
 
321
 
322
  public function toArray() {
323
  return array(
324
- 'id' => ! empty( $this->id ) ? $this->id : null,
325
- 'iconColor' => $this->iconColor,
326
- 'iconBackgroundColor' => $this->iconBackgroundColor,
327
- 'iconTextOpen' => $this->iconTextOpen,
328
- 'iconTypeOpen' => $this->iconTypeOpen,
329
- 'iconTextClose' => $this->iconTextClose,
330
- 'iconTypeClose' => $this->iconTypeClose,
331
- 'labelText' => $this->labelText, // PRO only
332
- 'labelBackgroundColor' => $this->labelBackgroundColor, // PRO only
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
333
  );
334
  }
335
 
336
  public static function fromObject( $object ) {
337
- $options = new CnbMultiButtonOptions();
338
- $options->id = CnbUtils::getPropertyOrNull( $object, 'id' );
339
- $options->iconColor = CnbUtils::getPropertyOrNull( $object, 'iconColor' );
340
- $options->iconBackgroundColor = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundColor' );
341
- $options->iconTextOpen = CnbUtils::getPropertyOrNull( $object, 'iconTextOpen' );
342
- $options->iconTypeOpen = CnbUtils::getPropertyOrNull( $object, 'iconTypeOpen' );
343
- $options->iconTextClose = CnbUtils::getPropertyOrNull( $object, 'iconTextClose' );
344
- $options->iconTypeClose = CnbUtils::getPropertyOrNull( $object, 'iconTypeClose' );
345
- $options->labelText = CnbUtils::getPropertyOrNull( $object, 'labelText' );
346
- $options->labelBackgroundColor = CnbUtils::getPropertyOrNull( $object, 'labelBackgroundColor' );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
347
 
348
  return $options;
349
  }
@@ -374,18 +425,18 @@ class CnbScrollOptions implements JsonSerializable {
374
 
375
  public function toArray() {
376
  return array(
377
- 'revealAtHeight'=> $this->revealAtHeight,
378
- 'hideAtHeight' => $this->hideAtHeight,
379
- 'neverHide' => $this->neverHide,
380
  );
381
  }
382
 
383
  public static function fromObject( $object ) {
384
  $options = new CnbScrollOptions();
385
- $options->revealAtHeight = intval(CnbUtils::getPropertyOrNull( $object, 'revealAtHeight' ));
386
- $options->hideAtHeight = intval(CnbUtils::getPropertyOrNull( $object, 'hideAtHeight' ));
387
  // phpcs:ignore PHPCompatibility.FunctionUse
388
- $options->neverHide = boolval(CnbUtils::getPropertyOrNull( $object, 'neverHide' ));
389
 
390
  return $options;
391
  }
157
 
158
  /**
159
  * If a stdClass is passed, it is transformed into a CnbButton.
160
+ * a WP_Error is ignored and return immediately
161
  * a null if converted into an (empty) CnbButton
162
  *
163
  * @param $object stdClass|array|WP_Error|null
172
  $button = new CnbButton();
173
  $button->id = CnbUtils::getPropertyOrNull( $object, 'id' );
174
  // phpcs:ignore PHPCompatibility.FunctionUse
175
+ $button->active = boolval( CnbUtils::getPropertyOrNull( $object, 'active' ) );
176
+ $button->name = CnbUtils::getPropertyOrNull( $object, 'name' );
177
+ $button->type = CnbUtils::getPropertyOrNull( $object, 'type' );
178
+ $button->domain = CnbUtils::getPropertyOrNull( $object, 'domain' );
179
+ $button->actions = CnbUtils::getPropertyOrNull( $object, 'actions' );
180
+ $button->conditions = CnbUtils::getPropertyOrNull( $object, 'conditions' );
181
+ $options = CnbUtils::getPropertyOrNull( $object, 'options' );
182
+ $button->options = CnbButtonOptions::fromObject( $options );
183
+ $multiButtonOptions = CnbUtils::getPropertyOrNull( $object, 'multiButtonOptions' );
184
+ if ( $multiButtonOptions != null ) {
185
  $button->multiButtonOptions = CnbMultiButtonOptions::fromObject( $multiButtonOptions );
186
  }
187
 
295
  $options->iconBackgroundColor = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundColor' );
296
  $options->iconColor = CnbUtils::getPropertyOrNull( $object, 'iconColor' );
297
  $options->displayMode = CnbUtils::getPropertyOrNull( $object, 'displayMode' );
298
+ $scrollOptions = CnbUtils::getPropertyOrNull( $object, 'scroll' );
299
+ if ( $scrollOptions != null ) {
300
  $options->scroll = CnbScrollOptions::fromObject( $scrollOptions );
301
  }
302
 
310
 
311
  class CnbMultiButtonOptions implements JsonSerializable {
312
  public $id;
313
+
314
+ // Deprecated, replaced by $iconColorOpen
315
  public $iconColor;
316
+ // Deprecated, replaced by $iconBackgroundColorOpen
317
  public $iconBackgroundColor;
318
+
319
  public $iconTypeOpen;
320
+ public $iconTextOpen;
321
+ public $iconBackgroundImageOpen;
322
+ public $iconClassOpen;
323
+ public $iconColorOpen;
324
+ public $iconBackgroundColorOpen;
325
+
326
  public $iconTypeClose;
327
+ public $iconTextClose;
328
+ public $iconBackgroundImageClose;
329
+ public $iconClassClose;
330
+ public $iconColorClose;
331
+ public $iconBackgroundColorClose;
332
+
333
+ public $labelTextOpen;
334
+ public $labelBackgroundColorOpen;
335
+ public $labelTextColorOpen;
336
+
337
+ public $labelTextClose;
338
+ public $labelBackgroundColorClose;
339
+ public $labelTextColorClose;
340
 
341
  public function toArray() {
342
  return array(
343
+ 'id' => ! empty( $this->id ) ? $this->id : null,
344
+ 'iconColor' => $this->iconColor,
345
+ 'iconBackgroundColor' => $this->iconBackgroundColor,
346
+
347
+ 'iconTypeOpen' => $this->iconTypeOpen,
348
+ 'iconTextOpen' => $this->iconTextOpen,
349
+ 'iconBackgroundImageOpen' => $this->iconBackgroundImageOpen,
350
+ 'iconClassOpen' => $this->iconClassOpen,
351
+ 'iconColorOpen' => $this->iconColorOpen,
352
+ 'iconBackgroundColorOpen' => $this->iconBackgroundColorOpen,
353
+
354
+ 'iconTypeClose' => $this->iconTypeClose,
355
+ 'iconTextClose' => $this->iconTextClose,
356
+ 'iconBackgroundImageClose' => $this->iconBackgroundImageClose,
357
+ 'iconClassClose' => $this->iconClassClose,
358
+ 'iconColorClose' => $this->iconColorClose,
359
+ 'iconBackgroundColorClose' => $this->iconBackgroundColorClose,
360
+
361
+ 'labelTextOpen' => $this->labelTextOpen, // PRO only
362
+ 'labelBackgroundColorOpen' => $this->labelBackgroundColorOpen, // PRO only
363
+ 'labelTextColorOpen' => $this->labelTextColorOpen, // PRO only
364
+
365
+ 'labelTextClose' => $this->labelTextClose, // PRO only
366
+ 'labelBackgroundColorClose' => $this->labelBackgroundColorClose, // PRO only
367
+ 'labelTextColorClose' => $this->labelTextColorClose, // PRO only
368
  );
369
  }
370
 
371
  public static function fromObject( $object ) {
372
+ $options = new CnbMultiButtonOptions();
373
+ $options->id = CnbUtils::getPropertyOrNull( $object, 'id' );
374
+ $options->iconColor = CnbUtils::getPropertyOrNull( $object, 'iconColor' );
375
+ $options->iconBackgroundColor = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundColor' );
376
+
377
+ $options->iconTypeOpen = CnbUtils::getPropertyOrNull( $object, 'iconTypeOpen' );
378
+ $options->iconTextOpen = CnbUtils::getPropertyOrNull( $object, 'iconTextOpen' );
379
+ $options->iconBackgroundImageOpen = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundImageOpen' );
380
+ $options->iconClassOpen = CnbUtils::getPropertyOrNull( $object, 'iconClassOpen' );
381
+ $options->iconColorOpen = CnbUtils::getPropertyOrNull( $object, 'iconColorOpen' );
382
+ $options->iconBackgroundColorOpen = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundColorOpen' );
383
+
384
+ $options->iconTypeClose = CnbUtils::getPropertyOrNull( $object, 'iconTypeClose' );
385
+ $options->iconTextClose = CnbUtils::getPropertyOrNull( $object, 'iconTextClose' );
386
+ $options->iconBackgroundImageClose = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundImageClose' );
387
+ $options->iconClassClose = CnbUtils::getPropertyOrNull( $object, 'iconClassClose' );
388
+ $options->iconColorClose = CnbUtils::getPropertyOrNull( $object, 'iconColorClose' );
389
+ $options->iconBackgroundColorClose = CnbUtils::getPropertyOrNull( $object, 'iconBackgroundColorClose' );
390
+
391
+ $options->labelTextOpen = CnbUtils::getPropertyOrNull( $object, 'labelTextOpen' );
392
+ $options->labelBackgroundColorOpen = CnbUtils::getPropertyOrNull( $object, 'labelBackgroundColorOpen' );
393
+ $options->labelTextColorOpen = CnbUtils::getPropertyOrNull( $object, 'labelTextColorOpen' );
394
+
395
+ $options->labelTextClose = CnbUtils::getPropertyOrNull( $object, 'labelTextClose' );
396
+ $options->labelBackgroundColorClose = CnbUtils::getPropertyOrNull( $object, 'labelBackgroundColorClose' );
397
+ $options->labelTextColorClose = CnbUtils::getPropertyOrNull( $object, 'labelTextColorClose' );
398
 
399
  return $options;
400
  }
425
 
426
  public function toArray() {
427
  return array(
428
+ 'revealAtHeight' => $this->revealAtHeight,
429
+ 'hideAtHeight' => $this->hideAtHeight,
430
+ 'neverHide' => $this->neverHide,
431
  );
432
  }
433
 
434
  public static function fromObject( $object ) {
435
  $options = new CnbScrollOptions();
436
+ $options->revealAtHeight = intval( CnbUtils::getPropertyOrNull( $object, 'revealAtHeight' ) );
437
+ $options->hideAtHeight = intval( CnbUtils::getPropertyOrNull( $object, 'hideAtHeight' ) );
438
  // phpcs:ignore PHPCompatibility.FunctionUse
439
+ $options->neverHide = boolval( CnbUtils::getPropertyOrNull( $object, 'neverHide' ) );
440
 
441
  return $options;
442
  }
src/admin/button/CnbButtonView.php CHANGED
@@ -26,7 +26,8 @@ class CnbButtonView {
26
  array(
27
  'TB_inline' => 'true',
28
  'inlineId' => 'cnb-add-new-modal',
29
- 'height' => '452', // 433 + 19 (19 for PRO message) seems ideal -> To hide the scrollbar. 500 to include validation errors
 
30
  'page' => 'call-now-button',
31
  'action' => 'new',
32
  'type' => 'single',
@@ -79,6 +80,27 @@ class CnbButtonView {
79
  }
80
  }
81
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
82
  function render() {
83
  $cnb_cloud_domain = CnbAppRemote::cnb_remote_get_wp_domain();
84
 
@@ -103,10 +125,11 @@ class CnbButtonView {
103
  $views = $wp_list_table->get_views();
104
  $active_views = isset( $views['active'] ) ? $views['active'] : '';
105
  if ( false !== strpos( $active_views, '(0)' ) ) {
106
- $message = '<p>You have no active buttons. The Call Now Button is not visible to your visitors.</p>';
107
  CnbAdminNotices::get_instance()->warning( $message );
108
  }
109
  }
 
110
 
111
  wp_enqueue_script( CNB_SLUG . '-form-bulk-rewrite' );
112
  do_action( 'cnb_header' );
@@ -143,29 +166,31 @@ class CnbButtonView {
143
  if ( isset( $upgrade_url ) && $upgrade_url ) {
144
  echo '<div class="cnb-postbox-container cnb-side-column"> <!-- Sidebar promo boxes -->';
145
  if ( $domain !== null && ! ( $domain instanceof WP_Error ) && $domain->type !== 'PRO' ) {
146
- $promoboxes = range(1,3);
147
- shuffle($promoboxes);
148
- $promoItem = array_rand($promoboxes);
149
  $schedule_illustration = plugins_url( '../../../resources/images/scheduler.png', __FILE__ );
150
- $custom_image = plugins_url( '../../../resources/images/custom-image.jpg', __FILE__ );
151
- if ( $promoItem == 1) {
152
  ( new CnbAdminFunctions() )->cnb_promobox(
153
  'green',
154
  'Schedule your buttons',
155
  '<h4 class="cnb-center">Show a call button during office hours</h4>' .
156
  '<div class="cnb-center" style="padding: 10px 30px"><img src="' . esc_url( $schedule_illustration ) . '" alt="Upgrade your domain to PRO with an extra discount" style="max-width:300px; width:100%; height:auto;" /></div>' .
157
- '<h4 class="cnb-center">A mail button when you\'re off.</h4>' ,
158
  'clock',
159
  'Try PRO 14 days free',
160
  'Upgrade',
161
  $upgrade_url
162
  );
163
- } elseif ( $promoItem == 2) {
164
  ( new CnbAdminFunctions() )->cnb_promobox(
165
  'green',
166
  'Professional features',
167
- '<p><span class="dashicons dashicons-yes cnb-green"></span> Button scheduler<br>
168
- <span class="dashicons dashicons-yes cnb-green"></span> Icons & custom images on buttons<br>
 
 
169
  <span class="dashicons dashicons-yes cnb-green"></span> Advanced display rules<br>
170
  <span class="dashicons dashicons-yes cnb-green"></span> Geo targeting<br>
171
  <span class="dashicons dashicons-yes cnb-green"></span> Set scroll height for buttons to appear<br>
@@ -227,7 +252,7 @@ class CnbButtonView {
227
  $button = CnbButton::createDummyButton( $domain );
228
 
229
  $options = array( 'modal_view' => true, 'submit_button_text' => 'Next' );
230
- ( new CnbButtonViewEdit() )->render_form( $button, $domain, $options );
231
  echo '</div></div>';
232
 
233
  }
26
  array(
27
  'TB_inline' => 'true',
28
  'inlineId' => 'cnb-add-new-modal',
29
+ 'height' => '452',
30
+ // 433 + 19 (19 for PRO message) seems ideal -> To hide the scrollbar. 500 to include validation errors
31
  'page' => 'call-now-button',
32
  'action' => 'new',
33
  'type' => 'single',
80
  }
81
  }
82
 
83
+ public function BlackFridayNotice( $domain ) {
84
+ if ( $domain !== null && ! ( $domain instanceof WP_Error ) && $domain->type !== 'PRO' ) {
85
+ $cnb_utils = new CnbUtils();
86
+ $coupon = ( new CnbAppRemotePromotionCodes() )->get_coupon();
87
+ if ( $coupon !== null && ! is_wp_error( $coupon ) ) {
88
+ $promoMessage = ' Upgrade to PRO with coupon code <strong><code>' . esc_html( $coupon->code ) . '</code></strong> to get 40% off your first bill!';
89
+ $upgrade_url = $cnb_utils->get_cnb_domain_upgrade( $domain );
90
+ if ( isset( $upgrade_url ) && $upgrade_url ) {
91
+ $promoMessage .= ' <a style="color:#00d600; font-weight:600;" href="' . esc_url( $upgrade_url ) . '">Click here!</a>';
92
+ }
93
+ if ( $coupon->code === 'BLACKFRIDAY22WP' ) {
94
+ $message = '<p>💰 <strong>BLACK FRIDAY DEAL!</strong> 💰' . $promoMessage . '</p>';
95
+ CnbAdminNotices::get_instance()->blackfriday( $message );
96
+ } elseif ( $coupon->code === 'CYBERMONDAY22WP' ) {
97
+ $message = '<p>🤖 <strong>CYBER MONDAY DEAL!</strong> 🤖' . $promoMessage . '</p>';
98
+ CnbAdminNotices::get_instance()->blackfriday( $message );
99
+ }
100
+ }
101
+ }
102
+ }
103
+
104
  function render() {
105
  $cnb_cloud_domain = CnbAppRemote::cnb_remote_get_wp_domain();
106
 
125
  $views = $wp_list_table->get_views();
126
  $active_views = isset( $views['active'] ) ? $views['active'] : '';
127
  if ( false !== strpos( $active_views, '(0)' ) ) {
128
+ $message = '<p>You currently have no active buttons.</p>';
129
  CnbAdminNotices::get_instance()->warning( $message );
130
  }
131
  }
132
+ $this->BlackFridayNotice( $cnb_cloud_domain );
133
 
134
  wp_enqueue_script( CNB_SLUG . '-form-bulk-rewrite' );
135
  do_action( 'cnb_header' );
166
  if ( isset( $upgrade_url ) && $upgrade_url ) {
167
  echo '<div class="cnb-postbox-container cnb-side-column"> <!-- Sidebar promo boxes -->';
168
  if ( $domain !== null && ! ( $domain instanceof WP_Error ) && $domain->type !== 'PRO' ) {
169
+ $promoboxes = range( 1, 3 );
170
+ shuffle( $promoboxes );
171
+ $promoItem = array_rand( $promoboxes );
172
  $schedule_illustration = plugins_url( '../../../resources/images/scheduler.png', __FILE__ );
173
+ $custom_image = plugins_url( '../../../resources/images/custom-image.jpg', __FILE__ );
174
+ if ( $promoItem == 1 ) {
175
  ( new CnbAdminFunctions() )->cnb_promobox(
176
  'green',
177
  'Schedule your buttons',
178
  '<h4 class="cnb-center">Show a call button during office hours</h4>' .
179
  '<div class="cnb-center" style="padding: 10px 30px"><img src="' . esc_url( $schedule_illustration ) . '" alt="Upgrade your domain to PRO with an extra discount" style="max-width:300px; width:100%; height:auto;" /></div>' .
180
+ '<h4 class="cnb-center">A mail button when you\'re off.</h4>',
181
  'clock',
182
  'Try PRO 14 days free',
183
  'Upgrade',
184
  $upgrade_url
185
  );
186
+ } elseif ( $promoItem == 2 ) {
187
  ( new CnbAdminFunctions() )->cnb_promobox(
188
  'green',
189
  'Professional features',
190
+ '<p>
191
+ <span class="dashicons dashicons-yes cnb-green"></span> Button scheduler<br>
192
+ <span class="dashicons dashicons-yes cnb-green"></span> Multi-action buttons<br>
193
+ <span class="dashicons dashicons-yes cnb-green"></span> Icon picker & custom images<br>
194
  <span class="dashicons dashicons-yes cnb-green"></span> Advanced display rules<br>
195
  <span class="dashicons dashicons-yes cnb-green"></span> Geo targeting<br>
196
  <span class="dashicons dashicons-yes cnb-green"></span> Set scroll height for buttons to appear<br>
252
  $button = CnbButton::createDummyButton( $domain );
253
 
254
  $options = array( 'modal_view' => true, 'submit_button_text' => 'Next' );
255
+ ( new CnbButtonViewEdit() )->render_form( $button, $domain, $options );
256
  echo '</div></div>';
257
 
258
  }
src/admin/button/CnbButtonViewEdit.php CHANGED
@@ -83,6 +83,7 @@ class CnbButtonViewEdit {
83
  wp_enqueue_script( CNB_SLUG . '-preview' );
84
  wp_enqueue_script( CNB_SLUG . '-client' );
85
  wp_enqueue_script( CNB_SLUG . '-button-edit' );
 
86
  wp_enqueue_script( CNB_SLUG . '-action-edit' );
87
  wp_enqueue_script( CNB_SLUG . '-condition-edit' );
88
  wp_enqueue_style( CNB_SLUG . '-client' );
83
  wp_enqueue_script( CNB_SLUG . '-preview' );
84
  wp_enqueue_script( CNB_SLUG . '-client' );
85
  wp_enqueue_script( CNB_SLUG . '-button-edit' );
86
+ wp_enqueue_script( CNB_SLUG . '-button-edit-icon-color' );
87
  wp_enqueue_script( CNB_SLUG . '-action-edit' );
88
  wp_enqueue_script( CNB_SLUG . '-condition-edit' );
89
  wp_enqueue_style( CNB_SLUG . '-client' );
src/admin/button/partials/class-button-edit-table.php CHANGED
@@ -79,12 +79,12 @@ class Button_Edit_Table {
79
  class="cnb_toggle_state cnb_toggle_true">Active</span>
80
  </td>
81
  </tr>
82
- <tr>
83
  <th scope="row"><label for="button_name">Button name</label></th>
84
 
85
  <td class="activated">
86
  <input type="text" name="button[name]" id="button_name" required="required"
87
- value="<?php echo esc_attr( $button->name ); ?>"/>
88
  </td>
89
  </tr>
90
  <tr class="cnb_hide_on_modal cnb_advanced_view">
@@ -171,7 +171,7 @@ class Button_Edit_Table {
171
  </script>
172
 
173
  <?php if ( $button->id === 'new' ) { ?>
174
- <tr>
175
  <th scope="row">Select button type</th>
176
  </tr>
177
  <tr>
@@ -192,15 +192,16 @@ class Button_Edit_Table {
192
  <?php if ( $default_domain->type === 'STARTER' ) { ?><span
193
  class="cnb-pro-badge">Pro</span><?php } ?>
194
  </div>
 
 
 
 
 
 
 
 
195
  </div>
196
- <?php if ( $default_domain->type === 'STARTER' ) { ?>
197
- <div class="cnb-pro-overlay">
198
- <p class="description">
199
- Multibutton is a <span class="cnb-pro-badge">Pro</span> feature.
200
- <a href="<?php echo esc_url( $upgrade_link ) ?>">Upgrade</a> here.
201
- </p>
202
- </div>
203
- <?php } ?>
204
  <div class="cnb_type_selector cnb_type_selector_item cnb_type_selector_full"
205
  data-cnb-selection="full">
206
  <img style="max-width:100%;" alt="Select the Buttonbar"
@@ -229,6 +230,9 @@ class Button_Edit_Table {
229
  $cnb_utils = new CnbUtils();
230
  $action = $this->get_action( $button );
231
 
 
 
 
232
  $upgrade_link =
233
  add_query_arg( array(
234
  'page' => 'call-now-button-domains',
@@ -241,13 +245,9 @@ class Button_Edit_Table {
241
  <table class="form-table <?php echo esc_attr( $adminFunctions->is_active_tab( 'extra_options' ) ) ?>"
242
  data-tab-name="extra_options">
243
  <?php if ( $button->type === 'FULL' ) { ?>
244
- <tr class="cnb_hide_on_modal">
245
- <th></th>
246
- <td></td>
247
- </tr>
248
  <tr class="cnb_advanced_view">
249
  <th colspan="2">
250
- <h3>Colors for the Buttonbar are defined via the individual Action(s).</h3>
251
  <input name="button[options][iconBackgroundColor]" type="hidden"
252
  value="<?php echo esc_attr( $button->options->iconBackgroundColor ); ?>"/>
253
  <input name="button[options][iconColor]" type="hidden"
@@ -277,7 +277,7 @@ class Button_Edit_Table {
277
  <td>
278
  <input name="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]"
279
  id="actions-options-iconBackgroundColor" type="text"
280
- value="<?php echo esc_attr( $backgroundColor ); ?>" class="cnb-iconcolor-field"
281
  data-default-color="#009900"/>
282
  </td>
283
  </tr>
@@ -286,174 +286,22 @@ class Button_Edit_Table {
286
  <td>
287
  <input name="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]"
288
  id="actions-options-iconColor" type="text"
289
- value="<?php echo esc_attr( $iconColor ); ?>" class="cnb-iconcolor-field"
290
  data-default-color="#FFFFFF"/>
291
  </td>
292
  </tr>
293
 
294
  <?php } else if ( $button->type === 'MULTI' ) {
295
- $backgroundColor = ( $button->options && $button->options->iconBackgroundColor ) ? $button->options->iconBackgroundColor :
296
- ( $button->multiButtonOptions ? $button->multiButtonOptions->iconBackgroundColor : '#009900' );
297
- $iconColor = ( $button->options && $button->options->iconColor ) ? $button->options->iconColor :
298
- ( $button->multiButtonOptions ? $button->multiButtonOptions->iconColor : '#FFFFFF' );
299
- $multi_button_id = ( $button->multiButtonOptions && $button->multiButtonOptions->id ) ? $button->multiButtonOptions->id : '';
300
- $iconTextOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTextOpen ) ? $button->multiButtonOptions->iconTextOpen : 'more_vert';
301
- $iconTypeOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTypeOpen ) ? $button->multiButtonOptions->iconTypeOpen : 'FONT';
302
- $iconTextClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTextClose ) ? $button->multiButtonOptions->iconTextClose : 'close';
303
- $iconTypeClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTypeClose ) ? $button->multiButtonOptions->iconTypeClose : 'FONT';
304
- $labelText = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTypeClose ) ? $button->multiButtonOptions->labelText : null;
305
- $labelBackgroundColor = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTypeClose ) ? $button->multiButtonOptions->labelBackgroundColor : null;
306
  ?>
307
- <tr class="cnb_hide_on_modal">
308
- <th></th>
309
- <td></td>
310
- </tr>
311
  <tr>
312
- <th scope="row"><label for="button-multiButtonOptions-iconBackgroundColor">Main button
313
- color</label></th>
314
- <td>
315
- <input name="button[multiButtonOptions][id]" type="hidden"
316
- value="<?php echo esc_attr( $multi_button_id ); ?>"/>
317
- <input name="button[multiButtonOptions][iconBackgroundColor]"
318
- id="button-multiButtonOptions-iconBackgroundColor" type="text"
319
- value="<?php echo esc_attr( $backgroundColor ); ?>"
320
- class="cnb-iconcolor-field" data-default-color="#009900"/>
321
- </td>
322
  </tr>
323
- <tr>
324
- <th scope="row"><label for="button-multiButtonOptions-iconColor">Main icon color</label></th>
325
- <td>
326
- <input name="button[multiButtonOptions][iconColor]" id="button-multiButtonOptions-iconColor"
327
- type="text" value="<?php echo esc_attr( $iconColor ); ?>"
328
- class="cnb-iconcolor-field" data-default-color="#FFFFFF"/>
329
- </td>
330
- </tr>
331
- <tr>
332
- <th scope="row"><label for="button-multiButtonOptions-iconTextOpen">Main icon</label></th>
333
- <td>
334
- <div class="icon-text-options" id="icon-text-open"
335
- data-icon-text-target="button-multiButtonOptions-iconTextOpen"
336
- data-icon-type-target="button-multiButtonOptions-iconTypeOpen">
337
- <div class="cnb-button-icon">
338
- <i class="cnb-font-icon" data-icon-type="FONT"
339
- data-icon-text="more_vert">more_vert</i>
340
- </div>
341
- <div class="cnb-button-icon">
342
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="menu">menu</i>
343
- </div>
344
- <div class="cnb-button-icon">
345
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="support">support</i>
346
- </div>
347
- <div class="cnb-button-icon">
348
- <i class="cnb-font-icon" data-icon-type="FONT"
349
- data-icon-text="communicate">communicate</i>
350
- </div>
351
- <div class="cnb-button-icon">
352
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="more_info">more_info</i>
353
- </div>
354
- <div class="cnb-button-icon">
355
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="conversation">conversation</i>
356
- </div>
357
- <div class="cnb-button-icon">
358
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call3">call3</i>
359
- </div>
360
- <div class="cnb-button-icon">
361
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="whatsapp">whatsapp</i>
362
- </div>
363
- <div class="cnb-button-icon">
364
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="email">email</i>
365
- </div>
366
- <div class="cnb-button-icon">
367
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call">call</i>
368
- </div>
369
- <div class="cnb-button-icon">
370
- <i class="cnb-font-icon" data-icon-type="FONT"
371
- data-icon-text="directions3">directions3</i>
372
- </div>
373
- </div>
374
- <div class="cnb_advanced_view">
375
- <a
376
- href="#"
377
- onclick="return cnb_show_icon_text_advanced(this)"
378
- data-icon-text="button-multiButtonOptions-iconTextOpen"
379
- data-icon-type="button-multiButtonOptions-iconTypeOpen"
380
- data-description="button-multiButtonOptions-iconTextOpen-description"
381
- class="cnb_advanced_view">Use a custom icon</a>
382
- <input name="button[multiButtonOptions][iconTextOpen]"
383
- id="button-multiButtonOptions-iconTextOpen" type="hidden"
384
- value="<?php echo esc_attr( $iconTextOpen ); ?>"/>
385
- <input name="button[multiButtonOptions][iconTypeOpen]"
386
- id="button-multiButtonOptions-iconTypeOpen" type="hidden"
387
- value="<?php echo esc_attr( $iconTypeOpen ); ?>"/>
388
- <p class="description" id="button-multiButtonOptions-iconTextOpen-description"
389
- style="display: none">
390
- You can enter a custom Material Design font code here. Search the full library at <a
391
- href="https://fonts.google.com/icons" target="_blank">Google Fonts</a>.<br/>
392
- The Call Now Button uses the <code>filled</code> version of icons.</p>
393
- </div>
394
- </td>
395
- </tr>
396
- <tr class="cnb_advanced_view">
397
- <th scope="row"><label for="button-multiButtonOptions-iconTextClose">Close Icon</label></th>
398
- <td>
399
- <div class="icon-text-options" id="icon-text-close"
400
- data-icon-text-target="button-multiButtonOptions-iconTextClose"
401
- data-icon-type-target="button-multiButtonOptions-iconTypeClose">
402
- <div class="cnb-button-icon">
403
- <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="close">close</i>
404
- </div>
405
- <div class="cnb-button-icon">
406
- <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
407
- data-icon-text="cancel">cancel</i>
408
- </div>
409
- <div class="cnb-button-icon">
410
- <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
411
- data-icon-text="close">close</i>
412
- </div>
413
- <div class="cnb-button-icon">
414
- <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
415
- data-icon-text="zoom_in_map">zoom_in_map</i>
416
- </div>
417
- </div>
418
- <a
419
- href="#"
420
- onclick="return cnb_show_icon_text_advanced(this)"
421
- data-icon-text="button-multiButtonOptions-iconTextClose"
422
- data-icon-type="button-multiButtonOptions-iconTypeClose"
423
- data-description="button-multiButtonOptions-iconTextClose-description"
424
- class="cnb_advanced_view">Use a custom icon</a>
425
- <input name="button[multiButtonOptions][iconTextClose]"
426
- id="button-multiButtonOptions-iconTextClose" type="hidden"
427
- value="<?php echo esc_attr( $iconTextClose ); ?>"/>
428
- <input name="button[multiButtonOptions][iconTypeClose]"
429
- id="button-multiButtonOptions-iconTypeClose" type="hidden"
430
- value="<?php echo esc_attr( $iconTypeClose ); ?>"/>
431
- <p class="description" id="button-multiButtonOptions-iconTextClose-description"
432
- style="display: none">
433
- You can enter a custom Material Design font code here. Search the full library at <a
434
- href="https://fonts.google.com/icons" target="_blank">Google Fonts</a>.<br/>
435
- The Call Now Button uses the <code>filled</code> version of icons.</p>
436
- </td>
437
- </tr>
438
- <tr class="cnb_advanced_view">
439
- <th scope="row"><label for="button-multiButtonOptions-labelText">Label text (when open)</label>
440
- </th>
441
- <td>
442
- <input name="button[multiButtonOptions][labelText]" id="button-multiButtonOptions-labelText"
443
- type="text" value="<?php echo esc_attr( $labelText ); ?>"/>
444
- </td>
445
- </tr>
446
- <tr class="cnb_advanced_view">
447
- <th scope="row"><label for="button-multiButtonOptions-labelBackgroundColor">Label background
448
- color</label></th>
449
- <td>
450
- <input name="button[multiButtonOptions][labelBackgroundColor]"
451
- id="button-multiButtonOptions-labelBackgroundColor" type="text"
452
- value="<?php echo esc_attr( $labelBackgroundColor ); ?>"
453
- class="cnb-iconcolor-field" data-default-color="#3c434a"/>
454
- </td>
455
- </tr>
456
- <?php } ?>
457
  <tr>
458
  <th scope="row">Position <a
459
  href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/button-position/', 'question-mark', 'button-position' ) ) ?>"
79
  class="cnb_toggle_state cnb_toggle_true">Active</span>
80
  </td>
81
  </tr>
82
+ <tr class="cnb_button_name">
83
  <th scope="row"><label for="button_name">Button name</label></th>
84
 
85
  <td class="activated">
86
  <input type="text" name="button[name]" id="button_name" required="required"
87
+ value="<?php echo esc_attr( $button->name ); ?>" placeholder="My new button"/>
88
  </td>
89
  </tr>
90
  <tr class="cnb_hide_on_modal cnb_advanced_view">
171
  </script>
172
 
173
  <?php if ( $button->id === 'new' ) { ?>
174
+ <tr class="cnb_button_type">
175
  <th scope="row">Select button type</th>
176
  </tr>
177
  <tr>
192
  <?php if ( $default_domain->type === 'STARTER' ) { ?><span
193
  class="cnb-pro-badge">Pro</span><?php } ?>
194
  </div>
195
+ <?php if ( $default_domain->type === 'STARTER' ) { ?>
196
+ <div class="cnb-pro-overlay">
197
+ <p class="description">
198
+ Multibutton is a <span class="cnb-pro-badge">Pro</span> feature.
199
+ <a href="<?php echo esc_url( $upgrade_link ) ?>">Upgrade</a> here.
200
+ </p>
201
+ </div>
202
+ <?php } ?>
203
  </div>
204
+
 
 
 
 
 
 
 
205
  <div class="cnb_type_selector cnb_type_selector_item cnb_type_selector_full"
206
  data-cnb-selection="full">
207
  <img style="max-width:100%;" alt="Select the Buttonbar"
230
  $cnb_utils = new CnbUtils();
231
  $action = $this->get_action( $button );
232
 
233
+ // For the image selector
234
+ wp_enqueue_media();
235
+
236
  $upgrade_link =
237
  add_query_arg( array(
238
  'page' => 'call-now-button-domains',
245
  <table class="form-table <?php echo esc_attr( $adminFunctions->is_active_tab( 'extra_options' ) ) ?>"
246
  data-tab-name="extra_options">
247
  <?php if ( $button->type === 'FULL' ) { ?>
 
 
 
 
248
  <tr class="cnb_advanced_view">
249
  <th colspan="2">
250
+ <h2>Colors for the Buttonbar are defined via the individual Action(s).</h2>
251
  <input name="button[options][iconBackgroundColor]" type="hidden"
252
  value="<?php echo esc_attr( $button->options->iconBackgroundColor ); ?>"/>
253
  <input name="button[options][iconColor]" type="hidden"
277
  <td>
278
  <input name="actions[<?php echo esc_attr( $action->id ) ?>][backgroundColor]"
279
  id="actions-options-iconBackgroundColor" type="text"
280
+ value="<?php echo esc_attr( $backgroundColor ); ?>" class="cnb-color-field"
281
  data-default-color="#009900"/>
282
  </td>
283
  </tr>
286
  <td>
287
  <input name="actions[<?php echo esc_attr( $action->id ) ?>][iconColor]"
288
  id="actions-options-iconColor" type="text"
289
+ value="<?php echo esc_attr( $iconColor ); ?>" class="cnb-color-field"
290
  data-default-color="#FFFFFF"/>
291
  </td>
292
  </tr>
293
 
294
  <?php } else if ( $button->type === 'MULTI' ) {
 
 
 
 
 
 
 
 
 
 
 
295
  ?>
 
 
 
 
296
  <tr>
297
+ <td colspan="2"></td>
 
 
 
 
 
 
 
 
 
298
  </tr>
299
+ <?php
300
+ $icon_picker = new Button_Icon_Picker();
301
+ $icon_picker->render($button);
302
+ $label_editor = new Button_Label();
303
+ $label_editor->render($button);
304
+ } ?>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
305
  <tr>
306
  <th scope="row">Position <a
307
  href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/button-position/', 'question-mark', 'button-position' ) ) ?>"
src/admin/button/partials/class-button-icon-picker.php ADDED
@@ -0,0 +1,280 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+
3
+ namespace cnb\admin\button;
4
+
5
+ // don't load directly
6
+ defined( 'ABSPATH' ) || die( '-1' );
7
+
8
+ class Button_Icon_Picker {
9
+
10
+ /**
11
+ * @param CnbButton $button
12
+ *
13
+ * @return string
14
+ */
15
+ private function getIconBackGroundOpen( $button ) {
16
+ if ( $button->multiButtonOptions ) {
17
+ if ( $button->multiButtonOptions->iconBackgroundColorOpen ) {
18
+ return $button->multiButtonOptions->iconBackgroundColorOpen;
19
+ }
20
+ if ( $button->multiButtonOptions->iconBackgroundColor ) {
21
+ return $button->multiButtonOptions->iconBackgroundColor;
22
+ }
23
+ }
24
+ if ( $button->options && $button->options->iconBackgroundColor ) {
25
+ return $button->options->iconBackgroundColor;
26
+ }
27
+
28
+ return '#009900';
29
+ }
30
+
31
+ /**
32
+ * @param CnbButton $button
33
+ *
34
+ * @return string
35
+ */
36
+ private function getIconColorOpen( $button ) {
37
+ if ( $button->multiButtonOptions ) {
38
+ if ( $button->multiButtonOptions->iconColorOpen ) {
39
+ return $button->multiButtonOptions->iconColorOpen;
40
+ }
41
+ if ( $button->multiButtonOptions->iconColor ) {
42
+ return $button->multiButtonOptions->iconColor;
43
+ }
44
+ }
45
+ if ( $button->options && $button->options->iconColor ) {
46
+ return $button->options->iconColor;
47
+ }
48
+
49
+ return '#FFFFFF';
50
+ }
51
+
52
+ /**
53
+ * @param CnbButton $button
54
+ *
55
+ * @return void
56
+ */
57
+ public function render( $button ) {
58
+ $multi_button_id = ( $button->multiButtonOptions && $button->multiButtonOptions->id ) ? $button->multiButtonOptions->id : '';
59
+
60
+ $iconTypeOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTypeOpen ) ? $button->multiButtonOptions->iconTypeOpen : 'FONT';
61
+ $iconTextOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTextOpen ) ? $button->multiButtonOptions->iconTextOpen : 'more_vert';
62
+ $iconBackgroundImageOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->iconBackgroundImageOpen ) ? $button->multiButtonOptions->iconBackgroundImageOpen : '';
63
+ $iconColorOpen = $this->getIconColorOpen( $button );
64
+ $iconBackgroundColorOpen = $this->getIconBackGroundOpen( $button );
65
+
66
+ $iconTypeClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTypeClose ) ? $button->multiButtonOptions->iconTypeClose : 'FONT';
67
+ $iconTextClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconTextClose ) ? $button->multiButtonOptions->iconTextClose : 'close';
68
+ $iconBackgroundImageClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconBackgroundImageClose ) ? $button->multiButtonOptions->iconBackgroundImageClose : '';
69
+ $iconColorClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconColorClose ) ? $button->multiButtonOptions->iconColorClose : $iconColorOpen;
70
+ $iconBackgroundColorClose = ( $button->multiButtonOptions && $button->multiButtonOptions->iconBackgroundColorClose ) ? $button->multiButtonOptions->iconBackgroundColorClose : $iconBackgroundColorOpen;
71
+
72
+ ?>
73
+ <tr>
74
+ <th scope="row">
75
+ <label for="button-multiButtonOptions-iconBackgroundColorOpen">
76
+ Button color
77
+ </label>
78
+ </th>
79
+ <td>
80
+ <input name="button[multiButtonOptions][id]" type="hidden"
81
+ value="<?php echo esc_attr( $multi_button_id ); ?>"/>
82
+ <input name="button[multiButtonOptions][iconBackgroundColorOpen]"
83
+ id="button-multiButtonOptions-iconBackgroundColorOpen" type="text"
84
+ value="<?php echo esc_attr( $iconBackgroundColorOpen ); ?>"
85
+ class="cnb-color-field" data-default-color="#009900"/>
86
+ </td>
87
+ </tr>
88
+ <tr>
89
+ <th scope="row">
90
+ <label for="button-multiButtonOptions-iconColorOpen">
91
+ Icon color
92
+ </label>
93
+ </th>
94
+ <td>
95
+ <input name="button[multiButtonOptions][iconColorOpen]" id="button-multiButtonOptions-iconColorOpen"
96
+ type="text" value="<?php echo esc_attr( $iconColorOpen ); ?>"
97
+ class="cnb-color-field" data-default-color="#FFFFFF"/>
98
+ </td>
99
+ </tr>
100
+ <tr>
101
+ <th scope="row">
102
+ <label for="button-multiButtonOptions-iconTextOpen">
103
+ Button icon/image
104
+ </label>
105
+ </th>
106
+ <td>
107
+ <div class="icon-text-options" id="icon-text-open"
108
+ data-icon-text-target="button-multiButtonOptions-iconTextOpen"
109
+ data-icon-type-target="button-multiButtonOptions-iconTypeOpen">
110
+ <div class="cnb-button-icon">
111
+ <i class="cnb-font-icon" data-icon-type="FONT"
112
+ data-icon-text="more_vert">more_vert</i>
113
+ </div>
114
+ <div class="cnb-button-icon">
115
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="menu">menu</i>
116
+ </div>
117
+ <div class="cnb-button-icon">
118
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="support">support</i>
119
+ </div>
120
+ <div class="cnb-button-icon">
121
+ <i class="cnb-font-icon" data-icon-type="FONT"
122
+ data-icon-text="communicate">communicate</i>
123
+ </div>
124
+ <div class="cnb-button-icon">
125
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="more_info">more_info</i>
126
+ </div>
127
+ <div class="cnb-button-icon">
128
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="conversation">conversation</i>
129
+ </div>
130
+ <div class="cnb-button-icon">
131
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call3">call3</i>
132
+ </div>
133
+ <div class="cnb-button-icon">
134
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="whatsapp">whatsapp</i>
135
+ </div>
136
+ <div class="cnb-button-icon">
137
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="email">email</i>
138
+ </div>
139
+ <div class="cnb-button-icon">
140
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="call">call</i>
141
+ </div>
142
+ <div class="cnb-button-icon">
143
+ <i class="cnb-font-icon" data-icon-type="FONT"
144
+ data-icon-text="directions3">directions3</i>
145
+ </div>
146
+ <?php
147
+ $this->render_image_selector( 'iconBackgroundImageOpen', $iconBackgroundImageOpen );
148
+ ?>
149
+ </div>
150
+ <div class="cnb_advanced_view">
151
+ <a
152
+ href="#"
153
+ onclick="return cnb_show_icon_text_advanced(this)"
154
+ data-icon-text="button-multiButtonOptions-iconTextOpen"
155
+ data-icon-type="button-multiButtonOptions-iconTypeOpen"
156
+ data-description="button-multiButtonOptions-iconTextOpen-description"
157
+ class="cnb_advanced_view">Use a custom icon</a>
158
+ <input name="button[multiButtonOptions][iconTextOpen]"
159
+ id="button-multiButtonOptions-iconTextOpen" type="hidden"
160
+ data-cnb-multi-do-not-expand="true"
161
+ value="<?php echo esc_attr( $iconTextOpen ); ?>"/>
162
+ <input name="button[multiButtonOptions][iconTypeOpen]"
163
+ id="button-multiButtonOptions-iconTypeOpen" type="hidden"
164
+ value="<?php echo esc_attr( $iconTypeOpen ); ?>"/>
165
+ <p class="description" id="button-multiButtonOptions-iconTextOpen-description"
166
+ style="display: none">
167
+ You can enter a custom Material Design font code here. Search the full library at <a
168
+ href="https://fonts.google.com/icons" target="_blank">Google Fonts</a>.<br/>
169
+ The Call Now Button uses the <code>filled</code> version of icons.</p>
170
+ </div>
171
+ </td>
172
+ </tr>
173
+
174
+ <tr class="cnb_advanced_view">
175
+ <th scope="row">
176
+ <label for="button-multiButtonOptions-iconBackgroundColorClose">
177
+ Close button color
178
+ </label>
179
+ </th>
180
+ <td>
181
+ <input name="button[multiButtonOptions][id]" type="hidden"
182
+ value="<?php echo esc_attr( $multi_button_id ); ?>"/>
183
+ <input name="button[multiButtonOptions][iconBackgroundColorClose]"
184
+ id="button-multiButtonOptions-iconBackgroundColorClose" type="text"
185
+ value="<?php echo esc_attr( $iconBackgroundColorClose ); ?>"
186
+ class="cnb-color-field" data-default-color="#009900"/>
187
+ </td>
188
+ </tr>
189
+ <tr class="cnb_advanced_view">
190
+ <th scope="row">
191
+ <label for="button-multiButtonOptions-iconColorClose">
192
+ Close icon color
193
+ </label>
194
+ </th>
195
+ <td>
196
+ <input name="button[multiButtonOptions][iconColorClose]" id="button-multiButtonOptions-iconColorClose"
197
+ type="text" value="<?php echo esc_attr( $iconColorClose ); ?>"
198
+ class="cnb-color-field" data-default-color="#FFFFFF"/>
199
+ </td>
200
+ </tr>
201
+ <tr class="cnb_advanced_view">
202
+ <th scope="row">
203
+ <label for="button-multiButtonOptions-iconTextClose">
204
+ Close Icon
205
+ </label>
206
+ </th>
207
+ <td>
208
+ <div class="icon-text-options" id="icon-text-close"
209
+ data-icon-text-target="button-multiButtonOptions-iconTextClose"
210
+ data-icon-type-target="button-multiButtonOptions-iconTypeClose">
211
+ <div class="cnb-button-icon">
212
+ <i class="cnb-font-icon" data-icon-type="FONT" data-icon-text="close">close</i>
213
+ </div>
214
+ <div class="cnb-button-icon">
215
+ <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
216
+ data-icon-text="cancel">cancel</i>
217
+ </div>
218
+ <div class="cnb-button-icon">
219
+ <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
220
+ data-icon-text="close">close</i>
221
+ </div>
222
+ <div class="cnb-button-icon">
223
+ <i class="cnb-font-icon family-material" data-icon-type="FONT_MATERIAL"
224
+ data-icon-text="zoom_in_map">zoom_in_map</i>
225
+ </div>
226
+ <?php
227
+ $this->render_image_selector( 'iconBackgroundImageClose', $iconBackgroundImageClose );
228
+
229
+ ?>
230
+ </div>
231
+ <a
232
+ href="#"
233
+ onclick="return cnb_show_icon_text_advanced(this)"
234
+ data-icon-text="button-multiButtonOptions-iconTextClose"
235
+ data-icon-type="button-multiButtonOptions-iconTypeClose"
236
+ data-description="button-multiButtonOptions-iconTextClose-description"
237
+ class="cnb_advanced_view">Use a custom icon</a>
238
+ <input name="button[multiButtonOptions][iconTextClose]"
239
+ id="button-multiButtonOptions-iconTextClose" type="hidden"
240
+ value="<?php echo esc_attr( $iconTextClose ); ?>"/>
241
+ <input name="button[multiButtonOptions][iconTypeClose]"
242
+ id="button-multiButtonOptions-iconTypeClose" type="hidden"
243
+ value="<?php echo esc_attr( $iconTypeClose ); ?>"/>
244
+ <p class="description" id="button-multiButtonOptions-iconTextClose-description"
245
+ style="display: none">
246
+ You can enter a custom Material Design font code here. Search the full library at <a
247
+ href="https://fonts.google.com/icons" target="_blank">Google Fonts</a>.<br/>
248
+ The Call Now Button uses the <code>filled</code> version of icons.</p>
249
+ </td>
250
+ </tr>
251
+
252
+ <?php
253
+ }
254
+
255
+ /**
256
+ * @param string $attribute_name
257
+ *
258
+ * @return void
259
+ */
260
+ private function render_image_selector( $attribute_name, $attribute_value ) { ?>
261
+ <div
262
+ class="cnb-button-icon cnb-button-image cnb_icon_active cnb_selected_action_background_image"
263
+ style="background-image:<?php echo esc_attr( $attribute_value ) ?>"
264
+ ></div>
265
+
266
+ <input
267
+ type="hidden"
268
+ name="button[multiButtonOptions][<?php echo esc_attr( $attribute_name ) ?>]"
269
+ value="<?php echo esc_attr( $attribute_value ) ?>"
270
+ class="cnb_action_icon_background_image"
271
+ />
272
+
273
+ <input
274
+ type='button'
275
+ class="cnb_select_image button-secondary"
276
+ value="<?php esc_attr_e( 'Select image' ); ?>"
277
+ />
278
+ <?php
279
+ }
280
+ }
src/admin/button/partials/class-button-label.php ADDED
@@ -0,0 +1,138 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+
3
+ namespace cnb\admin\button;
4
+
5
+ // don't load directly
6
+ defined( 'ABSPATH' ) || die( '-1' );
7
+
8
+ class Button_Label {
9
+ /**
10
+ * @param CnbButton $button
11
+ *
12
+ * @return void
13
+ */
14
+ public function render( $button ) {
15
+ $this->renderOpen( $button );
16
+ $this->renderClose( $button );
17
+ }
18
+
19
+ /**
20
+ * @param CnbButton $button
21
+ *
22
+ * @return void
23
+ */
24
+ private function renderOpen( $button ) {
25
+ $labelTextOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->labelTextOpen ) ? $button->multiButtonOptions->labelTextOpen : null;
26
+ $labelBackgroundColorOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->labelBackgroundColorOpen ) ? $button->multiButtonOptions->labelBackgroundColorOpen : null;
27
+ $labelTextColorOpen = ( $button->multiButtonOptions && $button->multiButtonOptions->labelTextColorOpen ) ? $button->multiButtonOptions->labelTextColorOpen : null;
28
+
29
+ global $cnb_domain;
30
+ $isPro = $cnb_domain != null && ! is_wp_error( $cnb_domain ) && $cnb_domain->type === 'PRO';
31
+ ?>
32
+ <tr>
33
+ <th scope="row">
34
+ <label for="button-multiButtonOptions-labelTextOpen">
35
+ Button label
36
+ </label>
37
+ <?php if ( ! $isPro ) {
38
+ $upgrade_link =
39
+ add_query_arg( array(
40
+ 'page' => 'call-now-button-domains',
41
+ 'action' => 'upgrade',
42
+ 'id' => $cnb_domain->id
43
+ ),
44
+ admin_url( 'admin.php' ) );
45
+ ?>
46
+ <a href="<?php echo esc_url( $upgrade_link ) ?>"><span class="cnb-pro-badge">Pro</span></a>
47
+ <?php } ?>
48
+ </th>
49
+ <td>
50
+ <input
51
+ data-cnb-multi-do-not-expand="true"
52
+ name="button[multiButtonOptions][labelTextOpen]"
53
+ id="button-multiButtonOptions-labelTextOpen"
54
+ type="text"
55
+ <?php if ( ! $isPro ) { ?>disabled="disabled"<?php } ?>
56
+ value="<?php echo esc_attr( $labelTextOpen ); ?>"
57
+ />
58
+ </td>
59
+ </tr>
60
+ <tr class="cnb_advanced_view">
61
+ <th scope="row">
62
+ <label for="button-multiButtonOptions-labelBackgroundColorOpen">
63
+ Main Label background color
64
+ </label>
65
+ </th>
66
+ <td>
67
+ <input name="button[multiButtonOptions][labelBackgroundColorOpen]"
68
+ id="button-multiButtonOptions-labelBackgroundColorOpen" type="text"
69
+ value="<?php echo esc_attr( $labelBackgroundColorOpen ); ?>"
70
+ class="cnb-color-field" data-default-color="#3c434a"/>
71
+ </td>
72
+ </tr>
73
+ <tr class="cnb_advanced_view">
74
+ <th scope="row">
75
+ <label for="button-multiButtonOptions-labelTextColorOpen">
76
+ Main Label text color
77
+ </label>
78
+ </th>
79
+ <td>
80
+ <input name="button[multiButtonOptions][labelTextColorOpen]"
81
+ id="button-multiButtonOptions-labelTextColorOpen" type="text"
82
+ value="<?php echo esc_attr( $labelTextColorOpen ); ?>"
83
+ class="cnb-color-field" data-default-color="#000000"/>
84
+ </td>
85
+ </tr>
86
+ <?php
87
+ }
88
+
89
+ /**
90
+ * @param CnbButton $button
91
+ *
92
+ * @return void
93
+ */
94
+ private function renderClose( $button ) {
95
+ $labelTextClose = ( $button->multiButtonOptions && $button->multiButtonOptions->labelTextClose ) ? $button->multiButtonOptions->labelTextClose : null;
96
+ $labelBackgroundColorClose = ( $button->multiButtonOptions && $button->multiButtonOptions->labelBackgroundColorClose ) ? $button->multiButtonOptions->labelBackgroundColorClose : null;
97
+ $labelTextColorClose = ( $button->multiButtonOptions && $button->multiButtonOptions->labelTextColorClose ) ? $button->multiButtonOptions->labelTextColorClose : null;
98
+ ?>
99
+ <tr class="cnb_advanced_view">
100
+ <th scope="row">
101
+ <label for="button-multiButtonOptions-labelTextClose">
102
+ Open Label text
103
+ </label>
104
+ </th>
105
+ <td>
106
+ <input name="button[multiButtonOptions][labelTextClose]" id="button-multiButtonOptions-labelTextClose"
107
+ type="text" value="<?php echo esc_attr( $labelTextClose ); ?>"/>
108
+ </td>
109
+ </tr>
110
+ <tr class="cnb_advanced_view">
111
+ <th scope="row">
112
+ <label for="button-multiButtonOptions-labelBackgroundColorClose">
113
+ Open Label background color
114
+ </label>
115
+ </th>
116
+ <td>
117
+ <input name="button[multiButtonOptions][labelBackgroundColorClose]"
118
+ id="button-multiButtonOptions-labelBackgroundColorClose" type="text"
119
+ value="<?php echo esc_attr( $labelBackgroundColorClose ); ?>"
120
+ class="cnb-color-field" data-default-color="#3c434a"/>
121
+ </td>
122
+ </tr>
123
+ <tr class="cnb_advanced_view">
124
+ <th scope="row">
125
+ <label for="button-multiButtonOptions-labelTextColorClose">
126
+ Open Label text color
127
+ </label>
128
+ </th>
129
+ <td>
130
+ <input name="button[multiButtonOptions][labelTextColorClose]"
131
+ id="button-multiButtonOptions-labelTextColorClose" type="text"
132
+ value="<?php echo esc_attr( $labelTextColorClose ); ?>"
133
+ class="cnb-color-field" data-default-color="#000000"/>
134
+ </td>
135
+ </tr>
136
+ <?php
137
+ }
138
+ }
src/admin/domain/CnbDomain.php CHANGED
@@ -15,6 +15,11 @@ class CnbDomain implements JsonSerializable {
15
  public $id;
16
  public $name;
17
  public $interval;
 
 
 
 
 
18
  /**
19
  * @var string STARTER/PRO/FREE
20
  */
@@ -56,6 +61,8 @@ class CnbDomain implements JsonSerializable {
56
 
57
  $domain->id = CnbUtils::getPropertyOrNull( $object, 'id' );
58
  $domain->name = CnbUtils::getPropertyOrNull( $object, 'name' );
 
 
59
  $domain->timezone = CnbUtils::getPropertyOrNull( $object, 'timezone' );
60
  $domain->type = CnbUtils::getPropertyOrNull( $object, 'type' );
61
  $properties = CnbUtils::getPropertyOrNull( $object, 'properties' );
@@ -151,6 +158,8 @@ class CnbDomain implements JsonSerializable {
151
  return array(
152
  'id' => $this->id,
153
  'name' => $this->name,
 
 
154
  'timezone' => $this->timezone,
155
  'type' => $this->type,
156
  'properties' => $this->properties->toArray(),
15
  public $id;
16
  public $name;
17
  public $interval;
18
+ /**
19
+ * @var string ACTIVE/TRIALING
20
+ */
21
+ public $status;
22
+
23
  /**
24
  * @var string STARTER/PRO/FREE
25
  */
61
 
62
  $domain->id = CnbUtils::getPropertyOrNull( $object, 'id' );
63
  $domain->name = CnbUtils::getPropertyOrNull( $object, 'name' );
64
+ $domain->interval = CnbUtils::getPropertyOrNull( $object, 'interval' );
65
+ $domain->status = CnbUtils::getPropertyOrNull( $object, 'status' );
66
  $domain->timezone = CnbUtils::getPropertyOrNull( $object, 'timezone' );
67
  $domain->type = CnbUtils::getPropertyOrNull( $object, 'type' );
68
  $properties = CnbUtils::getPropertyOrNull( $object, 'properties' );
158
  return array(
159
  'id' => $this->id,
160
  'name' => $this->name,
161
+ 'interval' => $this->interval,
162
+ 'status' => $this->status,
163
  'timezone' => $this->timezone,
164
  'type' => $this->type,
165
  'properties' => $this->properties->toArray(),
src/admin/domain/CnbDomainViewEdit.php CHANGED
@@ -6,6 +6,7 @@ namespace cnb\admin\domain;
6
  defined( 'ABSPATH' ) || die( '-1' );
7
 
8
  use cnb\admin\api\CnbAppRemote;
 
9
  use cnb\utils\CnbUtils;
10
 
11
  class CnbDomainViewEdit {
@@ -63,7 +64,13 @@ class CnbDomainViewEdit {
63
  do_action( 'cnb_footer' );
64
  }
65
 
66
- function render_form_plan_details( $domain ) {
 
 
 
 
 
 
67
  $url = admin_url( 'admin.php' );
68
  $upgrade_link =
69
  add_query_arg( array(
@@ -78,33 +85,54 @@ class CnbDomainViewEdit {
78
  <td>
79
  <code><?php echo esc_html( $domain->type ) ?></code>
80
  <?php
 
 
 
81
  if ( $domain->type !== 'PRO' && ! empty( $domain->id ) ) {
82
  echo '<p class="description"><a href="' . esc_url( $upgrade_link ) . '">Upgrade</a> to <span class="cnb-pro-badge">Pro</span> to get tons of buttons, more features and extra button types.</p>';
83
  }
84
- ?>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
85
  </td>
86
  </tr>
87
- <?php if ( $domain->type != 'STARTER' ) { ?>
88
  <tr>
89
- <th scope="row">Auto renew</th>
 
 
90
  <td>
91
- <input id="cnb-renew" class="cnb_toggle_checkbox" name="domain[renew]" type="checkbox"
 
 
92
  value="true" <?php checked( true, $domain->renew ); ?> />
93
- <label for="cnb-renew" class="cnb_toggle_label">Toggle</label>
94
- <span data-cnb_toggle_state_label="cnb-renew" class="cnb_toggle_state cnb_toggle_false">(Off)</span>
95
- <span data-cnb_toggle_state_label="cnb-renew" class="cnb_toggle_state cnb_toggle_true">On</span>
96
 
97
- <?php if ( ! empty( $domain->expires ) ) { ?>
98
- <p class="description" id="domain_expires-description">
99
- Your subscription will
100
- <?php echo $domain->renew == 1 ? ' renew automatically ' : ' expire '; ?>
101
- on <?php echo esc_html( date( 'F d, Y', strtotime( $domain->expires ) ) ) ?>.
102
- </p>
103
- <?php } ?>
104
  </td>
105
  </tr>
106
  <?php }
107
- }
108
 
109
  function render_form_tracking( $domain ) {
110
  $cnb_utils = new CnbUtils();
@@ -203,7 +231,7 @@ class CnbDomainViewEdit {
203
  <tr>
204
  <th scope="row"><label for="domain_properties_allow_multiple_buttons">Multiple buttons per page</label>
205
  <?php if ( $domain->type === 'STARTER' ) { ?>
206
- <a href="<?php echo esc_url( $upgrade_link ) ?>"><span class="cnb-pro-badge">Pro</span><a/>
207
  <?php } ?>
208
  </th>
209
  <td>
@@ -322,6 +350,10 @@ class CnbDomainViewEdit {
322
  return '<p class="description" id="domain_timezone-description">Something went wrong</p>';
323
  }
324
 
 
 
 
 
325
  private function render_form( $domain ) {
326
  $this->render_form_plan_details( $domain );
327
  $this->render_form_tracking( $domain );
6
  defined( 'ABSPATH' ) || die( '-1' );
7
 
8
  use cnb\admin\api\CnbAppRemote;
9
+ use cnb\admin\settings\StripeBillingPortal;
10
  use cnb\utils\CnbUtils;
11
 
12
  class CnbDomainViewEdit {
64
  do_action( 'cnb_footer' );
65
  }
66
 
67
+ /**
68
+ * @param CnbDomain $domain
69
+ * @param StripeBillingPortal $stripe_billing_portal
70
+ *
71
+ * @return void
72
+ */
73
+ function render_form_plan_details( $domain, $stripe_billing_portal = null ) {
74
  $url = admin_url( 'admin.php' );
75
  $upgrade_link =
76
  add_query_arg( array(
85
  <td>
86
  <code><?php echo esc_html( $domain->type ) ?></code>
87
  <?php
88
+ if ( $domain->type === 'PRO' && $domain->status === 'TRIALING' ) {
89
+ echo ' (Free trial)';
90
+ }
91
  if ( $domain->type !== 'PRO' && ! empty( $domain->id ) ) {
92
  echo '<p class="description"><a href="' . esc_url( $upgrade_link ) . '">Upgrade</a> to <span class="cnb-pro-badge">Pro</span> to get tons of buttons, more features and extra button types.</p>';
93
  }
94
+ if ( $domain->status === 'TRIALING' && ! empty( $domain->expires ) ) { ?>
95
+ <p class="description" id="domain_expires-description">
96
+ <?php
97
+ switch ($domain->renew) {
98
+ case 1:
99
+ echo ' Paid subscription is starting on ' . esc_html( $this->get_formatted_date( $domain->expires ) ) . '. To cancel your trial please visit the ';
100
+ break;
101
+ default:
102
+ echo ' Your free trial has been cancelled and you are reverted to the free plan on ' . esc_html( $this->get_formatted_date( $domain->expires ) ) . '. To stay on the PRO plan go to the ';
103
+ }
104
+ if ($stripe_billing_portal) { ?>
105
+ <a href="<?php echo esc_url($stripe_billing_portal->url) ?>">billing portal</a>.
106
+ <?php } ?>
107
+ </p>
108
+ <?php
109
+ } ?>
110
  </td>
111
  </tr>
112
+ <?php if ( $domain->type === 'PRO' && $domain->status === 'ACTIVE' ) { ?>
113
  <tr>
114
+ <th scope="row">
115
+ Auto renew
116
+ </th>
117
  <td>
118
+ <?php
119
+ if ( $domain->status === 'ACTIVE' && ! empty( $domain->expires ) ) { ?>
120
+ <input id="cnb-renew" class="cnb_toggle_checkbox" name="domain[renew]" type="checkbox"
121
  value="true" <?php checked( true, $domain->renew ); ?> />
122
+ <label for="cnb-renew" class="cnb_toggle_label">Toggle</label>
123
+ <span data-cnb_toggle_state_label="cnb-renew" class="cnb_toggle_state cnb_toggle_false">(Off)</span>
124
+ <span data-cnb_toggle_state_label="cnb-renew" class="cnb_toggle_state cnb_toggle_true">On</span>
125
 
126
+ <p class="description" id="domain_expires-description">
127
+ Your subscription will
128
+ <?php echo $domain->renew == 1 ? ' renew automatically ' : ' expire '; ?>
129
+ on <?php echo esc_html( $this->get_formatted_date( $domain->expires ) ) ?>.
130
+ </p>
131
+ <?php } ?>
 
132
  </td>
133
  </tr>
134
  <?php }
135
+ }
136
 
137
  function render_form_tracking( $domain ) {
138
  $cnb_utils = new CnbUtils();
231
  <tr>
232
  <th scope="row"><label for="domain_properties_allow_multiple_buttons">Multiple buttons per page</label>
233
  <?php if ( $domain->type === 'STARTER' ) { ?>
234
+ <a href="<?php echo esc_url( $upgrade_link ) ?>"><span class="cnb-pro-badge">Pro</span></a>
235
  <?php } ?>
236
  </th>
237
  <td>
350
  return '<p class="description" id="domain_timezone-description">Something went wrong</p>';
351
  }
352
 
353
+ private function get_formatted_date( $datetime ) {
354
+ return date( 'F j Y', strtotime( $datetime ) );
355
+ }
356
+
357
  private function render_form( $domain ) {
358
  $this->render_form_plan_details( $domain );
359
  $this->render_form_tracking( $domain );
src/admin/domain/partials/CnbDomainViewUpgradeOverview.php CHANGED
@@ -44,6 +44,7 @@ class CnbDomainViewUpgradeOverview {
44
 
45
  $this->render_coupon();
46
  $upgrade_msg = $cnb_utils->get_query_val( 'upgrade' );
 
47
  ?>
48
 
49
  <div class="cnb-welcome-blocks">
@@ -53,14 +54,15 @@ class CnbDomainViewUpgradeOverview {
53
  <h1>Ready to turn your website into a conversion engine?</h1>
54
  <?php } ?>
55
  <h2>Upgrade to PRO and unlock everything NowButtons has to offer</h2>
56
- <p>(full benefits overview below)</p><br>
57
  <?php
58
- $this->render_upgrade_form( $domain, '-comparison-top' );
59
  ?>
 
60
  </div>
61
  <div class="cnb-welcome-blocks">
62
  <?php
63
- $this->render_pro_features_nice_view();
64
  ?>
65
  <br><br>
66
  <?php
@@ -69,8 +71,9 @@ class CnbDomainViewUpgradeOverview {
69
  <br>
70
  <h1>Select a plan and try it <b>14 days for free</b>!</h1><br>
71
  <?php
72
- $this->render_upgrade_form( $domain );
73
  ?>
 
74
  </div>
75
  <div class="cnb-welcome-blocks">
76
  <h1>All PRO features</h1>
@@ -81,9 +84,16 @@ class CnbDomainViewUpgradeOverview {
81
  <br>
82
  <h1>Ready to give PRO a try?</h1><br>
83
  <?php
84
- $this->render_upgrade_form( $domain, '-comparison-bottom' );
85
  ?>
86
  </div>
 
 
 
 
 
 
 
87
  <br><br>
88
  <div class="cnb-message notice"><p class="cnb-error-message"></p></div>
89
  <?php
@@ -149,16 +159,112 @@ class CnbDomainViewUpgradeOverview {
149
  }
150
  }
151
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
152
  /**
153
  * @param $domain CnbDomain
 
154
  * @param $additional_id_value string. Default is 0 but required for the toggle if more occurrences on the same page (ID should be unique)
155
  *
156
  * @return void
157
  */
158
- public function render_upgrade_form( $domain, $additional_id_value = '' ) {
159
  global $cnb_user;
160
  $this->render_js_to_hide_currency( $cnb_user );
161
- $plans = CnbAppRemotePayment::cnb_remote_get_plans();
162
  $active_currency = $this->get_active_currency( $cnb_user );
163
  ?>
164
 
@@ -252,7 +358,7 @@ class CnbDomainViewUpgradeOverview {
252
  class="cents">.<?php echo esc_html( $plan_y ) ?></span><span class="timeframe">/month</span>
253
  </div>
254
  <div class="billingprice">
255
- <span class="">Billed $<?php echo esc_html( number_format( $plan_year->price, 2, '.', '' ) ); ?> every 12 months.<br>Subscription applies to current domain.<br>VAT may apply</span></span>
256
  </div>
257
 
258
  <?php if ( $plan_year->trialPeriodDays && $plan_year->trialPeriodDays > 0 ) { ?>
@@ -297,8 +403,12 @@ class CnbDomainViewUpgradeOverview {
297
  <?php
298
  }
299
 
300
- public function render_pro_features_nice_view() {
301
- $plans = CnbAppRemotePayment::cnb_remote_get_plans();
 
 
 
 
302
  $plan_year = $this->get_plan( $plans, 'powered-by-usd-yearly' ); ?>
303
 
304
  <div class="cnb-block">
@@ -398,18 +508,26 @@ class CnbDomainViewUpgradeOverview {
398
  public function render_pro_feature_comparison() {
399
  ?>
400
  <style>
401
- tr.cnb-starter {display: none;}
402
- td.cnb-starter, th.cnb-starter {display: none;}
403
- table.cnb-nb-plans tbody th {
404
- font-size: 15px;
405
- padding: 3px 0;
406
- }
407
- table.cnb-nb-plans tbody th .cnb-tooltip-icon {
408
- font-size: 13px;
409
- }
410
- .cnbShowStarterFeatures {
411
- cursor: pointer;
412
- }
 
 
 
 
 
 
 
 
413
  </style>
414
  <div class="cnb-block">
415
 
@@ -708,7 +826,8 @@ class CnbDomainViewUpgradeOverview {
708
  <span class="cnb-tooltip-icon">?</span>
709
  <div class="cnb-tooltip-text">
710
  Schedule your buttons to appear on the right days at the right time.<br>The scheduler can
711
- be used on each individual action, so you can change the contents of multi-action buttons throughout the
 
712
  day.<br><br>E.g. a phone button during working hours and a contact form when you're closed.
713
  </div>
714
  </th>
@@ -762,7 +881,8 @@ class CnbDomainViewUpgradeOverview {
762
  </tr>
763
  </tbody>
764
  </table>
765
- <p><a class=" button cnbShowStarterFeatures" onclick="cnbShowStarterFeatures()">Compare against features included in starter</a></p>
 
766
  </div>
767
  <?php
768
  }
44
 
45
  $this->render_coupon();
46
  $upgrade_msg = $cnb_utils->get_query_val( 'upgrade' );
47
+ $plans = CnbAppRemotePayment::cnb_remote_get_plans();
48
  ?>
49
 
50
  <div class="cnb-welcome-blocks">
54
  <h1>Ready to turn your website into a conversion engine?</h1>
55
  <?php } ?>
56
  <h2>Upgrade to PRO and unlock everything NowButtons has to offer</h2>
57
+ <br>
58
  <?php
59
+ $this->render_upgrade_form( $domain, $plans, '-comparison-top' );
60
  ?>
61
+ <p>Looking for a domain bundle deal? <a href="#domain_bundle">Click here</a>.</p>
62
  </div>
63
  <div class="cnb-welcome-blocks">
64
  <?php
65
+ $this->render_pro_features_nice_view( $plans );
66
  ?>
67
  <br><br>
68
  <?php
71
  <br>
72
  <h1>Select a plan and try it <b>14 days for free</b>!</h1><br>
73
  <?php
74
+ $this->render_upgrade_form( $domain, $plans );
75
  ?>
76
+ <p>Need the button on more than 10 websites? <a href="#domain_bundle">Click here</a>.</p>
77
  </div>
78
  <div class="cnb-welcome-blocks">
79
  <h1>All PRO features</h1>
84
  <br>
85
  <h1>Ready to give PRO a try?</h1><br>
86
  <?php
87
+ $this->render_upgrade_form( $domain, $plans, '-comparison-bottom' );
88
  ?>
89
  </div>
90
+ <div id="domain_bundle" class="cnb-welcome-blocks">
91
+ <h1>Get an Agency PRO Account</h1>
92
+ <p>For power users that need buttons on a large number of websites.</p>
93
+ <h2><span class="dashicons dashicons-yes"></span> Includes up to <u>20 PRO domains</u></h2>
94
+ <br>
95
+ <?php $this->render_pro_account_links(); ?>
96
+ </div>
97
  <br><br>
98
  <div class="cnb-message notice"><p class="cnb-error-message"></p></div>
99
  <?php
159
  }
160
  }
161
 
162
+ /**
163
+ *
164
+ * @return void
165
+ */
166
+ public function render_pro_account_links() {
167
+ global $cnb_user;
168
+ $this->render_js_to_hide_currency( $cnb_user );
169
+ $active_currency = $this->get_active_currency( $cnb_user );
170
+ $accountProEUR_M = 'https://buy.stripe.com/14kdU34GY5C91LGcMO';
171
+ $accountProUSD_M = 'https://buy.stripe.com/eVaeY76P60hPduodQQ';
172
+ $accountProEUR_Y = 'https://buy.stripe.com/eVa17h3CU4y59e89AD';
173
+ $accountProUSD_Y = 'https://buy.stripe.com/3cs17hgpG3u19e86op';
174
+ ?>
175
+
176
+ <?php if ( ! $active_currency ) { ?>
177
+ <div class="cnb-currency-toggle">
178
+ <span class="cnb_currency_active cnb_currency_active_eur" style="font-weight:bold">EUR</span>
179
+ <input id="cnb-currency-toggle-proAccount"
180
+ class="cnb-currency-toggle-cb cnb_toggle_checkbox" name="currency" type="checkbox"
181
+ value="usd"/>
182
+ <label for="cnb-currency-toggle-proAccount" class="cnb_toggle_label">Toggle</label>
183
+ <span style="display: inline-block; margin-left: 4px;"
184
+ class="cnb_currency_active cnb_currency_active_usd">USD</span>
185
+ </div>
186
+ <?php } ?>
187
+
188
+ <div class="cnb-price-plans">
189
+ <div class="currency-box currency-box-eur cnb-flexbox" style="<?php if ( $active_currency === 'usd' ) {
190
+ echo 'display:none';
191
+ } ?>">
192
+ <div class="cnb-pricebox cnb-currency-box currency-box-active">
193
+ <h3 class="cnb-price-eur">Yearly billing</h3>
194
+ <div class="plan-amount"><span class="currency">€</span><span
195
+ class="euros">499</span><span class="timeframe">/year</span>
196
+ </div>
197
+ <div class="billingprice">
198
+ VAT may apply
199
+ </div>
200
+ <a class="button button-primary" href="<?php echo esc_html( $accountProEUR_Y ) ?>">Purchase</a>
201
+ </div>
202
+ <div class="cnb-pricebox cnb-currency-box currency-box-active">
203
+ <h3 class="cnb-price-usd">Monthly billing</h3>
204
+
205
+ <div class="plan-amount"><span class="currency">&euro;</span><span
206
+ class="euros">49</span><span
207
+ class="cents">.90</span><span class="timeframe">/month</span>
208
+ </div>
209
+ <div class="billingprice">
210
+ VAT may apply
211
+ </div>
212
+
213
+ <a class="button button-primary" href="<?php echo esc_html( $accountProEUR_M ) ?>">Purchase</a>
214
+ </div>
215
+
216
+ </div>
217
+ <div class="currency-box currency-box-usd cnb-flexbox"
218
+ style="<?php if ( $active_currency !== 'usd' ) { ?>display:none<?php } ?>">
219
+ <div class="cnb-pricebox cnb-currency-box currency-box-active">
220
+ <h3 class="cnb-price-eur">Yearly billing</h3>
221
+
222
+ <div class="plan-amount"><span class="currency">$</span><span
223
+ class="euros">499</span><span class="timeframe">/year</span>
224
+ </div>
225
+ <div class="billingprice">
226
+ VAT may apply
227
+ </div>
228
+
229
+ <a class="button button-primary" href="<?php echo esc_html( $accountProUSD_Y ) ?>">Purchase</a>
230
+ </div>
231
+
232
+ <div class="cnb-pricebox cnb-currency-box currency-box-active">
233
+ <h3 class="cnb-price-usd">Monthly billing</h3>
234
+
235
+ <div class="plan-amount"><span class="currency">$</span><span
236
+ class="euros">49</span><span
237
+ class="cents">.90</span><span class="timeframe">/month</span>
238
+ </div>
239
+ <div class="billingprice">
240
+ VAT may apply
241
+ </div>
242
+
243
+ <a class="button button-primary" href="<?php echo esc_html( $accountProUSD_M ) ?>">Purchase</a>
244
+ </div>
245
+
246
+ </div>
247
+ </div>
248
+ <p class="billingprice">
249
+ <b>Please allow up to 24 hours for your account to be set up.</b>
250
+ </p>
251
+ <p class="billingprice">
252
+ A PRO Account holds up to 20 domains (included in price). The PRO Account subscription enables PRO features
253
+ on every domain in the account.
254
+ </p>
255
+ <?php
256
+ }
257
+
258
  /**
259
  * @param $domain CnbDomain
260
+ * @param $plans CnbPlan[]
261
  * @param $additional_id_value string. Default is 0 but required for the toggle if more occurrences on the same page (ID should be unique)
262
  *
263
  * @return void
264
  */
265
+ public function render_upgrade_form( $domain, $plans, $additional_id_value = '' ) {
266
  global $cnb_user;
267
  $this->render_js_to_hide_currency( $cnb_user );
 
268
  $active_currency = $this->get_active_currency( $cnb_user );
269
  ?>
270
 
358
  class="cents">.<?php echo esc_html( $plan_y ) ?></span><span class="timeframe">/month</span>
359
  </div>
360
  <div class="billingprice">
361
+ <span>Billed $<?php echo esc_html( number_format( $plan_year->price, 2, '.', '' ) ); ?> every 12 months.<br>Subscription applies to current domain.<br>VAT may apply</span>
362
  </div>
363
 
364
  <?php if ( $plan_year->trialPeriodDays && $plan_year->trialPeriodDays > 0 ) { ?>
403
  <?php
404
  }
405
 
406
+ /**
407
+ * @param $plans CnbPlan[]
408
+ *
409
+ * @return void
410
+ */
411
+ public function render_pro_features_nice_view( $plans ) {
412
  $plan_year = $this->get_plan( $plans, 'powered-by-usd-yearly' ); ?>
413
 
414
  <div class="cnb-block">
508
  public function render_pro_feature_comparison() {
509
  ?>
510
  <style>
511
+ tr.cnb-starter {
512
+ display: none;
513
+ }
514
+
515
+ td.cnb-starter, th.cnb-starter {
516
+ display: none;
517
+ }
518
+
519
+ table.cnb-nb-plans tbody th {
520
+ font-size: 15px;
521
+ padding: 3px 0;
522
+ }
523
+
524
+ table.cnb-nb-plans tbody th .cnb-tooltip-icon {
525
+ font-size: 13px;
526
+ }
527
+
528
+ .cnbShowStarterFeatures {
529
+ cursor: pointer;
530
+ }
531
  </style>
532
  <div class="cnb-block">
533
 
826
  <span class="cnb-tooltip-icon">?</span>
827
  <div class="cnb-tooltip-text">
828
  Schedule your buttons to appear on the right days at the right time.<br>The scheduler can
829
+ be used on each individual action, so you can change the contents of multi-action buttons
830
+ throughout the
831
  day.<br><br>E.g. a phone button during working hours and a contact form when you're closed.
832
  </div>
833
  </th>
881
  </tr>
882
  </tbody>
883
  </table>
884
+ <p><a class=" button cnbShowStarterFeatures" onclick="cnbShowStarterFeatures()">Compare against features
885
+ included in starter</a></p>
886
  </div>
887
  <?php
888
  }
src/admin/legacy/CnbLegacyEdit.php CHANGED
@@ -40,7 +40,7 @@ class CnbLegacyEdit {
40
  ?>
41
  <tr>
42
  <th scope="row">Click tracking <a
43
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/click-tracking/', 'legacy-settings-question-mark', 'click-tracking' ) ) ?>"
44
  target="_blank" class="cnb-nounderscore">
45
  <span class="dashicons dashicons-editor-help"></span>
46
  </a></th>
@@ -66,7 +66,7 @@ class CnbLegacyEdit {
66
  <label for="tracking2">Classic Google Analytics (ga.js)</label>
67
  </div>
68
  <p class="description">Using Google Tag Manager? Set up click tracking in GTM. <a
69
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/google-tag-manager-event-tracking/', 'legacy-settings-description', 'google-tag-manager-event-tracking' ) ) ?>"
70
  target="_blank">Learn how to do this...</a></p>
71
  </td>
72
  </tr>
@@ -79,7 +79,7 @@ class CnbLegacyEdit {
79
  ?>
80
  <tr>
81
  <th scope="row">Google Ads <a
82
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/google-ads/', 'legacy-settings-question-mark', 'google-ads' ) ) ?>"
83
  target="_blank" class="cnb-nounderscore">
84
  <span class="dashicons dashicons-editor-help"></span>
85
  </a></th>
@@ -101,7 +101,7 @@ class CnbLegacyEdit {
101
  </div>
102
  <p class="description">Select this option if you want to track clicks on the button as Google Ads
103
  conversions. This option requires the Event snippet to be present on the page. <a
104
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/google-ads/', 'legacy-settings-description', 'google-ads' ) ) ?>"
105
  target="_blank">Learn more...</a></p>
106
  </td>
107
  </tr>
@@ -129,7 +129,7 @@ class CnbLegacyEdit {
129
  ?>
130
  <tr class="z-index">
131
  <th scope="row"><label for="cnb_order_slider">Order (<span id="cnb_order_value"></span>)</label> <a
132
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/set-order/', 'legacy-settings-question-mark', 'Order' ) ) ?>"
133
  target="_blank"
134
  class="cnb-nounderscore">
135
  <span class="dashicons dashicons-editor-help"></span>
@@ -216,7 +216,7 @@ class CnbLegacyEdit {
216
 
217
  <tr>
218
  <th scope="row"><label for="cnb-number">Phone number</label> <a
219
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/basics/phone-number/', 'legacy-basics-question-mark', 'phone-number' ) ) ?>"
220
  target="_blank" class="cnb-nounderscore">
221
  <span class="dashicons dashicons-editor-help"></span>
222
  </a></th>
@@ -225,7 +225,7 @@ class CnbLegacyEdit {
225
  </tr>
226
  <tr class="button-text">
227
  <th scope="row"><label for="buttonTextField">Button text</label><a
228
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/basics/using-text-buttons/', 'legacy-basics-question-mark', 'using-text-buttons' ) ) ?>"
229
  target="_blank" class="cnb-nounderscore">
230
  <span class="dashicons dashicons-editor-help"></span>
231
  </a></th>
@@ -253,11 +253,11 @@ class CnbLegacyEdit {
253
  <th scope="row"><label for="cnb-icon-color">Icon color</label></th>
254
  <td><input id="cnb-icon-color" name="cnb[iconcolor]" type="text"
255
  value="<?php echo esc_attr( $cnb_options['iconcolor'] ) ?>"
256
- class="cnb-iconcolor-field" data-default-color="#ffffff"/></td>
257
  </tr>
258
  <tr>
259
  <th scope="row">Position <a
260
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/button-position/', 'legacy-presentation-question-mark', 'button-position' ) ) ?>"
261
  target="_blank" class="cnb-nounderscore">
262
  <span class="dashicons dashicons-editor-help"></span>
263
  </a></th>
@@ -332,7 +332,7 @@ class CnbLegacyEdit {
332
  </tr>
333
  <tr class="appearance">
334
  <th scope="row"><label for="cnb-show">Limit appearance</label> <a
335
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/limit-appearance/', 'legacy-presentation-question-mark', 'limit-appearance' ) ) ?>"
336
  target="_blank" class="cnb-nounderscore">
337
  <span class="dashicons dashicons-editor-help"></span>
338
  </a></th>
@@ -342,7 +342,7 @@ class CnbLegacyEdit {
342
  placeholder="E.g. 14, 345"/>
343
  <p class="description">Enter IDs of the posts &amp; pages, separated by commas
344
  (leave blank for all). <a
345
- href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/limit-appearance/', 'legacy-presentation-description', 'limit-appearance' ) ) ?>"
346
  target="_blank">Learn more...</a></p>
347
  <div class="cnb-radio-item">
348
  <input id="limit1" type="radio" name="cnb[limit]"
40
  ?>
41
  <tr>
42
  <th scope="row">Click tracking <a
43
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/click-tracking/', 'legacy-settings-question-mark', 'click-tracking', 'legacy' ) ) ?>"
44
  target="_blank" class="cnb-nounderscore">
45
  <span class="dashicons dashicons-editor-help"></span>
46
  </a></th>
66
  <label for="tracking2">Classic Google Analytics (ga.js)</label>
67
  </div>
68
  <p class="description">Using Google Tag Manager? Set up click tracking in GTM. <a
69
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/google-tag-manager-event-tracking/', 'legacy-settings-description', 'google-tag-manager-event-tracking', 'legacy' ) ) ?>"
70
  target="_blank">Learn how to do this...</a></p>
71
  </td>
72
  </tr>
79
  ?>
80
  <tr>
81
  <th scope="row">Google Ads <a
82
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/google-ads/', 'legacy-settings-question-mark', 'google-ads', 'legacy' ) ) ?>"
83
  target="_blank" class="cnb-nounderscore">
84
  <span class="dashicons dashicons-editor-help"></span>
85
  </a></th>
101
  </div>
102
  <p class="description">Select this option if you want to track clicks on the button as Google Ads
103
  conversions. This option requires the Event snippet to be present on the page. <a
104
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/google-ads/', 'legacy-settings-description', 'google-ads', 'legacy' ) ) ?>"
105
  target="_blank">Learn more...</a></p>
106
  </td>
107
  </tr>
129
  ?>
130
  <tr class="z-index">
131
  <th scope="row"><label for="cnb_order_slider">Order (<span id="cnb_order_value"></span>)</label> <a
132
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/settings/set-order/', 'legacy-settings-question-mark', 'Order', 'legacy' ) ) ?>"
133
  target="_blank"
134
  class="cnb-nounderscore">
135
  <span class="dashicons dashicons-editor-help"></span>
216
 
217
  <tr>
218
  <th scope="row"><label for="cnb-number">Phone number</label> <a
219
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/basics/phone-number/', 'legacy-basics-question-mark', 'phone-number', 'legacy' ) ) ?>"
220
  target="_blank" class="cnb-nounderscore">
221
  <span class="dashicons dashicons-editor-help"></span>
222
  </a></th>
225
  </tr>
226
  <tr class="button-text">
227
  <th scope="row"><label for="buttonTextField">Button text</label><a
228
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/basics/using-text-buttons/', 'legacy-basics-question-mark', 'using-text-buttons', 'legacy' ) ) ?>"
229
  target="_blank" class="cnb-nounderscore">
230
  <span class="dashicons dashicons-editor-help"></span>
231
  </a></th>
253
  <th scope="row"><label for="cnb-icon-color">Icon color</label></th>
254
  <td><input id="cnb-icon-color" name="cnb[iconcolor]" type="text"
255
  value="<?php echo esc_attr( $cnb_options['iconcolor'] ) ?>"
256
+ class="cnb-color-field" data-default-color="#ffffff"/></td>
257
  </tr>
258
  <tr>
259
  <th scope="row">Position <a
260
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/button-position/', 'legacy-presentation-question-mark', 'button-position', 'legacy' ) ) ?>"
261
  target="_blank" class="cnb-nounderscore">
262
  <span class="dashicons dashicons-editor-help"></span>
263
  </a></th>
332
  </tr>
333
  <tr class="appearance">
334
  <th scope="row"><label for="cnb-show">Limit appearance</label> <a
335
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/limit-appearance/', 'legacy-presentation-question-mark', 'limit-appearance', 'legacy' ) ) ?>"
336
  target="_blank" class="cnb-nounderscore">
337
  <span class="dashicons dashicons-editor-help"></span>
338
  </a></th>
342
  placeholder="E.g. 14, 345"/>
343
  <p class="description">Enter IDs of the posts &amp; pages, separated by commas
344
  (leave blank for all). <a
345
+ href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress-free/presentation/limit-appearance/', 'legacy-presentation-description', 'limit-appearance', 'legacy' ) ) ?>"
346
  target="_blank">Learn more...</a></p>
347
  <div class="cnb-radio-item">
348
  <input id="limit1" type="radio" name="cnb[limit]"
src/admin/legacy/CnbLegacyUpgrade.php CHANGED
@@ -5,30 +5,221 @@ namespace cnb\admin\legacy;
5
  // don't load directly
6
  defined( 'ABSPATH' ) || die( '-1' );
7
 
8
- use cnb\utils\CnbAdminFunctions;
9
  use cnb\CnbHeaderNotices;
10
 
11
  class CnbLegacyUpgrade {
12
  function header() {
13
- echo 'Sign up for <b>more features</b>';
14
  }
15
 
16
  private function feature_comparison_free_promobox() {
17
  ?>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
18
  <div class="cnb-body-column">
19
- <?php
20
- ( new CnbAdminFunctions() )->cnb_promobox(
21
- 'blue',
22
- 'Compare features',
23
- '<table class="cnb-nb-plans">
24
  <thead>
25
  <tr>
26
  <td></td>
27
- <th class="cnb-prod-cnb"><h3>No account<br><span style="font-weight:normal;">(Currently active)</span></h3></th>
28
- <th class="cnb-prod-nb" colspan="2"><h3>With account<br><span style="font-weight:normal;">(NowButtons.com)</span></h3></th>
29
  </tr>
30
  <tr class="font-18">
31
- <th style="text-align:left; padding-left:10px">Price</th>
32
  <th><h4>Free</h4></th>
33
  <th><h4>Free</h4></th>
34
  </tr>
@@ -140,28 +331,16 @@ class CnbLegacyUpgrade {
140
  </tr>
141
  <tr class="line"><td>&nbsp;</td><td></td><td></td></tr>
142
  </tbody>
143
- <tfoot>
144
- <tr class="font-18">
145
- <th style="text-align:left; padding-left:10px">Price</th>
146
- <th><h4>Free</h4></th>
147
- <th><h4>Free</h4></th>
148
- </tr>
149
- </tfoot>
150
- </table>',
151
- 'cloud',
152
- '<h3 class="font-22">Sign up now for extra features (no cost)</h3>
153
- <p class="font-18" style="padding-left:12px; margin-top:0">Sign up to create an account on NowButtons.com. Once you\'ve confirmed your account via email, Call Now Button is automatically upgraded to ' . esc_html(CNB_CLOUD_NAME) . '.</p>' .
154
- CnbHeaderNotices::cnb_settings_email_activation_input(),
155
- 'none'
156
- );
157
- ?>
158
  </div>
159
  <?php }
160
 
161
  function upgrade_faq() {
162
  ?>
163
- <div style="max-width:800px;">
164
- <h1 class="cnb-center">FAQ</h1>
165
  <h3>Is a NowButtons.com account really free?</h3>
166
  <p>Yes. NowButtons has a paid plan as well, however the features described above are all part of the Starter plan which is free. Enter your email above and click <b>Create account</b> to sign up and enable the extra features.</p>
167
  <h3>Is there a PRO plan?</h3>
@@ -184,10 +363,11 @@ class CnbLegacyUpgrade {
184
 
185
  <div class="cnb-one-column-section">
186
  <div class="cnb-body-content">
187
- <div class="cnb-compare-features" style="max-width:800px;">
188
  <?php $this->feature_comparison_free_promobox() ?>
 
 
189
  </div>
190
- <?php $this->upgrade_faq() ?>
191
  </div>
192
  </div>
193
  <hr>
5
  // don't load directly
6
  defined( 'ABSPATH' ) || die( '-1' );
7
 
 
8
  use cnb\CnbHeaderNotices;
9
 
10
  class CnbLegacyUpgrade {
11
  function header() {
12
+ echo 'Create Account';
13
  }
14
 
15
  private function feature_comparison_free_promobox() {
16
  ?>
17
+ <style>
18
+ @font-face {
19
+ font-family: 'CNB Icons';
20
+ font-style: normal;
21
+ font-weight: 400;
22
+ src: url("<?php echo esc_url(WP_PLUGIN_URL . '/' . CNB_BASEFOLDER . '/resources/font/cnb.woff');?>") format('woff2');
23
+ }
24
+ .cnb-font-icon i {
25
+ font-family: 'CNB Icons';
26
+ outline: none;
27
+ font-style: normal;
28
+ letter-spacing: normal;
29
+ text-transform: none;
30
+ display: inline-block;
31
+ white-space: nowrap;
32
+ word-wrap: normal;
33
+ direction: ltr;
34
+ -webkit-font-smoothing: antialiased;
35
+ text-rendering: optimizeLegibility;
36
+ -webkit-font-feature-settings: 'liga';
37
+ }
38
+ .cnb-compare-features {
39
+ max-width: 800px;
40
+ }
41
+ .benefit-number {
42
+ /* padding-bottom: 10px; */
43
+ box-sizing: border-box;
44
+ min-height: 32px;
45
+ font-weight: 400
46
+ }
47
+ .benefit-number,
48
+ .cnb-font-icon i,
49
+ .cnb-font-icon span {
50
+ font-size: 32px;
51
+ }
52
+ .cnb-font-icon .dashicons {
53
+ width: auto;
54
+ height: auto;
55
+ font-size: 26px;
56
+ }
57
+ .benefit-section {
58
+ display: flex;
59
+ justify-content: center;
60
+ flex-wrap: wrap;
61
+
62
+ }
63
+ .benefit-box {
64
+ width: 70px;
65
+ min-width:70px;
66
+ height: 80px;
67
+ margin: 20px;
68
+ display: flex;
69
+ flex-direction: column;
70
+ justify-content: center;
71
+ align-items: center;
72
+ padding: 5px;
73
+ border-radius: 5px;
74
+ text-align: center;
75
+ background: #fff;
76
+ font-size: 14px;
77
+ font-weight: 200;
78
+ box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
79
+ }
80
+ .wrap.call-now-button-plugin {
81
+ font-family: BlinkMacSystemFont,-apple-system,Segoe UI,Roboto, Helvetica, Arial,sans-serif;
82
+ }
83
+ .call-now-button-plugin h1 {
84
+ font-size: 60px;
85
+ line-height: 1.2;
86
+ font-weight: 600;
87
+ margin: 0;
88
+ }
89
+ .cnb-compare-features h2 {
90
+ font-size: 40px;
91
+ line-height: 1.25;
92
+ font-weight: 600;
93
+ margin: 0.5em 0;
94
+ }
95
+ .cnb-compare-features h3 {
96
+ font-size: 30px;
97
+ font-weight: 600;
98
+ margin: 0.5em 0;
99
+ }
100
+ .cnb-compare-features th h3 {
101
+ font-size:18px;
102
+ margin:1em 0;
103
+ }
104
+ .cnb-compare-features p,
105
+ .cnb-compare-features table tbody th {
106
+ font-size:16.5px;
107
+ font-weight: 300;
108
+ line-height:1.4;
109
+ }
110
+ .cnb-faq-section {
111
+ max-width: 800px;
112
+ }
113
+ .cnb-faq-section h3 {
114
+ font-size:18px;
115
+ }
116
+ .cnb-faq-section p {
117
+ font-size:14px;
118
+ }
119
+ .benefits-section-signup p.nonessential {
120
+ font-size: 14px;
121
+ padding-left: 0
122
+ }
123
+
124
+ .cnb-compare-features .benefits-section-signup .button-primary {
125
+ font-size: 20px;
126
+ padding: 4px 10px;
127
+ box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
128
+ }
129
+ @media screen and (max-width: 782px) {
130
+ .cnb-compare-features .benefits-section-signup .button-primary {
131
+ vertical-align:top;
132
+ padding: 2px 10px;
133
+ }
134
+ }
135
+ .cnb-body-content .benefits-section-signup form.cnb-container input[type=text] {
136
+ max-width: calc(100% - 190px);
137
+ font-size: 26px;
138
+ box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
139
+ }
140
+ @media screen and (max-width: 450px) {
141
+ .cnb-body-content .benefits-section-signup form.cnb-container input[type=text] {
142
+ max-width: 100%;
143
+ }
144
+ }
145
+ </style>
146
+ <h2>Activate more features</h2>
147
+ <p>When signing up you activate the NowButtons cloud features.</p>
148
+ <div class="benefit-section">
149
+ <div class="benefit-box">
150
+ <span class="benefit-number">5</span>
151
+ <span class="benefit-name">Buttons</span>
152
+ </div>
153
+ <div class="benefit-box">
154
+ <span class="benefit-number cnb-font-icon"><span class="dashicons dashicons-desktop"></span></span>
155
+ <span class="benefit-name">Desktop</span>
156
+ </div>
157
+ <div class="benefit-box">
158
+ <span class="benefit-number cnb-font-icon"><span class="dashicons dashicons-flag"></span></span>
159
+ <span class="benefit-name">Rules</span>
160
+ </div>
161
+ <div class="benefit-box">
162
+ <span class="benefit-number cnb-font-icon"><span class="dashicons dashicons-visibility"></span></span>
163
+ <span class="benefit-name">Preview</span>
164
+ </div>
165
+ </div>
166
+ <h2>Enable more actions</h2>
167
+ <p>NowButtons brings you a full suite of actions to boost the overal conversion rate of your website. Sign up now to enable the following actions:</p>
168
+ <div class="benefit-section">
169
+ <div class="benefit-box">
170
+ <span class="benefit-number cnb-font-icon"><i>whatsapp</i></span>
171
+ <span class="benefit-name">WhatsApp</span>
172
+ </div>
173
+ <div class="benefit-box">
174
+ <span class="benefit-number cnb-font-icon"><i>email</i></span>
175
+ <span class="benefit-name">EMail</span>
176
+ </div>
177
+ <div class="benefit-box">
178
+ <span class="benefit-number cnb-font-icon"><i>directions</i></span>
179
+ <span class="benefit-name">Maps</span>
180
+ </div>
181
+ <div class="benefit-box">
182
+ <span class="benefit-number cnb-font-icon"><i>link2</i></span>
183
+ <span class="benefit-name">Links</span>
184
+ </div>
185
+ <div class="benefit-box">
186
+ <span class="benefit-number cnb-font-icon"><i>anchor</i></span>
187
+ <span class="benefit-name">Scrolls</span>
188
+ </div>
189
+ <div class="benefit-box">
190
+ <span class="benefit-number cnb-font-icon"><i>facebook_messenger</i></span>
191
+ <span class="benefit-name">Messenger</span>
192
+ </div>
193
+ <div class="benefit-box">
194
+ <span class="benefit-number cnb-font-icon"><i>telegram</i></span>
195
+ <span class="benefit-name">Telegram</span>
196
+ </div>
197
+ <div class="benefit-box">
198
+ <span class="benefit-number cnb-font-icon"><i>signal</i></span>
199
+ <span class="benefit-name">Signal</span>
200
+ </div>
201
+ <div class="benefit-box">
202
+ <span class="benefit-number cnb-font-icon"><i>sms</i></span>
203
+ <span class="benefit-name">SMS/Text</span>
204
+ </div>
205
+ </div>
206
+ <h3 style="padding-top:30px;" id="cnb-sign-up-here">Sign up, it's free!</h3>
207
+ <p style="margin-top:30px"><b>Enter your email below</b> and hit <i>Create account</i> to activate NowButtons:</p>
208
+ <div class="benefits-section-signup">
209
+ <?php echo CnbHeaderNotices::cnb_settings_email_activation_input() // phpcs:ignore WordPress.Security ?>
210
+ </div>
211
  <div class="cnb-body-column">
212
+ <hr style="margin:50px 0">
213
+ <h2>Feature comparison</h2>
214
+ <table class="cnb-nb-plans">
 
 
215
  <thead>
216
  <tr>
217
  <td></td>
218
+ <th class="cnb-prod-cnb" style="border-radius:5px 5px 0 0;"><h3>No account<br><span style="font-weight:normal;">(Currently active)</span></h3></th>
219
+ <th class="cnb-prod-nb" style="border-radius:5px 5px 0 0;"><h3>With account<br><span style="font-weight:normal;">(NowButtons.com)</span></h3></th>
220
  </tr>
221
  <tr class="font-18">
222
+ <th style="border-radius: 5px 0 0 5px;"></th>
223
  <th><h4>Free</h4></th>
224
  <th><h4>Free</h4></th>
225
  </tr>
331
  </tr>
332
  <tr class="line"><td>&nbsp;</td><td></td><td></td></tr>
333
  </tbody>
334
+ </table>
335
+ <h3>Sign up now (no cost!)</h3>
336
+ <p><a style="color:#00aa00; font-weight:400" href="#cnb-sign-up-here">Sign up above</a> to create your NowButtons account. Once you've confirmed your account via email, your Call Now Button plugin is automatically upgraded to <b><?php echo esc_html(CNB_CLOUD_NAME) ?></b>.</p>
 
 
 
 
 
 
 
 
 
 
 
 
337
  </div>
338
  <?php }
339
 
340
  function upgrade_faq() {
341
  ?>
342
+ <div class="cnb-faq-section">
343
+ <h1>FAQ</h1>
344
  <h3>Is a NowButtons.com account really free?</h3>
345
  <p>Yes. NowButtons has a paid plan as well, however the features described above are all part of the Starter plan which is free. Enter your email above and click <b>Create account</b> to sign up and enable the extra features.</p>
346
  <h3>Is there a PRO plan?</h3>
363
 
364
  <div class="cnb-one-column-section">
365
  <div class="cnb-body-content">
366
+ <div class="cnb-compare-features">
367
  <?php $this->feature_comparison_free_promobox() ?>
368
+ <hr style="margin:50px 0">
369
+ <?php $this->upgrade_faq() ?>
370
  </div>
 
371
  </div>
372
  </div>
373
  <hr>
src/admin/partials/CnbFooter.php CHANGED
@@ -52,7 +52,7 @@ class CnbFooter {
52
  </a></p>
53
  <p class="cnb-center"><?php echo esc_html(CNB_NAME) ?> version <?php echo esc_attr( CNB_VERSION ) ?>
54
  <p class="cnb-center cnb-spacing">
55
- <a href="<?php echo esc_url( $cnb_utils->get_support_url( '', 'footer-links', 'support' ) ) ?>"
56
  target="_blank"
57
  title="Support">Support</a> &middot;
58
  <a href="<?php echo esc_url( $cnb_utils->get_support_url( 'feature-request/', 'footer-links', 'suggestions' ) ) ?>"
52
  </a></p>
53
  <p class="cnb-center"><?php echo esc_html(CNB_NAME) ?> version <?php echo esc_attr( CNB_VERSION ) ?>
54
  <p class="cnb-center cnb-spacing">
55
+ <a href="<?php echo esc_url( $cnb_utils->get_support_url( 'wordpress/', 'footer-links', 'support' ) ) ?>"
56
  target="_blank"
57
  title="Support">Support</a> &middot;
58
  <a href="<?php echo esc_url( $cnb_utils->get_support_url( 'feature-request/', 'footer-links', 'suggestions' ) ) ?>"
src/admin/partials/CnbHeaderNotices.php CHANGED
@@ -298,7 +298,7 @@ class CnbHeaderNotices {
298
  return;
299
  }
300
 
301
- $message = '<p>Click <a onclick="return cnb_enable_advanced_view(this)" style="cursor: pointer">here</a> to reveal more advanced fields.</p>';
302
  $notices[] = new CnbNotice( 'info', $message );
303
  }
304
 
298
  return;
299
  }
300
 
301
+ $message = '<p>Click <a onclick="return cnb_enable_advanced_view(this)" style="cursor: pointer">here</a> to reveal more advanced fields</p>';
302
  $notices[] = new CnbNotice( 'info', $message );
303
  }
304
 
src/admin/settings/CnbApiKeyActivatedView.php CHANGED
@@ -4,6 +4,7 @@ namespace cnb\admin\settings;
4
 
5
  use cnb\admin\api\CnbAdminCloud;
6
  use cnb\admin\api\CnbAppRemote;
 
7
  use cnb\admin\domain\CnbDomainViewEdit;
8
  use cnb\admin\domain\CnbDomainViewUpgradeOverview;
9
  use cnb\admin\models\CnbActivation;
@@ -76,6 +77,7 @@ class CnbApiKeyActivatedView {
76
 
77
  if ( is_wp_error( $button ) ) {
78
  $this->renderButtonError( $button );
 
79
  return;
80
  }
81
 
@@ -150,48 +152,69 @@ class CnbApiKeyActivatedView {
150
  }
151
 
152
  private function renderOnboarding() {
153
- $img_add_action = plugins_url( '../../../resources/images/onboarding/add-action.png', __FILE__ );
154
- $img_add_rule = plugins_url( '../../../resources/images/onboarding/add-display-rule.png', __FILE__ );
155
- $img_presentation = plugins_url( '../../../resources/images/onboarding/button-presentation.png', __FILE__ );
156
- $img_buttons = plugins_url( '../../../resources/images/onboarding/buttons-overview.png', __FILE__ );
157
- $img_nav_position = plugins_url( '../../../resources/images/onboarding/nav-position.png', __FILE__ );
158
- $img_new_button = plugins_url( '../../../resources/images/onboarding/new-button.png', __FILE__ );
159
- $img_preview = plugins_url( '../../../resources/images/onboarding/preview.png', __FILE__ );
160
- $img_visibility = plugins_url( '../../../resources/images/onboarding/visibility-settings.png', __FILE__ );
161
  ?>
162
  <div class="cnb_onboarding_guide cnb-plan-features cnb-center top-50">
163
- <h1><strong>Quick start guide</strong></h1><hr>
164
- <h2 class="cnb-left">Locating your buttons</h2>
165
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_nav_position ) ?>" alt="Find your Buttons in the side nav of your WordPress dashboard."></div>
166
- <p class="bottom-50">You can find the Buttons in the side nav of your WordPress dashboard.</p>
167
- <h2 class="cnb-left">Your buttons overview</h2>
168
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_buttons ) ?>" alt="The buttons overview page where you can add, edit and remove buttons."></div>
169
- <p class="bottom-50">The buttons overview page where you can add, edit and remove buttons. Click <strong>Add New</strong> at the top to start a new button.</p>
170
- <h2 class="cnb-left">Create a new button</h2>
171
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_new_button ) ?>" alt="When creating a new button, start with selecting your button type."></div>
172
- <p class="bottom-50">When creating a new button, start with selecting your button type.</p>
173
- <h2 class="cnb-left">Add an action to your button</h2>
174
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_add_action ) ?>" alt="Every button contains one or more actions."></div>
175
- <p class="bottom-50">Every button contains at least one action. The action is what the button does when it is clicked. For example a call button has a Phone action.</p>
176
-
177
- <h2 class="cnb-left">Change the presentation of your button</h2>
178
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_presentation ) ?>" alt="In the presentation tab you can set placement, the colors and pick an animation effect for your button."></div>
179
- <p class="bottom-50">In the presentation tab you can set placement and the colors of your button.</p>
180
- <h2 class="cnb-left">Decide where your button should appear</h2>
181
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_visibility ) ?>" alt="On the Visibility tab you can decide where your button should appear. Here you also see an overview of all active Display Rules."></div>
182
- <p class="bottom-50">On the Visibility tab you can decide where your button should appear. Here you also see an overview of all active Display Rules.</p>
183
- <h2 class="cnb-left">Adding Display Rules</h2>
184
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_add_rule ) ?>" alt="Add display rules to select the pages where the button should appear or not."></div>
185
- <p class="bottom-50">Add display rules to select the pages where the button should appear or not.</p>
186
- <h2 class="cnb-left">The preview phone</h2>
187
- <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_preview ) ?>" alt="A preview phone is always visible to validate your edits. The time in the phone can be changed to test your scheduled actions."></div>
188
- <p class="bottom-50">A preview phone is always visible to validate your edits. The time in the phone can be changed to test your scheduled actions.</p>
189
- <h1><strong>Let's go!</strong></h1>
190
- <hr/>
191
- <p style="margin-bottom:100px;">
192
- <a class="button button-primary button-large" href="<?php echo esc_url( $this->getNewButtonLink() ) ?>">Create new button</a>
193
- <a class="button button-large" href="<?php echo esc_url( $this->getAllButtonsLink() ) ?>">Button overview</a>
194
- </p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
195
  </div>
196
 
197
  <?php
@@ -215,29 +238,30 @@ class CnbApiKeyActivatedView {
215
  // Already upgraded, so skip all of this
216
  return;
217
  }
 
218
  ?>
219
  <div class="cnb-welcome-blocks">
220
 
221
- <?php ( new CnbDomainViewUpgradeOverview() )->render_pro_features_nice_view( ); ?>
222
 
223
- <br>
224
- <?php ( new CnbDomainViewUpgradeOverview() )->render_pro_features_extras( ); ?>
225
 
226
- <br>
227
- <h1>Select your <b>PRO</b> plan</h1>
228
- <br>
229
 
230
- <?php ( new CnbDomainViewUpgradeOverview() )->render_upgrade_form( $domain ); ?>
231
  </div>
232
  <div class="cnb-welcome-blocks">
233
- <h1>Feature comparison</h1>
234
- <h3>An overview of the features that are included in the Starter and Pro plans.</h3>
235
- <?php ( new CnbDomainViewUpgradeOverview() )->render_pro_feature_comparison( ); ?>
236
-
237
- <br>
238
- <div class="cnb-block">
239
- <?php ( new CnbDomainViewUpgradeOverview() )->render_upgrade_form( $domain, '-upgrade-form' ); ?>
240
- </div>
241
  </div>
242
  <?php
243
  }
@@ -257,7 +281,8 @@ class CnbApiKeyActivatedView {
257
  return;
258
  }
259
 
260
- echo '<h1>You tried to activate CLOUD, but something went wrong.</h1>';
 
261
  }
262
 
263
  private function renderActivationStatus() {
4
 
5
  use cnb\admin\api\CnbAdminCloud;
6
  use cnb\admin\api\CnbAppRemote;
7
+ use cnb\admin\api\CnbAppRemotePayment;
8
  use cnb\admin\domain\CnbDomainViewEdit;
9
  use cnb\admin\domain\CnbDomainViewUpgradeOverview;
10
  use cnb\admin\models\CnbActivation;
77
 
78
  if ( is_wp_error( $button ) ) {
79
  $this->renderButtonError( $button );
80
+
81
  return;
82
  }
83
 
152
  }
153
 
154
  private function renderOnboarding() {
155
+ $img_add_action = plugins_url( '../../../resources/images/onboarding/add-action.png', __FILE__ );
156
+ $img_add_rule = plugins_url( '../../../resources/images/onboarding/add-display-rule.png', __FILE__ );
157
+ $img_presentation = plugins_url( '../../../resources/images/onboarding/button-presentation.png', __FILE__ );
158
+ $img_buttons = plugins_url( '../../../resources/images/onboarding/buttons-overview.png', __FILE__ );
159
+ $img_nav_position = plugins_url( '../../../resources/images/onboarding/nav-position.png', __FILE__ );
160
+ $img_new_button = plugins_url( '../../../resources/images/onboarding/new-button.png', __FILE__ );
161
+ $img_preview = plugins_url( '../../../resources/images/onboarding/preview.png', __FILE__ );
162
+ $img_visibility = plugins_url( '../../../resources/images/onboarding/visibility-settings.png', __FILE__ );
163
  ?>
164
  <div class="cnb_onboarding_guide cnb-plan-features cnb-center top-50">
165
+ <h1><strong>Quick start guide</strong></h1>
166
+ <hr>
167
+ <h2 class="cnb-left">Locating your buttons</h2>
168
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_nav_position ) ?>"
169
+ alt="Find your Buttons in the side nav of your WordPress dashboard."></div>
170
+ <p class="bottom-50">You can find the Buttons in the side nav of your WordPress dashboard.</p>
171
+ <h2 class="cnb-left">Your buttons overview</h2>
172
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_buttons ) ?>"
173
+ alt="The buttons overview page where you can add, edit and remove buttons.">
174
+ </div>
175
+ <p class="bottom-50">The buttons overview page where you can add, edit and remove buttons. Click <strong>Add
176
+ New</strong> at the top to start a new button.</p>
177
+ <h2 class="cnb-left">Create a new button</h2>
178
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_new_button ) ?>"
179
+ alt="When creating a new button, start with selecting your button type.">
180
+ </div>
181
+ <p class="bottom-50">When creating a new button, start with selecting your button type.</p>
182
+ <h2 class="cnb-left">Add an action to your button</h2>
183
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_add_action ) ?>"
184
+ alt="Every button contains one or more actions."></div>
185
+ <p class="bottom-50">Every button contains at least one action. The action is what the button does when it
186
+ is clicked. For example a call button has a Phone action.</p>
187
+
188
+ <h2 class="cnb-left">Change the presentation of your button</h2>
189
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_presentation ) ?>"
190
+ alt="In the presentation tab you can set placement, the colors and pick an animation effect for your button.">
191
+ </div>
192
+ <p class="bottom-50">In the presentation tab you can set placement and the colors of your button.</p>
193
+ <h2 class="cnb-left">Decide where your button should appear</h2>
194
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_visibility ) ?>"
195
+ alt="On the Visibility tab you can decide where your button should appear. Here you also see an overview of all active Display Rules.">
196
+ </div>
197
+ <p class="bottom-50">On the Visibility tab you can decide where your button should appear. Here you also see
198
+ an overview of all active Display Rules.</p>
199
+ <h2 class="cnb-left">Adding Display Rules</h2>
200
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_add_rule ) ?>"
201
+ alt="Add display rules to select the pages where the button should appear or not.">
202
+ </div>
203
+ <p class="bottom-50">Add display rules to select the pages where the button should appear or not.</p>
204
+ <h2 class="cnb-left">The preview phone</h2>
205
+ <div class="cnb_screenshot"><img src="<?php echo esc_url( $img_preview ) ?>"
206
+ alt="A preview phone is always visible to validate your edits. The time in the phone can be changed to test your scheduled actions.">
207
+ </div>
208
+ <p class="bottom-50">A preview phone is always visible to validate your edits. The time in the phone can be
209
+ changed to test your scheduled actions.</p>
210
+ <h1><strong>Let's go!</strong></h1>
211
+ <hr/>
212
+ <p style="margin-bottom:100px;">
213
+ <a class="button button-primary button-large" href="<?php echo esc_url( $this->getNewButtonLink() ) ?>">Create
214
+ new button</a>
215
+ <a class="button button-large" href="<?php echo esc_url( $this->getAllButtonsLink() ) ?>">Button
216
+ overview</a>
217
+ </p>
218
  </div>
219
 
220
  <?php
238
  // Already upgraded, so skip all of this
239
  return;
240
  }
241
+ $plans = CnbAppRemotePayment::cnb_remote_get_plans();
242
  ?>
243
  <div class="cnb-welcome-blocks">
244
 
245
+ <?php ( new CnbDomainViewUpgradeOverview() )->render_pro_features_nice_view( $plans ); ?>
246
 
247
+ <br>
248
+ <?php ( new CnbDomainViewUpgradeOverview() )->render_pro_features_extras(); ?>
249
 
250
+ <br>
251
+ <h1>Select your <b>PRO</b> plan</h1>
252
+ <br>
253
 
254
+ <?php ( new CnbDomainViewUpgradeOverview() )->render_upgrade_form( $domain, $plans ); ?>
255
  </div>
256
  <div class="cnb-welcome-blocks">
257
+ <h1>Feature comparison</h1>
258
+ <h3>An overview of the features that are included in the Starter and Pro plans.</h3>
259
+ <?php ( new CnbDomainViewUpgradeOverview() )->render_pro_feature_comparison(); ?>
260
+
261
+ <br>
262
+ <div class="cnb-block">
263
+ <?php ( new CnbDomainViewUpgradeOverview() )->render_upgrade_form( $domain, $plans, '-upgrade-form' ); ?>
264
+ </div>
265
  </div>
266
  <?php
267
  }
281
  return;
282
  }
283
 
284
+ echo '<h1>You tried to establish a connection with NowButtons.com, but something went wrong.</h1>';
285
+ echo '<p>If you\'re trying to change to a different account/email address there might still be an old API key stored in the plugin.</p><p>To remove the old API key, go to <b>Settings</b> > <b>Account</b> tab > Click the <b>Disconnect account</b> link and click <b></b>Save Changes</b>. Now try to activate NowButtons again.</p>';
286
  }
287
 
288
  private function renderActivationStatus() {
src/admin/settings/CnbSettingsViewEdit.php CHANGED
@@ -6,7 +6,6 @@ namespace cnb\admin\settings;
6
  defined( 'ABSPATH' ) || die( '-1' );
7
 
8
  use cnb\admin\api\CnbAppRemote;
9
- use cnb\admin\api\CnbAppRemotePromotionCodes;
10
  use cnb\admin\domain\CnbDomain;
11
  use cnb\admin\domain\CnbDomainViewEdit;
12
  use cnb\admin\legacy\CnbLegacyEdit;
@@ -82,11 +81,11 @@ class CnbSettingsViewEdit {
82
 
83
  /**
84
  * @param $cnb_user CnbUser
85
- * @param $cnb_cloud_domain CnbDomain
86
  *
87
  * @return void
88
  */
89
- private function render_account_options( $cnb_user, $cnb_cloud_domain ) {
90
  global $wp_version;
91
  $cnb_options = get_option( 'cnb' );
92
  $show_advanced_view_only = array_key_exists( 'advanced_view', $cnb_options ) && $cnb_options['advanced_view'] === 1;
@@ -116,16 +115,12 @@ class CnbSettingsViewEdit {
116
  <td><code id="cnb_user_id"><?php echo esc_html( $cnb_user->id ) ?></code></td>
117
  </tr>
118
  <?php
119
- if ( $cnb_options['cloud_enabled'] == 1 && ! is_wp_error( $cnb_cloud_domain ) && $cnb_cloud_domain->type === 'PRO' ) {
120
- $stripe_link = CnbAppRemote::cnb_remote_create_billing_portal();
121
- if ( ! is_wp_error( $stripe_link ) ) {
122
- ?>
123
- <tr>
124
- <th scope="row">Invoices</th>
125
- <td><a href="<?php echo esc_url( $stripe_link->url ) ?>" target="_blank">Billing portal</a>
126
- </td>
127
- </tr>
128
- <?php } ?>
129
  <?php } ?>
130
  <tr>
131
  <th>Product updates</th>
@@ -249,7 +244,7 @@ class CnbSettingsViewEdit {
249
  <p class="description">Display API calls and timings in the footer.</p>
250
  </td>
251
  </tr>
252
- <?php if ( ! ( $cnb_user instanceof WP_Error ) && isset( $cnb_cloud_domain ) && $status === 'cloud' ) { ?>
253
  <tr class="when-cloud-enabled">
254
  <th scope="row"><label for="cnb[cloud_use_id]">JavaScript snippet</label></th>
255
  <td>
@@ -390,13 +385,15 @@ class CnbSettingsViewEdit {
390
  ( new CnbAdminFunctions() )->cnb_promobox(
391
  'green',
392
  'Professional features',
393
- '<p>⏱️ Button scheduler<br>
394
- 📷 Icons & custom images on buttons<br>
395
- 👮 Advanced display rules<br>
396
- 🌍 Geo targeting<br>
397
- ↕️ Set scroll height for buttons to appear<br>
398
- ⚡ Slide-in content windows<br>
399
- 🔌 Integrate your Intercom chat</p><h3>And much more!</h3>',
 
 
400
  'performance',
401
  'Try PRO 14 days free!',
402
  'Upgrade',
@@ -516,7 +513,11 @@ class CnbSettingsViewEdit {
516
 
517
  do_action( 'cnb_header' );
518
 
519
- $cloud_successful = $status === 'cloud' && isset( $cnb_cloud_domain ) && ! ( $cnb_cloud_domain instanceof WP_Error ); ?>
 
 
 
 
520
 
521
  <div class="cnb-two-column-section">
522
  <div class="cnb-body-column">
@@ -547,7 +548,7 @@ class CnbSettingsViewEdit {
547
 
548
  if ( $cloud_successful ) {
549
  $domain_edit = new CnbDomainViewEdit();
550
- $domain_edit->render_form_plan_details( $cnb_cloud_domain );
551
  $domain_edit->render_form_tracking( $cnb_cloud_domain );
552
  $domain_edit->render_form_button_display( $cnb_cloud_domain );
553
  }
@@ -557,7 +558,7 @@ class CnbSettingsViewEdit {
557
  ?>
558
  </table>
559
  <?php if ( $status === 'cloud' ) {
560
- $this->render_account_options( $cnb_user, $cnb_cloud_domain );
561
  $this->render_advanced_options( $cnb_cloud_domain, $cnb_user );
562
  }
563
  ?>
6
  defined( 'ABSPATH' ) || die( '-1' );
7
 
8
  use cnb\admin\api\CnbAppRemote;
 
9
  use cnb\admin\domain\CnbDomain;
10
  use cnb\admin\domain\CnbDomainViewEdit;
11
  use cnb\admin\legacy\CnbLegacyEdit;
81
 
82
  /**
83
  * @param $cnb_user CnbUser
84
+ * @param $stripe_billing_portal StripeBillingPortal
85
  *
86
  * @return void
87
  */
88
+ private function render_account_options( $cnb_user, $stripe_billing_portal ) {
89
  global $wp_version;
90
  $cnb_options = get_option( 'cnb' );
91
  $show_advanced_view_only = array_key_exists( 'advanced_view', $cnb_options ) && $cnb_options['advanced_view'] === 1;
115
  <td><code id="cnb_user_id"><?php echo esc_html( $cnb_user->id ) ?></code></td>
116
  </tr>
117
  <?php
118
+ if ($stripe_billing_portal && ! is_wp_error( $stripe_billing_portal )) { ?>
119
+ <tr>
120
+ <th scope="row">Invoices</th>
121
+ <td><a href="<?php echo esc_url( $stripe_billing_portal->url ) ?>" target="_blank">Billing portal</a>
122
+ </td>
123
+ </tr>
 
 
 
 
124
  <?php } ?>
125
  <tr>
126
  <th>Product updates</th>
244
  <p class="description">Display API calls and timings in the footer.</p>
245
  </td>
246
  </tr>
247
+ <?php if ( ! ( $cnb_user instanceof WP_Error ) && isset( $cnb_cloud_domain ) ) { ?>
248
  <tr class="when-cloud-enabled">
249
  <th scope="row"><label for="cnb[cloud_use_id]">JavaScript snippet</label></th>
250
  <td>
385
  ( new CnbAdminFunctions() )->cnb_promobox(
386
  'green',
387
  'Professional features',
388
+ '<p>
389
+ <span class="dashicons dashicons-yes cnb-green"></span> Button scheduler<br>
390
+ <span class="dashicons dashicons-yes cnb-green"></span> Multi-action buttons<br>
391
+ <span class="dashicons dashicons-yes cnb-green"></span> Icon picker & custom images<br>
392
+ <span class="dashicons dashicons-yes cnb-green"></span> Advanced display rules<br>
393
+ <span class="dashicons dashicons-yes cnb-green"></span> Geo targeting<br>
394
+ <span class="dashicons dashicons-yes cnb-green"></span> Set scroll height for buttons to appear<br>
395
+ <span class="dashicons dashicons-yes cnb-green"></span> Slide-in content windows<br>
396
+ <span class="dashicons dashicons-yes cnb-green"></span> Integrate your Intercom chat</p><h3>And much more!</h3>',
397
  'performance',
398
  'Try PRO 14 days free!',
399
  'Upgrade',
513
 
514
  do_action( 'cnb_header' );
515
 
516
+ $cloud_successful = $status === 'cloud' && isset( $cnb_cloud_domain ) && ! ( $cnb_cloud_domain instanceof WP_Error );
517
+ $stripe_billing_portal = null;
518
+ if ( $cnb_options['cloud_enabled'] == 1 && ! is_wp_error( $cnb_cloud_domain ) && $cnb_cloud_domain->type === 'PRO' ) {
519
+ $stripe_billing_portal = CnbAppRemote::cnb_remote_create_billing_portal();
520
+ } ?>
521
 
522
  <div class="cnb-two-column-section">
523
  <div class="cnb-body-column">
548
 
549
  if ( $cloud_successful ) {
550
  $domain_edit = new CnbDomainViewEdit();
551
+ $domain_edit->render_form_plan_details( $cnb_cloud_domain, $stripe_billing_portal );
552
  $domain_edit->render_form_tracking( $cnb_cloud_domain );
553
  $domain_edit->render_form_button_display( $cnb_cloud_domain );
554
  }
558
  ?>
559
  </table>
560
  <?php if ( $status === 'cloud' ) {
561
+ $this->render_account_options( $cnb_user, $stripe_billing_portal );
562
  $this->render_advanced_options( $cnb_cloud_domain, $cnb_user );
563
  }
564
  ?>
src/autoload.php CHANGED
@@ -8,6 +8,7 @@ spl_autoload_register(
8
  if ($classes === null) {
9
  $classes = array(
10
  'cnb\\admin\\action\\actionemailsettings' => '/admin/action/partials/class-action-email-settings.php',
 
11
  'cnb\\admin\\action\\actioniframesettings' => '/admin/action/partials/class-action-iframe-settings.php',
12
  'cnb\\admin\\action\\actionintercomsettings' => '/admin/action/partials/class-action-intercom-settings.php',
13
  'cnb\\admin\\action\\actionlinksettings' => '/admin/action/partials/class-action-link-settings.php',
@@ -39,6 +40,8 @@ spl_autoload_register(
39
  'cnb\\admin\\apikey\\cnbapikeyrouter' => '/admin/api-key/CnbApiKeyRouter.php',
40
  'cnb\\admin\\apikey\\cnbapikeyview' => '/admin/api-key/CnbApiKeyView.php',
41
  'cnb\\admin\\button\\button_edit_table' => '/admin/button/partials/class-button-edit-table.php',
 
 
42
  'cnb\\admin\\button\\cnb_button_list_table' => '/admin/button/Cnb_Button_List_Table.php',
43
  'cnb\\admin\\button\\cnbbutton' => '/admin/button/CnbButton.php',
44
  'cnb\\admin\\button\\cnbbuttoncontroller' => '/admin/button/CnbButtonController.php',
8
  if ($classes === null) {
9
  $classes = array(
10
  'cnb\\admin\\action\\actionemailsettings' => '/admin/action/partials/class-action-email-settings.php',
11
+ 'cnb\\admin\\action\\actioniconpicker' => '/admin/action/partials/class-action-icon-picker.php',
12
  'cnb\\admin\\action\\actioniframesettings' => '/admin/action/partials/class-action-iframe-settings.php',
13
  'cnb\\admin\\action\\actionintercomsettings' => '/admin/action/partials/class-action-intercom-settings.php',
14
  'cnb\\admin\\action\\actionlinksettings' => '/admin/action/partials/class-action-link-settings.php',
40
  'cnb\\admin\\apikey\\cnbapikeyrouter' => '/admin/api-key/CnbApiKeyRouter.php',
41
  'cnb\\admin\\apikey\\cnbapikeyview' => '/admin/api-key/CnbApiKeyView.php',
42
  'cnb\\admin\\button\\button_edit_table' => '/admin/button/partials/class-button-edit-table.php',
43
+ 'cnb\\admin\\button\\button_icon_picker' => '/admin/button/partials/class-button-icon-picker.php',
44
+ 'cnb\\admin\\button\\button_label' => '/admin/button/partials/class-button-label.php',
45
  'cnb\\admin\\button\\cnb_button_list_table' => '/admin/button/Cnb_Button_List_Table.php',
46
  'cnb\\admin\\button\\cnbbutton' => '/admin/button/CnbButton.php',
47
  'cnb\\admin\\button\\cnbbuttoncontroller' => '/admin/button/CnbButtonController.php',
src/notices/CnbAdminNotices.php CHANGED
@@ -200,6 +200,16 @@ class CnbAdminNotices {
200
  $notice = new CnbNotice('info', $message, false, $dismiss_option, $name );
201
  $this->renderNotice( $notice );
202
  }
 
 
 
 
 
 
 
 
 
 
203
 
204
  /**
205
  * @param $notice CnbNotice
200
  $notice = new CnbNotice('info', $message, false, $dismiss_option, $name );
201
  $this->renderNotice( $notice );
202
  }
203
+
204
+ public function blackfriday( $message, $dismiss_option = false, $name = null ) {
205
+ $notice = new CnbNotice('blackfriday', $message, false, $dismiss_option, $name );
206
+ $this->addNotice( $notice );
207
+ }
208
+
209
+ public function renderBlackfriday( $message, $dismiss_option = false, $name = null ) {
210
+ $notice = new CnbNotice('blackfriday', $message, false, $dismiss_option, $name );
211
+ $this->renderNotice( $notice );
212
+ }
213
 
214
  /**
215
  * @param $notice CnbNotice
src/notices/CnbNotices.php CHANGED
@@ -7,7 +7,7 @@ defined( 'ABSPATH' ) || die( '-1' );
7
 
8
  class CnbNotices {
9
  // PHP 5.4 does not support arrays as const, wait for PHP 5.6 of 7 for this
10
- const TYPES = 'error,warning,info,success';
11
 
12
  /**
13
  * @var CnbNotice[]
@@ -24,5 +24,8 @@ class CnbNotices {
24
  /**
25
  * @var CnbNotice[]
26
  */
27
- public $success = array();
 
 
 
28
  }
7
 
8
  class CnbNotices {
9
  // PHP 5.4 does not support arrays as const, wait for PHP 5.6 of 7 for this
10
+ const TYPES = 'error,warning,info,success,blackfriday';
11
 
12
  /**
13
  * @var CnbNotice[]
24
  /**
25
  * @var CnbNotice[]
26
  */
27
+ public $success = array();/**
28
+ * @var CnbNotice[]
29
+ */
30
+ public $blackfriday = array();
31
  }
src/utils/CnbUtils.php CHANGED
@@ -115,10 +115,11 @@ class CnbUtils {
115
  );
116
  }
117
 
118
- function get_support_url($path = '', $utm_campaign = null, $utm_term = null) {
 
119
  return add_query_arg(
120
  $this->cnb_utm_params($utm_campaign, $utm_term),
121
- CNB_SUPPORT . $path);
122
  }
123
 
124
  function get_website_url($path = '', $utm_campaign = null, $utm_term = null) {
115
  );
116
  }
117
 
118
+ function get_support_url($path = '', $utm_campaign = null, $utm_term = null, $product = null) {
119
+ $supportUrl = $product == 'legacy' ? CNB_SUPPORT_LEGACY : CNB_SUPPORT;
120
  return add_query_arg(
121
  $this->cnb_utm_params($utm_campaign, $utm_term),
122
+ $supportUrl . $path);
123
  }
124
 
125
  function get_website_url($path = '', $utm_campaign = null, $utm_term = null) {