Timeline Widget For Elementor (Elementor Timeline, Vertical & Horizontal Timeline) - Version 1.3.5

Version Description

Download this release

Release Info

Developer Narinder singh
Plugin Icon 128x128 Timeline Widget For Elementor (Elementor Timeline, Vertical & Horizontal Timeline)
Version 1.3.5
Comparing to
See all releases

Code changes from version 1.3.2 to 1.3.5

Files changed (10) hide show
  1. assets/css/twae-colors-typography.min.css +1 -0
  2. assets/js/twae-horizontal.js +12 -4
  3. assets/js/twae-horizontal.min.js +5 -1
  4. feedback/twae-admin-feedback-form.php +2 -0
  5. includes/twae-feedback-notice.php +1 -0
  6. readme.txt +38 -12
  7. timeline-widget-addon-for-elementor.php +5 -9
  8. widgets/frontend-layouts/twae-centered-timeline.php +7 -8
  9. widgets/frontend-layouts/twae-horizontal-timeline.php +9 -10
  10. widgets/twae-widget.php +354 -343
assets/css/twae-colors-typography.min.css ADDED
@@ -0,0 +1 @@
 
1
+ .twae-wrapper .twae-year{font-size:16px;font-weight:700;color:#fff;background-color:#54595f}.twae-wrapper span.twae-label{font-size:20px;font-weight:600;color:#23a455}.twae-wrapper span.twae-extra-label{font-size:15px;font-weight:400;color:#7a7a7a}.twae-wrapper span.twae-title{font-size:20px;font-weight:600}.twae-wrapper .twae-description{font-size:16px;font-weight:400;color:#333}.twae-wrapper .twae-icon i{font-size:20px}.twae-wrapper .twae-data-container span.twae-title{color:#23a455}.twae-horizontal span.twae-title{color:#23a455}.twae-wrapper .twae-line::before{background-color:#d6d6d6}.twae-wrapper .twae-timeline-centered .twae-icon{border:4px solid #d6d6d6}.twae-wrapper .twae-timeline-centered .twae-year{border:2px solid #d6d6d6}.twae-wrapper:before{background-color:#d6d6d6}.twae-wrapper:after{background-color:#d6d6d6}.twae-horizontal .twae-pagination.swiper-pagination-progressbar{background-color:#d6d6d6}.twae-horizontal .twae-button-prev{color:#d6d6d6}.twae-horizontal .twae-button-next{color:#d6d6d6}.twae-wrapper .twae-icon{background-color:#23a455;color:#fff9ed}.twae-horizontal .twae-story-info{border-top:4px solid #23a455;background-color:#fff9ed}.twae-horizontal .twae-story-info.twae-no-border{border-top:4px solid #fff9ed}.twae-horizontal .twae-story-info:before{border:13px solid transparent;border-bottom-color:#23a455}.twae-horizontal .twae-story-info.twae-no-border:before{border-bottom-color:#fff9ed}.twae-wrapper .twae-right-aligned .twae-data-container{border-left:2px solid #23a455}.twae-wrapper .twae-right-aligned .twae-data-container.twae-no-border{border-left:2px solid #fff9ed}body[data-elementor-device-mode=desktop] .twae-wrapper .twae-left-aligned .twae-data-container,body[data-elementor-device-mode=tablet] .twae-wrapper .twae-left-aligned .twae-data-container{border-right:2px solid #23a455}body[data-elementor-device-mode=desktop] .twae-wrapper .twae-left-aligned .twae-data-container.twae-no-border,body[data-elementor-device-mode=tablet] .twae-wrapper .twae-left-aligned .twae-data-container.twae-no-border{border-right:2px solid #fff9ed}body[data-elementor-device-mode=mobile] .twae-wrapper .twae-left-aligned .twae-data-container{border-left:2px solid #23a455}body[data-elementor-device-mode=mobile] .twae-wrapper .twae-left-aligned .twae-data-container.twae-no-border{border-left:2px solid #fff9ed}.twae-wrapper .twae-data-container{background-color:#fff9ed}.twae-wrapper .twae-data-container:after{border-color:transparent #23a455 transparent transparent}.twae-wrapper .twae-data-container.twae-no-border:after{border-color:transparent #fff9ed transparent transparent}.twae-wrapper .twae-data-container.twae-no-border{border:none!important}
assets/js/twae-horizontal.js CHANGED
@@ -30,7 +30,7 @@ class HorizontalSliderClass extends elementorModules.frontend.handlers.Base {
30
  prevButton = this.elements.$prevButton,
31
  paginationEl = this.elements.$paginationEl;
32
 
33
- var Navigation;
34
  var lang_dir = selector.attr("dir");
35
  if(lang_dir=='rtl'){
36
  var Navigation = {
@@ -44,8 +44,8 @@ class HorizontalSliderClass extends elementorModules.frontend.handlers.Base {
44
  prevEl: prevButton,
45
  }
46
  }
47
-
48
- var swiper = new Swiper( selector, {
49
  spaceBetween: 10,
50
  autoplay:autoplay,
51
  delay: 5000,
@@ -70,7 +70,15 @@ class HorizontalSliderClass extends elementorModules.frontend.handlers.Base {
70
  }
71
  },
72
 
73
- });
 
 
 
 
 
 
 
 
74
  }
75
 
76
  }
30
  prevButton = this.elements.$prevButton,
31
  paginationEl = this.elements.$paginationEl;
32
 
33
+ var Navigation; var swiper;
34
  var lang_dir = selector.attr("dir");
35
  if(lang_dir=='rtl'){
36
  var Navigation = {
44
  prevEl: prevButton,
45
  }
46
  }
47
+ var swiperElement = selector;
48
+ var swiperConfig = {
49
  spaceBetween: 10,
50
  autoplay:autoplay,
51
  delay: 5000,
70
  }
71
  },
72
 
73
+ };
74
+ if ( 'undefined' === typeof Swiper ) {
75
+ const asyncSwiper = elementorFrontend.utils.swiper;
76
+ new asyncSwiper( swiperElement, swiperConfig ).then( ( newSwiperInstance ) => {
77
+ swiper = newSwiperInstance;
78
+ } );
79
+ } else {
80
+ swiper = new Swiper( swiperElement, swiperConfig );
81
+ }
82
  }
83
 
84
  }
assets/js/twae-horizontal.min.js CHANGED
@@ -1 +1,5 @@
1
- class HorizontalSliderClass extends elementorModules.frontend.handlers.Base{getDefaultSettings(){return{selectors:{swiperContainer:".twae-horizontal.swiper-container",nextButton:".twae-button-next",prevButton:".twae-button-prev",paginationEl:".twae-pagination"}}}getDefaultElements(){const selectors=this.getSettings("selectors");return{$swiperContainer:this.$element.find(selectors.swiperContainer),$nextButton:this.$element.find(selectors.nextButton),$prevButton:this.$element.find(selectors.prevButton),$paginationEl:this.$element.find(selectors.paginationEl)}}bindEvents(){var selector=this.elements.$swiperContainer,slidestoshow=selector.data("slidestoshow"),autoplay=selector.data("autoplay"),nextButton=this.elements.$nextButton,prevButton=this.elements.$prevButton,paginationEl=this.elements.$paginationEl,Navigation,lang_dir;if("rtl"==selector.attr("dir"))var Navigation={nextEl:prevButton,prevEl:nextButton};else Navigation={nextEl:nextButton,prevEl:prevButton};var swiper=new Swiper(selector,{spaceBetween:10,autoplay:autoplay,delay:5e3,slidesPerView:slidestoshow,direction:"horizontal",pagination:{el:paginationEl,type:"progressbar"},navigation:Navigation,breakpoints:{280:{slidesPerView:1},768:{slidesPerView:3},1024:{slidesPerView:slidestoshow}}})}}jQuery(window).on("elementor/frontend/init",()=>{const addHandler=$element=>{elementorFrontend.elementsHandler.addHandler(HorizontalSliderClass,{$element:$element})};elementorFrontend.hooks.addAction("frontend/element_ready/timeline-widget-addon.default",addHandler)});
 
 
 
 
1
+ class HorizontalSliderClass extends elementorModules.frontend.handlers.Base{getDefaultSettings(){return{selectors:{swiperContainer:'.twae-horizontal.swiper-container',nextButton:'.twae-button-next',prevButton:'.twae-button-prev',paginationEl:'.twae-pagination',},};}
2
+ getDefaultElements(){const selectors=this.getSettings('selectors');return{$swiperContainer:this.$element.find(selectors.swiperContainer),$nextButton:this.$element.find(selectors.nextButton),$prevButton:this.$element.find(selectors.prevButton),$paginationEl:this.$element.find(selectors.paginationEl),};}
3
+ bindEvents(){var selector=this.elements.$swiperContainer,slidestoshow=selector.data("slidestoshow"),autoplay=selector.data("autoplay"),nextButton=this.elements.$nextButton,prevButton=this.elements.$prevButton,paginationEl=this.elements.$paginationEl;var Navigation;var swiper;var lang_dir=selector.attr("dir");if(lang_dir=='rtl'){var Navigation={nextEl:prevButton,prevEl:nextButton,}}
4
+ else{Navigation={nextEl:nextButton,prevEl:prevButton,}}var swiperElement=selector;var swiperConfig={spaceBetween:10,autoplay:autoplay,delay:5000,slidesPerView:slidestoshow,direction:'horizontal',pagination:{el:paginationEl,type:'progressbar',},navigation:Navigation,breakpoints:{280:{slidesPerView:1,},768:{slidesPerView:3,},1024:{slidesPerView:slidestoshow,}},};if('undefined'===typeof Swiper){const asyncSwiper=elementorFrontend.utils.swiper;new asyncSwiper(swiperElement,swiperConfig).then((newSwiperInstance)=>{swiper=newSwiperInstance;});}else{swiper=new Swiper(swiperElement,swiperConfig);}}}
5
+ jQuery(window).on('elementor/frontend/init',()=>{const addHandler=($element)=>{elementorFrontend.elementsHandler.addHandler(HorizontalSliderClass,{$element,});};elementorFrontend.hooks.addAction('frontend/element_ready/timeline-widget-addon.default',addHandler);});
feedback/twae-admin-feedback-form.php CHANGED
@@ -8,6 +8,8 @@ namespace TWAE_feddback\feedback;
8
  * It is displayed when user deactivate the plugin.
