From 9838345ee6d0435f376a261eb65e3386150b38ab Mon Sep 17 00:00:00 2001 From: girishpanchal30 Date: Mon, 15 Jul 2024 14:54:12 +0530 Subject: [PATCH 1/2] Update current upsell links and buttons --- classes/Visualizer/Module/Admin.php | 13 ++++++- classes/Visualizer/Render/Library.php | 4 +- classes/Visualizer/Render/Page/Types.php | 8 +++- css/frame.css | 49 +++++++++++++++++++++++- css/library.css | 12 ++++++ index.php | 2 +- 6 files changed, 81 insertions(+), 7 deletions(-) diff --git a/classes/Visualizer/Module/Admin.php b/classes/Visualizer/Module/Admin.php index 252f46d8..9e0da329 100644 --- a/classes/Visualizer/Module/Admin.php +++ b/classes/Visualizer/Module/Admin.php @@ -444,58 +444,69 @@ public static function _getChartTypesLocalized( $enabledOnly = false, $get2Darra 'enabled' => $enabled, // in ChartJS, the fill option is used to make Line chart an area: https://www.chartjs.org/docs/latest/charts/area.html 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/area-chart/', ), 'geo' => array( 'name' => esc_html__( 'Geo', 'visualizer' ), 'enabled' => $enabled, 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/geo-chart/', ), 'column' => array( 'name' => esc_html__( 'Column', 'visualizer' ), 'enabled' => $enabled, 'supports' => array( 'Google Charts', 'ChartJS' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/column-chart/', ), 'bubble' => array( 'name' => esc_html__( 'Bubble', 'visualizer' ), 'enabled' => $enabled, // chartjs' bubble is ugly looking (and it won't work off the default bubble.csv) so it is being excluded for the time being. 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/bubble-chart/', ), 'scatter' => array( 'name' => esc_html__( 'Scatter', 'visualizer' ), 'enabled' => $enabled, 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/scatter-chart/', ), 'gauge' => array( 'name' => esc_html__( 'Gauge', 'visualizer' ), 'enabled' => $enabled, 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/gauge-chart/', ), 'candlestick' => array( 'name' => esc_html__( 'Candlestick', 'visualizer' ), 'enabled' => $enabled, 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/candlestick-chart/', ), // pro types 'timeline' => array( 'name' => esc_html__( 'Timeline', 'visualizer' ), 'enabled' => false, 'supports' => array( 'Google Charts', 'ChartJS' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/timeline-chart/', ), 'combo' => array( 'name' => esc_html__( 'Combo', 'visualizer' ), 'enabled' => false, 'supports' => array( 'Google Charts' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/combo-chart/', ), 'polarArea' => array( 'name' => esc_html__( 'Polar Area', 'visualizer' ), 'enabled' => false, 'supports' => array( 'ChartJS' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/polar-area-chart/', ), 'radar' => array( 'name' => esc_html__( 'Radar/Spider', 'visualizer' ), 'enabled' => false, 'supports' => array( 'ChartJS' ), + 'demo_url' => 'https://demo.themeisle.com/visualizer/radar-spider-chart/', ), ) ); @@ -1134,7 +1145,7 @@ public function getPluginMetaLinks( $plugin_meta, $plugin_file ) { // flattr link $plugin_meta[] = sprintf( '%s', - esc_html__( 'Pro Addon', 'visualizer' ) + esc_html__( 'Get Visualizer Pro', 'visualizer' ) ); } diff --git a/classes/Visualizer/Render/Library.php b/classes/Visualizer/Render/Library.php index 1c61c5cc..db71dc6c 100644 --- a/classes/Visualizer/Render/Library.php +++ b/classes/Visualizer/Render/Library.php @@ -450,7 +450,7 @@ private function _renderSidebar() { echo '
  • ' . __( '6 more chart types', 'visualizer' ); } else { echo '
  • ' . __( '11 more chart types', 'visualizer' ) . '
    • '; - echo '
  • ' . __( 'Manual Data Editor', 'visualizer' ) . '
    • '; + echo '
  • ' . __( 'Synchronize Data Periodically', 'visualizer' ) . '
    • '; echo '
  • ' . __( 'ChartJS Charts', 'visualizer' ) . '
    • '; echo '
  • ' . __( 'Table Google chart', 'visualizer' ) . '
    • '; echo '
  • ' . __( 'Frontend Actions(Print, Export, Copy, Download)', 'visualizer' ) . '
    • '; @@ -464,7 +464,7 @@ private function _renderSidebar() { echo '
  • ' . __( 'WPML support for translating charts', 'visualizer' ) . '
    • '; echo '
  • ' . __( 'Integration with Woocommerce Data endpoints', 'visualizer' ) . '
    • '; echo '
  • ' . __( 'Auto-sync with online files', 'visualizer' ) . '
    • '; - echo '

    ' . __( 'View more features', 'visualizer' ) . '

    '; + echo '

    ' . __( 'View more features', 'visualizer' ) . '' . __( 'Upgrade Now', 'visualizer' ) . '

    '; echo ''; echo ''; echo ''; diff --git a/classes/Visualizer/Render/Page/Types.php b/classes/Visualizer/Render/Page/Types.php index 6b050bd9..a5b23a4c 100644 --- a/classes/Visualizer/Render/Page/Types.php +++ b/classes/Visualizer/Render/Page/Types.php @@ -62,8 +62,12 @@ protected function _renderContent() { } echo '
    '; if ( ! $array['enabled'] ) { - echo ""; + $demo_url = isset( $array['demo_url'] ) ? $array['demo_url'] : ''; + echo '
    '; echo "" . __( 'PREMIUM', 'visualizer' ) . ''; + echo '
    '; + echo '
    ' . __( 'View Demo', 'visualizer' ) . '' . __( 'Upgrade Now', 'visualizer' ) . '
    '; + echo '
    '; } echo ''; if ( ! $array['enabled'] ) { - echo ''; + echo '
    '; } echo '
    '; } diff --git a/css/frame.css b/css/frame.css index f3c79faa..4dcef45d 100644 --- a/css/frame.css +++ b/css/frame.css @@ -535,7 +535,7 @@ div.viz-group-content .viz-group-description { height: 17px; border: none; color: #fff; - z-index: 1; + z-index: 4; background: #c55555; } @@ -1633,3 +1633,50 @@ canvas.chartjs-render-monitor { #vz-frontend-actions .only-pro-inner, #vz-data-controls .only-pro-inner { text-align: center; } + +/******************************************************************************/ +/******************************** chart type box upsell ***********************/ +/******************************************************************************/ + +.pro-upsell .pro-upsell-overlay { + position: absolute; + width: 100%; + height: 100%; + left: 0; + top: 0; + display: grid; + place-items: center; + background-color: rgba(255, 255, 255, 0.7); + z-index: 1; + opacity: 0; + visibility: hidden; + transition: all .3s ease-in-out; +} +.pro-upsell:hover .pro-upsell-overlay{ + opacity: 1; + visibility: visible; +} + +.pro-upsell .pro-upsell-overlay .button { + width: 155px; + height: 39px; + background: #007CBA; + border-radius: 4px; + display: flex; + align-items: center; + text-align: center; + color: #FFFFFF; + justify-content: center; +} +.pro-upsell .pro-upsell-overlay .button.button-secondary{ + background: #ffffff; + color: #007CBA; +} +.pro-upsell .pro-upsell-overlay .pro-upsell-action { + display: flex; + gap: 20px; +} +.pro-upsell .pro-upsell-overlay .pro-upsell-action .button{ + width: 100%; + text-align: center; +} \ No newline at end of file diff --git a/css/library.css b/css/library.css index 81017ca3..1131a958 100644 --- a/css/library.css +++ b/css/library.css @@ -252,6 +252,10 @@ color: #FFFFFF; justify-content: center; } +.visualizer-sidebar-box .button.button-secondary{ + background: #ffffff; + color: #007CBA; +} .visualizer-sidebar-box .we-offer{ background-color: transparent; color: #007CBA; @@ -382,6 +386,14 @@ input:checked + .visualizer-slider:before { #visualizer-sidebar .visualizer-sidebar-box p { margin-bottom: 0; } +#visualizer-sidebar .visualizer-sidebar-box p.vz-sidebar-box-action { + display: flex; + gap: 20px; +} +#visualizer-sidebar .visualizer-sidebar-box p.vz-sidebar-box-action .button{ + width: 100%; + text-align: center; +} #visualizer-sidebar.one-columns { border-top: 5px solid #007CBA; } diff --git a/index.php b/index.php index b7b0567b..1295cdc5 100644 --- a/index.php +++ b/index.php @@ -157,7 +157,7 @@ function() { 'location' => 'visualizer', 'has_upgrade_menu' => ! Visualizer_Module::is_pro(), 'upgrade_text' => esc_html__( 'Get Visualizer Pro', 'feedzy-rss-feeds' ), - 'upgrade_link' => esc_url( tsdk_utmify( Visualizer_Plugin::PRO_TEASER_URL, 'sidebarMenuUpgrade' ) ), + 'upgrade_link' => esc_url( tsdk_utmify( Visualizer_Plugin::PRO_TEASER_URL, 'sidebarMenuUpgrade', 'index' ) ), ); } ); From af32d4581b60d64307422fde6566260fc9ab2ad4 Mon Sep 17 00:00:00 2001 From: girishpanchal30 Date: Tue, 16 Jul 2024 16:06:10 +0530 Subject: [PATCH 2/2] Fix review feedback --- classes/Visualizer/Module/Admin.php | 2 +- classes/Visualizer/Render/Page/Types.php | 2 +- css/library.css | 1 + 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/classes/Visualizer/Module/Admin.php b/classes/Visualizer/Module/Admin.php index 9e0da329..99863a14 100644 --- a/classes/Visualizer/Module/Admin.php +++ b/classes/Visualizer/Module/Admin.php @@ -742,7 +742,7 @@ public function handleGetProSubMenu() { font-weight: 600; color: #fff; } - #toplevel_page_visualizer ul.wp-submenu li:last-child > a { + #toplevel_page_visualizer ul.wp-submenu li:last-child > a > span { color: #fff !important; } #toplevel_page_visualizer ul.wp-submenu li:last-child > a:hover { diff --git a/classes/Visualizer/Render/Page/Types.php b/classes/Visualizer/Render/Page/Types.php index a5b23a4c..5259b0c9 100644 --- a/classes/Visualizer/Render/Page/Types.php +++ b/classes/Visualizer/Render/Page/Types.php @@ -66,7 +66,7 @@ protected function _renderContent() { echo '
    '; echo "" . __( 'PREMIUM', 'visualizer' ) . ''; echo '
    '; - echo '
    ' . __( 'View Demo', 'visualizer' ) . '' . __( 'Upgrade Now', 'visualizer' ) . '
    '; + echo '
    ' . __( 'View Demo', 'visualizer' ) . '' . __( 'Upgrade Now', 'visualizer' ) . '
    '; echo '
    '; } echo '