https://www.smartnotepad.ai/js/my.js

1// Inline SVG icons (replace Font Awesome)
2var iconLeft = "<svg class='icon-chevron-left' width='16' height='16' viewBox='0 0 16 16' aria-hidden='true' focusable='false'><path fill='currentColor' d='M10.354 1.646a.5.5 0 0 1 0 .708L5.707 7l4.647 4.646a.5.5 0 0 1-.708.708l-5-5a.5.5 0 0 1 0-.708l5-5a.5.5 0 0 1 .708 0z'/></svg>";
3var iconRight = "<svg class='icon-chevron-right' width='16' height='16' viewBox='0 0 16 16' aria-hidden='true' focusable='false'><path fill='currentColor' d='M5.646 1.646a.5.5 0 0 0 0 .708L10.293 7 5.646 11.646a.5.5 0 0 0 .708.708l5-5a.5.5 0 0 0 0-.708l-5-5a.5.5 0 0 0-.708 0z'/></svg>";
4
5// business slider
6$(function() {
7  var owl = $("#business-slider");
8  var isRTL = $("body").attr("class") === "rtl";
9  owl.owlCarousel({
10      rtl: isRTL,
11      items: 1,
12      singleItem: true,
13      margin: 20,
14      loop: false,
15      nav: true,
16      navText: [
17          iconLeft,
18          iconRight
19        ],
20      dots: false,
21      autoplay: false,
22      autoplayTimeout: 8000,
23      autoplaySpeed: 1000,
24      smartSpeed: 1000,
25  });
26});
27
28// testimonial slider
29$(function() {
30  var owl = $("#testimonial_carousel");
31  var isRTL = $("body").attr("class") === "rtl";
32  // Check the number of items in the carousel
33  var isNoSlide = owl.hasClass('no-slide');
34  owl.owlCarousel({
35      rtl: isRTL,
36      items: 2,
37      margin: 20,
38      loop: !isNoSlide,
39      nav: !isNoSlide,
40      navText: isRTL ? [
41        iconRight, // Right for back in RTL
42        iconLeft    // Left for next in RTL
43      ] : [
44        iconLeft,   // Left for back in LTR
45        iconRight   // Right for next in LTR
46      ],
47      dots: false,
48      autoplay: !isNoSlide,
49      autoplayTimeout: 8000,
50      autoplaySpeed: 1000,
51      smartSpeed: 1000,
52      responsiveClass: true,
53      responsive: {
54          0: {
55            items: 1,
56            nav: false,
57          },
58          767: {
59            items: 2,
60            nav: false,
61          },
62          991: {
63            items: 2,
64            nav: !isNoSlide,
65          },
66      }
67  });
68});
69
70$(function() {
71  var owl = $("#meeting-slider");
72  var isRTL = $("body").attr("class") === "rtl";
73  owl.owlCarousel({
74      rtl: isRTL,
75      items: 1,
76      singleItem: true,
77      margin: 20,
78      loop: true,
79      nav: true,
80      navText: [
81          iconLeft,
82          iconRight
83        ],
84      dots: false,
85      autoplay: false,
86      autoplayTimeout: 8000,
87      autoplaySpeed: 1000,
88      smartSpeed: 1000,
89  });
90});
91
92
93// transcription slider
94$(function() {
95  var owl = $("#transcription-slider");
96  var isRTL = $("body").attr("class") === "rtl";
97  owl.owlCarousel({
98      rtl: isRTL,
99      items: 1,
100      singleItem: true,
101      margin: 20,
102      loop: false,
103      nav: true,
104      navText: [
105          iconLeft,
106          iconRight
107        ],
108      dots: false,
109      autoplay: false,
110      autoplayTimeout: 8000,
111      autoplaySpeed: 1000,
112      smartSpeed: 1000,
113  });
114});
115
116
117
118// timeline steps animation
119document.addEventListener("DOMContentLoaded", function() {
120  // Get all elements with the class 'step-line-div'
121  const steps = document.querySelectorAll('.step-line-div');
122
123  // Function to check if an element is in the viewport
124  function isInViewport(el) {
125      const rect = el.getBoundingClientRect();
126      return (
127          rect.top >= 0 &&
128          rect.left >= 0 &&
129          rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
130          rect.right <= (window.innerWidth || document.documentElement.clientWidth)
131      );
132  }
133
134  // Function to add/remove the 'in-view' class based on scroll position
135  function handleScroll() {
136      steps.forEach(step => {
137          if (isInViewport(step)) {
138              step.classList.add('in-view');
139          } 
140      });
141  }
142
143  // Listen for scroll events
144  window.addEventListener('scroll', handleScroll);
145
146  // Initial check in case any sections are already in view on load
147  handleScroll();
148});
149
150// Custom logic to ensure active class is applied when scrolling
151$(document).on('scroll', function () {
152  var scrollPosition = $(window).scrollTop();
153  var sections = $('.scrollspy-example-div');
154  var links = $('#list-example a');
155
156  // First, remove 'active' class from all links
157  links.removeClass('active');
158
159  sections.each(function (index, section) {
160    var sectionOffset = $(section).offset().top;
161    var sectionHeight = $(section).outerHeight();
162
163    if (sectionOffset - 0 <= scrollPosition && sectionOffset + sectionHeight > scrollPosition) {
164      links.removeClass('active');
165      $(links[index]).addClass('active');
166    }
167  });
168});
169
170// media_carousel slider
171$(function() {
172  var owl = $("#media_carousel");
173  var isRTL = $("body").attr("class") === "rtl";
174  var itemCount = owl.find('.item').length;
175  owl.owlCarousel({
176      rtl: isRTL,
177      items: 3,
178      margin: 20,
179      loop: itemCount > 3,
180      nav: false,
181      navText: [
182          iconLeft,
183          iconRight
184        ],
185      dots: false,
186      autoplay: true,
187      autoplayTimeout: 8000,
188      autoplaySpeed: 1000,
189      smartSpeed: 1000,
190      responsiveClass: true,
191      responsive: {
192          0: {
193            items: 1,
194            loop: itemCount > 1,
195          },
196          767: {
197            items: 2,
198            loop: itemCount > 2,
199          },
200          991: {
201            items: 3,
202            loop: itemCount > 3,
203          },
204      }
205  });
206});