9
  *
10
  */
 
 
11
  class cool_plugins_feedback{
12
 
13
  private static $instance = null;
8
  * It is displayed when user deactivate the plugin.
9
  *
10
  */
11
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
12
+
13
  class cool_plugins_feedback{
14
 
15
  private static $instance = null;
includes/twae-feedback-notice.php CHANGED
@@ -1,4 +1,5 @@
1
  <?php
 
2
 
3
  if (!class_exists('TWAEFeedbackNotice')) {
4
  class TWAEFeedbackNotice {
1
  <?php
2
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
3
 
4
  if (!class_exists('TWAEFeedbackNotice')) {
5
  class TWAEFeedbackNotice {
readme.txt CHANGED
@@ -2,8 +2,8 @@
2
  Contributors:narinder-singh,satindersingh,coolplugins
3
  Donate link: https://paypal.me/CoolPlugins/10USD/
4
  Tags:timeline,elementor,elementor timeline,elementor addon,elementor widgets,addons,roadmap,steps,event,history
5
- Requires at least:4.5
6
- Tested up to:5.8.1
7
  Requires PHP:5.6
8
  Stable tag:trunk
9
  License:GPLv2 or later
@@ -25,8 +25,9 @@ Using this elementor addon you can create a beautiful timeline with a few clicks
25
  These layouts also support advance settings and you can easily manage colors, icons, images and content inside your timeline story.
26
 
27
  **[⭐ View Demo](https://cooltimeline.com/timeline-widget-demo)** | **[⭐ Buy PRO](https://coolplugins.net/product/elementor-timeline-widget-pro-addon/?utm_source=wp_plugin_page)**
28
- https://www.youtube.com/watch?v=qUEEytOedqw
29
- https://youtu.be/05-jlAD-5bc
 
30
  It is really important to let your audience know about the history of your brand especially when you are promoting it through a website.Our plugin will help you to hightlight events and stories precise way.
31
 
32
  You can show history/future stories, events, appointments and many other cool things using Timeline Widgets plugin.
@@ -78,14 +79,13 @@ It is an **[Elementor Page Builder](https://wordpress.org/plugins/elementor/)**
78
  Font Awesome icon, custom text, or image as timeline Icon.
79
  * **[⭐ Buy PRO](https://coolplugins.net/product/elementor-timeline-widget-pro-addon/?utm_source=wp_plugin_page)**
80
 
81
- ### 😎 Who's Behind?
82
-
83
- This addon has been developed by [Cool Timeline](https://cooltimeline.com) plugin developers. **[Cool Plugins](https://coolplugins.net)**, A team of experienced WordPress plugin developers.
84
-
85
- * 7+ years WordPress plugin development experience.
86
- * 20+ free and premium WordPress plugins released.
87
- * 400000+ plugins downloads.
88
- * 70K+ active websites are using our plugins.
89
 
90
  **📌 Cool Timeline - #1 Timeline Plugin (200000+ Downloads)**
91
 
@@ -101,6 +101,15 @@ Cool Timeline automatically showcase timeline stories post-type posts in any ASC
101
 
102
  You can show your stories, events, appointments, concerts, future & history happenings by using **Cool Timeline plugin** on your website.
103
 
 
 
 
 
 
 
 
 
 
104
  == Installation ==
105
  1. Install **Elementor Timeline Widget Addon** from the WordPress.org repository or by uploading plugin-zip unzipped folder to the **/wp-content/plugins** directory.
106
  You must also install **[Elementor Page Builder](https://wordpress.org/plugins/elementor/)** free plugin if you want to use this addon.
@@ -113,6 +122,23 @@ You can show your stories, events, appointments, concerts, future & history happ
113
  3. Elementor Timeline Widget Addon Element Preview
114
 
115
  == Changelog ==
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
116
  <strong>Version 1.3.2 | 21/10/2021</strong>
117
  <pre>
118
  New: Released PRO version
2
  Contributors:narinder-singh,satindersingh,coolplugins
3
  Donate link: https://paypal.me/CoolPlugins/10USD/
4
  Tags:timeline,elementor,elementor timeline,elementor addon,elementor widgets,addons,roadmap,steps,event,history
5
+ Requires at least:4.6
6
+ Tested up to:6.0
7
  Requires PHP:5.6
8
  Stable tag:trunk
9
  License:GPLv2 or later
25
  These layouts also support advance settings and you can easily manage colors, icons, images and content inside your timeline story.
26
 
27
  **[⭐ View Demo](https://cooltimeline.com/timeline-widget-demo)** | **[⭐ Buy PRO](https://coolplugins.net/product/elementor-timeline-widget-pro-addon/?utm_source=wp_plugin_page)**
28
+
29
+ https://youtu.be/YGpTusgTQJc
30
+
31
  It is really important to let your audience know about the history of your brand especially when you are promoting it through a website.Our plugin will help you to hightlight events and stories precise way.
32
 
33
  You can show history/future stories, events, appointments and many other cool things using Timeline Widgets plugin.
79
  Font Awesome icon, custom text, or image as timeline Icon.
80
  * **[⭐ Buy PRO](https://coolplugins.net/product/elementor-timeline-widget-pro-addon/?utm_source=wp_plugin_page)**
81
 
82
+ ### Check our Timeline plugins demos
83
+ <ul>
84
+ <li><strong>Cool Timeline [Free]</strong>- <a href="https://free.cooltimeline.com" target="_blank">Cool Timeline Free Demo</a></li>
85
+ <li><strong>Cool Timeline Pro [Pro]</strong>- <a href="https://cooltimeline.com/demo/" target="_blank">Cool Timeline PRO Demo</a></li>
86
+ <li><strong>Timeline Block For Gutenberg [Free]</strong>- <a href="https://wordpress.org/plugins/timeline-block/" target="_blank">Check It | <a href="https://free.cooltimeline.com/cool-timeline-instant-builder/">View Demo</a></a></li>
87
+ <li><strong>Timeline Builder PRO [PRO]</strong>- <a href="https://cooltimeline.com/timeline-builder-pro-demo/">View Demo</a> </li>
88
+ </ul>
 
89
 
90
  **📌 Cool Timeline - #1 Timeline Plugin (200000+ Downloads)**
91
 
101
 
102
  You can show your stories, events, appointments, concerts, future & history happenings by using **Cool Timeline plugin** on your website.
103
 
104
+
105
+ ### 😎 Who's Behind?
106
+
107
+ This addon has been developed by [Cool Timeline](https://cooltimeline.com) plugin developers. **[Cool Plugins](https://coolplugins.net)**, A team of experienced WordPress plugin developers.
108
+
109
+ * 7+ years WordPress plugin development experience.
110
+ * 20+ free and premium WordPress plugins released.
111
+ * 400000+ plugins downloads.
112
+ * 70K+ active websites are using our plugins.
113
  == Installation ==
114
  1. Install **Elementor Timeline Widget Addon** from the WordPress.org repository or by uploading plugin-zip unzipped folder to the **/wp-content/plugins** directory.
115
  You must also install **[Elementor Page Builder](https://wordpress.org/plugins/elementor/)** free plugin if you want to use this addon.
122
  3. Elementor Timeline Widget Addon Element Preview
123
 
124
  == Changelog ==
125
+ <strong>Version 1.3.5 | 09/05/2022</strong>
126
+ <pre>
127
+ Fixed:Image size bug
128
+ Improvements : Settings panel
129
+ </pre>
130
+ <strong>Version 1.3.4 | 11/01/2022</strong>
131
+ <pre>
132
+ Fixed: Swiper issues
133
+ Fixed: compatibility issues with Elementor 3.5.2
134
+ Improvements : Minor code
135
+ </pre>
136
+
137
+ <strong>Version 1.3.3 | 15/12/2021</strong>
138
+ <pre>
139
+ Fixed:Compatibility issues with Elementor Latest version(3.5.2)
140
+ Improved: minor fixes
141
+ </pre>
142
  <strong>Version 1.3.2 | 21/10/2021</strong>
143
  <pre>
144
  New: Released PRO version
timeline-widget-addon-for-elementor.php CHANGED
@@ -3,25 +3,21 @@
3
  * Plugin Name: Timeline Widget Addon For Elementor
4
  * Description: Timeline Widget Addon For Elementor create a beautiful timeline in page and post.
5
  * Plugin URI: https://coolplugins.net
6
- * Version: 1.3.2
7
  * Author: Cool Plugins
8
  * Author URI: https://coolplugins.net/
9
  * Text Domain: twae
10
- * Elementor tested up to: 3.4.6
11
- * Elementor Pro tested up to: 3.4.2
12
  */
13
 
14
-
15
-
16
- if (!defined('ABSPATH')) {
17
- exit;
18
- }
19
 
20
  if (defined('TWAE_VERSION')) {
21
  return;
22
  }
23
 
24
- define('TWAE_VERSION', '1.3.2');
25
  define('TWAE_FILE', __FILE__);
26
  define('TWAE_PATH', plugin_dir_path(TWAE_FILE));
27
  define('TWAE_URL', plugin_dir_url(TWAE_FILE));
3
  * Plugin Name: Timeline Widget Addon For Elementor
4
  * Description: Timeline Widget Addon For Elementor create a beautiful timeline in page and post.
5
  * Plugin URI: https://coolplugins.net
6
+ * Version: 1.3.5
7
  * Author: Cool Plugins
8
  * Author URI: https://coolplugins.net/
9
  * Text Domain: twae
10
+ * Elementor tested up to:3.6.5
11
+ * Elementor Pro tested up to:3.6.5
12
  */
13
 
14
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
 
 
 
 
15
 
16
  if (defined('TWAE_VERSION')) {
17
  return;
18
  }
19
 
20
+ define('TWAE_VERSION', '1.3.5');
21
  define('TWAE_FILE', __FILE__);
22
  define('TWAE_PATH', plugin_dir_path(TWAE_FILE));
23
  define('TWAE_URL', plugin_dir_url(TWAE_FILE));
widgets/frontend-layouts/twae-centered-timeline.php CHANGED
@@ -1,4 +1,5 @@
1
  <?php
 
2
  echo '
3
  <div class="twae-vertical twae-wrapper '.esc_attr($timeline_layout_wrapper).'">
4
  <div class="twae-timeline-centered twae-timeline-sm twae-line '.esc_attr($timeline_layout).'">';
@@ -18,7 +19,6 @@ echo '
18
  $timeline_story_title = esc_html($content['twae_story_title']);
19
  $story_icon = $content['twae_story_icon']['value'];
20
  $thumbnail_size = $content['twae_thumbnail_size'];
21
- $thumbnail_custom_dimension = $content['twae_thumbnail_custom_dimension'];
22
 
23
  $title_key = $this->get_repeater_setting_key( 'twae_story_title', 'twae_list', $index );
24
  $year_key = $this->get_repeater_setting_key( 'twae_year', 'twae_list', $index );
@@ -37,9 +37,11 @@ echo '
37
  $this->add_render_attribute( $date_label_key, ['class'=> 'twae-label']);
38
  $this->add_render_attribute( $extra_label_key, ['class'=> 'twae-extra-label']);
39
  $this->add_render_attribute( $description_key, ['class'=> 'twae-description']);
40
-
41
  if($content['twae_image']['id']!=""){
42
  if($thumbnail_size =='custom'){
 
 
43
  $custom_size = array ( $thumbnail_custom_dimension['width'],$thumbnail_custom_dimension['height']);
44
  $image= wp_get_attachment_image($content['twae_image']['id'], $custom_size , true);
45
 
@@ -47,12 +49,9 @@ echo '
47
  else{
48
  $image= wp_get_attachment_image($content['twae_image']['id'],$thumbnail_size, true);
49
  }
50
- $image = '<div class="twae-timeline-img">'.$image.'</div>';
51
  }else if($content['twae_image']['url']!=""){
52
- $image = '<div class="twae-timeline-img"><img src="'.$content['twae_image']['url'].'"></img></div>';
53
- }
54
- else{
55
- $image ='';
56
  }
57
 
58
  if($show_year_label == 'yes'){
@@ -72,7 +71,7 @@ echo '
72
  echo'</div>
73
  <div class="twae-data-container '.$no_border.'">
74
  <span '.$this->get_render_attribute_string( $title_key ).'>'.$timeline_story_title.'</span>
75
- '.$image.'
76
  <div '.$this->get_render_attribute_string( $description_key ).'>'.$timeline_description.'</div>
77
  </div>
78
  </div>
1
  <?php
2
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
3
  echo '
4
  <div class="twae-vertical twae-wrapper '.esc_attr($timeline_layout_wrapper).'">
5
  <div class="twae-timeline-centered twae-timeline-sm twae-line '.esc_attr($timeline_layout).'">';
19
  $timeline_story_title = esc_html($content['twae_story_title']);
20
  $story_icon = $content['twae_story_icon']['value'];
21
  $thumbnail_size = $content['twae_thumbnail_size'];
 
22
 
23
  $title_key = $this->get_repeater_setting_key( 'twae_story_title', 'twae_list', $index );
24
  $year_key = $this->get_repeater_setting_key( 'twae_year', 'twae_list', $index );
37
  $this->add_render_attribute( $date_label_key, ['class'=> 'twae-label']);
38
  $this->add_render_attribute( $extra_label_key, ['class'=> 'twae-extra-label']);
39
  $this->add_render_attribute( $description_key, ['class'=> 'twae-description']);
40
+ $image ='';
41
  if($content['twae_image']['id']!=""){
42
  if($thumbnail_size =='custom'){
43
+ $thumbnail_custom_dimension = $content['twae_thumbnail_custom_dimension'];
44
+
45
  $custom_size = array ( $thumbnail_custom_dimension['width'],$thumbnail_custom_dimension['height']);
46
  $image= wp_get_attachment_image($content['twae_image']['id'], $custom_size , true);
47
 
49
  else{
50
  $image= wp_get_attachment_image($content['twae_image']['id'],$thumbnail_size, true);
51
  }
52
+
53
  }else if($content['twae_image']['url']!=""){
54
+ $image = '<img src="'.$content['twae_image']['url'].'"></img>';
 
 
 
55
  }
56
 
57
  if($show_year_label == 'yes'){
71
  echo'</div>
72
  <div class="twae-data-container '.$no_border.'">
73
  <span '.$this->get_render_attribute_string( $title_key ).'>'.$timeline_story_title.'</span>
74
+ <div class="twae-timeline-img">'.$image.'</div>
75
  <div '.$this->get_render_attribute_string( $description_key ).'>'.$timeline_description.'</div>
76
  </div>
77
  </div>
widgets/frontend-layouts/twae-horizontal-timeline.php CHANGED
@@ -1,4 +1,6 @@
1
  <?php
 
 
2
  $sidesToShow = isset($settings['twae_slides_to_show'])
3
  && !empty($settings['twae_slides_to_show'])?$settings['twae_slides_to_show']:2;
4
 
@@ -15,8 +17,7 @@ echo '<div id="twae-horizontal-wrapper" class="twae-wrapper twae-horizontal swip
15
  $timeline_story_title = esc_html($content['twae_story_title']);
16
  $story_icon = $content['twae_story_icon']['value'];
17
  $thumbnail_size = $content['twae_thumbnail_size'];
18
- $thumbnail_custom_dimension = $content['twae_thumbnail_custom_dimension'];
19
-
20
  $title_key = $this->get_repeater_setting_key( 'twae_story_title', 'twae_list', $index );
21
  $year_key = $this->get_repeater_setting_key( 'twae_year', 'twae_list', $index );
22
  $date_label_key = $this->get_repeater_setting_key( 'twae_date_label', 'twae_list', $index );
@@ -34,23 +35,21 @@ echo '<div id="twae-horizontal-wrapper" class="twae-wrapper twae-horizontal swip
34
  $this->add_render_attribute( $date_label_key, ['class'=> 'twae-label']);
35
  $this->add_render_attribute( $extra_label_key, ['class'=> 'twae-extra-label']);
36
  $this->add_render_attribute( $description_key, ['class'=> 'twae-description']);
37
-
38
  if($content['twae_image']['id']!=""){
39
  if($thumbnail_size =='custom'){
 
40
  $custom_size = array ( $thumbnail_custom_dimension['width'],$thumbnail_custom_dimension['height']);
41
  $image= wp_get_attachment_image($content['twae_image']['id'], $custom_size , true);
42
-
43
  }
44
  else{
45
  $image= wp_get_attachment_image($content['twae_image']['id'],$thumbnail_size, true);
46
  }
47
- $image = ' <div class="twae-timeline-img">'.$image.'</div>';
48
  }else if($content['twae_image']['url']!=""){
49
- $image = '<div class="twae-timeline-img"><img src="'.$content['twae_image']['url'].'"></img></div>';
50
- }
51
- else{
52
- $image ='';
53
  }
 
54
 
55
  echo '<div class="swiper-slide '.esc_attr($sidesHeight).'">';
56
  if($show_year_label == 'yes'){
@@ -66,7 +65,7 @@ echo '<div id="twae-horizontal-wrapper" class="twae-wrapper twae-horizontal swip
66
  \Elementor\Icons_Manager::render_icon( $content['twae_story_icon'], [ 'aria-hidden' => 'true' ] );
67
  echo'</div>';
68
  echo '<div class="twae-story-info '.$no_border.'">
69
- '.$image.'
70
  <span '.$this->get_render_attribute_string( $title_key ).'>'.$timeline_story_title.'</span>
71
  <div '.$this->get_render_attribute_string( $description_key ).'>'.$timeline_description.'</div>
72
  </div>
1
  <?php
2
+ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
3
+
4
  $sidesToShow = isset($settings['twae_slides_to_show'])
5
  && !empty($settings['twae_slides_to_show'])?$settings['twae_slides_to_show']:2;
6
 
17
  $timeline_story_title = esc_html($content['twae_story_title']);
18
  $story_icon = $content['twae_story_icon']['value'];
19
  $thumbnail_size = $content['twae_thumbnail_size'];
20
+
 
21
  $title_key = $this->get_repeater_setting_key( 'twae_story_title', 'twae_list', $index );
22
  $year_key = $this->get_repeater_setting_key( 'twae_year', 'twae_list', $index );
23
  $date_label_key = $this->get_repeater_setting_key( 'twae_date_label', 'twae_list', $index );
35
  $this->add_render_attribute( $date_label_key, ['class'=> 'twae-label']);
36
  $this->add_render_attribute( $extra_label_key, ['class'=> 'twae-extra-label']);
37
  $this->add_render_attribute( $description_key, ['class'=> 'twae-description']);
38
+ $image ='';
39
  if($content['twae_image']['id']!=""){
40
  if($thumbnail_size =='custom'){
41
+ $thumbnail_custom_dimension = $content['twae_thumbnail_custom_dimension'];
42
  $custom_size = array ( $thumbnail_custom_dimension['width'],$thumbnail_custom_dimension['height']);
43
  $image= wp_get_attachment_image($content['twae_image']['id'], $custom_size , true);
 
44
  }
45
  else{
46
  $image= wp_get_attachment_image($content['twae_image']['id'],$thumbnail_size, true);
47
  }
48
+
49
  }else if($content['twae_image']['url']!=""){
50
+ $image = '<img src="'.esc_url($content['twae_image']['url']).'"></img>';
 
 
 
51
  }
52
+
53
 
54
  echo '<div class="swiper-slide '.esc_attr($sidesHeight).'">';
55
  if($show_year_label == 'yes'){
65
  \Elementor\Icons_Manager::render_icon( $content['twae_story_icon'], [ 'aria-hidden' => 'true' ] );
66
  echo'</div>';
67
  echo '<div class="twae-story-info '.$no_border.'">
68
+ <div class="twae-timeline-img">'.$image.'</div>
69
  <span '.$this->get_render_attribute_string( $title_key ).'>'.$timeline_story_title.'</span>
70
  <div '.$this->get_render_attribute_string( $description_key ).'>'.$timeline_description.'</div>
71
  </div>
widgets/twae-widget.php CHANGED
@@ -14,12 +14,12 @@ class TWAE_Widget extends \Elementor\Widget_Base {
14
 
15
  public function __construct($data = [], $args = null) {
16
  parent::__construct($data, $args);
17
- wp_register_style( 'twae-centered-css', TWAE_URL . 'assets/css/twae-centered-timeline.min.css', array());
18
- wp_register_style( 'twae-horizontal-css', TWAE_URL . 'assets/css/twae-horizontal-styles.min.css', array());
19
- wp_register_style( 'twae-fontello-css', TWAE_URL . 'assets/css/twae-fontello.css', array());
20
- wp_register_script( 'twae-horizontal-js', TWAE_URL . 'assets/js/twae-horizontal.min.js',[ 'elementor-frontend' ],null, true );
21
- wp_register_style( 'twae-color-typography', TWAE_URL . 'assets/css/twae-colors-typography.css', array());
22
- wp_register_style( 'font-awesome-5-all', ELEMENTOR_ASSETS_URL . 'lib/font-awesome/css/all.min.css', false);//load elementor fontawesome
23
  }
24
 
25
 
@@ -70,8 +70,233 @@ class TWAE_Widget extends \Elementor\Widget_Base {
70
  return [ 'twae' ];
71
  }
72
 
73
- protected function _register_controls() {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
74
 
 
75
  $this->start_controls_section(
76
  'twae_layout_section',
77
  [
@@ -168,40 +393,7 @@ class TWAE_Widget extends \Elementor\Widget_Base {
168
  'tab' => \Elementor\Controls_Manager::TAB_STYLE,
169
  ]
170
  );
171
- $this->add_control(
172
- 'twae_title_section',
173
- [
174
- 'label' => __( 'Title', 'plugin-name' ),
175
- 'type' => \Elementor\Controls_Manager::HEADING,
176
- ]
177
- );
178
-
179
- /*---- Story Title ----*/
180
- $this->add_control(
181
- 'twae_story_title_color',
182
- [
183
- 'label' => __( 'Color', 'twae' ),
184
- 'type' => Controls_Manager::COLOR,
185
- 'scheme' => [
186
- 'type' => Elementor\Core\Schemes\Color::get_type(),
187
- 'value' => Elementor\Core\Schemes\Color::COLOR_1,
188
- ],
189
- 'selectors' => [
190
- '{{WRAPPER}} .twae-wrapper .twae-data-container span.twae-title' => 'color: {{twae_story_title_color}}',
191
- '{{WRAPPER}} .twae-horizontal span.twae-title' => 'color: {{twae_story_title_color}}',
192
- ],
193
- //'default' => '#23A455',
194
- ]
195
- );
196
-
197
- $this->add_group_control(
198
- Group_Control_Typography::get_type(),
199
- [
200
- 'name' => 'twae_title_typography',
201
- 'label' => __( 'Typography', 'twae' ),
202
- 'selector' => '{{WRAPPER}} .twae-wrapper span.twae-title',
203
- ]
204
- );
205
 
206
  $this->add_control(
207
  'twae_label_section',
@@ -237,6 +429,76 @@ class TWAE_Widget extends \Elementor\Widget_Base {
237
  ]
238
  );
239
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
240
  $this->add_control(
241
  'twae_description_section',
242
  [
@@ -271,67 +533,6 @@ class TWAE_Widget extends \Elementor\Widget_Base {
271
  ]
272
  );
273
 
274
- $this->add_control(
275
- 'twae_middle_line_section',
276
- [
277
- 'label' => __( 'Middle Line', 'twae' ),
278
- 'type' => \Elementor\Controls_Manager::HEADING,
279
- 'separator' => 'before',
280
- ]
281
- );
282
-
283
- $this->add_control(
284
- 'twae_line_color',
285
- [
286
- 'label' => __( 'Line Color', 'twae' ),
287
- 'type' => Controls_Manager::COLOR,
288
- 'selectors' => [
289
- '{{WRAPPER}} .twae-wrapper .twae-line::before' => 'background-color: {{twae_line_color}}',
290
- '{{WRAPPER}} .twae-wrapper .twae-timeline-centered .twae-icon' => 'border-color: {{twae_line_color}}',
291
- '{{WRAPPER}} .twae-wrapper .twae-timeline-centered .twae-year' => 'border-color: {{twae_line_color}}',
292
- '{{WRAPPER}} .twae-wrapper:before' => 'background-color: {{twae_line_color}}',
293
- '{{WRAPPER}} .twae-wrapper:after' => 'background-color: {{twae_line_color}}',
294
- '{{WRAPPER}} .twae-horizontal .twae-pagination.swiper-pagination-progressbar' => 'background-color: {{twae_line_color}}',
295
- '{{WRAPPER}} .twae-horizontal .twae-button-prev' => 'color: {{twae_line_color}}',
296
- '{{WRAPPER}} .twae-horizontal .twae-button-next' => 'color: {{twae_line_color}}',
297
- ],
298
- //'default' => '#D6D6D6',
299
- ]
300
- );
301
-
302
-
303
- $this->add_control(
304
- 'twae_icon_section',
305
- [
306
- 'label' => __( 'Icon/Icon placeholder', 'twae' ),
307
- 'type' => \Elementor\Controls_Manager::HEADING,
308
- 'separator' => 'before',
309
- ]
310
- );
311
-
312
- $this->add_control(
313
- 'twae_icon_bgcolor',
314
- [
315
- 'label' => __( 'Background Color', 'twae' ),
316
- 'type' => Controls_Manager::COLOR,
317
- 'scheme' => [
318
- 'type' => Elementor\Core\Schemes\Color::get_type(),
319
- 'value' => Elementor\Core\Schemes\Color::COLOR_1,
320
- ],
321
- 'selectors' => [
322
- '{{WRAPPER}} .twae-wrapper .twae-icon' => 'background-color: {{twae_icon_bgcolor}}',
323
- '{{WRAPPER}} .twae-horizontal .twae-story-info' => 'border-color: {{twae_icon_bgcolor}}',
324
- '{{WRAPPER}} .twae-horizontal .twae-story-info:before' => 'border-bottom-color: {{twae_icon_bgcolor}}',
325
- '{{WRAPPER}} .twae-wrapper .twae-data-container:after' => 'border-right-color: {{twae_icon_bgcolor}}',
326
- '{{WRAPPER}} .twae-wrapper .twae-right-aligned .twae-data-container' => 'border-left-color: {{twae_icon_bgcolor}}',
327
- 'body[data-elementor-device-mode=desktop] {{WRAPPER}} .twae-wrapper .twae-left-aligned .twae-data-container,
328
- body[data-elementor-device-mode=tablet] {{WRAPPER}} .twae-wrapper .twae-left-aligned .twae-data-container' => 'border-right-color: {{twae_icon_bgcolor}}',
329
- 'body[data-elementor-device-mode=mobile] {{WRAPPER}} .twae-wrapper .twae-left-aligned .twae-data-container' => 'border-left-color: {{twae_icon_bgcolor}}',
330
- ],
331
- //'default' => '#23A455',
332
- ]
333
- );
334
-
335
  $this->add_control(
336
  'twae_story_bgcolor_section',
337
  [
@@ -370,16 +571,44 @@ class TWAE_Widget extends \Elementor\Widget_Base {
370
  $this->start_controls_section(
371
  'twae_extra_styles_section',
372
  [
373
- 'label' => __( 'Extra Settings', 'twae' ),
374
  'tab' => \Elementor\Controls_Manager::TAB_STYLE,
375
  ]
376
  );
377
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
378
  /*---- Year Label ----*/
379
  $this->add_control(
380
  'twae_year_label_section',
381
  [
382
- 'label' => __( 'Middle Line Label', 'plugin-name' ),
 
383
  'type' => \Elementor\Controls_Manager::HEADING,
384
  'separator' => 'before',
385
  ]
@@ -417,42 +646,42 @@ class TWAE_Widget extends \Elementor\Widget_Base {
417
  'selector' => '{{WRAPPER}} .twae-wrapper .twae-year',
418
  ]
419
  );
420
-
421
- /*---- Sub Label ----*/
 
422
  $this->add_control(
423
- 'twae_sub_label_section',
424
  [
425
- 'label' => __( 'Sub Label', 'twae' ),
426
  'type' => \Elementor\Controls_Manager::HEADING,
427
  'separator' => 'before',
428
  ]
429
  );
430
-
431
  $this->add_control(
432
- 'twae_extra_label_color',
433
  [
434
- 'label' => __( 'Color', 'twae' ),
435
  'type' => Controls_Manager::COLOR,
436
  'scheme' => [
437
  'type' => Elementor\Core\Schemes\Color::get_type(),
438
- 'value' => Elementor\Core\Schemes\Color::COLOR_3,
439
  ],
440
  'selectors' => [
441
- '{{WRAPPER}} .twae-wrapper span.twae-extra-label' => 'color: {{twae_extra_label_color}}',
 
 
 
 
 
 
 
442
  ],
443
- //'default' => '#7A7A7A',
444
- ]
445
- );
446
-
447
- $this->add_group_control(
448
- Group_Control_Typography::get_type(),
449
- [
450
- 'name' => 'twae_extra_label_typography',
451
- 'label' => __( 'Typography', 'twae' ),
452
- 'selector' => '{{WRAPPER}} .twae-wrapper span.twae-extra-label',
453
  ]
454
  );
455
-
 
456
  /*---- Icon ----*/
457
  $this->add_control(
458
  'twae_icon_styles_section',
@@ -517,226 +746,8 @@ class TWAE_Widget extends \Elementor\Widget_Base {
517
 
518
  $this->end_controls_section();
519
 
520
- $this->start_controls_section(
521
- 'twae_content_section',
522
- [
523
- 'label' => __( 'Timeline Stories', 'twae' ),
524
- 'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
525
- ]
526
- );
527
-
528
- $repeater = new \Elementor\Repeater();
529
-
530
- $repeater->start_controls_tabs(
531
- 'twae_story_tabs'
532
- );
533
-
534
- $repeater->start_controls_tab(
535
- 'twae_content_tab',
536
- [
537
- 'label' => __( 'Content', 'twae' ),
538
- ]
539
- );
540
-
541
-
542
-
543
- $repeater->add_control(
544
- 'twae_date_label',
545
- [
546
- 'label' => __( 'Primary Label', 'twae' ),
547
- 'type' => \Elementor\Controls_Manager::TEXT,
548
- 'default' => '01 Jan 2020',
549
- ]
550
- );
551
-
552
- $repeater->add_control(
553
- 'twae_extra_label',
554
- [
555
- 'label' => __( 'Sub Label', 'twae' ),
556
- 'type' => \Elementor\Controls_Manager::TEXT,
557
- 'default' => 'Sub Label',
558
- ]
559
- );
560
-
561
- $repeater->add_control(
562
- 'twae_story_title',
563
- [
564
- 'label' => __( 'Timeline Story Title', 'twae' ),
565
- 'type' => \Elementor\Controls_Manager::TEXT,
566
- 'default' => 'Timeline Story',
567
- 'label_block' => true,
568
- ]
569
- );
570
-
571
- $repeater->add_control(
572
- 'twae_image',
573
- [
574
- 'label' => __( 'Choose Image', 'twae' ),
575
- 'type' => \Elementor\Controls_Manager::MEDIA,
576
- 'description' => __('Image Size will not work with default image','twae'),
577
- 'default' => [
578
- 'url' => \Elementor\Utils::get_placeholder_image_src(),
579
- ],
580
- ]
581
- );
582
-
583
-
584
- $repeater->add_control(
585
- 'twae_description',
586
- [
587
- 'label' => __( 'Description', 'twae' ),
588
- 'type' => \Elementor\Controls_Manager::WYSIWYG,
589
- 'default' => 'Add Description Here',
590
- ]
591
- );
592
 
593
 
594
- $repeater->end_controls_tab();
595
-
596
- $repeater->start_controls_tab(
597
- 'twae_advanced_tab',
598
- [
599
- 'label' => __( 'Extra Settings', 'twae' ),
600
- ]
601
- );
602
-
603
- $repeater->add_control(
604
- 'twae_show_year_label',
605
- [
606
- 'label' => __( 'Middle Line Label', 'twae' ),
607
- 'type' => \Elementor\Controls_Manager::SWITCHER,
608
- 'label_on' => __( 'Show', 'twae' ),
609
- 'label_off' => __( 'Hide', 'twae' ),
610
- 'return_value' => 'yes',
611
- 'default' => 'no',
612
- ]
613
- );
614
-
615
- $repeater->add_control(
616
- 'twae_year',
617
- [
618
- 'label' => __( 'Label Text', 'twae' ),
619
- 'type' => \Elementor\Controls_Manager::TEXT,
620
- 'default' => '2020',
621
- 'condition' => [
622
- 'twae_show_year_label' => [
623
- 'yes'
624
- ],
625
- ]
626
-
627
- ]
628
- );
629
-
630
- $repeater->add_group_control(
631
- Group_Control_Image_Size::get_type(),
632
- [
633
-
634
- 'name' => 'twae_thumbnail', // Usage: `{name}_size` and `{name}_custom_dimension`, in this case `thumbnail_size` and `thumbnail_custom_dimension`.
635
- 'separator' => 'none',
636
- ]
637
- );
638
-
639
- $repeater->add_control(
640
- 'twae_image_size_notice',
641
- [
642
- 'label' => __( 'Image Size will not work with default image', 'twae' ),
643
- 'type' => \Elementor\Controls_Manager::HEADING,
644
- 'separator' => 'none',
645
- ]
646
- );
647
-
648
- $repeater->add_control(
649
- 'twae_story_icon',
650
- [
651
- 'label' => __( 'Icon', 'twae' ),
652
- 'type' => \Elementor\Controls_Manager::ICONS,
653
- 'default' => [
654
- 'value' => 'fab fa-amazon',
655
- 'library' => 'solid',
656
- ],
657
- ]
658
- );
659
-
660
- $repeater->add_control(
661
- 'twae_pro_options',
662
- [
663
- 'label' => __('','twae'),
664
- 'type' => \Elementor\Controls_Manager::RAW_HTML,
665
- 'raw' => '
666
- <strong>'.__('Timeline Widget Addon','twae'). '</strong>
667
- <a href="'.TWAE_BUY_PRO_LINK.'" target="_blank"><span class="twae-pro-label">'.__('Pro','twae').'</a></span>',
668
- 'content_classes' => 'twae_pro_options',
669
- 'separator' => 'before',
670
- ]
671
- );
672
-
673
- $repeater->add_control(
674
- 'twae_pro_content',
675
- [
676
- 'label' => '',
677
- 'label_block' => true,
678
- 'type' => \Elementor\Controls_Manager::RAW_HTML,
679
- 'raw' => '<a target="_blank" href="'.TWAE_BUY_PRO_LINK.'"><img class="twae-screenshots" src="'.TWAE_URL . 'assets/images/slideshow-images.png"></a></br>
680
- <a target="_blank" href="'.TWAE_BUY_PRO_LINK.'"><img class="twae-screenshots" src="'.TWAE_URL . 'assets/images/story-custom-colors.png"></a>',
681
- 'content_classes' => 'twae_pro_content',
682
- ]
683
- );
684
-
685
- $repeater->end_controls_tab();
686
-
687
- $repeater->end_controls_tabs();
688
-
689
- $this->add_control(
690
- 'twae_list',
691
- [
692
-
693
- 'label' => __( 'Content', 'twae' ),
694
- 'type' => \Elementor\Controls_Manager::REPEATER,
695
- 'fields' => $repeater->get_controls(),
696
- 'default' => [
697
- [
698
- 'twae_story_title' => __( 'Amazon Founded', 'twae' ),
699
- 'twae_description' => __('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Erat enim res aperta. Ne discipulum abducam, times. Primum quid tu dicis breve? An haec ab eo non dicuntur?','twae'),
700
- 'twae_year' => __('1994','twae'),
701
- 'twae_date_label' => __('Jul 1994','twae'),
702
- 'twae_extra_label' => __('Amazon History','twae'),
703
- 'twae_image' =>[
704
- 'url' => TWAE_URL . 'assets/images/amazon-1.png',
705
- 'id' => '',
706
- ],
707
- ],
708
- [
709
- 'twae_story_title' => __( 'Amazon Prime Services', 'twae' ),
710
- 'twae_description' => __('Aliter homines, aliter philosophos loqui putas oportere? Sin aliud quid voles, postea. Mihi enim satis est, ipsis non satis. Negat enim summo bono afferre incrementum diem. Quod ea non occurrentia fingunt, vincunt Aristonem.','twae'),
711
- 'twae_year' => __('2005','twae'),
712
- 'twae_date_label' => __('Feb 2005','twae'),
713
- 'twae_extra_label' => __('Amazon History','twae'),
714
- 'twae_image' =>[
715
- 'url' => TWAE_URL . 'assets/images/amazon-2.png',
716
- 'id' => '',
717
- ],
718
-
719
- ],
720
- [
721
- 'twae_story_title' => __( 'Amazon Announced Amazon Fresh Pickup', 'twae' ),
722
- 'twae_description' => __('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.','twae'),
723
- 'twae_year' => __('2007','twae'),
724
- 'twae_date_label' => __('Aug 2007','twae'),
725
- 'twae_extra_label' => __('Amazon History','twae'),
726
- 'twae_image' =>[
727
- 'url' => TWAE_URL . 'assets/images/amazon-3.png',
728
- 'id' => '',
729
- ],
730
- ],
731
- ],
732
- 'title_field' => '{{{ twae_story_title }}}',
733
- ]
734
- );
735
-
736
- $this->end_controls_section();
737
-
738
-
739
-
740
  $this->start_controls_section(
741
  'twae_advanced_section',
742
  [
@@ -888,7 +899,7 @@ class TWAE_Widget extends \Elementor\Widget_Base {
888
  }
889
 
890
  // for live editor
891
- protected function _content_template() {
892
 
893
  ?>
894
  <#
14
 
15
  public function __construct($data = [], $args = null) {
16
  parent::__construct($data, $args);
17
+ wp_register_style( 'twae-centered-css', TWAE_URL . 'assets/css/twae-centered-timeline.min.css', array(),TWAE_VERSION,'all');
18
+ wp_register_style( 'twae-horizontal-css', TWAE_URL . 'assets/css/twae-horizontal-styles.min.css', array(),TWAE_VERSION,'all');
19
+ wp_register_style( 'twae-fontello-css', TWAE_URL . 'assets/css/twae-fontello.css', array(),TWAE_VERSION,'all');
20
+ wp_register_style( 'twae-color-typography', TWAE_URL . 'assets/css/twae-colors-typography.min.css', array(),TWAE_VERSION,'all');
21
+ wp_register_style( 'font-awesome-5-all', ELEMENTOR_ASSETS_URL . 'lib/font-awesome/css/all.min.css', array(),TWAE_VERSION,'all');//load elementor fontawesome
22
+ wp_register_script( 'twae-horizontal-js', TWAE_URL . 'assets/js/twae-horizontal.min.js',[ 'elementor-frontend','jquery' ],TWAE_VERSION, true );
23
  }
24
 
25
 
70
  return [ 'twae' ];
71
  }
72
 
73
+ function story_content_settings(){
74
+ $this->start_controls_section(
75
+ 'twae_content_section',
76
+ [
77
+ 'label' => __( 'Timeline Stories', 'twae' ),
78
+ 'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
79
+ ]
80
+ );
81
+
82
+ $repeater = new \Elementor\Repeater();
83
+
84
+ $repeater->start_controls_tabs(
85
+ 'twae_story_tabs'
86
+ );
87
+
88
+ $repeater->start_controls_tab(
89
+ 'twae_content_tab',
90
+ [
91
+ 'label' => __( 'Content', 'twae' ),
92
+ ]
93
+ );
94
+
95
+
96
+
97
+ $repeater->add_control(
98
+ 'twae_date_label',
99
+ [
100
+ 'label' => __( 'Primary Label', 'twae' ),
101
+ 'type' => \Elementor\Controls_Manager::TEXT,
102
+ 'default' => '01 Jan 2020',
103
+ ]
104
+ );
105
+
106
+ $repeater->add_control(
107
+ 'twae_extra_label',
108
+ [
109
+ 'label' => __( 'Sub Label', 'twae' ),
110
+ 'type' => \Elementor\Controls_Manager::TEXT,
111
+ 'default' => 'Sub Label',
112
+ ]
113
+ );
114
+
115
+ $repeater->add_control(
116
+ 'twae_story_title',
117
+ [
118
+ 'label' => __( 'Timeline Story Title', 'twae' ),
119
+ 'type' => \Elementor\Controls_Manager::TEXT,
120
+ 'default' => 'Timeline Story',
121
+ 'label_block' => true,
122
+ ]
123
+ );
124
+
125
+ $repeater->add_control(
126
+ 'twae_image',
127
+ [
128
+ 'label' => __( 'Choose Image', 'twae' ),
129
+ 'type' => \Elementor\Controls_Manager::MEDIA,
130
+ 'description' => __('Image Size will not work with default image','twae'),
131
+ 'default' => [
132
+ 'url' => \Elementor\Utils::get_placeholder_image_src(),
133
+ ],
134
+ ]
135
+ );
136
+
137
+
138
+ $repeater->add_control(
139
+ 'twae_description',
140
+ [
141
+ 'label' => __( 'Description', 'twae' ),
142
+ 'type' => \Elementor\Controls_Manager::WYSIWYG,
143
+ 'default' => 'Add Description Here',
144
+ ]
145
+ );
146
+
147
+
148
+ $repeater->end_controls_tab();
149
+
150
+ $repeater->start_controls_tab(
151
+ 'twae_advanced_tab',
152
+ [
153
+ 'label' => __( 'Advanced Settings', 'twae' ),
154
+ ]
155
+ );
156
+
157
+ $repeater->add_control(
158
+ 'twae_show_year_label',
159
+ [
160
+ 'label' => __( 'Highlighted Label/Year', 'twae' ),
161
+ 'type' => \Elementor\Controls_Manager::SWITCHER,
162
+ 'label_on' => __( 'Show', 'twae' ),
163
+ 'label_off' => __( 'Hide', 'twae' ),
164
+ 'return_value' => 'yes',
165
+ 'default' => 'no',
166
+ ]
167
+ );
168
+
169
+ $repeater->add_control(
170
+ 'twae_year',
171
+ [
172
+ 'label' => __( 'Label Text', 'twae' ),
173
+ 'type' => \Elementor\Controls_Manager::TEXT,
174
+ 'default' => '2020',
175
+ 'condition' => [
176
+ 'twae_show_year_label' => [
177
+ 'yes'
178
+ ],
179
+ ]
180
+
181
+ ]
182
+ );
183
+
184
+ $repeater->add_group_control(
185
+ Group_Control_Image_Size::get_type(),
186
+ [
187
+
188
+ 'name' => 'twae_thumbnail', // Usage: `{name}_size` and `{name}_custom_dimension`, in this case `thumbnail_size` and `thumbnail_custom_dimension`.
189
+ 'separator' => 'none',
190
+ 'default' => 'large',
191
+
192
+ ]
193
+ );
194
+
195
+ $repeater->add_control(
196
+ 'twae_image_size_notice',
197
+ [
198
+ 'label' => __( 'Image Size will not work with default image', 'twae' ),
199
+ 'type' => \Elementor\Controls_Manager::HEADING,
200
+ 'separator' => 'none',
201
+ ]
202
+ );
203
+
204
+ $repeater->add_control(
205
+ 'twae_story_icon',
206
+ [
207
+ 'label' => __( 'Icon', 'twae' ),
208
+ 'type' => \Elementor\Controls_Manager::ICONS,
209
+ 'default' => [
210
+ 'value' => 'fab fa-amazon',
211
+ 'library' => 'solid',
212
+ ],
213
+ ]
214
+ );
215
+
216
+ $repeater->add_control(
217
+ 'twae_pro_options',
218
+ [
219
+ 'label' => __('','twae'),
220
+ 'type' => \Elementor\Controls_Manager::RAW_HTML,
221
+ 'raw' => '
222
+ <strong>'.__('Timeline Widget Addon','twae'). '</strong>
223
+ <a href="'.TWAE_BUY_PRO_LINK.'" target="_blank"><span class="twae-pro-label">'.__('Pro','twae').'</a></span>',
224
+ 'content_classes' => 'twae_pro_options',
225
+ 'separator' => 'before',
226
+ ]
227
+ );
228
+
229
+ $repeater->add_control(
230
+ 'twae_pro_content',
231
+ [
232
+ 'label' => '',
233
+ 'label_block' => true,
234
+ 'type' => \Elementor\Controls_Manager::RAW_HTML,
235
+ 'raw' => '<a target="_blank" href="'.TWAE_BUY_PRO_LINK.'"><img class="twae-screenshots" src="'.TWAE_URL . 'assets/images/slideshow-images.png"></a></br>
236
+ <a target="_blank" href="'.TWAE_BUY_PRO_LINK.'"><img class="twae-screenshots" src="'.TWAE_URL . 'assets/images/story-custom-colors.png"></a>',
237
+ 'content_classes' => 'twae_pro_content',
238
+ ]
239
+ );
240
+
241
+ $repeater->end_controls_tab();
242
+
243
+ $repeater->end_controls_tabs();
244
+
245
+ $this->add_control(
246
+ 'twae_list',
247
+ [
248
+
249
+ 'label' => __( 'Content', 'twae' ),
250
+ 'type' => \Elementor\Controls_Manager::REPEATER,
251
+ 'fields' => $repeater->get_controls(),
252
+ 'default' => [
253
+ [
254
+ 'twae_story_title' => __( 'Amazon Founded', 'twae' ),
255
+ 'twae_description' => __('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Erat enim res aperta. Ne discipulum abducam, times. Primum quid tu dicis breve? An haec ab eo non dicuntur?','twae'),
256
+ 'twae_year' => __('1994','twae'),
257
+ 'twae_date_label' => __('Jul 1994','twae'),
258
+ 'twae_extra_label' => __('Amazon History','twae'),
259
+ 'twae_image' =>[
260
+ 'url' => TWAE_URL . 'assets/images/amazon-1.png',
261
+ 'id' => '',
262
+ ],
263
+ ],
264
+ [
265
+ 'twae_story_title' => __( 'Amazon Prime Services', 'twae' ),
266
+ 'twae_description' => __('Aliter homines, aliter philosophos loqui putas oportere? Sin aliud quid voles, postea. Mihi enim satis est, ipsis non satis. Negat enim summo bono afferre incrementum diem. Quod ea non occurrentia fingunt, vincunt Aristonem.','twae'),
267
+ 'twae_year' => __('2005','twae'),
268
+ 'twae_date_label' => __('Feb 2005','twae'),
269
+ 'twae_extra_label' => __('Amazon History','twae'),
270
+ 'twae_image' =>[
271
+ 'url' => TWAE_URL . 'assets/images/amazon-2.png',
272
+ 'id' => '',
273
+ ],
274
+
275
+ ],
276
+ [
277
+ 'twae_story_title' => __( 'Amazon Announced Amazon Fresh Pickup', 'twae' ),
278
+ 'twae_description' => __('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.','twae'),
279
+ 'twae_year' => __('2007','twae'),
280
+ 'twae_date_label' => __('Aug 2007','twae'),
281
+ 'twae_extra_label' => __('Amazon History','twae'),
282
+ 'twae_image' =>[
283
+ 'url' => TWAE_URL . 'assets/images/amazon-3.png',
284
+ 'id' => '',
285
+ ],
286
+ ],
287
+ ],
288
+ 'title_field' => '{{{ twae_story_title }}}',
289
+ ]
290
+ );
291
+
292
+ $this->end_controls_section();
293
+
294
+
295
+
296
+ }
297
+ protected function register_controls() {
298
 
299
+ $this->story_content_settings();
300
  $this->start_controls_section(
301
  'twae_layout_section',
302
  [
393
  'tab' => \Elementor\Controls_Manager::TAB_STYLE,
394
  ]
395
  );
396
+
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
397
 
398
  $this->add_control(
399
  'twae_label_section',
429
  ]
430
  );
431
 
432
+ /*---- Sub Label ----*/
433
+ $this->add_control(
434
+ 'twae_sub_label_section',
435
+ [
436
+ 'label' => __( 'Sub Label', 'twae' ),
437
+ 'type' => \Elementor\Controls_Manager::HEADING,
438
+ 'separator' => 'before',
439
+ ]
440
+ );
441
+
442
+ $this->add_control(
443
+ 'twae_extra_label_color',
444
+ [
445
+ 'label' => __( 'Color', 'twae' ),
446
+ 'type' => Controls_Manager::COLOR,
447
+ 'scheme' => [
448
+ 'type' => Elementor\Core\Schemes\Color::get_type(),
449
+ 'value' => Elementor\Core\Schemes\Color::COLOR_3,
450
+ ],
451
+ 'selectors' => [
452
+ '{{WRAPPER}} .twae-wrapper span.twae-extra-label' => 'color: {{twae_extra_label_color}}',
453
+ ],
454
+ //'default' => '#7A7A7A',
455
+ ]
456
+ );
457
+
458
+ $this->add_group_control(
459
+ Group_Control_Typography::get_type(),
460
+ [
461
+ 'name' => 'twae_extra_label_typography',
462
+ 'label' => __( 'Typography', 'twae' ),
463
+ 'selector' => '{{WRAPPER}} .twae-wrapper span.twae-extra-label',
464
+ ]
465
+ );
466
+
467
+ $this->add_control(
468
+ 'twae_title_section',
469
+ [
470
+ 'label' => __( 'Title', 'plugin-name' ),
471
+ 'type' => \Elementor\Controls_Manager::HEADING,
472
+ 'separator' => 'before',
473
+ ]
474
+ );
475
+
476
+ /*---- Story Title ----*/
477
+ $this->add_control(
478
+ 'twae_story_title_color',
479
+ [
480
+ 'label' => __( 'Color', 'twae' ),
481
+ 'type' => Controls_Manager::COLOR,
482
+ 'scheme' => [
483
+ 'type' => Elementor\Core\Schemes\Color::get_type(),
484
+ 'value' => Elementor\Core\Schemes\Color::COLOR_1,
485
+ ],
486
+ 'selectors' => [
487
+ '{{WRAPPER}} .twae-wrapper .twae-data-container span.twae-title' => 'color: {{twae_story_title_color}}',
488
+ '{{WRAPPER}} .twae-horizontal span.twae-title' => 'color: {{twae_story_title_color}}',
489
+ ],
490
+ //'default' => '#23A455',
491
+ ]
492
+ );
493
+
494
+ $this->add_group_control(
495
+ Group_Control_Typography::get_type(),
496
+ [
497
+ 'name' => 'twae_title_typography',
498
+ 'label' => __( 'Typography', 'twae' ),
499
+ 'selector' => '{{WRAPPER}} .twae-wrapper span.twae-title',
500
+ ]
501
+ );
502
  $this->add_control(
503
  'twae_description_section',
504
  [
533
  ]
534
  );
535
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
536
  $this->add_control(
537
  'twae_story_bgcolor_section',
538
  [
571
  $this->start_controls_section(
572
  'twae_extra_styles_section',
573
  [
574
+ 'label' => __( 'More Settings', 'twae' ),
575
  'tab' => \Elementor\Controls_Manager::TAB_STYLE,
576
  ]
577
  );
578
 
579
+ $this->add_control(
580
+ 'twae_middle_line_section',
581
+ [
582
+ 'label' => __( 'Middle Line', 'twae' ),
583
+ 'type' => \Elementor\Controls_Manager::HEADING,
584
+ 'separator' => 'before',
585
+ ]
586
+ );
587
+
588
+ $this->add_control(
589
+ 'twae_line_color',
590
+ [
591
+ 'label' => __( 'Line Color', 'twae' ),
592
+ 'type' => Controls_Manager::COLOR,
593
+ 'selectors' => [
594
+ '{{WRAPPER}} .twae-wrapper .twae-line::before' => 'background-color: {{twae_line_color}}',
595
+ '{{WRAPPER}} .twae-wrapper .twae-timeline-centered .twae-icon' => 'border-color: {{twae_line_color}}',
596
+ '{{WRAPPER}} .twae-wrapper .twae-timeline-centered .twae-year' => 'border-color: {{twae_line_color}}',
597
+ '{{WRAPPER}} .twae-wrapper:before' => 'background-color: {{twae_line_color}}',
598
+ '{{WRAPPER}} .twae-wrapper:after' => 'background-color: {{twae_line_color}}',
599
+ '{{WRAPPER}} .twae-horizontal .twae-pagination.swiper-pagination-progressbar' => 'background-color: {{twae_line_color}}',
600
+ '{{WRAPPER}} .twae-horizontal .twae-button-prev' => 'color: {{twae_line_color}}',
601
+ '{{WRAPPER}} .twae-horizontal .twae-button-next' => 'color: {{twae_line_color}}',
602
+ ],
603
+ //'default' => '#D6D6D6',
604
+ ]
605
+ );
606
  /*---- Year Label ----*/
607
  $this->add_control(
608
  'twae_year_label_section',
609
  [
610
+ 'label' => __( 'Highlighted Label/Year
611
+ ', 'plugin-name' ),
612
  'type' => \Elementor\Controls_Manager::HEADING,
613
  'separator' => 'before',
614
  ]
646
  'selector' => '{{WRAPPER}} .twae-wrapper .twae-year',
647
  ]
648
  );
649
+
650
+
651
+
652
  $this->add_control(
653
+ 'twae_icon_section',
654
  [
655
+ 'label' => __( 'Icon/Icon placeholder', 'twae' ),
656
  'type' => \Elementor\Controls_Manager::HEADING,
657
  'separator' => 'before',
658
  ]
659
  );
660
+
661
  $this->add_control(
662
+ 'twae_icon_bgcolor',
663
  [
664
+ 'label' => __( 'Background Color', 'twae' ),
665
  'type' => Controls_Manager::COLOR,
666
  'scheme' => [
667
  'type' => Elementor\Core\Schemes\Color::get_type(),
668
+ 'value' => Elementor\Core\Schemes\Color::COLOR_1,
669
  ],
670
  'selectors' => [
671
+ '{{WRAPPER}} .twae-wrapper .twae-icon' => 'background-color: {{twae_icon_bgcolor}}',
672
+ '{{WRAPPER}} .twae-horizontal .twae-story-info' => 'border-color: {{twae_icon_bgcolor}}',
673
+ '{{WRAPPER}} .twae-horizontal .twae-story-info:before' => 'border-bottom-color: {{twae_icon_bgcolor}}',
674
+ '{{WRAPPER}} .twae-wrapper .twae-data-container:after' => 'border-right-color: {{twae_icon_bgcolor}}',
675
+ '{{WRAPPER}} .twae-wrapper .twae-right-aligned .twae-data-container' => 'border-left-color: {{twae_icon_bgcolor}}',
676
+ 'body[data-elementor-device-mode=desktop] {{WRAPPER}} .twae-wrapper .twae-left-aligned .twae-data-container,
677
+ body[data-elementor-device-mode=tablet] {{WRAPPER}} .twae-wrapper .twae-left-aligned .twae-data-container' => 'border-right-color: {{twae_icon_bgcolor}}',
678
+ 'body[data-elementor-device-mode=mobile] {{WRAPPER}} .twae-wrapper .twae-left-aligned .twae-data-container' => 'border-left-color: {{twae_icon_bgcolor}}',
679
  ],
680
+ //'default' => '#23A455',
 
 
 
 
 
 
 
 
 
681
  ]
682
  );
683
+
684
+
685
  /*---- Icon ----*/
686
  $this->add_control(
687
  'twae_icon_styles_section',
746
 
747
  $this->end_controls_section();
748
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
749
 
750
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
751
  $this->start_controls_section(
752
  'twae_advanced_section',
753
  [
899
  }
900
 
901
  // for live editor
902
+ protected function content_template() {
903
 
904
  ?>
905
  <#