PageSourceSearch

https://www.jumpspree.com/social

html jumpspree.com collected 2026-10-01 14:24:14 UTC 1,184,674 bytes, 29,006 lines download raw bytes

1
2<!DOCTYPE html>
3<html lang="en">
4<head>
5<meta charset="UTF-8">
6<link rel="preconnect" href="https://code.jquery.com">
7<link rel="preconnect" href="https://cdn.jsdelivr.net">
8<link rel="preconnect" href="https://fonts.googleapis.com">
9<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10<link rel="preconnect" href="https://cdnjs.cloudflare.com">
11<link rel="preconnect" href="https://kit.fontawesome.com">
12 <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> 
13<!--<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
14
15
16<title>Jumpspree | Social Shopping Feed &amp; Creator Marketplace </title>
17<meta name="description" content="Join Jumpspree—the social shopping app where creators post, sell and earn. Discover unique products from real people and support small brands. Sign up now.">
18<meta name="keywords" content="social marketplace, creator marketplace, social shopping app, buy and sell app, shopping social network, sell online marketplace, shop and earn app, community commerce platform">
19
20<meta name="robots" content="index, follow">
21
22
23<link rel="icon" href="https://www.jumpspree.com/public/images/grad-logo.png?ver=1.027">
24<link rel="apple-touch-icon" href="https://www.jumpspree.com/public/images/jumpspree_preview_new.png">
25<link rel="preload" href="https://www.jumpspree.com/public/css/hgi-stroke-rounded.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
26<noscript><link rel="stylesheet" href="https://www.jumpspree.com/public/css/hgi-stroke-rounded.css"></noscript>
27
28<meta name="apple-itunes-app" content="app-id=1558701442">
29
30<link rel="canonical" href="https://www.jumpspree.com/social">
31<link rel="preload" as="image" href="https://cubesnack-seller.s3.amazonaws.com/products/1409260849545517.jpg">
32<meta property="og:url" content="https://www.jumpspree.com/social">
33<meta property="og:title" content="Jumpspree | Social Shopping Feed &amp; Creator Marketplace ">
34<meta property="og:type" content="website">
35<meta property="og:description" content="Join Jumpspree—the social shopping app where creators post, sell and earn. Discover unique products from real people and support small brands. Sign up now.">
36<meta property="og:site_name" content="Jumpspree">
37<meta property="og:image" content="https://www.jumpspree.com/public/images/jumpspree_preview_new.png">
38<meta property="og:image:alt" content="Jumpspree">
39<meta property="og:image:width" content="512">
40<meta property="og:image:height" content="512">
41<meta name="twitter:title" content="Jumpspree | Social Shopping Feed &amp; Creator Marketplace ">
42<meta name="twitter:description" content="Join Jumpspree—the social shopping app where creators post, sell and earn. Discover unique products from real people and support small brands. Sign up now.">
43<meta name="twitter:url" content="https://www.jumpspree.com/social">
44<meta name="twitter:card" content="summary_large_image">
45<meta name="twitter:image" content="https://www.jumpspree.com/public/images/jumpspree_preview_new.png">
46<meta name="twitter:image:alt" content="Jumpspree">
47
48<script type="application/ld+json">
49{
50  "@context": "https://schema.org",
51  "@type": "Organization",
52  "name": "Jumpspree",
53  "url": "https://www.jumpspree.com",
54  "logo": "https://www.jumpspree.com/logo.png",
55  "sameAs": [
56    "https://www.facebook.com/jumpspree",
57    "https://www.instagram.com/jumpspree",
58    "https://www.linkedin.com/company/jumpspree"
59  ]
60}
61</script>
61
62
63<script type="application/ld+json">
64{
65  "@context": "https://schema.org",
66  "@type": "WebSite",
67  "url": "https://www.jumpspree.com",
68  "potentialAction": {
69    "@type": "SearchAction",
70    "target": "https://www.jumpspree.com/search?q={search_term_string}",
71    "query-input": "required name=search_term_string"
72  }
73}
74</script>
74
75
76
77
78<!--
78<script> (function(){ var s = document.createElement('script'); var h = document.querySelector('head') || document.body; s.src = 'https://acsbapp.com/apps/app/dist/js/app.js'; s.async = true; s.onload = function(){ acsbJS.init({ statementLink : '', footerHtml : '', hideMobile : false, hideTrigger : false, disableBgProcess : false, language : 'en', position : 'left', leadColor : '#6E12FF', triggerColor : '#6E12FF', triggerRadius : '50%', triggerPositionX : 'right', triggerPositionY : 'bottom', triggerIcon : 'people', triggerSize : 'small', triggerOffsetX : 20, triggerOffsetY : 20, mobile : { triggerSize : 'small', triggerPositionX : 'right', triggerPositionY : 'bottom', triggerOffsetX : 10, triggerOffsetY : 10, triggerRadius : '50%' } }); }; h.appendChild(s); })(); </script>
78-->
79
80<!--
81<script>
82(function(){
83  var s = document.createElement('script');
84  var h = document.querySelector('head') || document.body;
85  s.src = 'https://acsbapp.com/apps/app/dist/js/app.js';
86  s.async = true;
87  s.onload = function(){
88    acsbJS.init({
89      statementLink : '',
90      footerHtml : '',
91      hideMobile : false,
92      hideTrigger : false,
93      disableBgProcess : false,
94      language : 'en',
95      position : 'left',
96      leadColor : '#6E12FF',
97      triggerColor : '#6E12FF',
98      triggerRadius : '50%',
99      triggerPositionX : 'right',
100      triggerPositionY : 'bottom',
101      triggerIcon : 'people',
102      triggerSize : 'small',
103      triggerOffsetX : 20,
104      triggerOffsetY : 20,
105      mobile : {
106        triggerSize : 'small',
107        triggerPositionX : 'right', // Keep default
108        triggerPositionY : 'center',
109        triggerOffsetX : 10,
110        triggerOffsetY : 10,
111        triggerRadius : '50%'
112      }
113    });
114
115    // Wait for widget to render, then override styles
116    setTimeout(function(){
117      var style = document.createElement('style');
118      style.innerHTML = `
119        @media(max-width: 767px) {
120          .acsb-trigger {
121            left: 50% !important;
122            transform: translateX(-50%) !important;
123            right: auto !important;
124          }
125        }
126      `;
127      document.head.appendChild(style);
128    }, 1500); // Allow time for the trigger to appear
129  };
130  h.appendChild(s);
131})();
132</script>
132
133-->
134
135<!--
136<script>
137(function(){
138  var blockedPatterns = [
139    "/live-streaming",
140    "/start-streaming",
141    "/seller-pad/live-stream-start"
142  ];
143
144  var currentUrl = window.location.href;
145
146  var isBlocked = blockedPatterns.some(function(pattern) {
147    return currentUrl.includes(pattern);
148  });
149
150  if (isBlocked) {
151    return;
152  }
153
154  var s = document.createElement('script');
155  var h = document.querySelector('head') || document.body;
156  s.src = 'https://acsbapp.com/apps/app/dist/js/app.js';
157  s.async = true;
158  s.onload = function(){
159    acsbJS.init({
160      statementLink : '',
161      footerHtml : '',
162      hideMobile : false,
163      hideTrigger : false,
164      disableBgProcess : false,
165      language : 'en',
166      position : 'left',
167      leadColor : '#6E12FF',
168      triggerColor : '#6E12FF',
169      triggerRadius : '50%',
170      triggerPositionX : 'right',
171      triggerPositionY : 'bottom',
172      triggerIcon : 'people',
173      triggerSize : 'small',
174      triggerOffsetX : 20,
175      triggerOffsetY : 20,
176      mobile : {
177        triggerSize : 'small',
178        triggerPositionX : 'right',
179        triggerPositionY : 'center',
180        triggerOffsetX : 10,
181        triggerOffsetY : 10,
182        triggerRadius : '50%'
183      }
184    });
185
186    setTimeout(function(){
187      var style = document.createElement('style');
188      style.innerHTML = `
189        @media(max-width: 767px) {
190          .acsb-trigger {
191            left: 50% !important;
192            transform: translateX(-50%) !important;
193            right: auto !important;
194          }
195        }
196      `;
197      document.head.appendChild(style);
198    }, 1500);
199  };
200  h.appendChild(s);
201})();
202</script>
202
203-->
204
205
206<link href="https://www.jumpspree.com/public/css/header-all.css?ver:1.011779" rel="stylesheet">
207<!--<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
208<link rel="stylesheet" href="/public/css/stylesheet.css?ver:1.294982ee444491020">
209<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
210<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">-->
211
212<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
vendor: 2 bytes, line 212
212
213<script async src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
213
214
215<!--css in header-all.css-->
216<style>
217body.light-mode .footer-inner {background: #fff !important}
218body.light-mode .gta-text-full.border-top.other-app h2.mobb-mb-10 a {
219    color: #222 !important;
220}    
221body.dark-mode .nav-bar.hide-on-mob li a:hover {
222        color: #000 !important;
223    } 
224body.dark-mode .nav-bar.hide-on-mob .get-app-btn a:hover {
225        color: #fff !important;
226    }    
227     /* Hide Google Translate top banner + overlay */
228        iframe[id^=":"] {
229  width:0 !important;
230  height:0 !important;
231  opacity:0 !important;
232  pointer-events:none !important;
233  position:fixed !important;
234  top:-9999px !important;
235  left:-9999px !important;
236  border:0 !important;
237}
238body.light-mode .nav-bar ul li:first-child a:hover, .nav-bar.hide-on-mob li a:hover {
239    background: #e3e3e3 !important;
240}    
241
242        /* Hide Google Translate UI overlays */
243        
244
245        /* Hide Google Translate tooltip, banner, icon, etc. */
246        .goog-te-banner-frame,
247        .goog-te-balloon-frame,
248        .goog-te-menu-frame,
249        .goog-tooltip,
250        .goog-tooltip:hover,
251        .goog-text-highlight {
252          
253          opacity: 0 !important;
254          visibility: hidden !important;
255          pointer-events: none !important;
256        }
257
258        /* Prevent body shift when banner injects */
259        body {
260            top: 0px !important;
261        }
262        .notranslate {
263        translate: no !important;
264        }
265    @media screen and (min-width:768px){
266.nav-bar.hide-on-mob li a:hover {
267    background: #222;
268    border-radius: 50px;
269}
270.lang-btn {
271    display: none
272}
273
274    }
275    
276@media screen and (max-width:767px){
277body.light-mode .qrcodeforstaticpage img {
278        filter: brightness(0) !important;
279    }    
280body.light-mode img.search-icon {
281    filter: invert(0) !important;
282}    
283body.light-mode .share-url.get-the-app-btn img {
284    filter: invert(1) !important;
285}    
286.popup-content .inner-language-box {
287    padding-right: 0px !important;
288}    
289    button#langCurrencyBtn{display: none !important}    
290.lang-btn {
291    clear: both;
292    padding: 0 12px 10px;
293    position: absolute;
294    bottom: 0;
295    display: flex;
296    align-items: center;
297    color: #fff;
298}
299.lang-btn {
300    position: fixed;
301    bottom: 10px;
302}
303.lang-btn #langCurrencyBtn {
304    background: no-repeat;
305}    
306.lang-btn button.langCurrencyBtn {
307        position: static;
308        display: inline-block !important;
309        width: auto;
310        margin-right: 8px;
311        margin-left: 9px;
312        width: 35px;
313        height: 35px;
314        border-radius: 50%;
315        display: flex;
316        align-items: center;
317        justify-content: center;
318        background: transparent;
319        border: none;
320        width: auto;
321}
322.lang-btn button.langCurrencyBtn svg {
323    margin-right: 0;
324}    
325.lang-btn button#langCurrencyBtn2 {
326    color: #fff;
327    display: flex !important;
328    gap: 9px;
329    align-items: center;
330}
331.lang-btn {
332    display: flex;
333    align-items: center;
334}    
335    }
336</style>
337
338<style>
339/* lang change */
340#langCurrencyPopup .tabs .tab.active {
341    border-bottom: none;
342    background: #333 !important;
343    padding: 0;
344    padding: 0 25px !important;
345    border-radius: 35px !important;
346    font-size: 14px;
347}
348
349#langCurrencyPopup button.language-option {
350    border: none;
351    color: #fff;
352    width: 18.5%;
353    max-width: 20%;
354    text-align: left;
355    padding: 12px;
356    border-radius: 10px;
357    margin: 0;
358    background: #f5f5f503 !important;
359}
360#langCurrencyPopup .tabs {
361    border-bottom: none !important;
362}
363.inner-language-box {
364    margin: 0 !important;
365}
366 .popup-content .inner-language-box .tabs .tab {
367    color: #fff;
368    font-size: 14px;
369}
370div#allLanguagesContainer {
371    padding: 20px 0;
372    display: flex;
373    flex-wrap: wrap;
374    gap: 15px;
375    align-items: flex-start;
376    margin-top: 0 !important;
377    padding-top: 0 !important;
378}
379#langCurrencyPopup #popupClose {
380    right: 25px;
381}
382div#langCurrencyPopup #popupClose img {
383    width: 26px;
384}
385div#langCurrencyPopup #popupClose {
386    top: 25px !important;
387}
388#langCurrencyPopup .popup-content {
389    padding: 0 !important;
390}
391#langCurrencyPopup .tabs .tab {
392    padding: 10px 0;
393    border: none;
394    background: none;
395    cursor: pointer;
396    color: #fff !important;
397    flex: none;
398    margin-right: 20px;
399}
400div#tab-currency {
401    padding: 10px 25px;
402}
403#allCurrencies button.active {
404    background: #333 !important;
405    color: #fff;
406    border: 1px solid #ccc !important;
407}
408#langCurrencyPopup  button.language-option.notranslate.active{background: #fff !important}
409button.language-option.notranslate.active * {
410    color: #000;
411}
412.popup-content {
413    width: 100% !important;
414    max-width: 950px !important;
415}
416.lang-sub {
417    font-weight: 300 !important;
418    font-size: 13px !important;
419}
420div#tab-lang h3.popup-label {
421    color: #fff;
422    font-size: 16px;
423}
424#langCurrencyPopup .tabs {
425    border-bottom: none !important;
426    padding: 25px 25px 15px;
427    border-bottom: 1px solid #3241585c !important;
428}
429#langCurrencyPopup div#tab-lang {
430    padding: 25px;
431    margin-top: 0;
432}
433.note-language p {
434    color: #ccc;
435    padding: 23px 0 25px;
436    line-height: 17px;
437    font-size: 13px;
438}
439
440.note-language {
441    margin: 0 25px;
442}
443#langCurrencyPopup button.language-option.active {
444    background: #f5f5f5 !important;
445    color: #000;
446}
447button.language-option.active .lang-sub {
448    font-weight: 600 !important;
449}
450#allCurrencies button {
451    margin: 5px;
452    padding: 8px 12px;
453    border-radius: 5px;
454    cursor: pointer;
455    border: none !important;
456    color: #fff;
457    width: auto;
458    max-width: 20%;
459    text-align: left;
460    padding: 12px;
461    border-radius: 10px;
462    margin: 0;
463    background: #f5f5f503 !important;
464}
465#allCurrencies button.active {
466    background: #f5f5f5 !important;
467    color: #000 !important;
468}
469/*Hindi Lang*/
470.profile-drop-down ul li a:lang(hi) {
471    font-size: 12px;
472}
473#signup-new-process .signup-footer .arrow-right:lang(hi), #signup-new-process .signup-footer .arrow-right:lang(fr), #signup-new-process .signup-footer .arrow-right:lang(fa), #signup-new-process .signup-footer .arrow-right:lang(pt-PT), #signup-new-process .signup-footer .arrow-right:lang(sw) {
474    width: 22px;
475    top: 2px;
476}
477#signup-new-process .arrow-right:lang(hi), #verifyreset-new-process .arrow-right:lang(hi), #enter-new-password .arrow-right:lang(hi) {
478    width: 22px;
479    top: 1px;
480    position: relative;
481}
482#download-app-popup #download-app-popup-inner .download-btns a:lang(hi) {
483    display: flex;
484    gap: 5px;
485    align-items: center;
486}
487
488.get-more-class.get-more-mob:lang(te), .get-more-class.get-more-mob:lang(fa){
489    width: 160px;
490}
491
492.profile-drop-down ul li a:lang(fa) {
493    font-size: 13px;
494}
495.get-more-class.get-more-mob:lang(ko), .get-more-class.get-more-mob:lang(fr), .get-more-class.get-more-mob:lang(kn), .get-more-class.get-more-mob:lang(ro){
496    width: 160px;
497}
498.get-more-class.get-more-mob:lang(ar), .get-more-class.get-more-mob:lang(bg){
499        width: 140px;
500    }
501.get-more-class.get-more-mob:lang(pt-PT) {
502        width: 130px;
503    }
504.get-more-class.get-more-mob:lang(tr) {
505        width: 190px;
506    }
507.get-more-class.get-more-mob:lang(es){
508    width: 130px;
509}
510.recomendation h4:lang(te) {
511    font-size: 14px;
512}
513
514#signup-new-process #step03 .form-box h2.signup-title:lang(fr), #signup-new-process #step04 .form-box h2.signup-title:lang(fr), #signup-new-process #step05 .form-box h2.signup-title:lang(fr)  {
515    line-height: 28px;
516    margin-bottom: 15px !important;
517}
518/*Hindi Lang*/
519
520body.dark-mode .popup-content {
521    background: #222;
522}
523.inner-language-box {
524    margin-top: 0px !important;
525    overflow: auto !important;
526    padding: 0px 0px !important;
527    height: calc(100vh - 250px) !important;
528    max-height: 875px !important;
529    padding-right: 15px !important;
530}    
531button#langCurrencyBtn {
532    position: fixed;
533    right: 25px;
534    bottom: 25px;
535    background: #82828287;
536    border: none;
537    color: #000 !important;
538    width: 35px;
539    height: 35px;
540    border-radius: 50%;
541    display: flex;
542    align-items: center;
543    justify-content: center;
544    /* opacity: 0; */
545}       
546div#tab-lang h3.popup-label {
547    color: #fff;
548    font-size: 16px;
549    margin: 0 0 2rem !important;
550}       
551       #langCurrencyBtn{display: flex!important}  
552div#tab-currency h3 {
553    margin-bottom: 10px;
554    border-bottom: none;
555    padding-bottom: 5px;
556    color: #222;
557    font-size: 16px;
558    font-weight: 600;
559    color: #fff;
560}  
561    
562body.light-mode, body.light-mode header{
563    background: #fff !important;
564}    
565body.light-mode .app-install.email-verification {
566    background: #f1f1f1;
567    border: 1px solid #eaeaea;
568}
569body.light-mode .app-install.email-verification h1 {
570    color: #222;
571}    
572body.light-mode .email-verification.reset-pass.reset-pass1.app-install p{
573        color: #222
574    }    
575body.light-mode .or-change a {
576    color: #222 !important;
577}
578body.light-mode  #forgotpasswordform .form-control {
579    background-color: #cbcbcb !important;
580    border: 1px solid #3241585c !important;
581    color: #d4d4d4 !important;
582}    
583body.light-mode .blog-box {
584    border: 1px solid #eaeaea !important;
585    background: #f1f1f1;
586}
587body.light-mode .blog-box h3 a {
588    color: #222 !important;
589}
590body.light-mode .tncpages a {
591    color: #222 !important;
592}    
593body.light-mode .tncpages h1, body.light-mode .tncpages h2{
594        color: #222 !important
595    }    
596body.light-mode .blog-detail .blog-date {
597    color: #222;
598}
599body.light-mode .back-button img {
600    filter: invert(0);
601    }
602body.light-mode .blog-box {
603    border: none !important;
604    background: none !important;
605}
606body.light-mode .tncpages p, body.light-mode .tncpages ul, body.light-mode .tncpages ul li {
607    color: #222 !important;
608} 
609    body.light-mode .tncpages ol li b, body.light-mode .tncpages ol li, body.light-mode .tncpages ul li {
610        color: #222 !important;
611    }
612body.light-mode .blog-box h3 {
613    color: #222;
614    }
615body.light-mode .nav-bar ul a {
616    color: #222 !important;
617}
618body.light-mode .faq-new-wrapper h3 {
619    color: #222;
620}
621body.light-mode .tncpages ul.accordion > li > a {
622    background: #f1f1f1 !important;
623}    
624body.light-mode .accordion li {
625    background: #ffffff !important;
626}
627body.light-mode .tncpages ul.accordion>li>a:hover {
628    color: #222 !important;
629}
630body.light-mode .email-verification {
631    background: #ffffff;
632    padding: 0;
633} 
634body.light-mode .email-verification.after-login.textpages h6 b {
635    color: #222 !important;
636}     
637body.light-mode .read-more-footer {
638    border-top: 1px solid #3241582b;
639} 
640body.light-mode .tncpages h6 strong, body.light-mode .tncpages li, body.light-mode .tncpages h5 {
641    color: #222 !important;
642}    
643    
644/* lang change */
645
646@media (max-width:767px) {
647.popup-content .inner-language-box {
648        padding-right: 0px !important;
649    }    
650/* lang change */
651#langCurrencyPopup .popup-content {
652    padding-right: 0px;
653    position: fixed;
654    bottom: 0;
655    border-radius: 25px 25px 0 0;
656}    
657.note-language p {
658    color: #ccc;
659    padding: 11px 0 9px;
660    line-height: 16px;
661    font-size: 10px;
662    margin-bottom: 0;
663}    
664#langCurrencyPopup .tabs .tab.active {
665    font-size: 12px !important;
666}    
667#langCurrencyPopup .tabs .tab {
668    font-size: 12px;
669}
670div#tab-lang h3.popup-label {
671    font-size: 14px;
672}
673    
674    button#langCurrencyBtn {
675        right: 35px;
676        bottom: 75px;
677        z-index: 99999999999 !important;
678        background: #4f4f4f;
679    }   
680#langCurrencyPopup button.language-option {
681    width: 47.5%;
682    max-width: 47.5%;
683}
684#langCurrencyPopup .tabs {
685    padding: 20px 20px 15px;
686}
687#langCurrencyPopup div#tab-lang {
688    padding: 20px;
689}    
690div#langCurrencyPopup #popupClose {
691    top: 18px !important;
692}
693div#langCurrencyPopup #popupClose img {
694    width: 22px;
695}    
696/* lang change */
697    
698    
699    
700    .list-type-number {
701        margin-left: 2.3rem
702    }
703    
704    
705}       
706    
707body.dark-mode span.field_icon.toggle-password2 i {
708    color: #fff;
709}    
710</style>
711<!--css in header-all.css-->
712
713
714</head>
715              <body class="dark-mode user-not-logged-in">
716                
717<div class="blog-side-menu" onclick="$('.blog-side-menu').removeClass('blog-side-menu-show'); $('.col-md-3.col-sm-2').removeClass('side-menu-opend')">
718<div class="side-menu-inner" onclick="window.event.cancelBubble = true;">
719<div class="side-menu-logo">
720<!--    <a href="https://www.jumpspree.com"><img src="https://www.jumpspree.com/public/images/ico.png?ver:1.08" style="display:none" class="logo-ico hide-on-desktop hide-on-mob" alt="jumpspree-logo" title="jumpspree logo"></a>-->
721    <a href="https://www.jumpspree.com"><img src="https://www.jumpspree.com/public/images/logo-icon-black.png?ver:1.08" style="display:none" class="logo-ico hide-on-desktop hide-on-mob" alt="jumpspree-logo" title="jumpspree logo"></a>
722</div>   
723    <ul style="margin-bottom:0">
724<!--
725    <li><a href="https://www.jumpspree.com/seller-pad/live-streams" target="_blank"><img style="width: 17px;
726    margin-left: -2px;
727    margin-right: 2px;" src="https://www.jumpspree.com/public/images/seller-pad-iconn.png" class="home-icon-outline" alt="Home" title="Home"> Seller Pad</a></li>
728-->
728
729   <li><a href="https://www.jumpspree.com/seller-pad/live-streams" target="_blank"><img style="width: 17px;
730    margin-left: -2px;
731    margin-right: 2px;" src="https://www.jumpspree.com/public/images/sellerpad_new.png" class="home-icon-outline" alt="Home" title="Home"> Seller Pad</a></li>
732    <li><a href="https://www.jumpspree.com/frequently-asked-questions" target="_blank"><i class="hgi hgi-stroke hgi-message-question"></i> FAQ</a></li>
733    <li><a href="https://www.jumpspree.com/blog" target="_blank"><i class="hgi hgi-stroke hgi-license"></i> Blog</a></li>
734    <li><a href="https://www.jumpspree.com/selling-fees" target="_blank"><i class="hgi hgi-stroke hgi-dollar-circle"></i> Selling fees  </a></li>
735    <!--                            <li><a href="#"  target="_blank">Seller Resources</a></li>-->
736<!--    <li><a href="https://www.jumpspree.com/selling-fees" target="_blank"><i class="hgi hgi-stroke hgi-shipping-truck-01"></i> Shipping guidelines</a></li>-->
737    <li><a href="https://www.jumpspree.com/return-policy" target="_blank"><i class="hgi hgi-stroke hgi-return-request"></i> Return policy</a></li>
738    <li><a href="https://www.jumpspree.com/privacy-policy" target="_blank"><i class="hgi hgi-stroke hgi-square-lock-02"></i> Privacy policy</a></li>
739    <li><a href="https://www.jumpspree.com/terms-of-use" target="_blank"><i class="hgi hgi-stroke hgi-filter-mail-square"></i> Terms of use</a></li>
740    <!--    <li class="logout-btn"><a href="#">Log Out</a></li>-->
741    </ul>
742    
743    <div class="side-menu-bottom">
744        <ul style="margin-top:0"> 
745<!--        <li><a href="https://www.jumpspree.com/account_settings"><i class="hgi hgi-stroke hgi-account-setting-03"></i> Account setting</a></li>-->
746        <li style="display:none"> 
747                  
748
749                    <a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')"><i class="hgi hgi-stroke hgi-account-setting-03"></i> Account settings</a>
750
751                            </li>
752        <li><a href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android" style="    display: flex;align-items: center;"><span><img style="width: 15px;margin-right: 8px;float: none;margin-top: -3px; border-radius:5px" src="https://www.jumpspree.com/public/images/grad-logo.png" class="get-the-app" alt="Get the app" title="Get the app"> Get the app</span></a></li>    
753        <li class="report-a-problem-tab"><a href="javascript:void(0)"  onclick="$('#report-on-more-option').fadeIn('fast'); $('.blog-side-menu').removeClass('blog-side-menu-show');$('.left_section').removeClass('side-menu-opend');"><i class="hgi hgi-stroke hgi-alert-circle"></i> Report a problem</a></li>
754<!--        <li><a href=""><i class="hgi hgi-stroke hgi-login-03"></i> Sign in</a></li>-->
755        <li> 
756                  
757
758<!--                    <a href="javascript:void(0)" onclick="showSignInPopUp()"><i class="hgi hgi-stroke hgi-login-03"></i> Sign in</a>-->
759                    <a href="javascript:void(0)" onclick="https://www.jumpspree.com/sign-in"><i class="hgi hgi-stroke hgi-login-03"></i> Sign in</a>
760
761                            </li>
762        </ul>
763    </div>
764    
765         
766    <div class="lang-btn">
767        <button class="langCurrencyBtn" id="langCurrencyBtn2" onclick="openLangPopup()">
768  <svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 16 16" style="display:block;height:16px;width:16px;fill:#fff;">
769    <path d="M8 .25a7.77 7.77 0 0 1 7.75 7.78 7.75 7.75 0 0 1-7.52 7.72h-.25A7.75 
770             7.75 0 0 1 .25 8.24v-.25A7.75 7.75 0 0 1 8 .25zm1.95 
771             8.5h-3.9c.15 2.9 1.17 5.34 1.88 5.5H8c.68 0 1.72-2.37 
772             1.93-5.23zm4.26 0h-2.76c-.09 1.96-.53 3.78-1.18 
773             5.08A6.26 6.26 0 0 0 14.17 9zm-9.67 0H1.8a6.26 
774             6.26 0 0 0 3.94 5.08 12.59 12.59 0 0 1-1.16-4.7l-.03-.38zm1.2-6.58
775             -.12.05a6.26 6.26 0 0 0-3.83 5.03h2.75c.09-1.83.48-3.54 
776             1.06-4.81zm2.25-.42c-.7 0-1.78 2.51-1.94 5.5h3.9c-.15-2.9-1.18-5.34
777             -1.89-5.5h-.07zm2.28.43.03.05a12.95 12.95 0 0 1 1.15 
778             5.02h2.75a6.28 6.28 0 0 0-3.93-5.07z"></path>
779  </svg>
780  <span class="notranslate" id="langName">English</span>
781</button> 
782   
783   
784<!--   <button id="currency-left-menu" class="tab" data-tab="currency">Currency</button>-->
785    </div>
786</div>
787    
788</div>
789  <div class="header-wrapper">
790      <div class="container-fluid p-0">
791      <img src="" style="display: none;" alt="meta image">
792               <header>
793          <div class="container">
794              <div class="d-flex justify-content-between align-items-center">
795               <div class="logo xl">
796                  <div class="get-more-class get-more-mob" style="display:none; position: absolute;top: 6px;
797    left: 12px;"><a class="share-url" href="javascript:void(0)" onclick="getmorepopup()"  style="    border-radius: 53px;
798    padding: 0px 20px;
799    margin-right: 0;
800    border: none;
801    background: #111;
802    height: 35px;
803    display: flex;
804    align-items: center;
805    padding: 0 9px;
806    font-size: 10px"><img src="https://www.jumpspree.com/public/images/more-icon-check.png" alt="verified" title="Get MORE" style="margin-right: 5px;
807    color: #fff;
808    filter: invert(0) !important;
809    width: 20px !important;
810    margin-top: -4px;"> Get MORE</a></div>
811<!--                   <a href="https://www.jumpspree.com"><img src="https://www.jumpspree.com/public/images/logo-white-jumpspree.png?ver:1.008" class="logo-hide-on-mob" alt="jumpspree-logo" title="jumpspree logo"><img src="https://www.jumpspree.com/public/images/ico.png?ver:1.08" style="display:none" class="logo-ico hide-on-desktop hide-on-mob" alt="jumpspree-logo" title="jumpspree logo"></a>-->
812                   <a href="https://www.jumpspree.com"><img src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.008" class="logo-hide-on-mob" alt="jumpspree-logo" title="jumpspree logo"><img src="https://www.jumpspree.com/public/images/logo-icon-black.png?ver:1.08" style="display:none" class="logo-ico hide-on-desktop hide-on-mob" alt="jumpspree-logo" title="jumpspree logo"></a>
813                   
814<!--                   https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android-->
815                   <a class="share-url get-the-app-btn logo-hide-on-mob qrcodeforstaticpage" href="javascript:void(0)" onclick="$('#ios-app').fadeIn('fast')" style="border-radius: 53px;
816    padding: 0px 9px;
817    margin-right: 0;
818    border: 1px solid #3241585c;
819    background: #111;
820    height: 35px;
821    display: flex;
822    align-items: center;font-size:10px;top: 9px;right: 55px; position: absolute; display:none"><img src="https://www.jumpspree.com/public/images/qr.png?ver:10.2" alt="QR Code" title="QR Code" style="width: 18px;margin-top: -5px;filter: invert(1) brightness(5);"> Get the App</a>
823                   
824                   <div class="get-more-class refer-frnd-mob get-app-btn" style="display:none">
825<!--
826                   <a class="share-url" href="https://www.jumpspree.com/refer-friend" style="border-radius: 53px;
827    padding: 0px 9px;
828    margin-right: 0;
829    border: 1px solid #3241585c;
830    background: #111;
831    height: 35px;
832    display: flex;
833    align-items: center;font-size:10px"><i class="fa-light fa-gift" aria-hidden="true" style="margin-right: 5px;font-size: 15px;"></i> Refer a Friend</a>
834-->
835<!--            https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android-->
836             <a class="share-url get-the-app-btn" href="#" onclick="$('#search-popup-wrapper-new').fadeIn('fast'); $('body').addClass('overflow-hidden');"  style="border-radius: 53px;
837    padding: 0px 9px;
838    margin-right: 0;
839    border: 1px solid #3241585c;
840    background: #111;
841    height: 35px;
842    margin-right:7px;
843    display: flex;
844    align-items: center;font-size:10px"><img class="search-icon" src="https://www.jumpspree.com/public/images/lense--search.png?ver:10.2" alt="Search" title="Search" style="width: 18px;margin-top: -5px;filter: invert(1) brightness(5);"></a>
845    
846    <a class="share-url get-the-app-btn" onclick="$('#ios-app').fadeIn('fast');" href="javascript:void(0)"  style="border-radius: 53px;
847    padding: 0px 9px;
848    margin-right: 0;
849    border: 1px solid #3241585c;
850    background: #111;
851    height: 35px;
852    display: flex;
853    margin-right:7px;
854    align-items: center;font-size:10px"><img src="https://www.jumpspree.com/public/images/qr.png?ver:10.2" alt="QR Code" title="QR Code" style="width: 18px;margin-top: -5px;filter: invert(1) brightness(5);"> Get the App</a>
855             <div class="side-menu" onclick="$('.blog-side-menu').addClass('blog-side-menu-show'); $('.col-md-3.col-sm-2').addClass('side-menu-opend')">
856                 <i class="hgi hgi-stroke hgi-menu-02"></i>
857             </div>
858              </div>
859               </div>
860                      
861                      
862                <div class="search-bar">
863                   <img src="https://www.jumpspree.com/public/images/search.png" alt="Search" title="Search">
864                    <input type="text" class="searchbar-header" placeholder="Search by product name or brand name">
865                </div>      
866                       <div class="mob-head-right">
867                     <div class="refer-btn"  style="margin-right:10px;"><button 
868  class="bn btn-refer"
869      onclick="$('#signup-new-process').hide(); $('#signin-new-process').fadeIn('fast');"
870  >
871  <img src="https://www.jumpspree.com/public/images/dollar.png" alt="Refer & Earn" title="Refer & Earn">
872  Refer & Earn
873</button></div>
874                        <!--                     <div class="hamburger"><img src="/public/images/hamburger.png" alt="Jumpspree"></div>-->
875<!--
876                    <a class="share-url get-the-app-btn" href="#" style="border-radius: 53px;
877    padding: 0px 9px;
878    margin-right: 0;
879    border: 1px solid #3241585c;
880    background: #111;
881    height: 35px;
882    display: flex;
883    align-items: center;font-size:10px"><img src="https://www.jumpspree.com/public/images/qr.png?ver:10.2" alt="Jumpspree" style="width: 18px;margin-top: -5px;filter: invert(1) brightness(5); display:none"> Get the App</a>
884-->
885                    
886                     <div class="side-menu side-menu-hidden-inner" style="z-index: 0;position: absolute;right: 10px;top: 9px;width: 35px;
887    height: 35px;font-size: 20px;justify-content: center;" onclick="$('.blog-side-menu').addClass('blog-side-menu-show'); $('.col-md-3.col-sm-2').addClass('side-menu-opend')">
888                 <i class="hgi hgi-stroke hgi-menu-02"></i>
889             </div>
890                     
891                     <div class="social-heder" style="display:none"><ul>
892                     <li><a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')"><i class="fa-regular fa-circle-dollar"></i></a></li>
893                     <li><a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')"><i class="fa-regular fa-bell"></i></a></li>
894                     <li><a href="javascript:void(0)" onclick="$('#search-popup').fadeIn('fast')"><i class="fa-regular fa-magnifying-glass"></i></a></li>
895                     </ul></div>
896               </div>
897               
898                       
899               
900               
901                   
902                  <!--   jab session out hai    start here-->
903                            <div class="nav-bar hide-on-mob nav-menu-for-active">
904                                <ul class="d-flex align-items-center">
905<!--                                    <li class="su" ><a class="su" href="javascript:void(0)" onclick="showSignUpPopUp()">Sign Up</a></li>-->
906                                    <li class="su" ><a class="su" href="https://www.jumpspree.com/sign-up">Sign Up</a></li>
907<!--                                    <li><a href="javascript:void(0)" onclick="showSignInPopUp()" >Sign In</a></li>-->
908                                    <li><a href="https://www.jumpspree.com/sign-in" >Sign In</a></li>
909                                    <li class="get-app-btn"><a  href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android" style="border-radius: 53px;
910    padding: 0px 20px;
911    margin-right: 0;
912    border: 1px solid #3241585c;
913    background: #111;
914    height: 41px;
915    display: flex;
916    align-items: center;"><img src="https://www.jumpspree.com/public/images/qr.png?ver:10.2" alt="QR Code" title="QR Code" style="width:16px" > Get the App</a></li>
917                                </ul>
918                            </div>
919                            </div>
920          </div>
921          <style>
922             
923            </style>
924      </header>
925                        <div class="nav-bar hide-on-desktop nav-menu-for-active" style="display:none">
926                            <ul class="d-flex align-items-center"> 
927                                <li class="su" ><a  href="javascript:void(0)" onclick="showSignUpPopUp()" >Sign Up</a></li>
928                                <li><a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">Sign In</a></li>
929                                <li class="get-app-btn"><a  href="javascript:void(0)" onclick="$('#ios-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/qr.png?ver:10.2" alt="Get the App" title="Get the App"> Get the App</a></li>
930                            </ul>
931                        </div>
932             <!--   jab session out hai    end here-->
933                  
934       </div>
935  </div>
936   
936<script>
937 function showSignInPopUp(){
938
939        localStorage.setItem('showsigninpopup', '1');
940        window.location.href='https://www.jumpspree.com'
941
942 }
943 function showSignUpPopUp(){
944
945        localStorage.setItem('showsignuppopup', '1');
946        window.location.href='https://www.jumpspree.com'
947
948 }
949 
950    </script>
950
951
952
953
954
955
956   <div class="container">
957      
958       
959   <div class="body-container"></div>
960
961<!-- Swiper CSS loaded async in footer.php — no duplicate here -->
962<!-- Lightbox CSS — async, not render-blocking -->
963<link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/css/lightbox.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
964<noscript><link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/css/lightbox.min.css" rel="stylesheet"></noscript>
965
966<!-- BOOT ORCHESTRATOR — must load before leftsidebar.php (which loads scripts.js) — 2026-05-15 -->
967<script src="https://www.jumpspree.com/public/js/social-boot-orchestrator.js?ver=1.1"></script>
967
968
969<script defer src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/js/lightbox.min.js"></script>
969
970
971<!-- Pre-loaded page 1 feed data — used below to skip the initial AJAX round-trip -->
972<script>
973var _preloadedPosts    = [{"postFiles":[],"postFilesAspectClass":"Vertical","postMap":[],"likes":3,"comments":0,"shares":0,"viewcount":"16","reposted_count":"2","quoteDetails":{"IsCommentsBlocked":"0","postText":"Selling my iPhone 14 Pro Max, 256GB, White in excellent condition. Well cared for, always used in a case, and works like a brand new phone. Great phone with plenty of storage and a clean, premium look. DM for questions.","postTitle":"iPhone 14 Pro Max, 256 GB, White. Excellent condition.","postId":"1176","is_blog":"0","is_product":"1","source":"1","user_token":"CSB221009375","pdate":"Mon 08\/24\/26","ptime":"01:40:pm","insertedDate":"2026-08-24 01:40:pm","postkey":"PRODUCT","is_promoted":"0","enableEditBanner":"0","postFiles":[{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260140341050.jpg","imagetype":"image"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260140346054.jpg","imagetype":"image"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260140343678.jpg","imagetype":"image"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260140345500.jpg","
973imagetype":"image"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260140345624.jpg","imagetype":"image"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260140356922.jpg","imagetype":"image"}],"postMap":[],"name":"Vic","userId":"375","username":"Vic","usertype":"1","bluetick":"1","is_verified":"1","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1908260555398244.jpg","is_poll":false,"storeDetails":{"storeInfo":{"storeid":"150","storename":"Vic’s Shop on Jumpspree","about_store":"This is Vic’s shop on Jumpspree. You can have one, too!! Simply go to your account settings and tap on the \u0026#34;SellerPad\u0026#34; button to create yours!","storeusername":"Shop","storelogo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260752568507.jpg","store_website":null},"sellerName":"Vic’s Shop on Jumpspree","storeusername":"Shop","storeId":null,"storePhoto":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2408260752568507.jpg","storeBanner":null,"storeDescription":null,"storeRating":null,"storeReviews":null,"storeLocation":null,"address_city":null,"address_state":null,"address_line1":null,"address_line2":null},"product":{"id":"1176","producttitle":"iPhone 14 Pro Max, 256 GB, White. Excellent condition.","description":"Selling my iPhone 14 Pro Max, 256GB, White in excellent condition. Well cared for, always used in a case, and works like a brand new phone. Great phone with plenty of storage and a clean, premium look. DM for questions.","sellingprice":"575.00","discountedprice":"550.00","discountPercent":5,"category":"8","subcategory":"118","brand_id":"158","status":"1","view":"1","quantity":"1","shipping":"1","isFreeShipping":"1","returnPolicy":"This seller accept returns for 14 days only.","isReturn":"2","returnPeriod":"0","isVariation":"1","country":"1","address_city":"Oyster Bay","address_state":"NY","reposted":"0","reposted_count":"1","viewcount":"19","rating":"0.0","inStorePickup":"0","sameDayDelivery":"0","deals":"0","sku":"","identifier":"","conditions":"2","is_approved":"3","packageLength":"9","packageBreadth":"6","packageHeight":"3"}},"reposted_by":{"user_token":"CSB22073152","username":"Jumpspree","name":"Jumpspree","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/0106260241236164.png","is_verified":"1","is_self":false},"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":211,"followings":243,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":true,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4275,"postText":"In case someone is looking for a used iPhone in excellent condition. 👇","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"CSB221009375","user_token":"CSB221009375","pdate":"Mon 09\/21\/26","ptime":"07:42","name":"Vic","userId":375,"username":"Vic","usertype":"1","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1908260555398244.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/c6.png","is_verified":"1","is_reposted":"1","is_quote":"1176","hideLike":"0","commentsoff":"0","source":"1","about_us":"Founder of @jumpspree. Currently also shipping @cent and @pageraise.","about_us_full":"Founder of @jumpspree. Currently also shipping @cent and @pageraise.","repost_id":"2476","repost_created_at":"2026-09-21 07:42:30"},{"postFiles":[],"postFilesAspectClass":"Vertical","postMap":[],"likes":2,"comments":0,"shares":0,"viewcount":"11","reposted_count":"0","quoteDetails":null,"reposted_by":null,"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":83,"followings":32,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":false,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4342,"postText":"ANTHROPIC MAY HAVE SOLVED THE AI PROFIT PROBLEM AHEAD OF ITS IPO.\u003Cbr \/\u003E\n\u003Cbr \/\u003E\nFull story 👇 \u003Cbr \/\u003E\n\u003Cbr \/\u003E\nhttps:\/\/www.cryptopolitan.com\/anthropic-hits-profitability-milestone\/","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2503212006","user_token":"JUMP2503212006","pdate":"Mon 09\/14\/26","ptime":"07:51","name":"Everyday AI Guy","userId":2006,"username":"EverydayAIGuy","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2606260631105720.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2405251033093397.jpg","
973is_verified":"1","is_reposted":"0","is_quote":"0","hideLike":"0","commentsoff":"0","source":"1","about_us":"Helping everyday people effectively integrate artificial intelligence into their daily personal and professional lives. 🤖","about_us_full":"Helping everyday people effectively integrate artificial intelligence into their daily personal and professional lives. 🤖"},{"postFiles":[{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260849545517.jpg","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"1.2229299363057"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260849547116.jpg","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"0.84955752212389"}],"postFilesAspectClass":"Landscape","postMap":[],"likes":0,"comments":0,"shares":0,"viewcount":"6","reposted_count":"1","quoteDetails":null,"reposted_by":null,"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":1,"followings":5,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":false,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4344,"postText":"Ai is taking over our jobs soon, I know this because I have a full inbox asking me to apply to help Ai learn simple at home tasks and from work \u0026 get paid 4 every recording, now tell me different?? Comment AI for more info","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2607232371","user_token":"JUMP2607232371","pdate":"Mon 09\/14\/26","ptime":"08:49","name":"Josefina Martinez","userId":2371,"username":"jsanchez5984","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2307261241335859.jpg","cover_photo":null,"is_verified":"0","is_reposted":"1","is_quote":"0","hideLike":"0","commentsoff":"0","source":"1","about_us":"","about_us_full":""},{"postFiles":[],"postFilesAspectClass":"Vertical","postMap":[],"likes":1,"comments":0,"shares":0,"viewcount":"7","reposted_count":"0","quoteDetails":null,"reposted_by":null,"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":3,"followings":40,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":false,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4326,"postText":"Success isn’t about having the perfect idea.\u003Cbr \/\u003E\r\nIt’s about taking action when others are still waiting.\u003Cbr \/\u003E\r\nStart. Execute. Improve. Repeat.","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2412311966","user_token":"JUMP2412311966","pdate":"Fri 09\/11\/26","ptime":"03:41","name":"Junior Firefighter","userId":1966,"username":"codecrafted","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/0809261010074079.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/c5.png","is_verified":"1","is_reposted":"0","is_quote":"0","hideLike":"0","commentsoff":"0","source":"2","about_us":"Great features start with great ideas. Great products protect them. Hey everyone 👋","about_us_full":"Great features start with great ideas. Great products protect them. Hey everyone 👋"},{"postFiles":[{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260852473627.jpg","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"0.84567901234568"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260852475151.png","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"0.5"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260852471118.png","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"0.5"}],"postFilesAspectClass":"Vertical","postMap":[],"likes":1,"comments":0,"shares":0,"viewcount":"8","reposted_count":"0","quoteDetails":null,"reposted_by":null,"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":1,"followings":5,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":false,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4345,"postText":"","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2607232371","user_token":"JUMP2607232371","pdate":"Mon 09\/14\/26","ptime":"08:52","name":"Josefina Martinez","userId":2371,"username":"jsanchez5984","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2307261241335859.jpg","cover_photo":null,"is_verified":"0","is_reposted":"0","is_quote":"0","hideLike":"0","commentsoff":"0","source":"1","about_us":"","about_us_full":""},{"postFiles":[{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260849545517.jpg","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"1.2229299363057"},{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1409260849547116.jpg","type":"1","altText":"","link":"","profanity":"0","thumb":"","aspectRatio":"0.84955752212389"}],"postFilesAspectClass":"Landscape","postMap":[],"likes":0,"comments":0,"shares":0,"viewcount":"6","reposted_count":"1","quoteDetails":null,"reposted_by":{"user_token":"JUMP2607232371","username":"jsanchez5984","name":"Josefina Martinez","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2307261241335859.jpg","is_verified":"0","is_self":false},"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":1,"followings":5,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":true,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4344,"postText":"Ai is taking over our jobs soon, I know this because I have a full inbox asking me to apply to help Ai learn simple at home tasks and from work \u0026 get paid 4 every recording, now tell me different?? Comment AI for more info","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2607232371","user_token":"JUMP2607232371","pdate":"Mon 09\/14\/26","ptime":"08:50","name":"Josefina Martinez","userId":2371,"username":"jsanchez5984","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2307261241335859.jpg","cover_photo":null,"is_verified":"0","is_reposted":"1","is_quote":"0","hideLike":"0","commentsoff":"0","source":"1","about_us":"","about_us_full":"","repost_id":"2475","repost_created_at":"2026-09-14 08:50:27"},{"postFiles":[{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1109260224224244.jpg","type":"1","altText":"Jumpspree","link":"","profanity":"0","thumb":null,"aspectRatio":"1"}],"postFilesAspectClass":"Vertical","postMap":[],"likes":2,"comments":0,"shares":0,"viewcount":"6","reposted_count":"1","quoteDetails":null,"reposted_by":{"user_token":"JUMP2503212006","username":"EverydayAIGuy","name":"Everyday AI Guy","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2606260631105720.jpg","is_verified":"1","is_self":false},"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":3,"followings":40,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":true,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4321,"postText":"🌟 Small Steps, Big Dreams 🌟\u003Cbr \/\u003E\r\nSuccess doesn’t happen overnight. It is built through small steps, consistent effort, and the courage to keep going even when things get difficult.There will be days when you feel tired, uncertain, or discouraged. That’s okay. What matters is that you don’t give up on yourself.💪 Keep going.🌱 Believe in y
973ourself.🎯 Focus on progress, not perfection","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2412311966","user_token":"JUMP2412311966","pdate":"Mon 09\/14\/26","ptime":"07:51","name":"Junior Firefighter","userId":1966,"username":"codecrafted","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/0809261010074079.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/c5.png","is_verified":"1","is_reposted":"1","is_quote":"0","hideLike":"0","commentsoff":"0","source":"2","about_us":"Great features start with great ideas. Great products protect them. Hey everyone 👋","about_us_full":"Great features start with great ideas. Great products protect them. Hey everyone 👋","repost_id":"2474","repost_created_at":"2026-09-14 07:51:48"},{"postFiles":[],"postFilesAspectClass":"Vertical","postMap":[],"likes":4,"comments":0,"shares":0,"viewcount":"7","reposted_count":"3","quoteDetails":null,"reposted_by":{"user_token":"JUMP2503212006","username":"EverydayAIGuy","name":"Everyday AI Guy","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/2606260631105720.jpg","is_verified":"1","is_self":false},"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":211,"followings":243,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":true,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4287,"postText":"“Skills” matter.\u003Cbr \/\u003E\n\u003Cbr \/\u003E\n“Starting” matters more.","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"CSB221009375","user_token":"CSB221009375","pdate":"Mon 09\/14\/26","ptime":"07:51","name":"Vic","userId":375,"username":"Vic","usertype":"1","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1908260555398244.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/c6.png","is_verified":"1","is_reposted":"1","is_quote":"0","hideLike":"0","commentsoff":"0","source":"1","about_us":"Founder of @jumpspree. Currently also shipping @cent and @pageraise.","about_us_full":"Founder of @jumpspree. Currently also shipping @cent and @pageraise.","repost_id":"2473","repost_created_at":"2026-09-14 07:51:39"},{"postFiles":[{"imagepath":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/1109260229016298.jpg","type":"1","altText":"Jumpspree","link":"","profanity":"0","thumb":null,"aspectRatio":"1"}],"postFilesAspectClass":"Vertical","postMap":[],"likes":1,"comments":0,"shares":0,"viewcount":"6","reposted_count":"0","quoteDetails":null,"reposted_by":null,"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":3,"followings":40,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":false,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4322,"postText":"🌱 Keep Going! You don’t have to achieve everything at once. Just take one small step every day. Believe in yourself, stay positive, and don’t give up. Your hard work will pay off. 💪","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2412311966","user_token":"JUMP2412311966","pdate":"Fri 09\/11\/26","ptime":"02:29","name":"Junior Firefighter","userId":1966,"username":"codecrafted","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/0809261010074079.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/c5.png","is_verified":"1","is_reposted":"0","is_quote":"0","hideLike":"0","commentsoff":"0","source":"2","about_us":"Great features start with great ideas. Great products protect them. Hey everyone 👋","about_us_full":"Great features start with great ideas. Great products protect them. Hey everyone 👋"},{"postFiles":[],"postFilesAspectClass":"Vertical","postMap":[],"likes":1,"comments":0,"shares":0,"viewcount":"5","reposted_count":"0","quoteDetails":null,"reposted_by":null,"is_poll":false,"poll_options":[],"has_voted":2,"user_voted_option_id":null,"poll_closed":0,"poll_duration":0,"poll_start_time":null,"poll_end_time":null,"poll_time_remaining":null,"block":"0","mute":0,"is_follow":"0","followers":3,"followings":40,"session":0,"self":0,"is_wishlist":"0","liked":"0","bluetick":0,"online_status":0,"private":0,"is_reposted_version":false,"is_reposted_by_user":false,"user_repost_type":null,"user_repost_id":null,"user_reposted_at":null,"postId":4324,"postText":"Your iPhone captures the moments. Your mindset creates them.\u003Cbr \/\u003E\r\nDream bigger. Create more. Keep moving. 📱","postTitle":"","is_blog":"0","postkey":"CBSKP","cubeapp_token":"JUMP2412311966","user_token":"JUMP2412311966","pdate":"Fri 09\/11\/26","ptime":"02:44","name":"Junior Firefighter","userId":1966,"username":"codecrafted","usertype":"3","profile_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/0809261010074079.jpg","cover_photo":"https:\/\/cubesnack-seller.s3.amazonaws.com\/products\/c5.png","is_verified":"1","is_reposted":"0","is_quote":"0","hideLike":"0","commentsoff":"0","source":"2","about_us":"Great features start with great ideas. Great products protect them. Hey everyone 👋","about_us_full":"Great features start with great ideas. Great products protect them. Hey everyone 👋"}];
974var _preloadedDrafts   = [];
975var _preloadedUserData = [];
976var _hashtagPage = 1; // separate page counter for hashtag feed — reset on each new hashtag selection
977</script>
977
978<!--<link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" rel="stylesheet">-->
979
980
981
982  <!-- Demo styles -->
983  <style>
984
985    .bookmark-active{
986        filter: invert(0);
987    }
988
989    .bookmark-inactive{
990        filter: invert(1);
991    }
992
993    /* Add to your CSS */
994.repost-success-animation {
995    animation: repostPulse 0.5s ease-in-out;
996}
997
998@keyframes repostPulse {
999    0% { transform: scale(1); }
1000    50% { transform: scale(1.3); }
1001    100% { transform: scale(1); }
1002}
1003
1004.fa-spin {
1005    animation: fa-spin 1s infinite linear;
1006}
1007
1008@keyframes fa-spin {
1009    0% { transform: rotate(0deg); }
1010    100% { transform: rotate(360deg); }
1011}
1012
1013
1014      .repost-btn.share-post .drop-down-menu-share ul li:last-child {
1015    display: block !important;
1016}
1017/*    Bookmark  */
1018.hgi.hgi-stroke.hgi-bookmark-02:before {
1019    content: "" !important;
1020    background: url(https://www.jumpspree.com/public/images/bookmark-02.png?ver:1.03) no-repeat !important;
1021    width: 19px;
1022    height: 19px;
1023    display: block;
1024    /* position: absolute; */
1025    background-size: contain !important;
1026}     
1027.hgi-stroke.hgi-bookmark-check-02:before {
1028    content: "" !important;
1029    background: url(https://www.jumpspree.com/public/images/bookmark-check-02.png?ver:1.02) no-repeat !important;
1030    width: 19px;
1031    height: 19px;
1032    display: block;
1033    /* position: absolute; */
1034    background-size: contain !important;
1035} 
1036 
1037/*    Bookmark  */
1038      
1039    .swiper-slide,    .link-carousel .swiper-slide {
1040    width: 100%;
1041}
1042#posts-container .movie-trailer .link-preview a {
1043    margin-top: 20px;
1044    border: none;
1045}      
1046    .hide{
1047        display: none;
1048    }
1049
1050    .swiper {
1051      width: 100%;
1052      height: 100%;
1053    }
1054    .swiper-slide a {
1055    cursor: grab;
1056}  
1057
1058    .swiper-slide {
1059    text-align: center;
1060    font-size: 18px;
1061    background: transparent;
1062    display: flex;
1063    justify-content: center;
1064    align-items: center;
1065    width: auto;
1066    height: auto
1067}
1068/*
1069.swiper-slide img {
1070    max-height: 259px !important;
1071}      
1072*/
1073
1074.swiper-wrapper.all-horizontal {
1075  border: 3px solid blue;
1076}
1077
1078.swiper-wrapper.all-vertical {
1079  border: 3px solid green;
1080}
1081
1082.swiper-wrapper.mixed-orientation {
1083  border: 3px solid orange;
1084}
1085  </style>
1086  
1087<style>
1088/* Image size    */
1089    .post-text a{cursor: pointer !important}   
1090
1091.owl-carousel-home-feed .owl-item img {
1092    max-height: 390px;
1093    height: 390px !important;
1094    object-fit: cover !important;
1095}     
1096body.dark-mode .blog-main-image .item a {
1097    border: none !important;
1098}
1099.blog-main-image.mb-10.movie-trailer span img {
1100    width: 100% !important;
1101    filter: none !important;
1102}
1103.blog-main-image.mb-10.movie-trailer.alt-link .item.link-preview + div img {
1104    max-height: none;
1105}
1106.repost-wrapper .blog-main-image img {
1107    max-height: inherit;
1108    width: auto !important;
1109    max-width: inherit;
1110}    
1111.email-box .post-text + .blog-main-image {
1112    margin-top: 15px;
1113}
1114/* .blog-main-image a{display: inline-block !important;}*/
1115.blog-main-image img {
1116    border-radius: 11px !important;
1117}    
1118.post-text p:last-child {
1119    margin-bottom: 0;
1120}    
1121    
1122@media screen and (min-width: 768px) {
1123    .swiper-slide.item {
1124    width: auto !important;
1125}
1126#social-popup .swiper-wrapper.singleImage-added .swiper-slide.item {
1127        width: 80% !important;
1128    }   
1129}
1130@media screen and (max-width: 767px) {
1131.swiper-slide {
1132    width: auto !important;
1133}    
1134.three-images .swiper-slide {
1135        min-width: 42% !important;
1136        max-width: 80% !important;
1137        height: 180px;
1138        border-radius: 12px !important;
1139        overflow: hidden;
1140    }
1141.three-images .swiper-slide {
1142        min-width: 42% !important;
1143        max-width: 80% !important;
1144        height: 180px;
1145        border-radius: 12px !important;
1146        overflow: hidden;
1147    }    
1148.hgi.hgi-stroke.hgi-bookmark-02:before {
1149    width: 16px;
1150    height: 16px;
1151}     
1152.hgi-stroke.hgi-bookmark-check-02:before {
1153    width: 16px;
1154    height: 16px;
1155}     
1156div#add-post-top {
1157        position: static !important; 
1158    }    
1159.post-single-image .swiper-slide {
1160    justify-content: left;
1161}    
1162.repost-social {
1163    margin-bottom: 15px;
1164}
1165.email-verification.after-login .email-box {
1166    padding: 25px 15px 20px;
1167}    
1168    .blog-main-image img {
1169        max-height: 440px;
1170    }
1171    .owl-carousel.owl-carousel-home-feed .owl-stage-outer {
1172        overflow-x: auto;
1173        scrollbar-width: none;
1174        -ms-overflow-style: none;
1175        overflow: auto;
1176    } 
1177.owl-carousel.owl-carousel-home-feed .owl-item {
1178    min-width: 40vw;
1179    max-width: 80vw;
1180}
1181    .owl-carousel.owl-carousel-home-feed .owl-item img {
1182        height: 200px !important;
1183        max-width: 100%;
1184        object-fit: cover;
1185    }    
1186    
1187}    
1188/* Image size    */
1189    i.fa-bookmark.fa-solid {
1190    color: #ff44a8;
1191}
1192.email-verification.after-login  .email-box {
1193    border-bottom: 1px solid #ddd;
1194    padding: 25px 25px 20px;
1195}
1196body.light-mode .email-verification.after-login .email-box {
1197    border-bottom: 1px solid #ebebeb;
1198}
1199.blog-main-image.mb-10 {
1200    width: 100%;
1201}  
1202div#posts-container {
1203    width: 100%;
1204}     
1205div#posts-container-product {
1206    width: 100%;
1207}    
1208.social-popup, .social-popup-create-account {
1209    background: #000000c9 !important;
1210}    
1211.hashtag-link {
1212    color: #4859f2;
1213    text-decoration: none;
1214    margin-right: 5px;
1215}
1216.hashtag-link:hover {
1217    color: #5566ff;
1218}
1219
1220body.dark-mode a.profile-link:hover {
1221    color: #fff;
1222}    
1223 
1224.date.ogl li a {
1225    margin: 0;
1226}
1227/* .owl-carousel {
1228    display: block !important;
1229} */
1230 
1231.header-wrapper{z-index: 9 !important;}  
1232.email-box .profile-drop-down ul {
1233       max-width: 320px;
1234    width: 265px;
1235}
1236.email-box .profile-drop-down ul li a {
1237    text-align: left !important;
1238    justify-content: flex-start;
1239}
1240.email-box .profile-drop-down ul li a i {
1241    margin-right: 13px;
1242}
1243
1244.email-box .profile-drop-down ul li a {
1245    text-align: left !important;
1246    justify-content: flex-start;
1247    padding: 7px 0;
1248}
1249.email-box .profile-drop-down ul li a i {
1250    margin-right: 0px;
1251    font-size: 14px;
1252} 
1253.fnc-title a {
1254    margin-right: 0 !important;
1255}    
1256@media screen and (max-width:767px){
1257  
1258 .logo img.logo-hide-on-mob, .hamburger {
1259    opacity: 0 !important;
1260} 
1261    header {
1262        margin-top: 0px;
1263        background: #0a0a0a !important;
1264    }    
1265    
1266/* Padding    */
1267.swiper.mySwiper {
1268    width: 100vw;
1269    margin-left: -25px;
1270    padding: 0 25px;
1271}    
1272
1273/* Padding    */
1274.col-md-3.col-sm-2.left_section {
1275        z-index: 9999999999 !important;
1276    }    
1277.row.justify-content-center.annoucement {
1278        padding-top: 6px !important;
1279    }    
1280body.dark-mode .email-box .date {
1281    border-top: 1px solid #3241585c !important;
1282    border-bottom: 1px solid #3241585c !important;
1283}
1284body.dark-mode .email-verification.after-login .email-box {
1285    border-bottom: 1px solid #3241585c !important;
1286}    
1287    }   
1288
1289
1290.header-wrapper {
1291    z-index: 999 !important;
1292}    
1293body.dark-mode .header-wrapper {
1294    background: #171717 !important;
1295} 
1296    body.dark-mode .post-area{border: none !important}
1297    .email-verification.after-login{
1298    border-left: 1px solid #373737;
1299    border-right: 1px solid #373737;
1300    border-radius: 0;
1301    }    
1302.post-area {
1303    background: #171717;
1304}
1305.email-box {
1306    min-height: 200px;
1307}    
1308/*
1309#posts-container .email-box:last-child .date.ogl {
1310    padding-bottom: 210px;
1311}
1312*/
1313#posts-container .email-box:last-child .drop-down-menu-share {
1314    position: absolute;
1315    bottom: 63px;
1316    border: 1px solid #32415852;
1317    padding: 19px 12px;
1318    border-radius: 16px;
1319    background: #171717;
1320    z-index: 99;
1321    top: inherit;
1322}    
1323/*
1324.email-verification.after-login {
1325    height: 100vh;
1326}    
1327*/
1328    
1329</style>
1330
1331
1332<div class="row justify-content-center annoucement"> 
1333     <!-- left panel START -->  
1334     
1335
1336 
1337 
1338<link rel="stylesheet" href="https://www.jumpspree.com/public/css/all-style.css?ver:2.95">
1339<!--<link rel="stylesheet" href="https://www.jumpspree.com/public/css/Newstyle.css?ver:1.102069101094">-->
1340 
1341<!--<link rel="stylesheet" href="https://www.jumpspree.com/public/css/owl.carousel.min.css">-->
1342<!--<link href="https://www.jumpspree.com/public/css/lightgallery.css?ver:1.05" rel="stylesheet">-->
1343<!--<link rel="stylesheet" href="https://www.jumpspree.com/public/css/jumpspree-app.min.css?ver%3A1002396=v.46">-->
1344<!--<link rel="stylesheet" href="https://www.jumpspree.com/public/css/responsive-cube.css?ver%3A1002102123="> -->
1345<!--<link rel="stylesheet" href="https://cdn.hugeicons.com/font/hgi-stroke-rounded.css" />-->
1346<!--<link rel="stylesheet" href="https://www.jumpspree.com/public/css/commen-left-panel.css?ver%3A1002396=v.52">-->
1347<!-- 23-06-2025  Line 1 to 596 -->
1348
1349<!-- 23-06-2025  Line 1 to 596 -->
1350
1351<div class="social-popup" id="search-box-popup" style="display: none;">
1352    <div class="add-post-inner">
1353        <div class="popup-header">
1354            <h2>Search Coming Soon!</h2>
1355<!--
1356            <div class="cross">
1357                <a href="javascript:void(0)" onclick="$('#search-box-popup').fadeOut('fast')">
1358                    <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="">
1359                </a>
1360            </div>
1361-->
1362        </div>
1363
1364        <div class="pop-inner">
1365            <p>We’re giving our search a little upgrade to make finding things smoother and faster. It’ll be ready in just a few days! In the meantime, feel free to browse the feed and keep the good vibes going. Thanks for bearing with us!</p>
1366        </div>
1367
1368        <div class="report-foot d-flex justify-content-between">
1369            <div class="send">
1370                <button type="button" class="send"  onclick="$('#search-box-popup').fadeOut('fast')">Sounds good</button>
1371            </div>
1372        </div>
1373    </div>
1374</div>
1375
1376<div class="social-popup" id="feed-refresh-popup" style="display: none;">
1377    <div class="add-post-inner">
1378        <div class="popup-header">
1379            <h2>Feed Refresh, Coming Right Up!</h2>
1380<!--
1381            <div class="cross">
1382                <a href="javascript:void(0)" onclick="$('#feed-refresh-popup').fadeOut('fast')">
1383                    <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="">
1384                </a>
1385            </div>
1386-->
1387        </div>
1388
1389        <div class="pop-inner">
1390            <p>We’re cooking up a refreshed feed experience to keep things crisp, relevant, and on point. It’ll roll out in the next few days—just a little patience while we make it awesome. Until then, hang tight and enjoy the current vibes!</p>
1391        </div>
1392
1393        <div class="report-foot d-flex justify-content-between">
1394            <div class="send">
1395                <button type="button" class="send" onclick="$('#feed-refresh-popup').fadeOut('fast')">Can’t wait</button>
1396            </div>
1397        </div>
1398    </div>
1399</div> 
1400
1401<div class="animated-line">
1402    <div class="line-inside"></div>
1403</div>
1404 
1405<!-- 23-06-2025  Line 601 to 1024 commen-left-panel.css -->
1406
1407
1408<!-- 23-06-2025  Line 601 to 1024 commen-left-panel.css -->
1409 
1410
1411<!-- 23-06-2025  Line 1038 to 1438 commen-left-panel.css -->
1412
1413
1414<!-- 23-06-2025  Line 1038 to 1438 commen-left-panel.css -->
1415
1416
1417
1418<!-- 23-06-2025  Line 142 to 2447 commen-left-panel.css -->
1419
1420<!-- 23-06-2025  Line 142 to 2447 commen-left-panel.css -->
1421
1422
1423<!-- 23-06-2025  Line 1442 to 2447 commen-left-panel.css -->
1424
1425<!-- 23-06-2025  Line 1442 to 2447 commen-left-panel.css -->
1426
1427
1428
1429<!-- 23-06-2025  Line 2452 to 2830 commen-left-panel.css -->
1430
1431
1432<!-- 23-06-2025  Line 2452 to 2830 commen-left-panel.css -->
1433
1434
1435
1436<!-- 23-06-2025  Line 2834 to 3034 commen-left-panel.css -->
1437
1438
1439<!-- 23-06-2025  Line 2834 to 3034 commen-left-panel.css -->
1440
1441
1442
1443
1444<!--get the app-->
1445
1446<!--get the app-->
1447<script src="https://kit.fontawesome.com/5ad83a3d4f.js"></script>
1447
1448
1449
1450<script>
1451    var base_url = 'https://www.jumpspree.com';  
1452</script>
1452
1453 
1454<!-- BOOT: intercept getCartCount before scripts.js registers its $(document).ready — 2026-05-15
1455     ROLLBACK: remove this block and the one below (get-online-status defer) -->
1456<script>
1457(function () {
1458    if (!window.JumpSocialBoot || !window.$) { return; }
1459    var _orig = $.ajax;
1460    $.ajax = function (opts) {
1461        if (opts && opts.url && String(opts.url).indexOf('getCartCount') !== -1) {
1462            $.ajax = _orig; // restore immediately
1463            window.JumpSocialBoot.defer(function () { _orig(opts); }, 'high');
1464            return;
1465        }
1466        $.ajax = _orig;
1467        return _orig.apply($, arguments);
1468    };
1469}());
1470</script>
vendor: 1 bytes, line 1470
1470
1471<script src="https://www.jumpspree.com/public/js/scripts.js?ver%3A2_20="></script>
1471
1472    
1473
1474<script>
1475$('#shop-entry').click(function() {
1476        $('.profile-menu').hide();
1477        console.log("Shop is activated");
1478        //setActivePage('shop');
1479        // Update active tab
1480        $('#shop-entry').addClass('active');
1481        $('#postlink').removeClass('active');
1482        $('#social-entry').removeClass('active');
1483        sessionStorage.setItem('activeTab', 'shop');
1484        const baseUrl = 'https://www.jumpspree.com';
1485        if (window.location.href !== baseUrl && window.location.href !== baseUrl + '/' && window.location.href !== baseUrl + '/social') {
1486            window.location.href = baseUrl;
1487        }
1488    });
1489    
1490$(document).ready(function() {
1491
1492    // BOOT: defer get-online-status until after feed renders — 2026-05-15
1493    // ROLLBACK: remove the JumpSocialBoot.defer() wrapper and call loadOnlineStatus() directly
1494    var loadOnlineStatus = function () {
1495                // Fetch the current online status when the page loads
1496                $.ajax({
1497                    url: '/get-online-status',
1498                    type: 'GET',
1499                    success: function (response) {
1500                        console.log('Current Status:', response);  
1501                        if (response.status) {
1502                            if (response.onlineStatus == 0) {
1503                                $('#toggle-online-status, #toggle-online-status2').addClass('active').attr('aria-pressed', 'true');
1504                                $('#online-dot').addClass('online-dot');  
1505                                $('#anyone').prop('checked', true);
1506                            } else {
1507                                $('#online-dot').removeClass('online-dot');  
1508                                $('#No-one').prop('checked', true);
1509
1510                                $('#toggle-online-status, #toggle-online-status2').removeClass('active').attr('aria-pressed', 'false');
1511                            }
1512                        } else {
1513                            console.log('Error:', response.message);
1514                        }
1515                    },
1516                    error: function (xhr, status, error) {
1517                        console.error('AJAX Error:', error); // Debug log
1518                    }
1519                });
1520    }; // end loadOnlineStatus
1521    window.JumpSocialBoot ? window.JumpSocialBoot.defer(loadOnlineStatus, 'high') : loadOnlineStatus();
1522
1523                // Toggle online status when button is clicked
1524                $('#toggle-online-status,#toggle-online-status2').on('click', function () {
1525                        $(this).toggleClass('active');
1526                        const onlineDotElement = $('#online-dot');
1527
1528                        const isActive = $(this).hasClass('active');
1529                        const onlineStatus = isActive ? 0 : 2; // Ensure it's a number
1530
1531                        if (onlineStatus === 0) { // Compare as number, not string
1532                            onlineDotElement.addClass('online-dot');  
1533                        } else if (onlineStatus === 2) {
1534                            onlineDotElement.removeClass('online-dot');  
1535                        }
1536
1537                    console.log('Selected onlineStatus:', onlineStatus); // Debug log
1538
1539                    // Send AJAX request to update the online status
1540                    $.ajax({
1541                        url: '/update-online-status',
1542                        type: 'POST',
1543                        data: { onlineStatus: onlineStatus },
1544                        success: function (response) {
1545                            console.log('Server Response:', response); // Debug log
1546                           
1547                            
1548                            
1549                            if (response.status) {
1550                                showNotification('success', response.message);
1551                            } else {
1552                                showNotification('error', response.message);
1553                            }
1554                        },
1555                        error: function (xhr, status, error) {
1556                            console.error('AJAX Error:', error); // Debug log
1557                            showNotification('error', 'An error occurred. Please try again.');
1558                        }
1559                    });
1560                });
1561          
1562        
1563        // Fetch the current online status when the page loads
1564        /* $.ajax({
1565            url: '/get-online-status',
1566            type: 'GET',
1567            success: function(response) {
1568                console.log('Current Status:', response); // Debug: Log the server response
1569                if (response.status) {
1570                    // Set the online-dot class based on the current online status
1571                    if (response.onlineStatus == 0) {
1572                        $('#online-dot').addClass('online-dot'); // Add the class for online status
1573                        // Select the "Anyone" radio button
1574                        $('#anyone').prop('checked', true);
1575                    } else {
1576                        $('#online-dot').removeClass('online-dot'); // Remove the class for offline status
1577                        // Select the "No one" radio button
1578                        $('#No-one').prop('checked', true);
1579                    }
1580                } else {
1581                    console.log('Error:', response.message);
1582                }
1583            },
1584            error: function(xhr, status, error) {
1585                console.error('AJAX Error:', error); // Debug: Log the error
1586            }
1587        }); */
1588    
1589    $('#more-resources a').click(function(e){
1590        e.stopPropagation();
1591        $(this).addClass('active');
1592        $('#more-resources a').next().toggleClass('more-settings');
1593        $('#more-stting a').next().removeClass('more-settings');
1594    })
1595    $('body').click(function(){
1596        $('.more-setting-pop1').removeClass('more-settings');
1597        $('#more-resources a').removeClass('active');
1598        $('#moresetting').removeClass('active')
1599    })
1600    });
1601
1602     document.addEventListener("DOMContentLoaded", function () {
1603        const mainLinks = document.querySelectorAll(".sidebar.target-link");
1604        const allLinks = document.querySelectorAll("a"); // includes submenu <a> too
1605
1606        // Remove existing active classes from main sidebar
1607        mainLinks.forEach(link => link.classList.remove("active"));
1608
1609        // Loop through all <a> tags to find which matches current URL
1610        allLinks.forEach(link => {
1611            const href = link.getAttribute("href");
1612            if (href && href !== "javascript:void(0)" && window.location.href.includes(href)) {
1613                link.classList.add("active");
1614
1615                // Check if it's inside the settings dropdown
1616                const isInSettings = link.closest('.more-setting-pop');
1617                if (isInSettings) {
1618                    const settingsTrigger = document.querySelector("#moresetting");
1619                    if (settingsTrigger) settingsTrigger.classList.add("active");
1620
1621                    // Optional: auto-show dropdown
1622                    const settingsBox = document.querySelector(".more-setting-pop");
1623                    if (settingsBox) settingsBox.style.display = "block";
1624                }
1625
1626                // Similar logic if you have other dropdowns like more resources
1627                const isInResources = link.closest('.more-setting-pop1');
1628                if (isInResources) {
1629                    const resourcesTrigger = document.querySelector("#more-resources > a.sidebar");
1630                    if (resourcesTrigger) resourcesTrigger.classList.add("active");
1631
1632                    const resourcesBox = document.querySelector(".more-setting-pop1");
1633                    if (resourcesBox) resourcesBox.style.display = "block";
1634                }
1635            }
1636        });
1637    });  
1638
1639     // 13 jun riaz below commented code is used for child level active class should be applied on sidebar links
1640   
1641    /* document.addEventListener("DOMContentLoaded", function () {
1642        const sidebarLinks = document.querySelectorAll(".sidebar.target-link");
1643        const allLinks = document.querySelectorAll("a");
1644
1645        // Remove existing active classes
1646        allLinks.forEach(link => link.classList.remove("active"));
1647
1648        // Loop through all <a> tags
1649        allLinks.forEach(link => {
1650            const href = link.getAttribute("href");
1651
1652            if (href && href !== "javascript:void(0)" && window.location.href.includes(href)) {
1653                // Mark only the matched link as active
1654                link.classList.add("active");
1655
1656                // Optional: if link is inside a dropdown, show the dropdown
1657                const moreSettingPop = link.closest('.more-setting-pop');
1658                if (moreSettingPop) {
1659                    moreSettingPop.style.display = 'block'; // show settings dropdown
1660                }
1661
1662                const moreSettingPop1 = link.closest('.more-setting-pop1');
1663                if (moreSettingPop1) {
1664                    moreSettingPop1.style.display = 'block'; // show resources dropdown
1665                }
1666            }
1667        });
1668
1669        // Sidebar click — toggle active manually on top-level items
1670        sidebarLinks.forEach(link => {
1671            link.addEventListener("click", function () {
1672                sidebarLinks.forEach(el => el.classList.remove("active"));
1673                this.classList.add("active");
1674            });
1675        });
1676    }); */
1677
1678
1679</script>
1679
1680
1681<script>
1682
1683$(document).ready(function(){
1684
1685    if (localStorage.getItem('showsigninpopup') == '1') {
1686  $('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');
1687   localStorage.removeItem('showsigninpopup');
1688}
1689 if (localStorage.getItem('showsignuppopup') == '1') {
1690 $('#signup-new-process').fadeIn(); $('body').addClass('overflow-hidden')
1691   localStorage.removeItem('showsignuppopup');
1692}
1693
1694
1695});
1696
1697
1698
1699</script>
1699        
1700    
1701<div class="col-md-3 col-sm-2 left_section" style="position: sticky; top: 90px;">
1702    <div class="left-panel">
1703       <div class="logo-left-new">
1704<!--           <a href=""><img src="https://www.jumpspree.com/public/images/Jumpspree---Logo.png?ver:1.008" alt=""></a>-->
1705<!--           <a href="https://www.jumpspree.com"><img src="https://www.jumpspree.com/public/images/logo-white-jumpspree.png?ver:1.008" loading="lazy" alt="jumspree logo" title=""></a>-->
1706           <a href="https://www.jumpspree.com"><img src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.008" loading="lazy" alt="jumspree logo" title=""></a>
1707       </div>
1708        <div>
1709        
1710
1711
1712            <div class="navigation">
1713                              <ul class="hide-on-mob">  
1714<!--                 <a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');" -->
1715                  <li><a href="https://www.jumpspree.com/sign-in" 
1716                  style="background: transparent !important; border-top: none;border-left: none; border-right: none;display: flex;align-items: center;"><span><i class="hgi hgi-stroke hgi-sharp hgi-login-01" style="transform:rotate(180deg);margin-left: -7px;margin-right: 11px;"></i> Sign in</span> <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></li>
1717<!--                   <li><a href="https://www.jumpspree.com/sign-up" style="    display: flex;align-items: center;"><span><i class="hgi hgi-stroke hgi-at"></i> Sign up</span> <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></li>-->
1718<!--                <a href="javascript:void(0)" onclick="$('#signup-new-process').fadeIn(); $('body').addClass('overflow-hidden')"-->
1719                      <li><a href="https://www.jumpspree.com/sign-up" style="display: flex;align-items: center;"><span><i class="hgi hgi-stroke hgi-at"></i> Sign up</span> <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></li>      
1720                       
1721<!--                       <li><a href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android" style="    display: flex;align-items: center;"><span><img src="https://www.jumpspree.com/public/images/Jumpspree-ico.png" class="get-the-app" alt="Get the app" title="Get the app"> Get the app</span> <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></li>-->
1722                        <li><a href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android" style="    display: flex;align-items: center;"><span><img src="https://www.jumpspree.com/public/images/grad-new.png" style="border-radius: 5px;" class="get-the-app" alt="Get the app" title="Get the app"> Get the app</span> <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></li>
1723               </ul>
1724                 
1725                <ul class="home-navigation">
1726                    
1727                    <li id="social-entry">
1728                        <a href="javascript:void(0)" id="postlink" class="sidebar target-link active" onclick="getSocialFeed('3','1','1')">
1729                            <span class="route_title">
1730<!--                            <i class="hgi hgi-stroke hgi-home-01"></i>-->
1731                            <img src="https://www.jumpspree.com/public/images/home-outline.png" class="home-icon-outline"  alt="Home" title="Home">
1732                            <img style="display:none" src="https://www.jumpspree.com/public/images/home-fill.png" class="home-icon-fill"  alt="Home" title="Home">
1733                              <span class="bottom-menu-text">Home</span></span>
1734<!--                            <span class="route_title"><i class="fa-regular fa-sparkles"></i> Social</span>-->
1735                        </a>
1736                    </li>
1737                    <li id="shop-entry">
1738                        <a href="/shop" class="sidebar target-link" id="shoplinkforweb">
1739                            <span class="route_title">
1740                                <img src="https://www.jumpspree.com/public/images/shopping-outlinw.png" class="shop-icon-outline" alt="Shop" title="Shop">
1741                                <img style="display:none" src="https://www.jumpspree.com/public/images/shopping-fill.png" loading="lazy" class="shop-icon-fill" alt="Shop" title="Shop">
1742                                <span class="bottom-menu-text">Shop</span>
1743                            </span>
1744                        </a>
1745
1746                                        <input type="hidden" name="dashboard" id="dashboard"> 
1747                                         <input type="hidden" name="productType" id="productType" value="1">
1748                                         <input type="hidden" name="subcategory" id="subcategory" value="0">
1749                                         <input type="hidden" name="category" id="category" value="0">
1750                                         <input type="hidden" name="datatype" id="datatype" value="0">
1751                                         <input type="hidden" name="pageCount" id="pageCount" value="2">
1752                    </li>
1753                   
1754<!--
1755                   <li>
1756                        <a href="https://www.jumpspree.com/shop">
1757                        <span class="route_title">
1758                        <img src="https://www.jumpspree.com/public/images/shopping-outlinw.png" class="shop-icon-outline"  alt="Shop" title="Shop">
1759                            <img style="display:none" src="https://www.jumpspree.com/public/images/shopping-fill.png" class="shop-icon-fill"  alt="Shop" title="Shop">  <span class="bottom-menu-text" style="color:#fff">Shop</span></span></a>
1760                    </li>
1761-->
1762                    
1763                    <li id="live-stream-btn">
1764                        <a href="https://www.jumpspree.com/start-streaming">
1765                        <span class="route_title">
1766                        <img src="https://www.jumpspree.com/public/images/sellerpad/live-streaming.png" class="home-icon-outline"  alt="Home" title="Home">  <span class="bottom-menu-text">Livestreams</span></span></a>
1767                    </li>
1768                      
1769                       <li id="live-stream-btn">
1770                        <a href="https://www.jumpspree.com/seller-pad/live-streams">
1771                        <span class="route_title">
1772                        <img src="https://www.jumpspree.com/public/images/sellerpad_new.png" class="home-icon-outline sellerpad-icon"  alt="Home" title="Home">  <span class="bottom-menu-text">Seller Pad</span></span></a>
1773                    </li>
1774                       
1775                    <li id="feed-btn" style="display:none">
1776                        <a href="https://www.jumpspree.com/">
1777                        <span class="route_title">
1778                        <img src="https://www.jumpspree.com/public/images/user-list-stroke-rounded.png" class="home-icon-outline" style="filter:invert()" alt="Home" title="Home" loading="lazy">  <span class="bottom-menu-text">Feed</span></span></a>
1779                    </li>
1780                    
1781                    <li class="create-button-footer">
1782                                                 <a href="javascript:void(0)" onclick="$('#signin-new-process').fadeIn('fast')"  id="shoplinkforweb"  class="sidebar target-link">
1783                            <span class="route_title"><i class="hgi hgi-stroke hgi-plus-sign-square"></i> <span class="bottom-menu-text">Create</span></span>
1784                        </a>
1785                          
1786                    </li>
1787                   
1788                    <li class="message-btn-left">
1789                        <a href="javascript:void(0)"
1790                            onclick="$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');" id="shoplinkforweb"  class="sidebar target-link">
1791                            <span class="route_title" style="position:relative;"><i class="hgi hgi-stroke hgi-message-02" aria-hidden="true"></i> <span class="bottom-menu-text">Messages</span><span id="msg-unread-badge" style="display:none;position:absolute;top:-9px;right:-13px;background:#e74c3c;color:#fff;border-radius:50%;font-size:9px;min-width:16px;height:16px;line-height:16px;text-align:center;padding:0 3px;"></span></span>
1792                        </a>
1793                    </li>
1794
1795                    <li class="js-more" style="display:none">
1796                        <a href="https://www.jumpspree.com/signin"  class="sidebar target-link">
1797                            <span class="route_title"><img src="https://www.jumpspree.com/public/images/more-icon-check.png" loading="lazy" alt="Jumpspree More" title="Jumpspree More" style="width:18px; margin-right:5px"> Jumpspree More</span>
1798                        </a>
1799                    </li>
1800                        
1801                    <li style="display:none">
1802                        <a href="javascript:void(0)" id="postlink" class="sidebar target-link active" onclick="getSocialFeed('3','1','1')">
1803                            <span class="route_title"><i class="fa-regular fa-sparkles"></i> Refer and Eran </span>
1804                        </a>
1805                    </li>
1806                        <li style="display:none">
1807                        <a href="javascript:void(0)" id="postlink" class="sidebar target-link active" onclick="getSocialFeed('3','1','1')">
1808                            <span class="route_title"><i class="fa-regular fa-sparkles"></i> Refer &amp; Eran </span>
1809                        </a>
1810                    </li>
1811                    <li id="message-icon-footer">
1812                        <a onclick="$('.profile-menu').hide();" href="javascript:void(0)" class="sidebar target-link">
1813                            <span class="route_title"><i class="fa-regular fa-message-lines"></i> Messages</span>
1814                        </a>
1815                    </li>
1816                    
1817                    <!-- <li id="profile-icon-footer">
1818                        <a onclick="$('.profile-menu').show(); $('.add-more-post').addClass('hide-plus')" href="javascript:void(0)" class="sidebar target-link">
1819                            <span class="route_title">
1820                                
1821                            <i class="fa-sharp fa-regular fa-circle-user"></i> Profile</span>
1822                        </a>
1823                    </li> -->
1824
1825                                            <li id="profile-icon-footer">
1826                                                   <a  href="javascript:void(0)" onclick="$('#signin-new-process').fadeIn('fast')" class="sidebar target-link">
1827                            <span class="route_title">
1828                                <img src="https://www.jumpspree.com/public/images/user-icon.png" alt="Profile" title="Profile" style="width: 30px; height: 30px; border-radius: 50%; object-fit: cover;">
1829                                <span class="bottom-menu-text"> Profile</span>
1830                            </span>
1831                        </a>
1832                    </li>
1833                        
1834
1835
1836<!--
1837                    <ul style="display:none">
1838                        <li id="light-mode-on" class="light-mode">
1839                            <a href="javascript:void(0)" class="sidebar" onclick="toggleMode('light')">
1840                                <span class="route_title"><i class="fa-solid fa-brightness-low"></i>Switch to Light Mode</span>
1841                            </a>
1842                        </li>
1843                        <li id="dark-mode-on" class="dark-mode">
1844                            <a href="javascript:void(0)" class="sidebar" onclick="toggleMode('dark')">
1845                                <span class="route_title"><i class="fa-solid fa-moon"></i> Switch to Night Mode</span>
1846                            </a>
1847                        </li>
1848                    </ul>
1849-->
1850
1851
1852                </ul>
1853                                
1854                       
1855
1856                
1857                <li id="more-resources">
1858                        <a class="sidebar"  href="javascript:void(0)"> 
1859                            <span class="route_title" style="    display: flex !important;align-items: center !important;">
1860                                <img src="https://www.jumpspree.com/public/images/information-circle-stroke.png?ver:1.02" class="left-info-icon" alt="Resources" title="Resources"> 
1861                            Resources 
1862                            </span>
1863                        </a>
1864                                                
1865                        <div class="more-setting-pop1">
1866                            <ul style="margin-bottom:0">
1867                                 <li><a href="https://www.jumpspree.com/frequently-asked-questions" target="_blank">FAQs</a></li>
1868                                 <li><a href="https://www.jumpspree.com/blog"  target="_blank">Blog</a></li>
1869                                 <li><a href="https://www.jumpspree.com/selling-fees"  target="_blank">Selling Fees  </a></li>
1870<!--                            <li><a href="#"  target="_blank">Seller Resources</a></li>-->
1871<!--                            <li><a href="https://www.jumpspree.com/selling-fees"  target="_blank">Shipping Guidelines</a></li>-->
1872                            <li><a href="https://www.jumpspree.com/livestream-returns"  target="_blank">Livestream Returns</a></li>
1873                            <li><a href="https://www.jumpspree.com/return-policy"  target="_blank">Return Policy</a></li>
1874                            <li><a href="https://www.jumpspree.com/terms-of-use"  target="_blank">Terms of Use</a></li>
1875                            <li><a href="https://www.jumpspree.com/privacy-policy"  target="_blank">Privacy Policy</a></li>
1876                                    <!--    <li class="logout-btn"><a href="#">Log Out</a></li>-->
1877                            </ul>
1878                        </div>
1879                    </li>
1880                                <li style="opacity: 0; display:none">
1881                    <a href="javascript:void(0)" id="postlink" class="sidebar target-link active" onclick="$('#jumpspree-more').fadeIn('fast')">
1882                        <span class="route_title"><i class="fa-regular fa-sparkles"></i>  Jumpspree More</span>
1883                    </a>
1884                </li>
1885            </div>
1886        </div>
1887
1888<!--
1889        <div class="login login-sm">
1890            <div class="login_signup_btn">
1891                <a href="javascript:void(0)" onclick="openSignInWrapper()">Sign In</a>
1892                <a href="https://www.jumpspree.app/signup" class="create-accont-btn">Sign Up</a>
1893            </div>
1894        </div>
1895-->
1896    </div>
1897
1898    <div class="add-post" style="display:none">
1899       Create
1900        <div class="plus-wrapper">
1901          
1902            <img src="https://www.jumpspree.com/public/images/add-post.png?ver%3A1_2=" alt="Add Post" title="Add Post" loading="lazy">
1903        </div>
1904        <div class="add-post-drop-box">
1905            <ul>
1906<!--
1907                <li>
1908                    <span><i class="fa-solid fa-feather"></i></span>
1909                    <a href="javascript:void(0)">Product Listing</a>
1910                </li>
1911-->
1912                <!-- <li>
1913                    <span onclick="$('#social-popup').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.add-post').removeClass('add-post-opened');"><img src="https://www.jumpspree.com/public/images/social.png?ver%3A1_2=" alt=""></span>
1914                    <a href="javascript:void(0)" onclick="$('#social-popup').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.add-post').removeClass('add-post-opened');">Social Post</a>
1915                </li>  -->
1916<!--
1917                <li>
1918                    <a href="javascript:void(0)" onclick="$('#blog-post').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.plus-wrapper').removeClass('add-post-opened')">Write an Article</a>
1919                    <span><i class="fa-regular fa-calendar-lines-pen"></i></span>
1920                </li>
1921-->
1922                <!-- <li>
1923                    <span onclick="window.location.href='href="https://www.jumpspree.com/add-article"'"><img src="https://www.jumpspree.com/public/images/article.png?ver%3A1_2=" alt="blank" title="blank"></span>
1924                    <a href="https://www.jumpspree.com/add-article">Article</a>
1925                </li> -->
1926                
1927
1928            <li> 
1929                 
1930                    <span><a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/social.png?ver%3A1_2=" alt="Social Post" title="Social Post"></a></span>
1931                    <a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">Social Post</a>
1932
1933
1934                            </li>
1935
1936            <li style="display:none">
1937                <span><a 
1938  href="javascript:void(0);" 
1939  onclick="$('#signup-new-process').hide(); $('#signin-new-process').fadeIn('fast');">
1940  <img src="https://www.jumpspree.com/public/images/article.png?ver%3A1_2=" alt="Article" title="Article">
1941</a></span>
1942                <a href="javascript:void(0);" 
1943      onclick="$('#signup-new-process').hide(); $('#signin-new-process').fadeIn('fast');"
1944  >
1945  Article
1946</a>
1947            </li>
1948
1949
1950
1951            </ul>
1952        </div>
1953    </div> 
1954    <div class="add-post">
1955                              <a href="javscript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')" style="display: block;width: 100%;text-align: left;">
1956                        <span style="width: 100%;text-align: left;">
1957                            Create </span></a> <div class="plus-wrapper" style="flex-shrink: 0;">
1958          <a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">
1959            <img src="https://www.jumpspree.com/public/images/plus-icon.png?ver%3A1_2=" alt="Add Post" title="Add Post">
1960        </a>
1961        </div>
1962                           
1963                        
1964        
1965        <div class="add-post-drop-box">
1966            <ul>
1967<!--
1968                <li>
1969                    <span><i class="fa-solid fa-feather"></i></span>
1970                    <a href="javascript:void(0)">Product Listing</a>
1971                </li>
1972-->
1973                <!-- <li>
1974                    <span onclick="$('#social-popup').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.add-post').removeClass('add-post-opened');"><img src="" alt=""></span>
1975                    <a href="javascript:void(0)" onclick="$('#social-popup').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.add-post').removeClass('add-post-opened');">Social Post</a>
1976                </li>  -->
1977<!--
1978                <li>
1979                    <a href="javascript:void(0)" onclick="$('#blog-post').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.plus-wrapper').removeClass('add-post-opened')">Write an Article</a>
1980                    <span><i class="fa-regular fa-calendar-lines-pen"></i></span>
1981                </li>
1982-->
1983                <!-- <li>
1984                    <span onclick="window.location.href='href="https://www.jumpspree.com/add-article"'"><img src="https://www.jumpspree.com/public/images/article.png?ver%3A1_2=" alt=""></span>
1985                    <a href="https://www.jumpspree.com/add-article">Article</a>
1986                </li> -->
1987                
1988
1989            <li> 
1990                 
1991                    <span><a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/social.png?ver%3A1_2=" alt="Social" title="Social"></a></span>
1992                    <a href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">Social Post</a>
1993
1994
1995                            </li>
1996
1997            <li style="display:none">
1998                <span><a 
1999  href="javascript:void(0);" 
2000  onclick="$('#signup-new-process').hide(); $('#signin-new-process').fadeIn('fast');">
2001  <img src="https://www.jumpspree.com/public/images/article.png?ver%3A1_2=" alt="Article" title="Article">
2002</a></span>
2003                <a 
2004  href="javascript:void(0);" 
2005  onclick="$('#signup-new-process').hide(); $('#signin-new-process').fadeIn('fast');">
2006  Article
2007</a>
2008
2009            </li>
2010
2011
2012
2013            </ul>
2014        </div>
2015    </div> 
2016    
2017    <div class="social-shadow"></div>
2018</div>
2019
2020
2021<style>
2022/* Top nav bar    */
2023.post-area .top-nav-bar{
2024    margin-top: -50px;
2025    z-index: 9999;
2026    position: relative;
2027    display: none !important;
2028}
2029.product-section .date.ogl.pt-0 {
2030    padding: 0px 0px 0px !important;
2031}    
2032.product-section .date.ogl.pt-0 span.c-img{
2033    margin-bottom: 0;
2034    }
2035.post-area .curved-box {
2036/*    top: 139px;*/
2037    top: 90px;
2038}    
2039.annoucement .email-verification.after-login {
2040/*    margin-top: 45px !important;*/
2041    margin-top: 0px !important;
2042}    
2043.top-nav-bar .left-curve img {
2044    width: 100px;
2045}   
2046.top-nav-bar .right-curve img {
2047    height: 18px;
2048}    
2049.top-nav-bar .right-curve {
2050    gap: 20px;
2051    display: flex;
2052    margin-top: 1px;
2053}
2054.top-nav-bar  a.refresh-icon {
2055    border: 1px solid #19212c;
2056    border-radius: 50%;
2057    width: 37px;
2058    height: 37px;
2059    text-align: center;
2060    display: flex;
2061    align-items: center;
2062    justify-content: center;
2063}
2064/* Top nav bar    */
2065@media screen and (max-width:767px){
2066    body.dark-mode {
2067    background: #0a0a0a !important;
2068}
2069.annoucement .email-verification.after-login {
2070    margin-top: 0px !important;
2071}    
2072    }
2073</style>
2074
2075     
2076    
2077<!--
2078<div class="get-app-qr-code-wrapper" id="getstart-popup" style="display: none;"> 
2079    <div class="email-verification after-login">
2080       <div class="close-getstart" onclick="$('#getstart-popup').fadeOut('fast');">&times;</div>
2081        <div class="email-box">
2082          <div class="getstart-icon">
2083                <img src="https://www.jumpspree.com/public/images/mob-icon.png" alt="Graphic" title="Graphic">
2084           </div>
2085            <h4 class="text-center">Jumpspree works best <br>in the app.</h4>
2086
2087
2088            
2089
2090            
2091
2092            <div class="note-line">
2093                <p class="mb-0">Enjoy a premium experience with advanced <br>features and even more exciting content on <br>the Jumpspree app.</p>
2094            </div>
2095
2096           <div class="download-btn">
2097               <a  class="get-app-btn" href="javascript:void(0)" onclick="$('#getstart-popup').fadeOut('fast');$('#ios-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/ios-download.png" alt="IOS icon" title="IOS icon"></a>
2098                <a  href="javascript:void(0)" onclick="$('#getstart-popup').fadeOut('fast');$('#android-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/download-android.png" alt="Download" title="Download"></a>
2099            </div>
2100
2101
2102
2103        </div>
2104      
2105    </div>
2106</div>
2107-->
2108  <!-- //onclick="$('#search-box-popup').fadeIn()" -->
2109    <!-- Center panel START POST BLOG POLL--> 
2110    <div style="display:block"  id="postBlogDiv"   class="col-md-6">
2111       <h1 class="sr-only" style="position: absolute;
2112    width: 1px;
2113    height: 1px;
2114    padding: 0;
2115    margin: -1px;
2116    overflow: hidden;
2117    clip: rect(0, 0, 0, 0);
2118    white-space: nowrap;
2119    border-width: 0;">Social Shopping Platform to Share, Shop, & Earn</h1>  
2120        <div  class="post-area">
2121         <div class="curve-area-top">
2122            <div class="search-ben"><a href="javascript:void(0)" onclick="$('#search-popup-wrapper-new').fadeIn('fast'); $('body').addClass('overflow-hidden');" ><img src="https://www.jumpspree.com/public/images/lense--search.png" alt="Search" title="Search"></a></div>
2123             <div class="get-more-class get-more-mob"><a class="share-url" href="javascript:void(0)" onclick="getmorepopup()" style="    border-radius: 53px;
2124    padding: 0px 20px;
2125    margin-right: 0;
2126    border: none;
2127    background: #111;
2128    height: 35px;
2129    display: flex;
2130    align-items: center;
2131    justify-content: center;
2132    padding: 0 9px;
2133    font-size: 12px"><img src="https://www.jumpspree.com/public/images/blue-cube-3d.png" alt="blue-cube" title="blue cube" style="margin-right: 5px;
2134    color: #fff;
2135    filter: invert(0) !important;
2136    width: 16px !important;
2137    margin-top: 0px;"> Get MORE</a></div>
2138        
2139        <!-- <div class="reload"><a href="javascript:void(0)" onclick="$('#feed-refresh-popup').fadeIn()" class="refresh-icon"><img src="https://www.jumpspree.com/public/images/refresh.png" alt="Jumpspree"></a></div> -->
2140         <div class="reload"><a href="javascript:void(0)" onclick="getSocialFeed('3','1','0','')" class="refresh-icon"><img src="https://www.jumpspree.com/public/images/refresh.png" alt="refresh" title="refresh"></a></div>
2141         </div>
2142          <div id="fixed-heading-hashTag" style="display:none" class="curved-box fixed-heading">
2143                    <div style="display:none" id="hashTagsDiv" class="hashTagsDiv">
2144                    
2145                        <div class="back-btn">
2146                               <!--  <a href="#" onclick="$('#step2-wrapper').hide(); $('#step1-wrapper').fadeIn(); ">
2147                                    <i class="fa-solid fa-arrow-left-long" aria-hidden="true"></i></a> -->
2148                                    <a href="javascript:void(0);" onclick="handleBackButtonClick()">
2149                                        <img src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Back" title="Back" style="filter:invert(0); height: auto; width:13px">
2150                                    </a>
2151                        </div>
2152                                <input type="hidden" value="" id="hashTagValue" name="hashTagValue" /> 
2153                                <h2 id="currentHashTag">#Inspiration</h2>
2154                        
2155                                <div class="cancel"><span onclick="window.location.href='https://www.jumpspree.com/social'">Cancel</span></div>
2156                            
2157                        </div>
2158                   </div>
2159                 
2160                   
2161           <div class="curved-box">
2162               <div class="top-nav-bar d-flex justify-content-between align-items-center">
2163                                <div class="left-curve">
2164
2165                                <a class="share-url" href="javascript:void(0)" onclick="$('#jumpspree-more-popup').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/more-icon-check.png" alt="Get MORE" title="Get MORE"> Get MORE</a>
2166
2167                                <a class="share-url" href="javascript:void(0)" onclick="copyLink(event)">
2167<img src="https://www.jumpspree.com/public/images/share-url.png" alt="Share Jumpspree" title="Share Jumpspree" style="width: 16px !important;"> Share Jumpspree</a>
2168                                <span style="display:none" class="form-label copySuccessMsg" id="copySuccessMsg"><img src="https://www.jumpspree.com/public/images/copy-check.png" alt="Copy" title="Copy" style="width: 13px !important;">  Link copied! paste it anywhere to share.</span> 
2169
2170                                </div>
2171
2172                                <div class="right-curve" style="opacity:1">
2173                                    <a href="#" class="refresh-icon" onclick="refreshFeed(event)"><img src="https://www.jumpspree.com/public/images/refresh-icon.png" alt="refresh" title="refresh" loading="lazy"></a>
2174                                </div>
2175                                </div>
2176
2177                                
2178                <!--
2179                            <div class="left-curve"></div>
2180                            <div class="right-curve"></div>
2181                -->
2182           </div>
2183                        <div class="email-verification after-login">
2184                   
2185                      
2186                <div class="add-post-top" id="add-post-top"> 
2187                    <!--  <div class="search-main-top"> 
2188                        <input type="text" placeholder="Search"> 
2189                    </div> -->
2190                <div class="d-flex align-items-center justify-content-between wts-jumping">
2191                    <div class="user-wrapper">
2192
2193                    
2194                                
2195                                <div class="user-icon"> 
2196                                 
2197                                <div id="online-dot-" class="user-online"></div>
2198
2199                                    <img src="https://www.jumpspree.com/public/images/user-icon.png" alt="User-Icon" title="User-Icon">
2200                                </div>
2201                                                           <div class="user-name" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Create a new post</div>
2202                                
2203
2204                        </div>
2205                        
2206                            <div class="create"><a   href="javascript:void(0)" onclick="$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');"   >Create</a>
2207                            </div>
2208                           
2209
2210
2211                </div>
2212            </div>
2213            
2214            
2215            <div id="feed-and-stream-switcher" style="display:none">
2216                <ul>
2217                    <li><a href="https://www.jumpspree.com/start-streaming">Livestreams</a></li>
2218                    <li><a href="https://www.jumpspree.com/start-streaming" class="activel">Feed</a></li>
2219                </ul>
2220            </div>
2221            
2222 
2223            <div id="posts-container" class="product-section"> <!-- here all email-box div dynamically added from JS -->
2224                <!-- Posts will be appended here dynamically -->
2225     
2226            </div>  
2227            <div id="posts-container-product"> <!-- here all email-box div dynamically added from JS -->
2228                <!-- Posts will be appended here dynamically -->
2229     
2230            </div>  
2231
2232            
2233            <div id="posts-container-hashTags"> <!-- here all email-box div dynamically added from JS -->
2234                <!-- Posts will be appended here dynamically -->
2235     
2236            </div> 
2237           <!--  <div id="loader" style="display: none;">Loading... 
2238            
2239            </div>-->
2240            <div id="skeleton-container" style="display: block; width: 100%;">
2241                <div class="skeleton-loader">
2242                    <!-- Repeat this block for as many skeletons as you want -->
2243                    <div class="email-box">
2244                        <div class="row">
2245                            <div class="col-md-12">
2246                                <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
2247                                    <div class="d-flex">
2248                                        <div class="fig">
2249                                            <div class="skeleton-circle"></div>
2250                                        </div>
2251                                        <div class="fnc-title">
2252                                            <div class="skeleton-title"></div>
2253                                            <div class="skeleton-username"></div>
2254                                        </div>
2255                                    </div>
2256                                </div>
2257                            </div>
2258                        </div>
2259                        <div class="row">
2260                            <div class="col-md-12">
2261                                <div class="skeleton-title-feed"></div>
2262                                <div class="skeleton-image"></div>
2263                            </div>
2264                        </div>
2265                    </div>
2266                    
2267                    
2268<!--
2269                    <div class="hello">
2270                         <div class="swiper mySwiper">
2271    <div class="swiper-wrapper">
2272      <div class="swiper-slide">Slide 1</div>
2273      <div class="swiper-slide">Slide 2</div>
2274      <div class="swiper-slide">Slide 3</div>
2275      <div class="swiper-slide">Slide 4</div>
2276      <div class="swiper-slide">Slide 5</div>
2277      <div class="swiper-slide">Slide 6</div>
2278      <div class="swiper-slide">Slide 7</div>
2279      <div class="swiper-slide">Slide 8</div>
2280      <div class="swiper-slide">Slide 9</div>
2281    </div>
2282    <div class="swiper-pagination"></div>
2283  </div>
2284                    </div>
2285-->
2286                    <!-- End of skeleton block -->
2287                    <div class="email-box">
2288                        <div class="row">
2289                            <div class="col-md-12">
2290                                <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
2291                                    <div class="d-flex">
2292                                        <div class="fig">
2293                                            <div class="skeleton-circle"></div>
2294                                        </div>
2295                                        <div class="fnc-title">
2296                                            <div class="skeleton-title"></div>
2297                                            <div class="skeleton-username"></div>
2298                                        </div>
2299                                    </div>
2300                                </div>
2301                            </div>
2302                        </div>
2303                        <div class="row">
2304                            <div class="col-md-12">
2305                                <div class="skeleton-title-feed"></div>
2306                                <div class="skeleton-image"></div>
2307                            </div>
2308                        </div>
2309                    </div>
2310                    <div class="email-box">
2311                        <div class="row">
2312                            <div class="col-md-12">
2313                                <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
2314                                    <div class="d-flex">
2315                                        <div class="fig">
2316                                            <div class="skeleton-circle"></div>
2317                                        </div>
2318                                        <div class="fnc-title">
2319                                            <div class="skeleton-title"></div>
2320                                            <div class="skeleton-username"></div>
2321                                        </div>
2322                                    </div>
2323                                </div>
2324                            </div>
2325                        </div>
2326                        <div class="row">
2327                            <div class="col-md-12">
2328                                <div class="skeleton-title-feed"></div>
2329                                <div class="skeleton-image"></div>
2330                            </div>
2331                        </div>
2332                    </div>
2333                    <div class="email-box">
2334                        <div class="row">
2335                            <div class="col-md-12">
2336                                <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
2337                                    <div class="d-flex">
2338                                        <div class="fig">
2339                                            <div class="skeleton-circle"></div>
2340                                        </div>
2341                                        <div class="fnc-title">
2342                                            <div class="skeleton-title"></div>
2343                                            <div class="skeleton-username"></div>
2344                                        </div>
2345                                    </div>
2346                                </div>
2347                            </div>
2348                        </div>
2349                        <div class="row">
2350                            <div class="col-md-12">
2351                                <div class="skeleton-title-feed"></div>
2352                                <div class="skeleton-image"></div>
2353                            </div>
2354                        </div>
2355                    </div>
2356                    <div class="email-box">
2357                        <div class="row">
2358                            <div class="col-md-12">
2359                                <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
2360                                    <div class="d-flex">
2361                                        <div class="fig">
2362                                            <div class="skeleton-circle"></div>
2363                                        </div>
2364                                        <div class="fnc-title">
2365                                            <div class="skeleton-title"></div>
2366                                            <div class="skeleton-username"></div>
2367                                        </div>
2368                                    </div>
2369                                </div>
2370                            </div>
2371                        </div>
2372                        <div class="row">
2373                            <div class="col-md-12">
2374                                <div class="skeleton-title-feed"></div>
2375                                <div class="skeleton-image"></div>
2376                            </div>
2377                        </div>
2378                    </div>
2379                </div>
2380            </div>
2381
2382
2383
2384        </div>
2385 
2386    </div>
2387    <!-- Center panel END POST BLOG POLL --> 
2388
2389
2390
2391
2392
2393
2394    
2395</div>
2396    <style>
2397    .trending-post-skeleton {
2398        width: 150px;
2399        height: 150px;
2400    }
2401
2402    .skeleton-image {
2403        width: 100%;
2404        height: 75%;
2405        background-color: #e0e0e0;
2406        border-radius: 8px;
2407        position: relative;
2408        overflow: hidden;
2409    }
2410
2411    /* Animated shimmer effect */
2412    .animated-skeleton {
2413        background: linear-gradient(90deg, #3b3b3b 25%, #4b4b4b 50%, #3b3b3b 75%);
2414        background-size: 200% 100%;
2415        animation: shimmer 1.5s infinite;
2416    }
2417
2418    @keyframes shimmer {
2419        0% {
2420            background-position: -200% 0;
2421        }
2422        100% {
2423            background-position: 200% 0;
2424        }
2425    }
2426
2427    /* Optional: Adjust the flexbox gap to space out skeletons */
2428    .trending-skeleton {
2429        display: flex;
2430        gap: 15px;
2431    }
2432    .footer-copyright a:hover{text-decoration: underline;}
2433   
2434body.dark-mode .trend ul li a {
2435    color: #b8b8b8;
2436}
2437body.dark-mode .trend ul li a img{
2438    filter: invert(1) brightness(2)
2439}    
2440    .trend{padding-left: 5px}    
2441.trend h4 {
2442    font-size: 18px;
2443    font-weight: 500;
2444}
2445.trend ul li a {
2446    padding: 5px 0;
2447    display: block;
2448    color: #324158;
2449    font-size: 13px;
2450    padding: 4px 0;
2451    font-weight: 400;
2452}
2453 .trend ul li a img {
2454    margin-left: 5px;
2455    width: 11px !important;
2456     }   
2457body.light-mode .input-box input {
2458    border: 1px solid #b1b1b1 !important;
2459    color: #000 !important;
2460}    
2461</style>
2462<!-- right panel START --> 
2463<div class="col-md-3" style="top: 25px;height: 100%; position:sticky">
2464
2465<div class="recomendation">
2466       <h4><b>Popular Profiles</b><span style="opacity:0" onclick="$('#signup-new-process').fadeIn();">btnsss</span></h4>
2467       <div class="add-listing followers" style="flex:1">
2468       <div class="owl-carousel owl-theme" id="recomendation-box">
2469
2470     
2471       <div class="carousel-items">
2472                       <div class="followers-box">
2473                <div class="follow-inner">
2474                    <div class="d-flex justify-content-between align-items-center">
2475                        <div class="d-flex align-items-center">
2476                            <div class="user-image">
2477                               <a href="https://www.jumpspree.com/Jumpspree" target="_blank">
2478                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/0106260241236164.png" alt="user Image" title="user Image" width="30" height="30">
2479                                </a>
2480                            </div>
2481
2482                            <div class="user-name mb-0 notranslate">
2483                                <h2 style="display:none"><a href="https://www.jumpspree.com/Jumpspree" target="_blank">Jumpspree</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2484                                <h2 class="notranslate"><a href="https://www.jumpspree.com/Jumpspree" target="_blank"><span style="">@Jumpspree</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2485                            </div>
2486                        </div>
2487                                                             <div class="follow-btn"><a class="" id="recommended1" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2488                            
2489                                </div>
2490                </div>
2491                </div>
2492              
2493
2494                                <div class="followers-box">
2495                <div class="follow-inner">
2496                    <div class="d-flex justify-content-between align-items-center">
2497                        <div class="d-flex align-items-center">
2498                            <div class="user-image">
2499                               <a href="https://www.jumpspree.com/Vic" target="_blank">
2500                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/1908260555398244.jpg" alt="user Image" title="user Image" width="30" height="30">
2501                                </a>
2502                            </div>
2503
2504                            <div class="user-name mb-0 notranslate">
2505                                <h2 style="display:none"><a href="https://www.jumpspree.com/Vic" target="_blank">Vic</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2506                                <h2 class="notranslate"><a href="https://www.jumpspree.com/Vic" target="_blank"><span style="">@Vic</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2507                            </div>
2508                        </div>
2509                                                             <div class="follow-btn"><a class="" id="recommended2" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2510                            
2511                                </div>
2512                </div>
2513                </div>
2514              
2515
2516                                <div class="followers-box">
2517                <div class="follow-inner">
2518                    <div class="d-flex justify-content-between align-items-center">
2519                        <div class="d-flex align-items-center">
2520                            <div class="user-image">
2521                               <a href="https://www.jumpspree.com/More" target="_blank">
2522                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/3006250813495263.jpg" alt="user Image" title="user Image" width="30" height="30">
2523                                </a>
2524                            </div>
2525
2526                            <div class="user-name mb-0 notranslate">
2527                                <h2 style="display:none"><a href="https://www.jumpspree.com/More" target="_blank">Jumpspree More</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2528                                <h2 class="notranslate"><a href="https://www.jumpspree.com/More" target="_blank"><span style="">@More</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2529                            </div>
2530                        </div>
2531                                                             <div class="follow-btn"><a class="" id="recommended3" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2532                            
2533                                </div>
2534                </div>
2535                </div>
2536              
2537
2538                                <div class="followers-box">
2539                <div class="follow-inner">
2540                    <div class="d-flex justify-content-between align-items-center">
2541                        <div class="d-flex align-items-center">
2542                            <div class="user-image">
2543                               <a href="https://www.jumpspree.com/Mashintoc" target="_blank">
2544                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/1408260828473176.jpg" alt="user Image" title="user Image" width="30" height="30">
2545                                </a>
2546                            </div>
2547
2548                            <div class="user-name mb-0 notranslate">
2549                                <h2 style="display:none"><a href="https://www.jumpspree.com/Mashintoc" target="_blank">Mashintoc</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2550                                <h2 class="notranslate"><a href="https://www.jumpspree.com/Mashintoc" target="_blank"><span style="">@Mashintoc</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2551                            </div>
2552                        </div>
2553                                                             <div class="follow-btn"><a class="" id="recommended4" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2554                            
2555                                </div>
2556                </div>
2557                </div>
2558              
2559
2560                                <div class="followers-box">
2561                <div class="follow-inner">
2562                    <div class="d-flex justify-content-between align-items-center">
2563                        <div class="d-flex align-items-center">
2564                            <div class="user-image">
2565                               <a href="https://www.jumpspree.com/ZappyLaunch" target="_blank">
2566                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2610250706119109.jpg" alt="user Image" title="user Image" width="30" height="30">
2567                                </a>
2568                            </div>
2569
2570                            <div class="user-name mb-0 notranslate">
2571                                <h2 style="display:none"><a href="https://www.jumpspree.com/ZappyLaunch" target="_blank">ZappyLaunch (formerly We Web Pro)</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2572                                <h2 class="notranslate"><a href="https://www.jumpspree.com/ZappyLaunch" target="_blank"><span style="">@ZappyLaunch</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2573                            </div>
2574                        </div>
2575                                                             <div class="follow-btn"><a class="" id="recommended5" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2576                            
2577                                </div>
2578                </div>
2579                </div>
2580              </div><div class="carousel-items">
2581
2582                                <div class="followers-box">
2583                <div class="follow-inner">
2584                    <div class="d-flex justify-content-between align-items-center">
2585                        <div class="d-flex align-items-center">
2586                            <div class="user-image">
2587                               <a href="https://www.jumpspree.com/SellerPad" target="_blank">
2588                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2508260908262982.jpg" alt="user Image" title="user Image" width="30" height="30">
2589                                </a>
2590                            </div>
2591
2592                            <div class="user-name mb-0 notranslate">
2593                                <h2 style="display:none"><a href="https://www.jumpspree.com/SellerPad" target="_blank">Jumpspree Seller Pad</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2594                                <h2 class="notranslate"><a href="https://www.jumpspree.com/SellerPad" target="_blank"><span style="">@SellerPad</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2595                            </div>
2596                        </div>
2597                                                             <div class="follow-btn"><a class="" id="recommended6" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2598                            
2599                                </div>
2600                </div>
2601                </div>
2602              
2603
2604                                <div class="followers-box">
2605                <div class="follow-inner">
2606                    <div class="d-flex justify-content-between align-items-center">
2607                        <div class="d-flex align-items-center">
2608                            <div class="user-image">
2609                               <a href="https://www.jumpspree.com/pageraise" target="_blank">
2610                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2407261030585661.jpg" alt="user Image" title="user Image" width="30" height="30">
2611                                </a>
2612                            </div>
2613
2614                            <div class="user-name mb-0 notranslate">
2615                                <h2 style="display:none"><a href="https://www.jumpspree.com/pageraise" target="_blank">pageraise</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2616                                <h2 class="notranslate"><a href="https://www.jumpspree.com/pageraise" target="_blank"><span style="">@pageraise</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2617                            </div>
2618                        </div>
2619                                                             <div class="follow-btn"><a class="" id="recommended7" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2620                            
2621                                </div>
2622                </div>
2623                </div>
2624              
2625
2626                                <div class="followers-box">
2627                <div class="follow-inner">
2628                    <div class="d-flex justify-content-between align-items-center">
2629                        <div class="d-flex align-items-center">
2630                            <div class="user-image">
2631                               <a href="https://www.jumpspree.com/TeslaAIGuy" target="_blank">
2632                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2306250229069516.jpg" alt="user Image" title="user Image" width="30" height="30">
2633                                </a>
2634                            </div>
2635
2636                            <div class="user-name mb-0 notranslate">
2637                                <h2 style="display:none"><a href="https://www.jumpspree.com/TeslaAIGuy" target="_blank">Tesla AI Guy</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2638                                <h2 class="notranslate"><a href="https://www.jumpspree.com/TeslaAIGuy" target="_blank"><span style="">@TeslaAIGuy</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2639                            </div>
2640                        </div>
2641                                                             <div class="follow-btn"><a class="" id="recommended8" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2642                            
2643                                </div>
2644                </div>
2645                </div>
2646              
2647
2648                                <div class="followers-box">
2649                <div class="follow-inner">
2650                    <div class="d-flex justify-content-between align-items-center">
2651                        <div class="d-flex align-items-center">
2652                            <div class="user-image">
2653                               <a href="https://www.jumpspree.com/emmacollins12" target="_blank">
2654        
2654                        <img src="https://cubesnack-seller.s3.amazonaws.com/products/1812240451324569.jpg" alt="user Image" title="user Image" width="30" height="30">
2655                                </a>
2656                            </div>
2657
2658                            <div class="user-name mb-0 notranslate">
2659                                <h2 style="display:none"><a href="https://www.jumpspree.com/emmacollins12" target="_blank">Emma Collins</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2660                                <h2 class="notranslate"><a href="https://www.jumpspree.com/emmacollins12" target="_blank"><span style="">@emmacollins12</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2661                            </div>
2662                        </div>
2663                                                             <div class="follow-btn"><a class="" id="recommended9" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2664                            
2665                                </div>
2666                </div>
2667                </div>
2668              
2669
2670                                <div class="followers-box">
2671                <div class="follow-inner">
2672                    <div class="d-flex justify-content-between align-items-center">
2673                        <div class="d-flex align-items-center">
2674                            <div class="user-image">
2675                               <a href="https://www.jumpspree.com/catsmax" target="_blank">
2676                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/1006250707077855.jpg" alt="user Image" title="user Image" width="30" height="30">
2677                                </a>
2678                            </div>
2679
2680                            <div class="user-name mb-0 notranslate">
2681                                <h2 style="display:none"><a href="https://www.jumpspree.com/catsmax" target="_blank">Ava</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2682                                <h2 class="notranslate"><a href="https://www.jumpspree.com/catsmax" target="_blank"><span style="">@catsmax</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2683                            </div>
2684                        </div>
2685                                                             <div class="follow-btn"><a class="" id="recommended10" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2686                            
2687                                </div>
2688                </div>
2689                </div>
2690              </div><div class="carousel-items">
2691
2692                                <div class="followers-box">
2693                <div class="follow-inner">
2694                    <div class="d-flex justify-content-between align-items-center">
2695                        <div class="d-flex align-items-center">
2696                            <div class="user-image">
2697                               <a href="https://www.jumpspree.com/EverydayAIGuy" target="_blank">
2698                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2606260631105720.jpg" alt="user Image" title="user Image" width="30" height="30">
2699                                </a>
2700                            </div>
2701
2702                            <div class="user-name mb-0 notranslate">
2703                                <h2 style="display:none"><a href="https://www.jumpspree.com/EverydayAIGuy" target="_blank">Everyday AI Guy</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2704                                <h2 class="notranslate"><a href="https://www.jumpspree.com/EverydayAIGuy" target="_blank"><span style="">@EverydayAIGuy</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2705                            </div>
2706                        </div>
2707                                                             <div class="follow-btn"><a class="" id="recommended11" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2708                            
2709                                </div>
2710                </div>
2711                </div>
2712              
2713
2714                                <div class="followers-box">
2715                <div class="follow-inner">
2716                    <div class="d-flex justify-content-between align-items-center">
2717                        <div class="d-flex align-items-center">
2718                            <div class="user-image">
2719                               <a href="https://www.jumpspree.com/nate_peterson" target="_blank">
2720                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/1812240444033674.jpg" alt="user Image" title="user Image" width="30" height="30">
2721                                </a>
2722                            </div>
2723
2724                            <div class="user-name mb-0 notranslate">
2725                                <h2 style="display:none"><a href="https://www.jumpspree.com/nate_peterson" target="_blank">Nate 🤙</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2726                                <h2 class="notranslate"><a href="https://www.jumpspree.com/nate_peterson" target="_blank"><span style="">@nate_peterson</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2727                            </div>
2728                        </div>
2729                                                             <div class="follow-btn"><a class="" id="recommended12" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2730                            
2731                                </div>
2732                </div>
2733                </div>
2734              
2735
2736                                <div class="followers-box">
2737                <div class="follow-inner">
2738                    <div class="d-flex justify-content-between align-items-center">
2739                        <div class="d-flex align-items-center">
2740                            <div class="user-image">
2741                               <a href="https://www.jumpspree.com/truthspeaker" target="_blank">
2742                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/0104260600547895.jpg" alt="user Image" title="user Image" width="30" height="30">
2743                                </a>
2744                            </div>
2745
2746                            <div class="user-name mb-0 notranslate">
2747                                <h2 style="display:none"><a href="https://www.jumpspree.com/truthspeaker" target="_blank">Truth Speaker</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2748                                <h2 class="notranslate"><a href="https://www.jumpspree.com/truthspeaker" target="_blank"><span style="">
2748@truthspeaker</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2749                            </div>
2750                        </div>
2751                                                             <div class="follow-btn"><a class="" id="recommended13" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2752                            
2753                                </div>
2754                </div>
2755                </div>
2756              
2757
2758                                <div class="followers-box">
2759                <div class="follow-inner">
2760                    <div class="d-flex justify-content-between align-items-center">
2761                        <div class="d-flex align-items-center">
2762                            <div class="user-image">
2763                               <a href="https://www.jumpspree.com/noah_can" target="_blank">
2764                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2512240139532531.jpg" alt="user Image" title="user Image" width="30" height="30">
2765                                </a>
2766                            </div>
2767
2768                            <div class="user-name mb-0 notranslate">
2769                                <h2 style="display:none"><a href="https://www.jumpspree.com/noah_can" target="_blank">Noah</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2770                                <h2 class="notranslate"><a href="https://www.jumpspree.com/noah_can" target="_blank"><span style="">@noah_can</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2771                            </div>
2772                        </div>
2773                                                             <div class="follow-btn"><a class="" id="recommended14" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2774                            
2775                                </div>
2776                </div>
2777                </div>
2778              
2779
2780                                <div class="followers-box">
2781                <div class="follow-inner">
2782                    <div class="d-flex justify-content-between align-items-center">
2783                        <div class="d-flex align-items-center">
2784                            <div class="user-image">
2785                               <a href="https://www.jumpspree.com/kirkling" target="_blank">
2786                                <img src="https://cubesnack-seller.s3.amazonaws.com/products/2706250857582410.jpg" alt="user Image" title="user Image" width="30" height="30">
2787                                </a>
2788                            </div>
2789
2790                            <div class="user-name mb-0 notranslate">
2791                                <h2 style="display:none"><a href="https://www.jumpspree.com/kirkling" target="_blank">Kirk</a><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></h2>
2792                                <h2 class="notranslate"><a href="https://www.jumpspree.com/kirkling" target="_blank"><span style="">@kirkling</span><img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon"></a></h2>
2793                            </div>
2794                        </div>
2795                                                             <div class="follow-btn"><a class="" id="recommended15" href="javascript:void(0)" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Follow</a></div>
2796                            
2797                                </div>
2798                </div>
2799                </div>
2800              
2801
2802                 
2803
2804       </div>
2805     
2806       </div>
2807       </div>
2808   </div>
2809 
2810    
2811    
2812<!--
2813<div class="promotion"  style="background:url('https://www.jumpspree.com/public/images/promo-bg.png')">
2814        <div class="d-flex shape">
2815            <figure><img src="https://www.jumpspree.com/public/images/blue-cube-3d.png" alt="blue cube" title="blue cube"></figure>
2816            <div class="text">
2817                <h4>A little MORE goes a long way. <br>For less. Yes.</h4>
2818                <p>Limited-time upgrade: Get 50% off Jumpspree More for your first year when you subscribe annually in the Jumpspree app. Offer available in the United States only. Limited spots available.</p>
2819                <a href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android" class="btn-group">Upgrade now in the app <img src="https://www.jumpspree.com/public/images/up-arrow.png" alt="Upgrade Now" title="Upgrade Now"></a>
2820            </div>
2821        </div>
2822    </div>
2823-->
2824       
2825    
2826        
2827
2828    <div class="trend" style="padding-bottom:0px;">
2829    
2830    <!-- <div class="widget-feed">
2831        <div id="div-badge-A4J9VE1O"  data-attribute="A4J9VE1O">
2831<script src="https://www.tipnchip.com/widget/support-widget.js" data-badgeid="A4J9VE1O" ></script>
2831 </div>
2832
2833    </div> -->
2834
2835    <div class="widget-feed">
2836        <div id="div-badge-A4J9VE1O" data-attribute="A4J9VE1O"></div>
2837    </div>
2838    
2838<script>
2839    window.onload = function() {
2840        var script = document.createElement("script");
2841        script.src = "https://www.jumpspree.com/public/js/support-widget.js";
2842        script.setAttribute("data-badgeid", "A4J9VE1O");
2843        document.getElementById("div-badge-A4J9VE1O").appendChild(script);
2844    };
2845    </script>
2845
2846
2847
2848
2849<!--        <h4><b>Resources</b></h4>-->
2850         
2851<!--    <p class="footer-copyright" style="color: #474747;font-size: 11px;">© Copyright 2025, <a style="color:#474747;" href="https://www.jumpspree.com">Jumpspree.com</a> a Cubesnack, Inc. company. All rights reserved.</p>                    -->
2852<p class="footer-copyright" style="color: #474747;font-size: 11px;">©Copyright 2026, Jumpspree from <br>Nexa Platforms, Inc.</p>                    
2853
2854 <!-- DESKTOP: segmented pill toggle -->
2855  <div class="theme-desktop">
2856<!--    <h3>Theme</h3>-->
2857    <div class="segmented" id="segmented" data-active="dark">
2858<!--      <div class="thumb"></div>-->
2859      <button type="button" id="btnLight"><img src="https://www.cent.social/public/web1901-assets/images/sun-01-stroke-rounded.png" alt=""></button>
2860      <button type="button" id="btnDark" class="active"><img src="https://www.cent.social/public/web1901-assets/images/moon-02-stroke-rounded.png" alt=""></button>
2861    </div>
2862  </div>
2863 
2864
2865<!--
2866<div id="light-and-dark-mode">
2867<h4>Theme</h4>
2868<ul>
2869                            <li id="light-mode-on" class="light-mode">
2870                                <a href="javascript:void(0)" class="sidebar" onclick="toggleMode('light')">
2871                                    Light
2872                                </a>
2873                            </li>
2874                            <li id="dark-mode-on" class="dark-mode actived">
2875                                <a href="javascript:void(0)" class="sidebar" onclick="toggleMode('dark')">
2876                                     Dark
2877                                </a>
2878                            </li>
2879                            <li class="light-dark-bg"></li>
2880                        </ul> 
2881                        
2882                        </div>  
2883-->
2884         
2885    </div>
2886
2887    <!-- Footer -->
2888<!--
2889    <div class="footer mt-lg-4" style="bottom: 0; z-index: 999; background: #fff!important; width: none;">
2890        <p class="mb-0"> © 2024 Cubesnack, Inc. All rights reserved.<br></p> 
2891    </div>
2892-->
2893</div> 
2894<!-- right panel END -->
2895
2896<!-- Add jQuery for handling the tab switching -->
2897<!--
2897<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
2897-->
2898<script>
2899    $(document).ready(function() {
2900        // Handle click on "People" tab
2901        $('#showPeople').click(function(e) {
2902            e.preventDefault();
2903            $('#pro-wrapper').hide();
2904            $('#people-wrapper').fadeIn();
2905            $('#protab').removeClass('active');
2906            $('#peopletag').addClass('active');
2907        });
2908
2909        // Handle click on "Products" tab
2910        $('#showProducts').click(function(e) {
2911            e.preventDefault();
2912            $('#people-wrapper').hide();
2913            $('#pro-wrapper').fadeIn();
2914            $('#peopletag').removeClass('active');
2915            $('#protab').addClass('active');
2916        });
2917    });
2918</script>
vendor: 2 bytes, line 2918
2918
2919<script>
2920    $(document).ready(function() {
2921        
2922$('#recomendation-box').owlCarousel({
2923    loop:true,
2924    margin:0,
2925    nav:true,
2926    autoplay: false,
2927        //autoPlaySpeed: 50000,
2928        //stopOnHover : true,
2929        //autoPlayTimeout: 50000,
2930        //autoplayHoverPause: true,
2931    responsive:{
2932        0:{
2933            items:1,
2934            autoplay:false
2935        },
2936        600:{
2937            items:1,
2938            autoplay:false
2939        },
2940        1000:{
2941            items:1,
2942            autoplay:false 
2943        }
2944    }
2945}) 
2946        
2947        // Handle click on "People" tab
2948        $('#showPeople').click(function(e) {
2949            e.preventDefault();
2950            $('#pro-wrapper').hide();
2951            $('#people-wrapper').fadeIn();
2952            $('#protab').removeClass('active');
2953            $('#peopletag').addClass('active');
2954        });
2955
2956        // Handle click on "Products" tab
2957        $('#showProducts').click(function(e) {
2958            e.preventDefault();
2959            $('#people-wrapper').hide();
2960            $('#pro-wrapper').fadeIn();
2961            $('#peopletag').removeClass('active');
2962            $('#protab').addClass('active');
2963        });
2964    });
2965</script>
2965
2966
2967 
2968  
2969<!-- Footer code START     for test footer_new_test -->
2970<!-- Footer code START -->
2971<script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/index.js"></script>
2971
2972<link rel="preload" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
2973<noscript><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"></noscript>
2974<script defer src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
2974
2975
2976
2977<style>
2978/* signup_process.css */
2979.follow-btn.following {
2980  background-color: #007bff;
2981  color: white;
2982  padding: 6px 14px;
2983  border-radius: 4px;
2984}
2985
2986</style>
2987
2988
2989<script>
2990// signup_process.js
2991
2992// Global variables
2993var base_url = 'https://www.jumpspree.com/';
2994var token = '';
2995var full_name = '';
2996var user_name = '';
2997var avtar = '';
2998var loader = '<div class="loader"><div class="loader__inner"><div class="loader__content"><span class="loaderspinner"></span></div></div></div>';
2999
3000$(document).ready(function() {
3001    // Initialize form validation and event handlers
3002    initSignupForm();
3003    
3004    // Password toggle functionality
3005    $(document).on('click', '.toggle-password', function() {
3006        var input = $("#password");
3007        if (input.attr('type') === 'password') {
3008            input.attr('type', 'text');
3009            $(this).html('<i class="fa-regular fa-eye-slash"></i>');
3010        } else {
3011            input.attr('type', 'password');
3012            $(this).html('<i class="fa-regular fa-eye"></i>');
3013        }
3014    });
3015
3016    // Disable submit button by default
3017    $('#submitbtnstep1').addClass('disabled').prop('disabled', true);
3018});
3019
3020
3021function initSignupForm() {
3022    // Custom validation method for minimum age
3023    $.validator.addMethod(
3024        "minAge",
3025        function(value, element, minAge) {
3026            if (!value) return false;
3027            var inputDate = new Date(value);
3028            var today = new Date();
3029            var age = today.getFullYear() - inputDate.getFullYear();
3030            var m = today.getMonth() - inputDate.getMonth();
3031            if (m < 0 || (m === 0 && today.getDate() < inputDate.getDate())) {
3032                age--;
3033            }
3034            return age >= minAge;
3035        },
3036        "You must be at least 13 years old."
3037    );
3038
3039    // Custom method to allow only letters, numbers, and spaces
3040    $.validator.addMethod(
3041        "validName",
3042        function(value, element) {
3043            return /^[a-zA-Z0-9 ]+$/.test(value);
3044        },
3045        "Name can only contain letters, numbers, and spaces."
3046    );
3047
3048    //new
3049    $.validator.addMethod(
3050        "validUsername",
3051        function(value, element) {
3052            if (!value) return false;
3053            // Cannot be only numbers, 3-15 chars, only letters/numbers/underscore
3054            return /^(?![0-9]+$)[A-Za-z0-9_]{3,15}$/.test(value);
3055        },
3056        "Username must be 3-15 characters, cannot be only numbers, only letters/numbers/underscores allowed."
3057    );
3058
3059
3060    $("#signupform").validate({
3061        errorClass: 'error_regitration',
3062        errorElement: 'span',
3063        onfocusout: false,
3064        onkeyup: false,
3065        rules: {
3066            fullname: {
3067                required: true,
3068                maxlength: 20,
3069                validUsername: true
3070            },
3071            email: {
3072                required: true,
3073                email: true
3074            },
3075            password: {
3076                required: true,
3077                minlength: 8
3078            },
3079            dob: {
3080                required: true,
3081                minAge: 13
3082            }
3083        },
3084        errorPlacement: function(error, element) {
3085            var name = $(element).attr("name");
3086            error.appendTo($("#" + name + "_validate"));
3087        },
3088        submitHandler: function(form, e) {
3089            e.preventDefault();
3090            checkSignup();
3091        }
3092    });
3093
3094    $('.form-control').on('input change', function () {
3095        var field = $(this);
3096        $("#signupform").validate().element(field);
3097        validateStep1();
3098    });
3099
3100    $('.form-control').on('blur', function() {
3101        $(this).valid();
3102    });
3103
3104    $('.datepicker').datepicker({
3105        format: 'yyyy-mm-dd',
3106        endDate: new Date(),
3107        autoclose: true
3108    });
3109}
3110
3111
3112function validateStep1() {
3113    const fullName = $('#fullname').val().trim();
3114    const email = $('#email').val().trim();
3115    const password = $('#password').val().trim();
3116    const dob = $('#dob').val().trim();
3117
3118    const allFilled = fullName && email && password && dob;
3119
3120    // Handle active field or fallback if no field is focused (like datepicker)
3121    const activeField = $('.form-control:focus');
3122    let currentFieldValid = true;
3123
3124    if (activeField.length > 0) {
3125        currentFieldValid = activeField.valid();
3126    }
3127
3128    // If all fields filled and either active field is valid or no active field
3129    if (allFilled && currentFieldValid) {
3130        $('#submitbtnstep1').removeClass('disabled').prop('disabled', false);
3131    } else {
3132        $('#submitbtnstep1').addClass('disabled').prop('disabled', true);
3133    }
3134}
3135
3136
3137
3138
3139function checkSignup() {
3140    var fullname = $('#fullname').val();
3141    full_name = fullname; // Store full name globally
3142    var password = $('#password').val();
3143    var email = $('#email').val();
3144    var dob = $('#dob').val();
3145    var stext = $('#submitbtnstep1').text();
3146    
3147    // First validate the form manually
3148    var form = $("#signupform");
3149    form.validate().form();
3150    
3151    if (!form.valid()) {
3152        // Show all errors if form is invalid
3153        $('.form-control').each(function() {
3154            $(this).valid();
3155        });
3156        return false;
3157    }
3158    
3159    $('#errorregmessage').text('').fadeOut();
3160    
3161    $.ajax({
3162        method: 'POST',
3163        url: base_url + '/checkRegister', 
3164        data: {
3165            fullname: fullname,
3166            email: email,
3167            password: password,
3168            dob: dob
3169        },
3170        dataType: "json",
3171        beforeSend: function() {
3172            $('#submitbtnstep1').html('<span class="jloader"></span>');
3173        },
3174        success: function(response) {
3175            if (response.status) {
3176                // Store the token if provided
3177                if (response.token) {
3178                    token = response.token;
3179                }
3180                
3181                // Proceed to step 2
3182                $('#step01').hide();
3183                $('#step02').fadeIn();
3184                $(window).scrollTop(0);
3185                
3186                // Update email in step 2
3187                $('#step02 .email-box h2').text('Verify your email');
3188                $('#helper-text').html('We just sent you a code to your email <b>' + email + '</b>. Pop it in below so we know you\'re real.');
3189                
3190                // Initialize OTP validation
3191                initOTPValidation();
3192            } else {
3193                // Show API error message
3194                $('#errorregmessage').text(response.message).fadeIn();
3195            }
3196        },
3197        error: function(xhr, status, error) {
3198            var errorMessage = 'An error occurred. Please try again.';
3199            if (xhr.responseJSON && xhr.responseJSON.message) {
3200                errorMessage = xhr.responseJSON.message;
3201            }
3202            $('#errorregmessage').text(errorMessage).fadeIn();
3203        },
3204        complete: function() {
3205            $('#submitbtnstep1').html(stext + '<img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Arrow" title="Arrow" class="arrow-right">');
3206            setTimeout(function() {
3207                $('#errorregmessage').fadeOut();
3208            }, 5000);
3209        }
3210    });
3211}
3212
3213// Rest of your functions (initOTPValidation, validateOTP, etc.) remain the same...
3214
3215
3216// STEOP 2: OTP Validation
3217
3218function initOTPValidation() {
3219    const otpInput = document.getElementById("otp1");
3220
3221    otpInput.addEventListener("input", function () {
3222        const sanitized = this.value.replace(/\D/g, '').slice(0, 6);
3223        this.value = sanitized;
3224
3225        if (sanitized.length === 6) {
3226            $("#submitbtn").removeClass("disabled").addClass("activebtn");
3227        } else {
3228            $("#submitbtn").addClass("disabled").removeClass("activebtn");
3229        }
3230    });
3231
3232    // Submit button click handler for verifying OTP
3233    $(document).on('click', '#submitbtn', function () {
3234        if ($('#submitbtn').hasClass('disabled')) return;
3235        verifyRegOtp();
3236    });
3237
3238    // Resend code handler
3239    $(document).on('click', '.resend a', function (e) {
3240        e.preventDefault();
3241        resendVerificationCode();
3242    });
3243}
3244
3245function verifyRegOtp() {
3246    const regotp = $('#otp1').val();
3247    const stext = $('#submitbtn').html();
3248    $('#errorotpmessage').text('').fadeOut();
3249
3250    $.ajax({
3251        method: 'POST',
3252        url: 'https://www.jumpspree.com/VerifyRegOtp',
3253        data: {
3254            regotp: regotp,
3255            token: token
3256        },
3257        dataType: "json",
3258        beforeSend: function () {
3259            $('#submitbtn').html('<span class="jloader"></span>');
3260        },
3261        success: function(responseText) {
3262        let response = null;
3263            console.log('Response Text:', responseText);
3264        try {
3265            // If response is string and double JSON is returned
3266            if (typeof responseText === 'string') {
3267                const parts = responseText.split('}{');
3268                if (parts.length === 2) {
3269                    // Join the second part properly
3270                    response = JSON.parse('{' + parts[1]);
3271                } else {
3272                    response = JSON.parse(responseText);
3273                }
3274            } else {
3275                response = responseText;
3276            }
3277
3278            if (response.status) {
3279                // Proceed to next step
3280                $('#step01').hide();
3281                $('#step02').hide();
3282                $('#step03').fadeIn();
3283            } else {
3284                $('#errorotpmessage').text(response.message || 'Invalid code.').fadeIn();
3285            }
3286        } catch (e) {
3287            console.error('Invalid response format', e);
3288            $('#errorotpmessage').text('Something went wrong.').fadeIn();
3289        }
3290    },
3291
3292        complete: function () {
3293            $('#submitbtn').html(stext);
3294            setTimeout(function () {
3295                $('#errorotpmessage').fadeOut();
3296            }, 5000);
3297        }
3298    });
3299}
3300
3301
3302function resendVerificationCode() {
3303    const stext = $('#submitbtn').html();
3304    $.ajax({
3305        method: 'POST',
3306        url: 'https://www.jumpspree.com/resendVerificationCode',
3307        data: { token: token },
3308        dataType: "json",
3309        beforeSend: function () {
3310            $('#submitbtn').html('<span class="jloader"></span>');
3311        },
3312        success: function (response) {
3313            if (!response.status) {
3314                $('#errorotpmessage').text(response.message).fadeIn();
3315            }
3316               showNotification('success', 'Code sent!');
3317        },
3318        complete: function () {
3319            $('#submitbtn').html(stext);
3320            setTimeout(function () {
3321                $('#errorotpmessage').fadeOut();
3322            }, 5000);
3323        }
3324    });
3325}
3326function initOTPValidation() {
3327    const otpInput = document.getElementById("otp1");
3328
3329    otpInput.addEventListener("input", function () {
3330        const sanitized = this.value.replace(/\D/g, '').slice(0, 6);
3331        this.value = sanitized;
3332
3333        if (sanitized.length === 6) {
3334            $("#submitbtn").removeClass("disabled").addClass("activebtn");
3335        } else {
3336            $("#submitbtn").addClass("disabled").removeClass("activebtn");
3337        }
3338    });
3339
3340    // Submit button click handler for verifying OTP
3341    $(document).on('click', '#submitbtn', function () {
3342        if ($('#submitbtn').hasClass('disabled')) return;
3343        verifyRegOtp();
3344    });
3345
3346    // Resend code handler
3347    $(document).on('click', '.resend a', function (e) {
3348        e.preventDefault();
3349        resendVerificationCode();
3350    });
3351}
3352 
3353 
3354
3355// END OF STEP 2: OTP Validation
3356
3357// STEP 03 avtar upload and user name selection 
3358  
3359$(document).ready(function () {
3360
3361    // LIVE CHECK on each keyup or input
3362    $('#username').on('keyup input', function () {
3363        console.log('Username input changed');
3364        const username = $(this).val().trim();
3365
3366        $('#errorusernameemessage').hide();
3367        $('.available-name, .not-available').hide();
3368
3369        if (username.length >= 4 && username !== "@") {
3370            checkUserName(username); // Call API
3371            $('#submitbtnstep3').removeClass('disabled').addClass('activebtn');
3372        } else {
3373            $('#submitbtnstep3').addClass('disabled').removeClass('activebtn');
3374        }
3375    });
3376
3377    // Submit check
3378    $("#submitbtnstep3").on("click", function () {
3379        const regusername = $("#username").val().trim();
3380        const stext = $(this).text();
3381
3382        if (regusername.length < 4 || regusername === "@") {
3383            $("#errorusernameemessage").text("Please enter a valid username").fadeIn();
3384            return;
3385        }
3386
3387        $(this).html('<span class="jloader"></span>');
3388
3389        $.ajax({
3390            method: "POST",
3391            url: "https://www.jumpspree.com/checkRegisterUsername",
3392            data: { username: regusername },
3393            dataType: "json",
3394            success: function (response) {
3395                if (response.status) {
3396                    user_name = regusername; // Store username globally
3397                     $("#hidden_username").val(regusername); 
3398                     $('#userNewName').text('@' + user_name);
3399                      
3400                                        
3401                    const fullUrl = `https://www.jumpspree.com/${user_name}`;
3402                                $('#copy-url-container').text(fullUrl);
3403
3404                                // ✅ Setup copy button click
3405                                $('#copyBtn').off('click').on('click', function (e) {
3406                                    e.preventDefault();
3407                                    console.log('Copy button clicked on 437');
3408                                    const message = `I’m on this new app called Jumpspree—it’s part social, part shopping, all community. It’s where people post, shop, sell, and vibe. C
3408ome check it out and follow me:\n\n${fullUrl}`;
3409
3410                                    // Copy text logic
3411                                    const $temp = $('<textarea>');
3412                                    $('body').append($temp);
3413                                    $temp.val(message).select();
3414                                    document.execCommand("copy");
3415                                    $temp.remove(); 
3416  
3417                                    // Show success message
3418                                     showNotification('success', 'Copied successfully!');
3419                                    $('#errorotpmessageStep6').text('Copied successfully!').fadeIn().delay(2000).fadeOut();
3420                                });
3421
3422
3423
3424
3425
3426
3427
3428
3429                    $(".not-available").hide();
3430                    $(".available-name").fadeIn();
3431
3432                    // Proceed to next step
3433                    $("#step03").hide();
3434                    loadTopics(); // fetch topics only when step 4 actually opens
3435                    $("#step04").fadeIn();
3436                    $(window).scrollTop(0);
3437                } else {
3438                    $(".not-available").fadeIn();
3439                    $(".available-name").hide();
3440                }
3441            },
3442            complete: function () {
3443                $("#submitbtnstep3").html(stext);
3444                setTimeout(() => {
3445                    $("#errorusernameemessage").fadeOut();
3446                }, 5000);
3447            }
3448        });
3449    });
3450
3451
3452    function checkUserName(username) {
3453        $.ajax({
3454            method: "POST",
3455            url: "https://www.jumpspree.com/check-username",
3456            data: { username: username },
3457            dataType: "json",
3458            success: function (response) {
3459                if (response.status) {
3460                    $('.not-available').hide();
3461                    $('.available-name').fadeIn();
3462
3463                    // Enable button
3464                    $('#submitbtnstep3')
3465                        .removeClass('disabled')
3466                        .addClass('activebtn')
3467                        .prop('disabled', false); // <--- remove disabled attribute
3468                } else {
3469                    $('.not-available').fadeIn();
3470                    $('.available-name').hide();
3471
3472                    // Disable button
3473                    $('#submitbtnstep3')
3474                        .addClass('disabled')
3475                        .removeClass('activebtn')
3476                        .prop('disabled', true); // <--- add disabled attribute
3477                }
3478            }
3479        });
3480    }
3481
3482
3483    // Avatar upload functionality
3484    $("#imageUpload").on("change", function () {
3485        const fileInput = this.files[0];
3486
3487        if (fileInput) {
3488            const formData = new FormData();
3489            formData.append("logo", fileInput);
3490            formData.append("name", full_name);
3491
3492            $.ajax({
3493                url: "https://www.jumpspree.com/update-profile",
3494                type: "POST",
3495                data: formData,
3496                processData: false,
3497                contentType: false,
3498                success: function (response) {
3499                    $("#photo-status").text("Photo added ✅").fadeIn();
3500                     avtar = URL.createObjectURL(fileInput);
3501                        updateStep8ProfileUI(); // ✅ Bind avatar
3502                    setTimeout(() => {
3503                        $("#photo-status").fadeOut();
3504                    }, 3000);
3505                },
3506                error: function () {
3507                    $("#photo-status").text("Photo upload failed ❌").css("color", "red").fadeIn();
3508                }
3509            });
3510        }
3511    });
3512
3513
3514});
3515function updateStep8ProfileUI() {
3516    if (user_name) {
3517        $('#userNewName').text('@' + user_name);
3518    }
3519
3520    if (avtar) {
3521        $('#userAvtar img').attr('src', avtar);
3522    }
3523}
3524
3525
3526
3527// step 4 topic selection
3528// ✅ Declare global vars
3529let selectedTopics = []; 
3530$(document).ready(function () {
3531  // loadTopics() is now called lazily when #step04 becomes visible (see line ~458)
3532  // This prevents a redundant get-topic-list call on every page load
3533
3534  // ✅ Button click handler inside ready block
3535  $(document).on('click', '#submitbtnstep4', function () {
3536    if (selectedTopics.length < 3) {
3537      $('#errorotpmessage')
3538        .text("Please select at least 3 topics.")
3539        .fadeIn()
3540        .delay(4000)
3541        .fadeOut();
3542      return;
3543    }
3544
3545    // ✅ Save selected topics
3546    $.post("https://www.jumpspree.com/save-topic-for-user", {
3547      token: token,
3548      topic_ids: selectedTopics
3549    }, function (res) {
3550      if (res.status) {
3551        
3552        $('#step04').hide();
3553        fetchRecommendedUsers(); // fetch only when step 5 actually opens
3554        $('#step05').fadeIn();
3555        $(window).scrollTop(0);
3556      } else {
3557        $('#errorotpmessage').text(res.message || 'Something went wrong.').fadeIn();
3558      }
3559    });
3560  });
3561});
3562
3563// ✅ Load topics dynamically
3564function loadTopics() {
3565  $.get("https://www.jumpspree.com/get-topic-list", function (res) {
3566    if (res.status) {
3567      $('#trendingTopics').empty();
3568      $('#otherTopics').empty();
3569
3570      res.trending.forEach(topic => {
3571        $('#trendingTopics').append(createTopicBtn(topic));
3572      });
3573      res.others.forEach(topic => {
3574        $('#otherTopics').append(createTopicBtn(topic));
3575      });
3576
3577      bindTopicClickEvents();
3578    }
3579  });
3580}
3581
3582// ✅ Render individual topic buttons
3583function createTopicBtn(topic) {
3584  return `<button class="btn topic-btn" data-id="${topic.topic_id}">${topic.topic_name}</button>`;
3585}
3586
3587// ✅ Bind selection events
3588function bindTopicClickEvents() {
3589  $('.topic-btn').off('click').on('click', function () {
3590    const id = $(this).data('id');
3591
3592    if ($(this).hasClass('active')) {
3593      $(this).removeClass('active');
3594      selectedTopics = selectedTopics.filter(tid => tid != id);
3595    } else {
3596      $(this).addClass('active');
3597      selectedTopics.push(id);
3598    }
3599
3600    validateTopicSelection();
3601  });
3602}
3603
3604// ✅ Enable button only after 3+ topics selected
3605function validateTopicSelection() {
3606  const btn = $('#submitbtnstep4');
3607  if (selectedTopics.length >= 3) {
3608    btn.removeAttr('disabled').removeClass('disabled').addClass('activebtn');
3609  } else {
3610    btn.attr('disabled', true).addClass('disabled').removeClass('activebtn');
3611  }
3612}
3613
3614// END OF STEP 4: Topic Selection
3615let followedUsers = [];
3616
3617// Load recommended users
3618function fetchRecommendedUsers() {
3619  $.get(`/get-recommended-list`, function(res) {
3620    if (res.status && res.data.length > 0) {
3621      $('#recommendedUsersContainer').empty();
3622
3623      res.data.forEach(user => {
3624        const isFollowing = followedUsers.includes(user.user_id);
3625        const userCard = `
3626          <div class="users-profie" data-id="${user.user_id}">
3627            <div class="d-flex align-items-center">
3628              <div class="fig">
3629                <img src="${user.image}" alt="${user.username}">
3630              </div>
3631              <div>
3632                <div class="user-profil-detail-box align-items-center">
3633                  <div class="user">
3634                    @${user.username}
3635                    ${user.bluetick == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon">' : ''}
3636                  </div>
3637                </div>
3638                <p class="mb-0">${user.postViews} total post views</p>
3639              </div> 
3640            </div>
3641            <div class="follow-unfollow">
3642              <a id="follow-btn-${user.user_id}" onClick="followunfollows(${user.user_id}, this)" href="javascript:void(0)" 
3643                 class="follow-btn ${isFollowing ? 'following' : 'not-following'}" 
3644                 data-userid="${user.user_id}">${isFollowing ? 'Following' : 'Follow'}</a>
3645            </div>
3646          </div>
3647        `;
3648        $('#recommendedUsersContainer').append(userCard);
3649      });
3650
3651      // ✅ Bind click to each follow button
3652      /* $('.follow-btn').off('click').on('click', function () {
3653        handleFollowClick(this);
3654      }); */
3655    }
3656  });
3657}
3658
3659
3660
3661
3662// function followunfollows(id, el) {
3663//     const $el = $(el);
3664//     const isFollowing = $el.hasClass('following');
3665
3666//     if (!isFollowing) {
3667//         $.post('/followUser', { whom: id, private: 0 }, function (res) {
3668//             if (res) {
3669//                 $el.text(res.text || 'Following')
3670//                     .removeClass('not-following')
3671//                     .addClass('following');
3672
3673//                 if (!followedUsers.includes(id)) {
3674//                     followedUsers.push(id);
3675//                 }
3676
3677//                 updateStep5ButtonState();
3678//             }
3679//         });
3680//     } else {
3681//         $.post('/unfollow', { whom: id, whomtype: 3 }, function (res) {
3682//             if (res) {
3683//                 $el.text('Follow')
3684//                     .removeClass('following')
3685//                     .addClass('not-following');
3686
3687//                 followedUsers = followedUsers.filter(userId => userId !== id);
3688
3689//                 updateStep5ButtonState();
3690//             }
3691//         });
3692//     }
3693// }
3694
3695
3696function followunfollows(id, el) {
3697    const $el = $(el);
3698    const isFollowing = $el.hasClass('following');
3699
3700    // FOLLOW
3701    if (!isFollowing) {
3702
3703        // Don't allow more than 3 users
3704        if (followedUsers.length >= 3) {
3705           // alert('You can follow only 3 users.');
3706
3707             showNotification('error', 'You can follow only 3 users.');
3708            return;
3709        }
3710
3711        $.post('/followUser', { whom: id, private: 0 }, function (res) {
3712            if (res) {
3713                $el.text(res.text || 'Following')
3714                    .removeClass('not-following')
3715                    .addClass('following');
3716
3717                if (!followedUsers.includes(id)) {
3718                    followedUsers.push(id);
3719                }
3720
3721                updateStep5ButtonState();
3722            }
3723        });
3724
3725    // UNFOLLOW
3726    } else {
3727
3728        $.post('/unfollow', { whom: id, whomtype: 3 }, function (res) {
3729            if (res) {
3730                $el.text('Follow')
3731                    .removeClass('following')
3732                    .addClass('not-following');
3733
3734                followedUsers = followedUsers.filter(userId => userId !== id);
3735
3736                updateStep5ButtonState();
3737            }
3738        });
3739    }
3740}
3741 
3742 
3743// Update next button state
3744// function updateStep5ButtonState() {
3745//    const $submitBtn = $('#submitbtnstep5');
3746//   const hasEnoughFollows = followedUsers.length >= 3;
3747  
3748//   $submitBtn.prop('disabled', !hasEnoughFollows)
3749//             .toggleClass('disabled', !hasEnoughFollows)
3750//             .toggleClass('activebtn', hasEnoughFollows); 
3751// }
3752
3753
3754// $(document).on('click', '#submitbtnstep5', function (e) {
3755//     e.preventDefault();
3756
3757//     if (followedUsers.length >= 3) {
3758//         // Hide current step
3759//         $('#step05').hide();
3760
3761//         // Show next step
3762//         $('#step06').show();
3763//     } else {
3764//         // Optional safety (shouldn't happen)
3765//         console.log('Please follow at least 3 users to continue.');
3766//     }
3767// });
3768
3769function updateStep5ButtonState() {
3770    const $submitBtn = $('#submitbtnstep5');
3771    const hasExactlyThreeFollows = followedUsers.length === 3;
3772
3773    $submitBtn
3774        .prop('disabled', !hasExactlyThreeFollows)
3775        .toggleClass('disabled', !hasExactlyThreeFollows)
3776        .toggleClass('activebtn', hasExactlyThreeFollows);
3777}
3778
3779
3780$(document).on('click', '#submitbtnstep5', function (e) {
3781    e.preventDefault();
3782
3783    if (followedUsers.length === 3) {
3784        $('#step05').hide();
3785        $('#step06').show();
3786    } else {
3787        console.log('Please follow exactly 3 users to continue.');
3788    }
3789});
3790
3791// Initial setup when page loads
3792$(document).ready(function() {
3793  // fetchRecommendedUsers() is now called lazily when #step05 becomes visible (line ~577)
3794  // This prevents a redundant get-recommended-list call on every page load
3795
3796
3797  if (user_name) {
3798    $('.share-post-feed .user-name').text('@' + user_name);
3799  }
3800
3801  if (avtar) {
3802    $('.share-post-feed .fig img').attr('src', avtar);
3803  }
3804// end of step 5: Follow users
3805
3806
3807// start of step 6: id="step06" user name bind 
3808   
3809    
3810}); // end of document ready
3811/* 
3812document.getElementById('copyBtn').addEventListener('click', function (e) {
3813    e.preventDefault();
3814    console.log('Copy button clicked 775');
3815    // Clone the node to avoid modifying original
3816    const original = document.getElementById('textToCopy').cloneNode(true);
3817
3818    // Remove the copy button div from the clone
3819    const copyLink = original.querySelector('.copy-link');
3820    if (copyLink) {
3821        copyLink.remove();
3822    }
3823
3824    // Convert <br> tags to newlines
3825    original.innerHTML = original.innerHTML.replace(/<br\s*\/?>/gi, '\n');
3826
3827    // Extract only the visible text
3828    const text = original.innerText.trim();
3829
3830    // Copy to clipboard
3831    navigator.clipboard.writeText(text).then(function () {
3832       $('#errorotpmessageStep6')
3833        .text('Copied successfully!')
3834        .fadeIn()
3835        .delay(2000)
3836        .fadeOut();
3837    }).catch(function (err) {
3838    });
3839}); */
3840// end of step 6: id="step06" user name bind 
3841
3842
3843// step 08 started
3844 
3845
3846// step 08 end 
3847
3848
3849//Login code started 
3850  
3851
3852    $(document).ready(function () {
3853        $("#loginform").validate({
3854            errorClass: 'error_regitration',
3855            errorElement: 'span',
3856            rules: {
3857                loginname: 'required',
3858                loginpassword: 'required'
3859            },
3860
3861            // Disable default error placement
3862            errorPlacement: function () {
3863                return false;
3864            },
3865
3866            // Fully custom error rendering
3867            showErrors: function (errorMap, errorList) {
3868                // First, clear all previous errors
3869                $('#loginname_validate').text('');
3870                $('#loginpassword_validate').text('');
3871
3872                // Now, loop through and set errors manually
3873                $.each(errorList, function (i, errorObj) {
3874                    const fieldName = errorObj.element.name;
3875                    const $target = $("#" + fieldName + "_validate");
3876
3877                    if ($target.length) {
3878                        $target.text(errorObj.message).addClass('error_regitration');
3879                    }
3880                });
3881
3882                // Also highlight invalid fields if needed
3883                this.defaultShowErrors(); // optional for adding 'error' class to inputs
3884            },
3885
3886            submitHandler: function (form, e) {
3887                e.preventDefault();
3888                checkLogin();
3889            }
3890        });
3891
3892
3893        // Toggle password
3894        $(document).on('click', '.toggle-password', function () {
3895            var input = $("#loginpassword");
3896            if (input.attr('type') === 'password') {
3897                input.attr('type', 'text');
3898                $(this).html('<i class="fa-regular fa-eye-slash"></i>');
3899            } else {
3900                input.attr('type', 'password');
3901                $(this).html('<i class="fa-regular fa-eye"></i>');
3902            }
3903        });
3904
3905        // Toggle Email/Username mode
3906         $(document).on('click', '#emailusername', function () {
3907            var logintype = $('#emailusername').data('type');
3908
3909            if (logintype == 2) {
3910                $("#emaillabel").text('Email');
3911                $("#emailusername").text('Use username instead');
3912                $('#loginname').attr("placeholder", "[email protected]").removeClass("padleft");
3913                $("#emailimage").hide();
3914                $('#emailusername').data('type', '1');
3915            } else {
3916                $("#emaillabel").text('Username');
3917                $("#emailusername").text('Use email instead');
3918                $('#loginname').attr("placeholder", "Username").addClass("padleft");
3919                $("#emailimage").show();
3920                $('#emailusername').data('type', '2');
3921            }
3922        });  
3923        
3924        
3925    $(document).on('click', '.use-user-name a', function (e) {
3926            e.preventDefault();
3927
3928            const $this = $(this);
3929            const type = $this.attr('data-type'); // use attr instead of .data()
3930
3931        if (type === '2') {
3932            $("#emaillabel").text('Email');
3933            $this.text('Use username instead').attr('data-type', '1');
3934            $('#forgotemail').attr("placeholder", "[email protected]").removeClass("padleft");
3935            $("#emailimage2").hide();
3936        } else {
3937            $("#emaillabel").text('Username');
3938            $this.text('Use email instead').attr('data-type', '2');
3939            $('#forgotemail').attr("placeholder", "Username").addClass("padleft");
3940            $("#emailimage2").show();
3941        }
3942    });
3943
3944
3945
3946         /* $(document).on('click', '#emailusername', function () {
3947                const $toggle = $('#emailusername');
3948                const logintype = $toggle.data('type'); // 1=email, 2=username
3949                const $input = $('#forgotemail');
3950                const $icon = $('#login-icon');
3951
3952                if (logintype == 2) {
3953                    // Switch to Email
3954                    $('#emaillabel').text('Email');
3955                    $toggle.text('Use username instead').data('type', 1);
3956                    $input.attr('placeholder', '[email protected]')
3957                        .removeClass('with-icon');
3958                    $icon.hide();
3959                } else {
3960                    // Switch to Username
3961                    $('#emaillabel').text('Username');
3962                    $toggle.text('Use email instead').data('type', 2);
3963                    $input.attr('placeholder', 'Username')
3964                        .addClass('with-icon');
3965                    $icon.show();
3966                }
3967            }); */
3968    });
3969
3970   /*  function checkLogin() {
3971        var loginname = $('#loginname').val();
3972        var loginpassword = $('#loginpassword').val();
3973        var logintype = $('#emailusername').data('type');
3974        var stext = $('#submitbtn').text();
3975
3976        $('#errormessage').text('').fadeOut();
3977
3978        $.ajax({
3979            method: 'POST',
3980            url: 'https://www.jumpspree.com/checkLogin',
3981            data: {
3982                loginname: loginname,
3983                loginpassword: loginpassword,
3984                logintype: logintype
3985            },
3986            dataType: "json",
3987            beforeSend: function () {
3988                $('#submitbtn').html('<span class="jloader"></span>');
3989            },
3990            success: function (response) {
3991                var msg = response.message;
3992                var userflag = response.userflag;
3993
3994                if (response.status) {
3995                    if (userflag === '0') {
3996                        window.location.href = 'https://www.jumpspree.com/pick-a-username';
3997                    } else {
3998                        window.location.href = 'https://www.jumpspree.com';
3999                    }
4000                } else {
4001                    $('#errormessage').text(msg).fadeIn();
4002                }
4003            },
4004            complete: function () {
4005                $('#submitbtn').html(stext);
4006                setTimeout(function () {
4007                    $('#errormessage').fadeOut();
4008                }, 5000);
4009            }
4010        });
4011    }  
4012 */
4013
4014function checkLogin() {
4015        let loginname = $('#loginname').val();
4016        let loginpassword = $('#loginpassword').val();
4017        let logintype = $('#emailusername').attr('data-type');
4018        var $signinBtn = $('#signinSubmitBtn');
4019
4020        console.log('=== LOGIN DEBUG START ===');
4021        console.log('Input values - loginname:', loginname, 'logintype:', logintype);
4022
4023        $('#errormessage').text('').fadeOut();
4024
4025        $.ajax({
4026            method: 'POST',
4027            url: 'https://www.jumpspree.com/checkLogin',
4028            data: {
4029                loginname: loginname,
4030                loginpassword: loginpassword,
4031                logintype: logintype
4032            },
4033            dataType: "json",
4034            beforeSend: function() {
4035                console.log('AJAX request started...');
4036                $signinBtn.prop('disabled', true).html('<span class="jloader"></span>');
4037            },
4038            success: function(response) {
4039                console.log('=== AJAX SUCCESS RESPONSE ===');
4040                console.log('Full response:', response);
4041                console.log('Response status:', response.status);
4042                console.log('Response message:', response.message);
4043                console.log('Response userflag:', response.userflag);
4044                console.log('Response redirect:', response.redirect);
4045                console.log('Response token:', response.token);
4046                
4047                let msg = response.message;
4048                let userflag = response.userflag;
4049                
4050                if (response.status) {
4051                    console.log('Login SUCCESS - Processing redirect...');
4052                    console.log('Userflag value:', userflag);
4053                    
4054                    if (userflag == '0') {
4055                        console.log('Userflag is 0 - Redirecting to pick username page');
4056                        window.location.href = 'https://www.jumpspree.com/pick-a-username';
4057                    } else {
4058                        console.log('Userflag is 1 - Checking server redirect...');
4059                        
4060                        if (response.redirect) {
4061                            const redirectUrl = 'https://www.jumpspree.com' + response.redirect;
4062                            console.log('Server redirect found:', response.redirect);
4063                            console.log('Full redirect URL:', redirectUrl);
4064                            console.log('Attempting redirect now...');
4065                            window.location.href = redirectUrl;
4066                        } else {
4067                            console.log('No server redirect provided - Using fallback to home');
4068                            window.location.href = 'https://www.jumpspree.com';
4069                        }
4070                    }
4071                } else {
4072                    console.log('Login FAILED - Showing error message');
4073                    $('#errormessage').text(msg).fadeIn();
4074                }
4075            },
4076            error: function(xhr, status, error) {
4077                console.log('=== AJAX ERROR ===');
4078                console.log('XHR status:', xhr.status);
4079                console.log('Error:', error);
4080                console.log('Response text:', xhr.responseText);
4081            },
4082            complete: function() {
4083                console.log('=== AJAX COMPLETE ===');
4084                $signinBtn.prop('disabled', false).html('Sign In');
4085                setTimeout(() => $('#errormessage').fadeOut(), 5000);
4086            }
4087        });
4088        
4089        console.log('=== LOGIN DEBUG END ===');
4090    }
4091
4092
4093// Login code end
4094
4095 // rest code start 
4096$(document).ready(function () {
4097   // Toggle between Email / Username
4098    $('.use-user-name a, #emailusername').on('click', function () {
4099        const label = $('#emaillabel').text();
4100        $('#emaillabel').text(label === 'Email' ? 'Username' : 'Email');
4101        $('#forgotemail').attr('placeholder', label === 'Email' ? '@username' : '[email protected]');
4102    });
4103
4104        // Live validate email/username
4105    $('#forgotemail').on('input', function () {
4106        const val = $(this).val();
4107        const isEmail = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(val);
4108        const isUsername = val.startsWith('@');
4109        if (!val) {
4110            $('#forgotemail_validate').text('This field is required');
4111        } else if (!isEmail && !isUsername) {
4112            $('#forgotemail_validate').text('Enter a valid email or username');
4113        } else {
4114            $('#forgotemail_validate').text('');
4115        }
4116    });
4117
4118    // Step 1: Send reset link
4119    $('#send-reset-btn').on('click', function () {
4120        const val = $('#forgotemail').val().trim();
4121        if (!val) {
4122            $('#forgotemail_validate').text('Please enter your email or username.');
4123            return;
4124        }
4125
4126        $('#forgotemail_validate, #errorforgotpassword').text('');
4127
4128        const formData = new FormData();
4129        formData.append('forgotemail', val);
4130
4131        $.ajax({
4132            url: base_url + '/forgotpassword',
4133            method: 'POST',
4134            data: formData,
4135            contentType: false,
4136            processData: false,
4137            dataType: 'json',
4138            beforeSend: () => $(this).text('Sending...').prop('disabled', true),
4139            success: function (res) {
4140                if (res.status) {
4141                    resetEmail = res.email;
4142                    resetKey = res.key;
4143                      showNotification('success', 'OTP sent!');
4144                    $('#helper-text').html(`We just sent you a code to your email <b>${resetEmail}</b>`);
4145                    $('#reset-new-process').hide();
4146                    $('#verifyreset-new-process').fadeIn();
4147                } else {
4148                    $('#errorforgotpassword').text(res.message || 'Something went wrong');
4149                }
4150            },
4151            complete: () => $('#send-reset-btn').text('Send').prop('disabled', false)
4152        });
4153    });
4154
4155    $('#verify-otp-btn').on('click', function (e) {
4156    e.preventDefault();
4157
4158    const $otpInput = $('#otpforreset');
4159    const otp = $otpInput.val().trim();
4160
4161    // Remove all previous messages related to this field
4162    $otpInput
4163        .removeClass('error') // remove red border if added by jQuery Validate
4164        .nextAll('.otp-error-message, label.error').remove();
4165
4166    // Validate
4167    if (!otp || otp.length !== 6) {
4168        $otpInput
4169            .addClass('error')
4170            .after('<span class="otp-error-message myerror" style="color:red; font-size:13px;">Enter a valid 6-digit code</span>');
4171        return;
4172    }
4173
4174    // Make API call
4175    $.post(base_url + '/verifyresetpasswordotp', { email: resetEmail, otp }, function (res) {
4176        $otpInput.nextAll('.otp-error-message, label.error').remove(); // clean again before showing
4177
4178        if (res.status) {
4179            $('#verifyreset-new-process').hide();
4180            $('#enter-new-password').fadeIn();
4181        } else {
4182            $otpInput.after(`<span class="otp-error-message myerror" style="color:red; font-size:13px;">${res.message || 'This OTP is invalid.'}</span>`);
4183        }
4184    }, 'json');
4185});
4186
4187   
4188    $('#reset-password-btn').on('click', function (e) {
4189            e.preventDefault();
4190
4191            const newPassword = $('#forgotnewpassword').val().trim();
4192            const confirmPassword = $('#forgotconnewpassword').val().trim();
4193
4194            let isValid = true;
4195
4196            // Clear previous messages
4197            $('#forgotnewpassword_validate, #forgotconnewpassword_validate').hide().text('');
4198
4199            // Validate new password
4200            if (!newPassword) {
4201                $('#forgotnewpassword_validate').text('New password is required').show();
4202                isValid = false;
4203            } else if (newPassword.length < 8 || !/[A-Z]/.test(newPassword) || !/\d/.test(newPassword)) {
4204                $('#forgotnewpassword_validate').text('Must be 8+ chars, include a number and an uppercase letter.').show();
4205                isValid = false;
4206            }
4207
4208            // Validate confirm password
4209            if (!confirmPassword) {
4210                $('#forgotconnewpassword_validate').text('Please confirm your password').show();
4211                isValid = false;
4212            } else if (newPassword !== confirmPassword) {
4213                $('#forgotconnewpassword_validate').text('Passwords do not match').show();
4214                isValid = false;
4215            }
4216
4217            if (!isValid) return;
4218
4219            // All good – call reset API
4220            const payload = {
4221                email: resetEmail,
4222                newpassword: newPassword,
4223                confirmnewpassword: confirmPassword,
4224                key: resetKey
4225            };
4226
4227            $.ajax({
4228                method: 'POST',
4229                url: base_url + '/resetwewpassword',
4230                data: payload,
4231                dataType: "json",
4232                beforeSend: function () {
4233                    $('#createpasswordbox').append('<div class="loader"><div class="loader__inner"><div class="loader__content"><span class="loaderspinner"></span></div></div></div>');
4234                },
4235                success: function (response) {
4236                    if (response.status) {
4237                      //  showNotification('success', response.message || 'Password reset successfully.');
4238
4239                        $('#enter-new-password').fadeOut('fast', function () {
4240                            $('#password-change-success').fadeIn();
4241                        });
4242                    } else {
4243                        showNotification('error', response.message || "Some error occurred, please try again");
4244                    }
4245                },
4246                complete: function () {
4247                    $('#createpasswordbox .loader').remove();
4248                }
4249            });
4250    });
4251    
4252    // Step 4: Resend code - simply trigger the same function
4253    $('.resend a').on('click', function (e) {
4254        e.preventDefault();
4255        $('#send-reset-btn').trigger('click');
4256    });
4257
4258
4259    // Final Close
4260    $('.close a').on('click', function () {
4261        $('#password-change-success').hide();
4262        $('#sign-in-box').fadeIn();
4263    });
4264
4265 
4266
4267     
4268});
4269
4270
4271document.addEventListener('DOMContentLoaded', function () {
4272    const newPassInput = document.getElementById('forgotnewpassword');
4273    const confirmPassInput = document.getElementById('forgotconnewpassword');
4274    const resetBtn = document.getElementById('reset-password-btn');
4275
4276    const newPassError = document.getElementById('forgotnewpassword_validate');
4277    const confirmPassError = document.getElementById('forgotconnewpassword_validate');
4278
4279    function validateFields() {
4280        const newPass = newPassInput.value.trim();
4281        const confirmPass = confirmPassInput.value.trim();
4282
4283        let isValid = true;
4284
4285        // Validate new password field
4286        if (newPass === '') {
4287            newPassError.textContent = 'New password is required';
4288            newPassError.style.display = 'block';
4289            isValid = false;
4290        } else {
4291            newPassError.textContent = '';
4292            newPassError.style.display = 'none';
4293        }
4294
4295        // Validate confirm password field
4296        if (confirmPass === '') {
4297            confirmPassError.textContent = 'Please confirm your password';
4298            confirmPassError.style.display = 'block';
4299            isValid = false;
4300        } else if (newPass !== confirmPass) {
4301            confirmPassError.textContent = 'Passwords do not match';
4302            confirmPassError.style.display = 'block';
4303            isValid = false;
4304        } else {
4305            confirmPassError.textContent = '';
4306            confirmPassError.style.display = 'none';
4307        }
4308
4309        // Enable or disable reset button
4310        if (isValid) {
4311            resetBtn.removeAttribute('disabled');
4312            resetBtn.classList.add('active');
4313        } else {
4314            resetBtn.setAttribute('disabled', 'true');
4315            resetBtn.classList.remove('active');
4316        }
4317    }
4318
4319    newPassInput.addEventListener('input', validateFields);
4320    confirmPassInput.addEventListener('input', validateFields);
4321});
4322
4323// password re typr screen 
4324
4325// Password Toggle Logic
4326   $(document).on('click', '.toggle-password', function () {
4327        const inputSelector = $(this).attr('data-target');
4328        const input = $(inputSelector);
4329
4330        // Toggle icon
4331        $(this).toggleClass('fa-eye fa-eye-slash');
4332
4333        // Toggle type
4334        const type = input.attr('type') === 'password' ? 'text' : 'password';
4335        input.attr('type', type);
4336    });
4337
4338     
4339 
4340
4341   $(document).on('click', '.toggle-password', function () {
4342        const input = $($(this).data('target'));
4343        const icon = $(this).find('i');
4344
4345        if (input.length === 0 || icon.length === 0) return;
4346
4347        // Toggle password visibility
4348        const isPassword = input.attr('type') === 'password';
4349        input.attr('type', isPassword ? 'text' : 'password');
4350
4351        // Toggle eye / eye-slash icon
4352        icon.toggleClass('fa-eye fa-eye-slash');
4353    });
4354
4355
4356 
4357</script>
4357
4358
4359
4360
4361<style>
4362.bookmark-inactive {
4363    filter: invert(1);
4364}
4365span.c-img img.bookmark-inactive, span.c-img img.bookmark-active {
4366    width: 15px !important;
4367    height: 17px !important;
4368    margin: 0 !important;
4369}     
4370.remove-report-attachment{
4371    position: absolute;
4372    top: 10px;
4373    right: 5px;
4374}
4375
4376.search-suggestion-list li.active {
4377    background: #f1f1f1;
4378}
4379
4380.search-suggestion-list li.active a {
4381    color: #000;
4382}    
4383    h2.signinpopup{font-size: 26px;
4384    font-weight: 600;
4385    line-height: 33px;}    
4386    
4387 @media screen and (min-width:768px){    
4388/* Chrome, Edge, Safari */
4389#social-popup .add-post-inside-wrapper::-webkit-scrollbar{
4390    width:10px;
4391}
4392
4393/* Track */
4394#social-popup .add-post-inside-wrapper::-webkit-scrollbar-track{
4395    background:#1f262b;
4396    border-radius:10px;
4397}
4398
4399/* Thumb */
4400#social-popup .add-post-inside-wrapper::-webkit-scrollbar-thumb{
4401    background:#5c6369;
4402    border-radius:10px;
4403}
4404
4405/* Hover thumb */
4406#social-popup .add-post-inside-wrapper::-webkit-scrollbar-thumb:hover{
4407    background:#777;
4408}
4409
4410/* TOP ARROW */
4411#social-popup .add-post-inside-wrapper::-webkit-scrollbar-button:single-button:vertical:decrement{
4412    height:16px;
4413    background-color:#1f262b;
4414    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><polygon points='6,3 10,9 2,9' fill='%23aaa'/></svg>");
4415    background-repeat:no-repeat;
4416    background-position:center;
4417}
4418
4419/* BOTTOM ARROW */
4420#social-popup .add-post-inside-wrapper::-webkit-scrollbar-button:single-button:vertical:increment{
4421    height:16px;
4422    background-color:#1f262b;
4423    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><polygon points='2,3 10,3 6,9' fill='%23aaa'/></svg>");
4424    background-repeat:no-repeat;
4425    background-position:center;
4426}
4427#social-popup .add-post-inside {
4428    padding-right: 0;
4429}    
4430
4431/* Firefox */
4432.agreement-body {
4433    scrollbar-width: thin;
4434    scrollbar-color: #999 #f1f1f1;
4435}    
4436#social-popup .swiper-wrapper.singleImage-added .swiper-slide {
4437/*    width: 100% !important;*/
4438/*    margin: 0 !important;*/
4439}
4440#social-popup div#imagePreviewBox .close-btn.closeThisImg{
4441    right: 5px;
4442    background: #1f1f1fd4;
4443    top: 5px;
4444}    
4445#social-popup .swiper-wrapper.double-imageadded .swiper-slide:last-child {
4446    margin: 0 !important;
4447}
4448
4449#social-popup .swiper-wrapper.double-imageadded .swiper-slide {
4450    flex: 1;
4451}  
4452#social-popup div#imagePreviewBox {
4453    max-width: 100%;
4454}    
4455    #social-popup .swiper-wrapper.double-imageadded .swiper-slide img{
4456    height: 250px !important;
4457    width: 100% !important;
4458    object-fit: cover;
4459    }    
4460.create-post-bottom-icons.d-flex.align-items-center {
4461    background: #161616;
4462    padding-top: 10px;
4463}    
4464#social-popup .swiper-wrapper.singleImage-added .swiper-slide img {
4465    height: auto !important;
4466    width: 100% !important;
4467}    
4468.light-mode .create-post-bottom-icons.d-flex.align-items-center {
4469    background: #f1f1f1 !important;
4470    padding-top: 10px;
4471}     
4472    }
4473 @media screen and (max-width:767px){
4474#social-popup div#imagePreviewBox .close-btn.closeThisImg{
4475    right: 5px;
4476    background: #1f1f1fd4;
4477    top: 5px;
4478}
4479#social-popup .swiper.mySwiper {
4480    padding: 0 20px;
4481}     
4482 .create-post-bottom-icons.d-flex.align-items-center {
4483    background: #000;
4484    padding-top: 10px;
4485}
4486.light-mode .create-post-bottom-icons.d-flex.align-items-center {
4487    background: #f1f1f1 !important;
4488    padding-top: 10px;
4489}
4490    }      
4491#social-popup .swiper-slide {
4492    width: auto;
4493}
4494
4495#social-popup div#imageCarousel {
4496    border: none
4497}
4498
4499.link-favicon {
4500    width: 16px !important;
4501    height: 16px !important;
4502    margin-right: 6px !important;
4503    vertical-align: middle !important;
4504    border-radius: 3px !important;
4505}
4506
4507.user-avatar-placeholder {
4508    width: 40px;
4509    height: 40px;
4510    border-radius: 50%;
4511    background: #007bff;
4512    /* blue background (can change) */
4513    color: #fff;
4514    display: flex;
4515    align-items: center;
4516    justify-content: center;
4517    font-weight: bold;
4518    font-size: 18px;
4519    text-transform: uppercase;
4520}
4521
4522button.select-plan.active {
4523    background-color: #582fdb !important;
4524    color: white;
4525}
4526
4527.iconspin {
4528    animation: iconspin 1s linear infinite;
4529}
4530
4531@keyframes iconspin {
4532    from {
4533        transform: rotate(0deg);
4534    }
4535
4536    to {
4537        transform: rotate(360deg);
4538    }
4539}
4540
4541.spinner {
4542    width: 26px;
4543    height: 26px;
4544    border: 2px solid #f3f3f3;
4545    border-top: 2px solid #333;
4546    border-radius: 50%;
4547    animation: spin 0.6s linear infinite;
4548    display: inline-block;
4549}
4550
4551@keyframes spin {
4552    0% {
4553        transform: rotate(0deg);
4554    }
4555
4556    100% {
4557        transform: rotate(360deg);
4558    }
4559}
4560
4561emoji-picker {
4562    --emoji-picker-search-input-width: 30px !important;
4563    --emoji-picker-search-input-padding: 16px;
4564    --emoji-picker-search-input-font-size: 18px;
4565    --emoji-picker-search-input-border-radius: 10px;
4566    --emoji-picker-search-input-border: 2px solid #5f9ea0;
4567    --emoji-picker-search-input-background: #eef6f8;
4568    --emoji-picker-search-input-color: #333;
4569}
4570
4571emoji-picker {
4572    --emoji-picker-search-input-width: 30px !important;
4573    --emoji-picker-search-input-padding: 16px;
4574    --emoji-picker-search-input-font-size: 18px;
4575    --emoji-picker-search-input-border-radius: 10px;
4576    --emoji-picker-search-input-border: 2px solid #5f9ea0;
4577    --emoji-picker-search-input-background: #eef6f8;
4578    --emoji-picker-search-input-color: #333;
4579}
4580
4581.btnisenable {
4582    background-color: #28a745;
4583    color: white;
4584    cursor: pointer;
4585}
4586
4587.btnisdisable {
4588    background-color: #ccc;
4589    color: #666;
4590    cursor: not-allowed;
4591}
4592
4593.hide {
4594    display: none;
4595}
4596
4597.highlight-hashtag {
4598    color: #007bff;
4599    /* font-weight: bold; */
4600}
4601
4602.highlight-mention {
4603    color: #007bff;
4604    /*  font-weight: bold; */
4605}
4606
4607/*  .mention-link {
4608        color: #007bff !important;
4609       
4610    } */
4611
4612.post-text {
4613    cursor: pointer;
4614}
4615
4616.post-text a {
4617    cursor: default;
4618    /* Keep default cursor for links */
4619}
4620
4621#addPostTextarea {
4622    min-height: 48px;
4623    padding: 8px;
4624
4625    border-radius: 6px;
4626    width: 100%;
4627    font-size: 16px;
4628    overflow-y: auto;
4629    white-space: pre-wrap;
4630}
4631
4632#addPostTextarea:empty:before {
4633    content: attr(data-placeholder);
4634    color: #888;
4635    font-size: 15px;
4636    font-weight: 300;
4637
4638}
4639
4640.highlight {
4641    color: #007BFF;
4642}
4643
4644
4645.getstart-icon img {
4646    width: 60px;
4647}
4648
4649.getstart-icon {
4650    text-align: center;
4651    margin-bottom: 40px !important;
4652
4653}
4654
4655.get-app-qr-code-wrapper .email-verification.after-login {
4656    border: 1px solid #333333;
4657    border-radius: 42px;
4658}
4659
4660.close-getstart {
4661    position: absolute;
4662    right: 40px;
4663    font-size: 33px;
4664    color: #555555;
4665    top: 20px;
4666    font-weight: 100;
4667    cursor: pointer;
4668}
4669
4670div#getstart-popup p {
4671    color: #adadad;
4672    font-size: 14px;
4673    font-weight: 300;
4674}
4675
4676div#getstart-popup .download-btn {
4677    display: flex;
4678    padding: 0;
4679    margin: 0;
4680    width: 100%;
4681    gap: 15px;
4682    justify-content: center;
4683    padding: 0 25px;
4684    margin-bottom: 25px !important;
4685    margin-top: 25px;
4686}
4687
4688div#getstart-popup .email-verification.after-login {
4689    border: 1px solid #333333;
4690    border-radius: 42px;
4691    padding: 15px 0;
4692    padding-top: 40px !important;
4693}
4694
4695.getstart-icon {
4696    text-align: center;
4697    margin-bottom: 20px !important;
4698}
4699
4700.mention-popup {
4701    display: none;
4702    /* position: absolute; */
4703    left: 0;
4704    bottom: 50px;
4705    width: 100%;
4706    max-height: 200px;
4707    overflow-y: auto;
4708    background: white;
4709    border: 1px solid #ccc;
4710    border-radius: 4px;
4711    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
4712    z-index: 1000;
4713}
4714
4715.user-item {
4716    display: flex;
4717    align-items: center;
4718    padding: 8px;
4719    cursor: pointer;
4720    color: white;
4721    background-color: #373737;
4722}
4723
4724.user-item:hover {
4725    background: #3b3b3b;
4726}
4727
4728.user-avatar {
4729    width: 30px;
4730    height: 30px;
4731    border-radius: 50%;
4732    margin-right: 10px;
4733}
4734
4735.user-info {
4736    display: flex;
4737    flex-direction: column;
4738}
4739
4740.user-name {
4741    font-size: 14px;
4742    font-weight: 500;
4743    margin-bottom: 2px;
4744}
4745
4746.user-username {
4747    font-size: 12px;
4748    color: #d4d4d4;
4749}
4750
4751
4752.jloader {
4753    display: inline-block;
4754    width: 16px;
4755    height: 16px;
4756    border: 2px solid #fff;
4757    /* White border */
4758    border-top: 2px solid #007bff;
4759    /* Blue border for animation */
4760    border-radius: 50%;
4761    animation: spin 1s linear infinite;
4762}
4763
4764@keyframes spin {
4765    from {
4766        transform: rotate(0deg);
4767    }
4768
4769    to {
4770        transform: rotate(360deg);
4771    }
4772}
4773
4774.top-shim {
4775    display: flex;
4776    flex-direction: row-reverse;
4777    justify-content: space-between;
4778    margin-bottom: 18px;
4779}
4780
4781.shimmercomment.shimmerbr.shimmeranimate.shimmerw80 {
4782    width: 90%;
4783    margin-top: 16px;
4784}
4785
4786.shimmerdiv {
4787    margin-top: 20px;
4788}
4789
4790.shimmerbr {
4791    border-radius: 2px;
4792}
4793
4794.shimmerw80 {
4795    width: 60%;
4796}
4797
4798
4799.shimmerprofilePic {
4800    height: 35px;
4801    width: 35px;
4802    border-radius: 50%;
4803
4804}
4805
4806.shimmercomment {
4807    height: 5px;
4808    background: #777;
4809    margin-top: 10px;
4810}
4811
4812@keyframes fullView {
4813    100% {
4814        width: 100%;
4815    }
4816}
4817
4818.shimmerw60 {
4819    width: 70%;
4820}
4821
4822.shimmeranimate {
4823    animation: shimmer 2s infinite linear;
4824    background: linear-gradient(to right, #525252 4%, #616161 25%, #616161 36%);
4825    background-size: 1000px 100%;
4826}
4827
4828@keyframes shimmer {
4829    0% {
4830        background-position: -1000px 0;
4831    }
4832
4833    100% {
4834        background-position: 1000px 0;
4835    }
4836}
4837
4838
4839.character-count-container {
4840    display: flex;
4841    align-items: center;
4842    gap: 10px;
4843}
4844
4845.progress-circle {
4846    position: relative;
4847    width: 50px;
4848    height: 50px;
4849}
4850
4851.progress-circle svg {
4852    transform: rotate(-90deg);
4853    width: 100%;
4854    height: 100%;
4855}
4856
4857.progress-circle circle {
4858    fill: none;
4859    stroke-width: 4;
4860}
4861
4862.progress-circle .bg {
4863    stroke: #e0e0e0;
4864}
4865
4866.progress-circle .progress {
4867    stroke: #4caf50;
4868    stroke-dasharray: 138.2;
4869    /* Circumference of the circle (2 * π * r) */
4870    stroke-dashoffset: 138.2;
4871    transition: stroke-dashoffset 0.3s ease;
4872}
4873
4874.disabled {
4875    background: gray;
4876    cursor: not-allowed;
4877}
4878
4879.blue-bg {
4880    background: blue;
4881    color: white;
4882}
4883
4884
4885
4886
4887
4888
4889input#gifSearchForAddPost {
4890    font-size: 15px;
4891    background: #3a3a3a !important;
4892    width: 100%;
4893    padding: 0 15px;
4894    border-radius: 10px;
4895    color: #fff;
4896}
4897
4898button#gifSearchBtnForAddPost {
4899    position: absolute;
4900    right: 16px;
4901    top: 0;
4902    padding: 0;
4903    color: #bbb;
4904    font-size: 24px;
4905}
4906
4907#imagePreviewContainer {
4908    max-width: 55% !important;
4909}
4910
4911.gif-modal {
4912    position: fixed;
4913    top: 10%;
4914    left: 50%;
4915    transform: translate(-50%, 0);
4916    width: 80%;
4917    background: #fff;
4918    border: 1px solid #ddd;
4919    padding: 20px;
4920    z-index: 1000;
4921    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
4922    display: none;
4923    flex-direction: column;
4924}
4925
4926.gif-search {
4927    display: flex;
4928    gap: 10px;
4929    margin-bottom: 10px;
4930}
4931
4932.gif-results {
4933    display: flex;
4934    flex-wrap: wrap;
4935    gap: 10px;
4936    max-height: 400px;
4937    overflow-y: auto;
4938}
4939
4940.gif-results img {
4941    width: 100px;
4942    cursor: pointer;
4943    transition: transform 0.2s;
4944}
4945
4946.gif-results img:hover {
4947    transform: scale(1.1);
4948}
4949
4950.search-icon-btn {
4951    background: none;
4952    border: none;
4953    cursor: pointer;
4954    font-size: 18px;
4955    padding: 5px;
4956    color: #333;
4957}
4958
4959.search-icon-btn i {
4960    font-size: 20px;
4961}
4962
4963.search-icon-btn:hover i {
4964    color: #007bff;
4965    /* Change color on hover */
4966}
4967
4968@media screen and (max-width:767px) {
4969    #social-popup .add-post-inner span.discard-button {
4970        font-size: 12px;
4971    }
4972
4973    #getstart-popup .email-verification.after-login {
4974        width: 90%;
4975    }
4976
4977    div#getstart-popup .download-btn {
4978        padding: 0 10px;
4979    }
4980
4981    div#getstart-popup .email-verification.after-login .email-box {
4982        border-bottom: none !important;
4983    }
4984
4985    div#getstart-popup .download-btn {
4986        margin-bottom: 15px !important;
4987    }
4988
4989    div#getstart-popup p br {
4990        display: none;
4991    }
4992
4993    .close-getstart {
4994        right: 20px;
4995        top: 10px;
4996    }
4997
4998    .upload-snackbar {
4999        position: fixed;
5000        bottom: 20px;
5001        right: 20px;
5002        width: 300px;
5003        background: #333;
5004        color: white;
5005        border-radius: 4px;
5006        padding: 15px;
5007        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
5008        display: none;
5009        z-index: 10000;
5010    }
5011
5012    .upload-progress-container {
5013        width: 100%;
5014        height: 4px;
5015        background: #555;
5016        border-radius: 2px;
5017        margin-bottom: 8px;
5018        overflow: hidden;
5019    }
5020
5021    .upload-progress-bar {
5022        height: 100%;
5023        width: 0%;
5024        background: #4CAF50;
5025        border-radius: 2px;
5026        transition: width 0.3s ease;
5027    }
5028
5029    .upload-message {
5030        margin-bottom: 5px;
5031        font-size: 14px;
5032    }
5033
5034    .upload-percentage {
5035        text-align: right;
5036        font-size: 12px;
5037        color: #aaa;
5038    }
5039
5040    #uploadProgressBar {
5041        transition: width 0.3s ease-in-out;
5042    }
5043
5044
5045}
5046</style>
5047<style>
5048#addPostTextarea {
5049    margin-top: 10px;
5050}
5051
5052.add-post-inside-wrapper {
5053    height: auto;
5054    max-height: 49vh;
5055    overflow-y: auto;
5056    min-height: auto;
5057}
5058
5059.post-foot.add-post-foot .post-setting-box {
5060    padding: 0;
5061    border: none;
5062}
5063
5064div#post-setting-dropup,
5065div#post-setting-dropup-poll {
5066    position: absolute;
5067    bottom: 60px;
5068    background: #262525;
5069    width: 290px;
5070    padding: 0px;
5071    border-radius: 20px;
5072}
5073
5074#post-setting-dropup .post-setting-box-list,
5075#post-setting-dropup-poll .post-setting-box-list {
5076    border: none;
5077    padding: 0;
5078    margin: 0 !important;
5079}
5080
5081.post-setting-box-list {
5082    padding: 3px 13px !important;
5083    border-bottom: 1px solid #3241585c !important;
5084    border-radius: 0 !important;
5085}
5086
5087.post-setting-box-list:last-child {
5088    border-bottom: none !important;
5089}
5090
5091#post-setting-dropup,
5092#post-setting-dropup-poll {
5093    transform: scale(0);
5094    transition: all 0.3s ease;
5095    transform-origin: left bottom;
5096    opacity: 0;
5097}
5098
5099div#post-setting-dropup.show-popup,
5100div#post-setting-dropup-poll.show-popup {
5101    transform: scale(1.0);
5102    opacity: 1;
5103}
5104
5105.post-foot.add-post-foot .post-setting-box h3 {
5106    margin: 0;
5107    cursor: pointer;
5108}
5109
5110div#social-popup .header-post.social-add-header {
5111    min-height: 544px;
5112}
5113
5114#social-popup .popup-top-header {
5115    border-bottom: 1px solid #3241585c;
5116}
5117
5118#social-popup .popup-top-header .draft a {
5119    display: flex;
5120    align-items: center;
5121    justify-content: center;
5122    font-size: 14px !important;
5123    font-weight: 600;
5124}
5125
5126#social-popup .add-post-inner .post-btn a {
5127    right: inherit;
5128    left: 4px;
5129    color: #fff;
5130}
5131
5132#social-popup .post-btn {
5133    padding-right: 0;
5134}
5135
5136div#social-popup .post-foot.add-post-foot .send-post button {
5137    border-left: 2px solid #3241585c !important;
5138    padding-right: 9px;
5139    margin-right: 0;
5140    padding-left: 6px;
5141    width: 42px;
5142    float: right;
5143    margin-left: 24px;
5144    border-right: none !important;
5145    margin: 3px 0;
5146    padding: 4px 5px;
5147}
5148
5149.post-foot.add-post-foot .post-setting-box h3 {
5150        /* font-weight: 700 !important; */
5151    /* color: #fff !important; */
5152    cursor: pointer;
5153    /* font-weight: 700; */
5154    font-weight: 500;
5155    font-size: 14px;
5156    color: #757575;
5157}
5158
5159#social-popup .add-post-inner .post-btn a i {
5160    color: #fff;
5161}
5162
5163#social-popup .post-btn {
5164    padding-left: 7px;
5165}
5166
5167#social-popup .post-btn {
5168    width: 90px;
5169}
5170
5171#social-popup .popup-top-header {
5172    border-bottom: 1px solid #3241585c;
5173    padding: 10px 25px;
5174}
5175
5176div#social-popup .post-btn.addPost-form-submit.active {
5177    background: none !important;
5178}
5179
5180.post-btn.addPost-form-submit.disabled i {
5181    opacity: 0.5;
5182}
5183
5184.post-btn.addPost-form-submit.active i {
5185    opacity: 1;
5186}
5187
5188.social-popup .add-post-inner a.discard-button,
5189.social-popup .add-post-inner span.discard-button {
5190    color: #b8b8b8 !important;
5191}
5192
5193.social-popup .add-post-inner span.discard-button {
5194    color: #b8b8b8 !important;
5195    font-size: 14px;
5196}
5197
5198.post-foot.add-post-foot .post-setting-box h3 {
5199    color: #b8b8b8;
5200    font-size: 14px;
5201    font-weight: 500;
5202}
5203
5204#social-popup span.post-creation-divider {
5205    margin: 0 7px;
5206    color: #b8b8b8;
5207}
5208
5209#social-popup span.post-creation-username {
5210    color: #b8b8b8;
5211}
5212
5213#social-popup .header-add-post .fnc {
5214    margin-bottom: 5px !important;
5215}
5216
5217.search-box-add-topic.d-flex.align-items-center.gap-4 a {
5218    font-size: 15px !important;
5219}
5220
5221.search-box-add-topic input {
5222    border: 1px solid #3241585c !important;
5223    background: none !important;
5224    padding-left: 40px;
5225}
5226
5227.search-box-add-topic {
5228    justify-content: space-between;
5229}
5230
5231.search-input-topic i {
5232    position: absolute;
5233    color: #fff;
5234    left: 16px;
5235    z-index: 9;
5236    top: 12px;
5237}
5238
5239.search-input-topic {
5240    position: relative;
5241}
5242
5243.search-input-topic {
5244    flex: 1;
5245}
5246
5247#social-popup .add-a-topic a {
5248    color: #fff !important;
5249    font-size: 14px !important;
5250}
5251
5252.search-topic-dropdown-row {
5253    justify-content: space-between;
5254    display: flex;
5255    color: #fff;
5256    padding: 5px 0;
5257    align-items: center;
5258    font-size: 12px;
5259    font-weight: 600;
5260}
5261
5262.social-popup .search-topic-dropdown-row a:hover {
5263    background: #222;
5264}
5265
5266.social-popup .search-topic-dropdown-row a {
5267    font-size: 12px !important;
5268    /* opacity: 0; */
5269    border-radius: 50px;
5270    border: 1px solid #3241585c !important;
5271    padding: 6px 15px;
5272    color: #fff !important;
5273    font-size: 11px !important;
5274}
5275
5276.search-topic-dropdown {
5277    padding: 20px 0;
5278}
5279
5280.add-a-topic img {
5281    width: 20px;
5282    filter: invert(1);
5283}
5284
5285#social-popup .add-a-topic a {
5286    color: #fff !important;
5287    font-size: 12px !important;
5288}
5289
5290#social-popup .add-a-topic a {
5291    color: #fff !important;
5292    font-size: 11px !important;
5293    display: flex;
5294    align-items: center;
5295    gap: 3px;
5296}
5297
5298#social-popup .image-preview-box {
5299    margin-bottom: 20px;
5300}
5301
5302#social-popup .embed-link a,
5303#social-popup .add-alt-text a {
5304    /*        font-size: 0px !important;*/
5305}
5306
5307#social-popup .embed-link,
5308#social-popup .add-alt-text {
5309    padding: 0;
5310    width: 33px;
5311    height: 33px;
5312    justify-content: center;
5313    align-items: center;
5314    display: flex;
5315}
5316
5317#social-popup .embed-link i.hgi.hgi-stroke.hgi-link-05 {
5318    font-size: 18px;
5319}
5320
5321#social-popup div#draft-box {
5322    border-radius: 25px;
5323    background: #161616;
5324}
5325
5326#social-popup .add-post-inner.draft-open {
5327    /*    height: auto !important;*/
5328}
5329
5330#social-popup img#gifPreviewAddPost {
5331    max-height: calc(100vh - 350px);
5332}
5333
5334#social-popup .add-post-inside-wrapper {
5335    height: auto;
5336    max-height: none;
5337    overflow-y: inherit;
5338    min-height: inherit;
5339}
5340
5341#social-popup .post-btn {
5342    border: 1px solid #32415866 !important;
5343}
5344
5345div#social-popup .post-foot.add-post-foot .send-post button {
5346    border-left: 1px solid #3241585c !important;
5347    margin: 6px 0;
5348    padding: 5px 5px;
5349}
5350
5351div#social-popup .post-foot.add-post-foot .send-post button {
5352    display: flex;
5353    align-items: center;
5354    justify-content: center;
5355}
5356
5357.post-btn.addPost-form-submit i {
5358    font-size: 20px;
5359}
5360
5361#social-popup .add-post-inner .post-btn a i {
5362    font-size: 22px;
5363}
5364
5365.post-setting-box-list label {
5366    color: #fff;
5367    font-size: 15px;
5368}
5369
5370.add-a-topic {
5371    display: none;
5372}
5373
5374#social-popup .video-preview-box video {
5375
5376    margin-bottom: 0;
5377    margin-left: 8px;
5378}
5379
5380.embed-inner>.d-flex {
5381    flex-direction: column;
5382}
5383
5384#social-popup #add-alt-tag .input-embed {
5385    margin: 15px 0;
5386    flex-direction: column;
5387}
5388
5389#social-popup .c-count {
5390    color: #d8d8d8;
5391    font-size: 10px;
5392    margin-bottom: 15px;
5393    margin-top: 5px;
5394}
5395
5396#social-popup #add-alt-tag button.copy-embed:disabled {
5397    margin-left: 0;
5398    background: #303030;
5399    border-radius: 10px;
5400    color: #000;
5401}
5402
5403#social-popup #add-alt-tag button.copy-embed {
5404    margin-left: 0;
5405    background: #6e12ff;
5406    border-radius: 10px;
5407    color: #fff;
5408}
5409
5410#social-popup div#embed-link .input-embed input {
5411    border: 1px solid #3241585c;
5412    background: none !important;
5413    padding: 14px;
5414    border-radius: 10px;
5415    margin-bottom: 10px;
5416}
5417
5418#social-popup div#embed-link button.copy-embed:disabled {
5419    margin-left: 0;
5420    background: #303030;
5421    border-radius: 10px;
5422    color: #000;
5423}
5424 
5425#social-popup div#embed-link button.copy-embed {
5426    margin-left: 0;
5427    background: #6e12ff;
5428    border-radius: 10px;
5429    color: #fff;
5430}
5431
5432#social-popup #embed-link .input-embed {
5433    flex-direction: column;
5434}
5435
5436#social-popup div#embed-link h3 {
5437    width: 100%;
5438    text-align: left;
5439    align-items: center;
5440    display: flex;
5441    gap: 7px;
5442}
5443
5444#social-popup .Schedule-message-wrapper h3,
5445#schedule-social-popup .Schedule-message-wrapper h3,
5446#social-popup .ReSchedule-message-wrapper h3 {
5447    color: #fff;
5448    font-size: 18px;
5449    margin-bottom: 30px;
5450}
5451
5452#social-popup .add-post-inner .post-btn a {
5453    padding-left: 8px;
5454}
5455
5456#social-popup .Schedule-message-wrapper {
5457    background: #161616;
5458}
5459
5460#social-popup .schedule-footer button.btn.schedule-message {
5461    background: #09090900;
5462}
5463
5464.post-setting-box-list label span:last-child {
5465    opacity: 0;
5466}
5467
5468.show-popup .post-setting-box-list label span:last-child {
5469    transition-delay: 1s;
5470    opacity: 1;
5471}
5472
5473@media screen and (max-width:767px) {
5474    #social-popup .Schedule-message-wrapper {
5475        background: #000;
5476    }
5477
5478    #social-popup .schedule-footer.d-flex.justify-content-end {
5479        justify-content: flex-end !important;
5480    }
5481
5482    #add-alt-tag button.copy-embed {
5483        margin-left: 0;
5484    }
5485
5486    #addPostTextarea {
5487        margin-top: 0;
5488    }
5489
5490    #social-popup #draft-container .no-drafts {
5491        margin-top: 0;
5492    }
5493
5494    #social-popup div#add-alt-tag,
5495    #social-popup div#embed-link {
5496        background: #171717;
5497        border-radius: 25px 25px 0 0 !important;
5498    }
5499
5500    #social-popup div#embed-link {
5501        padding-bottom: 40px !important;
5502    }
5503
5504    .post-setting-box-list label span:last-child {
5505        opacity: 0;
5506    }
5507
5508    .show-popup .post-setting-box-list label span:last-child {
5509        transition-delay: 1s;
5510        opacity: 1;
5511    }
5512
5513    div#gifModalForAddPost {
5514        background: #000000;
5515    }
5516
5517    #social-popup .post-foot.add-post-foot .post-setting-box h3 {
5518        font-weight: 700;
5519    }
5520
5521    #social-popup .add-post-inner.draft-open {
5522        /*    height: 100vh !important;*/
5523        /*    top: 0 !important;*/
5524    }
5525
5526    div#social-popup {
5527        background: #000000 !important;
5528    }
5529
5530    #draft-box .close.delete-all {
5531        display: flex !important;
5532        align-items: center;
5533        justify-content: center;
5534    }
5535
5536    #social-popup div#draft-box {
5537        border-radius: 0;
5538        background: #000;
5539    }
5540
5541    #social-popup .add-post-inner {
5542        background: #0a0a0a;
5543    }
5544
5545    div#social-popup .post-foot.add-post-foot.d-flex.justify-content-between {
5546        background: #0a0a0a;
5547    }
5548
5549    #social-popup .popup-top-header {
5550        border-bottom: none;
5551    }
5552
5553    #social-popup .popup-top-header {
5554        padding: 10px 15px;
5555    }
5556
5557    .search-topic-dropdown-row {
5558        padding: 5px 0;
5559    }
5560
5561    div#add-topic-box {
5562        padding: 15px 15px !important;
5563        background: #0f0f0f;
5564    }
5565
5566    #social-popup .popup-top-header h2 {
5567        font-size: 14px;
5568        font-weight: 700;
5569    }
5570
5571    #social-popup #addPostTextarea {
5572        font-size: 14px;
5573    }
5574
5575    #social-popup .add-image img {
5576        width: 15px !important;
5577    }
5578
5579    #social-popup .add-post-inner {
5580        border: none;
5581        background: #000000;
5582    }
5583
5584    #social-popup .post-foot.add-post-foot .post-setting-box {
5585        position: static;
5586        padding: 0;
5587        margin: 0 !important;
5588    }
5589
5590    #social-popup .add-image {
5591        padding: 0 15px;
5592    }
5593
5594    .add-post-inside-wrapper {
5595        height: auto;
5596    }
5597
5598    div#social-popup .post-foot.add-post-foot {
5599        padding: 10px 15px;
5600    }
5601
5602    div#social-popup .post-foot.add-post-foot.d-flex.justify-content-between {
5603        background: #000000;
5604    }
5605
5606    #social-popup .popup-top-header .draft a {
5607        font-size: 13px !important;
5608    }
5609
5610    .social-popup .add-post-inner a.discard-button {
5611        font-size: 13px !important;
5612    }
5613
5614    #social-popup .post-btn {
5615        border: 1px solid #32415866 !important;
5616        width: 87px;
5617    }
5618
5619    div#social-popup .post-foot.add-post-foot .send-post button {
5620        border-left: 1px solid #3241585c !important;
5621        display: flex;
5622        align-items: center;
5623        justify-content: center;
5624    }
5625
5626    div#social-popup .post-foot.add-post-foot .send-post button {
5627        width: 42px;
5628        margin: 6px 3px;
5629        padding: 3px 5px;
5630    }
5631
5632    #social-popup .add-post-inner .post-btn a {
5633        left: 2px;
5634    }
5635
5636
5637    #social-popup .post-btn.addPost-form-submit i {
5638        font-size: 20px;
5639    }
5640
5641    #social-popup .add-post-inner .post-btn a i {
5642        font-size: 22px;
5643    }
5644
5645    .post-setting-box-list label {
5646        padding: 10px 0;
5647    }
5648
5649    #social-popup .add-image img {
5650        width: 18px !important;
5651    }
5652
5653    #social-popup .add-image ul li {
5654        margin-right: 3px;
5655    }
5656
5657    #social-popup div#add-alt-tag p {
5658        font-size: 11px !important;
5659    }
5660
5661    #social-popup #add-alt-tag .alt-header>.d-flex {
5662        margin-bottom: 10px !important;
5663    }
5664
5665    #social-popup #add-alt-tag .input-embed {
5666        margin: 15px 0;
5667        flex-direction: column;
5668    }
5669
5670    #social-popup .c-count {
5671        color: #d8d8d8;
5672        font-size: 10px;
5673        margin-bottom: 15px;
5674        margin-top: 5px;
5675    }
5676
5677    #social-popup #add-alt-tag button.copy-embed {
5678        margin-left: 0;
5679        background: #303030;
5680        border-radius: 7px;
5681        color: #000;
5682    }
5683
5684    #social-popup #add-alt-tag .input-embed textarea {
5685        border: 1px solid #3241585c;
5686        background: none !important;
5687        padding: 14px;
5688        border-radius: 20px;
5689    }
5690
5691    #social-popup div#embed-link h3 img,
5692    #social-popup div#add-alt-tag h3 img {
5693        width: 30px;
5694        margin-right: 4px;
5695    }
5696
5697    #social-popup div#embed-link h3,
5698    #social-popup div#add-alt-tag h3,
5699    #social-popup div#add-alt-preview h3 {
5700        font-size: 17px;
5701        font-weight: 700;
5702    }
5703
5704    #social-popup .alt-header .close a {
5705        color: #fff !important;
5706        font-weight: 500 !important;
5707    }
5708
5709    #social-popup #embed-link .input-embed {
5710        flex-direction: column;
5711    }
5712
5713/*
5714   body.light-mode #social-popup div#embed-link button.copy-embed {
5715        margin-left: 0;
5716        background: #303030;
5717        border-radius: 10px;
5718        color: #000;
5719    }
5720*/
5721
5722    #social-popup div#embed-link .input-embed input {
5723        border: 1px solid #3241585c;
5724        background: none !important;
5725        padding: 14px;
5726        border-radius: 10px;
5727        margin-bottom: 10px;
5728    }
5729
5730    #social-popup #embed-link .input-embed {
5731        margin-top: 15px;
5732    }
5733
5734    #social-popup div#embed-link p {
5735        font-size: 11px !important;
5736    }
5737
5738    #social-popup .embed-link-header {
5739        display: flex;
5740        align-items: center;
5741    }
5742
5743    #social-popup .embed-link-header i {
5744        font-size: 20px;
5745        margin-right: 7px;
5746        font-weight: 500;
5747    }
5748
5749    #social-popup #embed-link .embed-header h3.embed-link-header {
5750        margin-bottom: 0;
5751    }
5752
5753    #social-popup #embed-link .embed-header .d-flex.align-items-center.mb-3 {
5754        margin-bottom: 10px !important;
5755    }
5756
5757    #social-popup .video-preview-box video {
5758        margin-left: 21px;
5759    }
5760
5761    #social-popup .add-image img.video-icon {
5762        width: 18px !important;
5763    }
5764
5765    #social-popup .add-image img {
5766        width: 15px !important;
5767    }
5768}
5769</style>
5770
5771<!--26-06-2025-->
5772<link rel="preload" href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
5773<noscript><link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" rel="stylesheet"></noscript>
5774
5775<style>
5776#gifModalForAddPost div#gifResults-outer {
5777    height: 486px;
5778    overflow-y: auto;
5779    border-radius: 0 0 15px 15px;
5780}
5781#gifModalForAddPost .gif-list {
5782    display: flex;
5783    flex-wrap: wrap;
5784    gap: 10px;
5785    margin-top: 10px;
5786    max-height: none;
5787    overflow-y: auto;
5788    height: 100%;
5789    height: 400px;
5790    visibility: visible;
5791    padding-left: 0;
5792    height: auto;
5793    display: block;
5794    column-width: 130px;
5795    column-gap: 10px;
5796}
5797div#gifModalForAddPost .gif-list img {
5798    max-width: 100%;
5799    height: auto;
5800    object-fit: cover;
5801    width: 100%;
5802    margin-bottom: 10px;
5803}    
5804/*
5805.announcement-popup + header {
5806    margin-top: 0px;
5807    display: none;
5808}
5809    footer{display: none;}   
5810    
5811html, body.dark-mode {
5812    background: #0a0a0a !important;
5813}    
5814*/
5815#signup-new-process #step07 .step-inside-row,
5816#signup-new-process #step09 .step-inside-row {
5817    width: 100%;
5818}
5819
5820#signup-new-process form#signupform {
5821    margin-bottom: 5px;
5822    /*    border: 1px solid #3241585c !important;*/
5823    border: 1px solid #2a2a2a !important;
5824    background: #1a1a1a;
5825}
5826
5827/*
5828.body-container {
5829    margin-top: 0;
5830}   
5831*/
5832#signup-new-processp.login-sub-head {
5833    font-size: 12px;
5834    color: #bbbbbb;
5835}
5836
5837#signup-new-process .email-verification.mob-height.app-install {
5838    color: #d4d4d4 !important;
5839    margin-bottom: 5px;
5840    /*    border: 1px solid #3241585c !important;*/
5841    /*    border: 1px solid #3241585c !important;*/
5842    border: 1px solid #2a2a2a !important;
5843    background: #1a1a1a;
5844    padding: 30px 30px;
5845    border-radius: 25px;
5846}
5847
5848#signup-new-process .add-profile-photo {
5849    border: 1px solid #3241585c;
5850    border-radius: 22px;
5851    padding: 10px;
5852    margin-bottom: 15px;
5853}
5854
5855#signup-new-process .user-profil-detail-box {
5856    display: flex;
5857    align-items: start;
5858}
5859
5860#signup-new-process .users-profie {
5861    display: flex;
5862    justify-content: space-between;
5863    align-items: center;
5864    margin-bottom: 20px;
5865}
5866
5867#signup-new-process .follow-unfollow a {
5868    border: 1px solid #324158;
5869    color: #111222;
5870    padding: 8px 11px;
5871    border-radius: 35px;
5872    background: #fff;
5873    font-size: 12px;
5874    font-weight: 900;
5875}
5876
5877#signup-new-process .user-profil-detail-box .user-count {
5878    font-size: 10px;
5879}
5880
5881#signup-new-process .users-profie .user-profil-detail-box .user {
5882    margin-right: 7px;
5883    font-size: 15px;
5884    font-weight: 600;
5885    color: #fff;
5886}
5887
5888#signup-new-process .user-profil-detail-box .user-count img+img {
5889    margin-left: -5px;
5890}
5891
5892#signup-new-process .user-profil-detail-box .user-count img {
5893    width: 20px;
5894    height: 20px;
5895    border: 1px solid #000;
5896    border-radius: 50%;
5897}
5898
5899#signup-new-process .user-profil-detail-box .user-count {
5900    display: flex;
5901}
5902
5903#signup-new-process .form-box {
5904    max-width: 450px;
5905    margin: 0 auto;
5906}
5907
5908#signup-new-process button.Share-jumpspree {
5909    background: none;
5910    border: 1px solid #3241585c;
5911    width: 100%;
5912    border-radius: 20px;
5913    color: #fff;
5914    padding: 10px 0;
5915    margin-bottom: 25px;
5916    font-size: 14px;
5917    font-weight: 400;
5918}
5919
5920#signup-new-process button.Share-jumpspree img {
5921    width: 17px;
5922    margin-right: 5px;
5923}
5924
5925#signup-new-process .email-verification {
5926    height: auto;
5927}
5928
5929#signup-new-process .logo-signup,
5930#verifyreset-new-process .logo-signup,
5931#enter-new-password .logo-signup {
5932    margin-bottom: 20px;
5933}
5934
5935#signup-new-process .pick-intrest-buttons {
5936    display: flex;
5937    flex-wrap: wrap;
5938    gap: 12px;
5939}
5940
5941#signup-new-process .pick-intrest-buttons button {
5942    background: transparent;
5943    color: #fff;
5944    font-size: 12px;
5945    border: 1px solid #3241585c;
5946    padding: 8px 14px;
5947    border-radius: 25px;
5948}
5949
5950#signup-new-process .prifile-image img {
5951    width: 100%;
5952    opacity: 0.7;
5953}
5954
5955#signup-new-process .prifile-image {
5956    width: 60px;
5957}
5958
5959#signup-new-process button.add-profile {
5960    background: none;
5961    border: 1px solid #3241585c;
5962    color: #555;
5963    font-size: 12px;
5964    border-radius: 25px;
5965}
5966
5967#signup-new-process button.add-profile img {
5968    width: 17px !important;
5969}
5970
5971#signup-new-process button.add-profile {
5972    background: none;
5973    border: 1px solid #3241585c;
5974    color: #555;
5975    font-size: 12px;
5976    border-radius: 25px;
5977    padding: 5px 9px;
5978    margin-left: 10px;
5979    margin-right: 13px;
5980}
5981
5982#signup-new-process p.mb-0.optional {
5983    color: #555;
5984    font-size: 12px;
5985}
5986
5987#signup-new-process .add-profile-photo {
5988    border: 1px solid #3241585c;
5989    border-radius: 22px;
5990    padding: 10px;
5991    margin-bottom: 15px;
5992    background: #1e1e1e5c;
5993}
5994
5995#signup-new-process .search-user-name input {
5996    background: none !important;
5997    border: 1px solid #3241585c !important;
5998}
5999
6000#signup-new-process .search-user-name input {
6001    background: none !important;
6002    */ border: 1px solid #3241585c !important;
6003    border-radius: 16px;
6004    background: #1e1e1e5c !important;
6005}
6006
6007#signup-new-process .see-guidline a {
6008    font-size: 12px;
6009    color: #555;
6010    text-decoration: underline;
6011}
6012
6013#signup-new-process .see-guidline {
6014    text-align: right;
6015}
6016
6017#signup-new-process .verify-email-input,
6018#verifyreset-new-process .verify-email-input,
6019#enter-new-password .verify-email-input {
6020    width: 100%;
6021}
6022
6023#signup-new-process .verify-email-input input {
6024    background: none !important;
6025    border-radius: 12px !important;
6026}
6027
6028#signup-new-process .verify-email-input,
6029#verifyreset-new-process .verify-email-input,
6030#enter-new-password .verify-email-input {
6031    width: 100%;
6032    margin-bottom: 25px;
6033}
6034
6035#signup-new-process .verify-email-input {
6036    margin-bottom: 15px;
6037
6038}
6039
6040#signup-new-process .color555 {
6041    color: #fff !important;
6042    font-size: 12px;
6043}
6044
6045#signup-new-process .color555 {
6046    color: #555 !important;
6047    font-size: 12px;
6048    font-weight: 400;
6049    line-height: 16px;
6050}
6051
6052#signup-new-process .or-change a {
6053    border: none !important;
6054    padding: 0 !important;
6055    color: #bbb;
6056    font-size: 13px;
6057}
6058
6059#signup-new-process .or-change {
6060    margin-top: 20px;
6061}
6062
6063#signup-new-process .or-change.sign-in-instead+button {
6064    margin-top: 20px !important;
6065}
6066
6067#signup-new-process .or-change.sign-in-instead {
6068    margin-top: 30px;
6069}
6070
6071#signup-new-process .btn.btn-success.mt-4.white-btn.disabled {
6072    background: #333333 !important;
6073}
6074
6075#signup-new-process .arrow-right,
6076#verifyreset-new-process .arrow-right,
6077#enter-new-password .arrow-right {
6078    width: 25px
6079}
6080
6081#signup-new-process .btn.btn-success.mt-4.white-btn.disabled {
6082    background: #333333 !important;
6083    color: #808080;
6084    font-size: 14px;
6085    font-weight: 600;
6086    margin-top: 10px !important;
6087}
6088
6089#signup-new-process .skip-and-finish+button {
6090    margin-top: 20px !important;
6091}
6092
6093#signup-new-process .skip-and-finish a {
6094    color: #bbbbbb;
6095    text-align: center;
6096    display: block;
6097    font-size: 12px;
6098}
6099
6100#signup-new-process .skip-and-finish a {
6101    color: #bbbbbb;
6102    text-align: center;
6103    display: block;
6104    font-size: 12px;
6105}
6106
6107#signup-new-process .header-wrapper+.container {
6108    margin-bottom: 0
6109}
6110
6111#signup-new-process form#signupform {
6112    border-radius: 25px;
6113}
6114
6115#signup-new-process .form-control {
6116    background-color: transparent !important;
6117    /*    border: 1px solid #3241585c !important;*/
6118    border: 1px solid #333 !important;
6119    color: #d4d4d4 !important;
6120    border-radius: 15px !important;
6121
6122}
6123
6124#signup-new-process .password-icon input {
6125    padding-left: 35px;
6126}
6127
6128#signup-new-process .password-icon i {
6129    position: absolute;
6130    top: 9px;
6131    left: 11px;
6132}
6133
6134#signup-new-process .or-change a:hover {
6135    background: none;
6136}
6137
6138#signup-new-process span.field_icon.toggle-password {
6139    font-size: 12px;
6140}
6141
6142#signup-new-process .disabled {
6143    pointer-events: all !important;
6144}
6145
6146#signup-new-process div#lottie-animation,
6147div#lottie-animation2 {
6148    margin: 0 auto
6149}
6150
6151#signup-new-process div#step07 {
6152    text-align: center;
6153    color: #fff;
6154}
6155
6156#signup-new-process .all-set,
6157#signup-new-process .setup-account {
6158    margin: 0 auto;
6159    margin-top: -40px;
6160
6161}
6162
6163#signup-new-process .all-set h3,
6164#signup-new-process .setup-account h3 {
6165    font-size: 18px;
6166    margin-top: -20px;
6167    color: #fff;
6168}
6169
6170#signup-new-process .textfor-copy {
6171    font-size: 12px;
6172    border: 1px solid #3241585c;
6173    border-radius: 20px;
6174    padding: 20px;
6175    position: relative;
6176}
6177
6178#signup-new-process .textfor-copy .copy-link {
6179    position: absolute;
6180    right: 15px;
6181    bottom: 20px;
6182    background: none;
6183    padding: 0;
6184}
6185
6186#signup-new-process .textfor-copy .copy-link img {
6187    width: 19px;
6188}
6189
6190#signup-new-process .dob,
6191#signup-new-process .user-name,
6192#signup-new-process .mail-icon,
6193#signup-new-process .password-icon {
6194    position: relative
6195}
6196
6197#signup-new-process .user-name input,
6198#signup-new-process .mail-icon input,
6199#signup-new-process .dob input {
6200    padding-left: 36px;
6201}
6202
6203
6204
6205#signup-new-process .password-icon img {
6206    width: 20px;
6207    position: absolute;
6208    top: 50%;
6209    left: 10px;
6210    transform: translateY(-50%);
6211}
6212
6213#signup-new-process .note {
6214    background: none;
6215    padding: 0;
6216    display: block;
6217    margin: 0;
6218}
6219
6220#signup-new-process .note p {
6221    color: #808080 !important;
6222    font-size: 12px;
6223    font-weight: 400;
6224}
6225
6226#signup-new-process .user-name img,
6227#signup-new-process .mail-icon img,
6228#signup-new-process .dob img {
6229    position: absolute;
6230    z-index: 9999;
6231    width: 20px;
6232    position: absolute;
6233    top: 50%;
6234    left: 10px;
6235    transform: translateY(-50%);
6236}
6237
6238#signup-new-process .helper-text {
6239    font-size: 12px !important;
6240    color: #bbbbbb;
6241    margin-bottom: 15px;
6242}
6243
6244#signup-new-process .pick-intrest-buttons button:hover {
6245    background: #2222227a;
6246    border-color: #ffffff4a;
6247}
6248
6249#signup-new-process button.btn.btn-success {
6250    border-radius: 12px;
6251}
6252
6253#signup-new-process .follow-unfollow a:hover {
6254    background: #2222227a;
6255    border-color: #ffffff4a;
6256}
6257
6258#signup-new-process .share-post-feed {
6259    border: 1px solid #3241585c;
6260    border-radius: 25px;
6261    padding: 20px;
6262    margin-top: 20px;
6263    background: #1f1e1e;
6264}
6265
6266#signup-new-process .share-post-feed .text p {
6267    color: #fff;
6268    font-size: 14px;
6269}
6270
6271#signup-new-process .share-post-feed .text {
6272    margin-top: 20px;
6273}
6274
6275#signup-new-process .share-post-feed .user-name {
6276    font-weight: 800;
6277    color: #fff;
6278    font-size: 14px;
6279    margin-bottom: 0;
6280}
6281
6282#signup-new-process .share-post-feed .first-post {
6283    font-size: 12px;
6284    font-weight: 600;
6285    margin-bottom: 3px;
6286    color: #696969 !important;
6287}
6288
6289#signup-new-process .share-post-feed .first-post img {
6290    width: 15px;
6291}
6292
6293#signup-new-process .share-post-feed .fig {
6294    width: 40px;
6295    margin-right: 10px;
6296}
6297
6298#signup-new-process .share-post-feed {
6299    border: 1px solid #3241585c;
6300    border-radius: 25px 25px 0 0;
6301    padding: 20px;
6302    margin-top: 20px;
6303}
6304
6305#signup-new-process .share-post {
6306    justify-content: flex-end;
6307    display: flex;
6308    padding-top: 20px;
6309    border: 1px solid #3241585c;
6310    border-top: none;
6311    padding: 20px;
6312    border-radius: 0 0 25px 25px;
6313    background: #1f1e1e;
6314    gap: 15px;
6315}
6316
6317#signup-new-process #step08 .fig img {
6318    width: 100%;
6319    background: #1f1e1e;
6320}
6321
6322#signup-new-process .share-post a.btn.white-btn {
6323    background: #fff;
6324    border-radius: 35px;
6325}
6326
6327#signup-new-process .share-post a {
6328    color: #fff;
6329    font-size: 14px;
6330}
6331
6332#signup-new-process .share-post a.btn.white-btn {
6333    background: #fff;
6334    border-radius: 35px;
6335    color: #000;
6336}
6337
6338#signup-new-process .user-profil-detail-box .user-count img:last-child {
6339    margin-right: 5px;
6340}
6341
6342#signup-new-process #step08 form#signupform {
6343    padding: 40px 30px;
6344    min-height: 530px;
6345}
6346
6347#signup-new-process #step09 h3 {
6348    text-align: center;
6349    font-weight: 800;
6350    font-size: 27px;
6351    margin: 16px 0;
6352    transform: translateY(-20px);
6353    opacity: 0;
6354    transition: all 1s ease 0.5s;
6355}
6356
6357#signup-new-process #step09 p {
6358    text-align: center;
6359    color: #bbbbbb;
6360    margin-bottom: 0;
6361    font-size: 13px;
6362    transform: translateY(-20px);
6363    opacity: 0;
6364    transition: all 1s ease 1.0s;
6365}
6366
6367#signup-new-process .share-post a:first-child:hover {
6368    color: #fff;
6369}
6370
6371#signup-new-process .share-post a {
6372    box-shadow: none !important;
6373    background: none;
6374    border: none;
6375    padding: 10px 25px;
6376    font-weight: 400;
6377}
6378
6379#signup-new-process #step09.show-anim h3 {
6380    transform: translateY(0px);
6381    opacity: 1;
6382}
6383
6384#signup-new-process #step09.show-anim p {
6385    transform: translateY(0px);
6386    opacity: 1;
6387}
6388
6389#signup-new-process #step09 .email-verification .all-set {
6390    margin-top: 0;
6391}
6392
6393#signup-new-process .signup-footer .arrow-right {
6394    width: 25px;
6395    position: relative;
6396    top: -1px;
6397}
6398
6399#signup-new-process div#lottie-animation3 {
6400    text-align: center;
6401    margin: 0 auto;
6402}
6403
6404#signup-new-process #step09 .email-verification {
6405    display: flex;
6406    align-items: center;
6407    justify-content: center;
6408}
6409
6410#signup-new-process div#step08 p {
6411    font-family: "Inter";
6412    color: #bbb;
6413}
6414
6415#signup-new-process div#step05 .users-profie p {
6416    color: #bbb;
6417    font-size: 10px;
6418}
6419
6420#signup-new-process .app-install.email-verification h1 {
6421    margin-bottom: 0px !important;
6422    font-size: 20px;
6423}
6424
6425#signup-new-process #step04 .trending h3 {
6426    font-size: 15px;
6427    font-weight: 600;
6428    color: #fff;
6429}
6430
6431#signup-new-process #step04 h1 span {
6432    background: #00ffb5;
6433    color: #000;
6434    font-size: 11px;
6435    font-weight: 600;
6436    border-radius: 35px;
6437    padding: 3px 6px;
6438    margin-left: 4px;
6439}
6440
6441#signup-new-process #step04 h1 span {
6442    background: #00ffb5;
6443    color: #000;
6444    font-size: 10px;
6445    font-weight: 600;
6446    border-radius: 35px;
6447    padding: 3px 6px;
6448    margin-left: 9px;
6449    height: 20px;
6450    line-height: 15px;
6451}
6452
6453#signup-new-process #step04 textarea {
6454    height: 100px;
6455    width: 100%;
6456    resize: none;
6457    background: none;
6458    background: #1e1e1e;
6459    border-radius: 15px 15px 0 0;
6460    padding: 14px;
6461    font-size: 12px;
6462    border: 1px solid #3241585c;
6463    padding: 15px;
6464}
6465
6466#signup-new-process #step04 .share-text h5 {
6467    font-size: 15px;
6468    font-weight: 600;
6469    color: #fff;
6470    margin-bottom: 10px;
6471}
6472
6473#signup-new-process #step04 h2 {
6474    margin-bottom: 0 !important;
6475    padding-bottom: 0;
6476}
6477
6478#signup-new-process #step04 .share-text {
6479    margin-top: 20px;
6480}
6481
6482#signup-new-process #step04 .email-verification.mob-height.app-install {
6483    padding-bottom: 120px;
6484}
6485
6486#signup-new-process #step04 .resend.text-center a {
6487    font-size: 12px;
6488    padding: 12px 0;
6489    display: block;
6490}
6491
6492#signup-new-process #step04 .verify-btn {
6493    bottom: 0px;
6494}
6495
6496#signup-new-process .email-verification.mob-height.app-install,
6497#verifyreset-new-process .email-verification.mob-height.app-install,
6498#enter-new-password .email-verification.mob-height.app-install {
6499    margin-bottom: 45px;
6500}
6501
6502#signup-new-process #step04 .share-text {
6503    position: relative
6504}
6505
6506#signup-new-process #step04 .share-text button.btn.btn-save {
6507    background: #fff;
6508    padding: 0;
6509    font-weight: 600;
6510    border-radius: 20px;
6511    padding: 3px 10px;
6512    font-size: 12px;
6513    /*    position: absolute;*/
6514    right: 12px;
6515    bottom: 14px;
6516}
6517
6518#signup-new-process #step04 textarea {
6519    height: 70px;
6520    width: 100%;
6521    resize: none;
6522    background: none;
6523    background: #1e1e1e;
6524    border-radius: 9px 9px 0 0;
6525    padding: 8px;
6526    font-size: 12px;
6527    border: 1px solid #3241585c;
6528    color: #fff;
6529    outline: none;
6530    float: left;
6531    border-bottom: none !important;
6532}
6533
6534#signup-new-process .save-input {
6535    background: #1e1e1e;
6536    text-align: right;
6537    padding: 6px;
6538    float: left;
6539    width: 100%;
6540    border: 1px solid #3241585c;
6541    border-radius: 0 0 15px 15px;
6542    border-top: 1px solid #1e1e1e !important;
6543}
6544
6545#signup-new-process .save-input {
6546    background: #1e1e1e;
6547    text-align: right;
6548    padding: 6px;
6549    float: left;
6550    width: 100%;
6551    border: 1px solid #3241585c;
6552    border-radius: 0 0 15px 15px;
6553}
6554
6555#signup-new-process .pick-intrest-buttons button.active {
6556    background: #fff;
6557    color: #000 !important;
6558    font-weight: 500 !important;
6559    padding: 8px 13px;
6560}
6561
6562#signup-new-process .pick-intrest-buttons button:hover {
6563    box-shadow: none !important;
6564    color: #fff;
6565}
6566
6567#signup-new-process #step04 h1.d-flex.align-items-center {
6568    margin-bottom: 15px !important;
6569}
6570
6571#signup-new-processn #step04 .trending {
6572    margin-top: 40px;
6573    margin-bottom: 40px;
6574}
6575
6576#signup-new-processn #step04 .share-text h5 {
6577    font-size: 15px;
6578    font-weight: 600;
6579    margin-bottom: 15px;
6580}
6581
6582#signup-new-processn #step04 .trending h3,
6583#step04 .trending h5 {
6584    font-size: 15px;
6585    font-weight: 600;
6586    margin-bottom: 15px;
6587}
6588
6589#signup-new-process .signup-title {
6590    font-size: 20px !important;
6591    color: #fff !important;
6592    margin-bottom: 0px !important;
6593    font-weight: 600;
6594}
6595
6596#step03 p.login-sub-head.helper-text {
6597    margin-bottom: 15px;
6598}
6599
6600#signup-new-process .form-box h2.signup-title,
6601#signin-new-process .form-box h2.signup-title,
6602#reset-new-process .form-box h2.signup-title,
6603#verifyreset-new-process .form-box h2.signup-title,
6604#enter-new-password .form-box h2.signup-title {
6605    /* font-size: 20px !important;
6606    color: #fff !important;
6607    margin-bottom: 10px !important;
6608    font-weight: 500;*/
6609
6610    font-size: 35px !important;
6611    color: #fff !important;
6612    margin-bottom: 30px !important;
6613    font-weight: 600;
6614    margin-top: 30px;
6615}
6616
6617#signin-new-process .form-box h2.signup-title {
6618    font-weight: 800;
6619}
6620
6621#signup-new-process #step02 .form-box h2.signup-title {
6622    margin-top: 0;
6623    margin-bottom: 10px !important;
6624}
6625
6626#signup-new-process .verify-email-input img,
6627#verifyreset-new-process .verify-email-input img,
6628#enter-new-password .verify-email-input img {
6629    width: 20px;
6630    position: absolute;
6631    left: 8px;
6632    top: 10px;
6633}
6634
6635#step03 h2.signup-title {
6636    margin-bottom: 0 !important;
6637}
6638
6639#signup-new-process .verify-email-input,
6640#verifyreset-new-process .verify-email-input,
6641#enter-new-password .verify-email-input {
6642    position: relative;
6643}
6644
6645#signup-new-process .verify-email-input input#otp1,
6646#verifyreset-new-process .verify-email-input input#otp1,
6647#enter-new-password .verify-email-input input#otp1 {
6648    padding-left: 35px;
6649    width: 100% !important;
6650    font-size: 14px;
6651}
6652
6653#signup-new-process .verify-email-input input#otp1 {
6654    padding-left: 15px;
6655}
6656
6657#signup-new-process #step01 button#submitbtn {
6658    margin-top: 15px !important;
6659}
6660
6661#signup-new-process #signup-new-process .follow-unfollow a:hover {
6662    background: #ccc;
6663}
6664
6665.avatar-upload {
6666    position: relative;
6667    /*  max-width: 205px;*/
6668    /*  margin: 50px auto;*/
6669}
6670
6671.avatar-upload .avatar-edit {
6672    position: absolute;
6673    right: 12px;
6674    z-index: 1;
6675    top: 10px;
6676}
6677
6678.avatar-upload .avatar-edit input {
6679    display: none;
6680}
6681
6682.avatar-upload .avatar-edit input+label {
6683    display: inline-block;
6684    width: 34px;
6685    height: 34px;
6686    margin-bottom: 0;
6687    border-radius: 100%;
6688    background: #FFFFFF;
6689    border: 1px solid transparent;
6690    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
6691    cursor: pointer;
6692    font-weight: normal;
6693    transition: all 0.2s ease-in-out;
6694}
6695
6696.avatar-upload .avatar-edit input+label:hover {
6697    background: #f1f1f1;
6698    border-color: #d6d6d6;
6699}
6700
6701.avatar-upload .avatar-edit input+label:after {
6702    content: "\f040";
6703    font-family: 'FontAwesome';
6704    color: #757575;
6705    position: absolute;
6706    top: 10px;
6707    left: 0;
6708    right: 0;
6709    text-align: center;
6710    margin: auto;
6711}
6712
6713.avatar-upload .avatar-preview {
6714    width: 70px;
6715    height: 70px;
6716    position: relative;
6717    border-radius: 100%;
6718    /*  border: 6px solid #F8F8F8;*/
6719    /*  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);*/
6720}
6721
6722.add-file {
6723    position: relative;
6724    overflow: hidden;
6725}
6726
6727.avatar-edit {
6728    position: absolute;
6729    top: 0;
6730    left: 13px;
6731    width: 140px;
6732    height: 30px;
6733    opacity: 0;
6734
6735}
6736
6737.avatar-upload .avatar-preview>div {
6738    width: 100%;
6739    height: 100%;
6740    border-radius: 100%;
6741    background-size: cover;
6742    background-repeat: no-repeat;
6743    background-position: center;
6744}
6745
6746.avatar-edit input {
6747    font-size: 0;
6748    cursor: pointer;
6749    opacity: 1;
6750    width: 100%;
6751    height: 100%;
6752    top: 0;
6753    float: left;
6754}
6755
6756@media screen and (min-width:768px) {
6757    #signup-new-process .user-name input {
6758        background: #333 !important
6759    }
6760
6761    #signup-new-process .form-control {
6762        background-color: #333 !important;
6763    }
6764
6765    #signup-new-process .textfor-copy {
6766        font-size: 13px;
6767    }
6768
6769    #signup-new-process .note p,
6770    #signup-new-process .note a {
6771        font-size: 12px;
6772    }
6773
6774    #signup-new-process .note p {
6775        line-height: 16px;
6776    }
6777
6778    #signup-new-process #step07 .email-verification.mob-height.app-install {
6779        align-items: center;
6780        justify-content: center;
6781    }
6782
6783    #signup-new-process .email-verification.mob-height,
6784    #verifyreset-new-process .email-verification.mob-height,
6785    #enter-new-password .email-verification.mob-height {
6786        min-height: 530px;
6787        justify-content: flex-start;
6788    }
6789
6790    #signup-new-process .email-verification.mob-height.long-height {
6791        min-height: 700px;
6792    }
6793
6794    #signup-new-process .verify-btn,
6795    #verifyreset-new-process .verify-btn,
6796    #enter-new-password .verify-btn {
6797        position: absolute;
6798        bottom: 30px;
6799        left: 50%;
6800        width: 90%;
6801        transform: translateX(-50%);
6802    }
6803
6804    #signup-new-process #step03 .verify-btn,
6805    #signup-new-process #step04 .verify-btn,
6806    #signup-new-process #step05 .verify-btn {
6807        position: absolute;
6808        bottom: 30px;
6809        left: 50%;
6810        width: 90%;
6811        transform: translateX(-50%);
6812        position: sticky;
6813        bottom: 0;
6814        left: inherit;
6815        transform: inherit;
6816        width: 100%;
6817        padding: 16px 0;
6818        /*        background: #171717;*/
6819        background: #1a1a1a;
6820    }
6821    body.light-mode #signup-new-process #step03 .verify-btn,
6822    body.light-mode #signup-new-process #step04 .verify-btn,
6823    body.light-mode #signup-new-process #step05 .verify-btn {
6824       
6825        background: #fff;
6826    }
6827
6828    #signup-new-process #step04 .helper-text {
6829        line-height: 17px;
6830        margin-top: 5px;
6831        padding-bottom: 10px;
6832    }
6833
6834    #signup-new-process #step03 .verify-btn button {
6835        margin-top: 0 !important
6836    }
6837
6838    #signup-new-process #step04 .verify-btn button {
6839        margin-top: 0 !important
6840    }
6841
6842    #signup-new-process #step03 .share-text h5 {
6843        margin-top: 15px;
6844        font-size: 15px;
6845        color: #d4d4d4;
6846        margin-bottom: 10px;
6847    }
6848
6849    #signup-new-process .email-verification {
6850        margin-top: 0;
6851    }
6852
6853    #signup-new-process #step04 .email-verification.mob-height.app-install {
6854        padding-bottom: 0;
6855    }
6856
6857    #signup-new-process #step03 .form-box h2.signup-title,
6858    #signup-new-process #step04 .form-box h2.signup-title,
6859    #signup-new-process #step05 .form-box h2.signup-title,
6860    #signup-new-process #step06 .form-box h2.signup-title,
6861    #signup-new-process #step02 .form-box h2.signup-title {
6862        font-size: 20px !important;
6863        margin-bottom: 0px !important;
6864        margin-top: 0;
6865    }
6866
6867    #signup-new-process #step03 p.login-sub-head.helper-text,
6868    #signup-new-process #step06 p.login-sub-head.helper-text {
6869        line-height: 16px;
6870    }
6871
6872}
6873
6874@media screen and (max-width:767px) {
6875#gifModalForAddPost div#gifResults-outer {
6876    height: calc(100vh - 73px);
6877        overflow-y: auto;
6878        margin-top: 10px;
6879}    
6880    .notification-alert.show-notification {
6881        bottom: 62px;
6882    }
6883
6884    #signup-new-process #step05 .email-verification h2,
6885    .email-verification h2 {
6886        line-height: 23px;
6887    }
6888
6889    #signup-new-process #step04 .share-text.add-your-own {
6890        margin-top: 40px;
6891    }
6892
6893    #signup-new-process #step04 .trending+.share-text {
6894        margin-top: 25px;
6895    }
6896
6897    #signup-new-process #step05 .form-box {
6898        margin: 0 !important;
6899        height: 100vh;
6900    }
6901
6902    #signup-new-process .step-inside-row {
6903        padding: 0 25px;
6904    }
6905
6906    #signup-new-process #step04 .verify-btn.mb-0.w100 {
6907        position: sticky;
6908        bottom: 0px;
6909        background: #000;
6910    }
6911
6912    #signup-new-process div#lottie-animation,
6913    div#lottie-animation2 {
6914        margin: 0 auto;
6915        margin-top: -100px;
6916    }
6917
6918    #signup-new-process #step05 .fig {
6919        width: 35px;
6920        margin-right: 9px;
6921        height: 35px;
6922    }
6923
6924    #signup-new-process .verify-email-input img {
6925        width: 20px;
6926        position: absolute;
6927        left: 8px;
6928        top: 10px;
6929    }
6930
6931    #signup-new-process .verify-email-input {
6932        position: relative;
6933    }
6934
6935    #signup-new-process .verify-email-input input#otp1,
6936    #verifyreset-new-process .verify-email-input input#otp1,
6937    #enter-new-password .verify-email-input input#otp1 {
6938        padding-left: 35px;
6939    }
6940
6941    #signup-new-process .signup-title {
6942        font-size: 16px !important;
6943    }
6944
6945    #signup-new-process .share-post-feed .fig {
6946        width: 35px;
6947        margin-right: 15px;
6948    }
6949
6950    #signup-new-process .share-post {
6951        padding: 15px;
6952    }
6953
6954    #signup-new-process .share-post-feed .user-name {
6955        font-weight: 800;
6956        color: #fff;
6957        font-size: 12px;
6958        margin-bottom: 0;
6959    }
6960
6961    #signup-new-process #step05 .fig img {
6962        width: 100%;
6963        height: 100%;
6964        object-fit: cover
6965    }
6966
6967    #signup-new-process .all-set,
6968    .setup-account {
6969        margin: 0 auto;
6970        margin-top: 0px;
6971
6972    }
6973
6974    #signup-new-process #step01 .signup-footer .or-change.sign-in-instead+button {
6975        margin-top: 13px !important;
6976    }
6977
6978    #signup-new-process #step04 .email-box {
6979        margin-bottom: 40px;
6980    }
6981
6982    /*
6983html, body {
6984    height: 100vh;
6985}
6986*/
6987    /*
6988.body-container {
6989    display: none;
6990}     
6991*/
6992    #signup-new-process .container,
6993    #signup-new-process .signup-wrapper,
6994    #signup-new-process .form-box,
6995    #signup-new-process #signupform {
6996        height: 100%;
6997    }
6998
6999    #signup-new-process form#signupform {
7000        border: none !important;
7001        padding: 20px 0px !important;
7002        height: 100vh;
7003    }
7004
7005    #signup-new-process .email-verification.mob-height.app-install {
7006        border: none !important;
7007        padding: 0;
7008        border-radius: 0px;
7009        height: auto
7010    }
7011
7012    #signup-new-process .users-profie .user-profil-detail-box .fig {
7013        width: 30px;
7014        margin-right: 9px;
7015        height: 30px;
7016    }
7017
7018    #signup-new-process .users-profie .user-profil-detail-box.fig img {
7019        width: 100%;
7020        height: 100%;
7021        object-fit: cover;
7022    }
7023
7024    #signup-new-process .users-profie .user-profil-detail-box .user {
7025        margin-right: 7px;
7026        font-size: 12px;
7027
7028    }
7029
7030    #signup-new-process .follow-unfollow a {
7031        padding: 7px 9px;
7032        font-size: 10px;
7033    }
7034
7035    #signup-new-process .user-profil-detail-box .user-count img:last-child {
7036        margin-right: 5px;
7037    }
7038
7039    #signup-new-process .user-profil-detail-box .user-count {
7040        font-size: 10px;
7041        align-items: center;
7042    }
7043
7044    #signup-new-process .user-profil-detail-box .user-count img {
7045        width: 18px;
7046        height: 18px;
7047        border: 1px solid #000;
7048    }
7049
7050    #signup-new-process .signup-footer {
7051        position: fixed;
7052        bottom: 20px;
7053        left: 0;
7054        right: 0;
7055        background: #000000;
7056    }
7057
7058    #signup-new-process .signup-footer .or-change.sign-in-instead {
7059        margin-top: 10px;
7060    }
7061
7062    #signup-new-process .form-box {
7063        margin: 0 !important;
7064    }
7065
7066    #signup-new-process .email-verification.mob-height.app-install {
7067        margin: 0;
7068        height: 100%;
7069        justify-content: flex-start;
7070        padding: 20px 0;
7071    }
7072
7073    #signup-new-process .email-box p {
7074        font-size: 10px;
7075        line-height: 16px;
7076        color: #bbb;
7077    }
7078
7079    #signup-new-process .verify-btn.mb-0.w100 {
7080        position: fixed;
7081        bottom: 10px;
7082    }
7083
7084    #signup-new-process .row.justify-content-center {
7085        height: 100%;
7086    }
7087
7088    #signup-new-process .col-md-7 {
7089        height: 100%;
7090    }
7091
7092    #signup-new-process .share-text h5 {
7093        font-size: 15px;
7094        color: #bbbbbb;
7095    }
7096
7097    #signup-new-process .pick-intrest-buttons {
7098        gap: 10px;
7099    }
7100
7101    #signup-new-process .pick-intrest-buttons button {
7102        font-size: 10px;
7103    }
7104
7105    #signup-new-process #step04 .share-text {
7106        margin-top: 20px;
7107    }
7108
7109    #signup-new-process .share-text h5 {
7110        font-size: 15px;
7111    }
7112
7113    #signup-new-process #step07 .form-box {
7114        margin: 0 !important;
7115        display: flex;
7116        align-items: center;
7117        justify-content: center;
7118    }
7119
7120    #signup-new-process #step07 .form-box .email-verification.mob-height.app-install {
7121        height: auto;
7122    }
7123
7124    #signup-new-process .all-set h3,
7125    #signup-new-process .setup-account h3 {
7126        font-size: 16px;
7127        margin-top: -30px;
7128        color: #fff;
7129    }
7130
7131    #signup-new-process .email-verification.mob-height.app-install {
7132        background: #000000;
7133    }
7134
7135    /*html, body.dark-mode {
7136    background: #000000 !important;
7137}*/
7138    #signup-new-process form#signupform {
7139        background: #000;
7140    }
7141
7142    #signup-new-process .app-install.email-verification h1 {
7143        font-weight: 800;
7144        margin-bottom: 10px !important;
7145
7146    }
7147
7148    #signup-new-process .app-install.email-verification a {
7149        color: #7d7eff;
7150    }
7151
7152    #signup-new-process .textfor-copy {
7153        font-size: 12px;
7154    }
7155
7156    #signup-new-process .helper-text {
7157        font-size: 12px !important;
7158        line-height: 17px !important;
7159    }
7160
7161    #signup-new-process .follow-unfollow a {
7162        color: #111222 !important;
7163    }
7164
7165    #signup-new-process #step03 .app-install.email-verification a {
7166        color: #555555;
7167    }
7168
7169    #signup-new-process .see-guidline {
7170        text-align: right;
7171        margin-bottom: 20px;
7172    }
7173
7174    #signup-new-process div#lottie-animation3 {
7175        text-align: center;
7176        margin: 0 auto;
7177        margin-top: -80px;
7178    }
7179
7180    #signup-new-process #step09 h3 {
7181        font-size: 23px;
7182        margin-top: 0;
7183    }
7184
7185    #signup-new-process #step09 p {
7186        font-size: 11px;
7187    }
7188
7189    #signup-new-process .form-box h1.signup-title {
7190        font-size: 18px !important;
7191        color: #fff !important;
7192        margin-bottom: 15px !important;
7193    }
7194
7195    #signup-new-process .signup-title {
7196        font-size: 18px !important;
7197    }
7198
7199    #signup-new-process .cancel-signup.hide-on-desktop a {
7200        color: #bbb;
7201        font-size: 12px;
7202    }
7203
7204    #signup-new-process .cancel-signup.hide-on-desktop {
7205        display: block;
7206        position: absolute;
7207        right: 15px;
7208        top: 22px;
7209    }
7210
7211    #signup-new-process .form-box h2.signup-title,
7212    #signin-new-process .form-box h2.signup-title,
7213    #reset-new-process .form-box h2.signup-title,
7214    #verifyreset-new-process .form-box h2.signup-title,
7215    #enter-new-password .form-box h2.signup-title {
7216        font-size: 20px !important;
7217    }
7218
7219}
7220</style>
7221
7222<div class="signup-new-process" id="signup-new-process" style="display:none">
7223    <div id="step01" class="signup-wrapper">
7224
7225
7226        <!--             <div id="lottie-animation" style="width: 300px; height: 300px;"></div>-->
7227        <!--             <div id="lottie-animation2" style="width: 300px; height: 300px;"></div>-->
7228
7229        <div class="step-inside-row">
7230
7231            <!--
7232               <div class="col-md-5"><div class="mob floating">
7233                   <img src="/public/images/app-screen-n.png" alt="Jumpspree">
7234               </div>
7235               <div class="shadow-mob">
7235<img src="https://www.jumpspree.com/public/images/shadow.png" alt="Jumpspree"></div>
7236               </div>
7237              -->
7238            <div class="step-inside-row-inner">
7239                <div class="form-box">
7240
7241                    <!--
7242                      <div class="text-center login-logo">
7243                          <img style="width: 50px;border-radius: 10px;margin-bottom: 20px;" src="https://www.jumpspree.com/public/images/J-icon.png?ver:1.03" alt="Jumpspree">
7244                      </div>
7245              -->
7246                    <!--                   <p class="signup-note">The Jumpspree platform is currently available only in the Apple App Store and Google Play Store. You can still sign up here and then sign in to the Jumpspree app to start buying, selling, and posting content.</p>-->
7247                    <form action="" name="signupform" id="signupform">
7248                        <div class="logo-signup">
7249                            <a href="https://www.jumpspree.com/social">
7250<!--
7251                                <img src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7252                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo">
7253-->
7254                                     <img src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7255                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo">
7256                            </a>
7257                        </div>
7258                        <div class="cancel-signup">
7259                            <span style="cursor:pointer"
7260                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7261                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7262                                    alt="Close" title=""></span>
7263                        </div>
7264
7265                        <h2 class="text-left mb-2 signup-title">Sign Up</h2>
7266                        <p class="login-sub-head helper-text">Takes less than a minute. We’ll never spam you. Pinky
7267                            promise.</p>
7268
7269                        <div class="form-group">
7270                            <div class="user-name">
7271                                <img src="https://www.jumpspree.com/public/images/user-iconn.png" alt="user icon"
7272                                    title="user icon">
7273                                <input type="text" class="form-control" tabindex="1" name="fullname" id="fullname"
7274                                    placeholder="Full name">
7275                            </div>
7276                            <div id="fullname_validate" class="myerror"></div>
7277                        </div>
7278
7279                        <div class="form-group">
7280                            <div class="mail-icon">
7281                                <img src="https://www.jumpspree.com/public/images/mail-iconn.png" alt="mail icon"
7282                                    title="mail icon">
7283                                <input autocomplete="off" tabindex="1" type="text" name="email" id="email"
7284                                    class="form-control" placeholder="Email">
7285                            </div>
7286                            <div id="email_validate" class="myerror"></div>
7287                        </div>
7288
7289                        <div class="form-group">
7290                            <div class="d-flex justify-content-between tooltip-top">
7291                                <div class="tooltip-wrapper" style="display:none">
7292                                    <a href="#" style="font-size: 14px; color:#c8c7c7">Requirements</a>
7293                                    <div class="tooltip2">
7294                                        <ul>
7295                                            <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg"
7296                                                    alt="Plan tick" title="Password must be at least 8 characters long">
7297                                                Password must be at least 8 characters long</li>
7298                                            <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg"
7299                                                    alt="Plan tick" title="One lowercase character"> One lowercase
7300                                                character</li>
7301                                            <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg"
7302                                                    alt="Plan tick" title="One uppercase character"> One uppercase
7303                                                character</li>
7304                                            <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg"
7305                                                    alt="Plan tick" title="One number or special character"> One number
7306                                                or special character</li>
7307                                        </ul>
7308                                    </div>
7309                                </div>
7310                            </div>
7311
7312                            <div style="position:relative">
7313                                <div class="password-icon">
7314                                    <input autocomplete="off" tabindex="2" type="password" name="password" id="password"
7315                                        class="form-control" placeholder="Password">
7316                                    <img src="https://www.jumpspree.com/public/images/pass.png" alt="Lock"
7317                                        title="Password">
7318                                </div>
7319                                <span toggle="#password-field"
7320                                    style="position: absolute;top: 50%;right: 14px;transform: translateY(-50%);cursor:pointer"
7321                                    class="field_icon toggle-password"><i class="fa-regular fa-eye"></i></span>
7322                            </div>
7323                            <div id="password_validate" class="myerror"></div>
7324                        </div>
7325
7326                        <div class="form-group">
7327                            <div class="dob">
7328                                <img src="https://www.jumpspree.com/public/images/cake.png" alt="cake" title="cake">
7329                                <input autocomplete="off2" type="text" name="dob" id="dob"
7330                                    class="form-control datepicker" placeholder="Date of Birth" readonly>
7331                            </div>
7332                            <div id="dob_validate" class="myerror"></div>
7333                        </div>
7334
7335                        <div class="note">
7336                            <p>
7337                                Just need to make sure you’re 13 or older to hang with us. It won’t be shown anywhere.
7338                                <br><br>
7339
7340                            </p>
7341                        </div>
7342
7343                        <div class="signup-footer">
7344
7345
7346                            <!-- ✅ FIXED BUTTON HERE -->
7347                            <button class="btn btn-success mt-4 white-btn disabled" type="button"
7348                                onclick="checkSignup()" name="submitbtnstep1" style="position:relative;"
7349                                id="submitbtnstep1">
7350                                Next <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Arrow"
7351                                    title="Arrow" class="arrow-right">
7352                            </button>
7353
7354                            <div id="errorregmessage" class="myerror"></div>
7355                            <div class="or-change d-flex justify-content-between sign-in-instead">
7356                                <div class="tnc"><a style="color:#808080; text-decoration:underline" target="_blank"
7357                                        href="https://www.jumpspree.com/terms-of-use">Terms</a> and
7358                                    <a target="_blank" href="https://www.jumpspree.com/privacy-policy"
7359                                        style="color:#808080; text-decoration:underline">Privacy</a>
7360                                </div>
7361
7362
7363                                <a href="javascript:void(0)"
7364                                    onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">Sign
7365                                    in instead</a>
7366                            </div>
7367                        </div>
7368
7369
7370                    </form>
7371
7372                </div>
7373            </div>
7374        </div>
7375    </div>
7376
7377    <div id="step02" class="signup-wrapper" style="display:none">
7378        <div class="step-inside-row">
7379            <div class="step-inside-row-inner">
7380                <div class="form-box">
7381                    <div class="email-verification mob-height app-install">
7382                        <div class="logo-signup">
7383                            <a href="https://www.jumpspree.com/"><img
7384                                    src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7385                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
7386                        </div>
7387                        <div class="cancel-signup">
7388                            <span style="cursor:pointer"
7389                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7390                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7391                                    alt="Close" title=""></span>
7392                        </div>
7393                        <div class="email-box">
7394                            <h2 class="signup-title">Verify your email</h2>
7395                            <p class="login-sub-head helper-text">We just sent you a code to your email. Pop
7396                                it in below so we know you're real.</p>
7397
7398                            <div class="d-flex justify-content-between">
7399                                <form method="get" class="digit-group" data-group-name="digits" data-autosubmit="false"
7400                                    autocomplete="off">
7401                                    <!--                        <div class="cross"><a href="https://www.jumpspree.com/"><img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Jumpspree"></a></div>-->
7402                                    <div class="verify-email-input"><img
7403                                            src="https://www.jumpspree.com/public/images/otp.png" loading="lazy"
7404                                            alt="OTP" title="OTP"><input style="width: 100%; text-align:left;"
7405                                            placeholder="Enter your 6-digit code here" maxlength="6" required
7406                                            class="otp-input form-control" id="otp1" /></div>
7407
7408
7409                                    <!--<input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp1">
7410                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp2">
7411                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp3">
7412                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp4">
7413                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp5">
7414                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp6">  -->
7415                                </form>
7416
7417                            </div>
7418                            <p class="login-sub-head color555">Didn’t get the code? Sometimes it can take up to 2
7419                                minutes for your code to arrive. If you still didn’t get it, you can request a new one.
7420                            </p>
7421                            <div class="resend">
7422                                <a href="#">Request a new code</a>
7423                            </div>
7424                        </div>
7425
7426                        <div class="verify-btn mb-0 w100">
7427                            <!--                            <button class="btn btn-success mt-4 white-btn disabled" onclick="$('#step02').hide();$('#step03').fadeIn();$(window).scrollTop(0);"  type="submit" name="submitbtn" style="position:relative;" id="submitbtn" >Next <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Jumpspree" class="arrow-right"></button>-->
7428                            <button class="btn btn-success mt-4 white-btn disabled" type="button" name="submitbtn"
7429                                style="position:relative;" id="submitbtn">
7430                                Next <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Arrow"
7431                                    title="Arrow" class="arrow-right">
7432                            </button>
7433                            <!--                       <div class="resend text-center"><a style="color:#fff" href="javascript:void(0)" onClick="resendVerificationCode()">Send a new code</a></div>-->
7434                        </div>
7435                        <div id="errorotpmessage" class="myerror"></div>
7436
7437
7438
7439                    </div>
7440                </div>
7441            </div>
7442        </div>
7443    </div>
7444
7445
7446    <div id="step03" class="signup-wrapper" style="display:none">
7447        <div class="step-inside-row">
7448            <div class="step-inside-row-inner">
7449                <div class="form-box">
7450                    <div class="email-verification mob-height app-install long-height">
7451                        <div class="logo-signup">
7452                            <a href="https://www.jumpspree.com/"><img
7453                                    src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7454                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
7455                        </div>
7456                        <div class="cancel-signup">
7457                            <span style="cursor:pointer"
7458                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7459                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7460                                    alt="Close" title=""></span>
7461                        </div>
7462                        <div class="email-box">
7463                            <h2 class="signup-title">Choose username + profile picture</h2>
7464                            <p class="login-sub-head helper-text">This is how the world will know you. Pick a name that
7465                                feels right, and upload a profile photo when you’re ready—you can always change it
7466                                later.</p>
7467
7468                            <div class="d-flex justify-content-start align-items-center add-profile-photo">
7469                                <!--
7470                        <div class="prifile-image">
7471                            <img src="https://www.jumpspree.com/public/images/profile-icon.png" width="30px" alt="Jumpspree">
7472                        </div>
7473-->
7474
7475                                <div class="avatar-upload">
7476
7477                                    <div class="avatar-preview">
7478                                        <div id="imagePreview"
7479                                            style="background-image: url('https://www.jumpspree.com/public/images/profile-icon.png');">
7480                                        </div>
7481                                    </div>
7482                                </div>
7483
7484                                <div class="add-file">
7485                                    <button class="add-profile"><img
7486                                            src="https://www.jumpspree.com/public/images/upload-img.png" alt="Upload"
7487                                            title="Upload" style="width:30px"> Add profile image</button>
7488                                    <div class="avatar-edit">
7489                                        <input type='file' id="imageUpload" accept=".png, .jpg, .jpeg" />
7490                                        <label for="imageUpload"></label>
7491                                    </div>
7492                                </div>
7493                                <p class="mb-0 optional">Optional</p>
7494
7495                            </div>
7496
7497                            <!-- <div class="search-user-name">
7498                           <input type="text" placeholder="@ Search your username" value="" class="form-control">
7499                       </div> -->
7500                            <div class="search-user-name">
7501                                <div class="seach-user-name-wrapper"><input maxlength="20" type="text"
7502                                        placeholder="@ Search your username" value="" class="form-control"
7503                                        id="username">
7504                                    <span class="at-sign">@</span>
7505                                </div>
7506                                <div id="errorusernameemessage" class="myerror"></div>
7507                                <div class="available-name" style="color:green; display:none;">Available <img
7508                                        src="https://www.jumpspree.com/public/images/green-check5.png" width="10"
7509                                        alt="Green Check" title="Green Check"></div>
7510                                <div class="not-available" style="color:red; display:none;">Unavailable <img
7511                                        src="https://www.jumpspree.com/public/images/cross-red.png" width="10"
7512                                        alt="Cross red" title="Cross red"></div>
7513                            </div>
7514
7515
7516
7517
7518                            <div class="see-guidline"><a href="javascript:void(0)">See guidelines</a>
7519
7520                                <div class="tooltip">
7521                                    <ul>
7522                                        <li>Username must be 3–15 characters.</li>
7523                                        <li>Special characters are not allowed.</li>
7524                                        <li>Only letters, numbers, and underscores (_) are allowed.</li>
7525                                    </ul>
7526                                </div>
7527
7528                            </div>
7529
7530                            <!--
7531                                                    <div class="resend">
7532                                                        <a href="#">Request a new code</a>
7533                                                    </div>  
7534                                                    
7535                                                    
7536                                -->
7537                            <div class="share-text">
7538                                <h5>Choosing Your Username</h5>
7539                                <p style="color:#bbb">We want you to pick a username that feels right for you! Once your
7540                                    profile is created, you’ll be able to change your username one time. After that, you
7541                                    can update it again every 30 days.</p>
7542                                <p style="color:#bbb">Just a heads-up: usernames are subject to availability and
7543                                    approval. To keep things fair for everyone, Jumpspree may transfer, reassign,
7544                                    disable, or reject usernames that infringe on someone else’s intellectual property
7545                                    rights.</p>
7546                            </div>
7547                        </div>
7548
7549                        <div class="verify-btn mb-0 w100">
7550                            <button class="btn btn-success mt-4 white-btn disabled"
7551                                onclick="$('#step03').hide();$('#step04').fadeIn();$(window).scrollTop(0);"
7552                                type="submit" name="submitbtnstep3" style="position:relative;" id="submitbtnstep3">Next
7553                                <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Form Arrow"
7554                                    title="Form Arrow" class="arrow-right"></button>
7555                            <!--                       <div class="resend text-center"><a style="color:#fff" href="javascript:void(0)" onClick="resendVerificationCode()">Send a new code</a></div>-->
7556                        </div>
7557                        <div id="errorotpmessage" class="myerror"></div>
7558
7559
7560
7561                    </div>
7562                </div>
7563            </div>
7564        </div>
7565    </div>
7566
7567    <div id="step04" class="signup-wrapper" style="display:none">
7568        <div class="scoller-step-4">
7569            <div class="inside-bar"></div>
7570        </div>
7571        <div class="step-inside-row">
7572            <div class="step-inside-row-inner">
7573                <div class="form-box">
7574                    <div class="email-verification mob-height app-install">
7575                        <div class="logo-signup">
7576                            <a href="https://www.jumpspree.com/">
7577                                <img src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7578                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo">
7579                            </a>
7580                        </div>
7581                        <div class="cancel-signup">
7582                            <span style="cursor:pointer"
7583                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7584                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7585                                    alt="Close" title=""></span>
7586                        </div>
7587                        <h2 class="d-flex align-items-center signup-title">Pick your interests <span
7588                                class="new">New</span></h2>
7589                        <p class="login-sub-head helper-text mb-0">What’s your vibe? We’ll use this to personalize your
7590                            feed. Pick 3 from the list.</p>
7591                        <div class="email-box">
7592                            <div class="trending">
7593                                <h3>Trending right now on Jumpspree</h3>
7594                                <div class="pick-intrest-buttons" id="trendingTopics"></div>
7595                            </div>
7596
7597                            <div class="share-text">
7598                                <h5>Other topics of interest</h5>
7599                                <div class="pick-intrest-buttons" id="otherTopics"></div>
7600                            </div>
7601                        </div>
7602
7603                        <div class="verify-btn mb-0 w100">
7604                            <button disabled class="btn btn-success mt-4 white-btn disabled" id="submitbtnstep4"
7605                                type="submit" style="position:relative;">
7606                                Next <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Arrow"
7607                                    title="Arrow" class="arrow-right">
7608                            </button>
7609                        </div>
7610                        <div id="errorotpmessage" class="myerror"></div>
7611                    </div>
7612                </div>
7613            </div>
7614        </div>
7615    </div>
7616
7617
7618    <div id="step05" class="signup-wrapper" style="display:none">
7619        <div class="scoller-step-5">
7620            <div class="inside-bar"></div>
7621        </div>
7622        <div class="step-inside-row">
7623            <div class="step-inside-row-inner">
7624                <div class="form-box">
7625                    <div class="email-verification mob-height app-install">
7626                        <div class="logo-signup">
7627                            <a href="https://www.jumpspree.com/"><img
7628                                    src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7629                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
7630                        </div>
7631                        <div class="cancel-signup">
7632                            <span style="cursor:pointer"
7633                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7634                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7635                                    alt="Close" title="Close"></span>
7636                        </div>
7637
7638                        <div class="email-box">
7639                            <h2 class="signup-title">Follow at least 3 people to get started</h2>
7640                            <p class="login-sub-head helper-text">Your feed is better with friends...</p>
7641                            <div id="recommendedUsersContainer"></div> <!-- ✅ inject users here -->
7642
7643                            <div class="verify-btn mb-0 w100">
7644                                <button class="btn btn-success mt-4 white-btn disabled" disabled type="submit"
7645                                    name="submitbtn" style="position:relative;" id="submitbtnstep5">
7646                                    Next <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Arrow"
7647                                        title="Arrow" class="arrow-right">
7648                                </button>
7649
7650                            </div>
7651                            <div id="errorotpmessage" class="myerror"></div>
7652                        </div>
7653
7654
7655
7656
7657                    </div>
7658                </div>
7659            </div>
7660        </div>
7661    </div>
7662
7663    <div id="step06" class="signup-wrapper" style="display:none">
7664        <div class="step-inside-row">
7665            <div class="step-inside-row-inner">
7666                <div class="form-box">
7667                    <div class="email-verification mob-height app-install">
7668                        <div class="logo-signup">
7669                            <a href="https://www.jumpspree.com/"><img
7670                                    src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7671                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
7672                        </div>
7673                        <div class="cancel-signup">
7674                            <span style="cursor:pointer"
7675                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7676                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7677                                    alt="Close" title="Close"></span>
7678                        </div>
7679                        <input type="hidden" id="hidden_username" value="username">
7680                        <div class="email-box">
7681                            <h2 class="signup-title">Finally, bring your friends with you</h2>
7682                            <p class="login-sub-head helper-text">Jumpspree is better with friends—invite your crew to
7683                                scroll, shop, post, and vibe with you on Jumpspree. Simply copy the link and message
7684                                below, and share it away!</p>
7685
7686                            <div class="textfor-copy" style="font-family:Rubik">I’m on this new app called
7687                                Jumpspree—it’s part social, part shopping, all community. It’s where people post, shop,
7688                                sell, and vibe. Come check it out and follow me:
7689
7690                                <br>
7691                                <br>
7692
7693                                <div id="copy-url-container">www.jumpspree.com/username</div>
7694                                <div class="copy-link">
7695                                    <a href="#" id="copyBtn">
7696                                        <img src="https://www.jumpspree.com/public/images/copy-link-icon.png" width="10"
7697                                            alt="Copy" title="Copy" loading="lazy">
7698                                    </a>
7699                                </div>
7700                            </div>
7701                            <div id="errorotpmessagestep6" class="success green-text"></div>
7702                        </div>
7703
7704                        <div class="verify-btn mb-0 w100 mt-50">
7705                            <!--
7706                     <div class="skip-and-finish">
7707                         <a href="#">Skip this and finish sign up</a>
7708                     </div>
7709-->
7710                            <button class="btn btn-success mt-4 white-btn"
7711                                onclick="$('#step06').hide();$('#step07').fadeIn(); animationstart()" type="submit"
7712                                name="submitbtn" style="position:relative;" id="submitbtnstep6">Finish <img
7713                                    src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Arrow"
7714                                    title="Arrow" class="arrow-right"></button>
7715                            <!--                       <div class="resend text-center"><a style="color:#fff" href="javascript:void(0)" onClick="resendVerificationCode()">Send a new code</a></div>-->
7716                        </div>
7717                        <div id="errorotpmessage" class="myerror"></div>
7718
7719
7720
7721                    </div>
7722                </div>
7723            </div>
7724        </div>
7725    </div>
7726    <div id="step07" class="signup-wrapper" style="display:none">
7727        <div class="step-inside-row">
7728            <div class="step-inside-row-inner">
7729                <div class="form-box">
7730                    <div class="email-verification mob-height app-install">
7731
7732                        <div class="setup-account">
7733                            <div id="lottie-animation" style="width: 300px; height: 300px;"></div>
7734                            <h3>Setting up your profile..</h3>
7735                        </div>
7736
7737                        <div class="all-set" style="display:none">
7738                            <div id="lottie-animation2" style="width: 300px; height: 300px;"></div>
7739                            <h3>All set! Let's jump right in.</h3>
7740                        </div>
7741
7742
7743                    </div>
7744                </div>
7745            </div>
7746        </div>
7747
7748    </div>
7749
7750    <div id="step08" class="signup-wrapper" style="display:none">
7751        <div class="step-inside-row">
7752            <div class="step-inside-row-inner">
7753                <div class="form-box">
7754
7755                    <!--
7756                      <div class="text-center login-logo">
7757                          <img style="width: 50px;border-radius: 10px;margin-bottom: 20px;" src="https://www.jumpspree.com/public/images/J-icon.png?ver:1.03" alt="Jumpspree">
7758                      </div>
7759              -->
7760                    <!--                   <p class="signup-note">The Jumpspree platform is currently available only in the Apple App Store and Google Play Store. You can still sign up here and then sign in to the Jumpspree app to start buying, selling, and posting content.</p>-->
7761                    <form action="" name="signupform" id="signupform" novalidate="novalidate">
7762                        <div class="logo-signup">
7763                            <a href="https://www.jumpspree.com/"><img
7764                                    src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7765                                    loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
7766                        </div>
7767                        <div class="cancel-signup">
7768                            <span style="cursor:pointer"
7769                                onclick="$('#signup-new-process').fadeOut('fast');$('body').removeClass('overflow-hidden');"><img
7770                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7771                                    alt="Close" title=""></span>
7772                        </div>
7773                        <div class="cross"><a href="https://www.jumpspree.com/"><img
7774                                    src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross"
7775                                    title="Cross"></a></div>
7776                        <h2 class="text-left mb-2">Share your first post! 🎉</h2>
7777                        <div class="share-post-feed">
7778                            <div class="user-profil-detail-box d-flex align-items-center">
7779                                <div id="userAvtar" class="fig"><img
7780                                        src="https://www.jumpspree.com/public/images/profile-icon.png"
7781                                        alt="Profile icon" title="Profile icon">
7782                                </div>
7783                                <div class="user">
7784                                    <!--
7785                                    <div class="first-post"><img
7786                                            src="https://www.jumpspree.com/public/images/first-post.png" alt="Jumpspree"> First
7787                                        Post</div>
7788-->
7789                                    <div id="userNewName" class="user-name">@ChrisRay</div>
7790                                </div>
7791
7792                            </div>
7793
7794                            <div class="text">
7795                                <p>Just joined Jumpspree 🎉</p>
7796                                <p>Excited to see what this new space is all about. Follow me and say hey—I'm new here
7797                                    👋</p>
7798                                <p class="mb-0"><a style="color:#5b5dff" href="#">#Jumpspree</a> <a
7799                                        style="color:#5b5dff" href="#">#JustJoined</a> <a style="color:#5b5dff"
7800                                        href="#">#NewHere</a></p>
7801                            </div>
7802                        </div>
7803
7804                        <div class="share-post">
7805                            <a href="#" class="btn" onclick="showmaybelater()">Maybe later</a>
7806                            <a href="javascript:void(0)" class="btn white-btn" id="shareFirstPostBtn"
7807                                onclick="showAnimation()">Share <img
7808                                    src="https://www.jumpspree.com/public/images/plane.png" style="width: 20px;"
7809                                    alt="Plane" title="Plane" loading="lazy"></a>
7810                        </div>
7811
7812
7813
7814
7815                    </form>
7816                </div>
7817            </div>
7818        </div>
7819
7820    </div>
7821
7822    <div id="step09" class="signup-wrapper" style="display:none">
7823        <div class="step-inside-row">
7824            <div class="step-inside-row-inner">
7825                <div class="form-box">
7826                    <div class="email-verification mob-height app-install">
7827                        <div class="all-set">
7828                            <div id="lottie-animation3" style="width: 300px; height: 300px;display:none"></div>
7829                            <h3>Welcome to Jumpspree</h3>
7830                            <p>We’re hyped to see what you bring to the spree! 🙌</p>
7831                        </div>
7832                    </div>
7833
7834                </div>
7835            </div>
7836        </div>
7837
7838    </div>
7839
7840</div>
7841
7842<div class="signin-new-process" id="signin-new-process" style="display:none">
7843    <div id="sign-in-box" class="signup-wrapper">
7844        <div class="signin-inner">
7845            <div class="form-box">
7846                <!--
7847                  <div class="text-center login-logo">
7848                      <img style="width: 50px;border-radius: 10px;margin-bottom: 20px;" src="https://www.jumpspree.com/public/images/J-icon.png?ver:1.03" alt="Jumpspree">
7849                                </div>
7850                -->
7851                <form action="" id="loginform" name="loginform">
7852                   
7853                    <div class="logo xl">
7854
7855                        <a href="https://www.jumpspree.com"><img
7856                                src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08" class=""
7857                                alt="jumpspree-logo" title="jumpspree-logo"></a>
7858
7859
7860
7861
7862
7863                    </div>
7864                            <!--                    onclick="cancelSignupProcess()"-->
7865                    <div class="cancel-signup"><span style="cursor:pointer" onclick="$('#signin-new-process').fadeOut('fast');"><img src="https://www.jumpspree.com/public/images/close-signup.png" alt="Close" title=""></span></div> 
7866                    <h2 class="text-left mb-2 signup-title signinpopup" style="margin-bottom:0;">Sign In</h2>
7867                    <!--                   <p class="login-sub-head">Get back in your account and pick up where you left off.</p>-->
7868                    <!--
7869                       <div class="form-group">
7870                           <label for="">Full Name</label>
7871                           <input type="text" class="form-control" placeholder="Matt Smith">
7872                       </div>
7873                        -->
7874                    <div class="form-group">
7875                        <div class="d-flex justify-content-between align-items-start">
7876                            <label for=""><span id="emaillabel">Email or username</span></label>
7877                            <div class="freset username" style="opacity:1"><a href="javascript:void(0)" style="visibility: hidden;" data-type="1"
7878                                    id="emailusername">Use username instead</a></div>
7879                        </div>
7880                        <div class="mail-icon">
7881                            <input type="text" autocomplete="username" class="form-control" tabindex="1"
7882                                name="loginname" id="loginname" placeholder="[email protected]">
7883                            <img src="https://www.jumpspree.com/public/images/at.png" id="emailimage" alt="at" title="at"
7884                                style="display:none; filter:invert(1) brightness(0.7); width:20px; height:20px;">
7885                        </div>
7886                        <div id="loginname_validate" class="myerror"></div>
7887                    </div>
7888                    <div class="form-group mb-1">
7889                        <div class="d-flex justify-content-between align-items-start">
7890                            <label for="">Password</label>
7891                            <div class="freset"><a href="https://www.jumpspree.com/reset-password">Reset
7892                                    Password</a></div>
7893                        </div>
7894                        <div style="position:relative">
7895                            <div class="password-icon">
7896                                <input type="password" 
7897                                    autocomplete="current-password"
7898                                    tabindex="2"
7899                                    class="form-control"
7900                                    name="loginpassword"
7901                                    id="loginpassword"
7902                                    placeholder="Enter password">
7903                            </div>
7904
7905                            <span data-target="#loginpassword"
7906                                style="position: absolute; top: 50%; right: 14px; transform: translateY(-50%); cursor: pointer;"
7907                                class="field_icon toggle-password2"><i class="fa-regular fa-eye"></i></span>
7908                        </div>
7909
7910                        <div id="loginpassword_validate" class="myerror"></div>
7911                    </div>
7912
7913
7914                    <div class="sign-in-verify">
7915                        
7916                        <button class="btn btn-success" type="submit" id="signinSubmitBtn">Sign In</button>
7917                        <!--                        <button class="btn btn-success" type="submit" onClick="window.location.href='after-logged-in.php'">Sign In</button>
7918                           -->
7919                        <div id="errormessage" class="myerror"></div>
7920                        
7921                        <div class="or-change d-flex justify-content-between">
7922                        <div class="tnc">
7923                           <a href="https://www.jumpspree.com/terms-of-use" target="_blank">Terms</a> and <a href="https://www.jumpspree.com/privacy-policy" target="_blank">Privacy</a>  
7924                        </div>   
7925                            <a class="pb-0" href="https://www.jumpspree.com/sign-up">Sign up instead</a>
7926                            <!--                       <a href="">Sign in with a social account</a>-->
7927                        </div>
7928                        <!--                       <div class="or"><span>or continue with</span></div>-->
7929                    </div>
7930
7931                    <div class="social-login" style="display:none">
7932                        <ul>
7933                            <li><a href=""><span><img
7934                                            src="https://www.jumpspree.com/public/images/google.png" alt="google" title="google"> </span></a>
7935                            </li>
7936                            <li><a href="javascript:void(0)" style="position:relative"><span><img
7937                                            style="filter:invert(1)" id="appleid-signin"
7938                                            src="https://www.jumpspree.com/public/images/apple.png" alt="apple" title="apple"><img
7939                                            style="filter:invert(1)"
7940                                            src="https://www.jumpspree.com/public/images/apple.png" alt="apple" title="apple"></span></a>
7941                            </li>
7942                            <!--<li><a href="#"><img src="https://www.jumpspree.com/public/images/fb.png" alt=""></a></li>
7943                               <li><a href="#"><img src="https://www.jumpspree.com/public/images/x.png" alt=""></a></li>-->
7944                        </ul>
7945                    </div>
7946                    <!--                       <div class="or-change">New to Jumpspree? <a href="">Sign Up</a>.</div>-->
7947
7948
7949                    <!--
7950                       <div class="sign-up-foot">
7951                           <p>Starting 01/01/25, Jumpspree will no longer support social logins. If you previously signed up using a social account, you can sign back in and create a new password for future logins by tapping on "Reset Password" in your Profile Settings.</p>
7952                                        </div>
7953                    -->
7954
7955
7956                </form>
7957                
7958
7959
7960
7961
7962
7963
7964
7965
7966
7967
7968
7969
7970                <!--
7971                   <div class="copyright-p">
7972                                        <p>Copyright © 2025 Jumpspree by Cubesnack, Inc. <br>All rights reserved.</p>
7973                                    </div>
7974                    -->
7975            </div>
7976        </div>
7977    </div>
7978    <div class="signin-new-process" id="reset-new-process" style="display:none">
7979        <div class="reset-inner signin-inner">
7980            <div class="form-box">
7981                <form action="" id="loginform" name="loginform">
7982                    <div class="rest-pass">
7983                        <div class="logo xl">
7984
7985                            <a href="https://www.jumpspree.com"><img
7986                                    src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
7987                                    loading="lazy" class="" alt="jumpspree-logo" title="jumpspree-logo"></a>
7988                        </div>
7989                        <div class="cancel-signup"><span style="cursor:pointer"
7990                                onclick="$('#reset-new-process').fadeOut();$('#sign-in-box').fadeIn();"><img
7991                                    src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
7992                                    alt="Close" title=""></span></div>
7993                        <div class="email-box">
7994                            <h2 class="text-left mb-2 signup-title">Reset Password <img style="display:none"
7995                                    src="https://www.jumpspree.com/public/images/lock-black.png" alt="Lock"
7996                                    title="Lock"></h2>
7997                            <p class="login-sub-head">Enter your @username or the email related to your Jumpspree
7998                                account and hit "Send" to receive the reset link in your email.</p>
7999                            <!--                       <p>Enter your @username or the email related to your Jumpspree account and hit "Send" to receive the reset link in your email.</p>-->
8000                            <div class="form">
8001                                <!-- Add data-type to track toggle state -->
8002                                <div class="use-user-name">
8003                                    <a href="#" class="active" data-type="1">Use username instead</a>
8004                                </div>
8005
8006
8007                                <div class="form-group">
8008                                    <!--        <label id="emaillabel">Email</label>-->
8009                                    <input type="text" class="form-control" name="forgotemail" id="forgotemail"
8010                                        placeholder="[email protected]">
8011                                    <img src="https://www.jumpspree.com/public/images/at.png" id="emailimage2" alt="at"
8012                                        title="at"
8013                                        style="filter: invert(1) brightness(0.7); width: 20px; height: 20px; display: none">
8014                                    <div id="forgotemail_validate" class="myerror"></div>
8015                                </div>
8016
8017                                <button class="btn btn-success" type="button" id="send-reset-btn">Send</button>
8018
8019                                <div id="errorforgotpassword" class="myerror"></div>
8020
8021                                <div class="or-change">
8022                                    <a class="back-to-sign-i" href="javascript:void(0)"
8023                                        onclick="$('#reset-new-process').fadeOut(); $('#sign-in-box').fadeIn();">
8024                                        Back to sign in
8025                                    </a>
8026                                </div>
8027                            </div>
8028
8029
8030                        </div>
8031
8032
8033                    </div>
8034                </form>
8035            </div>
8036        </div>
8037    </div>
8038    <div class="signin-new-process" id="verifyreset-new-process" style="display:none">
8039        <div class="reset-inner signin-inner">
8040            <div class="step-inside-row">
8041                <div class="step-inside-row-inner">
8042                    <div class="form-box">
8043                        <div class="email-verification mob-height app-install">
8044                            <div class="logo-signup">
8045                                <a href="https://www.jumpspree.com/" class="active"><img
8046                                        src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
8047                                        loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
8048                            </div>
8049                            <div class="cancel-signup"><span style="cursor:pointer"
8050                                    onclick="$('#verifyreset-new-process').hide();$('#reset-new-process').fadeIn();"><img
8051                                        src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
8052                                        alt="Close" title=""></span></div>
8053                            <div class="email-box">
8054                                <h2 class="signup-title">Verify your email</h2>
8055                                <p id="helper-text" class="login-sub-head helper-text">We just sent you a code to your
8056                                    email.
8057                                    Pop it in below so we know you're real.</p>
8058
8059                                <div class="d-flex justify-content-between">
8060                                    <form method="get" class="digit-group" data-group-name="digits"
8061                                        data-autosubmit="false" autocomplete="off">
8062                                        <!--                        <div class="cross"><a href="https://www.jumpspree.com/"><img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Jumpspree"></a></div>-->
8063                                        <div class="verify-email-input"><img
8064                                                src="https://www.jumpspree.com/public/images/otp.png" loading="lazy"
8065                                                alt="OTP" title="OTP"><input style="width: 100%; text-align:left;"
8066                                                type="number" placeholder="Enter your 6-digit code here"
8067                                                class="otp-input form-control" id="otpforreset"></div>
8068
8069
8070                                        <!--<input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp1">
8071                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp2">
8072                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp3">
8073                                        <input type="number" maxlength="1" pattern="\d" class="otp-in
8073put" id="otp4">
8074                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp5">
8075                                        <input type="number" maxlength="1" pattern="\d" class="otp-input" id="otp6">  -->
8076                                    </form>
8077
8078                                </div>
8079                                <p class="login-sub-head color555" style="line-height: 17px;">Did not get the code?
8080                                    Sometimes it can take up to 2
8081                                    minutes for your code to arrive. If you still didn’t get it, you can request a new
8082                                    one.</p>
8083                                <div class="resend">
8084                                    <a href="#">Request a new code</a>
8085                                </div>
8086                            </div>
8087
8088                            <div class="verify-btn mb-0 w100">
8089                                <!-- <button class="btn btn-success mt-4 white-btn"
8090                                    onclick="$('#verifyreset-new-process').hide();$('#enter-new-password').fadeIn('fast');"
8091                                    type="submit" name="submitbtn" style="position:relative;" id="submitbtn">Next <img
8092                                        src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Jumpspree"
8093                                        class="arrow-right"></button> -->
8094
8095                                <button class="btn btn-success mt-4 white-btn" id="verify-otp-btn">Next
8096                                    <img src="https://www.jumpspree.com/public/images/form-arrow.png" alt="Form Arrow"
8097                                        title="Form Arrow" class="arrow-right">
8098                                </button>
8099
8100                                <!--                       <div class="resend text-center"><a style="color:#fff" href="javascript:void(0)" onClick="resendVerificationCode()">Send a new code</a></div>-->
8101                            </div>
8102                            <div id="errorotpmessage" class="myerror"></div>
8103
8104
8105
8106                        </div>
8107                    </div>
8108                </div>
8109            </div>
8110        </div>
8111    </div>
8112
8113
8114    <div class="signin-new-process" id="enter-new-password" style="display:none">
8115        <div class="reset-inner signin-inner">
8116            <div class="step-inside-row">
8117                <div class="step-inside-row-inner">
8118                    <div class="form-box">
8119                        <div class="email-verification mob-height app-install">
8120                            <div class="logo-signup">
8121                                <a href="https://www.jumpspree.com/" class="active"><img
8122                                        src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.08"
8123                                        loading="lazy" width="30px" alt="jumspree logo" title="jumspree logo"></a>
8124                            </div>
8125                            <div class="cancel-signup"><span style="cursor:pointer"
8126                                    onclick="$('#enter-new-password').hide();$('#verifyreset-new-process').fadeIn();"><img
8127                                        src="https://www.jumpspree.com/public/images/close-signup.png" loading="lazy"
8128                                        alt="Close" title=""></span></div>
8129                            <div id="createpasswordbox">
8130                                <h2 class="signup-title">Reset Password</h2>
8131                                <p class="login-sub-head helper-text">Let's secure your Jumpspree account by creating a
8132                                    new password.</p>
8133                                <div class="form-group">
8134                                    <!--                                  <label for="">New Password</label>-->
8135                                    <div style="position:relative">
8136
8137                                        <input type="password" class="form-control" id="forgotnewpassword"
8138                                            name="forgotnewpassword" placeholder="New password"
8139                                            autocomplete="new-password" autocorrect="off" spellcheck="false"
8140                                            aria-autocomplete="none">
8141                                        <!-- Use only this: -->
8142                                        <span data-target="#forgotnewpassword"
8143                                            style="position: absolute; top: 50%; right: 14px; transform: translateY(-50%); cursor: pointer;"
8144                                            class="field_icon toggle-password"><i class="fa-regular fa-eye"></i></span>
8145
8146
8147
8148                                    </div>
8149                                    <div id="forgotnewpassword_validate" class="myerror"></div>
8150                                </div>
8151                                <div class="form-group mb-0">
8152                                    <!--                                  <label for="">Confirm New Password</label>-->
8153                                    <div style="position:relative">
8154                                        <input type="password" class="form-control" id="forgotconnewpassword"
8155                                            name="forgotconnewpassword" placeholder="Confirm new password">
8156                                        <span data-target="#forgotconnewpassword"
8157                                            style="position: absolute; top: 50%; right: 14px; transform: translateY(-50%); cursor: pointer;"
8158                                            class="field_icon toggle-password2"><i class="fa-regular fa-eye"></i></span>
8159
8160                                    </div>
8161                                    <div id="forgotnewpassword_validate" class="myerror" style="display:none"></div>
8162                                    <div id="forgotconnewpassword_validate" class="myerror" style="display:none"></div>
8163
8164                                </div>
8165
8166                                <div class="note">
8167                                    <p>Secure Password Guidelines:</p>
8168                                    <ul>
8169                                        <li>Must be minimum 8 characters long.</li>
8170                                        <li>Must be a mix of letters and numbers.</li>
8171                                        <li>Must have at least one uppercase letter.</li>
8172                                        <li>Must be easy for you to remember and hard for others to guess.</li>
8173                                    </ul>
8174                                    <!-- <ul>
8175                                           <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg" alt="Jumpspree"> Password must be at least 8 characters long</li>
8176                                           <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg" alt="Jumpspree"> One lowercase character</li>
8177                                           <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg" alt="Jumpspree"> One uppercase character</li>
8178                                           <li><img src="https://www.jumpspree.com/public/images/plan-tick-icon.svg" alt="Jumpspree"> One number or special character</li>
8179                                       </ul> -->
8180                                </div>
8181
8182
8183                                <button class="btn btn-success" type="submit" id="reset-password-btn">Reset
8184                                    Password</button>
8185
8186                            </div>
8187
8188
8189                            <div id="errorotpmessage" class="myerror"></div>
8190
8191
8192
8193                        </div>
8194                    </div>
8195                </div>
8196            </div>
8197        </div>
8198    </div>
8199
8200    <div class="signin-new-process" id="password-change-success" style="display:none">
8201        <div class="reset-inner">
8202            <div class="step-inside-row">
8203                <div class="step-inside-row-inner">
8204                    <div class="form-box">
8205                        <div class="email-verification mob-height app-install">
8206                            <div class="check-s">
8207                                <img src="https://www.jumpspree.com/public/images/blue-check.png" alt="Blue Check"
8208                                    title="Blue Check">
8209                            </div>
8210                            <h4>It's done✨</h4>
8211                            <p>Your changes have been saved.</p>
8212
8213                            <div class="close"><a href="javascript:void(0)"
8214                                    onclick="$('#signin-new-process').fadeOut();$('#password-change-success').hide();$('#sign-in-box').fadeIn('slow');">Close</a>
8215                            </div>
8216                        </div>
8217                    </div>
8218                </div>
8219            </div>
8220        </div>
8221    </div>
8222</div>
8223
8224
8225
8226
8227
8228
8229<!--26-06-2025-->
8230
8231<!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" rel="stylesheet">
8232<link href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" rel="stylesheet">
8233<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/css/lightbox.min.css" rel="stylesheet">
8234
8235<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
vendor: 2 bytes, line 8235
8235
8236<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.3/js/lightbox.min.js"></script>
8236 -->
8237<div id="uploadProgressContainer" style="display: none; margin-top: 10px; position: fixed;bottom: 0px;z-index: 1222;">
8238    <div style="height: 20px; background: #eee; border-radius: 10px; overflow: hidden;">
8239        <div id="uploadProgressBar"
8240            style="height: 100%; width: 0%; background: #4caf50; text-align: center; color: white; line-height: 20px;">
8241        </div>
8242    </div>
8243</div>
8244
8245
8246<div id="uploadSnackbar" class="upload-snackbar" style="display: none;">
8247    <div class="upload-progress-container">
8248        <div class="upload-progress-bar"></div>
8249    </div>
8250    <div class="upload-message">Uploading files...</div>
8251    <div class="upload-percentage">0%</div>
8252</div>
8253
8254<input type="hidden" value="" id="hashTagValue" name="hashTagValue" />
8255<div class="notification-alert" id="post-sent">
8256    <div class="alert-inner">
8257        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8258                title="Green check"> Post sent
8259        </div>
8260        <div class="right-bar"><a href="#">View</a></div>
8261    </div>
8262</div>
8263
8264<div class="notification-alert" id="post-delete">
8265    <div class="alert-inner">
8266        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8267                title="Green check"> Post deleted
8268        </div>
8269    </div>
8270</div>
8271
8272<div class="notification-alert" id="post-updated">
8273    <div class="alert-inner">
8274        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8275                title="Green check"> Post updated
8276        </div>
8277    </div>
8278</div>
8279
8280<div class="notification-alert" id="post-added-to-bookmarks">
8281    <div class="alert-inner">
8282        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8283                title="Green check"> Added to
8284            Bookmarks</div>
8285    </div>
8286</div>
8287
8288<div class="notification-alert" id="post-remove-to-bookmarks">
8289    <div class="alert-inner">
8290        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8291                title="Green check"> Removed from
8292            Bookmarks</div>
8293    </div>
8294</div>
8295<div class="notification-alert" id="post-Link-copied">
8296    <div class="alert-inner">
8297        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8298                title="Green check"> Link copied
8299        </div>
8300    </div>
8301</div>
8302<div class="notification-alert" id="post-text-copied">
8303    <div class="alert-inner">
8304        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8305                title="Green check"> Text copied
8306        </div>
8307    </div>
8308</div>
8309
8310<div class="notification-alert" id="post-under-review">
8311    <div class="alert-inner">
8312        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/notifications.png" alt="Green check"
8313                title="Green check"> Your listing
8314            is in review.</div>
8315    </div>
8316</div>
8317
8318<div class="notification-alert" id="post-followed-you">
8319    <div class="alert-inner">
8320        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/follower.png" alt="Green check"
8321                title="Green check"> {{username}}
8322            followed you.</div>
8323        <div class="right-bar"><a href="#">Follow Back</a></div>
8324    </div>
8325</div>
8326
8327<div class="notification-alert" id="post-changes-saved">
8328    <div class="alert-inner">
8329        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/green-check001.png" alt="Green check"
8330                title="Green check"> Changes
8331            saved</div>
8332    </div>
8333</div>
8334
8335<div class="notification-alert" id="post-sending">
8336    <div class="alert-inner">
8337        <div class="left-bar"><img src="https://www.jumpspree.com/public/images/loader.png" alt="Loader"
8338                title="Sending"> Sending</div>
8339    </div>
8340</div>
8341
8342
8343<div class="notification-alert " id="message-notification" style="width: auto">
8344    <!--this is general alert message added by sagar on 1jan -->
8345    <div class="alert-inner">
8346        <div class="left-bar"><img src="" id="message-notification-image" alt="blank" title="blank"><span
8347                id="message-notification-text"></span></div>
8348
8349    </div>
8350</div>
8351
8352
8353
8354<div class="social-popup" id="comment-on-post">
8355    <input type="hidden" id="post-id-hidden" value="">
8355 <!-- Hidden input for postId this will filled in JS  -->
8356
8357    <div class="add-post-inner">
8358        <div class="header-post social-add-header">
8359            <div class="header-add-post">
8360                <div class="fnc mt-0 justify-content-between mb-5 align-items-center">
8361                    <div class="d-flex">
8362                        <div class="fig">
8363                            <img id="profile-img"
8364                                src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg"
8365                                style="border-radius:50%" alt="logo" title="logo">
8366                        </div>
8367                        <div class="fnc-title">
8368                            <h4 id="user-name">Jumpspree</h4>
8369                            <p id="user-handle">@vic</p>
8370                            <p class="replying-to">Replying to <a href="#" id="reply-handle">@Tom_Holland</a></p>
8371                        </div>
8372                    </div>
8373
8374                    <div class="drop-down-blog">
8375                        <span class="discard-button" style="cursor:pointer"
8376                            onclick="$('#comment-on-post').fadeOut();">Discard</span>
8377                    </div>
8378                </div>
8379            </div>
8380
8381            <div class="post-area-inside">
8382                <textarea
8383                    oninput="this.style.height = &quot;&quot;;this.style.height = this.scrollHeight + &quot;px&quot;"
8384                    name="repostTextarea" id="repostTextarea" placeholder="What's up?"></textarea>
8385            </div>
8386
8387            <div class="post-foot add-post-foot d-flex justify-content-between">
8388                <div class="add-image">
8389                    <ul class="d-flex p-0 m-0">
8390                        <li>
8391                            <a href="#">
8392                                <input type="file" id="image-input"><i class="fa-regular fa-image"></i>
8393                            </a>
8394                        </li>
8395                        <li>
8396                            <a href="#">
8397                                <input type="file" id="video-input"><i class="fa-regular fa-video"></i>
8398                            </a>
8399                        </li>
8400                        <!-- <li>
8401                            <a id="gif-trigger" href="#">
8402                                <input type="file" id="gif-input"><i class="fa-regular fa-gif"></i>
8403                            </a>
8404                        </li> -->
8405
8406                        <li>
8407                            <a href="#" id="gif-trigger">
8408                                <i class="fa-regular fa-gif"></i>
8409                            </a>
8410                        </li>
8411
8412                    </ul>
8413                </div>
8414
8415                <div class="send-post">
8416                    <button type="button" id="submit-comment">Post</button>
8417                </div>
8418            </div>
8419        </div>
8420 
8421    </div> <!-- End of add-post-inner  -->
8422</div> <!-- End of comment-on-post  -->
8423
8424<!-- 
8425    <div class="social-popup" id="report-on-more-option">
8426        <div class="add-post-inner">
8427            <div class="popup-header">
8428                <h2>What’s happening?</h2>
8429                <div class="cross">
8430                    <a href="javascript:void(0)" onclick="$('#report-on-more-option').fadeOut('fast')">
8431                        <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Jumpspree">
8432                    </a>
8433                </div>
8434            </div>
8435        
8436            <div class="pop-inner">
8437                <textarea id="problem_text" placeholder="Please include as many details as possible so that we can get to the problem quickly. Your report will remain anonymous."></textarea>
8438            </div>
8439        
8440            <div class="report-foot d-flex justify-content-between">
8441                <div class="attach">
8442                    <img src="https://www.jumpspree.com/public/images/attach.png" alt="Jumpspree">
8443                    <input type="file" id="attachment">
8444                </div>
8445                <div class="send">
8446                    <button type="button" class="send" id="sendReport">Send</button>
8447                </div>
8448                
8449            </div>
8450        </div>
8451    </div> -->
8452
8453<!--
8454<div class="social-popup" id="report-on-more-option">
8455    <div class="add-post-inner">
8456        <div class="popup-header">
8457            <h2>What’s happening?</h2>
8458            <div class="cross">
8459                <a href="javascript:void(0)" onclick="$('#report-on-more-option').fadeOut('fast')">
8460                    <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross" title="Cross">
8461                </a>
8462            </div>
8463        </div>
8464
8465        <div class="pop-inner">
8466            <textarea id="problem_text"
8467                placeholder="Please include as many details as possible so that we can get to the problem quickly. Your report will remain anonymous."></textarea>
8468        </div>
8469
8470        <div id="attachment-preview-container" style="display: none;">
8471            <button type="button" class="close-btn" id="remove-attachment">&times;</button>
8472            <div id="attachment-preview">
8473            </div>
8474        </div>
8475
8476        <div class="report-foot d-flex justify-content-between">
8477            <div class="attach">
8478                <img src="https://www.jumpspree.com/public/images/attach.png" loading="lazy" alt="Attach"
8479                    title="Attach">
8480                <input type="file" id="attachmentForReport" accept="image/*,video/*">
8481            </div>
8482            <div class="send">
8483                <button type="button" class="send" id="sendReport" disabled>Send</button>
8484            </div>
8485        </div>
8486    </div>
8487</div>
8488-->
8489
8490 
8491
8492<div class="social-popup" id="report-on-more-option">
8493    <div class="add-post-inner">
8494        <div class="popup-header">
8495            <h2>Report a Bug</h2>
8496            
8497            <div class="cross">
8498                <a href="javascript:void(0)" onclick="$('#report-on-more-option').fadeOut('fast')">
8499                    <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross" title="Cross">
8500                </a>
8501            </div>
8502        </div>
8503
8504        <div class="pop-inner">
8505           <div class="title mb-4">
8506                <input type="text" id="bug-report-title" placeholder="Title" maxlength="100">
8507            </div>
8508            <textarea id="problem_text"
8509                placeholder="Description" maxlength="1000"></textarea>
8510        </div>
8511
8512         
8513        <div id="attachment-preview-container" style="display: none;">
8514            <div id="attachment-preview-inner" style="display: flex;">
8515            </div>
8516        </div>
8517
8518        <div class="report-foot d-flex justify-content-between">
8519            <div class="attach">
8520                <img src="https://www.jumpspree.com/public/images/attach.png" loading="lazy" alt="Attach"
8521                    title="Attach">
8522                <input type="file" multiple id="attachmentForReport" accept="image/*">
8523            </div>
8524            <div class="send">
8525                <button type="button" class="send" id="sendReport" disabled>Send</button>
8526            </div>
8527        </div>
8528    </div>
8529</div>
8530
8531
8532  
8533
8534<div class="social-popup" id="follow-card-box">
8535    <div class="follow-card">
8536        <div class="card-top">
8537            <div class="user-icon">
8538                <img src="https://www.jumpspree.com/public/images/card-image.png" alt="User icon" title="User icon">
8539            </div>
8540            <img src="https://www.jumpspree.com/public/images/top-banner-card.png" alt="Banner" title="Banner">
8541        </div>
8542        <div class="card-inside">
8543            <div class="user-name-section d-flex justify-content-between">
8544                <div class="name">
8545                    <h2>Pat Brown</h2>
8546                    <p>@patbrown</p>
8547                </div>
8548                <div class="follow-btn">
8549                    <a href="#">
8549Follow</a>
8550                </div>
8551            </div>
8552            <div class="stats d-flex justify-content-strat">
8553                <div class="stat" style="cursor:pointer"
8554                    onclick="window.location.href='https://www.jumpspree.com/brandfollowers/vicsbrandpage'">
8555                    <a href="#">101 Followers</a>
8556                </div>
8557                <div class="stat">
8558                    •
8559                </div>
8560                <!--
8561                               <div class="stat" onclick="window.location.href='https://www.jumpspree.com/following'">
8562                                   <h5></h5>
8563                                   <p>Following</p>
8564                               </div>
8565                               <div class="stat">
8566                                   &bull;
8567                               </div>
8568-->
8569
8570                <div class="stat">
8571                    <a href="#">865 Following</a>
8572                </div>
8573            </div>
8574
8575            <div class="bio">
8576                <p>This is the bio. This is the bio. This is the bio. This is the bio. This is the bio. This is the bio.
8577                    This is the bio. This is the bio. This is the bio. </p>
8578            </div>
8579        </div>
8580    </div>
8581</div>
8582
8583
8584<div class="social-popup" id="write-article-popup">
8585    <input type="hidden" id="post-id-hidden" value=""> <!-- Hidden input for postId this will filled in JS  -->
8586
8587    <div class="add-post-inner">
8588        <div class="header-post social-add-header">
8589            <div class="create-poll-head">
8590                <div class="back-post" onclick="$('#discard').addClass('show-discard')"><i
8591                        class="fa-regular fa-arrow-left" aria-hidden="true"></i></div>
8592                <h2>Write your article</h2>
8593
8594                <div class="save-article"><a href="#">Save</a></div>
8595                <div class="drop-down-blog">
8596                    <a class="discard-button" href="javascript:void(0)"
8597                        onclick="$('#discard').addClass('show-discard')">Discard</a>
8598                </div>
8599            </div>
8600
8601
8602            <div class="post-area-inside">
8603                <textarea
8604                    oninput="this.style.height = &quot;&quot;;this.style.height = this.scrollHeight + &quot;px&quot;"
8605                    name="repostTextarea" id="repostTextarea" placeholder="What's up?"></textarea>
8606            </div>
8607
8608            <div class="post-foot add-post-foot d-flex justify-content-between">
8609                <div class="add-image">
8610                    <img src="https://www.jumpspree.com/public/images/icon.png" alt="footer" title="footer">
8611                </div>
8612
8613                <div class="send-post">
8614                    <button type="button" id="submit-comment">Save</button>
8615                </div>
8616            </div>
8617        </div>
8618    </div>
8619</div>
8620
8621<!-- ADD POST  start here  -->
8622
8623<div class="social-popup" data-id="addPostFunctionality" id="social-popup">
8624
8625    <div class="add-post-inner">
8626
8627        <div class="genrate-with-ai" id="genrate-with-ai-step01" style="display:none">
8628            <div class="genrate-ai-inner">
8629                <div class="cross"><a href="javascript:void(0)" onclick="$('#genrate-with-ai-step01').fadeOut();"><img
8630                            src="https://www.jumpspree.com/public/images/cross-ga.png" alt="Cross" title="Cross"></a>
8631                </div>
8632                <div class="stars"><img src="https://www.jumpspree.com/public/images/starss.png" alt="Star"
8633                        title="Star"></div>
8634                <h2>What would you like to generate?</h2>
8635                <p>Type your instructions below and let AI magically create a post for you.</p>
8636                <div class="credits-wrapper">
8637                    <p><span id="creditremainingstats">-/-</span> daily tokens remaining. <a href="javascript:void(0)"
8638                            onclick="getAIPlans()">Buy additional tokens starting at only
8639                            $5.</a></p>
8640                </div>
8641                <div class="whats-on-your-mind">
8642                    <!--                <h3>What’s on your mind?</h3>-->
8643                    <div class="whats-on-your-mind-text">
8644                        <textarea name="generatebox" id="generatebox" cols="30" rows="10"
8645                            placeholder="What’s on your mind?"></textarea>
8646                    </div>
8647                    <div class="copy-link" style="cursor:pointer;">
8647<img onclick="copyPost()"
8648                            src="https://www.jumpspree.com/public/images/copy-link23.png" alt="Copy" title="Copy">
8649                    </div>
8650                </div>
8651
8652                <div id="g-ai-button">
8653                    <div class="g-ai-button d-flex">
8654                        <button id="generateBtn" class="generate disabled" onclick="regenerateText('1')">
8655
8656                            <span id="spinner" class="spinner-border spinner-border-sm" style="display:none;"
8657                                role="status" aria-hidden="true"></span>
8658                            <span id="generateText"><img style="width:20px" id="regenerateicon"
8659                                    src="https://www.jumpspree.com/public/images/restore.png" alt="Generate"
8660                                    title="Generate"> Generate</span>
8661
8662                        </button>
8663                    </div>
8664                </div>
8665
8666                <div id="g-ai-btn" style="display:none">
8667                    <div class="g-ai-button d-flex">
8668                        <button class="keep-this" onclick="keepPost()"><img
8669                                src="https://www.jumpspree.com/public/images/thumbsup.png" loading="lazy" alt="thumbsup"
8670                                title="thumbsup"> Keep this response</button>
8671                        <button class="regenerate" onclick="regenerateText('2')"><img id="regenerateicon"
8672                                src="https://www.jumpspree.com/public/images/restore.png" alt="Regenerate"
8673                                title="Regenerate"> Regenerate</button>
8674                    </div>
8675                </div>
8676
8677                <div class="note">
8678                    <p>We currently do not generate images. This feature is still in beta and the responses might not
8679                        always be accurate. Do not enter any personal or sensitive information.</p>
8680                </div>
8681            </div>
8682        </div>
8683
8684
8685        <div class="genrate-with-ai" id="genrate-with-ai-step02" style="display:none">
8686            <div class="genrate-ai-inner">
8687                <div class="cross"><a href="javascript:void(0)" onclick="$('#genrate-with-ai-step02').fadeOut();"><img
8688                            src="https://www.jumpspree.com/public/images/cross-ga.png" alt="Cross" title="Cross"></a>
8689                </div>
8690                <div class="stars"><img src="https://www.jumpspree.com/public/images/starss.png" alt="Stars"
8691                        title="Stars"></div>
8692                <h2>How many tokens would you like to purchase?</h2>
8693                <p>Once purchased, your tokens will be saved until you’ve use them all.</p>
8694                <div class="credits-wrapper">
8695                    <p>5/5 daily tokens remaining. <a href="javascript:void(0)">Buy additional tokens starting at only
8696                            $5.</a></p>
8697                </div>
8698
8699                <div class="payment-option">
8700
8701
8702                    <ul id="planlist">
8703
8704                        <li>
8705                            <span><b>Loading Plans</b> please wait...</span>
8706
8707                        </li>
8708                         
8709                    </ul>
8710                </div>
8711
8712                <div class="g-ai-button d-flex">
8713                    <button class="buy" type="button" onclick="buyaiplan()"><img
8714                            src="https://www.jumpspree.com/public/images/lock-buynow2.png" alt="Lock" title="Lock">
8715                        <span class="buy-btn-text">Buy now</span>
8716                    </button>
8717                </div>
8718
8719                <div class="note">
8720                    <p>By purchasing tokens you are agreeing to our terms of use and privacy policy. Tokens cannot be
8721                        refunded once purchased, and cannot be transferred to another account. Additional taxes and fees
8722                        may apply at checkout.</p>
8723                </div>
8724            </div>
8725        </div>
8726
8727        <div class="genrate-with-ai" id="genrate-with-ai-step03" style="display:none">
8728            <div class="genrate-ai-inner">
8729                <div class="cross"><a href="javascript:void(0)" onclick="$('#genrate-with-ai-step03').fadeOut();"><img
8730                            src="https://www.jumpspree.com/public/images/cross-ga.png" alt="Cross" title="Cross"></a>
8731                </div>
8732                <div class="check"><img src="https://www.jumpspree.com/public/images/new-check.png" alt="Check"
8733                        title="Check"></div>
8734                <h2>You’re all set!</h2>
8735                <p>Your credits are now applied to your account and are ready to use! Can’t wait to see what your
8736                    generate with the power of AI.</p>
8737
8738
8739
8740
8741                <div class="g-ai-button d-flex">
8742                    <button class="buy" onclick="$('#genrate-with-ai-step03').fadeOut();">Create a post</button>
8743                </div>
8744
8745
8746            </div>
8747        </div>
8748
8749
8750
8751        <div class="genrate-with-ai" id="genrate-with-ai-step04" style="display:none">
8752            <div class="genrate-ai-inner">
8753                <div class="cross"><a href="javascript:void(0)" onclick="$('#genrate-with-ai-step04').fadeOut();"><img
8754                            src="https://www.jumpspree.com/public/images/cross-ga.png" alt="Cross" title="Cross"></a>
8755                </div>
8756                <div class="check"><img src="https://www.jumpspree.com/public/images/new-check.png" alt="Check"
8757                        title="Check"></div>
8758                <h2>Transaction Cancelled</h2>
8759                <p>The transaction was aborted at your request. No payment has been taken. Please restart the process
8760                    when you’re ready.</p>
8761
8762
8763
8764
8765                <!-- <div class="g-ai-button d-flex">
8766                    <button class="buy" onclick="generatewithai()">Restart</button>
8767                </div> -->
8768
8769
8770            </div>
8771        </div>
8772
8773        <!-- Embed Link Popup -->
8774        <!-- Embed Link Popup -->
8775        <div id="embed-link" class="">
8776            <div class="embed-header">
8777                <div class="d-flex align-items-center mb-3">
8778                    <div class="back-btn">
8779                        <a href="javascript:void(0)" onclick="closeEmbedLinkPopup()"> <i
8780                                class="fa-solid fa-arrow-left-long"></i> </a>
8781                    </div>
8782                    <h3 class="embed-link-header"><i class="hgi hgi-stroke hgi-link-05"></i> Embed Link</h3>
8783                    <div class="close">
8784                        <span class="cancel" onclick="closeEmbedLinkPopup()">Cancel</span>
8785                    </div>
8786                </div>
8787            </div>
8788            <div class="embed-inner">
8789                <p>
8790                    This link will be embedded in your media. Users can click the image to open the embedded link.
8791                    Jumpspree More subscribers can edit this link for 30 minutes after publishing the post.</p>
8792                <div class="input-embed">
8793                    <input id="embedInput" type="text" aria-label="HTML embed code" value=""
8794                        placeholder="Enter your link here">
8795                    <button class="copy-embed" id="saveEmbedButton" type="button">Save</button>
8796                </div>
8797            </div>
8798        </div>
8799
8800        <!-- Alt Text Popup -->
8801        <div id="add-alt-tag" class="">
8802            <div class="alt-header">
8803                <div class="d-flex align-items-center mb-3">
8804                    <h3><img src="https://www.jumpspree.com/public/images/alt.png" alt="Alt" title="Alt"> Alt Text</h3>
8805                    <div class="close">
8806                        <span class="cancel" onclick="closeAltTextPopup()">Cancel</span>
8807                    </div>
8808                </div>
8809            </div>
8810            <div class="embed-inner">
8811                <p>
8812                    Alt text, or "alternative text," is a written description added to images on websites or digital
8813                    content to describe what the image shows. It's primarily used to improve accessibility for people
8814                    with visual impairments, as screen readers can read the alt text aloud. Alt text also helps search
8815                    engines understand the image content, which can improve search ranking and visibility.</p>
8816                <div class="d-flex">
8817                    <div class="input-embed flex1 mt-0 mb-0">
8818                        <textarea id="altTextInput" maxlength="1000"
8819                            placeholder="Example: This image shows..."></textarea>
8820                        <div class="text-right">
8821                            <div id="altTextLiveCounter" class="c-count">0/1000</div>
8822                        </div>
8823                    </div>
8824                    <button class="copy-embed" id="saveAltTextButton" type="button">Save</button>
8825                </div>
8826            </div>
8827        </div>
8828
8829
8830
8831        <div id="draft-box" onclick="window.event.cancelBubble = true;">
8832            <div class="embed-header">
8833                <div class="d-flex align-items-center mb-0">
8834                    <div class="back-btn">
8835                        <a href="javascript:void(0)"
8836                            onclick="$('#social-popup .add-post-inner').removeClass('draft-open');$('#draft-box').hide()"><img
8837                                src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Arrow" title="Arrow"
8838                                style="filter:invert(0); height: auto; width:13px"></a>
8839                    </div>
8840                    <h3>Drafts</h3>
8841                    <div id="deleteAllDraftBtn" class="close delete-all"><a href="javascript:void(0)"
8842                            onclick="$('#discard-save-draft').show();">Delete All</a></div>
8843                </div>
8844                <div class="draft-switcher">
8845                    <a href="#" id="draft-btn" class="active"
8846                        onclick="$(this).addClass('active');$('#schedued-btn').removeClass('active');$('#draft-container').fadeIn(); $('#schedule-container').hide()">Drafts</a>
8847                    <a href="#" id="schedued-btn" onclick="showScheduler(this)">Scheduled</a>
8848                </div>
8849            </div>
8850            <div class="draft-outer" id="draft-container">
8851                <div class="no-drafts">
8852                    <p id="noDraft">No drafts available</p>
8853                </div>
8854                <!-- Dynamic content will be appended here 22 jan -->
8855            </div>
8856
8857            <div class="draft-outer" id="schedule-container" style="">
8858                <div class="schedule-list mt-0" id="scheduledPostArticleList">
8859
8860
8861                </div>
8862            </div>
8863
8864
8865            <!-- <div class="no-drafts">
8866             <p>No drafts available</p>
8867         </div> -->
8868        </div>
8869
8870
8871        <div id="add-topic-box" onclick="window.event.cancelBubble = true;">
8872
8873            <div class="search-box-add-topic d-flex align-items-center gap-4">
8874                <div class="search-input-topic">
8875                    <i class="hgi hgi-stroke hgi-search-01"></i>
8876                    <input type="text" class="form-control" placeholder="Search">
8877                </div>
8878                <span onclick="$('#add-topic-box').hide();" style="color:#fff !important">Cancel</span>
8879            </div>
8880
8881            <div class="search-topic-dropdown">
8882                <div class="search-topic-dropdown-row">
8883                    <span>Information</span>
8884                    <a href="#">Add new topic</a>
8885                </div>
8886                <div class="search-topic-dropdown-row">
8887                    <span>Information</span>
8888                    <a href="#">Add new topic</a>
8889                </div>
8890                <div class="search-topic-dropdown-row">
8891                    <span>Information</span>
8892                    <a href="#">Add new topic</a>
8893                </div>
8894            </div>
8895
8896
8897
8898
8899        </div>
8900
8901
8902
8903
8904        
8905 
8906        <!-- add post with repost preview new dec 10 update start -->
8907        <div class="header-post social-add-header" id="add-post-div">
8908            <div class="d-flex" style="flex-direction:column;">
8909                <!-- Add repost indicator in header -->
8910                <div class="popup-top-header d-flex justify-content-between align-items-center">
8911                    <div id="discard-for-post" class="dicard">
8912                        <span class="discard-button" style="cursor:pointer" onclick="handleDiscardAction()">
8913                            <i class="fa-light fa-angle-left"></i> Cancel
8914                        </span>
8915                    </div>
8916                    <div id="discard-for-poll" class="dicard" style="display:none">
8917                        <span style="cursor:pointer" class="discard-button" onclick="handleDiscardPollAction()">Cancel</span>
8918                    </div>
8919                    
8920                    <!-- Dynamic title - changes when reposting -->
8921                    <h2 id="popup-title">Create Post</h2>
8922                    
8923                    <!-- Repost indicator badge -->
8924                    <!-- <div id="repost-indicator" style="display:none; margin-left: 10px;">
8925                        <span style="color: #1d9bf0; font-size: 12px; display: flex; align-items: center; background: rgba(29, 155, 240, 0.1); padding: 3px 8px; border-radius: 12px;">
8926                            <i class="fa-solid fa-retweet" style="margin-right: 5px; font-size: 10px;"></i> Reposting
8927                        </span>
8928                    </div> -->
8929                    
8930                    <div class="draft">
8931                        <a href="javascript:void(0)"
8932                            style="color:#b8b8b8; display: flex;align-items: center;justify-content: center;"
8933                            onclick="$('#social-popup .add-post-inner').addClass('draft-open');$('#draft-box').show();$('#draft-container').show();$('#schedule-container').hide();">
8934                            Drafts
8935                        </a>
8936                    </div>
8937                </div>
8938                
8939                <!-- Hidden input for repost ID -->
8940                <form id="repost-form" style="display:none;">
8941                    <input type="hidden" id="repostId" name="repostId" value="">
8942                </form>
8943                
8944                <div class="add-post-inside">
8945                    <div class="schedule-done updated-version" id="scheduledone" style="display:none">
8946                        <p id="scheduledfor"
8947                            onclick="$('#social-popup > .add-post-inner').addClass('schedule-box-opened');$('.Schedule-message-wrapper').show();">
8948                        </p>
8949                        <div class="unschedule-close" onclick="$('#unschedule').fadeIn('fast')">&times;</div>
8950                        <div class="action" style="display:none"><a href="javascript:void(0)"
8951                                onclick="$('#social-popup > .add-post-inner').addClass('schedule-box-opened');$('.Schedule-message-wrapper').show();">Change</a>
8952                            <a href="javascript:void(0)" onclick="$('#unschedule').fadeIn('fast')">Unschedule</a>
8953                        </div>
8954                    </div>
8955                    
8956                  
8957                    
8958                    <!-- Original Post Creator Section -->
8959                    <div class="header-add-post">
8960                        <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
8961                            <div class="d-flex align-items-center">
8962                                <div class="fig">
8963                                    <div id="online-dot-"
8964                                        class="user-online">
8965                                    </div>
8966                                    <img id="currentprofile" src="https://www.jumpspree.com/public/images/user-icon.png?ver:1.023"
8967                                        style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
8968                                </div>
8969
8970                                <div class="fnc-title">
8971                                    <h4 class="currentUser d-flex gap-2 align-items-center">
8972                                        <span class="d-flex">
8973                                            <div style="display:none">
8974                                                Guest User                                                <span class="post-creation-divider">&bull;</span> 
8975                                            </div>
8976                                            <span class="post-creation-username notranslate">
8977                                                @Guest                                            </span>
8978                                        </span>
8979                                                                            </h4>
8980                                    <div class="add-a-topic"><a href="javascript:void(0)"
8981                                            onclick="$('#add-topic-box').show();"><img
8982                                                src="https://www.jumpspree.com/public/images/add-topic.png"
8983                                                style="filter:invert()" alt="Add topic" title="Add topic"> Add a topic
8984                                            <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></div>
8985                                    <p class="currentUserName" style="display:none">
8986                                        @Guest                                    </p>
8987                                </div>
8988                            </div>
8989
8990                            <div class="drop-down-blog" style="display:none">
8991                                <a class="discard-button" href="javascript:void(0)"
8992                                    onclick="handleDiscardAction()">Discard</a>
8993                            </div>
8994                        </div>
8995                    </div>
8996                    
8997                    <!-- Rest of your existing code remains exactly the same -->
8998                    <div id="gifModalForAddPost" class="gif-modal">
8999                        <div class="gif-modal-content">
9000                            <input type="text" id="gifSearchForAddPost" placeholder="Search GIFs">
9001                            <button style="opacity: 0;" id="gifSearchBtnForAddPost" class="search-icon-btn">
9002                                <i class="fa fa-search" aria-hidden="true"></i>
9003                            </button>
9004                            <div id="gifResults-outer">
9005                            <div id="gifResultsForAddPost" class="gif-list"></div>
9006                            </div>
9007                        </div>
9008                    </div>
9009                    
9010                    <div id="add-post-full-container">
9011                        <div class="add-post-inside-wrapper">
9012                            <div class="post-area-inside">
9013                                <div id="addPostTextarea" contenteditable="true"
9014                                    data-placeholder="What’s jumping in your head?" oninput="highlightText(this)"></div>
9015                                <div class="mention-popup" id="mention-popup"></div>
9016                                <div id="hashTags-popup" class="hashTags-popup"></div>
9017                            </div>
9018
9019                              <!-- Repost Preview Container -->
9020                                <div id="repost-preview-container" style="display:none; margin-bottom: 20px; padding: 15px; background: rgba(255, 255, 255, 0.05); border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.1);">
9021                                    <div class="repost-preview-header" style="margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between;">
9022                                        <div style="font-size: 12px; color: #8d8c8c;">
9023                                            <i class="fa-solid fa-retweet" style="margin-right: 5px;"></i> Reposting this post
9024                                        </div>
9025                                        <button onclick="clearRepost()" style="background: none; border: none; color: #8d8c8c; cursor: pointer; font-size: 12px; padding: 2px 8px;">
9026                                            <i class="fa-solid fa-xmark"></i> Clear
9027                                        </button>
9028                                    </div>
9029                                    <div class="post-for-repost">
9030                                        <div class="fnc mt-0 justify-content-between mb-3 align-items-start">
9031                                            <div class="d-flex align-items-center">
9032                                                <div class="fig" style="width: 30px; height: 30px;">
9033                                                    <img id="currentpostprofile" src="" alt="Profile" style="border-radius:50%; width: 100%; height: 100%; object-fit: cover;">
9034                                                </div>
9035                                                <div class="fnc-title" style="margin-left: 10px;">
9036                                                    <h4 class="postUser" style="font-size: 14px; margin: 0; color: #fff;"></h4>
9037                                                    <p class="postUserName" style="font-size: 12px; margin: 0; color: #8d8c8c;"></p>
9038                                                </div>
9039                                            </div>
9040                                        </div>
9041                                        <div class="post-data">
9042                                            <p id="repost-preview-content" style="font-size: 14px;
9042 color: #e0e0e0; margin: 0; line-height: 1.4;"></p>
9043                                        </div>
9044                                    </div>
9045                                </div>
9046
9047                            <div class="image-preview-box" id="imagePreviewBox" style="display: none;">
9048                                <button style="display: none;" onclick="closePreview()" class="close-btn">&times;</button>
9049                                <div class="addpostImagePreview swiper mySwiper" id="imageCarousel">
9050                                    <div class="swiper-wrapper"></div>
9051                                    <div class="swiper-pagination"></div>
9052                                </div>
9053                            </div>
9054
9055                            <div class="video-preview-box" id="videoPreviewBox" style="display: none;">
9056                                <div class="video-preview" id="videoPreviewContainer">
9057                                    <div class="close-video-preview" onclick="closeVideoPreview()">&times;</div>
9058                                    <video id="videoPreview" controls>
9059                                        <source id="videoSource" src="" type="video/mp4">
9060                                    </video>
9061                                </div>
9062                            </div>
9063
9064                            <div class="gif-preview-box" id="gifPreviewBox" style="display: none;">
9065                                <div class="gif-preview" id="gifPreviewContainer">
9066                                    <div class="close-gif-preview" onclick="clearGifPreview()">&times;</div>
9067                                    <img id="gifPreviewAddPost" src="" alt="GIF">
9068                                </div>
9069                                <div style="display: none !important;" class="embed-and-alt d-flex">
9070                                    <div class="embed-link"><a href="javascript:void(0)"
9071                                            onclick="window.event.cancelBubble = true; $('#embed-link').addClass('show-embed-link');$('#add-alt-tag').removeClass('embed-in'); $('#add-alt-tag').removeClass('show-add-alt-tag'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');"><img
9072                                                src="https://www.jumpspree.com/public/images/copy-link.png"
9073                                                alt="Copy Link" title="Copy Link"> Embed
9074                                            link</a></div>
9075                                    <div class="add-alt-text"><a href="javascript:void(0)"
9076                                            onclick="window.event.cancelBubble = true; $('#add-alt-tag').addClass('show-add-alt-tag'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');$('#embed-link').removeClass('embed-in'); $('#embed-link').removeClass('show-embed-link');"><img
9077                                                src="https://www.jumpspree.com/public/images/alt.png" alt="Add alt text"
9078                                                title="Add alt text"> Add alt text</a>
9079                                    </div>
9080                                </div>
9081                            </div>
9082                        </div>
9083
9084                        <div class="create-post-bottom-icons d-flex align-items-center">
9085                            <div class="all-btn-wrapper-box d-flex align-items-center">
9086                                <div class="add-image">
9087                                    <ul class="d-flex p-0 m-0">
9088                                        <li class="emozibtn-post"><button id="myemojiBtn">😊</button>
9089                                            <div id="emojiPickerWrapper"
9090                                                style="display: none; position: absolute; z-index: 999;">
9091                                                <div style="text-align: right;">
9092                                                    <button id="closeEmojiPicker"
9093                                                        style="border: none; background: none; font-size: 18px; cursor: pointer;">❌</button>
9094                                                </div>
9095                                                <emoji-picker id="emojiPicker" style="width: 320px; height: 300px;">
9096                                                </emoji-picker>
9097                                            </div>
9098                                        </li>
9099                                        <li>
9100                                            <a href="javascript:void(0)"
9101                                                style="display: flex;align-items: center;justify-content: center;">
9102                                                <input type="file" multiple accept="image/*" id="imageInput">
9103                                                <img src="https://www.jumpspree.com/public/images/image-upload-stroke-rounded.png"
9104                                                    alt="Upload" title="Upload" style="width: 17px;">
9105                                            </a>
9106                                        </li>
9107                                        <li>
9108                                            <a href="javascript:void(0)"
9109                                                style="display: flex;align-items: center;justify-content: center;">
9110                                                <input type="file" id="videoInput">
9111                                                <img src="https://www.jumpspree.com/public/images/video-01-stroke-rounded.png"
9112                                                    class="video-icon" alt="video" title="video" style="width: 20p
9112x;">
9113                                            </a>
9114                                        </li>
9115                                        <li onclick="openGifModalForAddPost()">
9116                                            <a href="javascript:void(0)" id="gif-trigger-for-addpost"
9117                                                style="display: flex;align-items: center;justify-content: center;">
9118                                                <img src="https://www.jumpspree.com/public/images/gif-02-stroke-rounded.png"
9119                                                    alt="Gif" title="Gif" style="width: 17px;">
9120                                            </a>
9121                                        </li>
9122                                        <li class="create-poll"
9123                                            onclick="$('#create-poll-main-box, #post-footer-for-poll').slideDown(); $('#post-footer-for-post').hide(); $('#add-post-full-container').hide(); $('#discard-for-poll').show(); $('#discard-for-post').hide(); ">
9124                                            <a href="javascript:void(0)">
9125<!--
9126                                                <i class="hgi hgi-stroke hgi-analytics-01"
9127                                                    style="transform: rotate(90deg);display: inline-block;"></i>
9128-->
9129                                           <img src="https://www.jumpspree.com/public/images/analytics-01.png?ver:1.02" alt="">
9130                                            </a>
9131                                        </li>
9132                                         
9133                                    </ul>
9134                                </div>
9135
9136                                                            </div>
9137
9138<!--
9139                            <div class="btn-ai-wrapper">
9140                                <button class="btn btn-ai glow-btn" id="btn-ai" style="margin-top:0"
9141                                    onclick="generatewithai()"><span class="ai-btn-inner"><img
9142                                            src="https://www.jumpspree.com/public/images/starss.png" alt="Stars"
9143                                            title="Stars" width="20"> Try Jumpspree AI</span></button>
9144                            </div>
9145-->
9146                        </div> 
9147                        
9148
9149                        <div class="write-article-and-tag-a-product member-guidlines" style="display: none;">
9150                                <ul>
9151                                    <li><a href="javascript:void(0)" onclick="$('#members-box').fadeIn('fast');"><span class="d-flex flex-direction-column members" style="flex-direction:column"><span>Members</span>
9152                                    <span class="desc">Add or edit people who can see and reply to this post. Only members you add can see and interact with Private Posts.</span>
9153                                </span> <span>›</span></a></li>
9154                                                                <li><a href="javascript:void(0)" onclick="$('#guidlines-box').fadeIn('fast'); $('.guidlines-textaea textarea').focus()"><span class="d-flex flex-direction-column members" style="flex-direction:column"><span>Guidelines</span>
9155                                                                        <span class="desc">Create guidelines that you want your post members to adhere to. You 
9156                                can edit your guidelines anytime.</span>
9157                                </span> <span>›</span></a></li>
9158                                </ul>
9159                        </div>
9160
9161                        
9162                        <p class="typingondesktio" style="margin: 0;
9163                                text-align: left;
9164                                width: 100%;
9165                                font-size: 12px;
9166                                color: #8d8c8c;
9167                            margin-top: 0;position: static;bottom: 0;padding-left: 5px;margin-bottom: 1px;">
9168                            <small>Typing on desktop? <b>Shift + Return</b> to add a new line.</small>
9169                        </p>
9170                    </div>
9171                </div>
9172                
9173                
9174                <div class="members-box" id="members-box">
9175                    <div  class="add-product" style="">
9176                <div class="add-product-header d-flex justify-content-between">
9177                    <div class="cancel-product" onclick="$('#members-box').fadeOut('fast')">Close</div>
9178                    <div class="heading">Add Members</div>
9179                    <div class="product-done" onclick="$('#members-box').fadeOut('fast')">Done</div>
9180                </div>
9181                
9182                <div class="search-product">
9183                   <div class="search-product-title">
9184                    <i class="hgi hgi-stroke hgi-search-01"></i>
9185                    <input type="text" placeholder="Search by name or @username">
9186                   </div>
9187                    
9188                    <div class="added-list">
9189                        <ul>
9190                            
9191                            <!-- <li>
9192                                <img loading="lazy" src="https://cubesnack-seller.s3.amazonaws.com/products/1612250530282918.jpg" style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
9193                                <div class="close-added">&times;</div>
9194                                <p>Autumnwind</p>
9195                            </li> -->
9196                            
9197                        </ul>
9198                    </div>
9199                    
9200                      <div class="product-drop">
9201                       <ul>
9202
9203                            <!-- <li class="d-flex justify-content-between">
9204                                <div class="d-flex align-items-center">
9205                                    
9206                                        <a href="/mattcorr675" class="fig">
9207                                            <div id="online-dot-3860" class=" online-green"></div>
9208                                            <img loading="lazy" src="https://cubesnack-seller.s3.amazonaws.com/products/1612250530282918.jpg" style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
9209                                        </a>
9210                                        <div class="fnc-title">
9211                                            <h4 class="notranslate">
9212                                                <a href="/mattcorr675" class="profile-link">autumnwind</a>
9213                                                <div class="user">@autumnwind</div>
9214
9215                                            </h4>
9216                                            <p style="display:none"><a href="/mattcorr675" class="profile-link">@mattcorr675</a></p>
9217                                                
9218                                        </div>
9219                                    </div>
9220                                
9221                                <div class="add"><a href="#">Add</a></div>
9222                            </li> -->
9223                        
9224                        </ul> 
9225                    </div>
9226                    
9227                    
9228                </div>
9229                
9230            </div>
9231                </div>
9232                
9233                
9234                <div class="members-box" id="guidlines-box">
9235                    <div  class="add-product" style="">
9236                <div class="add-product-header d-flex justify-content-between">
9237                    <div class="cancel-product" onclick="$('#guidlines-box').fadeOut('fast')">Cancel</div>
9238                    <div class="heading">Guidelines</div>
9239                    <div class="product-done" onclick="$('#members-box').fadeOut('fast')">Done</div>
9240                </div>
9241                
9242                <div class="search-product">
9243                      <div class="guidlines-textaea">
9244                          <textarea name="" id="private-guidelines" cols="30" rows="10" autofocus></textarea>
9245                      </div>
9246                    
9247                    
9248                </div>
9249                
9250            </div>
9251                </div>
9252
9253                <!-- Poll section remains exactly the same -->
9254                <div id="create-poll-main-box" style="display:none">
9255                    <div class="create-poll-wrrapper-main">
9256                        <div class="poll-created-by pb-2 pt-0">
9257                            <div class="fnc mt-0 justify-content-between mb-0">
9258                                <div class="d-flex flex1">
9259                                    <div class="fnc-title flex1">
9260                                        <textarea id="pollDescription"
9261                                            oninput="this.style.height = &quot;&quot;;this.style.height = this.scrollHeight + &quot;px&quot;"
9262                                            placeholder="What’s jumping in your head?"></textarea>
9263                                    </div>
9264                                </div>
9265                            </div>
9266                        </div>
9267
9268                        <div class="post-area-inside mb-0">
9269                            <div class="create-poll-option" id="pollOptionsContainer">
9270                                <div class="option">
9271                                    <input type="text" class="poll-option-input" placeholder="Option 1">
9272                                    <button class="delete-option" type="button" style="display: none;">
9273                                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete"
9274                                            title="Delete">
9275                                    </button>
9276                                </div>
9277                                <div class="option">
9278                                    <input type="text" class="poll-option-input" placeholder="Option 2">
9279                                    <button class="delete-option" type="button" style="display: none;">
9280                                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete"
9281                                            title="Delete">
9282                                    </button>
9283                                </div>
9284                                <div class="option add-another-option">
9285                                    <input type="text" id="newPollOptionInput" class="poll-option-input"
9286                                        placeholder="Add more">
9287                                    <button class="delete-option" type="button" style="display: none;">
9288                                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete"
9289                                            title="Delete">
9290                                    </button>
9291                                </div>
9292                            </div>
9293
9294                            <div class="poll-time d-flex justify-content-between">
9295                                <div class="end-poll hide">
9296                                    Ends in <input type="number" id="pollDuration" value="" min="1" max="336">h
9297                                </div>
9298                            </div>
9299
9300                            <div class="poll-ending-time">
9301                                <h3>How long will this poll last? <span class="tooltip-wrapper">i <span
9302                                            class="tooltip-wrapper-inner">
9303                                            Decide how long this poll will last. Once your poll ends, no one will be
9304                                            able to cast votes.</span></span></h3>
9305                                <ul>
9306                                    <li><button class="duration-btn selected">1 day</button></li>
9307                                    <li><button class="duration-btn">3 days</button></li>
9308                                    <li><button class="duration-btn">5 days</button></li>
9309                                    <li><button class="duration-btn">7 days</button></li>
9310                                    <li><button class="duration-btn">14 days</button></li>
9311                                </ul>
9312                            </div>
9313                            <div class="remove-poll"><a href="javascript:void(0)"
9314                                    onclick="$('#create-poll-main-box, #post-footer-for-poll').hide(); $('#post-footer-for-post').show(); $('#add-post-full-container').show();$('#discard-for-poll').hide(); $('#discard-for-post').show();">Remove
9315                                    poll</a>
9316                            </div>
9317                        </div>
9318                    </div>
9319                </div>
9320            </div>
9321            
9322            <!-- Footer sections remain exactly the same -->
9323            <div id="post-footer-for-poll" style="display:none">
9324                <div class="post-foot add-post-foot d-flex justify-content-between">
9325                    <div class="post-setting-box" id="post-setting-box">
9326                        <div id="post-setting-dropup-poll" onclick="window.event.cancelBubble = true;">
9327                            <div style="display: none;" class="post-setting-box-list"><label><span>Create a private group post</span>
9328                                <span><input id="privateCheckbox" type="checkbox"></span></label></div>
9329                               <div class="post-setting-box-list"><label><span>Turn off comments and replies</span>
9330                                <span><input id="commentsOff" type="checkbox"></span></label></div>
9331                            <div class="post-setting-box-list"><label><span>Hide like counts</span> <span><input
9332                                        id="hideLike" type="checkbox"></span></label></div>  
9333                        </div>
9334                        <h3
9335                            onclick="event.stopPropagation(); $(this).parents('.post-setting-box').find('#post-setting-dropup-poll').toggleClass('show-popup')">
9336                            Post settings</h3>
9337                    </div>
9338
9339                    <div class="send-post">
9340                        <div class="character-count-container">
9341                            <span id="char-count-poll">260</span>
9342                            <div class="progress-circle">
9343                                <div class="progress-circle">
9344                                    <svg width="50" height="50">
9345                                        <circle class="bg" cx="25" cy="25" r="22"></circle>
9346                                        <circle class="progress" cx="25" cy="25" r="22"></circle>
9347                                    </svg>
9348                                </div>
9349                            </div>
9350                            <div id="submitPollForm" class="post-btn addPost-form-submit">
9351                                <a href="javascript:void(0)" onclick="" class=""><i style="color:#fff; opacity:0.5"
9352                                        class="hgi hgi-stroke hgi-time-schedule"></i></a>
9353                                <input type="hidden" id="scheduletime" value="">
9354                                <input type="hidden" id="scheduledate" value="">
9355                                <input type="hidden" id="scheduled" value="0">
9356                                <button type="button" id="createPollSubmit" class="blue-bg"><i
9357                                        class="fa-sharp fa-solid fa-paper-plane-top" aria-hidden="true"></i></button>
9358                            </div>
9359                        </div>
9360                    </div>
9361                </div>
9362            </div>
9363
9364            <div id="post-footer-for-post">
9365                <div class="post-foot add-post-foot d-flex justify-content-between">
9366                    <div class="post-setting-box" id="post-setting-box">
9367                        <div id="post-setting-dropup" onclick="window.event.cancelBubble = true;">
9368
9369                            <div style="display: none;" class="post-setting-box-list"><label><span>Create a private group post</span>
9370                                <span><input id="privatepostbtn" type="checkbox"></span></label></div>
9371
9372                               <div class="post-setting-box-list"><label><span>Turn off comments and replies</span>
9373                                <span><input id="commentsOff" type="checkbox"></span></label></div>
9374                            <div class="post-setting-box-list"><label><span>Hide like counts</span> <span><input
9375                                        id="hideLike" type="checkbox"></span></label></div>
9376                        </div>
9377                        <h3
9378                            onclick="event.stopPropagation(); $(this).parents('.post-setting-box').find('#post-setting-dropup').toggleClass('show-popup')">
9379                            Post settings</h3>
9380                    </div>
9381
9382                    <div class="send-post">
9383                        <div class="character-count-container">
9384                            <span id="char-count">260</span>
9385                            <div class="progress-circle">
9386                                <div class="progress-circle">
9387                                    <svg width="50" height="50">
9388                                        <circle class="bg" cx="25" cy="25" r="22"></circle>
9389                                        <circle class="progress" cx="25" cy="25" r="22"></circle>
9390                                    </svg>
9391                                </div>
9392                            </div>
9393                            <div id="submitBtnForm" style="width: 90px;" class="post-btn addPost-form-submit disabled">
9394                                <a href="javascript:void(0)"
9395                                    onclick="$('#social-popup > .add-post-inner').addClass('schedule-box-opened');$('.Schedule-message-wrapper').show();"><i
9396                                        class="hgi hgi-stroke hgi-time-schedule"></i></a>
9397                                <input type="hidden" id="scheduletime" value="">
9398                                <input type="hidden" id="scheduledate" value="">
9399                                <input type="hidden" id="scheduled" value="
93990">
9400                                <button id="addPost-form-submit"><i
9401                                        class="fa-sharp fa-solid fa-paper-plane-top"></i></button>
9402                            </div>
9403                        </div>
9404                    </div>
9405                </div>
9406            </div>
9407        </div>
9408
9409
9410
9411        <!-- add post with repost preview new dec 10 update end -->
9412  
9413
9414        <div class="Schedule-message-wrapper" style="display:none">
9415            <div class="schedule-inner">
9416                <h3>Schedule Post</h3>
9417
9418                <div class="close-popup"
9419                    onclick="$('#social-popup > .add-post-inner').removeClass('schedule-box-opened');$('.Schedule-message-wrapper').hide()">
9420                    <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross" title="Cross">
9421                </div>
9422
9423                <div class="schedule-message-input">
9424                    <div class="date">
9425                        <input type="text" class="form-control" value="Date" id="datepicker">
9426                        <!--                <i class="fa-light fa-calendar-days"></i>-->
9427                        <img src="https://www.jumpspree.com/public/images/llr.png" alt="Calendar" title="Calendar"
9428                                                    style="width: 20px;position: absolute;top: 50%;left: 11px;
9429                            transform: translateY(-50%);">
9430                        <i class="fa-regular fa-angle-down" aria-hidden="true"></i>
9431                    </div>
9432                    <div class="time">
9433                        <input type="text" class="form-control timepicker" value="Time" id="timepicker">
9434                        <img src="https://www.jumpspree.com/public/images/clock25.png" loading="lazy" alt="Clock"
9435                                                    title="Clock" style="width: 20px;position: absolute;top: 50%;left: 9px;
9436                            transform: translateY(-50%);">
9437                        <i class="fa-regular fa-angle-down" aria-hidden="true"></i>
9438                    </div>
9439                </div>
9440
9441                <div class="schedule-footer d-flex justify-content-end">
9442                    <button type="button" class="btn cancel-Schedule" onclick="handleAddPost(1);">Save to
9443                        drafts</button>
9444                    <button class="btn schedule-message" onclick="schedulePost()">Schedule</button>
9445                </div>
9446
9447            </div>
9448        </div>
9449
9450
9451        <div class="ReSchedule-message-wrapper" id="reschedulediv" style="display:none;">
9452            <div class="schedule-inner">
9453                <h3>Reschedule</h3>
9454
9455                <div class="close-popup"
9456                    onclick="$('#social-popup > .add-post-inner').removeClass('schedule-box-opened');$('#reschedulediv').fadeOut('fast');">
9457                    <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross" title="Cross">
9458                </div>
9459
9460                <div class="schedule-message-input">
9461                    <div class="date">
9462                        <input type="text" class="form-control" value="Today" id="scheduledatepicker">
9463                        <i class="fa-light fa-calendar-days" aria-hidden="true"></i>
9464                        <i class="fa-regular fa-angle-down" aria-hidden="true"></i>
9465                    </div>
9466                    <div class="time">
9467                        <input type="text" class="form-control " id="scheduletimepicker" value="">
9468                        <i class="fa-regular fa-clock" aria-hidden="true"></i>
9469                        <i class="fa-regular fa-angle-down" aria-hidden="true"></i>
9470                    </div>
9471                </div>
9472
9473                <div class="schedule-footer d-flex justify-content-end">
9474                    <input type="hidden" id="changeschedulepostid" value="0">
9475                    <button type="button" class="btn cancel-Schedule"
9476                        onclick="$('#reschedulediv').fadeOut('fast');">Cancel</button>
9477                    <button class="btn schedule-message" onclick="changeSchedule(this)">Schedule</button>
9478                </div>
9479
9480            </div>
9481        </div>
9482
9483        <div class="discard-conformation" id="unscheduleMyPost" onclick="window.event.cancelBubble = true;">
9484            <div class="save-draft">
9485                <div class="d-flex align-items-center">
9486                    <div class="flex-direction-column">
9487                        <h3>Unschedule</h3>
9488                        <p>Are you sure you want to unschedule this post?</p>
9489                    </div>
9490                </div>
9491                <div class="save-cancel">
9492                    <button class="copy-embed" type="button"
9493                        onclick="$('#unscheduleMyPost').fadeOut('fast')">No</button>
9494                    <input type="hidden" id="unschedulepostid" value="
94940">
9495                    <button class="copy-embed" type="button" id="unschedulebtn" onclick="movetodraft(this)">Yes</button>
9496
9497                </div>
9498            </div>
9499        </div>
9500
9501    </div>
9502
9503
9504</div>
9505
9506
9507<!--comment-popup-new-->
9508<!--
9509<div class="social-popup" data-id="addPostFunctionality" id="comment-popup-new">
9510    <div class="add-post-inner">
9511        <div id="draft-box" onclick="window.event.cancelBubble = true;">
9512            <div class="embed-header">
9513                <div class="d-flex align-items-center mb-0">
9514                    <div class="back-btn">
9515                        <a href="javascript:void(0)"
9516                            onclick="$('#social-popup .add-post-inner').removeClass('draft-open');$('#draft-box').hide()"><img
9517                                src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Arrow" title="Arrow"
9518                                style="filter:invert(0); height: auto; width:13px"></a>
9519                    </div>
9520                    <h3>Drafts</h3>
9521                    <div id="deleteAllDraftBtn" class="close delete-all"><a href="javascript:void(0)"
9522                            onclick="$('#discard-save-draft').show();">Delete All</a></div>
9523                </div>
9524                <div class="draft-switcher">
9525                    <a href="#" id="draft-btn" class="active"
9526                        onclick="$(this).addClass('active');$('#schedued-btn').removeClass('active');$('#draft-container').fadeIn(); $('#schedule-container').hide()">Drafts</a>
9527                    <a href="#" id="schedued-btn" onclick="showScheduler(this)">Scheduled</a>
9528                </div>
9529            </div>
9530            <div class="draft-outer" id="draft-container">
9531                <div class="no-drafts">
9532                    <p id="noDraft">No drafts available</p>
9533                </div>
9534            </div>
9535
9536            <div class="draft-outer" id="schedule-container" style="">
9537                <div class="schedule-list mt-0" id="scheduledPostArticleList">
9538
9539
9540                </div>
9541            </div>
9542
9543
9544        </div>
9545
9546
9547        
9548 
9549        <div class="header-post social-add-header" id="add-post-div">
9550            <div class="d-flex" style="flex-direction:column;">
9551                <div class="popup-top-header d-flex justify-content-between align-items-center">
9552                    <div id="discard-for-post" class="dicard">
9553                        <span class="discard-button" style="cursor:pointer" onclick="handleDiscardAction()">
9554                            <i class="fa-light fa-angle-left"></i> Cancel
9555                        </span>
9556                    </div>
9557                    <div id="discard-for-poll" class="dicard" style="display:none">
9558                        <span style="cursor:pointer" class="discard-button" onclick="handleDiscardPollAction()">Cancel</span>
9559                    </div>
9560                    
9561                    <h2 id="popup-title">Create Post</h2>
9562                    
9563                    
9564                    <div class="draft">
9565                        <a href="javascript:void(0)"
9566                            style="color:#b8b8b8; display: flex;align-items: center;justify-content: center;"
9567                            onclick="$('#social-popup .add-post-inner').addClass('draft-open');$('#draft-box').show();$('#draft-container').show();$('#schedule-container').hide();">
9568                            Drafts
9569                        </a>
9570                    </div>
9571                </div>
9572                
9573                <form id="repost-form" style="display:none;">
9574                    <input type="hidden" id="repostId" name="repostId" value="">
9575                </form>
9576                
9577                <div class="add-post-inside">
9578                    <div class="schedule-done updated-version" id="scheduledone" style="display:none">
9579                        <p id="scheduledfor"
9580                            onclick="$('#social-popup > .add-post-inner').addClass('schedule-box-opened');$('.Schedule-message-wrapper').show();">
9581                        </p>
9582                        <div class="unschedule-close" onclick="$('#unschedule').fadeIn('fast')">&times;</div>
9583                        <div class="action" style="display:none"><a href="javascript:void(0)"
9584                                onclick="$('#social-popup > .add-post-inner').addClass('schedule-box-opened');$('.Schedule-message-wrapper').show();">Change</a>
9585                            <a href="javascript:void(0)" onclick="$('#unschedule').fadeIn('fast')">Unschedule</a>
9586                        </div>
9587                    </div>
9588                    
9589                  
9590                    
9591                    <div class="header-add-post">
9592                        <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
9593                            <div class="d-flex align-items-center">
9594                                <div class="fig">
9595                                    <div id="online-dot-"
9596                                        class="user-online">
9597                                    </div>
9598                                    <img id="currentprofile" src="https://www.jumpspree.com/public/images/user-icon.png?ver:1.023"
9599                                        style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
9600                                </div>
9601
9602                                <div class="fnc-title">
9603                                    <h4 class="currentUser d-flex gap-2 align-items-center">
9604                                        <span class="d-flex">
9605                                            <div style="display:none">
9606                                                Guest User                                                <span class="post-creation-divider">&bull;</span> 
9607                                            </div>
9608                                            <span class="post-creation-username notranslate">
9609                                                @Guest                                            </span>
9610                                        </span>
9611                                                                            </h4>
9612                                    <div class="add-a-topic"><a href="javascript:void(0)"
9613                                            onclick="$('#add-topic-box').show();"><img
9614                                                src="https://www.jumpspree.com/public/images/add-topic.png"
9615                                                style="filter:invert()" alt="Add topic" title="Add topic"> Add a topic
9616                                            <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></div>
9617                                    <p class="currentUserName" style="display:none">
9618                                        @Guest                                    </p>
9619                                </div>
9620                            </div>
9621
9622                            <div class="drop-down-blog" style="display:none">
9623                                <a class="discard-button" href="javascript:void(0)"
9624                                    onclick="handleDiscardAction()">Discard</a>
9625                            </div>
9626                        </div>
9627                    </div>
9628                    
9629                    <div class="comment-post-text">
9630                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit dicta assumenda harum, provident beatae incidunt mollitia, asperiores expedita porro eum laborum! Temporibus odit quasi exercitationem sit, ipsa autem ex esse.</p>
9631                    </div>
9632                     
9633                    <div class="header-add-post">
9634                        <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
9635                            <div class="d-flex align-items-center">
9636                                <div class="fig">
9637                                    <div id="online-dot-" class="user-online">
9638                                    </div>
9639                                    <img id="currentprofile" src="https://cubesnack-seller.s3.amazonaws.com/products/0506251028303132.jpg" style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
9640                                </div>
9641
9642                                <div class="fnc-title">
9643                                    <h4 class="currentUser d-flex gap-2 align-items-center">
9644                                        <span class="d-flex">
9645                                            <div style="display:none">
9646                                                autumn wind                                                <span class="post-creation-divider">•</span> 
9647                                            </div>
9648                                            <span class="post-creation-username notranslate">
9649                                                @autumnwind                                            </span>
9650                                        </span>
9651                                                                                <img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
9652                                                                            </h4>
9653                                    <div class="add-a-topic"><a href="javascript:void(0)" onclick="$('#add-topic-box').show();"><img src="https://www.jumpspree.com/public/images/add-topic.png" style="filter:invert()" alt="Add topic" title="Add topic"> Add a topic
9654                                            <i class="hgi hgi-stroke hgi-arrow-right-01"></i></a></div>
9655                                    <p class="currentUserName" style="display:none">
9656                                        @autumnwind                                    </p>
9657                                </div>
9658                            </div>
9659
9660                            <div class="drop-down-blog" style="display:none">
9661                                <a class="discard-button" href="javascript:void(0)" onclick="handleDiscardAction()">Discard</a>
9662                            </div>
9663                        </div>
9664                    </div> 
9665                    
9666                    <div id="gifModalForAddPost" class="gif-modal">
9667                        <div class="gif-modal-content">
9668                            <input type="text" id="gifSearchForAddPost" placeholder="Search GIFs">
9669                            <button style="opacity: 0;" id="gifSearchBtnForAddPost" class="search-icon-btn">
9670                                <i class="fa fa-search" aria-hidden="true"></i>
9671                            </button>
9672                            <div id="gifResults-outer">
9673                            <div id="gifResultsForAddPost" class="gif-list"></div>
9674                            </div>
9675                        </div>
9676                    </div>
9677                    
9678                    <div id="add-post-full-container">
9679                        <div class="add-post-inside-wrapper">
9680                            <div class="post-area-inside">
9681                                <div id="addPostTextarea" contenteditable="true"
9682                                    data-placeholder="What’s jumping in your head?" oninput="highlightText(this)"></div>
9683                                <div class="mention-popup" id="mention-popup"></div>
9684                                <div id="hashTags-popup" class="hashTags-popup"></div>
9685                            </div>
9686
9687                                <div id="repost-preview-container" style="display:none; margin-bottom: 20px; padding: 15px; background: rgba(255, 255, 255, 0.05); border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.1);">
9688                                    <div class="repost-preview-header" style="margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between;">
9689                                        <div style="font-size: 12px; color: #8d8c8c;">
9690                                            <i class="fa-solid fa-retweet" style="margin-right: 5px;"></i> Reposting this post
9691                                        </div>
9692                                        <button onclick="clearRepost()" style="background: none; border: none; color: #8d8c8c; cursor: pointer; font-size: 12px; padding: 2px 8px;">
9693                                            <i class="fa-solid fa-xmark"></i> Clear
9694                                        </button>
9695                                    </div>
9696                                    <div class="post-for-repost">
9697                                        <div class="fnc mt-0 justify-content-between mb-3 align-items-start">
9698                                            <div class="d-flex align-items-center">
9699                                                <div class="fig" style="width: 30px; height: 30px;">
9700                                                    <img id="currentpostprofile" src="" alt="Profile" style="border-radius:50%; width: 100%; height: 100%; object-fit: cover;">
9701                                                </div>
9702                                                <div class="fnc-title" style="margin-left: 10px;">
9703                                                    <h4 class="postUser" style="font-size: 14px; margin: 0; color: #fff;"></h4>
9704                                                    <p class="postUserName" style="font-size: 12px; margin: 0; color: #8d8c8c;"></p>
9705                                                </div>
9706                                            </div>
9707                                        </div>
9708                                        <div class="post-data">
9709                                            <p id="repost-preview-content" style="font-size: 14px;
9709 color: #e0e0e0; margin: 0; line-height: 1.4;"></p>
9710                                        </div>
9711                                    </div>
9712                                </div>
9713
9714                            <div class="image-preview-box" id="imagePreviewBox" style="display: none;">
9715                                <button style="display: none;" onclick="closePreview()" class="close-btn">&times;</button>
9716                                <div class="addpostImagePreview swiper mySwiper" id="imageCarousel">
9717                                    <div class="swiper-wrapper"></div>
9718                                    <div class="swiper-pagination"></div>
9719                                </div>
9720                            </div>
9721
9722                            <div class="video-preview-box" id="videoPreviewBox" style="display: none;">
9723                                <div class="video-preview" id="videoPreviewContainer">
9724                                    <div class="close-video-preview" onclick="closeVideoPreview()">&times;</div>
9725                                    <video id="videoPreview" controls>
9726                                        <source id="videoSource" src="" type="video/mp4">
9727                                    </video>
9728                                </div>
9729                            </div>
9730
9731                            <div class="gif-preview-box" id="gifPreviewBox" style="display: none;">
9732                                <div class="gif-preview" id="gifPreviewContainer">
9733                                    <div class="close-gif-preview" onclick="clearGifPreview()">&times;</div>
9734                                    <img id="gifPreviewAddPost" src="" alt="GIF">
9735                                </div>
9736                                <div style="display: none !important;" class="embed-and-alt d-flex">
9737                                    <div class="embed-link"><a href="javascript:void(0)"
9738                                            onclick="window.event.cancelBubble = true; $('#embed-link').addClass('show-embed-link');$('#add-alt-tag').removeClass('embed-in'); $('#add-alt-tag').removeClass('show-add-alt-tag'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');"><img
9739                                                src="https://www.jumpspree.com/public/images/copy-link.png"
9740                                                alt="Copy Link" title="Copy Link"> Embed
9741                                            link</a></div>
9742                                    <div class="add-alt-text"><a href="javascript:void(0)"
9743                                            onclick="window.event.cancelBubble = true; $('#add-alt-tag').addClass('show-add-alt-tag'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');$('#embed-link').removeClass('embed-in'); $('#embed-link').removeClass('show-embed-link');"><img
9744                                                src="https://www.jumpspree.com/public/images/alt.png" alt="Add alt text"
9745                                                title="Add alt text"> Add alt text</a>
9746                                    </div>
9747                                </div>
9748                            </div>
9749                        </div>
9750
9751                        
9752                        
9753
9754                        
9755
9756                        
9757                        <p class="typingondesktio" style="margin: 0;
9758                                text-align: left;
9759                                width: 100%;
9760                                font-size: 12px;
9761                                color: #8d8c8c;
9762                            margin-top: 0;position: static;bottom: 0;padding-left: 5px;margin-bottom: 1px;">
9763                            <small>Typing on desktop? <b>Shift + Return</b> to add a new line.</small>
9764                        </p>
9765                    </div>
9766                </div>
9767                
9768                
9769                
9770                
9771                
9772
9773                <div id="create-poll-main-box" style="display:none">
9774                    <div class="create-poll-wrrapper-main">
9775                        <div class="poll-created-by pb-2 pt-0">
9776                            <div class="fnc mt-0 justify-content-between mb-0">
9777                                <div class="d-flex flex1">
9778                                    <div class="fnc-title flex1">
9779                                        <textarea id="pollDescription"
9780                                            oninput="this.style.height = &quot;&quot;;this.style.height = this.scrollHeight + &quot;px&quot;"
9781                                            placeholder="What’s jumping in your head?"></textarea>
9782                                    </div>
9783                                </div>
9784                            </div>
9785                        </div>
9786
9787                        <div class="post-area-inside mb-0">
9788                            <div class="create-poll-option" id="pollOptionsContainer">
9789                                <div class="option">
9790                                    <input type="text" class="poll-option-input" placeholder="Option 1">
9791                                    <button class="delete-option" type="button" style="display: none;">
9792                                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete"
9793                                            title="Delete">
9794                                    </button>
9795                                </div>
9796                                <div class="option">
9797                                    <input type="text" class="poll-option-input" placeholder="Option 2">
9798                                    <button class="delete-option" type="button" style="display: none;">
9799                                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete"
9800                                            title="Delete">
9801                                    </button>
9802                                </div>
9803                                <div class="option add-another-option">
9804                                    <input type="text" id="newPollOptionInput" class="poll-option-input"
9805                                        placeholder="Add more">
9806                                    <button class="delete-option" type="button" style="display: none;">
9807                                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete"
9808                                            title="Delete">
9809                                    </button>
9810                                </div>
9811                            </div>
9812
9813                            <div class="poll-time d-flex justify-content-between">
9814                                <div class="end-poll hide">
9815                                    Ends in <input type="number" id="pollDuration" value="" min="1" max="336">h
9816                                </div>
9817                            </div>
9818
9819                            <div class="poll-ending-time">
9820                                <h3>How long will this poll last? <span class="tooltip-wrapper">i <span
9821                                            class="tooltip-wrapper-inner">
9822                                            Decide how long this poll will last. Once your poll ends, no one will be
9823                                            able to cast votes.</span></span></h3>
9824                                <ul>
9825                                    <li><button class="duration-btn selected">1 day</button></li>
9826                                    <li><button class="duration-btn">3 days</button></li>
9827                                    <li><button class="duration-btn">5 days</button></li>
9828                                    <li><button class="duration-btn">7 days</button></li>
9829                                    <li><button class="duration-btn">14 days</button></li>
9830                                </ul>
9831                            </div>
9832                            <div class="remove-poll"><a href="javascript:void(0)"
9833                                    onclick="$('#create-poll-main-box, #post-footer-for-poll').hide(); $('#post-footer-for-post').show(); $('#add-post-full-container').show();$('#discard-for-poll').hide(); $('#discard-for-post').show();">Remove
9834                                    poll</a>
9835                            </div>
9836                        </div>
9837                    </div>
9838                </div>
9839            </div>
9840            
9841            <div id="post-footer-for-poll" style="display:none">
9842                <div class="post-foot add-post-foot d-flex justify-content-between">
9843                    <div class="post-setting-box" id="post-setting-box">
9844                        
9845                        
9846                    </div>
9847
9848                    <div class="send-post">
9849                        <div class="character-count-container">
9850                            <span id="char-count-poll">260</span>
9851                            <div class="progress-circle">
9852                                <div class="progress-circle">
9853                                    <svg width="50" height="50">
9854                                        <circle class="bg" cx="25" cy="25" r="22"></circle>
9855                                        <circle class="progress" cx="25" cy="25" r="22"></circle>
9856                                    </svg>
9857                                </div>
9858                            </div>
9859                            <div id="submitPollForm" class="post-btn addPost-form-submit">
9860                                <a href="javascript:void(0)" onclick="" class=""><i style="color:#fff; opacity:0.5"
9861                                        class="hgi hgi-stroke hgi-time-schedule"></i></a>
9862                                <input type="hidden" id="scheduletime" value="">
9863                                <input type="hidden" id="scheduledate" value="">
9864                                <input type="hidden" id="scheduled" value="0">
9865                                <button type="button" id="createPollSubmit" class="blue-bg"><i
9866                                        class="fa-sharp fa-solid fa-paper-plane-top" aria-hidden="true"></i></button>
9867                            </div>
9868                        </div>
9869                    </div>
9870                </div>
9871            </div>
9872
9873            <div id="post-footer-for-post">
9874                <div class="post-foot add-post-foot d-flex justify-content-between">
9875                   
9876
9877                    <div class="send-post">
9878                        <div class="character-count-container">
9879                            <span id="char-count">260</span>
9880                            <div class="progress-circle">
9881                                <div class="progress-circle">
9882                                    <svg width="50" height="50">
9883                                        <circle class="bg" cx="25" cy="25" r="22"></circle>
9884                                        <circle class="progress" cx="25" cy="25" r="22"></circle>
9885                                    </svg>
9886                                </div>
9887                            </div>
9888                            <div id="submitBtnForm" style="width: 90px;" class="post-btn addPost-form-submit disabled">
9889                                <a href="javascript:void(0)"
9890                                    onclick="$('#social-popup > .add-post-inner').addClass('schedule-box-opened');$('.Schedule-message-wrapper').show();"><i
9891                                        class="hgi hgi-stroke hgi-time-schedule"></i></a>
9892                                <input type="hidden" id="scheduletime" value="">
9893                                <input type="hidden" id="scheduledate" value="">
9894                                <input type="hidden" id="scheduled" value="0">
9895                                <button id="addPost-form-submit"><i
9896                                        class="fa-sharp fa-solid fa-paper-plane-top"></i></button>
9897                            </div>
9898                        </div>
9899                    </div>
9900                </div>
9901            </div>
9902        </div>
9903
9904
9905
9906  
9907
9908        
9909
9910        
9911
9912        
9913
9914    </div>
9915
9916
9917</div>
9918-->
9919
9920
9921<style>
9922div#daily-post-limit-wrapper {
9923    position: fixed;
9924    background: #0000007a;
9925    z-index: 999999;
9926    height: 100vh;
9927    left: 0;
9928    right: 0;
9929    bottom: 0;
9930    top: 0;
9931        
9932}
9933.daily-limit-box {
9934    background: #2b2b2b;
9935    border: 1px solid #494949;
9936    margin: 0 78px 20px;
9937    border-radius: 45px;
9938    color: #999;
9939    padding: 28px;
9940    font-size: 12px;
9941    max-width: 450px;
9942    left: 50%;
9943    position: absolute;
9944    top: 50%;
9945    width: 450px;
9946    transform: translate(-50%, -50%);
9947}
9948.daily-limit-box{
9949    margin: 0 !important;
9950    
9951}
9952.daily-limit-box p {
9953    font-size: 13px;
9954    line-height: 17px;
9955    color: #ccc;
9956}
9957.daily-limit-box button {
9958    width: 100%;
9959    border: none;
9960    border-radius: 35px;
9961    padding: 14px 0;
9962    font-weight: 600;
9963    font-size: 14px;
9964}    
9965button.close-btn {
9966    background: #555;
9967    color: #fff;
9968    margin-top: 10px;
9969}
9970.plusicon img {
9971    width: 50px;
9972}    
9973.plusicon {
9974    margin-bottom: 20px;
9975}
9976#daily-post-limit-wrapper h3 {
9977    color: #fff;
9978    margin-bottom: 10px;
9979    font-size: 25px;
9980}   
9981</style>
9982<div id="daily-post-limit-wrapper" style="display:none">
9983        <div class="daily-limit-box"> 
9984            <div class="plusicon">
9985                    <img src="https://www.centrrl.com/public/web1901-assets/images/daily-post.png" alt="">
9986            </div>
9987            <h3>Daily posting limit</h3>
9988            <p>To maintain a high-quality public square and help prevent spam and abuse, new accounts are limited to 3 posts per day during their first 14 days. Accounts demonstrating authentic participation may have this limit removed sooner, while limits may remain in place for low-quality activity. You can remove posting restrictions permanently by getting your account verified with Centrrl+ Enhanced anytime.</p>
9989            
9990            <button type="button" class="upgrade-btn" onclick="window.location.href='https://www.jumpspree.com/jumpspree-more'">Upgrade</button>
9991            <button type="button" class="close-btn" onclick="$('#daily-post-limit-wrapper').fadeOut('fast')">Close</button>
9992        </div>
9993    </div>
9994
9995<!--
9996<div class="social-popup" id="launch">
9997    <div class="add-post-inner">
9998        <div class="live-soon">
9999            <div class="live-now-head">
10000                <img src="https://www.jumpspree.com/public/images/live-now.gif" alt="Jumpspree">
10001            </div>
10002            <div class="live-now-heading">
10003                <h3>Welcome to the all new <br>
10003Jumpspree web platform</h3>
10004            </div>
10005            <div class="live-now-body">
10006                <p>On 01/25, after months of tireless effort from our team, we’re excited to publicly launch the
10007                    Jumpspree web platform!</p>
10008                <p>As you explore the platform, please note that not all features from the Jumpspree app are currently
10009                    available on the web. Our team is working diligently to enhance the platform and will be rolling out
10010                    new features and functionalities in the coming weeks to ensure a seamless experience.</p>
10011                <p>We hope you enjoy the new web experience! If you have any feedback, feel free to send us a DM
10012                    @Jumpspree. We’d love to hear from you!</p>
10013
10014                <button type="button">Try it</button>
10015            </div>
10016        </div>
10017
10018    </div>
10019</div>
10020-->
10021
10022
10023<!--
10024<div class="get-app-qr-code-wrapper" id="getstart-popup" style="display: none;"> 
10025    <div class="email-verification after-login">
10026       <div class="close-getstart" onclick="$('#getstart-popup').fadeOut('fast');">&times;</div>
10027        <div class="email-box">
10028          <div class="getstart-icon">
10029                <img src="https://www.jumpspree.com/public/images/mob-icon.png" alt="Jumpspree">
10030           </div>
10031            <h4 class="text-center">Jumpspree works best <br>in the app.</h4>
10032
10033
10034            
10035
10036            
10037
10038            <div class="note-line">
10039                <p class="mb-0">Enjoy a premium experience with advanced <br>features and even more exciting content on <br>the Jumpspree app.</p>
10040            </div>
10041
10042           <div class="download-btn">
10043               <a  class="get-app-btn" href="javascript:void(0)" onclick="$('#getstart-popup').fadeOut('fast');$('#ios-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/ios-download.png" alt="Jumpspree"></a>
10044                <a  href="javascript:void(0)" onclick="$('#getstart-popup').fadeOut('fast');$('#android-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/download-android.png" alt="Jumpspree"></a>
10045            </div>
10046
10047
10048
10049        </div>
10050      
10051    </div>
10052</div>
10053-->
10054
10055
10056<div class="social-popup" id="activity">
10057    <div class="add-post-inner">
10058        <h3>Activity</h3>
10059        <div class="activity-wrapper">
10060            <div class="follow-inner">
10061                <div class="d-flex justify-content-between align-items-center fnc">
10062                    <div class="d-flex" style="flex-direction:column">
10063                        <div class="d-flex">
10064                            <div class="user-image">
10065                                <a href="https://www.jumpspree.com/Jumpspree" target="_blank">
10066                                    <img src="https://cubesnack-seller.s3.amazonaws.com/products/1109250220132879.jpg"
10067                                        alt="logo" title="logo">
10068                                    <span class="heart"><img
10069                                            src="https://www.jumpspree.com/public/images/pink-heart.png" alt="Like"
10070                                            title="Like"></span>
10071                                </a>
10072                            </div>
10073
10074
10075
10076                            <div class="user-name fnc-title">
10077
10078                                <h2><a href="#">Jumpspree
10079                                        <img src="https://www.jumpspree.com/public/images/blue-cube.png"
10080                                            class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
10081                                    </a></h2>
10082                                <p>@Jumpspree</p>
10083
10084
10085
10086                            </div>
10087                        </div>
10088                    </div>
10089
10090
10091
10092                    <div class="follow-btn"><a href="javascript:void(0)" id="rec2635">Follow</a></div>
10093
10094
10095
10096
10097
10098
10099
10100
10101
10102                </div>
10103            </div>
10104
10105            <div class="follow-inner">
10106                <div class="d-flex justify-content-between align-items-center fnc">
10107                    <div class="d-flex" style="flex-direction:column">
10108                        <div class="d-flex">
10109                            <div class="user-image">
10110                                <a href="https://www.jumpspree.com/Jumpspree" target="_blank">
10111                                    <img src="https://cubesnack-seller.s3.amazonaws.com/products/1109250220132879.jpg"
10112                                        alt="logo" title="logo">
10113                                    <span class="heart"><img src="https://www.jumpspree.com/public/images/talk.png"
10114                                            alt="Talk" title="Talk"></span>
10115                                </a>
10116                            </div>
10117
10118
10119
10120                            <div class="user-name fnc-title">
10121
10122                                <h2><a href="#">Pat Brown
10123                                        <img src="https://www.jumpspree.com/public/images/blue-cube.png"
10124                                            class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
10125                                    </a></h2>
10126                                <p>@patbrown</p>
10127
10128
10129
10130                            </div>
10131                        </div>
10132                    </div>
10133
10134
10135
10136                    <div class="follow-btn"><a href="javascript:void(0)" id="rec2635">Follow</a></div>
10137
10138
10139
10140
10141
10142
10143
10144
10145
10146                </div>
10147            </div>
10148        </div>
10149    </div>
10150</div>
10151
10152
10153<script>
10154var selectedImageFiles = []; // For image input
10155var imageIndex = 0; // Global index to maintain unique IDs across uploads
10156
10157function deleteOwnPostPoll(el, postId, feedType = 'post') {
10158    console.log("deleteOwnPostPoll :   " + feedType);
10159
10160
10161    $('#dpbtn').data('id', postId).data('feed', 1);
10162
10163    // Set the confirmation message
10164    document.getElementById('delete-confirmation-text').innerText = `Are you sure you want to delete this ${feedType}?`;
10165
10166    // ✅ Set cancel button text based on feed type
10167    const cancelBtn = document.getElementById('deleteCancleBtn');
10168    cancelBtn.innerText = feedType === 'poll' ? 'Keep it' : 'Cancel';
10169
10170    // Show modal
10171    $('#dp-confirmation').fadeIn('fast');
10172    $('.social-shadow').show();
10173    $('body').addClass('overflow-hidden');
10174}
10175
10176function socialFeedDeletePost(el, postId, feedType = 'post') {
10177    console.log("socialFeedDeletePost____________" + feedType);
10178
10179
10180    $('#dpbtn').data('id', postId).data('feed', 1);
10181
10182    // Set the confirmation message
10183    document.getElementById('delete-confirmation-text').innerText = `Are you sure you want to delete this ${feedType}?`;
10184
10185    // ✅ Set cancel button text based on feed type
10186    const cancelBtn = document.getElementById('deleteCancleBtn');
10187    cancelBtn.innerText = feedType === 'poll' ? 'Keep it' : 'Cancel';
10188
10189    // Show modal
10190    $('#dp-confirmation').fadeIn('fast');
10191    $('.social-shadow').show();
10192    $('body').addClass('overflow-hidden');
10193}
10194
10195
10196function deleteUserPost() {
10197    const postId = $('#dpbtn').data('id');
10198    const feed = $('#dpbtn').data('feed');
10199    const $btn = $('#dpbtn');
10200    const originalHTML = $btn.html();
10201
10202    $.ajax({
10203        url: base_url + '/deleteUserPost',
10204        type: 'POST',
10205        data: {
10206            postId: postId
10207        },
10208        dataType: "json",
10209        beforeSend: function() {
10210            $btn.html('<span class="jloader"></span>');
10211        },
10212        success: function(response) {
10213            const msg = response.message;
10214
10215            $('#dp-confirmation').fadeOut('fast');
10216            $('body').removeClass('overflow-hidden');
10217            $btn.html('Delete');
10218            if (response.status) {
10219                showNotification('success', msg);
10220                if (feed == '1') {
10221                    $('.dp' + postId).fadeOut('fast');
10222                } else {
10223                    window.location.href = base_url + 'social';
10224                }
10225            } else {
10226                showNotification('error', msg);
10227                $btn.html(originalHTML); // ✅ Restore button text on failure
10228            }
10229        },
10230        error: function() {
10231            $('#dp-confirmation').fadeOut('fast');
10232            $btn.html(originalHTML); // ✅ Restore on AJAX error
10233        }
10234    });
10235}
10236
10237
10238document.addEventListener('DOMContentLoaded', function() {
10239    const textarea = document.getElementById('altTextInput');
10240    const counter = document.getElementById('altTextLiveCounter');
10241    const saveBtn = document.getElementById('saveAltTextButton');
10242
10243    function updateUI() {
10244        const length = textarea.value.length;
10245
10246        // Clamp text if too long
10247        if (length > 1000) {
10248            textarea.value = textarea.value.slice(0, 1000);
10249        }
10250
10251        const currentLength = textarea.value.length;
10252        counter.textContent = `${currentLength}/1000`;
10253
10254        const isEnabled = currentLength > 0 && currentLength <= 1000;
10255
10256        saveBtn.disabled = !isEnabled;
10257
10258        // Toggle classes
10259        saveBtn.classList.toggle('buttonEnabled', isEnabled);
10260        saveBtn.classList.toggle('buttonDisabled', !isEnabled);
10261    }
10262
10263    textarea.addEventListener('input', updateUI);
10264
10265    // Initial state on page load
10266    updateUI();
10267});
10268//end counter    
10269$('#social-popup .add-post-inner').click(function() {
10270    $('#post-setting-dropup').removeClass('show-popup');
10271})
10272
10273
10274
10275
10276
10277// new May 26 poll added in draft 
10278function appendDrafts(drafts) {
10279
10280    const previewBox2 = document.getElementById('imagePreviewBox');
10281    if (previewBox2) {
10282        previewBox2.style.display = 'none';
10283    }
10284
10285    const draftContainer = $('#draft-container');
10286    draftContainer.empty();
10287    drafts = drafts.filter(d => d.is_blog != "1"); // ❌ Exclude article drafts (is_blog == "1")
10288    console.log("appendDrafts called with drafts:", drafts);
10289
10290    drafts.forEach((draft, index) => {
10291        const postText = draft.postText || draft.postTitle || "";
10292        const postDate = draft.pdate || "N/A";
10293        const postTime = draft.ptime || "N/A";
10294        const postId = draft.postId || "N/A";
10295        const postorpoll = draft.is_blog == 2 ? 'classpoll' : 'classpost';
10296
10297        const draftHtml = `
10298            <div id="draftDiv-${postId}" class="drafts ${postorpoll}" data-index="${index}">
10299                <div class="poll-head-pop">
10300                    <label class="${postorpoll}">Poll</label>
10301                    <p id="draftCTextClick-${postId}" class="draftPostText">${postText}</p>
10302                </div>
10303                
10304                ${draft.postFiles && draft.postFiles.length > 0 ? appendMedia(draft.postFiles) : ''}
10305
10306                <div class="draftPostText-and-del d-flex justify-content-between">
10307                    <p class="draftDateTime">
10308                        <span>${postDate}</span>
10309                        <span> &bull; </span>
10310                        <span>${postTime}</span>
10311                    </p> 
10312                    <p onclick="window.event.cancelBubble = true; deleteAllDraftsSingle('${postId}')" class="delete-draft">
10313                        <a href="#"><i class="hgi hgi-stroke hgi-delete-02"></i></a>
10314                    </p> 
10315                </div>
10316            </div>
10317        `;
10318        draftContainer.append(draftHtml);
10319    });
10320
10321    function appendMedia(postMedia) {
10322
10323        if (!postMedia) {
10324            return '';
10325        }
10326
10327        const count = postMedia.length;
10328
10329        if (count === 0) {
10330            return '';
10331        }
10332
10333        let div = '';
10334        const id = Math.floor(100000 + Math.random() * 900000);
10335
10336        if (count > 1) {
10337
10338            div = `<div class="swiper mySwiper">
10339                            <div class="swiper-wrapper mtw-images Vertical">
10340
10341                                ${postMedia.map((img) => `
10342                                    <div class="swiper-slide">
10343                                        <a href="javascript:void(0);">
10344                                            <img width="300" height="300" loading="lazy" src="${img.imagepath}" alt="Post Image">
10345                                        </a>
10346                                    </div>
10347
10348                                `).join('')}
10349    
10350                            </div>
10351                            <div class="swiper-pagination"></div>
10352                        </div>`;
10353        } else {
10354
10355            if(Number(postMedia[0].type) === 2){
10356
10357                div = `
10358                        <div class="single-image">
10359                            <video autoplay muted playsinline controls width="640" height="360">
10360                                <source src="javascript:void(0);" type="video/mp4">
10361                                Your browser does not support the video tag.
10362                            </video>
10363                        </div>
10364                    `;
10365        
10366
10367            }else{
10368                div = `
10369                        <div class="single-image">
10370                            <a href="javascript:void(0);">
10371                                <img width="300" height="300" loading="lazy" src="${postMedia[0].imagepath}" alt="Post Image" title="">
10372                            </a>
10373                        </div>
10374                    `;
10375            }   
10376
10377        }
10378
10379        return `<div class="draft-media-div">${div}</div>`;
10380    }
10381
10382    // $('.addpostImagePreview').owlCarousel({
10383    //     loop: false,
10384    //     margin: 10,
10385    //     nav: false,
10386    //     dots: true,
10387    //     autoplay: false,
10388    //     responsive: {
10389    //         0: { items: 1 },
10390    //         600: { items: 1 },
10391    //         1000: { items: 1 },
10392    //     },
10393    // });
10394
10395    draftContainer.off('click', '.drafts');
10396
10397
10398    draftContainer.on('click', '.drafts', function() {
10399        const index = $(this).data('index');
10400        const selectedDraft = drafts[index];
10401
10402        if (selectedDraft.is_blog == 2) {
10403            // Show poll UI
10404            $('#create-poll-main-box').show();
10405            $('#add-post-full-container').hide(); // Hide post UI
10406            $('#post-footer-for-post').hide();
10407            $('#post-footer-for-poll').show();
10408            $('#discard-for-post').hide();
10409            $('#discard-for-poll').show();
10410
10411            // Prefill poll description
10412            $('#pollDescription').val(decodeHTMLEntities(selectedDraft.postTitle || selectedDraft.postText));
10413
10414            // Clear old poll options
10415            // Clear all previous poll options (except the add button)
10416            $('#pollOptionsContainer .option').not('.add-another-option').remove();
10417
10418
10419            // Set poll duration button
10420            const poll_duration = selectedDraft.poll_duration || 1440;
10421            const days = Math.round(poll_duration / 1440);
10422            const validDurations = [1, 3, 5, 7, 14];
10423            const selectedDay = validDurations.includes(days) ? days : 1;
10424
10425            $('.duration-btn').removeClass('selected');
10426            $('.duration-btn').each(function() {
10427                if ($(this).text().includes(`${selectedDay} day`)) {
10428                    $(this).addClass('selected');
10429                }
10430            });
10431
10432            // Append poll options (or 2 default empty ones if none exist)
10433            const pollOptions = selectedDraft.poll_options || [];
10434
10435            if (pollOptions.length > 0) {
10436                pollOptions.forEach((opt, idx) => {
10437                    const optionHTML = `
10438                        <div class="option">
10439                            <input type="text" class="poll-option-input" value="${opt.option || ''}" placeholder="Option ${idx + 1}">
10440                            <button class="delete-option" type="button" style="display: none;">
10441                                <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
10442                            </button>
10443                        </div>
10444                    `;
10445                    $('.add-another-option').before(optionHTML);
10446                });
10447            } else {
10448                for (let i = 0; i < 2; i++) {
10449                    const optionHTML = `
10450                        <div class="option">
10451                            <input type="text" class="poll-option-input" placeholder="Option ${i + 1}">
10452                            <button class="delete-option" type="button" style="display: none;">
10453                                <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
10454                            </button>
10455                        </div>
10456                    `;
10457                    $('.add-another-option').before(optionHTML);
10458                }
10459            }
10460
10461            // Set post type
10462            $('#postType').val('poll');
10463
10464            // ✅ Validate poll and toggle button
10465            validatePollSubmission();
10466
10467        } else {
10468            // Show post UI
10469            $('#add-post-full-container').show();
10470            $('#create-poll-main-box').hide();
10471            $('#post-footer-for-post').show();
10472            $('#post-footer-for-poll').hide();
10473            $('#discard-for-post').show();
10474            $('#discard-for-poll').hide();
10475
10476            // $('#postTextArea').val(selectedDraft.postText || '');
10477            $('#addPostTextarea').html(decodeHTMLEntities(selectedDraft.postText || ''));
10478
10479            $('#postType').val('post');
10480
10481            // Textarea default check
10482            if ($('#addPostTextarea').text().trim() !== '') {
10483                $('.addPost-form-submit').removeClass('disabled').addClass('active');
10484            } else {
10485                $('.addPost-form-submit').addClass('disabled').removeClass('active');
10486            }
10487
10488            // Event listener for post textarea
10489            $('#addPostTextarea').on('input', function() {
10490                const hasText = $(this).val().trim() !== '';
10491                const hasImage = $('#imageInput-repost')[0].files.length > 0;
10492                const hasVideo = $('#videoInput-repost')[0].files.length > 0;
10493                const hasGif = $('#gifPreviewBox').is(':visible') && $('#gifPreviewAddPost').attr(
10494                'src');
10495
10496                if (hasText || hasImage || hasVideo || hasGif) {
10497                    $('.addPost-form-submit').removeClass('disabled').addClass('active');
10498                } else {
10499                    $('.addPost-form-submit').addClass('disabled').removeClass('active');
10500                }
10501            });
10502
10503            // Handle media preview
10504            const files = selectedDraft.postFiles || [];
10505            // const imageCarousel = $('.addpostImagePreview');
10506            const imageCarousel = $('#imageCarousel');
10507
10508            const previewBox = $('#imagePreviewBox');
10509
10510            $('#videoSource').attr('src', '');
10511            $('#videoPreviewBox').hide();
10512            $('#gifPreviewAddPost').attr('src', '');
10513            $('#gifPreviewBox').hide();
10514
10515            // imageCarousel.trigger('destroy.owl.carousel');
10516            // imageCarousel.empty();
10517
10518            if (swiperInstance && imageCarousel.hasClass('swiper-loaded')) {
10519                imageCarousel.removeClass('swiper-loaded');
10520                swiperInstance.removeAllSlides();
10521                swiperInstance.slideTo(0, 0);
10522                swiperInstance.update();
10523            }
10524
10525
10526            previewBox.hide();
10527
10528            if (files.length > 0) {
10529                files.forEach((file, index) => {
10530                    if (file.type === '1') {
10531
10532                        selectedImageFiles.push({ index, file });
10533
10534                        const imageItem = `
10535                            <div id="image-preview-${index}" class="swiper-slide item" data-index="${index}">
10536                                <button onclick="closeThisImg(this)" class="close-btn closeThisImg"><svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-lrvibr r-m6rgpd r-1hjwoze r-12ym1je" style="color: rgb(255, 255, 255);margin: 0;filter: invert(1);"><g><path d="M10.59 12L4.54 5.96l1.42-1.42L12 10.59l6.04-6.05 1.42 1.42L13.41 12l6.05 6.04-1.42 1.42L12 13.41l-6.04 6.05-1.42-1.42L10.59 12z"></path></g></svg></button>
10537
10538                                <img class="multi-image-wrapper" src="${file.imagepath}" alt="${file.alttext || 'Uploaded Image'}" style="width: 100%; height: auto;"
10539                                    data-embeded-link="${file.link || ''}" data-alt="${file.alttext || ''}" />
10540                                <div class="embed-and-alt d-flex mt-3">
10541                                    <div class="embed-link">
10542                                        <a href="javascript:void(0)" onclick="openEmbedLinkPopup(event, ${index})">
10543                                            <i class="hgi hgi-stroke hgi-link-05"></i>
10544                                        </a>
10545                                    </div>
10546                                    <div class="add-alt-text">
10547                                        <a href="javascript:void(0)" onclick="openAltTextPopup(event, ${index})">
10548                                             <span class="alt-icon">Alt</span>
10549                                        </a>
10550                                    </div>
10551                                </div>
10552                            </div>`;
10553                        // imageCarousel.append(imageItem);
10554                        swiperInstance.appendSlide(imageItem);
10555
10556                    } else if (file.type == '2') {
10557                        $('#videoSource').attr('src', file.imagepath);
10558                        const videoElement = $('#videoPreview')[0];
10559                        videoElement.load();
10560                        videoElement.play();
10561                        $('#videoPreviewBox').show();
10562                    } else if (file.type == '3') {
10563                        $('#gifPreviewAddPost').attr('src', file.imagepath);
10564                        $('#gifPreviewBox').show();
10565                    }
10566                });
10567
10568                setTimeout(() => {
10569                    const imgFilesCount = files.filter(file => file.type === '1').length;
10570                    if (imgFilesCount > 1) {
10571                        // imageCarousel.addClass('owl-carousel owl-theme');
10572                        // imageCarousel.owlCarousel({
10573                        //     loop: false,
10574                        //     margin: 10,
10575                        //     nav: false,
10576                        //     dots: true,
10577                        //     autoplay: false,
10578                        //     responsive: {
10579                        //         0: { items: 1 },
10580                        //         600: { items: 1 },
10581                        //         1000: { items: 1 },
10582                        //     },
10583                        // });
10584
10585                        imageCarousel.addClass('swiper-loaded');
10586                        swiperInstance.update();
10587
10588                    } else {
10589                        $('.addpostImagePreview').removeClass('owl-carousel owl-theme');
10590                        $('#imagePreviewBox').addClass('single-image-preview');
10591                    }
10592
10593                    if(imgFilesCount > 0) {
10594                        modfiyImgCountClass(imgFilesCount);
10595                        imageIndex = imgFilesCount+1;
10596                    } 
10597
10598                    previewBox.show();
10599                }, 500);
10600            }
10601        }
10602
10603        $('#draft-box').hide();
10604        $('#social-popup .add-post-inner').removeClass('draft-open');
10605    });
10606
10607
10608
10609    // submitBtnForm
10610    // ✅ Poll validation function
10611
10612
10613    // ✅ Attach real-time validation for poll input fields
10614    $('#pollDescription').on('input', validatePollSubmission);
10615    $('#pollOptionsContainer').on('input', '.poll-option-input', validatePollSubmission);
10616
10617
10618
10619}
10620
10621//for article  
10622
10623function appendArticleDrafts(drafts) {
10624    console.log(drafts);
10625    const previewBox2 = document.getElementById('imagePreviewBox');
10626    if (previewBox2) {
10627        previewBox2.style.display = 'none';
10628    }
10629
10630    const draftContainer = $('#draft-container-article');
10631    draftContainer.empty();
10632
10633    // Check if drafts array is empty
10634    if (!drafts || drafts.length === 0) {
10635        draftContainer.html(`
10636            <div class="no-drafts-article">
10637                <p>No drafts available</p>
10638            </div>
10639        `);
10640        return; // Exit early
10641    }
10642
10643
10644    drafts.forEach((draft, index) => {
10645        const postText = draft.postTitle || "N/A";
10646        const postDate = draft.pdate || "N/A";
10647        const postTime = draft.ptime || "N/A";
10648        const postId = draft.postId || "N/A";
10649        const postorpoll = draft.is_blog == 2 ? 'classpoll' : 'classpost';
10650
10651        const draftHtml = `
10652            <div id="draftDiv-${postId}" class="drafts ${postorpoll}" data-index="${index}">
10653                <div class="poll-head-pop">
10654                    <label class="${postorpoll}">${draft.is_blog == 2 ? 'Poll' : 'Article'}</label>
10655                    <p id="draftCTextClick-${postId}" class="draftPostText">${postText}</p>
10656                </div>
10657                <div class="draftPostText-and-del d-flex justify-content-between">
10658                    <p class="draftDateTime">
10659                        <span>${postDate}</span>
10660                        <span> &bull; </span>
10661                        <span>${postTime}</span>
10662                    </p> 
10663                    <p onclick="window.event.cancelBubble = true; deleteAllDraftsSingle('${postId}')" class="delete-draft">
10664                        <a href="#"><i class="hgi hgi-stroke hgi-delete-02"></i></a>
10665                    </p> 
10666                </div>
10667            </div>
10668        `;
10669        draftContainer.append(draftHtml);
10670    });
10671
10672    draftContainer.off('click', '.drafts');
10673
10674    draftContainer.on('click', '.drafts', function() {
10675        const index = $(this).data('index');
10676        const selectedDraft = drafts[index];
10677
10678        // Reset form first
10679        $('#article-title').val('');
10680        $('#article-image').val('');
10681        // $('#image-preview').hide().empty();
10682        articleImageFile = null;
10683        hashtags = [];
10684        mentionedUsers = [];
10685        $('#hashtag-list').empty();
10686        $('#mention-list').empty();
10687        $('#hashtags-container').empty();
10688        $('#mentions-container').empty();
10689        $('#article-content-preview').empty();
10690        $('#scheduled_date').val('');
10691        $('#scheduled_time').val('');
10692        $('#scheduleBox').hide();
10693        // $('#imageInfo').hide(); // hide image imageInfo when image was bind 
10694
10695
10696        $('.write-your-article').hide();
10697        // Set title
10698        $('#article-title').val(selectedDraft.postTitle || '');
10699
10700        // Set content in Quill editor
10701        if (selectedDraft.postText) {
10702            if (quillInstance) {
10703                quillInstance.root.innerHTML = selectedDraft.postText;
10704            }
10705            // Also set in preview
10706            $('#article-content-preview').html(selectedDraft.postText);
10707            $('#article-preview').show();
10708        }
10709
10710        // Set image if available
10711        if (selectedDraft.postFiles && selectedDraft.postFiles.length > 0) {
10712            const imgFile = selectedDraft.postFiles.find(f => f.type == '1');
10713            if (imgFile) {
10714
10715
10716                $('#preview-img').attr('src', imgFile.imagepath);
10717                $('#image-preview').show();
10718                $('#imageInfo').hide();
10719                // Set up remove image button
10720                /* $('#remove-image-btn').on('click', function(e) {
10721                    e.preventDefault(); 
10722                    $('#imageInfo').show(); 
10723                    $('#image-preview').hide().empty();
10724                    $('#article-image').val('');
10725                    articleImageFile = null;
10726                }); */
10727            }
10728        }
10729
10730        // Restore hashtags
10731        if (selectedDraft.hashtags) {
10732            hashtags = selectedDraft.hashtags.split(' ').filter(tag => tag.trim() !== '');
10733            hashtags.forEach((tag, index) => {
10734                if (tag.startsWith('#')) {
10735                    tag = tag.substring(1);
10736                }
10737                $('#hashtags-container').append(`
10738                    <span class="tag tag-hashtag">
10739                        #${tag}
10740                        <span class="remove-tag" onclick="removeHashtag(${index})">&times;</span>
10741                    </span>
10742                `);
10743            });
10744        }
10745
10746        // Restore mentions
10747        if (selectedDraft.mentions) {
10748            mentionedUsers = selectedDraft.mentions.split('@')
10749                .map(user => user.trim())
10750                .filter(user => user !== '');
10751
10752            mentionedUsers.forEach((user, index) => {
10753                $('#mentions-container').append(`
10754                    <span class="tag tag-mention">
10755                        @${user}
10756                        <span class="remove-tag" onclick="removeMention(${index})">&times;</span>
10757                    </span>
10758                `);
10759            });
10760        }
10761
10762        // Restore scheduled date/time if available
10763        if (selectedDraft.scheduledate && selectedDraft.scheduletime) {
10764            $('#scheduled_date').val(selectedDraft.scheduledate);
10765            $('#scheduled_time').val(selectedDraft.scheduletime);
10766
10767            // Format and show the schedule box
10768            const formattedDate = new Date(`${selectedDraft.scheduledate} ${selectedDraft.scheduletime}`)
10769                .toLocaleString();
10770            $('#scheduledText').text(`Scheduled for ${formattedDate}`);
10771            $('#scheduleBox').show();
10772        }
10773
10774        // Show the article form and hide other views
10775        $('.draftListPopup').hide();
10776        $('#add-post-full-container').hide();
10777        $('#create-poll-main-box').hide();
10778        $('#article-box').show();
10779
10780        // Show the post actions
10781        $('#post-actions').show();
10782
10783        // Update title counter
10784        $('#title-counter').text(`${selectedDraft.postTitle ? selectedDraft.postTitle.length : 0}/100`);
10785    });
10786}
10787
10788
10789
10790function validatePollSubmission() {
10791    const descFilled = $('#pollDescription').val().trim() !== '';
10792    const filledOptions = $('#pollOptionsContainer .poll-option-input').filter(function() {
10793        return $(this).val().trim() !== '';
10794    }).length;
10795
10796    if (descFilled && filledOptions >= 2) {
10797        $('#submitBtnForm').removeClass('disabled').addClass('active');
10798        $('#submitPollForm').removeClass('disabled').addClass('active');
10799        $('#createPollSubmit').removeClass('disabled').addClass('activated');
10800    } else {
10801        $('#submitBtnForm').addClass('disabled').removeClass('active');
10802        $('#submitPollForm').addClass('disabled').removeClass('active');
10803        $('#createPollSubmit').addClass('disabled').removeClass('activated');
10804    }
10805}
10806
10807
10808
10809// new on jun 24
10810function getAllMyDrafts() {
10811    const deleteAllDraftBtn = document.getElementById('deleteAllDraftBtn');
10812
10813    $.ajax({
10814        url: base_url + '/getAllDraftByToken',
10815        type: 'GET',
10816        dataType: "Json",
10817        success: function(response) {
10818            $('#loader').hide();
10819            setTimeout(() => {
10820                $('#skeleton-container').hide(); // Hide skeleton loader after 2 seconds
10821            }, 2000);
10822
10823            if (response.status) {
10824                const drafts = response.draftArray || [];
10825
10826                const articleDrafts = drafts.filter(d => d.is_blog == "1");
10827                const otherDrafts = drafts.filter(d => d.is_blog != "1");
10828
10829                if (drafts.length > 0) {
10830                    deleteAllDraftBtn.style.display = 'block';
10831
10832                    if (articleDrafts.length > 0) {
10833                        appendArticleDrafts(articleDrafts);
10834                    } else {
10835                        $('#draft-container-article').html(`
10836                            <div class="no-drafts-article">
10837                                <p>No drafts available</p>
10838                            </div>
10839                        `);
10840                    }
10841
10842                    if (otherDrafts.length > 0) {
10843                        appendDrafts(otherDrafts);
10844                    } else {
10845                        $('#draft-container').html(`
10846                            <div class="no-drafts-post">
10847                                <p>No drafts available</p>
10848                            </div>
10849                        `);
10850                    }
10851                } else {
10852                    deleteAllDraftBtn.style.display = 'none';
10853
10854                    // No drafts at all
10855                    $('#draft-container-article').html(`
10856                        <div class="no-drafts-article">
10857                            <p>No drafts available</p>
10858                        </div>
10859                    `);
10860                    $('#draft-container').html(`
10861                        <div class="no-drafts-post">
10862                            <p>No drafts available</p>
10863                        </div>
10864                    `);
10865                }
10866
10867            } else {
10868                // Handle failed status if needed
10869            }
10870        },
10871        error: function(xhr, status, error) {
10872            $('#loader').hide();
10873            console.error("Error fetching drafts:", error);
10874        }
10875    });
10876}
10877
10878
10879
10880
10881
10882var swiperInstance = null;
10883document.addEventListener('DOMContentLoaded', function() {
10884    swiperInstance = new Swiper("#imageCarousel", {
10885        slidesPerView: 'auto',
10886        spaceBetween: 15,
10887        freeMode: true,
10888        pagination: {
10889            el: ".swiper-pagination",
10890            clickable: true,
10891        },
10892        breakpoints: {
10893            // When window width is <= 767px (mobile)
10894            0: {
10895                spaceBetween: 10,
10896            }
10897        }
10898    });
10899});
10900
10901
10902$(document).ready(function() {
10903
10904    // BOOT: defer getAllDraftByToken until after feed renders — 2026-05-15
10905    // ROLLBACK: replace the line below with: getAllMyDrafts();
10906    window.JumpSocialBoot ? window.JumpSocialBoot.defer(getAllMyDrafts, 'medium') : getAllMyDrafts();
10907
10908    let isCarouselInitialized = false;
10909    let imageDetails = [];
10910
10911
10912    $('#imageInput').on('change', function(event) {
10913        const files = event.target.files;
10914        const imageCarousel = $('#imageCarousel');
10915        const previewBox = $('#imagePreviewBox');
10916
10917        clearPreviews(true);
10918
10919        if (files.length > 0) {
10920            $('.addPost-form-submit')
10921                .removeClass('disabled')
10922                .addClass('active');
10923
10924
10925            Array.from(files).forEach((file) => {
10926                const reader = new FileReader();
10927                reader.onload = function(e) {
10928                    const originalDataUrl = e.target.result;
10929
10930                    function renderPreview(compressedFile, previewSrc) {
10931                        const currentIndex = imageIndex++;
10932                        selectedImageFiles.push({ index: currentIndex, file: compressedFile });
10933                        const imageItem = `
10934                            <div id="image-preview-${currentIndex}" class="swiper-slide item" data-index="${currentIndex}">
10935                                <button onclick="closeThisImg(this)" class="close-btn closeThisImg"><svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-lrvibr r-m6rgpd r-1hjwoze r-12ym1je" style="color: rgb(255, 255, 255);margin: 0;filter: invert(1);"><g><path d="M10.59 12L4.54 5.96l1.42-1.42L12 10.59l6.04-6.05 1.42 1.42L13.41 12l6.05 6.04-1.42 1.42L12 13.41l-6.04 6.05-1.42-1.42L10.59 12z"></path></g></svg></button>
10936                                <img id="preview-img-${currentIndex}" class="multi-image-wrapper" src="${previewSrc}" alt="Uploaded Image" style="width: 100%; height: auto;"
10937                                    data-embeded-link="" data-alt
10937="Jumpspree" />
10938                                <div class="embed-and-alt d-flex mt-3">
10939                                    <div class="embed-link">
10940                                        <a href="javascript:void(0)" onclick="openEmbedLinkPopup(event, ${currentIndex})">
10941                                            <i class="hgi hgi-stroke hgi-link-05"></i>
10942                                        </a>
10943                                    </div>
10944                                    <div class="add-alt-text">
10945                                        <a href="javascript:void(0)" onclick="openAltTextPopup(event, ${currentIndex})">
10946                                            <span class="alt-icon">Alt</span>
10947                                        </a>
10948                                    </div>
10949                                </div>
10950                            </div>`;
10951                        swiperInstance.appendSlide(imageItem);
10952                    }
10953
10954                    // GIFs skip compression (canvas would strip animation)
10955                    if (file.type === 'image/gif') {
10956                        renderPreview(file, originalDataUrl);
10957                        return;
10958                    }
10959
10960                    // Compress via canvas: resize to max 1920px, export as JPEG 82% quality
10961                    const img = new Image();
10962                    img.onload = function() {
10963                        const MAX = 1920;
10964                        let w = img.width, h = img.height;
10965                        if (w > MAX) { h = Math.round(h * MAX / w); w = MAX; }
10966                        if (h > MAX) { w = Math.round(w * MAX / h); h = MAX; }
10967                        const canvas = document.createElement('canvas');
10968                        canvas.width = w;
10969                        canvas.height = h;
10970                        canvas.getContext('2d').drawImage(img, 0, 0, w, h);
10971                        canvas.toBlob(function(blob) {
10972                            const compressed = new File(
10973                                [blob],
10974                                file.name.replace(/\.[^.]+$/, '.jpg'),
10975                                { type: 'image/jpeg', lastModified: Date.now() }
10976                            );
10977                            renderPreview(compressed, URL.createObjectURL(compressed));
10978                        }, 'image/jpeg', 0.82);
10979                    };
10980                    img.src = originalDataUrl;
10981                };
10982                reader.readAsDataURL(file);
10983            });
10984
10985            // Show the preview box after a slight delay to ensure layout renders
10986            setTimeout(() => {
10987                previewBox.show();
10988                imageCarousel.addClass('swiper-loaded');
10989                swiperInstance.update();
10990                modfiyImgCountClass(selectedImageFiles.length);
10991                // imageCarousel.trigger('refresh.owl.carousel');
10992            }, 300);
10993        } else {
10994            $('.addPost-form-submit')
10995                .addClass('disabled')
10996                .removeClass('active');
10997        }
10998    });
10999
11000
11001});
11002
11003function closeThisImg(btn) {
11004    const $slide = $(btn).closest('.swiper-slide.item');
11005    const index = $slide.attr('data-index');
11006
11007    selectedImageFiles = selectedImageFiles.filter(f => Number(f.index) !== Number(index));
11008    console.log(selectedImageFiles);
11009
11010    $('#image-preview-' + index).remove();
11011
11012    const count = $('#imageCarousel .swiper-wrapper').children('div').length;
11013    modfiyImgCountClass(count);
11014
11015    if (count === 0) {
11016        closePreview();
11017    }else{
11018        setTimeout(() => {
11019            swiperInstance.update();
11020        }, 300);
11021    }
11022} 
11023
11024function modfiyImgCountClass(count){
11025    const div = $('#imageCarousel .swiper-wrapper');
11026
11027    div.removeClass('singleImage-added');
11028    div.removeClass('double-imageadded');
11029    div.removeClass('multiple-imageadded');
11030
11031    if(count === 1){
11032        div.addClass('singleImage-added');
11033    }else if(count === 2){
11034        div.addClass('double-imageadded');
11035    }else if(count > 2){
11036        div.addClass('multiple-imageadded');
11037    }
11038}
11039
11040function checkButtonEnableDisabled() {
11041    // Check media + text status
11042    // let postText = $('#addPostTextarea').val().trim();
11043    let postText = $('#addPostTextarea').text().trim();
11044    const imageInput = document.getElementById('imageInput');
11045    const videoInput = document.getElementById('videoInput');
11046    const gifBox = document.getElementById('gifPreviewBox');
11047    const gifPreview = document.getElementById('gifPreviewAddPost');
11048
11049    const hasImage = imageInput && imageInput.files.length > 0;
11050    const hasVideo = $('#videoSource').attr('src')?.trim() !== '';
11051    //const hasVideo = videoInput && videoInput.files.length > 0;
11052    const hasGif = gifBox && gifBox.style.display !== 'none' && gifPreview && gifPreview.getAttribute('src');
11053
11054    const shouldEnable = postText.length > 0 || hasImage || hasVideo || hasGif;
11055
11056    console.log("cleared: postText =", postText);
11057    console.log("hasImage:", hasImage, "| hasVideo:", hasVideo, "| hasGif:", hasGif);
11058    console.log("Button should be enabled after clearing?", shouldEnable);
11059
11060    if (shouldEnable) {
11061        $('.addPost-form-submit').removeClass('disabled').addClass('active');
11062    } else {
11063        $('.addPost-form-submit').removeClass('active').addClass('disabled');
11064    }
11065}
11066
11067
11068// Define the function in the global scope
11069function closePreview_old_17Jun() {
11070    const imageCarousel = document.getElementById('imageCarousel'); // Carousel container
11071    const previewBox = document.getElementById('imagePreviewBox'); // Preview box
11072    const fileInput = document.getElementById('imageInput'); // File input
11073
11074    console.log("Close button clicked");
11075
11076
11077    // Clear the carousel content
11078    if (imageCarousel) {
11079        imageCarousel.innerHTML = ''; // Clear all items
11080    }
11081
11082    // Hide the preview box
11083    if (previewBox) {
11084        previewBox.style.display = 'none'; // Hide the preview box
11085    }
11086
11087    // Reset the file input
11088    if (fileInput) {
11089        fileInput.value = ''; // Reset the input
11090    }
11091    //clearAllImageSources(); try on 17 jun 
11092    checkButtonEnableDisabled();
11093
11094}
11095
11096function closePreview() {
11097    const $imageCarousel = $('#imageCarousel');
11098    const previewBox = document.getElementById('imagePreviewBox');
11099    const fileInput = document.getElementById('imageInput');
11100
11101    console.log("Close button clicked");
11102
11103    // Destroy Owl Carousel properly before clearing
11104    if ($imageCarousel.hasClass('owl-loaded')) {
11105        $imageCarousel.trigger('destroy.owl.carousel');
11106        $imageCarousel.removeClass('owl-loaded owl-carousel owl-theme');
11107        $imageCarousel.find('.owl-stage-outer').children().unwrap(); // unwrap inner structure
11108        $imageCarousel.html(''); // Clear all items
11109    }
11110
11111    if (swiperInstance && $imageCarousel.hasClass('swiper-loaded')) {
11112        $imageCarousel.removeClass('swiper-loaded');
11113        swiperInstance.removeAllSlides();
11114        swiperInstance.slideTo(0, 0); // move back to first slide
11115        swiperInstance.update();
11116    }
11117
11118    // Hide preview box
11119    if (previewBox) {
11120        previewBox.style.display = 'none';
11121    }
11122
11123    // Reset input
11124    if (fileInput) {
11125        fileInput.value = '';
11126    }
11127
11128    checkButtonEnableDisabled();
11129}
11130
11131
11132
11133//for repost
11134// Define the function in the global scope
11135function closePreviewRepost() {
11136    const imageCarousel = document.getElementById('imageCarousel-repost'); // Carousel container
11137    const previewBox = document.getElementById('imagePreviewBox-repost'); // Preview box
11138    const fileInput = document.getElementById('imageInput-repost'); // File input
11139
11140    console.log("Close button clicked");
11141
11142    // Clear the carousel content
11143    if (imageCarousel) {
11144        imageCarousel.innerHTML = ''; // Clear all items
11145    }
11146
11147    // Hide the preview box
11148    if (previewBox) {
11149        previewBox.style.display = 'none'; // Hide the preview box
11150    }
11151
11152    // Reset the file input
11153    if (fileInput) {
11154        fileInput.value = ''; // Reset the input
11155    }
11156}
11157
11158
11159function openEmbedLinkPopup(event, index) {
11160    console.log();
11161    $('#social-popup > .add-post-inner').addClass('embedlink-box-opened');
11162    event.stopPropagation();
11163
11164    const embedLinkValue = $(`#preview-img-${index}`).attr('data-embeded-link') || '';
11165    const $popup = $(event.currentTarget).closest('.social-popup').find('#embed-link');
11166    const $input = $popup.find('#embedInput');
11167    const $saveButton = $popup.find('#saveEmbedButton'); // make sure you have this button ID in your HTML
11168
11169    $input.val(embedLinkValue);
11170    $popup.data('index', index).addClass('show-embed-link');
11171    $('#add-alt-tag').removeClass('show-add-alt-tag');
11172
11173    const urlRegex = /^(https?:\/\/|www\.)[^\s/$.?#].[^\s]*$/i;
11174
11175    // Initial button state
11176    toggleEmbedButtonState($input.val(), $saveButton, urlRegex);
11177
11178    // Remove existing event listener if needed to avoid duplication
11179    $input.off('input');
11180
11181    $input.on('input', function() {
11182        const value = this.value.trim();
11183        if (!urlRegex.test(value)) {
11184            setError(this, "Please enter a valid URL");
11185        } else {
11186            clearError(this);
11187        }
11188        toggleEmbedButtonState(value, $saveButton, urlRegex);
11189    });
11190}
11191
11192// Helper to toggle Save button state & classes
11193function toggleEmbedButtonState(value, $button, regex) {
11194    const isValid = regex.test(value);
11195
11196    $button.prop('disabled', !isValid);
11197    $button.toggleClass('buttonEnabled', isValid);
11198    $button.toggleClass('buttonDisabled', !isValid);
11199}
11200
11201
11202
11203// Function to open Alt Text popup
11204function openAltTextPopup(event, index) {
11205    $('#social-popup > .add-post-inner').addClass('alttag-box-opened');
11206    const embedTextValue = $(`#preview-img-${index}`).attr('data-alt') || '';
11207
11208    $('#altTextInput').val(embedTextValue);
11209    event.stopPropagation(); // Prevent click event from propagating
11210    $('#add-alt-tag').data('index', index); // Store the image index
11211
11212    //$('#add-alt-tag').addClass('show-add-alt-tag');
11213    $(event.currentTarget).closest('.social-popup').find('#add-alt-tag').addClass('show-add-alt-tag');
11214    $('#embed-link').removeClass('show-embed-link'); // Close the Embed Link popup if it's open
11215
11216}
11217
11218// Function to close Embed Link and Alt Text popups
11219function closePopup(event) {
11220    event.stopPropagation(); // Prevent click event from propagating
11221
11222    // Find the closest social-popup and remove active classes
11223    $(event.currentTarget).closest('.social-popup').find('#embed-link, #add-alt-tag').removeClass(
11224        'show-embed-link show-add-alt-tag');
11225}
11226
11227
11228
11229// Function to save Embed Link
11230$('#saveEmbedButton').on('click', function() {
11231    $('#social-popup > .add-post-inner').removeClass('embedlink-box-opened');
11232    $('#social-popup > .add-post-inner').removeClass('alttag-box-opened');
11233    const index = $('#embed-link').data('index'); // Get the index of the image
11234    const enteredUrl = $('#embedInput').val(); // Get the entered embed link
11235
11236    // Validate the URL before saving it
11237    if (isValidUrl(enteredUrl)) {
11238        console.log(`Embed link for image ${index}: ${enteredUrl}`);
11239
11240        // Find the image element using the index and update its data-embeded-link attribute
11241        const imageItem = $('#imageCarousel').find(`.item[data-index="${index}"] img`);
11242        imageItem.attr('data-embeded-link', enteredUrl); // Set the embed link
11243        //$('#embedInput').val(enteredUrl);
11244        $('#embed-link').removeClass('show-embed-link');
11245        showNotification('success', 'Link added!');
11246    } else {
11247        //alert('Please enter a valid URL for embedding.');
11248        showNotification('error', 'Please enter a valid URL.');
11249    }
11250});
11251
11252// Function to save Alt Text
11253$('#saveAltTextButton').on('click', function() {
11254    $('#social-popup > .add-post-inner').removeClass('embedlink-box-opened');
11255    $('#social-popup > .add-post-inner').removeClass('alttag-box-opened');
11256    const index = $('#add-alt-tag').data('index'); // Get the index of the image
11257    const altText = $('#altTextInput').val(); // Get the entered alt text
11258
11259    if (altText !== '') {
11260        console.log(`Alt text for image ${index}: ${altText}`);
11261
11262        // Find the image element using the index and update its data-alt attribute
11263        const imageItem = $('#imageCarousel').find(`.item[data-index="${index}"] img`);
11264        imageItem.attr('data-alt', altText); // Set the alt text
11265        $('#altTextInput').val(altText);
11266        showNotification('success', 'Alt text added!');
11267
11268        setTimeout(() => {
11269            $('#add-alt-tag').removeClass('show-add-alt-tag');
11270        }, 500);
11271
11272        // Close the Alt Text popup
11273        //$('#add-alt-tag').removeClass('show-add-alt-tag');
11274    } else {
11275        //alert('Please enter alt text.');
11276        showNotification('error', 'Please enter alt text');
11277    }
11278
11279});
11280
11281// Function to save Embed Link
11282function saveEmbedLink(button) {
11283
11284    const popupSelector = $(button).closest('.social-popup'); // Find the nearest popup
11285    const index = popupSelector.data('index'); // Get the index of the image
11286    const enteredUrl = popupSelector.find('.embed-input').val(); // Get the entered embed link
11287
11288    if (isValidUrl(enteredUrl)) {
11289        console.log(`Embed link for image ${index}: ${enteredUrl}`);
11290
11291        // Find the image element using the index and update its data-embeded-link attribute
11292        const imageItem = $(`.item[data-index="${index}"] img`);
11293        imageItem.attr('data-embeded-link', enteredUrl);
11294
11295        popupSelector.removeClass('show-embed-link'); // Hide popup
11296        showNotification('success', 'Link added!');
11297    } else {
11298        showNotification('error', 'Please enter a valid URL.');
11299    }
11300}
11301
11302// Function to save Alt Text
11303/* function saveAltText(button) {
11304    const popupSelector = $(button).closest('.social-popup'); // Find the nearest popup
11305    const index = popupSelector.data('index'); // Get the index of the image
11306    const altText = popupSelector.find('.alt-text-input').val(); // Get the entered alt text
11307
11308    if (altText !== '') {
11309        console.log(`Alt text for image ${index}: ${altText}`);
11310
11311        // Find the image element using the index and update its data-alt attribute
11312        const imageItem = $(`.item[data-index="${index}"] img`);
11313        imageItem.attr('data-alt', altText); 
11314
11315        showNotification('success', 'Alt text added!');
11316        
11317        setTimeout(() => {
11318            popupSelector.removeClass('show-add-alt-tag'); // Hide popup after delay
11319        }, 500);
11320    } else {
11321        showNotification('error', 'Please enter alt text');
11322    }
11323} */
11324function saveAltText(event) {
11325    event.stopPropagation(); // Stop bubbling
11326
11327    const popup = event.currentTarget.closest('#add-alt-tag');
11328    if (!popup) {
11329        console.error('Popup not found!');
11330        return;
11331    }
11332
11333    const index = popup.getAttribute('data-index'); // Get the image index
11334    const altTextInput = popup.querySelector('#altTextInput');
11335
11336    if (!altTextInput) {
11337        console.error('Alt Text Input not found!');
11338        return;
11339    }
11340
11341    const altText = altTextInput.value.trim();
11342
11343    if (altText !== '') {
11344        console.log(`Alt text for image ${index}: ${altText}`);
11345
11346        // Find and update the correct image attribute
11347        const imageItem = document.querySelector(`#imageCarousel .item[data-index="${index}"] img`);
11348        if (imageItem) {
11349            imageItem.setAttribute('data-alt', altText);
11350        } else {
11351            console.error('Image not found!');
11352        }
11353
11354        // Show success notification
11355        showNotification('success', 'Alt text added!');
11356
11357        // Close the popup after 500ms
11358        setTimeout(() => {
11359            popup.classList.remove('show-add-alt-tag');
11360        }, 500);
11361    } else {
11362        showNotification('error', 'Please enter alt text');
11363    }
11364
11365
11366}
11367
11368
11369// Attach event listeners using event delegation
11370$(document).on('click', '#saveEmbedButton', function() {
11371    saveEmbedLink(this);
11372});
11373
11374$(document).on('click', '#saveAltTextButton', function() {
11375    saveAltText(this);
11376});
11377//try to save alt in repost by class ID 
11378$(document).on('click', '.save-alt-text', function(event) {
11379    const popup = $(event.currentTarget).closest('#add-alt-tag');
11380    const index = popup.data('index'); // Get the image index
11381    const altText = popup.find('#altTextInput').val().trim(); // Get input value
11382
11383    if (altText !== '') {
11384        console.log(`Alt text for image ${index}: ${altText}`);
11385
11386        // Find and update the correct image attribute
11387        const imageItem = $('#imageCarousel').find(`.item[data-index="${index}"] img`);
11388        imageItem.attr('data-alt', altText);
11389
11390        // Show success notification
11391        showNotification('success', 'Alt text added!');
11392
11393        // Close the popup after 500ms
11394        setTimeout(() => {
11395            popup.removeClass('show-add-alt-tag');
11396        }, 500);
11397    } else {
11398        showNotification('error', 'Please enter alt text');
11399    }
11400});
11401
11402// Function to check if URL is valid
11403function isValidUrl(url) {
11404    const urlRegex = /^(https?:\/\/|www\.)[^\s/$.?#].[^\s]*$/i;
11405    return urlRegex.test(url);
11406}
11407
11408// Function to set error message
11409function setError(inputElement, message) {
11410    $(inputElement).addClass('error');
11411    $(inputElement).next('.error-message').text(message).show();
11412}
11413
11414// Function to clear error message
11415function clearError(inputElement) {
11416    $(inputElement).removeClass('error');
11417    $(inputElement).next('.error-message').hide();
11418}
11419
11420// Close Popups
11421$('.close').on('click', function() {
11422    $('#embed-link').removeClass('show-embed-link');
11423    $('#add-alt-tag').removeClass('show-add-alt-tag');
11424    $('#social-popup > .add-post-inner').removeClass('embedlink-box-opened');
11425    $('#social-popup > .add-post-inner').removeClass('alttag-box-opened');
11426});
11427
11428
11429
11430
11431 
11432
11433var isNewPost = false;
11434
11435function closeVideoPreview() {
11436    clearPreviews();
11437    const videoElement = document.getElementById('videoPreview');
11438    if (videoElement) {
11439        videoElement.pause(); // Pause the video
11440        videoElement.currentTime = 0; // Reset the playback to the beginning (optional)
11441    }
11442    $('#videoPreviewBox').hide(); // Hide the video preview box
11443}
11444 
11445
11446function clearAllImageSources() {
11447    const images = document.querySelectorAll('[id^="image-preview-"] img');
11448    images.forEach((img) => {
11449        img.src = ''; // Reset src for each image
11450    });
11451}
11452
11453// Clear all previews and reset states
11454function clearPreviews_old() {
11455    // Clear images
11456    $('#imageCarousel').empty().removeClass('owl-carousel owl-theme').trigger('destroy.owl.carousel');
11457    $('#imagePreviewBox').hide();
11458
11459
11460    //let postText = $('#addPostTextarea').val();
11461    let postText = $('#addPostTextarea').text();
11462    console.log("cleared 2634 : = " + postText);
11463    if (postText) {
11464        $('.addPost-form-submit')
11465            .removeClass('disabled')
11466            .addClass('active');
11467    } else {
11468        $('.addPost-form-submit')
11469            .removeClass('disabled')
11470            .addClass('active');
11471    }
11472
11473    // Clear video
11474    const videoElement = $('#videoPreview')[0];
11475    $('#videoSource').attr('src', '');
11476    if (videoElement) {
11477        videoElement.pause();
11478        videoElement.load();
11479    }
11480    $('#videoPreviewBox').hide();
11481
11482    // Clear GIF
11483    $('#gifPreviewBox').hide();
11484    $('#gifPreviewAddPost').attr('src', '');
11485}
11486
11487// 30 april
11488function clearPreviews(appendImage=false) {
11489    // Clear images
11490
11491    if(!appendImage){
11492        const imgCar = $('#imageCarousel');
11493        if (imgCar.hasClass('owl-loaded')) {
11494            $('#imageCarousel').empty().removeClass('owl-carousel owl-theme').trigger('destroy.owl.carousel');
11495        }
11496    
11497        if (imgCar.hasClass('swiper-loaded') && swiperInstance) {
11498            imgCar.removeClass('swiper-loaded');
11499            swiperInstance.removeAllSlides();
11500            swiperInstance.slideTo(0, 0);
11501            swiperInstance.update();
11502        }
11503
11504        selectedImageFiles.length = 0;
11505        $('#imagePreviewBox').hide();
11506    }
11507
11508    // Clear video
11509    const videoElement = $('#videoPreview')[0];
11510    $('#videoSource').attr('src', '');
11511    if (videoElement) {
11512        videoElement.pause();
11513        videoElement.load();
11514    }
11515    $('#videoPreviewBox').hide();
11516
11517    // Clear GIF
11518    $('#gifPreviewBox').hide();
11519    $('#gifPreviewAddPost').attr('src', '');
11520
11521    // Check media + text status
11522    //let postText = $('#addPostTextarea').val().trim();
11523    let postText = $('#addPostTextarea').text().trim();
11524    const imageInput = document.getElementById('imageInput');
11525    const videoInput = document.getElementById('videoInput');
11526    const gifBox = document.getElementById('gifPreviewBox');
11527    const gifPreview = document.getElementById('gifPreviewAddPost');
11528
11529    const hasImage = imageInput && imageInput.files.length > 0;
11530    const hasVideo = $('#videoSource').attr('src')?.trim() !== '';
11531    //const hasVideo = videoInput && videoInput.files.length > 0;
11532    const hasGif = gifBox && gifBox.style.display !== 'none' && gifPreview && gifPreview.getAttribute('src');
11533
11534    const shouldEnable = postText.length > 0 || hasImage || hasVideo || hasGif;
11535
11536    console.log("cleared: postText =", postText);
11537    console.log("hasImage:", hasImage, "| hasVideo:", hasVideo, "| hasGif:", hasGif);
11538    console.log("Button should be enabled after clearing?", shouldEnable);
11539
11540    if (shouldEnable) {
11541        $('.addPost-form-submit').removeClass('disabled').addClass('active');
11542    } else {
11543        $('.addPost-form-submit').removeClass('active').addClass('disabled');
11544    }
11545}
11546
11547function clearGifPreview() {
11548    $('#gifPreviewBox').hide();
11549    $('#gifPreviewAddPost').attr('src', '');
11550
11551    // Check if any content exists to keep the button active
11552    //const postText = $('#addPostTextarea').val().trim();
11553    const postText = $('#addPostTextarea').text().trim();
11554    const hasImage = $('#imageInput-repost')[0]?.files.length > 0;
11555    const hasVideo = $('#videoSource').attr('src')?.trim() !== '';
11556    const hasGif = $('#gifPreviewBox').is(':visible') && $('#gifPreviewAddPost').attr('src')?.trim() !== '';
11557
11558    const shouldEnable = postText.length > 0 || hasImage || hasVideo || hasGif;
11559
11560    if (shouldEnable) {
11561        $('.addPost-form-submit').removeClass('disabled').addClass('active');
11562    } else {
11563        $('.addPost-form-submit').removeClass('active').addClass('disabled');
11564    }
11565}
11566
11567
11568$('#videoInput').on('change', function(e) {
11569    clearPreviews();
11570    clearAllImageSources();
11571    const file = e.target.files[0];
11572    if (file && file.type.startsWith('video/')) {
11573        // Reset image and GIF
11574
11575
11576        $('#gifPreviewBox').hide();
11577        $('#gifPreviewAddPost').attr('src', '');
11578        const reader = new FileReader();
11579        reader.onload = function() {
11580            $('#videoSource').attr('src', reader.result);
11581            const videoElement = $('#videoPreview')[0]; // Get the video element
11582            videoElement.load(); // Reload the video source
11583            videoElement.play(); // Optionally play the video
11584            $('#videoPreviewBox').show();
11585
11586
11587
11588            //30 april 
11589            // Check for media/text and enable button if needed
11590            //const postText = $('#addPostTextarea').val().trim();
11591            const postText = $('#addPostTextarea').text().trim();
11592            const hasImage = $('#imageInput-repost')[0]?.files.length > 0;
11593            const hasVideo = $('#videoSource').attr('src')?.trim() !== '';
11594            const hasGif = $('#gifPreviewBox').is(':visible') && $('#gifPreviewAddPost').attr('src')
11595            ?.trim() !== '';
11596            const shouldEnable = postText.length > 0 || hasImage || hasVideo || hasGif;
11597
11598            if (shouldEnable) {
11599                $('.addPost-form-submit').removeClass('disabled').addClass('active');
11600            } else {
11601                $('.addPost-form-submit').removeClass('active').addClass('disabled');
11602            }
11603
11604        };
11605        reader.readAsDataURL(file);
11606    }
11607});
11608
11609//for re-post 
11610$('#videoInput-repost').on('change', function(e) {
11611    console.log("yeah, repost vdo clicked ");
11612    //clearPreviews(); 
11613    //clearAllImageSources();
11614    const file = e.target.files[0];
11615    if (file && file.type.startsWith('video/')) {
11616        // Reset image and GIF 
11617        $('#gifPreviewBox').hide();
11618        $('#gifPreviewAddPost').attr('src', '');
11619        const reader = new FileReader();
11620        reader.onload = function() {
11621            $('#repost-videoSource').attr('src', reader.result);
11622            const videoElement = $('#repost-videoPreview')[0]; // Get the video element
11623            videoElement.load(); // Reload the video source
11624            videoElement.play(); // Optionally play the video
11625            $('#repost-videoPreviewBox').show();
11626        };
11627        reader.readAsDataURL(file);
11628    }
11629});
11630// Select GIF and show preview with a close button
11631// below function is not worked remove it if not worked 
11632function selectGIF(url) {
11633
11634    $('#videoPreviewBox').hide();
11635    $('#videoSource').attr('src', '');
11636    $('#videoPreview')[0].load(); // Reset video player
11637
11638    $('#gifPreviewAddPost').attr('src', url);
11639    $('#gifPreviewBox').show();
11640}
11641
11642$('#gif-trigger-addpost').on('click', function(e) {
11643    e.preventDefault();
11644    $('.add-image').hide();
11645
11646    fetch('https://api.giphy.com/v1/gifs/trending?api_key=uGguGjuTdE4Zqe3SFEah6hTQHb3E4mkG&limit=10&rating=g')
11647        .then(response => response.json())
11648        .then(data => {
11649            let gifHTML = '<div class="gif-list">';
11650            data.data.forEach(gif => {
11651                gifHTML +=
11652                    `<img src="${gif.images.original.url}" class="gif-item" onclick="selectGIF('${gif.images.original.url}')">`;
11653            });
11654            gifHTML += '</div>';
11655            document.getElementById('preview').innerHTML = gifHTML;
11656
11657        });
11658    setTimeout(function() {
11659        $('.gif-list').append('<span class="close-x">&times;</span>');
11660        $('.gif-list span.close-x').click(function() {
11661            $('.gif-list').hide();
11662        })
11663    }, 1000)
11664});
11665
11666
11667
11668// Simulate progress bar without sending request
11669function simulateUploadProgress_sample() {
11670    let progress = 0;
11671    $('#uploadProgressBar').css('width', '0%').text('0%');
11672    $('#uploadProgressContainer').fadeIn();
11673
11674    let interval = setInterval(function() {
11675        progress += 1;
11676        $('#uploadProgressBar').css('width', progress + '%').text(progress + '%');
11677
11678        if (progress >= 100) {
11679            clearInterval(interval);
11680            setTimeout(() => {
11681                $('#uploadProgressContainer').fadeOut();
11682                showNotification('success', 'Post sent successfully. (Simulated)');
11683                $('#addPostTextarea').text('');
11684            }, 400);
11685        }
11686    }, 30); // Smaller step and faster interval for smoothness
11687}
11688
11689
11690var addedPrivateMembers = [];
11691
11692function handleAddPost(isDraft = 0) {
11693    // Hide the schedule popup when click on draft 
11694    $('#social-popup > .add-post-inner').removeClass('schedule-box-opened');
11695    $('.Schedule-message-wrapper').hide();
11696
11697    // Check if this is a repost
11698    let repostId = $('#repostId').val();
11699    let isRepost = repostId ? 1 : 0;
11700
11701    // Fetch scheduled data
11702    let scheduled = $('#scheduled').val();
11703    let scheduledate = $('#scheduledate').val();
11704    let scheduletime = $('#scheduletime').val();
11705
11706    // Get post text content
11707    let postText = $('#addPostTextarea').text();
11708
11709    // Initialize media type
11710    let mediatype = 0;
11711    let alreadyAsMedia = false;
11712    let mediaUrl = '';
11713    let imagesData = [];
11714
11715    // Get checkbox values
11716    let commentsOff = $('#post-setting-box input[type="checkbox"]:eq(0)').is(':checked') ? 1 : 0;
11717    let hideLike = $('#post-setting-box input[type="checkbox"]:eq(1)').is(':checked') ? 1 : 0;
11718
11719    let formData = new FormData();
11720
11721    // Add repost ID if this is a repost
11722    if (isRepost) {
11723        formData.append('repostId', repostId); //Controler name: repostId  old name : repost_id
11724        formData.append('is_repost', isRepost);
11725    }
11726
11727    // Detect media type
11728    // if ($('#imageInput')[0].files.length > 0) {
11729    if (selectedImageFiles.length > 0) {
11730        mediatype = 1;
11731    } else if ($('#videoInput')[0].files.length > 0) {
11732        mediatype = 2;
11733    } else if ($('#gifPreviewBox').is(':visible')) {
11734        mediatype = 3;
11735        mediaUrl = $('#gifPreviewAddPost').attr('src');
11736    }
11737
11738    // Validate
11739    if (!postText && mediatype === 0) {
11740        showNotification('error', 'Please add some content before posting.');
11741        return;
11742    }
11743
11744    // Handle images
11745    $('#imageCarousel .item').each(function(index) {
11746        let embeddedLink = $(this).find('img').attr('data-embeded-link') || '';
11747        let embeddedText = $(this).find('img').attr('data-alt') || '';
11748        // let imageFile = $('#imageInput')[0].files[index] || null;
11749
11750        const ind = $(this).attr('data-index');
11751        const fileObj = selectedImageFiles.find(f => Number(f.index) === Number(ind));
11752        const imageFile = fileObj ? fileObj.file : null;
11753
11754        imagesData.push({
11755            embeddedLink: embeddedLink,
11756            embeddedText: embeddedText,
11757            fileName: imageFile ? imageFile.name : ''
11758        });
11759    });
11760
11761    // Append image data
11762    if (mediatype === 1) {
11763        // const files = $('#imageInput')[0].files;
11764        // Array.from(files).forEach((file, index) => {
11765        //     formData.append('repost-images[]', file);
11766        //     formData.append('repost-embeddedLink[]', imagesData[index]?.embeddedLink || '');
11767        //     formData.append('repost-altText[]', imagesData[index]?.embeddedText || '');
11768        // });
11769
11770        selectedImageFiles.forEach((obj, index) => {
11771            const file = obj.file;
11772
11773            formData.append('repost-images[]', file);
11774            formData.append('repost-embeddedLink[]', imagesData[index]?.embeddedLink || '');
11775            formData.append('repost-altText[]', imagesData[index]?.embeddedText || '');
11776        });
11777
11778        console.log(selectedImageFiles);
11779    }
11780
11781    // Append video file
11782    if (mediatype === 2 && $('#videoInput')[0].files.length > 0) {
11783        formData.append('repost-video', $('#videoInput')[0].files[0]);
11784    }
11785
11786    // If video already present
11787    if ($('#videoSource').length > 0 && $('#videoSource').attr('src')) {
11788        alreadyAsMedia = true;
11789        mediatype = 2;
11790        const videoUrl = $('#videoSource').attr('src');
11791        formData.append('repost-video', videoUrl);
11792    }
11793
11794    // GIF
11795    if (mediatype === 3 && mediaUrl) {
11796        alreadyAsMedia = true;
11797        formData.append('media_url', mediaUrl);
11798    }
11799
11800    // Schedule and metadata
11801    formData.append('scheduled', scheduled);
11802    formData.append('scheduledate', scheduledate);
11803    formData.append('scheduletime', scheduletime);
11804    formData.append('alreadyAsMedia', alreadyAsMedia);
11805    formData.append('postText', postText);
11806    formData.append('media_type', mediatype);
11807    formData.append('media_url', mediaUrl);
11808    formData.append('duration', 0);
11809    formData.append('is_draft', isDraft);
11810    formData.append('IsCommentBlocked', commentsOff);
11811    formData.append('hideLike', hideLike);
11812
11813    const isPrivate = $('#privatepostbtn').prop('checked');
11814    formData.append('isPrivate', (isPrivate ? 1 : 0));
11815
11816    if(isPrivate){
11817        const privateGuidelines = $('#private-guidelines').val().trim();
11818        if(privateGuidelines && privateGuidelines.length > 0){
11819            formData.append('privateGuidelines', privateGuidelines);
11820        }
11821
11822        addedPrivateMembers.forEach(token => {
11823            formData.append('privateUserTokens[]', token);
11824        })
11825    }
11826
11827    // Show progress container
11828    $('#uploadProgressBar').css('width', '0%').text('0%');
11829    $('#uploadProgressContainer').fadeIn();
11830
11831    let fakeProgress = 0;
11832    let fakeInterval = setInterval(() => {
11833        if (fakeProgress < 90) {
11834            fakeProgress += 1;
11835            $('#uploadProgressBar').css('width', fakeProgress + '%').text(fakeProgress + '%');
11836        }
11837    }, 50);
11838
11839    // AJAX Upload
11840    $.ajax({
11841        url: base_url + 'addPost', // This same endpoint should handle both posts and reposts
11842        type: 'POST',
11843        data: formData,
11844        processData: false,
11845        contentType: false,
11846        xhr: function() {
11847            let xhr = new window.XMLHttpRequest();
11848            xhr.upload.addEventListener("progress", function(evt) {
11849                if (evt.lengthComputable) {
11850                    let percentComplete = Math.round((evt.loaded / evt.total) * 100);
11851                    $('#uploadProgressBar').css('width', percentComplete + '%').text(
11852                        percentComplete + '%');
11853                }
11854            }, false);
11855            return xhr;
11856        },
11857        beforeSend: function() {
11858            $('#addPost-form-submit')
11859                .prop('disabled', true)
11860                .data('original-text', $('#addPost-form-submit').text())
11861                .html('<span class="jloader"></span>');
11862        },
11863        success: function(response) {
11864            clearInterval(fakeInterval);
11865            $('#uploadProgressBar').css('width', '100%').text('100%');
11866
11867            setTimeout(() => {
11868                $('#uploadProgressContainer').fadeOut();
11869            }, 500);
11870
11871            $('#addPost-form-submit')
11872                .prop('disabled', false)
11873                .html('<i class="fa-sharp fa-solid fa-paper-plane-top" aria-hidden="true"></i>');
11874            $('.post-btn.addPost-form-submit').removeClass('active').addClass('disabled');
11875
11876            let result = JSON.parse(response);
11877            if (result.status) {
11878                showNotification('success', isDraft ? 'Draft Saved' : 'Post sent successfully.');
11879                $('body').removeClass('overflow-hidden');
11880                
11881                // Reset form and clear repost state
11882                resetRepostForm(false);
11883                clearRepost(); // Clear the repost preview and state
11884                
11885                isNewPost = true;
11886                $('#addPostTextarea').text('');
11887                $('#imageInput').val('');
11888                $('#videoInput').val('');
11889                $('#previewGifsForAddPost').empty();
11890                $('#post-setting-box input[type="checkbox"]').prop('checked', false);
11891                $('#repostId').val(''); // Clear repost ID
11892                $('#popup-title').text('Create Post'); // Reset title
11893                $('#repost-indicator').hide(); // Hide repost indicator
11894                $('#repost-preview-container').hide(); // Hide preview
11895
11896                // Close the popup
11897                $('.social-popup').fadeOut('fast');
11898                $('.social-shadow').hide();
11899                $('.add-post').removeClass('add-post-opened');
11900
11901               
11902                // Get current URL details safely
11903                const currentUrl = window.location.href;
11904                const urlObj = new URL(currentUrl);
11905
11906                // Extract pathname & search
11907                const pathname = urlObj.pathname;   // "/" OR "/social"
11908                const search = urlObj.search;        // "?page=1" OR ""
11909
11910                // Debug logs (optional – remove later)
11911                console.log("Current URL:", currentUrl);
11912                console.log("Pathname:", pathname);
11913                console.log("Search:", search);
11914
11915                // Define pages where feed should refresh
11916                const feedPages = ['/', '/social'];
11917
11918                // Check if current page is feed page (without query params)
11919                const isFeedPage =
11920                    feedPages.includes(pathname) &&
11921                    search.length === 0;
11922
11923                console.log("isFeedPage:", isFeedPage);
11924                console.log("formData:", formData);
11925
11926                // Main logic
11927                if (isDraft != 0) {
11928                    getAllMyDrafts();
11929                } else {
11930                    if (isFeedPage) {
11931                        // Refresh feed only on / or /social
11932                        getSocialFeed('3', '1', '1', '');
11933                    }
11934                }
11935
11936
11937
11938
11939            } else {
11940
11941            
11942                showNotification(result.message || 'An error occurred while processing the request.');
11943                $('#uploadProgressContainer').fadeOut();
11944            }
11945        },
11946        error: function(xhr, status, error) {
11947            clearInterval(fakeInterval);
11948            $('#uploadProgressBar').css('width', '100%').text('100%');
11949            $('#uploadProgressContainer').fadeOut();
11950
11951            showNotification('error', 'Failed to process the request. Please try again.');
11952            console.error('Error:', error);
11953        }
11954    });
11955}
11956
11957 
11958
11959
11960
11961
11962</script>
11962
11963
11964<script>
11965$(function() {
11966    // $('#getstart-popup').fadeIn();
11967})
11968</script>
11968
11969
11970<!-- ADD POST ARTICLE END here  -->
11971<div id="analytics-panel" onclick="window.event.cancelBubble = true;" style="display:none">
11972    <div class="embed-header">
11973        <div class="d-flex align-items-center mb-3">
11974            <h3>Analytics</h3>
11975        </div>
11976    </div>
11977    <div class="embed-inner">
11978        <p>Views: The number of times people open and view a product listing or social post.</p>
11979        <p>We're adding more analytics data to provide better insight into the performance of each product listing and
11980            social
11981            post.</p>
11982    </div>
11983
11984    <button class="copy-embed" type="button"
11985        onclick="$('#analytics-panel').fadeOut('fast').removeClass('show-analytics-panel');">Close</button>
11986</div>
11987
11988<div id="analytics-panel-shadow" style="display:none"
11989    onclick="$('#analytics-panel').fadeOut('fast').removeClass('show-analytics-panel');">
11990
11991</div>
11992 
11993
11994<div class="social-popup" id="repost-popup-product">
11995    <div class="add-post-inner">
11996        <div class="header-post social-add-header">
11997            <div class="header-add-post">
11998                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
11999                    <div class="d-flex">
12000                        <div class="fig"><img
12001                                src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg"
12002                                style="border-radius:50%" alt="logo" title="logo"></div>
12003                        <div class="fnc-title">
12004                            <h4>Jumpspree</h4>
12005                            <p>@vic</p>
12006                        </div>
12007                    </div>
12008
12009                    <div class="drop-down-blog">
12010                        <!--                    <a class="discard-button" href="javascript:void(0)" onclick="$(this).parents('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide()">Discard</a>-->
12011
12012                        <a class="discard-button" href="javascript:void(0)"
12013                            onclick="$('#save-draft').show();">Discard</a>
12014
12015                    </div>
12016                </div>
12017
12018
12019            </div>
12020
12021            <div class="post-area-inside">
12022                <textarea id="posdAddTextArea"
12023                    oninput='this.style.height = "";this.style.height = this.scrollHeight + "px"'
12024                    placeholder="What's up?">
12025                    </textarea>
12026            </div>
12027
12028            <div class="post-for-repost pb-0">
12029                <div class="email-box">
12030                    <div class="row">
12031                        <div class="col-md-12">
12032                            <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
12033                                <div class="d-flex">
12034                                    <a href="#" class="fig">
12035                                        <img src="https://cubesnack-seller.s3.amazonaws.com/products/1611230151525540.jpg"
12036                                            style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
12037                                    </a>
12038                                    <div class="fnc-title" style="display: flex;align-items: center;">
12039                                        <h4>
12040                                            <a href="#" class="profile-link">melissa52</a>
12041                                            <img src="https://www.jumpspree.com/public/images/blue-cube.png"
12042                                                class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
12043                                        </h4>
12044                                        <p style="margin: 0; margin-left: 7px;"><a href="#" class="profile-link"
12045                                                style="color: #bbb;font-size: 12px !important;">@melissa52</a>
12046                                        </p>
12047                                    </div>
12048                                </div>
12049                                <!-- Dropdown menu code -->
12050                                <div class="product-label">Product</div>
12051                            </div>
12052                        </div>
12053                    </div>
12054                    <div class="row mob-m-0">
12055                        <div class="post-text">
12056                            <a href="#">
12057                                <p>Rosary Beautiful handmade Rosary .</p>
12058                            </a>
12059                            <div class="price-wrapper">
12060                                <div class="price">$8.00</div>
12061                                <div class="was">Was $10.00</div>
12062                            </div>
12063                        </div>
12064                        <div class="col-md-12 p-0">
12065
12066                            <div class="blog-main-image mb-0 movie-trailer">
12067                                <div class="">
12068                                    <div class="item lightgallery">
12069                                        <div data-src="undefined">
12070                                            <a style="border:none" href="#"><img
12071                                                    src="https://cubesnack-seller.s3.amazonaws.com/products/0512231244061803.png"
12072                                                    alt="Post Image" title="Post Image"></a>
12073                                        </div>
12074                                    </div>
12075                                </div>
12076                            </div>
12077
12078                        </div>
12079                    </div>
12080                    <div style="display:none" class="row">
12081                        <div class="col-md-12">
12082                            <div class="date">
12083                                <ul class="d-flex m-0">
12084                                    <li></li>
12085                                    <li><span>•</span></li>
12086                                    <li></li>
12087                                </ul>
12088                            </div>
12089                        </div>
12090                    </div>
12091
12092                </div>
12093
12094            </div>
12095
12096
12097            <div class="post-foot add-post-foot d-flex justify-content-between">
12098
12099                <div class="add-image">
12100                    <ul class="d-flex p-0 m-0">
12101                        <li>
12102                            <a href="#">
12103                                <input type="file"><i class="fa-regular fa-image"></i></a>
12104                        </li>
12105                        <li>
12106                            <a href="#">
12107                                <input type="file"><i class="fa-regular fa-video"></i></a>
12108                        </li>
12109
12110                        <!-- <li>
12111                            <a href="#">
12112                                <input type="file"><i class="fa-regular fa-gif"></i></a>
12113                        </li> -->
12114
12115                        <li>
12116                            <a href="#" id="gif-trigger">
12117                                <i class="fa-regular fa-gif"></i>
12118                            </a>
12119                        </li>
12120                        <li id="draft-popup">
12121                            <a href="javascript:void(0)" onclick="$('#draft-box').addClass('draft-box-show')">
12122                                <i class="fa-regular fa-paste" aria-hidden="true"></i></a>
12123                        </li>
12124
12125                        <!--                        <li class="create-poll" onclick="$('#create-poll').fadeIn(); $('#social-popup').hide()"><a href="#"><img src="https://www.jumpspree.com/public/images/poll.png" style="width:16px" alt="Jumpspree"></a></li>-->
12126                    </ul>
12127                </div>
12128
12129                <div class="send-post">
12130                    <button type="button">Post</button>
12131                </div>
12132            </div>
12133
12134        </div>
12135    </div>
12136</div>
12137
12138
12139<div class="social-popup" id="search-popup">
12140    <div class="add-post-inner">
12141        <div class="header-post social-add-header">
12142            <h2>Search</h2>
12143            <span style="cursor:pointer" onclick="$('#search-popup').fadeOut('fast')" class="cancel">Cancel</span>
12144        </div>
12145
12146        <div class="search-box">
12147            <form action="">
12148                <i class="fa-regular fa-magnifying-glass"></i>
12149                <input type="text" placeholder="Search by product name or brand name">
12150            </form>
12151        </div>
12152    </div>
12153</div>
12154
12155
12156
12157<div class="social-popup" id="update-username">
12158    <div class="add-post-inner">
12159        <div class="header-post social-add-header">
12160            <div class="header-add-post">
12161                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
12162
12163                    <div class="d-flex">
12164                        <img src="https://www.jumpspree.com/public/images/Jumpspree-logo.png?ver:1.02"
12165                            alt="Jumpspree Logo" title="Jumpspree Logo">
12166                    </div>
12167
12168                    <div class="cancel"><span class="cancel" style="cursor:pointer; color:#b8b8b8; font-size:13px"
12169                            onclick="$('#update-username').fadeOut('fast')">Cancel</span></div>
12170                </div>
12171
12172
12173            </div>
12174
12175
12176        </div>
12177
12178
12179        <div class="update-section">
12180            <h3>Update username</h3>
12181            <p>Create a unique username for your profile. Usernames can be minimum 3 and maximum 15 characters, and can
12182                contain letters, numbers, and underscores only. You can change it later in your profile settings.</p>
12183            <div class="d-flex claum-user-input">
12184                <form action="" name="clainform" id="claimform" style="position:relative" novalidate="novalidate">
12185                    <div class="claim-user">
12186                        <input type="text" autocomplete="new-password" data-initial="@" name="claimusername"
12187                            id="claimusername" maxlength="15" minlength="1" placeholder="Enter your @username" value="">
12188                        <span class="placeholderprefilled">@</span>
12189                    </div>
12190                    <div class="sugested">
12191                        <a href="#">developee01</a>
12192                        <a href="#">developee785</a>
12193                        <a href="#">developee60</a>
12194                        <a href="#">developee50</a>
12195                    </div>
12196                    <button class="claim-button" name="submitbtn" id="submitbtn" type="button" disabled=""
12197                        onclick="window.location.href='https://www.jumpspree.com/sign-up'">Claim it</button>
12198                    <p><span class="tnc">Usernames are subject to availability and approval. You can change your
12199                            username only once every 14 days. Jumpspree reserves the right to transfer, reassign,
12200                            disable, or disapprove any username that infringes on intellectual property rights. <br>
12201                            <a href="#">Terms of Use</a> and <a href="#">Privacy Policy</a>.</span></p>
12202
12203                </form>
12204
12205            </div>
12206        </div>
12207
12208
12209
12210
12211    </div>
12212</div>
12213
12214<div class="social-popup" id="brand-verification">
12215    <div class="add-post-inner">
12216        <div class="header-post social-add-header">
12217            <div class="header-add-post">
12218                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
12219
12220                    <div class="d-flex">
12221                        <img src="https://www.jumpspree.com/public/images/Jumpspree-logo.png?ver:1.02"
12222                            alt="Jumpspree Logo" title="Jumpspree Logo">
12223                    </div>
12224
12225                    <div class="cancel"><span style="cursor:pointer; color:#b8b8b8; font-size:13px"
12226                            onclick="$('#brand-verification').fadeOut('fast'); $('body').removeClass('overflow-hidden');">Cancel</span>
12227                    </div>
12228                </div>
12229
12230
12231            </div>
12232
12233
12234        </div>
12235
12236
12237        <div class="update-section">
12238            <h3>Brand Verifications</h3>
12239            <p>List the brands you plan to offer on Jumpspree and upload the manufacturer's authorization documents,
12240                such as the official reseller certificate or the original letter of authorization for each brand.</p>
12241            <div class="b-verification">
12242                <div class="upload-article-image">
12243
12244                    <div class="upload"><i class="fa-light fa-cloud-arrow-up" aria-hidden="true"></i>
12245                        <p>Upload Image</p>
12246                        <p><small>1920 x 1080 resolutions works best</small></p>
12247                    </div>
12248
12249                    <input type="file" class="uplaod-blog">
12250                </div>
12251                <div class="form-group">
12252                    <input type="text" name="userfullname" id="userfullname" class="form-control" value=""
12253                        placeholder="Enter brand name">
12254                </div>
12255            </div>
12256            <div class="add-more-brand">
12257                <a href="#"><i class="fa-solid fa-plus"></i> Add another brand</a>
12258            </div>
12259            <div class="save-brand">
12260                <button class="btn btn-blue-bg btn-block" type="button" style="    border-radius: 8px;width: auto;margin-left:  auto;padding-left: 50px;
12261                                                             padding-right: 50px;"
12262                    onclick="$('#step1-wrapper').hide(); $('#step2-wrapper').fadeIn();">Save</button>
12263            </div>
12264        </div>
12265
12266
12267
12268
12269    </div>
12270</div>
12271
12272<div class="social-popup" id="update-emailid">
12273    <div class="add-post-inner">
12274        <div class="header-post social-add-header">
12275            <div class="header-add-post">
12276                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
12277
12278                    <div class="cancel"><a href="javascript:void(0)" onclick="$('#update-emailid').fadeOut('fast')"><i
12279                                class="fa-solid fa-arrow-left-long"></i></a></div>
12280
12281                    <div class="d-flex">
12282                        <h3>Email</h3>
12283                    </div>
12284
12285                </div>
12286
12287
12288            </div>
12289
12290
12291        </div>
12292
12293
12294        <div class="update-section">
12295            <form action="">
12296                <div class="c-email">
12297                    <label for="">Current Email</label>
12298                    <input type="text">
12299                </div>
12300                <div class="c-email">
12301                    <label for="">New Email</label>
12302                    <input type="text">
12303                </div>
12304
12305                <div class="send-code">
12306                    <button class="claim-button" name="submitbtn" id="submitbtn" type="button">Send Code</button>
12307                </div>
12308            </form>
12309        </div>
12310
12311
12312
12313
12314    </div>
12315</div>
12316
12317<div class="social-popup" id="update-phoneno">
12318    <div class="add-post-inner">
12319        <div class="header-post social-add-header">
12320            <div class="header-add-post">
12321                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
12322
12323                    <div class="cancel"><a href="javascript:void(0)" onclick="$('#update-phoneno').fadeOut('fast')"><i
12324                                class="fa-solid fa-arrow-left-long"></i></a></div>
12325
12326                    <div class="d-flex">
12327                        <h3>Phone</h3>
12328                    </div>
12329
12330                </div>
12331
12332
12333            </div>
12334
12335
12336        </div>
12337
12338
12339        <div class="update-section">
12340            <form action="">
12341                <div class="c-email">
12342                    <label for="">Current Phone Number</label>
12343                    <input type="text" value="+1 2222222222">
12344                </div>
12345                <div class="c-email">
12346                    <label for="">New Phone Number</label>
12347                    <input type="text" class="mb-0">
12348                    <div class="note">We'll send a verification code to your new phone number to verify
12349                        that it belongs to you. Message and data rates may apply.</div>
12350                </div>
12351
12352                <div class="send-code">
12353                    <button class="claim-button" name="submitbtn" id="submitbtn" type="button">Send Code</button>
12354                </div>
12355            </form>
12356        </div>
12357
12358
12359
12360
12361    </div>
12362</div>
12363
12364<div class="social-popup" id="update-password">
12365    <div class="add-post-inner">
12366        <div class="header-post social-add-header">
12367            <div class="header-add-post">
12368                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
12369
12370                    <div class="cancel"><a href="javascript:void(0)" onclick="$('#update-password').fadeOut('fast')"><i
12371                                class="fa-solid fa-arrow-left-long"></i></a></div>
12372
12373                    <div class="d-flex">
12374                        <h3>Update Password</h3>
12375                    </div>
12376
12377                </div>
12378
12379
12380            </div>
12381
12382
12383        </div>
12384
12385
12386        <div class="update-section">
12387            <form action="">
12388                <div class="c-email">
12389                    <label for="">Current Phone Number</label>
12390                    <input type="text">
12391                </div>
12392                <div class="c-email">
12393                    <label for="">New Phone Number</label>
12394                    <input type="text">
12395                </div>
12396
12397                <div class="send-code">
12398                    <button class="claim-button" name="submitbtn" id="submitbtn" type="button">Send Code</button>
12399                </div>
12400            </form>
12401        </div>
12402
12403
12404
12405
12406    </div>
12407</div>
12408
12409<div class="social-popup" id="sendmessage-popup">
12410    <div class="add-post-inner">
12411        <div class="header-post social-add-header">
12412            <div class="header-add-post">
12413                <div class="fnc mt-0 justify-content-between mb-5 align-items-start">
12414                    <div class="back-btn-message">
12415                        <a href="#"><i class="fa-regular fa-arrow-left-long"></i></a>
12416                    </div>
12417                    <div class="d-flex">
12418                        <div class="fig"><img
12419                                src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg"
12420                                style="border-radius:50%" alt="logo" title="logo"></div>
12421                        <div class="fnc-title">
12422                            <h4>Jumpspree</h4>
12423                            <p>@vic</p>
12424                        </div>
12425                    </div>
12426
12427                    <div class="drop-down-blog">
12428                        <div class="profile-drop-down">
12429                            <a href="javascript:void(0)"><i class="fa-regular fa-ellipsis" aria-hidden="true"></i></a>
12430                            <ul style="display: none;">
12431                                <li><a href="javascript:void(0)"
12432                                        onclick="$('#report-brand').fadeIn('fast'); $('body').addClass('overflow-hidden');">Report
12433                                        item <i class="fa-sharp fa-regular fa-circle-exclamation"
12434                                            aria-hidden="true"></i></a></li>
12435                                <li><a href="javascript:void(0)"
12436                                        onclick="$('#feedback-popup').fadeIn('fast'); $('body').addClass('overflow-hidden');">feedback
12437                                        <i class="fa-light fa-comment-lines" aria-hidden="true"></i></a></li>
12438                            </ul>
12439                        </div>
12440
12441                    </div>
12442                </div>
12443
12444
12445            </div>
12446
12447
12448        </div>
12449
12450        <div id="message-box">
12451            <div class="message-wrapper">
12452                <div class="admin">
12453                    <div class="message-box">
12454                        <div class="message">Hello</div>
12455                        <p>Fri, Nov 1 15:23 pm</p>
12456                    </div>
12457                    <div class="profile-logo"><img
12458                            src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg" alt="Logo"
12459                            title="logo"></div>
12460                </div>
12461
12462                <div class="reply-admin">
12463                    <div class="profile-logo"><img
12464                            src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg" alt="Logo"
12465                            title="logo"></div>
12466                    <div class="message-box">
12467                        <div class="message">hi</div>
12468                        <p>Fri, Nov 1 15:23 pm</p>
12469                    </div>
12470                </div>
12471            </div>
12472        </div>
12473
12474        <div id="comment-section">
12475            <div class="date ogl align-items-center">
12476                <div class="input-box">
12477                    <input type="text" placeholder="Type your message..">
12478                    <!--  <div class="close">&times;</div>  -->
12479                    <div id="preview" class="preview-box">
12480
12481                    </div> <!-- Preview in the comment box -->
12482                    <div class="plus-comment"> <a href="#" class="add-graphic"><i class="fa-regular fa-plus"
12483                                aria-hidden="true"></i></a></div>
12484                    <div class="action-comment">
12485                        <!--                                            <a href="#"><i class="fa-regular fa-paper-plane-top"></i></a>-->
12486                        <a href="#"><i class="fa-regular fa-arrow-up" aria-hidden="true"></i></a>
12487                    </div>
12488
12489                </div>
12490            </div>
12491
12492            <div class="add-image" style="display:none">
12493                <ul class="d-flex">
12494                    <li><a href="#" id="image-trigger"><i class="fa-regular fa-image" aria-hidden="true"></i></a>
12494<input
12495                            type="file" id="image-input" accept="image/*" style="display:none;"></li>
12496                    <li><a href="#" id="video-trigger"><i class="fa-regular fa-video" aria-hidden="true"></i></a><input
12497                            type="file" id="video-input" accept="video/*" style="display:none;"></li>
12498                </ul>
12499            </div>
12500        </div>
12501    </div>
12502</div>
12503<div class="social-popup" id="report-brand">
12504    <div class="add-post-inner">
12505        <div class="report-container">
12506            <div class="header-report-brand">
12507                <!--
12508                    <div class="back-arrow"><a href="javascript:void(0)"
12509                            onclick='$("#report-brand").fadeOut("fast"); $("body").removeClass("overflow-hidden")'><i
12510                                class="fa-regular fa-arrow-left-long"></i></a></div>
12511                -->
12512            </div>
12513            <div class="report-heading">
12514                <div class="report-header d-flex justify-content-between">
12515                    <h3>Report</h3>
12516                    <div class="cross">
12517                    <a href="javascript:void(0)" onclick="$('#report-brand').removeAttr('data-postid'); $('#report-brand').fadeOut('fast')">
12518                        <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross" title="Cross">
12519                    </a>
12520                                </div>
12521                </div>
12522                <p>Trouble? Tell us what you’re experiencing or seeing. This helps us resolve the issue quickly and
12523                    effectively.</p>
12524            </div>
12525            <div class="report-scroll">
12526                <div class="report-scroll-inner">
12527                    <div class="product-for-report">
12528                        <div class="product-image" id="report-user-img">
12529                            <img src="https://www.jumpspree.com/public/images/user-icon.png?ver:1.023" alt="User" title="User">
12530                        </div>
12531                        <div class="product-description" id="report-user-desc">
12532                            <!-- <h3>Guest User</h3> -->
12533                            <div class="username">
12534                                <span id="report-username-txt">Guest</span>
12535                                <span id="report-username-check" style="display: none;">
12536                                    <img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
12537                                </span>
12538                            </div>
12539
12540                            <div id="report-post-txt">
12541                            </div>
12542
12543                        </div>
12544                    </div>
12545
12546                    <div class="report-reason">
12547                        <h4>What’s going on with this post?</h4>
12548                        
12549
12550                        <ul>
12551                                                        <li>
12552                                <label>
12553                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12554                                            type="radio" value="7"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Spam or Theft</div>
12555                                    <p>Unwanted promotional content or attempts to steal data, funds, or identities.</p>
12556                                </label>
12557                            </li>
12558                                                       <li>
12559                                <label>
12560                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12561                                            type="radio" value="2"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Hateful conduct</div>
12562                                    <p>Content that promotes hatred, discrimination, or violence against individuals or groups.
12562</p>
12563                                </label>
12564                            </li>
12565                                                       <li>
12566                                <label>
12567                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12568                                            type="radio" value="5"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Sale of illegal goods</div>
12569                                    <p>Attempting to sell items that are banned or illegal under the law.</p>
12570                                </label>
12571                            </li>
12572                                                       <li>
12573                                <label>
12574                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12575                                            type="radio" value="1"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Misleading information</div>
12576                                    <p>Sharing false or deceptive information intended to mislead others.</p>
12577                                </label>
12578                            </li>
12579                                                       <li>
12580                                <label>
12581                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12582                                            type="radio" value="3"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Act of violence or threat</div>
12583                                    <p>Content promoting or threatening physical harm or violence.</p>
12584                                </label>
12585                            </li>
12586                                                       <li>
12587                                <label>
12588                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12589                                            type="radio" value="4"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Nudity and sexual content</div>
12590                                    <p>Explicit sexual content or nudity that isn’t suitable for all audiences.</p>
12591                                </label>
12592                            </li>
12593                                                       <li>
12594                                <label>
12595                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12596                                            type="radio" value="6"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Intellectual property infringement</div>
12597                                    <p>Use of copyrighted material without permission, violating intellectual property rights.</p>
12598                                </label>
12599                            </li>
12600                                                       <li>
12601                                <label>
12602                                    <div class="d-flex"><span class="custom-radio"><input name="post-report-reason-check"
12603                                            type="radio" value="8"  onchange="showAdditionalReportDiv(this.value)" ><span class="checkmark" ></span></span> Something else</div>
12604                                    <p>Describe any other issue that’s not listed above. Such as impersonation, privacy, or child safety.</p>
12605                                </label>
12606                            </li>
12607                           
12608
12609                            <li id="additional-comment-all" style="display:none">
12610                                <label>Additional comments (optional)</label>
12611                                <textarea name="report-additional-message" id="report-additional-message" placeholder="Additional details about your report will be helpful."></textarea>
12612                                <div class="count" id="remaining-report-count">0/300</div>
12613                            </li>
12614                        </ul>
12615
12616                        <!--
12617                                            <div class="report-note">
12618                                                <p><img src="https://www.jumpspree.com/public/images/clock-padlock.png" alt="Jumpspree"> Your report will remain private and confidential. We do not
12619                            share any information in this report with anyone.</p>
12620                                            </div>
12621                            -->
12622                    </div>
12623                </div>
12624
12625                <div class="post-foot add-post-foot d-flex justify-content-between">
12626
12627
12628
12629                    <div class="send-post">
12630                        <button type="button" id="report-post-btn" onclick="reportPost()">Submit</button>
12631                        <div class="cancel-btn" style="text-align: center;color: #fff;">
12632                            <span style="display: block; padding: 8px 0; cursor:pointer"  onclick="$('#report-brand').fadeOut(); $('body').removeClass('overflow-hidden');  $('#report-brand').removeAttr('data-postid');">Cancel</span>
12633                        </div>
12634                    </div>
12635                </div>
12636
12637            </div>
12638
12639        </div>
12640    </div>
12641</div>
12642
12643<div class="social-popup" id="report-brand-success">
12644    <div class="add-post-inner">
12645        <div class="report-container">
12646
12647            <h2>Got it!</h2>
12648            <p>Thanks for bringing this to our attention. Your reports help us improve the Jumpspree experience for you
12649                and our entire community. Thank you!</p>
12650
12651            <div class="post-foot add-post-foot d-flex justify-content-between">
12652                <div class="send-post">
12653                    <button type="button"
12654                        onclick="$('#report-brand-success').fadeOut(); $('body').removeClass('overflow-hidden')">Close</button>
12655
12656                </div>
12657            </div>
12658        </div>
12659    </div>
12660</div>
12661<div class="social-popup" id="report-product">
12662    <div class="add-post-inner">
12663        <div class="report-container">
12664            <div class="header-report-brand">
12665                <div class="back-arrow"><a href="javascript:void(0)"
12666                        onclick='$("#report-brand").fadeOut("fast"); $("body").removeClass("overflow-hidden")'><i
12667                            class="fa-regular fa-arrow-left-long"></i></a></div>
12668            </div>
12669            <div class="report-heading">
12670                <h3>Report</h3>
12671                <!--
12672                <p>Trouble? Tell us what you’re experiencing or seeing. This helps us resolve the issue quickly and
12673                    effectively.</p>
12674-->
12675            </div>
12676
12677            <div class="report-scroll">
12678                <div class="report-scroll-inner">
12679
12680                    <div class="product-for-report">
12681                        <div class="product-image">
12682                            <img src="https://cubesnack-seller.s3.amazonaws.com/products/2510230901007278.webp"
12683                                alt="Product" title="Product">
12684                        </div>
12685                        <div class="product-description">
12686                            <h3>This is the product title</h3>
12687                            <!--                    <div class="seller-name"><span>Sold by :</span> We Web Pro Shop</div>-->
12688                            <div class="price">$99.99</div>
12689                        </div>
12690                    </div>
12691
12692                    <div class="report-reason">
12693                        <h4>What’s going on with this item?</h4>
12694
12695                        <ul>
12696                            <li><label>
12697                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12698                                                type="radio"><span class="checkmark"></span></span> Spam or Theft</div>
12699                                    <p>Unwanted promotional content or attempts to steal data, funds, or identities.</p>
12700                                </label>
12701                            </li>
12702                            <li><label>
12703                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12704                                                type="radio"><span class="checkmark"></span></span> Hateful Conduct
12705                                    </div>
12706                                    <p>Content that promotes hatred, discrimination, or violence against individuals or
12707                                        groups.</p>
12708                                </label></li>
12709                            <li><label>
12710                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12711                                                type="radio"><span class="checkmark"></span></span> Sale of Illegal
12712                                        Goods</div>
12713                                    <p>Attempting to sell items that are banned or illegal under the law.</p>
12714                                </label></li>
12715                            <li><label>
12716                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12717                                                type="radio"><span class="checkmark"></span></span> Misleading
12718                                        information</div>
12719                                    <p>Sharing false or deceptive information intended to mislead others.</p>
12720                                </label></li>
12721                            <li><label>
12722                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12723                                                type="radio"><span class="checkmark"></span></span> Act of Violence or
12724                                        Threat</div>
12725                                    <p>Content promoting or threatening physical harm or violence.</p>
12726                                </label></li>
12727                            <li><label>
12728                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12729                                                type="radio"><span class="checkmark"></span></span> Nudity and Sexual
12730                                        Content</div>
12731                                    <p>Explicit sexual content or nudity that isn’t suitable for all audiences.</p>
12732                                </label></li>
12733                            <li><label>
12734                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12735                                                type="radio"><span class="checkmark"></span></span>Intellectual Property
12736                                        Infringement</div>
12737                                    <p>Use of copyrighted material without permission, violating intellectual property
12738                                        rights.</p>
12739                                </label></li>
12740                            <li id="something-else"><label>
12741                                    <div class="d-flex"><span class="custom-radio"><input name="reason"
12742                                                type="radio"><span class="checkmark"></span></span> Something Else</div>
12743                                    <p>Describe any other issue that’s not listed above. Such as impersonation, privacy,
12744                                        or child safety.</p>
12745                                </label></li>
12746                            <li id="additional-comment" style="display:none">
12747                                <label>Additional comments (optional)</label>
12748                                <textarea name="" id=""
12749                                    placeholder="Additional details about your report will be helpful."></textarea>
12750                                <div class="count">0/300</div>
12751                            </li>
12752                        </ul>
12753
12754                        <!--
12755                <div class="report-note">
12756                    <p><img src="https://www.jumpspree.com/public/images/clock-padlock.png" alt="Jumpspree"> Your report will remain private and confidential. We do not
12757share any information in this report with anyone.</p>
12758                </div>
12759-->
12760                    </div>
12761                </div>
12762                <div class="post-foot add-post-foot d-flex justify-content-between">
12763
12764
12765
12766                    <div class="send-post">
12767                        <button type="button"
12768                            onclick="$('#report-brand-success').fadeIn('fast'); $('#report-product').hide();">Submit</button>
12769                        <div class="cancel-btn">
12770                            <span
12771                                onclick="$('#report-product').fadeOut(); $('body').removeClass('overflow-hidden')">Cancel</span>
12772                        </div>
12773                    </div>
12774                </div>
12775
12776            </div>
12777
12778        </div>
12779    </div>
12780</div>
12781
12782
12783
12784
12785<div class="social-popup" id="send-message-popup">
12786    <div class="add-post-inner">
12787        <div class="report-container">
12788            <div class="header-report-brand">
12789                <div class="back-arrow"><a href="javascript:void(0)"
12790                        onclick='$("#report-brand").fadeOut("fast"); $("body").removeClass("overflow-hidden")'><i
12791                            class="fa-regular fa-arrow-left-long"></i></a></div>
12792                <h3>Report</h3>
12793            </div>
12794
12795            <div class="product-for-report">
12796                <div class="product-image">
12797                    <img src="https://cubesnack-seller.s3.amazonaws.com/products/2510230901007278.webp" alt="Product"
12798                        title="Product">
12799                </div>
12800                <div class="product-description">
12801                    <h3>Air Jordan 3 NRG “Free Throw Line</h3>
12802                    <div class="seller-name"><span>Sold by :</span> We Web Pro Shop</div>
12803                    <div class="price"><span>Price : </span> $22.88</div>
12804                </div>
12805            </div>
12806
12807            <div class="report-reason">
12808                <h4>Why are you repoting this item?</h4>
12809                <p>We take reports seriously and ensure that proper measures are taken to create a safer experience on
12810                    Jumpspree.</p>
12811
12812                <ul>
12813                    <li><label>Misleading information <input name="reason" type="radio"></label></li>
12814                    <li><label>Hateful conduct <input name="reason" type="radio"></label></li>
12815                    <li><label>Act of violence or threat <input name="reason" type="radio"></label></li>
12816                    <li><label>Nudity and sexual content <input name="reason" type="radio"></label></li>
12817                    <li><label>Sale of illegal goods <input name="reason" type="radio"></label></li>
12818                    <li><label>Intellectual property infringement <input name="reason" type="radio"></label></li>
12819                    <li><label>Spam <input name="reason" type="radio"></label></li>
12820                    <li><label>Something else <input name="reason" type="radio"></label></li>
12821                </ul>
12822
12823                <div class="report-note">
12824                    <p>Your report will remain private and confidential. We do not
12825                        share any information in this report with anyone.</p>
12826                </div>
12827            </div>
12828
12829            <div class="post-foot add-post-foot d-flex justify-content-between">
12830
12831
12832
12833                <div class="send-post">
12834                    <button type="button">Submit</button>
12835                </div>
12836            </div>
12837
12838        </div>
12839    </div>
12840</div>
12841
12842<div class="social-popup" id="feedback-popup">
12843    <div class="add-post-inner">
12844        <div class="feedback-container">
12845            <div class="header-report-brand">
12846                <h3>Feedback</h3>
12847                <div class="back-arrow"><span class="cancel" style="color: #b8b8b8 !important; cursor:pointer"
12848                        onclick='$("#feedback-popup").fadeOut("fast"); $("body").removeClass("overflow-hidden")'>Cancel</span>
12849                </div>
12850            </div>
12851
12852
12853
12854            <div class="Feedback-sec">
12855                <p>How was your shopping experience with Jumpspree?</p>
12856
12857                <ul>
12858                    <li><label><input name="reason" type="radio"> <i class="fa-regular fa-face-grin-hearts"></i></label>
12859                        <p>Love it</p>
12860                    </li>
12861                    <li><label><input name="reason" type="radio"> <i class="fa-regular fa-face-smile"></i></label>
12862                        <p>Like it</p>
12863                    </li>
12864                    <li><label><input name="reason" type="radio"> <i class="fa-regular fa-face-frown"></i></label>
12865                        <p>Need work</p>
12866                    </li>
12867                </ul>
12868
12869                <div class="other-feedback">
12870                    <p>Any comments or suggestions for us? - (Optional)</p>
12871                    <textarea name="" id="" placeholder="Tell us what we can do differently or better"></textarea>
12872                </div>
12873            </div>
12874
12875            <div class="post-foot add-post-foot d-flex justify-content-between">
12876
12877
12878
12879                <div class="send-post">
12880                    <button type="button">Submit</button>
12881                </div>
12882            </div>
12883
12884        </div>
12885    </div>
12886</div>
12887
12888
12889<div class="social-popup" id="blog-post">
12890    <div class="add-post-inner">
12891        <div class="header-post social-add-header">
12892            <div class="header-add-post">
12893                <div class="fnc mt-0 justify-content-between mb-5">
12894                    <div class="d-flex">
12895                        <div class="fig"><img
12896                                src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg"
12897                                style="border-radius:50%" alt="Product" title="Product"></div>
12898                        <div class="fnc-title">
12899                            <h4>Jumpspree</h4>
12900                            <p>@vic</p>
12901                        </div>
12902                    </div>
12903
12904                    <div class="drop-down-blog"><a class="discard-button" href="javascript:void(0)"
12905                            onclick="$(this).parents('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden');">Discard</a>
12906
12907                    </div>
12908                </div>
12909
12910
12911            </div>
12912
12913            <div class="post-area-inside">
12914                <div class="add-title">
12915                    <input type="text" placeholder="Add title">
12916                </div>
12917
12918                <div class="upload-article-image">
12919                    <div class="upload"><i class="fa-light fa-cloud-arrow-up"></i>
12920                        <p>Upload Image</p>
12921                        <p><small>1920 x 1080 resolutions works best</small></p>
12922                    </div>
12923
12924                    <input type="file" class="uplaod-blog">
12925                </div>
12926
12927                <div class="add-title">
12928                    <input type="text" placeholder="Add upto 20 @mentions here">
12929                </div>
12930                <div class="add-title">
12931                    <input type="text" placeholder="Add upto 20 #hashtags here">
12932                </div>
12933
12934                <div class="add-title">
12935                    <span><i class="fa-regular fa-circle-plus"></i></span> <span>Start typing your article
12936                        content</span>
12937                </div>
12938            </div>
12939
12940
12941            <div class="post-foot add-post-foot d-flex justify-content-between">
12942
12943                <!--
12944                                  <div class="add-image">
12945                                       <ul class="d-flex p-0 m-0">
12946                                           <li><a href="#"><input type="file"><i class="fa-regular fa-image"></i></a></li>
12947                                           <li><a href="#"><input type="file"><i class="fa-regular fa-video"></i></a></li>
12948                                           <li><a href="#"><input type="file"><i class="fa-regular fa-gif"></i></a></li>
12949                                       </ul>
12950                                   </div>
12951                    -->
12952
12953                <div class="send-post w100">
12954                    <button type="button" class="blue-bg">Publish</button>
12955                </div>
12956            </div>
12957
12958        </div>
12959    </div>
12960</div>
12961
12962
12963<!-- POLL START HERE -->
12964<!-- POLL START HERE -->
12965<div class="social-popup" id="create-poll">
12966    <div class="add-post-inner">
12967        <div class="header-post social-add-header">
12968            <div class="create-poll-head">
12969                <div class="back-post" onclick="$('#create-poll').hide(); $('#social-popup').fadeIn('fast');"><i
12970                        class="fa-regular fa-arrow-left"></i></div>
12971                <h2>Create Poll1</h2>
12972            </div>
12973
12974            <!--
12975            <div id="create-poll-main-box">
12976            <div class="create-poll-wrrapper-main">
12977                <div class="poll-created-by pb-2 pt-0">
12978                    <div class="fnc mt-0 justify-content-between mb-0">
12979                        <div class="d-flex flex1">
12980                            <div class="fig"><img
12981                                    src="https://cubesnack-seller.s3.amazonaws.com/products/2610240610366368.jpg"
12982                                    style="border-radius:50%" alt="Jumpspree"></div>
12983                            <div class="fnc-title flex1">
12984                                <h4>Jumpspree</h4>
12985                                <textarea id="pollDescription"
12986                                    oninput="this.style.height = &quot;&quot;;this.style.height = this.scrollHeight + &quot;px&quot;"
12987                                    placeholder="What's new?"></textarea>
12988                            </div>
12989                        </div>
12990                    </div>
12991                </div>
12992
12993                <div class="post-area-inside mb-0">
12994                    <div class="create-poll-option" id="pollOptionsContainer">
12995                        <div class="option">
12996                            <input type="text" class="poll-option-input" placeholder="Yes">
12997                        </div>
12998                        <div class="option">
12999                            <input type="text" class="poll-option-input" placeholder="No">
13000                        </div>
13001                        <div class="option add-another-option">
13002                            <input type="text" id="newPollOptionInput" placeholder="Add another option">
13003                             <button type="button" id="addPollOptionBtn">+</button> 
13004                        </div>
13005                    </div>
13006                    <div class="poll-time d-flex justify-content-between">
13007                        <div class="end-poll">
13008                            Ends in <input type="number" id="pollDuration" value="" min="1" max="168">h
13009                        </div>
13010                        <div class="remove-poll"><a href="javascript:void(0)"
13011                                onclick="$('#create-poll').hide(); $('#social-popup').fadeIn('fast');">Remove poll</a>
13012                        </div>
13013                    </div>
13014                </div>
13015            </div>
13016
13017            <div class="post-foot add-post-foot d-flex justify-content-between">
13018                <div class="any-one-can-reply">Anyone can reply, quote and vote</div>
13019                <div class="send-post">
13020                    <button type="button" id="createPollSubmit" class="blue-bg">Post</button>
13021                </div>
13022            </div>
13023            </div>
13024-->
13025        </div>
13026    </div>
13027</div>
13028<!-- POLL FORM ENDS HERE -->
13029
13030<div class="social-popup" id="search-popup-wrapper-new">
13031          <div class="add-post-inner">
13032      <div id="search-popup-wrapper">
13033            <h3>Search</h3> <div class="close" onclick="$('#search-popup-wrapper-new').fadeOut();$('body').removeClass('overflow-hidden');">&times;</div>
13034           <div class="search-box-inner-mix">
13035                 <div class="search-box">
13036                    <input type="text" placeholder="Search Jumpspree" id="search-main-input" autocomplete="off">
13037                    <i class="fa-regular fa-magnifying-glass" aria-hidden="true"></i>
13038                </div>
13039                <div class="search-suggestion-list" id="search-suggestion-list" style="display:none">
13040                    <ul id="search-suggestion-list-ul">
13041                    </ul>
13042                </div>
13043            </div>  
13044              </div>
13045              
13046            <div class="search-entry" id="search-entry" style="display:none">
13047                <div class="add-post-inner">
13048                    <h3>Results</h3> 
13049                    <div class="close" onclick="$('#search-entry').hide();$('#search-popup-wrapper').show();$('#search-popup-wrapper-new').removeClass('search-res-visible');">&times;</div>
13050
13051                    <div class="search-category">
13052                        <div class="d-flex justify-content-between">
13053                            <div class="ctg-group" id="ctg-filter" data-filter="relevance">
13054                                <button class="ctg active" data-tab="Posts" onclick="setSearchActiveCategory(this)">Posts</button>
13055                                <button class="ctg" data-tab="People" onclick="setSearchActiveCategory(this)">People</button>
13056                                <button class="ctg" data-tab="Articles" onclick="setSearchActiveCategory(this)">Articles</button>
13057                                <button class="ctg" data-tab="Products" onclick="setSearchActiveCategory(this)">Products</button>
13058                                <button class="ctg" style="display:none;" data-tab="Brands" onclick="setSearchActiveCategory(this)">Brands</button>
13059                            </div>
13060                            <div class="filter-menu">
13061                                <div class="profile-drop-down">
13062                                    <a href="javascript:void(0)" onclick="window.event.cancelBubble = true;$('.more-setting-pop').removeClass('more-settings');
13062$('.status .profile-drop-down &gt; ul').hide();$(this).parents('.email-box').siblings().find('.profile-drop-down &gt; ul').hide();$(this).next().slideToggle('fast');"><i class="hgi hgi-stroke hgi-preference-vertical"></i></a>
13063
13064
13065                                    <ul style="display: none;">
13066                                        <li id="recent-filter">
13067                                            <a href="javascript:void(0)" onclick="setSearchFilter('recent')">
13068                                                <span>Most recent</span>
13069                                                <i class="hgi hgi-stroke hgi-clock-03"></i>
13070                                            </a>
13071                                        </li>
13072
13073                                        <li id="relevance-filter">
13074                                            <a href="javascript:void(0)" onclick="setSearchFilter('relevance')">
13075                                                <span>Most relevant <i class="fa-solid fa-check" aria-hidden="true"></i></span>
13076                                                <i class="hgi hgi-stroke hgi-sparkles"></i>
13077                                            </a>
13078                                        </li>
13079                                        <li style="display: none;">
13080                                            <a href="javascript:void(0)"><span>
13081                                                    Clear filters</span>
13082                                                <i class="hgi hgi-stroke hgi-cancel-circle"></i>
13083                                            </a>
13084                                        </li>
13085
13086                                    </ul>
13087
13088
13089                                </div>
13090                            </div>
13091                        </div>
13092                    </div>
13093
13094                    <div class="search-results" id="search-results" style="width: 100%">
13095                        <div id="tab-posts" class="ctg-content">
13096                        </div>
13097
13098                        <div id="tab-posts-recent" class="ctg-content" style="display: none;">
13099                        </div>
13100                        
13101                        <div id="tab-people" class="ctg-content" style="display: none; width: 100%">
13102                        </div>
13103
13104                        <div id="tab-people-recent" class="ctg-content" style="display: none; width: 100%">
13105                            
13106                        </div>
13107
13108                        <div id="tab-articles" class="ctg-content" style="display: none; width: 100%">
13109                            
13110                        </div>
13111
13112                        <div id="tab-articles-recent" class="ctg-content" style="display: none; width: 100%">
13113                        </div>
13114
13115
13116                        <div id="tab-products" class="ctg-content" style="display: none; width: 100%">
13117                        </div>
13118
13119                        <div id="tab-products-recent" class="ctg-content" style="display: none; width: 100%">
13120                        </div>
13121
13122                        <div id="tab-brands" class="ctg-content" style="display: none; width: 100%">
13123                        </div>
13124
13125                        <div id="tab-brands-recent" class="ctg-content" style="display: none; width: 100%">
13126                        </div>
13127
13128                    </div>
13129                                
13130                </div>
13131
13132            </div>
13133
13134            <div class="recommended-for-you serch-box-searchpage" id="search-history-div" style="display: none;">
13135                <div class="d-flex align-items-center justify-content-between">
13136                    <h2>Search history</h2>
13137                    <a href="javascript:void(0)" onclick="deleteAllSearch()">Clear search results</a>
13138                </div>
13139                <p>What you searched in the last 30 days.</p>
13140
13141                <div id="search-history-results">
13142                </div>
13143            </div>
13144
13145      </div>
13146</div>
13147
13148
13149<script>
13150function draftButtonForPollCalled() {
13151    let deleteAllDraftBtn = document.getElementById('deleteAllDraftBtn');
13152    $('#areyousureDraft').prop('disabled', false).text('Yes');
13153    console.log('Draft button clicked!');
13154
13155    // Gather poll data
13156    let postText = $('#pollDescription').val().trim();
13157    let pollOptions = [];
13158    $('.poll-option-input').each(function() {
13159        const optionValue = $(this).val().trim();
13160        if (optionValue) {
13161            pollOptions.push(optionValue);
13162        }
13163    });
13164
13165    let pollDuration = $('#pollDuration').val().trim();
13166    if (pollDuration === '') {
13167        pollDuration = '24'; // Default if user didn’t select anything
13168    }
13169
13170    let formData = new FormData();
13171    formData.append('postText', postText);
13172    formData.append('pollOptions', JSON.stringify(pollOptions));
13173    formData.append('duration', pollDuration);
13174    formData.append('is_blog', '2');
13175    formData.append('is_draft', '1'); // Indicates draft mode
13176
13177    $.ajax({
13178        url: base_url + '/addPost', // this save polls As a DRAFT
13179        type: 'POST',
13180        data: formData,
13181        processData: false,
13182        contentType: false,
13183        success: function(response) {
13184            let result = JSON.parse(response);
13185            if (result.status) {
13186                // Success! Now reset UI like add-post
13187                // setTimeout(function () {
13188                let message = 'Draft Saved!';
13189                deleteAllDraftBtn.style.display = 'block';
13190                showNotification('success', message);
13191
13192                // Close modal
13193                $('#save-draft').fadeOut('fast');
13194                $('#poll-save-draft').fadeOut('fast');
13195                $('.social-popup').fadeOut('fast');
13196                $('body').removeClass('overflow-hidden');
13197                $('.social-shadow').hide();
13198                $('.add-post').removeClass('add-post-opened');
13199                $('.add-post-drop-box').hide();
13200
13201                // Reset poll form
13202                $('#pollDescription').val('');
13203                $('#pollDuration').val(''); // or '24'
13204                $('#pollOptionsContainer .option:not(:last-child)').remove(); // remove all but "Add more"
13205                $('#newPollOptionInput').val('');
13206                $('.duration-btn').removeClass('selected');
13207                $('#createPollSubmit').removeClass('activated').addClass('disabled');
13208                // }, 1000);
13209                handleDiscardPollActionFinal();
13210                getSocialFeed('3', '1', '1', '');
13211            } else {
13212                showNotification('error', result.message || 'Error saving draft.');
13213            }
13214        },
13215        error: function() {
13216            showNotification('error', 'Failed to save draft. Please try again.');
13217        }
13218    });
13219}
13220
13221
13222// Define the function and attach it to the global `window` object
13223window.draftButtonCalled = function() {
13224
13225    let deleteAllDraftBtn = document.getElementById('deleteAllDraftBtn');
13226    $('#areyousureDraft').prop('disabled', false).text('Yes');
13227    console.log('Draft button clicked!');
13228    handleAddPost(1); // Save as draft
13229    setTimeout(function() {
13230        let message = 'Draft Saved!';
13231        deleteAllDraftBtn.style.display = 'block';
13232        showNotification('success', message);
13233        $('#save-draft').fadeOut('fast');
13234        $('.social-popup').fadeOut('fast');
13235        $('#post-setting-box input[type="checkbox"]').prop('checked', false);
13236        $('body').removeClass('overflow-hidden');
13237        $('.social-shadow').hide();
13238        $('.add-post').removeClass('add-post-opened');
13239        $('.add-post-drop-box').hide();
13240    }, 2000)
13241    // Perform UI updates
13242
13243};
13244
13245$(document).ready(function() {
13246    // Handle normal post submission
13247    $('#addPost-form-submit').on('click', function(e) {
13248        e.preventDefault();
13249        handleAddPost(0); // Normal post
13250    });
13251    $('#repost-form-submit').on('click', function(e) {
13252        e.preventDefault();
13253        handleAddRePost(0); // re post handeling
13254    });
13255
13256
13257
13258});
13259
13260//30 april 
13261document.getElementById('addPostTextarea').addEventListener('input', function() {
13262    let maxChars = 260;
13263    const isVerified = null;
13264    if (isVerified != 0 && isVerified != '0') {
13265        maxChars = 880;
13266    }
13267
13268    const circleRadius = 22;
13269    const circleCircumference = 2 * Math.PI * circleRadius;
13270
13271    const buttonContainerClass = $('.addPost-form-submit');
13272    const progressCircle = $('.progress');
13273    //const postText = this.value.trim();
13274    const postText = this.innerText.trim();
13275
13276    const currentLength = postText.length;
13277    const remainingChars = maxChars - currentLength;
13278
13279    const charCountDisplay = $('#char-count');
13280    charCountDisplay.text(`${remainingChars}`);
13281    charCountDisplay.css('color', remainingChars < 0 ? 'red' : '');
13282
13283    const percentage = Math.min(currentLength / maxChars, 1);
13284    const offset = circleCircumference * (1 - percentage);
13285    progressCircle.css('stroke-dasharray', `${circleCircumference}`);
13286    progressCircle.css('stroke-dashoffset', offset);
13287
13288    // 🔍 Check for media
13289    const imageInput = document.getElementById('imageInput');
13290    const videoInput = document.getElementById('videoInput');
13291    const gifBox = document.getElementById('gifPreviewBox');
13292    const gifPreview = document.getElementById('gifPreviewAddPost');
13293
13294    const hasImage = imageInput && imageInput.files.length > 0;
13295    const hasVideo = videoInput && videoInput.files.length > 0;
13296    const hasGif = gifBox && gifBox.style.display !== 'none' && gifPreview && gifPreview.getAttribute('src');
13297
13298    console.log('Text Length:', currentLength);
13299    console.log('Has Image:', hasImage);
13300    console.log('Has Video:', hasVideo);
13301    console.log('Has GIF:', hasGif);
13302
13303    // ✅ Final decision for button
13304    const shouldEnable =
13305        (currentLength > 0 && currentLength <= maxChars) ||
13306        hasImage || hasVideo || hasGif;
13307
13308    console.log('Button should be enabled?', shouldEnable);
13309
13310    if (shouldEnable) {
13311        buttonContainerClass.removeClass('disabled').addClass('active');
13312    } else {
13313        buttonContainerClass.removeClass('active').addClass('disabled');
13314    }
13315});
13316
13317
13318$(document).ready(function() {
13319
13320
13321
13322
13323    // Function to check the validity of the poll form
13324    function checkPollFormValidity() {
13325        let postText = $('#pollDescription').val().trim();
13326        let pollOptions = [];
13327        $('.poll-option-input').each(function() {
13328            const optionValue = $(this).val().trim();
13329            if (optionValue) {
13330                pollOptions.push(optionValue);
13331            }
13332        });
13333        let pollDuration = $('#pollDuration').val().trim();
13334
13335        if (postText && pollOptions.length >= 2) {
13336            $('#createPollSubmit').removeClass('disabled').addClass('activated');
13337        } else {
13338            $('#createPollSubmit').removeClass('active').addClass('disabled');
13339        }
13340    }
13341
13342    // Add new poll option
13343    /*  $('#addPollOptionBtn').on('click', function () {
13344         const newOptionValue = $('#newPollOptionInput').val().trim();
13345         if (newOptionValue) {
13346             $('#pollOptionsContainer').append(`
13347                 <div class="option">
13348                     <input type="text" class="poll-option-input" value="${newOptionValue}" readonly>
13349                 </div>
13350             `);
13351             $('#newPollOptionInput').val('');
13352             checkPollFormValidity();  // Check form validity after adding a new option
13353         } else {
13354             alert('Option text cannot be empty.');
13355         }
13356     }); */
13357
13358    // Poll description or options change
13359    $('#pollDescription, .poll-option-input, #pollDuration').on('input', function() {
13360        checkPollFormValidity(); // Check form validity whenever any input changes
13361    });
13362
13363    // Submit poll form
13364    const dayToHours = {
13365        '1 day': 24,
13366        '3 days': 72,
13367        '5 days': 120,
13368        '7 days': 168,
13369        '14 days': 336
13370    };
13371    $('.duration-btn').on('click', function() {
13372        // Remove 'selected' class from all and add to current
13373        $('.duration-btn').removeClass('selected');
13374        $(this).addClass('selected');
13375
13376        // Get text and convert to hours
13377        const selectedText = $(this).text().trim();
13378        const hours = dayToHours[selectedText];
13379
13380        if (hours) {
13381            $('#pollDuration').val(hours); // Set to input
13382        }
13383    });
13384    $('#createPollSubmit').on('click', function(e) {
13385        e.preventDefault();
13386
13387        // Get the state of the checkboxes 
13388        let commentsOff = $('#post-setting-dropup-poll input[type="checkbox"]:eq(0)').is(':checked') ?
13389            1 : 0;
13390        let hideLike = $('#post-setting-dropup-poll input[type="checkbox"]:eq(1)').is(':checked') ? 1 :
13391            0;
13392
13393
13394        let postText = $('#pollDescription').val().trim();
13395        let pollOptions = [];
13396        $('.poll-option-input').each(function() {
13397            const optionValue = $(this).val().trim();
13398            if (optionValue) {
13399                pollOptions.push(optionValue);
13400            }
13401        });
13402        let pollDuration = $('#pollDuration').val().trim();
13403        if (pollDuration === '') {
13404            pollDuration = '24'; // Default to 24 hours if empty
13405        }
13406        /* if (!pollDuration || isNaN(pollDuration) || parseInt(pollDuration) < 1) {
13407            showNotification('error', 'Please select a valid poll duration (minimum 1 hour).');
13408            return;
13409        } */
13410
13411        if (!postText || pollOptions.length < 2) {
13412            showNotification('error', 'Please add a description and at least two options.');
13413            return;
13414        }
13415
13416        let formData = new FormData();
13417        formData.append('postText', postText);
13418        formData.append('pollOptions', JSON.stringify(pollOptions));
13419        formData.append('duration', pollDuration);
13420        formData.append('is_blog', '2');
13421        formData.append('IsCommentBlocked', commentsOff);
13422        formData.append('hideLike', hideLike);
13423
13424        $.ajax({
13425            url: base_url + '/addPost', // this will save data in add post poll
13426            type: 'POST',
13427            data: formData,
13428            processData: false,
13429            contentType: false,
13430            success: function(response) {
13431                let result = JSON.parse(response);
13432                if (result.status) {
13433                    showNotification('success', 'Poll Created Successfully!');
13434                    /*  $('#create-poll').hide();
13435                     $('#pollDescription').val('');
13436                     $('#pollOptionsContainer .option:not(:last-child)').remove();
13437                     $('#pollDuration').val('24'); */
13438                    getSocialFeed('3', '1', '1', '');
13439
13440                    $('.social-popup').fadeOut('fast');
13441                    $('body').removeClass('overflow-hidden');
13442                    $('.social-shadow').hide();
13443                    $('.add-post').removeClass('add-post-opened');
13444                    $('.add-post-drop-box').hide();
13445
13446                    // Reset poll form
13447                    $('#pollDescription').val('');
13448                    $('#pollDuration').val(''); // or '24'
13449                    $('#pollOptionsContainer .option:not(:last-child)')
13450                .remove(); // remove all but "Add more"
13451                    $('#newPollOptionInput').val('');
13452                    $('.duration-btn').removeClass('selected');
13453                    $('#createPollSubmit').removeClass('activated').addClass('disabled');
13454
13455                    handleDiscardPollActionFinal();
13456
13457                    // $('#create-poll').hide();       
13458                    checkPollFormValidity(); // Ensure the button is disabled after success
13459                    // window.location.reload();
13460                } else {
13461                    showNotification('error', result.message ||
13462                        'An error occurred while creating the poll.');
13463                }
13464            },
13465            error: function(xhr, status, error) {
13466                //console.error('Error:', error);
13467                showNotification('error', 'Failed to create poll. Please try again.');
13468            }
13469        });
13470    });
13471
13472    // Initial check on page load in case of pre-filled data
13473    checkPollFormValidity();
13474});
13475</script>
13475
13476<!-- POLL ENDS HERE -->
13477
13478<div class="social-popup" id="edit-address">
13479    <div class="add-post-inner">
13480        <div class="header-post social-add-header">
13481            <div class="create-poll-head">
13482
13483                <h2>Edit Address</h2>
13484            </div>
13485
13486            <div id="step4-wrapper">
13487                <div class="add-credit-card">
13488                    <div class="card-detail" style="display:flex !important">
13489                        <div class="name-on-card">
13490                            <input type="text" placeholder="Full Name" value="vic">
13491                        </div>
13492                        <div class="name-on-card">
13493                            <input type="text" placeholder="Address Line 1" value="3 Audrey Avenue, 5 Audrey Ave">
13494                        </div>
13495
13496                        <div class="name-on-card">
13497                            <input type="text" placeholder="Address Line 2 (optional)">
13498                        </div>
13499
13500                        <div class="d-flex gap-10">
13501                            <div class="flex-1"><input type="text" placeholder="City" value="Oyster Bay"></div>
13502                            <div class="flex-1"><input type="text" placeholder="State" value="NY"></div>
13503                        </div>
13504
13505
13506
13507                        <div class="name-on-card">
13508                            <input type="text" placeholder="Zip Code" value="11771">
13509                        </div>
13510
13511                        <div class="name-on-card">
13512                            <input type="text" placeholder="Phone Number" value="+1 9177405450">
13513                        </div>
13514
13515                        <div class="save">
13516                            <button class="add-card">Save</button>
13517                        </div>
13518                        <!--
13519                                    <div class="apply-to-all">
13520                                   <label class="apply-to-all"><input type="checkbox"> Save this as my default payment method</label>
13521                               </div>
13522-->
13523                    </div>
13524                </div>
13525
13526            </div>
13527
13528
13529
13530
13531        </div>
13532    </div>
13533</div>
13534
13535<div id="embed-code" onclick="window.event.cancelBubble = true;" style="display:none !important">
13536    <h3>Embed</h3>
13537    <div class="close"><span style="cursor:pointer; color:#b8b8b8; font-size:13px"
13538            onclick="$('#embed-code').removeClass('embed-in')">Cancel</span></div>
13539    <div class="embed-inner">
13540        <h5>HTML embed code</h5>
13541        <div id="embeded-code">
13542            <div class="email-box">
13543                <div class="row">
13544                    <div class="col-md-12">
13545                        <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
13546                            <div class="d-flex">
13547                                <a href="#" class="fig">
13548                                    <img src="https://cubesnack-seller.s3.amazonaws.com/products/1911240817124814.jpg"
13549                                        style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
13550                                </a>
13551                                <div class="fnc-title">
13552                                    <h4>
13553                                        <a href="#" class="profile-link">Vic 🇺🇸</a>
13554                                        <img src="https://www.jumpspree.com/public/images/blue-cube.png"
13555                                            class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
13556                                    </h4>
13557                                    <p><a href="#" class="profile-link">@Vic</a></p>
13558                                </div>
13559                            </div>
13560                            <!-- Dropdown menu code -->
13561                            <div class="follow-us">
13562                                <a href="javascript:void(0)" onclick="$(this).next().slideToggle('fast')">Follow</a>
13563
13564                            </div>
13565                        </div>
13566                    </div>
13567                </div>
13568
13569                <div class="row">
13570                    <div class="col-md-12">
13571                        <div class="post-text">
13572                            <p>This is the post content. This is the post content. This is the post content. This is the
13573                                post content. This is the post content. This is the post content. This is the post
13574                                content.</p>
13575
13576                        </div>
13577
13578                    </div>
13579                </div>
13580
13581                <div class="row">
13582                    <div class="col-md-12">
13583                        <div class="d-flex justify-content-between align-items-end mt-2">
13584                            <div class="heart">
13585                                <img src="https://www.jumpspree.com/public/images/liked-heart.png" alt="Like"
13586                                    title="Like" loading="lazy">
13587                                <p>45k</p>
13588                            </div>
13589
13590                            <div class="jumpspree">
13591                                <p>Jumpspree.com <img
13592                                        src="https://www.jumpspree.com/public/images/fav-icon.png?ver:1.026"
13593                                        loading="lazy" alt="Like" title="Like"></p>
13594                            </div>
13595                        </div>
13596                    </div>
13597                </div>
13598
13599
13600
13601            </div>
13602        </div>
13603        <div class="input-embed">
13604            <input id=":r3p9:0" class="s_JGcg fFOiLQ eoXdOg" dir="auto" spellcheck="false" type="text" readonly=""
13605                aria-label="HTML embed code" value="<div style=&quot;position: relative; width: 100%; height: 0; padding-top: 216.3551%;
13606                                                        padding-bottom: 0; box-shadow: 0 2px 8px 0 rgba(63,69,81,0.16); margin-top: 1.6em; margin-bottom: 0.9em; overflow: hidden;
13607                                                        border-radius: 8px; will-change: transform;&quot;>
13608                                                        <iframe loading=&quot;lazy&quot; style=&quot;position: absolute; width: 100%; height: 100%; top: 0; left: 0; border: none; padding: 0;margin: 0;&quot;
13609                                                            src=&quot;https://www.jumpspree.com/social&quot; allowfullscreen=&quot;allowfullscreen&quot; allow=&quot;fullscreen&quot;>
13610                                                        </iframe>
13611                                                    </div>">
13612            <button class="copy-embed" type="button">Copy</button>
13613        </div>
13614    </div>
13615</div>
13616
13617<div id="share-site-link" onclick="window.event.cancelBubble = true;">
13618    <h3>Share with..</h3>
13619    <div class="close">
13620        <span style="cursor:pointer" onclick="$('#share-site-link').removeClass('share-in-open')"
13621            class="cancel">Cancel</span>
13622    </div>
13623    <div class="embed-inner share-dialog-s">
13624        <div class="link mb-5">
13625            <div class="pen-url" id="share-url">https://www.jumpspree.com/social</div>
13626            <button type="button" class="copy-link" aria-label="copy" onclick="copyToClipboard('#share-url')">
13627                <i class="fa-regular fa-copy"></i>
13628            </button>
13629        </div>
13630        <div class="targets" id="social-share-buttons">
13631            <!-- Social buttons will be dynamically inserted here -->
13632        </div>
13633    </div>
13634</div>
13635
13636
13637<div id="discard">
13638
13639    <div class="discard-box">
13640        <p>Are you sure you want to go back? Your progress is not saved yet. You can tap on Save to save your progress
13641            insted.</p>
13642        <div class="action-btn">
13643            <a href="javascript:void(0)"
13644                onclick="$('.social-popup').hide(); $('#discard').removeClass('show-discard').fadeOut(); $('body').removeClass('overflow-hidden')">Yes</a>
13645            <a href="javascript:void(0)" onclick="$('#discard').hide()">Never mind</a>
13646        </div>
13647    </div>
13648
13649</div>
13650
13651
13652
13653<div id="add-alt-tag-preview" onclick="window.event.cancelBubble = true;">
13654    <div class="d-flex align-items-center">
13655        <h3>Image Description</h3>
13656        <div class="close"><span class="cancel" style="cursor:pointer"
13657                onclick="$('#add-alt-tag').removeClass('embed-in')">Cancel</span>
13658        </div>
13659    </div>
13660    <div class="embed-inner">
13661        <p>Alt text, or "alternative text," is a written description added to images on websites or digital content to
13662            describe what the image shows. It is primarily used to improve accessibility for people with visual
13663            impairments, as screen readers can read the alt text aloud. Alt text also helps search engines understand
13664            the image content, which can improve search ranking and visibility.</p>
13665
13666        <button class="copy-embed" type="button">Close</button>
13667    </div>
13668</div>
13669
13670
13671
13672
13673<div class="discard-conformation" id="save-draft" onclick="window.event.cancelBubble = true;">
13674    <div class="save-draft">
13675        <div class="d-flex align-items-center">
13676            <h3>Save to draft?</h3>
13677        </div>
13678        <div class="save-cancel">
13679            <button id="draft-save-btn2" class="copy-embed" type="button" onClick="draftButtonCalled()">Save</button>
13680            <!-- <button class="copy-embed discard-btn" type="button"
13681                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide()">Discard</button> -->
13682            <button onclick="handleClearAll()" class="copy-embed discard-btn" type="button" >Discard</button>
13683
13684        </div>
13685    </div>
13686</div>
13687
13688<div class="discard-conformation" id="poll-save-draft" onclick="window.event.cancelBubble = true;">
13689    <div class="save-draft">
13690        <div class="d-flex align-items-center">
13691            <h3>Save Poll to draft?</h3>
13692        </div>
13693        <div class="save-cancel">
13694            <button id="draft-poll-btn2" class="copy-embed" type="button"
13695                onClick="draftButtonForPollCalled()">Save</button>
13696            <!-- <button class="copy-embed discard-btn" type="button"
13697                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide()">Discard</button> -->
13698            <button class="copy-embed discard-btn" type="button"
13699                onclick="handleDiscardPollActionFinal()">Discard</button>
13700
13701        </div>
13702    </div>
13703</div>
13704
13705
13706<div class="discard-conformation" id="unschedule" onclick="window.event.cancelBubble = true;">
13707    <div class="save-draft">
13708        <div class="d-flex align-items-center">
13709            <div class="flex-direction-column">
13710                <h3>Unschedule</h3>
13711                <p>Are you sure you want to unschedule this post?</p>
13712            </div>
13713        </div>
13714        <div class="save-cancel">
13715            <button class="copy-embed" type="button" onclick="$('#unschedule').fadeOut('fast')">No</button>
13716            <!-- <button class="copy-embed discard-btn" type="button"
13717                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide()">Discard</button> -->
13718            <button class="copy-embed" type="button" onclick="unschedulePost()">Yes</button>
13719
13720        </div>
13721    </div>
13722</div>
13723
13724
13725<!-- Jumpspree More HTML Popup START  from here Feb 5 riaz  -->
13726
13727
13728
13729
13730
13731<div class="social-popup" id="jumpspree-more">
13732    <div class="add-post-inner">
13733
13734
13735        <div id="jpm-step1">
13736            <div id="jumpspree-more-wrapper">
13737                <div class="curved-box fixed-heading">
13738                    <div class="back-btn">
13739                        <a href="#" onclick="$('#step2-wrapper').hide(); $('#step1-wrapper').fadeIn(); ">
13740                            <img src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Arrow" title="Arrow"
13741                                style="filter:invert(0); height: auto; width:13px">
13742                        </a>
13743                    </div>
13744                    <h2>Jumpspree More</h2>
13745                    <div class="terms"><a href="https://www.jumpspree.com/termsofuse" target="_blank">Terms</a></div>
13746                </div>
13747                <div class="account-setting-inner">
13748                    <div class="jumpspree-more-intro">
13749                        <div class="route_title">
13750                            <img src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.06"
13751                                loading="lazy" alt="jumspree logo" title="jumspree logo"> MORE
13752                        </div>
13753                        <p>Get verified* and enhance your experience with Jumpspree More. Pick a plan to get started.
13754                        </p>
13755                    </div>
13756                    <div class="subscription-plan" id="subscription-plans"></div>
13757                    <h3>Included with Jumpspree More</h3>
13758                    <div class="jumpspree-more-wrapper mob-bot-0">
13759                        <div class="more-title">
13760                            <ul id="subscription-benefits">
13761                                <li><span class="check"><img
13762                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13763                                            title="Get a verified badge on your profile and brand page"></span>Get a
13764                                    verified badge on your profile and brand page</li>
13765                                <li><span class="check"><img
13766                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13767                                            title="Get a verified badge on your profile and brand page"></span>Publish
13768                                    long-form dynamic articles &amp; social posts</li>
13769                                <li><span class="check"><img
13770                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13771                                            title="Get a verified badge on your profile and brand page"></span>Get a
13772                                    higher character limit for social posts</li>
13773                                <li><span class="check"><img
13774                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13775                                            title="Get a verified badge on your profile and brand page"></span>Edit your
13776                                    social posts and articles for 30 minutes after
13777                                    publishing</li>
13778                                <li><span class="check"><img
13779                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13780                                            title="Get a verified badge on your profile and brand page"></span>Get
13781                                    priority placement in search and feed (beta)</li>
13782                                <li><span class="check"><img
13783                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13784                                            title="Get a verified badge on your profile and brand page"></span>Verified
13785                                    sellers get up to $200 in coverage with Jumpspree
13786                                    Purchase Protection</li>
13787                                <li><span class="check"><img
13788                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13789                                            title="Get a verified badge on your profile and brand page"></span>Get
13790                                    priority access to new features</li>
13791                                <li><span class="check"><img
13792                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13793                                            title="Get a verified badge on your profile and brand page"></span>Increased
13794                                    account security with identity verification powered
13795                                    by Stripe</li>
13796                                <li><span class="check"><img
13797                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13798                                            title="Get a verified badge on your profile and brand page"></span>Get
13799                                    priority support via chat and email</li>
13800
13801                            </ul>
13802                        </div>
13803                    </div>
13804                    <div id="payment-method" class="payment-method-outer mb-0 pb-0" style="display:none">
13805                        <div class="pro-sec">
13806                            <div class="probox">
13807                                <div class="select-business-type">
13808                                    <ul class="payment-method-select" id="payment-options"></ul>
13809                                </div>
13810                            </div>
13811                        </div>
13812                    </div>
13813                    <div class="continue-payment">
13814                        <!--  <button class="btn btn-continue deactivate" onclick="$('#jpm-step1').hide();$('#jpm-step4').fadeIn('fast');">
13815                            <i class="fa-solid fa-lock-keyhole"></i> Subscribe
13816                        </button> -->
13817                        <button class="btn btn-continue deactivate" onclick="redirectToStripe()">
13818                            <i class="fa-solid fa-lock-keyhole"></i> Subscribe
13819                        </button>
13820
13821                        <div class="subscribe-note">
13822                            <p><small>To receive a verified badge on your profile, you’ll need to complete your identity
13823                                    verification using a government-issued photo ID after you have purchased your
13824                                    subscription. Jumpspree partners with Stripe to verify your identity. Learn more
13825                                    about Stripe’s privacy policy.</small></p>
13826                        </div>
13827                    </div>
13828                </div>
13829            </div>
13830        </div>
13831
13832        <div id="jpm-step2" style="display:none">
13833            <div id="jumpspree-more-wrapper">
13834                <div class="curved-box fixed-heading">
13835                    <div class="back-btn">
13836                        <a href="#" onclick="$('#step2-wrapper').hide(); $('#step1-wrapper').fadeIn(); "><img
13837                                src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Arrow" title="Arrow"
13838                                style="filter:invert(0); height: auto; width:13px"></a>
13839                    </div>
13840                    <h2>Cancel Subscription</h2>
13841                    <div class="terms"><a href="https://www.jumpspree.com/termsofuse" target="_blank">Terms</a></div>
13842
13843                </div>
13844                <div class="account-setting-inner">
13845
13846                    <div class="jumpspree-more-intro d-flex align-items-center justify-content-between mb-15">
13847                        <div class="route_title"><img
13848                                src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.06"
13849                                loading="lazy" alt="jumspree logo" title="jumspree logo"> MORE
13850                        </div>
13851                        <div class="Subscribed">Subscribed</div>
13852                    </div>
13853                    <div class="your-plan">
13854                        <div class="user-details">
13855                            <div class="user-image">
13856                                <a href="#" class=""><img class="user-image"
13857                                        src="https://cubesnack-seller.s3.amazonaws.com/products/1710240254409095.jpg"
13858                                        alt="logo" title="logo"></a>
13859                            </div>
13860                            <div class="text-left profile_text">
13861                                <h4 class="icon-box-title">Vic 🇺🇸 <img
13862                                        src="https://www.jumpspree.com/public/images/blue-cube.png"
13863                                        class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
13864                                    <div>
13865                                        <small style="vertical-align:top">@vic</small>
13866                                    </div>
13867                                </h4>
13868                            </div>
13869                        </div>
13870
13871                        <div class="subscription-plan">
13872                            <div class="plan flex-dirextion-column bg-hover-off" onclick="$('#payment-method').hide()">
13873                                <div class="current-plan">
13874                                    <div class="d-flex justify-content-between">
13875                                        <div class="save"><i class="fa-solid fa-circle-check" aria-hidden="true"></i>
13876                                            Your current plan</div>
13877                                        <div class="renue"></div>
13878                                    </div>
13879                                </div>
13880                                <div class="left-plan flex-direction-column">
13881                                    <div class="d-flex justify-content-between align-items-center">
13882                                        <div class="price">Monthly - $8</div>
13883                                        <div class="plan-checked"><img
13884                                                src="https://www.jumpspree.com/public/images/white-check2.png"
13885                                                alt="Check" title="Check">
13886                                        </div>
13887                                    </div>
13888                                    <div class="plan-name">Renews on Oct 16, 2024</div>
13889                                </div>
13890                            </div>
13891                        </div>
13892                        <div class="are-you-sure">
13893                            <h3>Are you sure you want to cancel <br>your subscription?</h3>
13894                            <p>
13894By canceling your subscription you will permanently lose access to the following
13895                                features:</p>
13896                        </div>
13897                    </div>
13898                    <div class="jumpspree-more-wrapper">
13899                        <div class="more-title">
13900                            <!--                            <div class="route_title"><img src="https://www.jumpspree.com/public/images/Jumpspree-logo.png?ver:1.02" alt="Jumpspree"> More</div>-->
13901
13902                            <!--                        <h3>What’s More?</h3>-->
13903                            <ul>
13904                                <li><span class="check"><img
13905                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13906                                            title="Get a verified badge on your profile and brand page"></span>Get a
13907                                    verified badge on your profile and brand page</li>
13908                                <li><span class="check"><img
13909                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13910                                            title="Get a verified badge on your profile and brand page"></span>Publish
13911                                    long-form dynamic articles &amp; social posts</li>
13912                                <li><span class="check"><img
13913                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13914                                            title="Get a verified badge on your profile and brand page"></span>Get a
13915                                    higher character limit for social posts</li>
13916                                <li><span class="check"><img
13917                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13918                                            title="Get a verified badge on your profile and brand page"></span>Edit your
13919                                    social posts and articles for 30 minutes after
13920                                    publishing</li>
13921                                <li><span class="check"><img
13922                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13923                                            title="Get a verified badge on your profile and brand page"></span>Get
13924                                    priority placement in search and feed (beta)</li>
13925                                <li><span class="check"><img
13926                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13927                                            title="Get a verified badge on your profile and brand page"></span>Verified
13928                                    sellers get up to $200 in coverage with Jumpspree
13929                                    Purchase Protection</li>
13930                                <li><span class="check"><img
13931                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13932                                            title="Get a verified badge on your profile and brand page"></span>Get
13933                                    priority access to new features</li>
13934                                <li><span class="check"><img
13935                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13936                                            title="Get a verified badge on your profile and brand page"></span>Increased
13937                                    account security with identity verification powered
13938                                    by Stripe</li>
13939                                <li><span class="check"><img
13940                                            src="https://www.jumpspree.com/public/images/white-check.png" alt="Check"
13941                                            title="Get a verified badge on your profile and brand page"></span>Get
13942                                    priority support via chat and email</li>
13943                            </ul>
13944
13945                        </div>
13946                    </div>
13947                    <div class="continue-payment">
13948                        <div class="restore-note" style="display:none">
13949                            <h3>Are you sure you want to restore your subscription?</h3>
13950                            <p>Restoring your Jumpspree Verified subscription is super easy. You will not be required to
13951                                verify your email, phone number, and identity again. Your billing will begin starting
13952                                today. Cancel anytime.</p>
13953                        </div>
13954
13955                        <button class="btn btn-continue" type="button"
13956                            onclick="$('#jpm-step3').fadeIn('fast'); $('#jpm-step2').hide()">Proceed to cancel</button>
13957                        <div class="text-center text-white cancel-subscription">
13958                            <a href="javascript:void(0)"
13959                                onclick="$('#jpm-step2').hide(); $('#jpm-step4').fadeIn('fast');">I don’t want to
13960                                cancel</a>
13961                        </div>
13962                    </div>
13963                </div>
13964            </div>
13965        </div>
13966        <div id="jpm-step3" style="display:none">
13967            <div id="jumpspree-more-wrapper">
13968                <div class="curved-box fixed-heading">
13969                    <div class="back-btn">
13970                        <a href="javascript:void(0)" onclick="$('#jumpspree-more).fadeOut();"><img
13971                                src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Arrow" title="Arrow"
13972                                style="filter:invert(0); height: auto; width:13px"></a>
13973                    </div>
13974                    <h2>Subscription</h2>
13975                    <div class="terms"><a href="https://www.jumpspree.com/termsofuse" target="_blank">Terms</a></div>
13976
13977                </div>
13978                <div class="account-setting-inner">
13979                    <div class="your-plan">
13980                        <div class="user-details mb-15">
13981                            <div class="user-image">
13982                                <a href="#" class=""><img class="user-image"
13983                                        src="https://cubesnack-seller.s3.amazonaws.com/products/1710240254409095.jpg"
13984                                        alt="logo" title="logo"></a>
13985                            </div>
13986                            <div class="text-left profile_text">
13987                                <h4 class="icon-box-title">Vic 🇺🇸 <img
13988                                        src="https://www.jumpspree.com/public/images/blue-cube.png"
13989                                        class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">
13990
13991                                    <div>
13992                                        <small style="vertical-align:top">@vic</small>
13993                                    </div>
13994                                </h4>
13995                            </div>
13996                        </div>
13997
13998                        <div class="subscription-plan">
13999                            <div class="plan current-plan flex-dirextion-column bg-hover-off"
14000                                onclick="$('#payment-method').hide()">
14001                                <div class="current-plan">
14002                                    <div class="d-flex justify-content-between">
14003                                        <div class="save"><i class="fa-solid fa-circle-check" aria-hidden="true"></i>
14004                                            Your plan has been cancelled successfully.</div>
14005                                        <div class="renue"></div>
14006                                    </div>
14007                                </div>
14008                                <div class="left-plan flex-direction-column">
14009                                    <div class="price">Monthly - $8</div>
14010                                    <div class="plan-name">Renews monthly. Cancel anytime.</div>
14011                                </div>
14012
14013                            </div>
14014                        </div>
14015                        <div class="are-you-sure">
14016                            <h3>Sorry</h3>
14017                            <p>
14018                                Your Jumpspree Verified subscription has been canceled successfully. You will not be
14019                                billed further. </p>
14020                            <p>If you canceled this subscription by accident or would like to subscribe again, you can
14021                                always restore your subscription at any time. </p>
14022                            <p>Your subscription will be restored at the current pricing. Terms apply.</p>
14023                        </div>
14024                    </div>
14025                    <div class="continue-payment">
14026                        <!--
14027                        <div class="restore-note" style="display:none">
14028                            <h3>Are you sure you want to restore your subscription?</h3>
14029                            <p>Restoring your Jumpspree Verified subscription is super easy. You will not be required to
14030                                verify your email, phone number, and identity again. Your billing will begin starting
14031                                today. Cancel anytime</p>
14032                        </div>
14033-->
14034
14035                        <button class="btn btn-continue">Restore Subscription</button>
14036                        <div class="text-center text-white cancel-subscription">
14037                            <a href="#">Not now</a>
14038                        </div>
14039                    </div>
14040                </div>
14041            </div>
14042        </div>
14043
14044        <div id="jpm-step4" style="display:none">
14045            <div id="jumpspree-more-wrapper">
14046                <div class="curved-box fixed-heading">
14047                    <div class="back-btn">
14048                        <a href="javascript:void(0)" onclick="$('#jumpspree-more).fadeOut();"><img
14049                                src="https://www.jumpspree.com/public/images/arrow-left.png" alt="Back" title="Back"
14050                                style="filter:invert(0); height: auto; width:13px"></a>
14051                    </div>
14052                    <h2>Subscription</h2>
14053                    <div class="terms"><a href="https://www.jumpspree.com/termsofuse" target="_blank">Terms</a></div>
14054
14055                </div>
14056                <div class="account-setting-inner">
14057
14058                    <div class="jumpspree-more-intro d-flex align-items-center justify-content-between mb-15">
14059                        <div class="route_title"><img
14060                                src="https://www.jumpspree.com/public/images/logo-left.png?ver:1.06"
14061                                loading="lazy" alt="More" title="More"> MORE
14062                        </div>
14063
14064                        <div class="Subscribed">Subscribed</div>
14065
14066                    </div>
14067
14068                    <div class="your-plan">
14069                        <div class="subscription-plan">
14070                            <div class="plan current-plan flex-dirextion-column bg-hover-off"
14071                                onclick="$('#payment-method').hide()">
14072                                <div class="current-plan">
14073                                    <div class="d-flex justify-content-between">
14074                                        <div class="save"><i class="fa-solid fa-circle-check" aria-hidden="true"></i>
14075                                            Your current plan</div>
14076                                        <div class="renue"></div>
14077                                    </div>
14078                                </div>
14079                                <div class="left-plan flex-direction-column">
14080                                    <div class="price">Monthly - $8</div>
14081                                    <div class="plan-name">Renews on Oct 16, 2024</div>
14082                                </div>
14083
14084                            </div>
14085                            <div class="plan align-items-center  mb-0" onclick="$('#payment-method').hide()">
14086                                <label>
14087                                    <div class="left-plan flex-direction-column">
14088                                        <div class="d-flex mb-2 align-items-center">
14089                                            <div class="price">Yearly - $80</div>
14090                                            <div class="best-value">BEST VALUE</div>
14091                                        </div>
14092                                        <div class="plan-name">Save up to <span class="percent-off">17%</span> with the
14093                                            yearly plan. Renews annually.
14094                                            <br>Cancel anytime.
14095                                        </div>
14096                                    </div>
14097                                    <div class="get-plan checkbox">
14098                                        <input type="checkbox" name="get-more">
14099                                    </div>
14100                                </label>
14101                            </div>
14102                        </div>
14103                        <div class="are-you-sure">
14104                            <h3>Included with Jumpspree More</h3>
14105                            <div class="jumpspree-more-wrapper">
14106                                <div class="more-title">
14107                                    <ul>
14108                                        <li><span class="check"><img
14109                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14110                                                    alt="Check"
14111                                                    title="Get a verified badge on your profile and brand page"></span>Get
14112                                            a verified badge on your profile and brand page
14113                                        </li>
14114                                        <li><span class="check"><img
14115                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14116                                                    alt="Check"
14117                                                    title="Publish long-form dynamic articles &amp; social posts"></span>Publish
14118                                            long-form dynamic articles &amp; social posts
14119                                        </li>
14120                                        <li><span class="check"><img
14121                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14122                                                    alt="Checked"
14123                                                    title="Get a higher character limit for social posts"></span>Get a
14124                                            higher character limit for social posts</li>
14125                                        <li><span class="check"><img
14126                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14127                                                    alt="Checked" title="Edit your social posts and articles for 30 minutes
14128                                            after publishing"></span>Edit your social posts and articles for 30 minutes
14129                                            after publishing</li>
14130                                        <li><span class="check"><img
14131                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14132                                                    alt="Checked"
14133                                                    title="Get priority placement in search and feed (beta)"></span>Get
14134                                            priority placement in search and feed (beta)</li>
14135                                        <li><span clas
14135s="check"><img
14136                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14137                                                    alt="Checked" title="Verified sellers get up to $200 in coverage with
14138                                            Jumpspree Purchase Protection"></span>Verified sellers get up to $200 in
14139                                            coverage with
14140                                            Jumpspree Purchase Protection</li>
14141                                        <li><span class="check"><img
14142                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14143                                                    alt="Checked" title="Get priority access to new features"></span>Get
14144                                            priority access to new features</li>
14145                                        <li><span class="check"><img
14146                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14147                                                    alt="Checked" title="Increased account security with identity verification
14148                                            powered by Stripe"></span>Increased account security with identity
14149                                            verification
14150                                            powered by Stripe</li>
14151                                        <li><span class="check"><img
14152                                                    src="https://www.jumpspree.com/public/images/white-check.png"
14153                                                    alt="Checked"
14154                                                    title="Get priority support via chat and email"></span>Get priority
14155                                            support via chat and email</li>
14156                                    </ul>
14157
14158                                </div>
14159                            </div>
14160                        </div>
14161                    </div>
14162                    <div class="continue-payment">
14163                        <div class="restore-note" style="display:none">
14164                            <h3>Are you sure you want to restore your subscription?</h3>
14165                            <!--
14166                            <p>Restoring your Jumpspree Verified subscription is super easy. You will not be required to
14167                                verify your email, phone number, and identity again. Your billing will begin starting
14168                                today. Cancel anytime.</p>
14169-->
14170                        </div>
14171                        <button class="btn btn-continue">Switch Plan</button>
14172                        <div class="text-center text-white cancel-subscription">
14173                            <a href="javascript:void(0)"
14174                                onclick="$('#jpm-step4').hide(); $('#jpm-step2').fadeIn('fast');">Cancel
14175                                Subscription</a>
14176                        </div>
14177                    </div>
14178                </div>
14179            </div>
14180        </div>
14181
14182
14183    </div>
14184</div>
14185
14186<script>
14187function loadSubscriptionPlans() {
14188    $.ajax({
14189        url: 'subscription/plans',
14190        type: "GET",
14191        dataType: "json",
14192        success: function(response) {
14193            if (response.status === "success" && Array.isArray(response.plans)) {
14194                let plansHtml = "";
14195                response.plans.forEach((plan) => {
14196                    let bestValueBadge = plan.bestValue == "1" ?
14197                        '<div class="best-value">BEST VALUE</div>' : '';
14198
14199                    plansHtml += `
14200                        <div class="plan align-items-center">
14201                            <label onclick="handlePlanSelection('${plan.stripe_plan_id}', '${plan.stripe_price_id}', '${plan.amount}', '${plan.duration}', '${plan.body}')">
14202                                <div class="left-plan flex-direction-column">
14203                                    <div class="d-flex mb-2">
14204                                        <div class="price">${plan.duration} - $${plan.amount}</div>
14205                                        ${bestValueBadge}
14206                                    </div>
14207                                    <div class="plan-name">${plan.body}</div>
14208                                </div>
14209                                <div class="get-plan checkbox">
14210                                    <input type="radio" name="get-more" value="${plan.id}">
14211                                </div>
14212                            </label>
14213                        </div>`;
14214                });
14215
14216                $(".subscription-plan").html(plansHtml);
14217            } else {
14218                $(".subscription-plan").html(
14219                    "<p>Failed to load subscription plans. Please try again later.</p>");
14220            }
14221        },
14222        error: function(xhr, status, error) {
14223            // console.error("Error fetching plans:", error);
14224            $(".subscription-plan").html("<p>Something went wrong. Please try again later.</p>");
14225        }
14226    });
14227}
14228// Load plans lazily on first open of the Jumpspree More modal
14229var _socialPlansLoaded = false;
14230$(document).ready(function () {
14231    $(document).on('click', '[onclick*="jumpspree-more"]', function () {
14232        if (!_socialPlansLoaded) {
14233            _socialPlansLoaded = true;
14234            loadSubscriptionPlans();
14235        }
14236    });
14237});
14238
14239
14240
14241
14242
14243/* 
14244$(document).ready(function () {
14245    // Fetch subscription plans
14246    $.ajax({
14247        url: 'subscription/plans', // Replace with your actual API endpoint
14248        type: "GET",
14249        dataType: "json",
14250        success: function (response) {
14251            if (response.status === "success" && Array.isArray(response.plans)) {
14252                let plansHtml = "";
14253                response.plans.forEach((plan) => {
14254                    let bestValueBadge = plan.bestValue == "1" ? '<div class="best-value">BEST VALUE</div>' : '';
14255                    
14256                    plansHtml += `
14257                        <div class="plan align-items-center">
14258                            <label onclick="handlePlanSelection('${plan.stripe_plan_id}', '${plan.stripe_price_id}', '${plan.amount}', '${plan.duration}', '${plan.body}')">
14259                                <div class="left-plan flex-direction-column">
14260                                    <div class="d-flex mb-2">
14261                                        <div class="price">${plan.duration} - $${plan.amount}</div>
14262                                        ${bestValueBadge}
14263                                    </div>
14264                                    <div class="plan-name">${plan.body}</div>
14265                                </div>
14266                                <div class="get-plan checkbox">
14267                                    <input type="radio" name="get-more" value="${plan.id}">
14268                                </div>
14269                            </label>
14270                        </div>`;
14271                });
14272
14273                $(".subscription-plan").html(plansHtml);
14274            } else {
14275                $(".subscription-plan").html("<p>Failed to load subscription plans. Please try again later.</p>");
14276            }
14277        },
14278        error: function (xhr, status, error) {
14279            console.error("Error fetching plans:", error);
14280            $(".subscription-plan").html("<p>Something went wrong. Please try again later.</p>");
14281        }
14282    });
14283}); */
14284
14285function handlePlanSelection(planId, stripePriceId, amount, duration, body) {
14286    $('.continue-payment .btn.btn-continue').removeClass('deactivate');
14287    $('.btn.btn-continue').data('plan', {
14288        planId,
14289        stripePriceId,
14290        amount,
14291        duration,
14292        body
14293    });
14294}
14295
14296function redirectToStripe() {
14297    const planDetails = $('.btn.btn-continue').data('plan');
14298    if (!planDetails) {
14299        showNotification('error', 'Please select a plan first.');
14300        return;
14301    }
14302
14303    fetch('create-checkout-session', {
14304            method: 'POST',
14305            headers: {
14306                'Content-Type': 'application/json'
14307            },
14308            body: JSON.stringify(planDetails)
14309        })
14310        .then(response => response.json())
14311        .then(session => {
14312            console.log(session); // Debug response
14313            if (session.url) {
14314                window.location.href = session.url; // Redirect to Stripe Checkout
14315            } else {
14316                console.error('Stripe session URL is missing:', session);
14317            }
14318
14319        })
14320        .catch(error => {
14321            console.error('Error creating checkout session:', error);
14322            showNotification('error', 'Something went wrong, please try again.');
14323        });
14324}
14325</script>
14325
14326
14327<!-- Jumpree MORE END  -->
14328
14329
14330<div class="discard-conformation" id="jumpspree-more-popup" onclick="window.event.cancelBubble = true;">
14331    <div class="save-draft">
14332        <div class="d-flex align-items-center">
14333            <img src="https://www.jumpspree.com/public/images/more.png?ver=1_20008" alt="More" title="More" loading="lazy">
14334            <h3>Jumpspree More</h3>
14335            <p>Get verified and enhance your experience with Jumpspree More. While we’re working on bringing Jumpspree
14336                More to the Web, it is currently available in the Jumpspree App for iOS and Android only.</p>
14337        </div>
14338        <div class="save-cancel">
14339            <a href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android">Open
14340                Jumpspree</a>
14341            <!-- <button class="copy-embed discard-btn" type="button"
14342                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide()">Discard</button> -->
14343            <button class="copy-embed discard-btn" type="button">Maybe later</button>
14344
14345        </div>
14346    </div>
14347</div>
14348
14349<div class="discard-conformation" id="qrcode-popup" onclick="window.event.cancelBubble = true;">
14350    <div class="save-draft">
14351        <div class="d-flex align-items-center">
14352            <img src="https://www.jumpspree.com/public/images/qrcode.png?ver=1_20008" alt="QR Code" title="QR Code">
14353            <h3>Create your personalized QR code</h3>
14354            <p>Currently you can create your QR code in the Jumpspree app only. We’re working on building this
14355                functionality on the website as quickly as possible.</p>
14356        </div>
14357        <div class="save-cancel">
14358            <a href="https://www.jumpspree.com/download-the-official-jumpspree-app-for-ios-and-android">Open
14359                Jumpspree</a>
14360            <!-- <button class="copy-embed discard-btn" type="button"
14361                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide()">Discard</button> -->
14362            <button class="copy-embed discard-btn" type="button" onclick="$('#qrcode-popup').fadeOut('fast');">Maybe later</button>
14363
14364        </div>
14365    </div>
14366</div>
14367
14368<div class="discard-conformation" id="unfollow-confirmation" onclick="window.event.cancelBubble = true;">
14369    <div class="save-draft">
14370        <div class="d-flex align-items-center">
14371            <h3>Are you sure you want to unfollow <span id="unfollowusernamefooter"></span>?</h3>
14372        </div>
14373        <div class="save-cancel">
14374            <button class="copy-embed" type="button"
14375                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.fcb').removeClass('show-tip');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide();">Cancel</button>
14376
14377            <button class="copy-embed discard-btn unfollow-btn" data-rec="0" data-feed="0" data-user="0" data-type="0"
14378                id="footerunfollowbtn" type="button" onclick="unfollow()">Unfollow</button>
14379
14380        </div>
14381    </div>
14382</div>
14383<div class="discard-conformation" id="bu-confirmation" onclick="window.event.cancelBubble = true;">
14384    <div class="save-draft">
14385        <div class="d-flex align-items-center">
14386            <h3>Are you sure you want to <span id="butype"></span> <span id="buusername"></span>?</h3>
14387        </div>
14388        <div class="save-cancel">
14389            <button class="copy-embed" type="button"
14390                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.fcb').removeClass('show-tip');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide();">Cancel</button>
14391
14392            <button class="copy-embed discard-btn" data-rec="0" data-user="0" data-type="0" id="bubtn" type="button"
14393                onclick="blockUserFromFeed(this)"></button>
14394
14395        </div>
14396    </div>
14397</div>
14398
14399
14400<div class="discard-conformation" id="dp-confirmation" onclick="window.event.cancelBubble = true;">
14401    <div class="save-draft">
14402        <div class="d-flex align-items-center">
14403            <h3 id="delete-confirmation-text">Are you sure you want to delete this post?</h3>
14404        </div>
14405        <div class="save-cancel">
14406            <button id="deleteCancleBtn" class="copy-embed" type="button"
14407                onclick="$(this).parents('.discard-conformation').fadeOut('fast');$('.fcb').removeClass('show-tip');$('.social-popup').fadeOut('fast'); $('body').removeClass('overflow-hidden'); $('.social-shadow').hide();$('.add-post').removeClass('add-post-opened');$('.add-post-drop-box').hide();">Keep
14408                it</button>
14409
14410            <button class="copy-embed discard-btn" data-rec="0" data-id="0" data-feed="0" id="dpbtn" type="button"
14411                onclick="deleteUserPost(this)">Delete</button>
14412
14413        </div>
14414    </div>
14415</div>
14416
14417<div class="discard-conformation" id="discard-save-draft" onclick="window.event.cancelBubble = true;">
14418    <div class="save-draft">
14419        <div class="d-flex align-items-center">
14420            <h3>Are you sure you want to delete all drafts?</h3>
14421        </div>
14422        <div class="save-cancel">
14423            <!-- <button class="copy-embed" type="button"
14424                onclick="$('.draft-outer .drafts').remove(); $(this).parents('.discard-conformation').fadeOut('fast'); $('.no-drafts').addClass('no-draft-show')">Yes</button> -->
14425            <button id='areyousureDraft' class="copy-embed" type="button" onclick="deleteAllDrafts()">Yes</button>
14426
14427            <!-- <button id = "discard-btn" class="copy-embed discard-btn" type="button"
14428                onclick="$(this).parents('.discard-conformation').fadeOut('fast');" style="color:#bbb !important">Never
14429                mind</button> -->
14430            <button id="discard-btn-deleteall" class="copy-embed discard-btn" onclick="handleDiscardPollActionFinal()"
14431                type="button">Discard</button>
14432
14433        </div>
14434    </div>
14435</div>
14436
14437
14438
14439<div class="share-shadow"></div>
14440
14441<div class="get-app-qr-code-wrapper" id="ios-app">
14442    <div class="email-verification after-login">
14443        <div class="close-getstart" onclick="$('#ios-app').fadeOut('fast');">×</div>
14444        <div class="email-box">
14445            <h4 class="text-center">Get Jumpspree <br>for iOS</h4>
14446
14447
14448            <div class="scanner">
14449                <a target="_blank"
14450                    href="https://apps.apple.com/us/app/jumpspree-make-friends-shop/id1558701442?ign-itscg=30200&ign-itsct=apps_box_link&mttnsubad=1558701442"><img
14451                        src="https://www.jumpspree.com/public/images/Jumpspree-for-iOS-n.png?ver:1.02" alt="Jumpspree-for-iOS" title="Jumpspree-for-iOS"></a>
14452            </div>
14453
14454            <div class="download-btn">
14455                <a target="_blank"
14456                    href="https://apps.apple.com/us/app/jumpspree-make-friends-shop/id1558701442?ign-itscg=30200&ign-itsct=apps_box_link&mttnsubad=1558701442"><img
14457                        src="https://www.jumpspree.com/public/images/ios-download.png" alt="Download"
14458                        title="Download"></a>
14459            </div>
14460
14461
14462            <div class="note-line">
14463                <p class="mb-0">Scan the QR code with your smartphone or tablet to download the Jumpspree app for iOS,
14464                    or simply tap the button on your mobile device.</p>
14465            </div>
14466
14467            <div class="get-androd-app">
14468                <a href="javascript:void(0);" onclick="$('#android-app').fadeIn(); $('#ios-app').hide()">Get Jumpspree
14469                    for Android instead</a>
14470            </div>
14471
14472
14473
14474        </div>
14475        <!--
14476                       <div class="action-wrapper">
14477                           <button class="btn btn-success">Claim Username</button>
14478                       </div>
14479        -->
14480    </div>
14481</div>
14482
14483<div class="get-app-qr-code-wrapper" id="android-app">
14484    <div class="email-verification after-login">
14485        <div class="close-getstart" onclick="$('#android-app').fadeOut('fast');">×</div>
14486
14487        <div class="email-box" style="border: none !important;">
14488            <h4 class="text-center">Get Jumpspree <br>for Android</h4>
14489
14490
14491            <div class="scanner">
14492                <a target="_blank" href="https://play.google.com/store/apps/details?id=com.blueastral.cubesnack&hl=en">
14493                    <img src="https://www.jumpspree.com/public/images/Jumpspree-for-Android-n.png?ver:1.028"
14494                        alt="Jumpspree for Android" title="Jumpspree for Android"></a>
14495            </div>
14496
14497            <div class="download-btn">
14498                <a target="_blank"
14499                    href="https://play.google.com/store/apps/details?id=com.blueastral.cubesnack&hl=en"><img
14500                        src="https://www.jumpspree.com/public/images/download-android.png" alt="Download"
14501                        title="Download"></a>
14502            </div>
14503
14504
14505            <div class="note-line">
14506                <p class="mb-0">Scan the QR code with your smartphone or tablet to download the Jumpspree app for
14507                    Android, or simply tap the button on your mobile device..</p>
14508            </div>
14509
14510            <div class="get-androd-app">
14511                <a href="javascript:void(0);" onclick="$('#android-app').hide(); $('#ios-app').fadeIn()">Get Jumpspree
14512                    for iOS instead</a>
14513            </div>
14514
14515
14516
14517        </div>
14518        <!--
14519                       <div class="action-wrapper">
14520                           <button class="btn btn-success">Claim Username</button>
14521                       </div>
14522        -->
14523    </div>
14524</div>
14525
14526
14527<div class="profile-menu" style="display: none;">
14528    <div class="profile-heading">
14529        <div class="d-flex justify-content-between w100 align-items-center">
14530            <h2>Profile</h2>
14531            <div class="d-flex gap-3">
14532
14533                <li class="share-post uplad hide-on-desktop">
14534                    <a href="javascript:void(0)"
14535                        onclick="$('#theme-mobile').fadeIn('fast'); setTimeout(function(){
14536                        $('#theme-inside').addClass('showMe');
14537                        },300)">
14538                        <span class="c-img">
14539                            <img src="https://www.jumpspree.com/public/images/sun-01.png" alt="">
14540                        </span>
14541                    </a> 
14542                </li>
14543
14544
14545                   
14546                   <li class="share-post uplad hide-on-desktop"> 
14547                    <a href="javascript:void(0)"
14548                        onclick="window.event.cancelBubble = true; openShareDialog('profile-https://www.jumpspree.com'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');">
14549                        <span class="c-img">
14550                            <i class="hgi hgi-stroke hgi-sent"></i>
14551                        </span>
14552                    </a>
14553                </li>
14554
14555                <li class="share-post uplad hide-on-desktop">
14556                    <a href="javascript:void(0)" onclick="$('#qrcode-popup').fadeIn('fast')"><span class="c-img"><i
14557                                class="hgi hgi-stroke hgi-qr-code" aria-hidden="true"></i></span></a>
14558                </li>
14559            </div>
14560        </div>
14561        <div class="screen-mode" style="display:none">
14562
14563            <li onclick="$('.screen-mode-footer').addClass('show-mode');" class="light-mode active"><a href="#"
14564                    class="sidebar"><span class="route_title"><span><i
14565                                class="fa-regular fa-brightness"></i></span></span> </a></li>
14566            <!--                    <li onclick="$('body').addClass('dark-mode'); $(this).addClass('active'); $('.light-mode').removeClass('active')" class="dark-mode"><a  href="#"  class="sidebar"><span class="route_title"><span><i class="fa-solid fa-moon"></i></span> </span> </a></li>-->
14567
14568        </div>
14569    </div>
14570
14571
14572        <div class="profile-sign-in"
14573        data-name="none"
14574        style="">
14575        <button class="btn btn-primary"
14576            onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">Sign
14577            in</button>
14578        <button class="btn btn-outline" onclick="window.location.href='https://www.jumpspree.com/sign-up'">Create
14579            Account</button>
14580    </div>
14581
14582    <div class="profile-menu-inner">
14583        <div class="meu-tabbing d-flex" style="display:none !important">
14584            <h5 id="menu-tab1"
14585                onclick="$('#app-menu').hide(); $('#account-setting').fadeIn(); $(this).addClass('active'); $('#menu-tab2').removeClass('active'); $('#menu-tab3').removeClass('active'); $('#about-menu').hide();"
14586                class="active">General Settings</h5>
14587            <!--
14588                                <h5 id="menu-tab2"
14589                                    onclick="$('#app-menu').fadeIn(); $('#account-setting, #about-menu').hide(); $(this).addClass('active'); $('#menu-tab1, #menu-tab3').removeClass('active')">
14590                                    Seller Settings</h5>
14591                    -->
14592            <h5 id="menu-tab3"
14593                onclick="$('#account-setting, #app-menu').hide(); $('#about-menu').fadeIn(); $(this).addClass('active'); $('#menu-tab1, #menu-tab2').removeClass('active')">
14594                About</h5>
14595
14596        </div>
14597
14598        <!--        New section  -->
14599        <!--
14600         <style>
14601            .profile-menu div#account-setting.creator-settings .arrow
14602           {
14603                opacity: 1 !important;
14604            }
14605            .profile-menu div#account-setting.creator-settings p{color: #999;
14606    margin-bottom: 0;
14607    font-size: 12px;
14608    line-height: 14px;
14609    padding-left: 30px; }
14610.suer-creator-new-sec {
14611    background: #141414;
14612    border: 1px solid #1f1f1f;
14613    padding: 20px;
14614    background: #0e0e0e;
14615    border: 1px solid #141414;
14616    border-radius: 25px;
14617    margin-bottom: 20px;
14618}
14619.super-creator-text .gradient-text span {
14620    font-size: 10px;
14621    padding: 2px 7px;
14622}            
14623.suer-creator-new-sec .action-btn img {
14624    width: 10px;
14625}
14626.suer-creator-new-sec .action-btn {
14627    gap: 15px;
14628    margin-top: 15px;
14629}
14630.suer-creator-new-sec .text {
14631    font-size: 12px;
14632    line-height: 15px;
14633    color: #fff;
14634}            
14635.suer-creator-new-sec .action-btn button.btn {
14636    margin: 0;
14637    flex: 1;
14638    max-width: 50%;
14639    font-size: 10px;
14640    border-radius: 35px;
14641    padding: 10px 7px;
14642} 
14643.suer-creator-new-sec .image-icon {
14644    max-width: 30px;
14645}            
14646.suer-creator-new-sec .super-creator-text {
14647    padding: 0;
14648}            
14649.suer-creator-new-sec .super-creator-text .gradient-text {
14650    font-size: 23px;
14651}
14652.suer-creator-new-sec{position: relative;}            
14653.suer-creator-new-sec .cross-syper-creator {
14654    max-width: 20px;
14655    position: absolute;
14656    right: 19px;
14657    top: 19px;
14658    pointer-events: none;
14659}           
14660div#account-setting.creator-settings li {
14661    padding-right: 0px;
14662}            
14663div#account-setting.creator-settings li a {
14664    padding-right: 15px;
14665}            
14666 .close-super-creator-account span{color: #ff004d}  
14667 .close-super-creator-account i {
14668    color: #ff004d !important;
14669}
14670div#account-setting.creator-settings {
14671    margin-bottom: 25px;
14672}            
14673            @media screen(max-width:767px){
14674                div#account-setting.creator-settings i.hgi.hgi-stroke {
14675        position: relative;
14676        top: 0;
14677        float: left;
14678    }    
14679                div#account-setting.creator-settings {
14680                    padding: 30px 20px;
14681                }
14682            }    
14683        </style>
14684-->
14685
14686
14687        <div class="suer-creator-new-sec" style="display:none">
14688            <div class="cross-syper-creator-btn" onclick="$('.suer-creator-new-sec').hide();"><img
14689                    src="https://www.jumpspree.com/public/images/cros.png" alt=""></div>
14690            <div class="image-icon"><img src="https://www.jumpspree.com/public/images/super-creator-icon.png" alt="">
14691            </div>
14692            <div class="super-creator-text">
14693                <div class="sc-head gradient-text">Super Creator <span>New</span></div>
14694            </div>
14695            <div class="text">An invite-only, performance-based program for social-first creators on Jumpspree who
14696                consistently drive views, engagement, and build community.</div>
14697
14698            <div class="action-btn">
14699                <button class="btn" type="button"
14700                    onclick="window.location.href='https://www.jumpspree.com/super-creator'">Learn More <img
14701                        src="https://www.jumpspree.com/public/images/tilt-arrow.png" alt=""></button>
14702                <button class="btn" type="button" onclick="checkSuperCreatorEligibility()">Check your eligibility <i
14703                        style="color:#000;margin-left: 0;
14704    margin-right: 0;" class="hgi hgi-stroke hgi-arrow-right-01"></i></button>
14705            </div>
14706        </div>
14707
14708
14709        <h2 style="display:none">Creator Settings</h2>
14710        <div id="account-setting" class="creator-settings" style="display:none">
14711            <ul>
14712
14713                <li><a href="#"
14714                        onclick="$('#engagement-and-insights').show(); $('body').addClass('overflow-hidden'); getEngagementStats();"><span><i
14715                                class="hgi hgi-stroke hgi-analytics-01"></i> <span>Engagement Insights</span>
14716                            <br>
14717                            <p>Understand how your content is performing with advanced AI insights and recommendations.
14718                            </p>
14719                        </span></a>
14720                </li>
14721                <li><a href="#"
14722                        onclick="$('#payments-and-transactions').show();$('body').addClass('overflow-hidden'); getEarningsData(); getConnectedBanks();"><span><i
14723                                class="hgi hgi-stroke hgi-credit-card-pos"></i> <span>Earnings and Transactions</span>
14724                            <br>
14725                            <p>Manage your payment methods, see transactions and control how you receive funds.</p>
14726                        </span></a>
14727                </li>
14728                <li><a href="#"
14729                        onclick="$('#tips-and-donations').show(); $('body').addClass('overflow-hidden'); getAllTipsDetails()"><span><i
14730                                class="hgi hgi-stroke hgi-tips"></i> <span>Tips and Donations</span>
14731                            <br>
14732                            <p>Manage all your tips and donations settings to maximize community support.</p>
14733                        </span></a>
14734                </li>
14735                <li><a href="#"><span><i class="fa-regular fa-bag-shopping"></i> <span>Manage Merch</span>
14736                            <br>
14737                            <p>Create and manage your listings seamlessly in one place.</p>
14738                        </span> </a>
14739                </li>
14740                <li><a href="#"
14741                        onclick="$('#check-eligibility').show(); $('body').addClass('overflow-hidden'); checkSuperCreatorEligibility();"><span><i
14742                                class="hgi hgi-stroke hgi-eye"></i> <span>Eligibility Status</span>
14743                            <br>
14744                            <p>Keep an eye on your eligibility status to ensure you’re eligible at all times.</p>
14745                        </span> </a>
14746                </li>
14747                <li class="close-super-creator-account"><a href="#"
14748                        onclick="$('#close-creator-account').show(); $('body').addClass('overflow-hidden');"><span><i
14749                                class="hgi hgi-stroke hgi-cancel-circle"></i> <span>Close Creator Account</span>
14750                            <br>
14751                            <p>We don’t want you to leave but if you have to, we’re here to help securely close your
14752                                account.</p>
14753                        </span></a>
14754                </li>
14755
14756
14757            </ul>
14758
14759        </div>
14760
14761
14762
14763       <div id="account-setting" style="margin-bottom:20px; padding-bottom: 20px !important;">
14764        <ul style="padding-bottom: 0px !important;">
14765         <li>
14765<a href="javascript:void(0)" onclick="$('#account-setting-slider').addClass('showAccountSlider')"><span><i class="hgi hgi-stroke hgi-pencil-edit-02"
14766                                aria-hidden="true"></i> <span>Account Settings</span></span></a>
14767                </li>
14768         <li><a href="javascript:void(0)"
14769                        onclick="$('#add-intrest').show(); $('body').addClass('overflow-hidden'); setTimeout(function(){$('#add-intrest .inner-topics-links').addClass('showMe')},200); displayUserInterests();"><span><i
14770                                class="hgi hgi-stroke hgi-align-box-bottom-center"></i> <span>Topics and
14771                                Interests</span></span></a>
14772                </li>  
14773        <li><a href="javascript:void(0)" style="padding-bottom: 0;"
14774                        onclick="$('#add-links').show(); $('body').addClass('overflow-hidden'); setTimeout(function(){$('#add-links .inner-topics-links').addClass('showMe')},200); displayUserLinks();"><span><i
14775                                class="hgi hgi-stroke hgi-link-05" aria-hidden="true"></i> <span>Manage
14776                                Links</span></span></a>
14777                </li>                
14778        </ul>
14779        </div>
14780
14781       
14782        <!--        New section  -->
14783
14784        <h2>Profile Settings</h2>
14785        <div id="account-setting">
14786            <ul>
14787
14788                <!--
14789                                <li><a href="#"><span><i class="fa-regular fa-bag-shopping"></i> <span>Change Theme</span></span> <span
14790                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14791                -->
14792                <!--
14793                                <li><a href="#"><span><i class="fa-light fa-gift"></i> <span>Refer a Friend</span></span> <span
14794                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14795                -->
14796                <!--
14797                                <li><a href="#"><span><i class="fa-regular fa-envelope"></i> <span>Change Email</span></span> <span
14798                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14799                                <li><a href="#"><span><i class="fa-regular fa-at"></i> <span>Change Username</span></span> <span
14800                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14801                                <li><a href="#"><span><i class="fa-light fa-key"></i> <span>Change Password</span></span> <span
14802                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>            
14803
14804                                <li><a href="#"><span><i class="fa-regular fa-bookmark"></i> <span>Bookmarks</span></span> <span
14805                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14806                                <li><a href="#"><span><i class="fa-regular fa-browsers"></i> <span>Browsing History</span></span> <span
14807                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>  
14808                                <li><a href="#"><span><i class="fa-regular fa-bag-shopping"></i> <span>Manage Purchases</span></span> <span
14809                                            class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>                        
14810                -->
14811                <!--
14812                                <li><a href="#"><span><i class="fa-regular fa-bells"></i> <span>Notification Settings</span></span>
14813                                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14814                -->
14815                <!--
14816                                <li><a href="#"><span><i class="fa-regular fa-users"></i> <span>Follower Settings</span></span>
14817                                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> 
14818                                <li><a href="#"><span><i class="fa-regular fa-lock"></i> <span>Online Status</span></span>
14819                                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14820                                <li><a href="#"><span><i class="fa-regular fa-stars"></i> <span>Rate Jumpspree</span></span>
14821                                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> 
14822                                <li><a href="#"><span><i class="fa-regular fa-thumbs-up"></i> <span>Help Us Improve</span></span>
14823                                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> 
14824                -->
14825                <li><a href="https://www.jumpspree.com/profile-edit"><span><i class="hgi hgi-stroke hgi-pencil-edit-02"
14826                                aria-hidden="true"></i> <span>Edit Profile</span></span></a>
14827                </li>
14828                <li><a href="javascript:void(0)"
14829                        onclick="$('#add-intrest').show(); $('body').addClass('overflow-hidden'); setTimeout(function(){$('#add-intrest .inner-topics-links').addClass('showMe')},200); displayUserInterests();"><span><i
14830                                class="hgi hgi-stroke hgi-align-box-bottom-center"></i> <span>Topics and
14831                                Interests</span></span></a>
14832                </li>
14833                <li><a href="javascript:void(0)"
14834                        onclick="$('#add-links').show(); $('body').addClass('overflow-hidden'); setTimeout(function(){$('#add-links .inner-topics-links').addClass('showMe')},200); displayUserLinks();"><span><i
14835                                class="hgi hgi-stroke hgi-link-05" aria-hidden="true"></i> <span>Manage
14836                                Links</span></span></a>
14837                </li>
14838                <li><a href="javascript:void(0)"
14839                        onclick="window.event.cancelBubble = true; openShareDialog('profile-https://www.jumpspree.com'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');"><span><i
14840                                class="hgi hgi-stroke hgi-sent"></i> <span>Share Profile</span></span></a>
14841                </li>
14842                <li><a href="https://www.jumpspree.com/change-username"><span><i class="hgi hgi-stroke hgi-at"
14843                                aria-hidden="true"></i> <span>Change Username</span></span></a></li>
14844                <li><a href="https://www.jumpspree.com/change-password"><span><i
14845                                class="hgi hgi-stroke hgi-lock-password" aria-hidden="true"></i> <span>Change
14846                                Password</span></span></a></li>
14847                <!--
14848                <li><a href="https://www.jumpspree.com/follower-settings"><span><i class="hgi hgi-stroke hgi-user-group"
14849                                aria-hidden="true"></i> <span>Follower Settings</span></span></a></li>
14850-->
14851                <!--
14852                <li><a href="https://www.jumpspree.com/bookmarks"><span><i class="hgi hgi-stroke hgi-bookmark-02"
14853                                aria-hidden="true"></i> <span>Bookmarks</span></span></a></li>
14854-->
14855                <!--
14856                <li><a href="https://www.jumpspree.com/online-status"><span><i class="hgi hgi-stroke hgi-user-lock-01"
14857                                aria-hidden="true"></i> <span>Online Status</span></span></a></li>
14858-->
14859                <!--
14860                <li><a href="mailto:[email protected]"><span><i class="hgi hgi-stroke hgi-sharp hgi-bubble-chat"></i>
14861                            <span>Contact Support</span></span>
14862                        <span class="arrow"><i class="hgi hgi-stroke hgi-square-lock-02"></i></span></a></li>
14863-->
14864                <!--
14865                <li><a href="https://www.jumpspree.com/privacypolicy"><span><i class="hgi hgi-stroke hgi-square-lock-02"></i>
14866                            <span>Privacy Policy</span></span>
14867                        <span class="arrow"><i class="hgi hgi-stroke hgi-filter-mail-square"></i></span></a></li>
14868-->
14869                <!--
14870                <li><a href="https://www.jumpspree.com/termsofuse"><span><i class="hgi hgi-stroke hgi-filter-mail-square"></i>
14871                            <span>Terms of Use</span></span>
14872                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14873-->
14874                <!--
14875                <li><a href="https://www.jumpspree.com/frequently-asked-questions"><span><i
14876                                class="fa-regular fa-circle-question"></i> <span>FAQ</span></span>
14877                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14878-->
14879
14880
14881                <!--                    <li><a href="#"><span><i class="fa-regular fa-user"></i> <span>Manage Profile</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>-->
14882
14883
14884
14885
14886                <!--                    <li><a href="#"><span><i class="fa-regular fa-bookmark"></i> <span>Wishlist</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> -->
14887
14888                <!--                    <li><a href="#"><span><span class="jv-btn"><img src="https://www.jumpspree.app/public/images/blue---tick.png" width="20" alt="Jumpspree"></span> <span>Jumpspree Verified</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> -->
14889                <!--                    <li><a href="#"><span><i class="fa-regular fa-tags"></i> <span>Sell with Jumpspree</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> -->
14890            </ul>
14891            <ul>
14892                <li class="bluecube-icon" style="display: none">
14893                    <a href="#" class="sidebar">
14894                        <div class="lock-icon">
14895                            <img src="https://www.jumpspree.com/public/images/lock-icon.png" loading="lazy"
14896                                style="width:20px !important" alt="Lock icon" title="Lock icon">
14897                        </div>
14898                        <div class="jumpspree-more">
14899                            <span class="route_title">Unlock more with Jumpspree More</span>
14900                            <p>Upgrade to Jumpspree More and get premium benefits at a lower price.</p>
14901                        </div>
14902                        <div class="manage-btn">Upgrade Now</div>
14903                    </a>
14904                </li>
14905
14906                <!--
14907                                    <li class="bluecube-icon">
14908                                        <a href="#" class="sidebar">
14909                                            <div class="lock-icon">
14910                                                <img src="https://www.jumpspree.com/public/images/check-white.png" style="width:20px;filter: invert(0) !important;" alt="Jumpspree">
14911                                            </div>
14912                                            <div class="jumpspree-more">
14913                                                <span class="route_title"><img src="https://www.jumpspree.com/public/images/Jumpspree-logo.png?ver:1.02" alt="Jumpspree" style="filter: invert(1);width: 120px !important;display: inline-block;margin: 0 !important;margin-right: 5px !important;"> <span class="more">More</span></span>
14914                                                <p>You are currently subscribed to Jumpspree More.</p>
14915                                            </div>
14916                                            <div class="manage-btn">Manage</div>
14917                                        </a>
14918                                    </li>
14919                    -->
14920            </ul>
14921        </div>
14922        <br>
14923        <h2>General Settings</h2>
14924        <div id="account-setting">
14925            <ul>
14926
14927
14928<!--
14929                <li id="change-theme-btn"><a href="javascript:void(0)">
14930                <span><i class="hgi hgi-stroke hgi-sun-03"></i> <span>Change Theme</span></span></a></li>  
14931-->
14932                               
14933                <li><a href="https://www.jumpspree.com/bookmarks"><span style="display:flex;align-items:center"><i style="top: 0;" class="hgi hgi-stroke hgi-bookmark-02"
14934                                aria-hidden="true"></i> <span>Bookmarks</span></span></a></li> 
14935                <li><a href="https://www.jumpspree.com/browsing-history"><span style="display: flex;align-items: center;"><i class="hgi hgi-stroke hgi-layers-02"></i> <span>Browsing History</span></span></a></li>                                
14936                                
14937                <li><a href="https://www.jumpspree.com/follower-settings"><span><i class="hgi hgi-stroke hgi-user-group"
14938                                aria-hidden="true"></i> <span>Follower Settings</span></span></a></li>
14939                
14940                
14941
14942                <li><a href="https://www.jumpspree.com/online-status"><span><i class="hgi hgi-stroke hgi-user-lock-01"
14943                                aria-hidden="true"></i> <span>Online Status</span></span></a></li>
14944                <!--
14945                <li><a href="mailto:[email protected]"><span><i class="hgi hgi-stroke hgi-sharp hgi-bubble-chat"></i>
14946                            <span>Contact Support</span></span>
14947                        <span class="arrow"><i class="hgi hgi-stroke hgi-square-lock-02"></i></span></a></li>
14948-->
14949                <!--
14950                <li><a href="https://www.jumpspree.com/privacypolicy"><span><i class="hgi hgi-stroke hgi-square-lock-02"></i>
14951                            <span>Privacy Policy</span></span>
14952                        <span class="arrow"><i class="hgi hgi-stroke hgi-filter-mail-square"></i></span></a></li>
14953-->
14954                <!--
14955                <li><a href="https://www.jumpspree.com/termsofuse"><span><i class="hgi hgi-stroke hgi-filter-mail-square"></i>
14956                            <span>Terms of Use</span></span>
14957                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14958-->
14959                <!--
14960                <li><a href="https://www.jumpspree.com/frequently-asked-questions"><span><i
14961                                class="fa-regular fa-circle-question"></i> <span>FAQ</span></span>
14962                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
14963-->
14964
14965
14966                <!--                    <li><a href="#"><span><i class="fa-regular fa-user"></i> <span>Manage Profile</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>-->
14967
14968
14969
14970
14971                <!--                    <li><a href="#"><span><i class="fa-regular fa-bookmark"></i> <span>Wishlist</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> -->
14972
14973                <!--                    <li><a href="#"><span><span class="jv-btn"><img src="https://www.jumpspree.app/public/images/blue---tick.png" width="20" alt="Jumpspree"></span> <span>Jumpspree Verified</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> -->
14974                <!--                    <li><a href="#"><span><i class="fa-regular fa-tags"></i> <span>Sell with Jumpspree</span></span> <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li> -->
14975            </ul>
14976            <ul>
14977                <li class="bluecube-icon" style="display: none">
14978                    <a href="#" class="sidebar">
14979                        <div class="lock-icon">
14980                            <img src="https://www.jumpspree.com/public/images/lock-icon.png" loading="lazy"
14981                                style="width:20px !important" alt="lock icon" title="lock icon">
14982                        </div>
14983                        <div class="jumpspree-more">
14984                            <span class="route_title">Unlock more with Jumpspree More</span>
14985                            <p>Upgrade to Jumpspree More and get premium benefits at a lower price.</p>
14986                        </div>
14987                        <div class="manage-btn">Upgrade Now</div>
14988                    </a>
14989                </li>
14990
14991                <!--
14992                                    <li class="bluecube-icon">
14993                                        <a href="#" class="sidebar">
14994                                            <div class="lock-icon">
14995                                                <img src="https://www.jumpspree.com/public/images/check-white.png" style="width:20px;filter: invert(0) !important;" alt="Jumpspree">
14996                                            </div>
14997                                            <div class="jumpspree-more">
14998                                                <span class="route_title"><img src="https://www.jumpspree.com/public/images/Jumpspree-logo.png?ver:1.02" alt="Jumpspree" style="filter: invert(1);width: 120px !important;display: inline-block;margin: 0 !important;margin-right: 5px !important;"> <span class="more">More</span></span>
14999                                                <p>You are currently subscribed to Jumpspree More.</p>
15000                                            </div>
15001                                            <div class="manage-btn">Manage</div>
15002                                        </a>
15003                                    </li>
15004                    -->
15005            </ul>
15006        </div>
15007
15008        <br>
15009        <h2>Resources</h2>
15010        <div id="account-setting">
15011            <ul>
15012
15013
15014
15015                <li><a href="mailto:[email protected]"><span><i class="hgi hgi-stroke hgi-sharp hgi-bubble-chat"></i>
15016                            <span>Contact Support</span></span>
15017                        <span class="arrow"><i class="hgi hgi-stroke hgi-square-lock-02"></i></span></a></li>
15018                <li><a href="https://www.jumpspree.com/privacypolicy"><span><i
15019                                class="hgi hgi-stroke hgi-square-lock-02"></i>
15020                            <span>Privacy Policy</span></span>
15021                        <span class="arrow"><i class="hgi hgi-stroke hgi-filter-mail-square"></i></span></a></li>
15022                <li><a href="https://www.jumpspree.com/termsofuse"><span><i
15023                                class="hgi hgi-stroke hgi-filter-mail-square"></i>
15024                            <span>Terms of Use</span></span>
15025                        <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15026
15027            </ul>
15028            <ul>
15029                <li class="bluecube-icon" style="display: none">
15030                    <a href="#" class="sidebar">
15031                        <div class="lock-icon">
15032                            <img src="https://www.jumpspree.com/public/images/lock-icon.png" loading="lazy"
15033                                style="width:20px !important" alt="Lock" title="Lock">
15034                        </div>
15035                        <div class="jumpspree-more">
15036                            <span class="route_title">Unlock more with Jumpspree More</span>
15037                            <p>Upgrade to Jumpspree More and get premium benefits at a lower price.</p>
15038                        </div>
15039                        <div class="manage-btn">Upgrade Now</div>
15040                    </a>
15041                </li>
15042
15043                <!--
15044                                    <li class="bluecube-icon">
15045                                        <a href="#" class="sidebar">
15046                                            <div class="lock-icon">
15047                                                <img src="https://www.jumpspree.com/public/images/check-white.png" style="width:20px;filter: invert(0) !important;" alt="Jumpspree">
15048                                            </div>
15049                                            <div class="jumpspree-more">
15050                                                <span class="route_title"><img src="https://www.jumpspree.com/public/images/Jumpspree-logo.png?ver:1.02" alt="Jumpspree" style="filter: invert(1);width: 120px !important;display: inline-block;margin: 0 !important;margin-right: 5px !important;"> <span class="more">More</span></span>
15051                                                <p>You are currently subscribed to Jumpspree More.</p>
15052                                            </div>
15053                                            <div class="manage-btn">Manage</div>
15054                                        </a>
15055                                    </li>
15056                    -->
15057            </ul>
15058        </div>
15059
15060        <div class="logout-btn">
15061            <a href="https://www.jumpspree.com/logout"><i class="hgi hgi-stroke hgi-logout-03"></i> Logout</a>
15062        </div>
15063
15064        <!--
15065                        <ul id="app-menu" style="display:none">
15066                            <li><a href="#"><span><i class="fa-regular fa-square-plus"></i> <span>Add Listing</span></span> <span
15067                                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15068                            <li><a href="#"><span><i class="fa-regular fa-credit-card"></i> <span>Manage Listing</span></span> <span
15069                                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15070                            <li><a href="#"><span><i class="fa-regular fa-box-taped"></i> <span>Manage Orders</span></span> <span
15071                                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15072                            <li><a href="#"><span><i class="fa-regular fa-credit-card"></i> <span>Business Detail</span></span> <span
15073                                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15074                            <li><a href="#"><span><i class="fa-regular fa-credit-card"></i> <span>Payment Methods</span></span> <span
15075                                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15076                            <li><a href="#"><span><i class="fa-regular fa-building-columns"></i> <span>Linked Accounts</span></span>
15077                                    <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15078                            <li><a href="#"><span><i class="fa-regular fa-wallet"></i> <span>Wallet</span></span> <span class="arrow"><i
15079                                            class="fa-regular fa-angle-right"></i></span></a></li>
15080
15081                        </ul>
15082                -->
15083
15084        <ul id="about-menu" style="display:none">
15085            <li><a href="#"><span><i class="fa-regular fa-sparkles"></i> <span>Rate Jumpspree</span></span> <span
15086                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15087            <li><a href="#"><span><i class="fa-regular fa-thumbs-up"></i> <span>Help Us Imporove</span></span> <span
15088                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15089            <li><a href="#"><span><i class="fa-regular fa-comment-dots"></i> <span>Contact Support</span></span> <span
15090                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15091            <li><a href="#"><span><i class="fa-regular fa-lock-keyhole"></i> <span>Privacy Policy</span></span> <span
15092                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15093            <li><a href="#"><span><i class="fa-light fa-clipboard-list-check"></i> <span>Terms of Use</span></span>
15094                    <span class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15095            <li><a href="#"><span><i class="fa-regular fa-circle-question"></i> <span>FAQ</span></span> <span
15096                        class="arrow"><i class="fa-regular fa-angle-right"></i></span></a></li>
15097        </ul>
15098    </div>
15099
15100
15101
15102
15103</div>
15104
15105<div class="edit-profile-mobile">  
15106<div class="user-profile my-profile profile-edit-page">
15107                <div class="form-wizard-seller-registration">
15108                    <form id="profileform" enctype="multipart/form-data">
15109                             <input type="hidden" id="user_type_hidden" value="1">
15110                        <div class="cover-image">
15111                            
15112
15113                            <span class="back-arrow" onclick="$('.edit-profile-mobile').removeClass('showMeNow'); $('.profile-menu').removeClass('dissable-me')">
15114                                 <img src="https://www.jumpspree.com/public/images/arrow-left.png" alt="" style="filter:invert(0); height: auto;">
15115                            </span> 
15116                            <div class="dropZoneContainer" id="dzc">
15117                                <div class="dropZoneOverlay">
15118                                 
15119                                    <img id="dropc" src="https://www.jumpspree.com/public/images/cover-placeholdernew.png?ver:1.02" alt="" class="cover-back">
15120                                </div>
15121                            </div>
15122                            <div class="smal-cam-upload">
15123                                <a href="javascript:void(0)" class="upload_dp a-upimg" onclick="event.stopPropagation();$(this).next('ul').slideToggle('fast'); $('.drop-user-image, .profile-drop-down ul').hide();"><img class="upimg" src="https://www.jumpspree.com/public/images/small-cam-icon.png" alt="">
15124                                </a>
15125                                <ul style="display: none;">
15126                                    <li><a href="javascript:void(0)">Open gallery <i class="fa-regular fa-image"></i> <input  type="file" name="store_cover_image" id="drop_zone_cover" class="FileUpload fake" accept=".jpg,.png,.gif" onchange="handleImageSelect('c', '')"></a></li>
15127                                    <li id="delc" style="display:none;"><a href="javascript:void(0)" style="color:#ff0026" onclick="removeImage('cover')">Delete <i class="fa-regular fa-trash-can"></i></a></li>
15128
15129                                </ul>
15130                            </div>
15131                         
15132                            <div class="d-flex justify-content-start" id="profile-edit-image">
15133                            <div class="user-profile-wrapper">
15134                                    <div class="user-image uploadImg" onclick="event.stopPropagation();$('.drop-user-image').slideToggle('fast');$('.smal-cam-upload ul, .profile-drop-down ul').hide()">
15135
15136
15137                                        <div class="dropZoneContainer" id="dzl">
15138                                            <div class="dropZoneOverlay">
15139                                              
15140                                                <a href="#"><img id="dropl" src="" alt=""></a>
15141                                             
15142
15143                                            </div>
15144                                            
15145                                            <ul style="display:none" class="drop-user-image">
15146                                                <li><a href="javascript:void(0)">Open gallery <i class="fa-regular fa-image" aria-hidden="true"></i> <input type="file" name="store_logo" id="drop_zone_logo" class="FileUpload" accept=".jpg,.png,.gif" onchange="handleImageSelect('l', '') "></a></li>
15147                                                
15148                                                <li id="dell"  style="display:none;"><a href="javascript:void(0)" style="color:#ff0026;"  onclick="removeImage('profile')">Delete <i class="fa-regular fa-trash-can" aria-hidden="true"></i></a></li>
15149
15150                                            </ul>
15151                                        </div>
15152
15153                                    </div>
15154
15155                                </div>
15156
15157                                <div class="profile-detail">
15158                                    <div class="name notranslate">
15159                                        <h3>
15160                                                                                                                                </h3>
15161                                    </div>
15162                                    <p class="notranslate">@</p>
15163                                </div>
15164                             </div>
15165                        </div>
15166
15167                        <div class="stats d-flex justify-content-start">
15168                            <div class="stat">
15169                                <h5>0</h5>
15170                                <p style="cursor:pointer;" onclick="window.location.href='https://www.jumpspree.com/followers/'">Followers</p>
15171                            </div>
15172                            <div class="stat">&bull;</div>
15173                            <div class="stat">
15174                                <h5>0 </h5>
15175                                <p style="cursor:pointer;" onclick="window.location.href='https://www.jumpspree.com/followings/'">Followings</p>
15176                            </div>
15177                            <div class="stat">&bull;</div>
15178                            <div class="stat">
15179                                <h5>0</h5>
15180                                <p>Profile Views</p>
15181                            </div>
15182                        </div>
15183                        
15184                        
15185                        
15186
15187                        
15188                        <div class="mob-p4"> 
15189                            <div class="row mb-0 profile-edit-row">
15190                                <div class="col-12 col-lg-12 col-xs-12 col-sm-12 mb-2">
15191                                    <div class="form-group">
15192                                                                                <label for="">Name</label>
15193                                        <input type="text" name="useruserfullname" id="useruserfullname" class="form-control" value="">
15194                                    </div>
15195                                </div>
15196
15197                                <!-- NATURE OF BUSINESS FIELD (Only for Business - profile_type = 3) -->
15198                                
15199                                <!-- PROFESSION FIELD (Only for Professional - profile_type = 2) -->
15200                                
15201                                <!-- LOCATION FIELD (Only for Business - profile_type = 3) -->
15202                                
15203                                <!-- Phone Section (Hidden as per your co
15203de) -->
15204                                <div class="col-12 col-lg-12 col-xs-12 col-sm-12 mb-2" style="display:none">
15205                                    <div class="form-group">
15206                                        <label for="">Phone</label>
15207                                        <div class="change">
15208                                            <input readonly="" name="useruserphone" id="useruserphone" placeholder="+1 XXX-XXX-XXXX" type="text" class="form-control" value="">
15209                                            <a href="javascript:void(0)" onclick="$('#update-phoneno').fadeIn('fast')">Change</a>
15210                                        </div>
15211                                    </div>
15212                                </div>
15213
15214                                <!-- Website Field -->
15215                                                                <div class="col-12 col-lg-12 col-xs-12 col-sm-12 mb-2">
15216                                    <div class="form-group">
15217                                        <label for="">Website</label>
15218                                        <input placeholder="www.example.com" name="useruserwebsite" id="useruserwebsite" type="text" value="" class="form-control">
15219                                    </div>
15220                                </div>
15221                                
15222                                <!-- Bio Field -->
15223                                <div class="col-12 col-lg-12 col-xs-12 col-sm-12 mb-0">
15224                                    <div class="form-group">
15225                                        <label for="">Bio</label>
15226                                        <textarea name="useruseraboutus" id="useruseraboutus" placeholder="Say something awesome about yourself.." class="form-control br11" maxlength="160"></textarea>
15227                                        <div id="aboutuscount" class="count">0/160</div>
15228                                    </div>
15229                                </div>
15230
15231                                <!-- Date of Birth -->
15232                                <div class="col-12 col-lg-12 col-xs-12 col-sm-12 mb-2">
15233                                    <div class="form-group">
15234                                        <label for="">Date of birth</label>
15235                                        <div class="dob-lock">
15236                                            <input name="useruserdob" id="useruserdob" type="text" placeholder="5/14/1995" value="" class="form-control" readonly>
15237                                            <i class="fa-solid fa-lock"></i>
15238                                        </div>
15239                                    </div>
15240                                    <div class="form-group">
15241                                        <p class="dob-note">You will not be able to change your date of birth later. We use your date of birth for account verification only and it will not be shown publicly.</p>
15242                                    </div>
15243                                </div>
15244
15245                                <!-- Buttons -->
15246                                <div class="profile-footer">
15247                                    <div class="col-12 col-lg-12 col-xs-12 col-sm-12 mb-0">
15248                                        <div class="form-button text-center" style="padding-top: 20px;">
15249                                            <button id="updateuserProfile" class="btn btn-blue-bg btn-block mb-2 deactivated" type="button" style="border-radius: 8px;width: auto;margin-left: auto;padding-left: 50px;padding-right: 50px;">
15250                                                Save Changes
15251                                            </button>
15252                                            <button class="btn btn-blue-bg-outline btn-block" id="preview_btn" onclick="window.location.href='https://www.jumpspree.com/u/'" type="button" style="border-radius: 8px;width: auto;margin-left: auto;padding-left: 50px;padding-right: 50px;">
15253                                                Preview Profile
15254                                            </button>
15255                                        </div>
15256                                    </div>
15257                                </div>
15258                            </div>
15259                        </div>
15260
15261
15262
15263
15264
15265
15266                    </form>
15267                 </div>
15268            </div>
15269</div>
15270
15271
15272<div id="account-setting-slider">
15273    <h3>Account Settings  <div class="close-account-slide" onclick="$('#account-setting-slider').removeClass('showAccountSlider')"><span>&times;</span></div></h3>
15274       <ul>
15275        <li><a href="https://www.jumpspree.com/change-email"><i class="hgi hgi-stroke hgi-mail-01"></i> Change Email</a></li>
15276        <li><a href="https://www.jumpspree.com/change-username"><i class="hgi hgi-stroke hgi-at"></i> Change Username</a></li>
15277        <li><a href="https://www.jumpspree.com/change-password"><i class="hgi hgi-stroke hgi-lock-password"></i> Change Password</a></li>
15278        <li><a href="https://www.jumpspree.com/online-status"><i class="hgi hgi-stroke hgi-user-lock-01"></i> Online Status</a></li>
15279        <li><a href="https://www.jumpspree.com/follower-settings"><i class="hgi hgi-stroke hgi-user-group"></i> Follower Settings</a></li>
15280    </ul>
15281</div>
15282
15283
15284<!--
15285<style>
15286
15287/*==========================
15288    THEME POPUP
15289===========================*/
15290
15291#themeSettingsPopup {
15292    width: 100%;
15293    max-width: 520px;
15294    margin: 40px auto;
15295    background: #1f1f1f;
15296    border-radius: 25px;
15297    padding: 30px;
15298    transition: .3s;
15299    position: fixed;
15300    height: 100%;
15301    z-index: 9999999999999999999999999999 !important;
15302    top: 0;
15303}
15304
15305body.light-mode #themeSettingsPopup{
15306    background:#fff;
15307}
15308
15309#themeSettingsPopup *{
15310    box-sizing:border-box;
15311}
15312
15313#themeSettingsPopup .themeDrag{
15314    width:80px;
15315    height:7px;
15316    background:#d8d8d8;
15317    border-radius:50px;
15318    margin:0 auto 35px;
15319}
15320
15321#themeSettingsPopup .themeTitle{
15322    text-align:center;
15323    font-size:40px;
15324    font-weight:700;
15325    margin-bottom:40px;
15326}
15327
15328#themeSettingsPopup .themeRow{
15329    display:flex;
15330    align-items:center;
15331    justify-content:space-between;
15332    margin-bottom:45px;
15333}
15334
15335#themeSettingsPopup .themeLabel{
15336    font-size:30px;
15337    font-weight:600;
15338}
15339
15340#themeSettingsPopup .themeDescription{
15341    color:#999;
15342    font-size:18px;
15343    line-height:28px;
15344}
15345
15346/*==========================
15347        SWITCH
15348===========================*/
15349
15350#themeSettingsPopup .themeSwitch{
15351    position:relative;
15352    width:72px;
15353    height:40px;
15354    display:inline-block;
15355}
15356
15357#themeSettingsPopup .themeSwitch input{
15358    display:none;
15359}
15360
15361#themeSettingsPopup .themeSlider{
15362    position:absolute;
15363    inset:0;
15364    background:#444;
15365    border-radius:40px;
15366    cursor:pointer;
15367    transition:.3s;
15368}
15369
15370#themeSettingsPopup .themeSlider:before{
15371    content:"";
15372    position:absolute;
15373    width:32px;
15374    height:32px;
15375    left:4px;
15376    top:4px;
15377    background:#fff;
15378    border-radius:50%;
15379    transition:.3s;
15380}
15381
15382#themeSettingsPopup input:checked + .themeSlider{
15383    background:#32d158;
15384}
15385
15386#themeSettingsPopup input:checked + .themeSlider:before{
15387    transform:translateX(32px);
15388}
15389</style>
15390-->
15391<!--
15392<div id="themeSettingsPopup" style="display:none">
15393
15394    <div class="themeDrag"></div>
15395
15396    <div class="themeTitle">Theme</div>
15397
15398    <div class="themeRow">
15399        <div class="themeLabel">Light mode</div>
15400
15401        <label class="themeSwitch">
15402            <input type="checkbox" id="themeLight">
15403            <span class="themeSlider"></span>
15404        </label>
15405    </div>
15406
15407    <div class="themeRow">
15408        <div class="themeLabel">Night mode</div>
15409
15410        <label class="themeSwitch">
15411            <input type="checkbox" id="themeDark">
15412            <span class="themeSlider"></span>
15413        </label>
15414    </div>
15415
15416    <div class="themeRow">
15417        <div class="themeLabel">Use system settings</div>
15418
15419        <label class="themeSwitch">
15420            <input type="checkbox" id="themeSystem">
15421            <span class="themeSlider"></span>
15422        </label>
15423    </div>
15424
15425    <div class="themeDescription">
15426        Automatically set your theme based on the selection in your device's Display and Brightness section.
15427    </div>
15428
15429</div>
15430-->
15431
15432 <!-- MOBILE: settings-style switches -->
15433  <div class="theme-mobile" id="theme-mobile" style="display:none">
15434    <div id="theme-inside">
15435<!--        <div class="drag-handle"></div>-->
15436        <h3>Theme</h3>
15437        <div class="mode-row">
15438          <span>Light mode</span>
15439          <button type="button" class="switch" id="switchLight" aria-label="Toggle light mode"><div class="knob"></div></button>
15440        </div>
15441        <div class="mode-row">
15442          <span>Night mode</span>
15443          <button type="button" class="switch on" id="switchNight" aria-label="Toggle night mode"><div class="knob"></div></button>
15444        </div>
15445    </div>
15446  </div>
15447
15448<style>
15449.links-and-topics-popup {
15450    position: fixed;
15451    top: 0;
15452    right: 0;
15453    bottom: 0;
15454    left: 0;
15455    background: #00000000;
15456    z-index: 9;
15457}
15458
15459.links-and-topics-popup .inner-topics-links {
15460    max-width: 566px;
15461    background: #1f1f1f;
15462    position: absolute;
15463    left: 50%;
15464    transform: translateX(-50%);
15465    width: 100%;
15466    top: 62px;
15467    bottom: 0;
15468    border-radius: 25px 25px 0 0;
15469}
15470
15471.links-and-topics-popup .inn-header {
15472    display: flex;
15473    justify-content: center;
15474    align-items: center;
15475    justify-content: space-between;
15476    padding: 15px 24px;
15477    border-bottom: 1px solid #3241585c;
15478    /*transition: all 0.5s ease;
15479    height: 54px;*/
15480}
15481
15482/*#add-intrest .inner-topics-links .links-wall > p {
15483    height: 110px;
15484    transition: all 0.5s ease;
15485}    
15486.inner-topics-links.add-topic-active .links-wall > p {
15487    height: 0 !important;
15488    opacity: 0;
15489    padding: 0;
15490    margin: 0;
15491}*/
15492
15493/*.inner-topics-links.add-topic-active .inn-header {
15494    height: 0;
15495    opacity: 0;
15496}   */
15497.links-and-topics-popup .inn-header a {
15498    color: #adadad;
15499}
15500
15501.links-and-topics-popup .inn-header h2 {
15502    margin-bottom: 0;
15503    font-size: 16px;
15504    color: #fff;
15505}
15506
15507.links-wall h3,
15508.links-wall p {
15509    color: #fff;
15510}
15511
15512.links-wall {
15513    padding: 30px 30px;
15514    color: #fff;
15515}
15516
15517.links-wall .add-links a {
15518    display: block;
15519    border: 1px solid #3241585c;
15520    border-radius: 15px;
15521    padding: 12px 17px;
15522    display: flex;
15523    justify-content: space-between;
15524}
15525
15526.links-wall h3 {
15527    font-size: 20px;
15528    margin: 0 0 10px 0px;
15529    font-weight: 900;
15530}
15531
15532.links-wall .add-links a:hover {
15533    background: #0f0f0f;
15534    color: #fff;
15535}
15536
15537div#add-links-popup {
15538    position: fixed;
15539    z-index: 9;
15540    width: 100%;
15541    right: 0;
15542    bottom: 0;
15543    top: 0;
15544    left: 0;
15545    background: #0000008f;
15546    backdrop-filter: blur(7px);
15547    -webkit-backdrop-filter: blur(7px);
15548}
15549
15550#add-links-popup .inner-link-section {
15551    width: 100%;
15552    max-width: calc(calc(calc(100vh - 0px - var(--one-column-top-content-height, 0px) - var(--one-column-item-bottom-content-height, 0px)) - (1rem * 2)) * 0.5700) !important;
15553    left: 50%;
15554    position: absolute;
15555    transform: translate(-50%, -50%);
15556    background: #161616;
15557    top: 50%;
15558    padding: 30px;
15559    border-radius: 25px;
15560}
15561
15562.add-custom-link-header h2 {
15563    color: #fff;
15564    font-size: 18px;
15565}
15566
15567.close-link {
15568    position: absolute;
15569    right: 25px;
15570    top: 33px;
15571    color: #ccc;
15572    font-size: 12px;
15573    cursor: pointer;
15574}
15575
15576.add-link-form .form-inner {
15577    border: 1px solid #3241585c;
15578    border-radius: 17px;
15579    padding: 8px 15px;
15580    margin-bottom: 15px;
15581    padding-right: 0;
15582}
15583
15584.add-link-form input {
15585    background: none;
15586    border-bottom: 1px solid #3241585c;
15587    width: 100%;
15588    padding: 7px 0;
15589    color: #fff;
15590    font-size: 14px;
15591}
15592
15593#add-link-new-popup .add-link-form .form-inner {
15594    border: 1px solid #6a717c94;
15595}
15596
15597#add-link-new-popup .add-link-form input {
15598    border-bottom: 1px solid #6a717c94;
15599}
15600
15601.add-link-form button.btn.btn-save {
15602    width: 100%;
15603    opacity: 1;
15604    border-radius: 15px;
15605    font-size: 13px;
15606    box-shadow: none;
15607}
15608
15609.your-links .link-logo {
15610    width: 40px;
15611}
15612
15613.your-links .link-logo img {
15614    width: 100%
15615}
15616
15617.your-links {
15618    margin-top: 20px;
15619}
15620
15621.your-links h3 {
15622    font-size: 14px;
15623}
15624
15625.your-links .link-left {
15626    display: flex;
15627}
15628
15629.your-links .link-desc {
15630    display: flex;
15631    flex-direction: column;
15632}
15633
15634.your-links .link-logo {
15635    width: 40px;
15636    margin-right: 10px;
15637}
15638
15639.your-links .link-desc span.url {
15640    font-size: 12px;
15641}
15642
15643.your-links .link-detail {
15644    display: flex;
15645    justify-content: space-between;
15646    border: 1px solid #3241585c;
15647    border-radius: 13px;
15648    align-items: center;
15649    padding: 10px;
15650    margin-bottom: 12px;
15651}
15652
15653.your-links .right-link {
15654    display: flex;
15655    gap: 12px;
15656    font-size: 19px;
15657}
15658
15659.your-links .right-link a {
15660    padding: 0 4px;
15661}
15662
15663.your-links .right-link a.delete-btn {
15664    color: #ff0000;
15665}
15666
15667.add-custom-link-header h2 {
15668    color: #fff;
15669    font-size: 18px;
15670    margin: 0;
15671    line-height: 20px;
15672}
15673
15674.add-custom-link-header {
15675    margin-bottom: 15px;
15676}
15677
15678.add-custom-link-header .close-link {
15679    position: absolute;
15680    right: 30px;
15681    top: 31px;
15682    color: #ccc;
15683    font-size: 12px;
15684    cursor: pointer;
15685}
15686
15687span.plus {
15688    font-size: 20px;
15689    float: right;
15690    line-height: 15px;
15691    height: 19px;
15692    margin-top: 4px;
15693}
15694
15695.add-links a:hover {
15696    background: #242424 !important;
15697}
15698
15699#add-link-new-popup h2 {
15700    font-size: 15px;
15701}
15702
15703.right-link a:hover {
15704    color: #fff;
15705}
15706
15707.your-topics {
15708    margin-top: 20px;
15709    border: 1px solid #3241585c;
15710    border-radius: 25px;
15711    padding: 20px;
15712}
15713
15714.your-topics ul {
15715    padding: 0;
15716}
15717
15718.your-topics .all-topics ul {
15719    margin: 0;
15720}
15721
15722.your-topics .all-topics li {
15723    padding: 4px 0;
15724}
15725
15726.your-topics .all-topics li a.delete-btn {
15727    color: #ff004d;
15728}
15729
15730.your-topics-header.d-flex.justify-content-between .delete-all {
15731    font-size: 12px;
15732    color: #c8c8c8;
15733    font-weight: 500;
15734}
15735
15736.your-topics-header.d-flex.justify-content-between h3 {
15737    margin: 0;
15738}
15739
15740.your-topics-header.d-flex.justify-content-between {
15741    align-items: center;
15742}
15743
15744.your-topics-header.d-flex.justify-content-between {
15745    align-items: center;
15746    margin-bottom: 10px;
15747}
15748
15749.your-topics .all-topics li:last-child {
15750    border: none;
15751}
15752
15753.your-topics .all-topics li:last-child {
15754    border: none;
15755    padding-bottom: 0;
15756}
15757
15758.your-topics .all-topics li {
15759    padding: 4px 0;
15760    border-bottom: 1px solid #3241585c;
15761    padding: 13px 0;
15762}
15763
15764.add-intrest-main {
15765    border: 1px solid #3241585c;
15766    border-radius: 15px;
15767    padding: 0;
15768    display: flex;
15769    align-items: center;
15770    position: relative;
15771}
15772
15773.dropdwn-intrest {
15774    position: absolute;
15775    background: #141414;
15776    width: 100%;
15777    z-index: 9;
15778    border-radius: 14px;
15779    top: 47px;
15780    border: 1px solid #3241585c;
15781    padding: 14px;
15782    display: none;
15783}
15784
15785.dropdwn-intrest ul {
15786    padding: 0;
15787    margin: 0;
15788}
15789
15790.dropdwn-intrest li a {
15791    font-size: 13px;
15792    padding: 7px 0;
15793    display: block;
15794    color: #ccc;
15795}
15796
15797.add-intrest-main .plus {
15798    margin: 0;
15799    padding: 0 19px;
15800    height: 40px;
15801    display: flex;
15802    cursor: pointer;
15803    align-items: center;
15804    font-size: 18px;
15805    font-weight: 800;
15806}
15807
15808.add-intrest-main>div:first-child input {
15809    width: 100%;
15810    background: transparent;
15811    padding: 10px 14px;
15812    color: #fff;
15813}
15814
15815.add-intrest-main>div:first-child {
15816    width: 100%;
15817    display: block;
15818}
15819
15820.inner-topic-full-wrapper.add-topic-active {
15821    /*    display: none;*/
15822}
15823
15824/*    .inner-topic-search{display: none;} */
15825.inner-topic-search {
15826    padding: 25px 25px;
15827    top: 0;
15828    position: absolute;
15829    width: 100%;
15830    background: #0f0f0f;
15831    border-radius: 25px 25px 0 0;
15832    top: 70px;
15833    visibility: hidden;
15834    opacity: 0;
15835    transition: all 0.5s ease;
15836}
15837
15838.inner-topic-search.inner-topic-search-active {
15839    visibility: visible;
15840    top: 0;
15841    opacity: 1;
15842}
15843
15844.inner-topic-search {
15845    padding: 25px 25px;
15846}
15847
15848.inner-topic-search .search-topic-header.d-flex input {
15849    width: 100%;
15850    background: none;
15851    border: 1px solid #3241585c;
15852    padding: 9px 16px;
15853    border-radius: 12px;
15854    padding-left: 34px;
15855}
15856
15857.dropdown-serach-result ul {
15858    padding: 0;
15859    margin: 0;
15860}
15861
15862.search-topic-header.d-flex {
15863    align-items: center;
15864    gap: 15px;
15865    padding-bottom: 10px;
15866    position: relative;
15867}
15868
15869.dropdown-serach-result li a {
15870    color: #ccc;
15871    padding: 13px 7px;
15872    display: block;
15873    font-size: 14px;
15874
15875}
15876
15877.dropdown-serach-result li {
15878    display: flex;
15879    justify-content: space-between;
15880    width: 100%;
15881    align-items: center;
15882    border-bottom: 1px solid #3241585c;
15883}
15884
15885.dropdown-serach-result ul {
15886    padding: 0;
15887    margin: 0;
15888}
15889
15890.add-topic:hover {
15891    cursor: pointer;
15892    background: #222;
15893}
15894
15895/*.dropdown-serach-result {
15896    height: calc(100vh - 131px);
15897    overflow-y: auto;
15898}*/
15899
15900
15901.search-topic-header.d-flex a {
15902    color: #5566FF;
15903    font-weight: 600;
15904
15905}
15906
15907.inner-topic-search .search-topic input {
15908    color: #fff;
15909
15910}
15911
15912.dropdown-serach-result ul {
15913    padding: 0;
15914    margin: 0;
15915    margin-top: 0px;
15916}
15917
15918.add-topic {
15919    color: #fff;
15920    font-size: 10px;
15921    border: 1px solid #3241585c;
15922    padding: 7px 15px;
15923    display: inline-block;
15924    border-radius: 25px;
15925    background: #22222273;
15926    white-space: nowrap;
15927}
15928
15929#add-intrest .links-wall>p {
15930    color: #c8c8c8;
15931}
15932
15933.add-intrest-main>div:first-child input::placeholder {
15934    color: #c8c8c8 !important;
15935    opacity: 1 !important;
15936    font-weight: 500;
15937}
15938
15939.add-intrest-main>div:first-child input::-webkit-input-placeholder {
15940    color: #c8c8c8 !important;
15941    opacity: 1 !important;
15942    font-weight: 500;
15943}
15944
15945.dropdown-serach-result,
15946#add-links .links-wall {
15947    scrollbar-width: none;
15948    /* Firefox */
15949    -ms-overflow-style: none;
15950    /* IE and Edge */
15951}
15952
15953.dropdown-serach-result::-webkit-scrollbar,
15954#add-links .links-wall::-webkit-scrollbar {
15955    display: none;
15956    /* or */
15957    width: 0;
15958    height: 0;
15959}
15960
15961#add-links .links-wall {
15962    height: 100vh;
15963    overflow-y: auto;
15964}
15965
15966.dropdown-serach-result li a {
15967    width: 100%
15968}
15969
15970.your-topics {
15971    padding-right: 0;
15972}
15973
15974.your-topics .your-topics-header {
15975    padding-right: 20px;
15976}
15977
15978.your-topics .all-topics li {
15979    padding-right: 20px;
15980}
15981
15982#add-intrest .links-wall {
15983    scrollbar-width: none;
15984    /* Firefox */
15985    -ms-overflow-style: none;
15986    /* IE and Edge */
15987}
15988
15989#add-intrest .links-wall::-webkit-scrollbar {
15990    display: none;
15991    width: 0;
15992    height: 0;
15993}
15994
15995.your-topics .all-topics li span {
15996    color: #c8c8c8;
15997}
15998
15999.search-topic img.search {
16000    position: absolute;
16001    width: 18px;
16002    opacity: 0.5;
16003    left: 10px;
16004}
16005    body.light-mode .add-intrest-main>div:first-child input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
16006    color:    #000 !important;
16007}
16008
16009body.light-mode .add-intrest-main>div:first-child input::placeholder { /* Most modern browsers support this now. */
16010   color:    #000 !important;
16011}
16012
16013@media screen and (min-width:768px) {
16014    #add-links-popup .inner-link-section {
16015        transform: translate(-50%, -50%) scale(0.9);
16016        opacity: 0;
16017        transition: all 0.5s ease;
16018    }
16019
16020    #add-links-popup .inner-link-section.showMe {
16021        opacity: 1;
16022        transform: translate(-50%, -50%) scale(1);
16023    }
16024
16025    #add-intrest .links-wall {
16026        padding-bottom: 50px;
16027        height: 100vh;
16028        overflow-y: auto;
16029    }
16030
16031    .your-topics {
16032        margin-bottom: 150px;
16033        padding-right: 0;
16034    }
16035
16036    .dropdown-serach-result {
16037        height: 100vh;
16038        overflow-y: auto;
16039    }
16040
16041    .dropdown-serach-result ul li:last-child {
16042        margin-bottom: 250px !important;
16043    }
16044}
16045
16046@media screen and (max-width:767px) {
16047    .inner-topic-search {
16048        background: #000;
16049        border-radius: 0px 0px 0 0;
16050    }
16051
16052    .your-topics .all-topics li a.delete-btn {
16053        font-size: 25px;
16054    }
16055
16056    .links-and-topics-popup .inner-topics-links {
16057        background: #000;
16058    }
16059
16060    #add-links .your-links {
16061        margin-bottom: 110px;
16062    }
16063
16064    .links-and-topics-popup {
16065        z-index: 99999999999;
16066    }
16067
16068    .your-topics .your-topics-header h3 {
16069        font-size: 18px;
16070    }
16071
16072    .your-topics .all-topics li span {
16073        font-size: 14px;
16074    }
16075
16076    .your-topics .all-topics li a.delete-btn {
16077        font-size: 18px;
16078        width: 30px;
16079        display: inline-block;
16080        text-align: right;
16081    }
16082
16083    .links-wall h3 {
16084        font-size: 25px;
16085        font-weight: 900;
16086    }
16087
16088    .links-and-topics-popup .inner-topics-links {
16089        top: 0;
16090        border-radius: 0;
16091    }
16092
16093    div#add-links-popup {
16094        position: fixed;
16095        z-index: 9999999999;
16096    }
16097
16098    .links-wall {
16099        padding: 20px 20px;
16100    }
16101
16102    #add-intrest .links-wall>p {
16103        color: #c8c8c8;
16104        font-size: 13px;
16105        line-height: 18px;
16106    }
16107
16108    .links-and-topics-popup .inn-header h2 {
16109        font-size: 14px;
16110        font-weight: 600;
16111    }
16112
16113    .links-and-topics-popup .inn-header a {
16114        font-size: 13px;
16115    }
16116
16117    .links-and-topics-popup .inn-header {
16118        padding: 15px 15px;
16119    }
16120
16121    .links-wall {
16122        padding: 20px 15px;
16123    }
16124
16125    .your-topics .all-topics li {
16126        padding: 10px 0;
16127        padding-right: 20px;
16128    }
16129
16130    #add-intrest .links-wall {
16131        height: 100vh;
16132        overflow-y: auto;
16133    }
16134
16135    #add-intrest .your-topics {
16136        margin-bottom: 150px;
16137    }
16138
16139    .inner-topic-search {
16140        padding: 15px 15px;
16141    }
16142
16143    .search-topic-header.d-flex a {
16144        font-size: 13px;
16145    }
16146
16147    .dropdown-serach-result li a {
16148        font-size: 14px;
16149    }
16150
16151    .dropdown-serach-result {
16152        height: 100vh;
16153        overflow-y: auto;
16154    }
16155
16156    /*.search-topic-header.d-flex {
16157    position: fixed;
16158    width: 100%;
16159    left: 0;
16160    right: 0;
16161    padding: 15px 15px;
16162    background: #0f0f0f;
16163    top: 0;
16164}*/
16165    .search-topic-header.d-flex {
16166        position: sticky;
16167        width: 100%;
16168        left: 0;
16169        right: 0;
16170        padding: 0;
16171        background: #000;
16172        top: 0;
16173    }
16174
16175    /*.dropdown-serach-result ul {
16176    margin-top: 60px;
16177    margin-bottom: 70px;
16178}*/
16179    .dropdown-serach-result ul {
16180        margin-top: 10px;
16181        margin-bottom: 70px;
16182    }
16183
16184    .add-intrest-main>div:first-child input {
16185        font-size: 14px;
16186    }
16187
16188    #add-links .links-wall p br {
16189        display: none;
16190    }
16191
16192    #add-links .links-wall p {
16193        color: #c8c8c8;
16194        font-size: 13px;
16195        line-height: 18px;
16196    }
16197    body.light-mode #add-links .links-wall p {
16198        color: #222;
16199    }
16200
16201    #add-links .add-links a span:first-child {
16202        font-size: 14px;
16203    }
16204
16205    #add-links .add-links a span:last-child.plus {
16206        font-size: 18px;
16207        font-weight: 800;
16208        line-height: 15px;
16209        /*    height: 40px;*/
16210        display: flex;
16211        cursor: pointer;
16212        align-items: center;
16213        margin-top: 0px;
16214        padding: 0 0px;
16215    }
16216
16217    #add-links-popup .inner-link-section {
16218        width: 100%;
16219        max-width: 330px;
16220        left: 50%;
16221        position: fixed;
16222        transform: none;
16223        background: #161616;
16224        top: auto;
16225        padding: 30px;
16226        border-radius: 25px 25px 0 0;
16227        left: 0;
16228        right: 0;
16229        width: 100%;
16230        max-width: 100%;
16231        bottom: -270px;
16232        height: auto;
16233        padding-bottom: 20px;
16234        opacity: 0;
16235        transition: all 0.5s ease;
16236    }
16237
16238    #add-links-popup .inner-link-section.showMe {
16239        bottom: 0;
16240        opacity: 1;
16241    }
16242
16243    .add-link-form button.btn.btn-save {
16244        width: 100%;
16245        opacity: 1;
16246        border-radius: 18px;
16247        font-size: 13px;
16248        padding: 13px 0;
16249    }
16250
16251    /*.add-link-form .form-inner {
16252    border: none;
16253    padding: 8px 9px;
16254} */
16255    div#add-links-popup {
16256        background: #0000008f;
16257        backdrop-filter: none;
16258        -webkit-backdrop-filter: none;
16259    }
16260
16261    .add-link-form input {
16262        padding: 10px 0;
16263        font-size: 13px;
16264        border-radius: 0;
16265    }
16266
16267    .profile-menu-inner h2 {
16268        font-size: 18px;
16269        margin-bottom: 15px;
16270    }
16271
16272    .dropdown-serach-result ul li:last-child {
16273        margin-bottom: 145px;
16274    }
16275
16276    .inner-topic-search {
16277        top: 100%;
16278        visibility: hidden;
16279        opacity: 0;
16280        transition: all 0.5s ease;
16281    }
16282
16283    .links-and-topics-popup .inn-header {
16284        padding-bottom: 0 !important;
16285        border-bottom: none;
16286        
16287    }
16288    
16289body.light-mode .links-and-topics-popup .inn-header {
16290        padding-bottom: 15px !important;
16291        border-bottom: 1px solid #dadada;        
16292    }
16293
16294    .add-intrest-main>div:first-child input {
16295        padding: 12px 14px;
16296    }
16297
16298    .links-wall .add-links a {
16299        padding: 15px 17px;
16300    }
16301
16302    .add-custom-link-header .close-link {
16303        font-weight: 500;
16304        color: #adadad;
16305    }
16306
16307    .your-links h3 {
16308        font-size: 15px;
16309    }
16310
16311    #add-links-popup .inner-link-section {
16312        background: #141414;
16313    }
16314
16315    #add-intrest,
16316    #add-links {
16317        background: #000;
16318    }
16319
16320    #add-intrest .inner-topics-links.showMe,
16321    #add-links .inner-topics-links.showMe {
16322        transform: translateX(-50%) scale(1);
16323        opacity: 1;
16324    }
16325
16326    #add-intrest .inner-topics-links,
16327    #add-links .inner-topics-links {
16328        transform: translateX(-50%) scale(0.9);
16329        transition: all 0.3s ease;
16330        opacity: 0;
16331    }
16332}
16333</style>
16334
16335<div id="add-links" class="links-and-topics-popup" style="display:none">
16336    <div class="inner-topics-links">
16337        <div class="inn-header">
16338            <div class="close-in"
16339                onclick="deleteLinks=[]; newlyCreatedLinks = []; updatedLinks=[]; $('#add-links .inner-topics-links').removeClass('showMe');setTimeout(function(){ $('#add-links').hide();$('body').removeClass('overflow-hidden')},200)">
16340                <a href="#">Close</a></div>
16341            <h2>Links</h2>
16342            <div class="save-in" id="add-links-save" onclick="handleAddLinksSave()"><a href="#">Save</a></div>
16343        </div>
16344        <div class="links-wall">
16345            <h3>The Link Wall</h3>
16346            <p>Show more of who you are and create a link wall with up <br>to 8 external links.</p>
16347
16348            <div class="add-links">
16349                <a href="javascript:void(0)" onclick="handleAddLinksButtonClick()"><span>Add a link</span> <span
16350                        class="plus"><i class="hgi hgi-stroke hgi-plus-sign"></i></span></a>
16351            </div>
16352
16353
16354            <div id="add-link-new-popup">
16355                <div class="inner-link-section">
16356                    <div class="add-custom-link-header" style="display: none;">
16357                        <h2 style="visibility: hidden;">Add a link</h2>
16358                        <div class="close-link" onclick="$('#add-link-new-popup').slideUp()">Cancel</div>
16359                    </div>
16360
16361                    <div class="add-link-form">
16362                        <form action="">
16363                            <div class="form-inner">
16364                                <input type="text" maxlength="30" placeholder="Title">
16365                                <input type="text" maxlength="150" placeholder="Link" style="border-bottom:none">
16366                            </div>
16367                            <button id="save-link-btn" class="btn btn-save">Add</button>
16368                        </form>
16369                    </div>
16370                </div>
16371            </div>
16372
16373
16374            <div class="your-links">
16375                <h3>Your links</h3>
16376
16377                <div class="all-links">
16378
16379                    <!-- <div class="link-detail">
16380                        <div class="link-left">
16381                            <div class="link-logo"><img src="https://www.jumpspree.com/public/images/jumpspreefavicon.png?ver:1.027" alt=""></div>
16382                            <div class="link-desc">
16383                                <span>Jumpspree</span>
16384                                <span class="url">www.jumpspree.com</span>
16385                            </div>
16386                        </div>
16387                        <div class="right-link">
16388                            <a href="javascript:void(0)" onclick="$('#add-links-popup').fadeIn('fast')"><i class="hgi hgi-stroke hgi-pencil-edit-02"></i></a>
16389                            <a href="#" class="delete-btn"><i class="hgi hgi-stroke hgi-delete-02"></i></a>
16390                        </div>
16391                    </div> -->
16392
16393                </div>
16394            </div>
16395
16396        </div>
16397    </div>
16398</div>
16399
16400
16401<div id="add-intrest" class="links-and-topics-popup" style="display:none">
16402    <div class="inner-topics-links">
16403        <div class="inner-topic-full-wrapper">
16404            <div class="inn-header">
16405                <div class="close-in"><a href="javascript:void(0)"
16406                        onclick="$('#add-intrest .inner-topics-links').removeClass('showMe'); setTimeout(function(){$('body').removeClass('overflow-hidden'); $('#add-intrest').hide()},200); newlyCreatedInterests=[]; deleteInterests=[];">Close</a>
16407                </div>
16408                <h2>Topics</h2>
16409                <div class="save-in" onclick="handleAddInterestsSave()"><a href="#">Save</a></div>
16410            </div>
16411            <div class="links-wall">
16412                <p>Add topics to your profile to let people know what you’re into. You’ll be able to jump to your chosen
16413                    topics directly from your profile and see what other people with similar interests are posting. This
16414                    is a beta feature and we’re currently working on improving it.</p>
16415
16416                <div class="add-intrest-main">
16417                    <div><input type="text" placeholder="Add a new topic" class="add-intrest-input" readonly>
16418                        <div class="dropdwn-intrest">
16419                            <ul>
16420                                <li><a href="#">Topic 01</a></li>
16421                                <li><a href="#">Topic 02</a></li>
16422                                <li><a href="#">Topic 03</a></li>
16423                                <li><a href="#">Topic 04</a></li>
16424                                <li><a href="#">Topic 05</a></li>
16425                                <li><a href="#">Topic 06</a></li>
16426                            </ul>
16427                        </div>
16428
16429                    </div>
16430                    <div class="plus"><i class="hgi hgi-stroke hgi-plus-sign"></i></div>
16431                </div>
16432
16433
16434                <div class="your-topics">
16435                    <div class="your-topics-header d-flex justify-content-between">
16436                        <h3>Your topics</h3>
16437                        <div style="cursor: pointer;" onclick="handleInterestAllDelete()" class="delete-all">Delete all
16438                        </div>
16439                    </div>
16440
16441                    <div class="all-topics">
16442                        <ul>
16443                            <!-- <li class="d-flex justify-content-between">
16444                            <span>Startups</span>
16445                            <span><a href="#" class="delete-btn"><i class="hgi hgi-stroke hgi-delete-02"></i></a></span>
16446                        </li> -->
16447                        </ul>
16448                    </div>
16449
16450                </div>
16451
16452            </div>
16453        </div>
16454
16455        <div class="inner-topic-search">
16456            <div class="search-topic">
16457                <div class="search-topic-header d-flex">
16458                    <img src="https://www.jumpspree.com/public/images/lense--search.png" class="search" alt="">
16459                    <input type="text" maxlength="40" placeholder="Search"> <a href="#" class="cancel-topic">Cancel</a>
16460                </div>
16461                <div class="dropdown-serach-result">
16462                    <ul>
16463                        <!-- <li><a href="#">Topic01</a>  <div class="add-topic">Add new topic</div></li> -->
16464                        <!-- <li><a href="#">Sopic01</a></li> -->
16465                    </ul>
16466                </div>
16467            </div>
16468        </div>
16469    </div>
16470</div>
16471
16472
16473
16474
16475<div id="add-links-popup" class="add-links" style="display:none">
16476    <div class="inner-link-section">
16477        <div class="add-custom-link-header">
16478            <h2>Add a link</h2>
16479            <div class="close-link"
16480                onclick="$('#add-links-popup .inner-link-section').removeClass('showMe'); setTimeout(function(){$('#add-links-popup').fadeOut().removeAttr('data-edit-id');},200)">
16481                Cancel</div>
16482        </div>
16483
16484        <div class="add-link-form">
16485            <form action="">
16486                <div class="form-inner">
16487                    <input type="text" maxlength="30" placeholder="Title">
16488                    <input type="text" maxlength="150" placeholder="Link" style="border-bottom:none">
16489                </div>
16490                <button id="save-link-btn" class="btn btn-save">Save</button>
16491            </form>
16492        </div>
16493    </div>
16494</div>
16495
16496
16497<div id="change-theme" class="change-theme social-popup" style="display:none">
16498    <div class="inner-section add-post-inner">
16499        <h2>Theme</h2>
16500        <ul>
16501            <li>
16502                    <span>Light mode</span> 
16503                   <span> <input type="checkbox" id="switch-light">
16504                        <label for="switch-light"><i></i></label></span>
16505            </li>
16506            <li>
16507                    <span>Night mode</span> 
16508                    <span>
16509                    <input type="checkbox" id="switch-dark">
16510                    <label for="switch-dark"><i></i></label></span>
16511            </li>
16512        </ul>
16513    </div>
16514</div>
16515
16516
16517
16518
16519
16520
16521
16522<script defer src="https://www.jumpspree.com/public/js/myfunctions.js?ver=1_200013"></script>
16522
16523
16524<script defer src="https://www.jumpspree.com/public/js/notify.js"></script>
vendor: 2 bytes, line 16524
16524
16525<script defer src="https://www.jumpspree.com/public/js/clipboard.min.js"></script>
vendor: 2 bytes, line 16525
16525
16526<script defer src="https://www.jumpspree.com/public/js/owl.carousel.min.js"></script>
vendor: 2 bytes, line 16526
16526
16527<script defer src="https://www.jumpspree.com/public/js/lightgallery.min.js"></script>
vendor: 2 bytes, line 16527
16527
16528<script>
16529function openPostShareDialog(postId, username) {
16530    // Check if the postId starts with "product-" or "post-"
16531    let shareUrl = "";
16532    shareUrl = `${base_url}/ps/${username}/jumpid${postId}`;
16533
16534    // Update the share link displayed in the dialog
16535    document.getElementById('share-url').textContent = shareUrl;
16536
16537    // Social share URLs
16538    const socialLinks = [{
16539            ic: "fa-brands fa-facebook",
16540            platform: "Facebook",
16541            url: `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(shareUrl)}`,
16542            img: "facebook2.png"
16543        },
16544        //{ platform: "Instagram", url: "#", img: "instagram-icon.png" }, // Instagram sharing is limited to apps
16545        {
16546            ic: "fa-brands fa-x-twitter",
16547            platform: "Twitter",
16548            url: `https://twitter.com/intent/tweet?url=${encodeURIComponent(shareUrl)}`,
16549            img: "twitter-icon.png"
16550        },
16551        {
16552            ic: "fa-brands fa-linkedin",
16553            platform: "LinkedIn",
16554            url: `https://www.linkedin.com/shareArticle?mini=true&url=${encodeURIComponent(shareUrl)}`,
16555            img: "linkedin2.png"
16556        },
16557        //{ platform: "Tiktok", url: "#", img: "tiktok.png?ver:1.02" }, // TikTok sharing is limited to apps
16558        {
16559            ic: "fa-solid fa-envelope",
16560            platform: "Email",
16561            url: `mailto:?subject=Check this out!&body=${encodeURIComponent(shareUrl)}`,
16562            img: "message.png"
16563        }
16564    ];
16565
16566    // Populate the social buttons dynamically
16567    const shareButtonsContainer = document.getElementById('social-share-buttons');
16568    shareButtonsContainer.innerHTML = ""; // Clear existing buttons
16569    socialLinks.forEach(link => {
16570        const listItem = `
16571            <li>
16572                <a href="${link.url}" target="_blank" class="button"> 
16573                    <i class="${link.ic}"></i>
16574                    <span>${link.platform}</span>
16575                </a>
16576            </li>
16577        `;
16578        shareButtonsContainer.insertAdjacentHTML('beforeend', listItem);
16579    });
16580
16581    // Show the share dialog
16582    $('#share-site-link').addClass('share-in-open');
16583}
16584
16585
16586
16587
16588
16589
16590
16591
16592
16593
16594
16595
16596
16597
16598
16599//dec 17 
16600function openShareDialog(postId) {
16601    // Check if the postId starts with "product-" or "post-"
16602    let shareUrl = "";
16603    if (postId.startsWith("product-")) {
16604        const productId = postId.split("-")[1]; // Extract numeric ID
16605        shareUrl = `${base_url}/product/${productId}`;
16606    } else if (postId.startsWith("post-")) {
16607        const postIdNumber = postId.split("-")[1]; // Extract numeric ID
16608        shareUrl = `${base_url}/post/${postIdNumber}`;
16609    } else if (postId.startsWith("profile-")) {
16610        const userName = postId.split("-")[1]; // Extract userName 
16611        shareUrl = `${userName}`;
16612    } else {
16613        console.error("Invalid postId format");
16614        return;
16615    }
16616
16617    // Update the share link displayed in the dialog
16618    document.getElementById('share-url').textContent = shareUrl;
16619
16620    // Social share URLs
16621    const socialLinks = [{
16622            ic: "fa-brands fa-facebook",
16623            platform: "Facebook",
16624            url: `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(shareUrl)}`,
16625            img: "facebook2.png"
16626        },
16627        //{ platform: "Instagram", url: "#", img: "instagram-icon.png" }, // Instagram sharing is limited to apps
16628        {
16629            ic: "fa-brands fa-x-twitter",
16630            platform: "Twitter",
16631            url: `https://twitter.com/intent/tweet?url=${encodeURIComponent(shareUrl)}`,
16632            img: "twitter-icon.png"
16633        },
16634        {
16635            ic: "fa-brands fa-linkedin",
16636            platform: "LinkedIn",
16637            url: `https://www.linkedin.com/shareArticle?mini=true&url=${encodeURIComponent(shareUrl)}`,
16638            img: "linkedin2.png"
16639        },
16640        //{ platform: "Tiktok", url: "#", img: "tiktok.png?ver:1.02" }, // TikTok sharing is limited to apps
16641        {
16642            ic: "fa-solid fa-envelope",
16643            platform: "Email",
16644            url: `mailto:?subject=Check this out!&body=${encodeURIComponent(shareUrl)}`,
16645            img: "message.png"
16646        }
16647    ];
16648
16649    // Populate the social buttons dynamically
16650    const shareButtonsContainer = document.getElementById('social-share-buttons');
16651    shareButtonsContainer.innerHTML = ""; // Clear existing buttons
16652    socialLinks.forEach(link => {
16653        const listItem = `
16654            <li>
16655                <a href="${link.url}" target="_blank" class="button">
16656                    <i class="${link.ic}"></i>
16657                    <span>${link.platform}</span>
16658                </a>
16659            </li>
16660        `;
16661        shareButtonsContainer.insertAdjacentHTML('beforeend', listItem);
16662    });
16663
16664    // Show the share dialog
16665    $('#share-site-link').addClass('share-in-open');
16666}
16667
16668
16669// Function to copy the URL to clipboard
16670function copyToClipboard(element) {
16671    const text = document.querySelector(element).textContent;
16672    navigator.clipboard.writeText(text).then(() => {
16673        //alert('Link copied to clipboard!');
16674        //showNotification('success', 'Link copied to clipboard!'); 
16675        //$('#post-Link-copied').css({'display': 'flex'});
16676        $('#post-Link-copied').addClass('show-notification');
16677        setTimeout(function() {
16678            $('#post-Link-copied').removeClass('show-notification');
16679        }, 5000)
16680    });
16681
16682    $('.profile-drop-down ul').hide();
16683}
16684
16685/* $(document).ready(function () {
16686    
16687    let optionCount = 2; 
16688    
16689     // Function to update delete button visibility
16690    function updateDeleteButtonVisibility() {
16691        if (optionCount > 2) {
16692           // $('.delete-option').show(); // Show delete buttons if more than 2 options
16693        } else {
16694           // $('.delete-option').hide(); // Hide delete buttons if 2 or fewer options
16695        }
16696    }
16697
16698    $('.add-more-option').on('click', function () {
16699        
16700        // Check if the current number of options is less than 4
16701        if (optionCount < 4) {
16702            optionCount++;
16703            // Create a new option input element
16704            //const newOption = `<div class="option"><input type="text" placeholder="Option ${optionCount}"></div>`;
16705            const newOption = `<div class="option">
16706                <input type="text" placeholder="Option ${optionCount}">
16707                    <span class="delete-option"><i class="fa-solid fa-xmark" aria-hidden="true"></i></span></div>`;
16708            // Insert the new option before the add-more-option button
16709            // Insert the new option before the add-more-option button
16710            $(newOption).insertBefore('.add-more-option');
16711            updateDeleteButtonVisibility();
16712        }
16713
16714        // Disable the add-more button if options reach 4
16715        if (optionCount === 4) {
16716            $('.add-more-option').hide();
16717        }
16718    });
16719    
16720    
16721     $('.create-poll-option').on('click', '.delete-option', function () {
16722        $(this).parent('.option').remove(); // Remove the option div
16723        optionCount--; // Decrease option count
16724         updateDeleteButtonVisibility();
16725
16726        // Show add-more-option button if options are below 4 again
16727        if (optionCount < 4) {
16728            $('.add-more-option').show();
16729        }
16730
16731        // Update placeholders for remaining options
16732        $('.create-poll-option .option input[type="text"]').each(function (index) {
16733            $(this).attr('placeholder', `Option ${index + 1}`);
16734        });
16735    });
16736    
16737    // Initial call to hide delete buttons
16738    updateDeleteButtonVisibility();
16739}); */
16740document.addEventListener("DOMContentLoaded", function() {
16741    const container = document.getElementById("pollOptionsContainer");
16742
16743    container.addEventListener("input", function(e) {
16744        if (e.target.classList.contains("poll-option-input")) {
16745            let value = e.target.value;
16746
16747            // Disallow special characters and limit to 50 characters
16748            value = value.replace(/[@$#%^&*()!]/g, "").substring(0, 50);
16749
16750            e.target.value = value;
16751        }
16752    });
16753});
16754
16755$(document).ready(function() {
16756    let optionCount = $('.create-poll-option .option').length;
16757
16758    function updateDeleteButtonVisibility() {
16759        if (optionCount > 2) {
16760            $('.create-poll-option .delete-option').show();
16761        } else {
16762            $('.create-poll-option .delete-option').hide();
16763        }
16764
16765        // Update placeholders
16766        $('.create-poll-option .option input[type="text"]').each(function(index) {
16767            $(this).attr('placeholder', `Option ${index + 1}`);
16768        });
16769    }
16770
16771    // Add new option on typing in the last input
16772    $(document).on('input', '.add-another-option input', function() {
16773        const value = $(this).val().trim();
16774        optionCount = $('.create-poll-option .option').length;
16775
16776        if (value !== "" && optionCount < 4 && !$(this).closest('.option').next('.add-another-option')
16777            .length) {
16778            const newOption = `
16779                        <div class="option add-another-option">
16780                            <input type="text" class="poll-option-input" placeholder="Add more">
16781                            <button class="delete-option" type="button">
16782                                <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
16783                            </button>
16784                        </div>`;
16785
16786
16787            $(this).closest('.option').after(newOption);
16788            optionCount++;
16789            updateDeleteButtonVisibility();
16790        }
16791
16792        // Remove extra empty add-another fields
16793        $('.add-another-option input').each(function() {
16794            if ($(this).val().trim() === "" && $(this).closest('.option').next(
16795                    '.add-another-option').length) {
16796                $(this).closest('.option').remove();
16797                optionCount--;
16798                updateDeleteButtonVisibility();
16799            }
16800        });
16801    });
16802
16803    // Delete option
16804    $('.create-poll-option').on('click', '.delete-option', function() {
16805        $(this).closest('.option').remove();
16806        optionCount--;
16807
16808        if (optionCount < 4 && $('.add-another-option').length === 0) {
16809            // Always keep one empty add-another-option at end
16810            const newOption = `
16811                <div class="option add-another-option">
16812                    <input type="text" placeholder="Add more">
16813                    <button class="delete-option" type="button">
16814                        <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
16815                    </button>
16816                </div>`;
16817            $('.create-poll-option').append(newOption);
16818            optionCount++;
16819        }
16820
16821        updateDeleteButtonVisibility();
16822    });
16823
16824    // Init
16825    updateDeleteButtonVisibility();
16826
16827
16828    //logic to enabled dsiable buttons 
16829    function validatePollSubmitButton() {
16830        let filledOptions = $('#pollOptionsContainer .option input[type="text"]').filter(function() {
16831            return $(this).val().trim() !== '';
16832        }).length;
16833
16834        let descriptionFilled = $('#pollDescription').val().trim() !== '';
16835
16836        if (filledOptions >= 2 && descriptionFilled) {
16837            $('#createPollSubmit').removeClass('disabled').addClass('activateBtn');
16838            $('#submitPollForm').removeClass('disabled').addClass('active');
16839        } else {
16840            $('#createPollSubmit').addClass('disabled').removeClass('activateBtn');
16841            $('#submitPollForm').addClass('disabled').removeClass('active');
16842        }
16843
16844
16845    }
16846
16847    // Listen to changes in poll options and description
16848    $(document).on('input', '#pollOptionsContainer .option input[type="text"], #pollDescription', function() {
16849        validatePollSubmitButton();
16850    });
16851
16852    // Also call it after deleting an option
16853    $(document).on('click', '.delete-option', function() {
16854        setTimeout(validatePollSubmitButton, 100); // small delay to allow DOM update
16855    });
16856
16857});
16858
16859
16860
16861$(function() {
16862
16863    $('.owl-carousel').owlCarousel({
16864        loop: false,
16865        margin: 10,
16866        nav: false,
16867        dots: false,
16868        autoplay: false,
16869        //autoplayTimeout: 5000,
16870        responsive: {
16871            0: {
16872                items: 1
16873            },
16874            600: {
16875                items: 1
16876            },
16877            1000: {
16878                items: 1
16879            }
16880        }
16881    })
16882
16883    $('body').click(function() {
16884        $('.drop-down-blog ul').hide();
16885        $('.share-icons').hide();
16886        $('.more-setting-pop').removeClass('more-settings');
16887        $('#embed-code').removeClass('embed-in');
16888        //$('#embed-link').removeClass('embed-in');
16889        //$('#add-alt-tag').removeClass('embed-in');
16890        $('.drop-down-menu-share').hide();
16891        $('#share-site-link').removeClass('share-in-open');
16892        // $('.profile-drop-down ul').hide();
16893        $('.profile-drop-down ul').hide();
16894    })
16895
16896
16897    $('a.refresh-icon').click(function() {
16898        $(this).addClass('refresh-me');
16899        setTimeout(function() {
16900            $('a.refresh-icon').removeClass('refresh-me');
16901        }, 1000)
16902    })
16903
16904
16905
16906    $('.drop-down-blog a').click(function(e) {
16907        e.stopPropagation();
16908    })
16909
16910    $('.social-popup').click(function() {
16911        $(this).fadeOut();
16912        $('body').removeClass('overflow-hidden');
16913    })
16914
16915    $('.add-post-inner').click(function(e) {
16916        e.stopPropagation();
16917    })
16918    $('.like-post a').click(function(e) {
16919        e.preventDefault();
16920        // $(this).toggleClass('liked')
16921    })
16922    //    $('.social-shadow').click(function(){
16923    //    })   
16924
16925    $('.share-button').click(function() {
16926        $('.share-dialog').addClass('is-open')
16927    })
16928
16929    $('.add-post').click(function() {
16930        //$(this).toggleClass('add-post-opened');
16931        //$('.add-post-drop-box').slideToggle('fast');
16932        $('.social-shadow').fadeToggle('fast');
16933        $('body').addClass('overflow-hidden');
16934    })
16935    $('.social-shadow').click(function() {
16936        $('.share-dialog').removeClass('is-open');
16937        $('.add-post-drop-box').fadeOut('fast');
16938        $('.social-shadow').fadeOut('fast');
16939        $('.add-post').removeClass('add-post-opened');
16940        $('body').removeClass('overflow-hidden');
16941    })
16942    $('.share-button-desktop').click(function(e) {
16943        e.stopPropagation();
16944        $(this).next().fadeToggle('fast');
16945    })
16946
16947    $('#moresetting').click(function(e) {
16948        e.stopPropagation();
16949        $(this).addClass('active');
16950        $('.profile-drop-down ul').hide();
16951        $('.more-setting-pop').toggleClass('more-settings');
16952        $('#more-resources a').next().removeClass('more-settings');
16953    })
16954
16955    /*$('.get-app-btn a').click(function(e) {
16956        e.preventDefault();
16957        $('#ios-app').fadeIn('fast');
16958    })*/
16959    $('.get-app-qr-code-wrapper').click(function() {
16960        $(this).fadeOut('fast')
16961    })
16962    $('.get-app-qr-code-wrapper > div').click(function(e) {
16963        e.stopPropagation();
16964    })
16965
16966
16967    // Add Another Option
16968
16969
16970    /* 
16971        $(document).on('input', '.add-another-option input', function() {
16972            let value = $(this).val().trim();
16973            let optionCount = $('.create-poll-option .option').length;
16974
16975            // Add a new input if there is text and the total options are less than 5
16976            if (value !== "" && optionCount < 4 && !$(this).closest('.option').next('.add-another-option')
16977                .length) {
16978                const newOption = `
16979                    <div class="option add-another-option">
16980                        <input type="text" placeholder="Add more">
16981    <button class="delete-option" type="button" style="visibility: hidden;"><img src="https://www.jumpspree.com/public/images/trash.png" alt="Jumpspree"></button>
16982                    </div>`;
16983                $(this).closest('.option').after(newOption);
16984            }
16985
16986            // Remove empty "Add another option" fields except the last one
16987            $('.add-another-option input').each(function() {
16988                if ($(this).val().trim() === "" && $(this).closest('.option').next(
16989                        '.add-another-option').length) {
16990                    $(this).closest('.option').remove();
16991                }
16992            });
16993        }); */
16994
16995
16996
16997
16998
16999
17000    // Poll Timer
17001    function populateOptions(id, max) {
17002        const selectOptions = document.querySelector(`#${id} .select-options`);
17003        if (!selectOptions) return;
17004        selectOptions.innerHTML = ""; // Clear any existing options
17005        for (let i = 1; i <= max; i++) {
17006            const option = document.createElement('div');
17007            option.textContent = i;
17008            selectOptions.appendChild(option);
17009        }
17010    }
17011
17012    function getUnitLabel(id, value) {
17013        if (id === 'day') {
17014            return value === '1' ? '1 day' : `${value} days`;
17015        } else if (id === 'hours') {
17016            return value === '1' ? '1 hour' : `${value} hours`;
17017        } else if (id === 'minutes') {
17018            return value === '1' ? '1 minute' : `${value} minutes`;
17019        }
17020        return value;
17021    }
17022
17023    function closeAllDropdowns(exceptId) {
17024        const dropdowns = document.querySelectorAll('.select-options');
17025        dropdowns.forEach(dropdown => {
17026            if (dropdown.parentElement.id !== exceptId) {
17027                dropdown.style.display = 'none';
17028            }
17029        });
17030    }
17031
17032    function setupSelect(id) {
17033        const selectBtn = document.querySelector(`#${id} .select-btn`);
17034        const selectOptions = document.querySelector(`#${id} .select-options`);
17035
17036        if (!selectBtn || !selectOptions) return;
17037
17038        selectBtn.addEventListener('click', () => {
17039            // Close other dropdowns except the current one
17040            closeAllDropdowns(id);
17041            // Toggle the current dropdown
17042            selectOptions.style.display = selectOptions.style.display === 'block' ? 'none' : 'block';
17043        });
17044
17045        selectOptions.addEventListener('click', (event) => {
17046            if (event.target.tagName === 'DIV') {
17047                const selectedValue = event.target.textContent;
17048                selectBtn.textContent = getUnitLabel(id, selectedValue);
17049                selectOptions.style.display = 'none';
17050            }
17051        });
17052    }
17053
17054    // Populate each dropdown with its respective range
17055    populateOptions('day', 7); // Days: 1 to 7
17056    populateOptions('hours', 23); // Hours: 1 to 23
17057    populateOptions('minutes', 59); // Minutes: 1 to 59
17058
17059    // Setup dropdown behavior
17060    setupSelect('day');
17061    setupSelect('hours');
17062    setupSelect('minutes');
17063
17064    // Close dropdowns if clicked outside of any dropdown
17065    document.addEventListener('click', (event) => {
17066        if (!event.target.closest('.custom-select')) {
17067            closeAllDropdowns();
17068        }
17069    });
17070
17071
17072
17073    // Poll timer end  
17074
17075
17076
17077
17078
17079})
17080$(document).keyup(function(e) {
17081    if (e.key === "Escape") { // Check if the pressed key is "Escape"
17082        $('.get-app-qr-code-wrapper').fadeOut('fast');
17083    }
17084});
17085</script>
vendor: 2 bytes, line 17085
17085
17086<script>
17087$(function() {
17088    $('body').click(function() {
17089        $('.drop-down-blog ul').hide();
17090    })
17091    $('.drop-down-blog a').click(function(e) {
17092        e.stopPropagation();
17093    })
17094    $('.report-reason li label').click(function() {
17095        $('#additional-comment').hide();
17096    })
17097    $('.report-reason li#something-else label').click(function() {
17098        $('#additional-comment').show();
17099    })
17100})
17101</script>
17101
17102
17103<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
vendor: 2 bytes, line 17103
17103
17104<script>
17105$(document).ready(function() {
17106
17107    function getCookie(cname) {
17108        let name = cname + "=";
17109        let ca = document.cookie.split(';');
17110        for (let i = 0; i < ca.length; i++) {
17111            let c = ca[i];
17112            while (c.charAt(0) == ' ') {
17113                c = c.substring(1);
17114            }
17115            if (c.indexOf(name) == 0) {
17116                return c.substring(name.length, c.length);
17117            }
17118        }
17119        return "";
17120    }
17121
17122
17123
17124    // Cookies.set('popupShown', 'true', { expires: 10, path: '/' }); // Cookie expires in 1 day
17125
17126
17127    //   $('#launch').fadeIn('fast');
17128    //     $('#launch button').click(function(){
17129    //   $('#launch').fadeOut('fast');
17130    //     })
17131    // Check if the popup has been shown before
17132    if (getCookie("popupShown") == '') {
17133        // Show the popup
17134        $('#launch').fadeIn();
17135
17136        // Set a cookie to remember the user has seen the popup
17137        document.cookie = "popupShown=John Doe; expires=Thu, 18 Dec 2033 12:00:00 UTC";
17138    } else {
17139        $('#launch').fadeOut();
17140
17141    }
17142
17143    // Close button functionality
17144    $('#close-popup').click(function() {
17145        $('#launch').fadeOut();
17146    });
17147
17148    $('#launch button').click(function() {
17149        $('#launch').fadeOut('fast');
17150    })
17151
17152
17153});
17154
17155/*$(document).ready(function() {
17156    // Check if the cookie exists and apply the class
17157    var bodyClass = $.cookie('bodyClass');
17158    if (bodyClass == 'light-mode') {
17159        //$('body').removeAttr();
17160        $('body').addClass('light-mode');
17161        $('body').removeClass('dark-mode');
17162        $('#light-mode-on').addClass('actived');
17163        $('#dark-mode-on').removeClass('actived');
17164    }
17165
17166    // Event handler to add class and set cookie
17167    $('#dark-mode-on, #switch2').on('click', function() {
17168        alert('hi');
17169        var newClass = 'dark-mode';
17170        $('body').removeClass('light-mode');
17171        $('body').addClass(newClass);
17172        $(this).addClass('actived');
17173        // $('#light-mode-on').removeClass('active');
17174        $('#light-mode-on').removeClass('actived');
17175        $('#dark-mode-on').addClass('actived');
17176        // Set a cookie to remember the class for 7 days
17177        $.cookie('bodyClass', newClass, {
17178            expires: 7,
17179            path: '/'
17180        });
17181    });
17182
17183    $('#light-mode-on, #switch1').on('click', function() {
17184        var newClass = 'light-mode';
17185        $('body').removeClass('dark-mode');
17186        $('body').addClass(newClass);
17187        //$(this).addClass('active');
17188        $(this).addClass('actived');
17189         $('#light-mode-on').addClass('actived');
17190        $('#dark-mode-on').removeClass('actived');
17191        //$('#dark-mode-on').removeClass('active');
17192       // $('#dark-mode-on').show();
17193        // Set a cookie to remember the class for 7 days
17194        $.cookie('bodyClass', newClass, {
17195            expires: 7,
17196            path: '/'
17197        });
17198    });
17199
17200});*/
17201    
17202/*$(document).ready(function () {
17203
17204   
17205    var bodyClass = $.cookie('bodyClass');
17206    
17207    if (bodyClass == 'light-mode') {
17208         $('body').addClass('light-mode');
17209        $('body').removeClass('dark-mode');
17210        $('#switch-dark').prop('checked', false);
17211        $('#switch-light').prop('checked', true);
17212    } else {
17213        //$('body').addClass('light-mode').removeClass('dark-mode');
17214        $('#switch-light').prop('checked', false);
17215        $('#switch-dark').prop('checked', true);
17216    }
17217
17218    // Light Mode
17219    $('#switch-light').on('change', function () {
17220
17221        // ❌ Already active → toggle nahi hoga
17222        if ($('body').hasClass('light-mode')) {
17223            $(this).prop('checked', true);
17224            return;
17225        }
17226
17227        $('body').addClass('light-mode').removeClass('dark-mode');
17228        $('#switch-dark').prop('checked', false);
17229
17230        $.cookie('bodyClass', 'light-mode', {
17231            expires: 7,
17232            path: '/'
17233        });
17234    });
17235
17236    // Dark Mode
17237    $('#switch-dark').on('change', function () {
17238
17239        // ❌ Already active → toggle nahi hoga
17240        if ($('body').hasClass('dark-mode')) {
17241            $(this).prop('checked', true);
17242            return;
17243        }
17244
17245        $('body').addClass('dark-mode').removeClass('light-mode');
17246        $('#switch-light').prop('checked', false);
17247
17248        $.cookie('bodyClass', 'dark-mode', {
17249            expires: 7,
17250            path: '/'
17251        });
17252    });
17253
17254    
17255    $('#change-theme-btn').click(function(){
17256        $('#change-theme').fadeIn();
17257    })
17258});   */ 
17259</script>
vendor: 2 bytes, line 17259
17259
17260<script>
17261// Trigger file input when clicking the icons
17262document.getElementById('image-trigger').addEventListener('click', function(e) {
17263    e.preventDefault();
17264    document.getElementById('image-input').click();
17265});
17266
17267document.getElementById('video-trigger').addEventListener('click', function(e) {
17268    e.preventDefault();
17269    document.getElementById('video-input').click();
17270
17271});
17272
17273// Trigger file input when clicking the icons
17274$('#image-trigger-repost').on('click', function(e) {
17275    e.preventDefault();
17276    document.getElementById('repost-image').click(); // Triggers file input dialog
17277});
17278
17279$('#video-trigger-repost').on('click', function(e) {
17280    e.preventDefault();
17281    document.getElementById('repost-video').click(); // Triggers file input dialog
17282});
17283
17284// Image Preview
17285document.getElementById('image-input').addEventListener('change', function(e) {
17286    const file = e.target.files[0];
17287    if (file && file.type.startsWith('image/')) {
17288        const reader = new FileReader();
17289        reader.onload = function(event) {
17290            document.getElementById('preview').innerHTML = '<img src="' + event.target.result +
17291                '" alt="Image Preview">';
17292        };
17293        reader.readAsDataURL(file);
17294    }
17295
17296    $('#comment-section').addClass('media-added');
17297});
17298
17299// Video Preview
17300document.getElementById('video-input').addEventListener('change', function(e) {
17301
17302    const file = e.target.files[0];
17303    if (file && file.type.startsWith('video/')) {
17304        const reader = new FileReader();
17305        reader.onload = function(event) {
17306            document.getElementById('preview').innerHTML = '<video controls><source src="' + event.target
17307                .result + '" type="' + file.type + '"></video>';
17308        };
17309        reader.readAsDataURL(file);
17310    }
17311    $('#comment-section').addClass('media-added');
17312});
17313
17314// GIF selection from Giphy API
17315// GIF selection from Giphy API
17316document.getElementById('gif-trigger').addEventListener('click', function(e) {
17317    e.preventDefault();
17318    $('.add-image').hide();
17319
17320    fetch('https://api.giphy.com/v1/gifs/trending?api_key=uGguGjuTdE4Zqe3SFEah6hTQHb3E4mkG&limit=10&rating=g')
17321        .then(response => response.json())
17322        .then(data => {
17323            let gifHTML = '<div class="gif-list">';
17324            data.data.forEach(gif => {
17325                gifHTML +=
17326                    `<img src="${gif.images.original.url}" class="gif-item" onclick="selectGIF('${gif.images.original.url}')">`;
17327            });
17328            gifHTML += '</div>';
17329            document.getElementById('preview').innerHTML = gifHTML;
17330
17331        });
17332    setTimeout(function() {
17333        $('.gif-list').append('<span class="close-x">&times;</span>');
17334        $('.gif-list span.close-x').click(function() {
17335            $('.gif-list').hide();
17336        })
17337    }, 1000)
17338});
17339
17340// Select GIF and show preview with a close button
17341function selectGIF(url) {
17342
17343    document.getElementById('preview').innerHTML = `
17344            <div class="preview-content">
17345                <img src="${url}" alt="GIF Preview" class="gif-preview">
17346                <div class="close">&times;</div>
17347            </div>
17348        `;
17349    $('#comment-section').addClass('media-added');
17350}
17351
17352// Event delegation for the close button
17353document.getElementById('preview').addEventListener('click', function(e) {
17354    if (e.target.classList.contains('close')) {
17355        // Clear the preview box when the close button is clicked
17356        document.getElementById('preview').innerHTML = '';
17357        $('#comment-section').removeClass('media-added');
17358    }
17359});
17360
17361function copyText(postId) {
17362    // Get the text content from the div
17363    const postTextElement = document.getElementById(`post-text-${postId}`);
17364    const textToCopy = postTextElement.innerText || postTextElement.textContent;
17365
17366    // Copy the text to the clipboard
17367    navigator.clipboard.writeText(textToCopy)
17368        .then(() => {
17369            //alert('Text copied to clipboard!');
17370            //showNotification('success', 'Text copied to clipboard!');
17371            $('#post-text-copied').addClass('show-notification');
17372            setTimeout(function() {
17373                $('#post-text-copied').removeClass('show-notification');
17374            }, 5000)
17375
17376        })
17377        .catch(err => {
17378            //console.error('Failed to copy text: ', err);
17379            showNotification('error', 'Failed to copy text!');
17380
17381        });
17382}
17383
17384function htmlEntityDecode_old(text) {
17385    const tempElement = document.createElement('textarea');
17386    tempElement.innerHTML = text;
17387    return tempElement.value;
17388}
17389
17390
17391function hashTagOnClick(tag) {
17392    const hashTagContainer = document.getElementById('posts-container-hashTags');
17393    const fixedHashTagsDiv = document.getElementById('fixed-heading-hashTag');
17394    if (hashTagContainer) {
17395        hashTagContainer.innerHTML = ''; // Clear the content
17396        console.log('Cleared content of posts-container-hashTags');
17397    } else {
17398        console.error('Element with ID "posts-container-hashTags" not found.');
17399    }
17400
17401    fixedHashTagsDiv.style.display = 'block';
17402    // Call getSocialFeed after clearing content
17403    $('body').addClass('hashtag-active');
17404    $('html, body').animate({
17405        scrollTop: 0
17406    }, 500);
17407
17408    getSocialFeed('3', '1', '1', tag);
17409}
17410
17411
17412
17413
17414
17415function convertHashtagsToLinks(text) {
17416    $('.post-area').addClass('hashtagopen');
17417    text = decodeHTMLEntities(text);
17418
17419    // Enhanced URL regex that properly handles URLs containing @ and #
17420    const urlRegex = /(https?:\/\/[^\s<>()"']+|www\.[^\s<>()"']+|\b[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}\/[^\s<>()"']*)/g;
17421
17422    // First, protect URLs by replacing them with temporary markers
17423    const urlMap = {};
17424    let urlCounter = 0;
17425
17426    text = text.replace(urlRegex, function(match) {
17427        const key = `[[URL_${urlCounter++}]]`;
17428        urlMap[key] = match;
17429        return key;
17430    });
17431
17432    // Now process mentions (only standalone ones)
17433    const mentionRegex = /(^|\s)@(\w+)(?=\s|$)/g;
17434    text = text.replace(mentionRegex, function(match, prefix, username) {
17435        return `${prefix}<a href="https://www.jumpspree.com/${username}" class="mention-link">@${username}</a>`;
17436    });
17437
17438    // Process hashtags (only standalone ones)
17439    const hashtagRegex = /(^|\s)#(\w+)(?=\s|$)/g;
17440    text = text.replace(hashtagRegex, function(match, prefix, tag) {
17441        return `${prefix}<a href="javascript:void(0)" class="hashtag-link" onclick="hashTagOnClick('${tag}')">#${tag}</a>`;
17442    });
17443
17444    // Finally, restore the original URLs
17445    for (const [key, url] of Object.entries(urlMap)) {
17446        let displayUrl = url;
17447        let href = url;
17448
17449        // Handle "www." links
17450        if (/^www\./i.test(displayUrl)) {
17451            displayUrl = `https://${displayUrl}`;
17452            href = `https://${url}`;
17453        }
17454
17455        // Ensure URL has protocol
17456        if (!/^https?:\/\//i.test(href)) {
17457            href = 'http://' + href;
17458        }
17459
17460        text = text.replace(key,
17461            `<a href="${href}" class="dynamicPostLink" target="_blank">${displayUrl}</a>`);
17462    }
17463
17464    return text;
17465}
17466
17467function decodeHTMLEntities(text) {
17468    var textarea = document.createElement('textarea');
17469    textarea.innerHTML = text;
17470    return textarea.value;
17471}
17472
17473
17474// Function to count YouTube links in the post text
17475function countYouTubeLinks(postText) {
17476    const youtubeRegex = /https?:\/\/(www\.)?(youtube\.com\/watch\?v=|youtu\.be\/)([a-zA-Z0-9_-]{11})/g;
17477    const matches = postText.match(youtubeRegex);
17478    return matches ? matches.length : 0;
17479}
17480
17481function extractUrls(text) {
17482    // Remove <br> and other unwanted HTML tags from the text
17483    const sanitizedText = text.replace(/<br\s*\/?>/g, '').replace(/<[^>]+>/g, '');
17484
17485    // Regular expression to match URLs
17486    const regex = /(https?:\/\/[^\s]+)/g;
17487
17488    //console.log("comes 851");
17489    //console.log(sanitizedText);
17490
17491    return sanitizedText.match(regex) || [];
17492}
17493
17494
17495// ======================
17496// Link Preview — deduplicated + staggered (2026-05-15, hardened 2026-05-15)
17497// window._lpCache:   URL → pending jqXHR deferred. Second caller attaches to existing
17498//                    request — no duplicate XHR fired.
17499// window._lpStagger: increments 200ms per new unique URL to prevent burst pile-up.
17500//                    Reset to 0 by getSocialFeed() on each feed page load.
17501//
17502// window-scoped (not var) so initialization is independent of script execution order
17503// within this large file. Defensive guard inside the function handles any remaining
17504// edge cases (e.g. another script setting these to null as an emergency disable).
17505//
17506// ROLLBACK: restore the original un-deduplicated block from CHANGELOG Change Set 5.
17507// ======================
17508window._lpCache   = window._lpCache   || {};
17509window._lpStagger = window._lpStagger || 0;
17510
17511function fetchLinkPreviewYT(url, element) {
17512    // Defensive init: guard against script-load-order race or emergency-disable script
17513    if (!window._lpCache)              window._lpCache   = {};
17514    if (window._lpStagger == null)     window._lpStagger = 0;
17515
17516    const getYouTubeVideoId = (u) => {
17517        let videoId = null;
17518        if (u.includes('youtube.com')) {
17519            if (u.includes('/shorts/')) {
17520                videoId = u.split('/shorts/')[1]?.split('?')[0];
17521            } else if (u.includes('v=')) {
17522                videoId = u.split('v=')[1]?.split('&')[0];
17523            }
17524        } else if (u.includes('youtu.be')) {
17525            videoId = u.split('youtu.be/')[1]?.split('?')[0];
17526        }
17527        return videoId;
17528    };
17529
17530    const videoId = getYouTubeVideoId(url);
17531
17532    if (videoId) {
17533        // YouTube: direct API call, no deduplication needed here
17534        const apiKey = 'AIzaSyAFcJE0LQXCoCuCNZg48r4uS9IZkrKy6S4';
17535        const apiUrl = `https://www.googleapis.com/youtube/v3/videos?id=${videoId}&part=snippet&key=${apiKey}`;
17536        $.getJSON(apiUrl, function(data) {
17537            if (data.items && data.items.length > 0) {
17538                const videoData = data.items[0].snippet;
17539                updateMetadataForURL(element, videoData.title, videoData.description, videoData.thumbnails.high.url, url, 'https://www.jumpspree.com/public/images/yt.png');
17540            } else {
17541                updateMetadata(element, "No video data found", "Could not retrieve metadata for this video.", "");
17542            }
17543        }).fail(function() {
17544            updateMetadata(element, "Failed to load YouTube metadata", "Could not retrieve YouTube video data.", "");
17545        });
17546        return;
17547    }
17548
17549    if (url.includes('twitter.com') || url.includes('tinyurl.com')) {
17550        updateMetadata(element, url, "", "");
17551        return;
17552    }
17553
17554    // Deduplication: same URL already requested — attach to existing deferred, no new XHR
17555    if (window._lpCache[url]) {
17556        window._lpCache[url]
17557            .done(function(data) {
17558                if (data) {
17559                    updateMetadataForURL(element, data.title || 'No title available', data.description || 'No description available', data.image || 'https://www.jumpspree.com/public/noUrlDark.png', url, data.favicon || '');
17560                } else {
17561                    var el = typeof element === 'string' ? document.querySelector(element) : null;
17562                    if (el) el.style.display = 'none';
17563                    updateMetadata(element, url, "No metadata found", "");
17564                }
17565            })
17566            .fail(function() {
17567                var el = typeof element === 'string' ? document.querySelector(element) : null;
17568                if (el) el.style.display = 'none';
17569                updateMetadata(element, url, "Failed to load metadata", "");
17570            });
17571        return;
17572    }
17573
17574    // New URL: stagger requests 200ms apart to prevent simultaneous PHP worker pile-up
17575    var delay = window._lpStagger;
17576    window._lpStagger += 200;
17577
17578    setTimeout(function() {
17579        window._lpCache[url] = $.getJSON('/fetch_link_preview.php?url=' + encodeURIComponent(url));
17580        window._lpCache[url]
17581            .done(function(data) {
17582                if (data) {
17583                    updateMetadataForURL(element, data.title || 'No title available', data.description || 'No description available', data.image || 'https://www.jumpspree.com/public/noUrlDark.png', url, data.favicon || '');
17584                } else {
17585                    var el = typeof element === 'string' ? document.querySelector(element) : null;
17586                    if (el) el.style.display = 'none';
17587                    updateMetadata(element, url, "No metadata found", "");
17588                }
17589            })
17590            .fail(function() {
17591                var el = typeof element === 'string' ? document.querySelector(element) : null;
17592                if (el) el.style.display = 'none';
17593                updateMetadata(element, url, "Failed to load metadata", "");
17594            });
17595    }, delay);
17596}
17597
17598// ======================
17599// Basic fallback preview renderer
17600// ======================
17601function updateMetadata(element, title, description, imageUrl) {
17602    const container = document.querySelector(element);
17603    if (container) {
17604        // container.style.display = 'none'; // ✅ hide for testing only
17605        container.innerHTML = `
17606            <div class="link-preview">
17607                <a data-id="on-updateMeta-data" class="postLink" href="${element}" target="_blank">
17608                    <span class="trailer-image">
17609                        <img loading="lazy" src="${imageUrl}" class="link-image" style="max-width:100%;" alt="loading" onerror="this.onerror=null;this.src='https://www.jumpspree.com/public/noUrlDark.png';" />
17610                    </span>
17611                    <span class="trailer-text ${imageUrl ? `imageAvailable` : 'imageNotAvailable'}">
17612                        <h4 class="link-title">${title}</h4>
17613                        <p class="link-description">${description}</p>
17614                    </span>
17615                </a>
17616            </div>
17617        `;
17618    }
17619}
17620
17621// ======================
17622// Main preview renderer (with favicon + title)
17623// ======================
17624function updateMetadataForURL(element, title, description, imageUrl, url, favicon = '') {
17625    const container = document.querySelector(element);
17626    if (container) {
17627        // container.style.display = 'none'; // ✅ hide from live feed
17628
17629        const faviconHTML = favicon ?
17630            `<img src="${favicon}" alt="favicon" style="width:16px;height:16px;margin-right:6px;vertical-align:middle;border-radius:3px;">` :
17631            '';
17632
17633        container.innerHTML = `
17634            <div class="link-preview">
17635                <a data-id="on-updateMeta-data-forUrl" class="postLink" href="${url}" target="_blank">
17636                    <span class="trailer-image">
17637                        <img loading="lazy" src="${imageUrl}" class="link-image" style="max-width:100%;" alt="loading" onerror="this.onerror=null;this.src='https://www.jumpspree.com/public/noUrlDark.png';" />
17638                    </span>
17639                    <span class="trailer-text ${imageUrl ? `imageAvailable` : 'imageNotAvailable'}">
17640                        <h4 style="display:none" class="link-favicon">${faviconHTML}</h4>
17641                        <h4 class="link-title"> ${title}</h4>
17642                        <p class="link-description">${description}</p>
17643                    </span>
17644                </a>
17645            </div>
17646        `;
17647
17648        // ✅ You can inspect favicon in DevTools
17649        // console.log('🧩 Preview data:', { url, title, favicon, description });
17650    }
17651}
17652
17653
17654
17655
17656
17657
17658
17659
17660$(document).ready(function() {
17661
17662
17663    $('.action-comment a').on('click', function(e) {
17664        e.preventDefault();
17665
17666        // Get data from the form fields
17667        let postmessage = $('input[type="text"]').val();
17668        let mediatype = ''; // This will hold the type of media (1 for image, 2 for video, 3 for GIF)
17669        let mediaurl = ''; // Media URL for GIF
17670
17671        let post_id = "";
17672
17673        // Fetch media type (image/video/GIF) based on user input
17674        if ($('#image-input')[0].files.length > 0) {
17675            mediatype = 1; // Image
17676        } else if ($('#video-input')[0].files.length > 0) {
17677            mediatype = 2; // Video
17678        } else if ($('#preview img').attr('src')) {
17679            mediatype = 3; // GIF
17680            mediaurl = $('#preview img').attr('src');
17681        }
17682        //console.log("click at 2588");
17683        // Check if a comment or media has been added
17684        if (!postmessage && !mediatype) {
17685            //alert("Please add some content before commenting.");
17686            return;
17687        }
17688
17689        // Create form data for media upload if necessary
17690        let formData = new FormData();
17691        formData.append('postmessage', postmessage);
17692        formData.append('mediatype', mediatype);
17693        formData.append('mediaurl', mediaurl);
17694        formData.append('post_id', post_id);
17695
17696        // Handle image or video files
17697        if (mediatype === 1) {
17698            formData.append('imageupload', $('#image-input')[0].files[0]);
17699        } else if (mediatype === 2) {
17700            formData.append('videoupload', $('#video-input')[0].files[0]);
17701        }
17702        checkAccess(function() {
17703            // AJAX call to submit the comment
17704            $.ajax({
17705                url: base_url + '/addPostComments', // Change to your actual URL
17706                type: 'POST',
17707                data: formData,
17708                processData: false,
17709                contentType: false,
17710                success: function(response) {
17711                    let result = JSON.parse(response);
17712                    if (result.status) {
17713                        window.location.reload();
17714                        //alert(result.message);
17715                        // Optionally, append the new comment to the comments section
17716                        //$('#comment-section').append(`<div class="comment">${postmessage}</div>`);
17717                    } else {
17718                        //alert(result.message);
17719                    }
17720                },
17721                error: function(xhr, status, error) {
17722                    console.error('Error:', error);
17723                }
17724            });
17725        });
17726
17727    });
17728});
17729
17730function setActiveLink(linkId) {
17731    // Remove the 'active' class from all sidebar links
17732    document.querySelectorAll('.target-link').forEach(link => {
17733        link.classList.remove('active');
17734    });
17735
17736    // Add the 'active' class to the clicked link
17737    document.getElementById(linkId).classList.add('active');
17738}
17739
17740function checkAccess(callback) {
17741    //console.log("check access is called");
17742    $.ajax({
17743        url: base_url + '/checkAccess',
17744        type: 'POST',
17745        dataType: 'json',
17746        success: function(response) {
17747            if (response.status) {
17748                // User has access, proceed with the callback
17749                if (typeof callback === 'function') {
17750                    callback(); // Proceed with the main action (like, comment, etc.)
17751                }
17752            } else {
17753                // No access, redirect to sign-in page
17754                //window.location.href = base_url + '/signin';
17755                $('#signin-new-process').fadeIn('fast');
17756                $('body').addClass('overflow-hidden');
17757            }
17758        },
17759        error: function() {
17760            //alert('Error checking access, please try again.');
17761        }
17762    });
17763}
17764</script>
17764
17765
17766
17767<script>
17768$(document).ready(function() {
17769
17770});
17771
17772function openCommentPopup(username, name, postId, currentUser, currentUserName) {
17773    // Update the comment popup with dynamic content
17774    /* document.querySelector('#comment-on-post .fnc-title h4').textContent = currentUser;
17775    document.querySelector('#comment-on-post .post-area-inside textarea').value = `@${username} `;
17776    document.querySelector('#comment-on-post .fnc-title p a').textContent = `@${username}`;
17777 */
17778    checkAccess(function() {
17779        /*  document.querySelector('#comment-on-post #user-name').textContent = currentUser; // Update the user name
17780        document.querySelector('#comment-on-post #user-handle').textContent = `@${currentUserName}`; // Update the user handle
17781        document.querySelector('#comment-on-post #reply-handle').textContent = `@${username}`; // Update the reply handle
17782        document.querySelector('#comment-on-post .post-area-inside textarea').value = `@${username} `; // Pre-fill the textarea
17783    */
17784        document.querySelector('#user-name').textContent = currentUser; // Update the user name
17785        document.querySelector('#user-handle').textContent = `@${currentUserName}`; // Update the user handle
17786        document.querySelector('#reply-handle').textContent = `@${username}`; // Update the reply handle
17787        document.querySelector('.post-area-inside textarea').value = `@${username} `; // Pre-fill the textarea
17788
17789
17790        // Set the postId in the hidden input
17791        document.querySelector('#post-id-hidden').value = postId;
17792        /*  document.querySelector('#post-id-hidden').value = postId;
17793         document.querySelector('#post-id-hidden').value = postId; */
17794
17795        // Display the popup
17796        document.getElementById('comment-on-post').style.display = 'block';
17797        document.body.classList.add('overflow-hidden');
17798    });
17799}
17800
17801$(document).ready(function() {
17802    //this function is used in FEED index page 
17803    $('#submit-comment').on('click', function(e) {
17804        e.preventDefault();
17805
17806        // Get the post data
17807        let postmessage = $('#comment-text').val();
17808        let mediatype = ''; // 1 for image, 2 for video, 3 for GIF
17809        let mediaurl = ''; // URL for GIF
17810        //let post_id = ""; // Assuming you set this in your PHP
17811        let post_id = $('#post-id-hidden').val();
17812
17813        // Check the media type
17814        if ($('#image-input')[0].files.length > 0) {
17815            mediatype = 1; // Image
17816        } else if ($('#video-input')[0].files.length > 0) {
17817            mediatype = 2; // Video
17818        } else if ($('#gif-input')[0].files.length > 0) {
17819            mediatype = 3; // GIF
17820            mediaurl = $('#gif-input')
17821                .val(); // Assuming it's an uploaded GIF, adjust if you're using a GIF URL.
17822        }
17823        // console.log("click at 2727");
17824        // Validate that either comment or media is provided
17825        if (!postmessage && !mediatype) {
17826            //alert("Please add some content before commenting.");
17827            return;
17828        }
17829
17830        // Prepare form data for AJAX request
17831        let formData = new FormData();
17832        formData.append('postmessage', postmessage);
17833        formData.append('mediatype', mediatype);
17834        formData.append('mediaurl', mediaurl);
17835        formData.append('post_id', post_id);
17836
17837        // Attach image or video files to the form data
17838        if (mediatype === 1) {
17839            formData.append('imageupload', $('#image-input')[0].files[0]);
17840        } else if (mediatype === 2) {
17841            formData.append('videoupload', $('#video-input')[0].files[0]);
17842        }
17843
17844        // Call the `checkAccess` function and proceed with the AJAX request
17845        checkAccess(function() {
17846            // AJAX request to submit the comment
17847            $.ajax({
17848                url: base_url + '/addPostComments', // Replace with your actual URL
17849                type: 'POST',
17850                data: formData,
17851                processData: false,
17852                contentType: false,
17853                success: function(response) {
17854                    let result = JSON.parse(response);
17855                    if (result.status) {
17856                        //alert(result.message);
17857
17858                        // Optionally, append the new comment to the comment section
17859                        //$('#comment-section').append(`<div class="comment">${postmessage}</div>`);
17860                        window.location.reload();
17861                        // Close the comment popup
17862                        $('#comment-on-post').css('display', 'none');
17863                        $('body').removeClass('overflow-hidden');
17864
17865                        // Increase the comment count dynamically
17866                        let commentCountElement = $(
17867                            '#comment-count'
17868                        ); // Assuming #comment-count holds the comment count on the page
17869                        let currentCount = parseInt(commentCountElement.text()) ||
17870                            0;
17871                        commentCountElement.text(currentCount + 1);
17872
17873                        // Reset the form fields after successful submission
17874                        $('#comment-text').val('');
17875                        $('#image-input').val('');
17876                        $('#video-input').val('');
17877                        $('#gif-input').val('');
17878                    } else {
17879                        //alert(result.message);
17880                    }
17881                },
17882                error: function(xhr, status, error) {
17883                    console.error('Error:', error);
17884                }
17885            });
17886        });
17887    });
17888});
17889$(document).ready(function() {
17890
17891});
17892
17893$(document).ready(function() {
17894    var currentUrl = window.location.href;
17895    var targetUrl = "https://www.jumpspree.com";
17896
17897    // Handle Shop link click
17898    $('#shoplink').click(function(e) {
17899        e.preventDefault();
17900
17901        // If the user is not on the social_new page, redirect
17902        if (currentUrl !== targetUrl) {
17903            window.location.href = targetUrl;
17904        }
17905    });
17906
17907    // Handle Social link click
17908    $('#postlink').click(function(e) {
17909        e.preventDefault();
17910
17911        // If the user is not on the social_new page, redirect
17912        if (currentUrl !== targetUrl) {
17913            window.location.href = targetUrl;
17914        }
17915    });
17916
17917    if (currentUrl !== targetUrl) {
17918        $('#postlink').removeClass('active');
17919    }
17920});
17921</script>
17921
17922
17923<script>
17924$('.plus-comment').click(function(e) {
17925    e.stopPropagation();
17926    e.preventDefault();
17927//    $('.add-image').toggle();
17928    $('.new-plus-pop ul').toggleClass('showMe')
17929    $(this).toggleClass('plus-active');
17930})
17931/*$('#send-message').click(function(){
17932    $('body').addClass('overflow-hidden');
17933    $('#sendmessage-popup').fadeIn('fast');
17934})*/
17935$('.back-btn-message a').click(function() {
17936    $('#sendmessage-popup').fadeOut('fast');
17937})
17938
17939
17940
17941function handleRepostDropdown(event, element) {
17942    // Prevent event bubbling
17943    event.stopPropagation();
17944
17945    // Check user access before toggling the dropdown
17946    checkAccess(function() {
17947        $('.drop-down-menu-share').hide();
17948        $(element).next().fadeToggle(200); // Toggle dropdown menu
17949    }, function() {
17950        //alert('You do not have access to repost.');
17951    });
17952}
17953 
17954
17955function handleRepostPopup(element, repostId) {
17956    // Check user access before opening the popup
17957    checkAccess(function() {
17958        // Prepare form data for the AJAX request
17959        let formData = new FormData();
17960        formData.append('repostId', repostId);
17961        
17962        // Get the repost button element to update UI later
17963        const repostBtnElement = element.closest('.repost-btn');
17964        const mainRepostButton = repostBtnElement.querySelector('.repost-button');
17965        const repostIcon = mainRepostButton.querySelector('.fa-arrows-repeat');
17966        const repostCountSpan = document.getElementById(`repost-count-${repostId}`);
17967        
17968        // Make the AJAX request to save the post
17969        $.ajax({
17970            url: base_url + '/createRepost', // Replace with your API endpoint
17971            type: 'POST',
17972            data: formData,
17973            processData: false,
17974            contentType: false,
17975            beforeSend: function() {
17976                // Optional: Add loading state
17977                repostIcon.classList.add('fa-spin');
17978            },
17979            success: function(response) {
17980                // Remove loading
17981                repostIcon.classList.remove('fa-spin');
17982                
17983                let result = response;
17984                if (result.status) {
17985                    showNotification('success', 'Repost successful.');
17986                      
17987                    $('#repostId').val('');
17988                    
17989                    // Update UI without page refresh
17990                    // 1. Add 'reposted' class and remove 'no-repost'
17991                    mainRepostButton.classList.add('reposted');
17992                    mainRepostButton.classList.remove('no-repost');
17993                    
17994                    // 2. Add green icon class
17995                    repostIcon.classList.add('user-reposted-post');
17996                    
17997                    // 3. Update onclick to unrepost
17998                    mainRepostButton.setAttribute('onclick', `unrepostPost('${repostId}')`);
17999                    
18000                    // 4. Update repost count
18001                    let currentCount = parseInt(repostCountSpan.textContent) || 0;
18002                    let newCount = currentCount + 1;
18003                    repostCountSpan.textContent = newCount;
18004                    
18005                    // Show the count if it was hidden
18006                    if (newCount > 0) {
18007                        repostCountSpan.style.display = 'inline';
18008                    }
18009                    
18010                    // 5. Update dropdown items
18011                    const dropdown = repostBtnElement.querySelector('.drop-down-menu-share');
18012                    if (dropdown) {
18013                        // Update first dropdown item
18014                        const firstDropdownItem = dropdown.querySelector('li:first-child a');
18015                        if (firstDropdownItem) {
18016                            firstDropdownItem.textContent = 'Undo Repost';
18017                            firstDropdownItem.setAttribute('onclick', `unrepostPost('${repostId}')`);
18018                            const dropdownIcon = firstDropdownItem.querySelector('.fa-arrows-repeat');
18019                            if (dropdownIcon) {
18020                                dropdownIcon.classList.add('user-reposted-post');
18021                            }
18022                        }
18023                        
18024                        // Update second dropdown item
18025                        const secondDropdownItem = dropdown.querySelector('li:nth-child(2) a');
18026                        if (secondDropdownItem) {
18027                            secondDropdownItem.textContent = 'Remove Quote Repost';
18028                        }
18029                    }
18030                    
18031                    // Close the popup
18032                    $('#repost-popup').fadeOut();
18033                    $('body').removeClass('overflow-hidden');
18034                    
18035                    // Optional: Show success animation
18036                    animateRepostSuccess(mainRepostButton);
18037                    // Refresh feed
18038                    getSocialFeed('3', '1', '1', '');
18039                } else {
18040                    showNotification('error', result.message ||
18041                        'An error occurred while adding the post.');
18042                }
18043            },
18044            error: function(xhr, status, error) {
18045                console.error('Error:', error);
18046                repostIcon.classList.remove('fa-spin');
18047                showNotification('error', 'Failed to add the post. Please try again.');
18048            }
18049        });
18050    }, function() {
18051        //alert('You do not have access to perform this action.');
18052    });
18053}
18054
18055// Optional: Success animation function
18056function animateRepostSuccess(element) {
18057    element.style.transform = 'scale(1.2)';
18058    setTimeout(() => {
18059        element.style.transform = 'scale(1)';
18060    }, 300);
18061    
18062    // Or use CSS animation
18063    element.classList.add('repost-success-animation');
18064    setTimeout(() => {
18065        element.classList.remove('repost-success-animation');
18066    }, 1000);
18067}
18068
18069
18070 function openRePostPopupOnPage(element) {
18071    const username = $(element).data('username');
18072    const name = $(element).data('name');
18073    const postId = $(element).data('postid');
18074    const postText = decodeURIComponent($(element).data('posttext'));
18075    const currentUser = $(element).data('currentuser');
18076    const currentUserName = $(element).data('currentusername');
18077    const postProfileImg = $(element).data('postprofile');
18078
18079    // Set repost ID
18080    $('#repostId').val(postId);
18081    
18082    // Show the social popup
18083    $('#social-popup').fadeIn();
18084    $('body').addClass('overflow-hidden');
18085    
18086    // Change title and show repost indicator
18087    $('#popup-title').text('Repost');
18088    $('#repost-indicator').show();
18089    
18090    // Get the full HTML content from the source div
18091    const fullHtmlContent = $(`#contentDivID-${postId}`).html();
18092    
18093    // Set the repost preview
18094    $('#repost-preview-container').show();
18095    $('#currentpostprofile').attr('src', postProfileImg);
18096    $('.postUser').text(name);
18097    $('.postUserName').text('@' + username);
18098    $('#repost-preview-content').html(fullHtmlContent);
18099    
18100    // Clear any existing content in the main textarea
18101    $('#addPostTextarea').html('');
18102    
18103    // Clear media previews if any
18104    clearMediaPreviews();
18105    
18106    // Focus on the textarea
18107    setTimeout(() => {
18108        $('#addPostTextarea').focus();
18109    }, 100);
18110}
18111
18112function clearRepost() {
18113    // Reset all repost-related elements
18114    $('#repostId').val('');
18115    $('#popup-title').text('Create Post');
18116    $('#repost-indicator').hide();
18117    $('#repost-preview-container').hide();
18118    $('#addPostTextarea').html('');
18119    $('.postUser').text('');
18120    $('.postUserName').text('');
18121    $('#repost-preview-content').html('');
18122    $('#currentpostprofile').attr('src', '');
18123    
18124    // Clear media previews
18125    clearMediaPreviews();
18126}
18127
18128function clearMediaPreviews() {
18129    $('#imagePreviewBox').hide();
18130    $('#videoPreviewBox').hide();
18131    $('#gifPreviewBox').hide();
18132    $('#imageCarousel .swiper-wrapper').empty();
18133    $('#videoPreview').attr('src', '');
18134    $('#gifPreviewAddPost').attr('src', '');
18135}
18136
18137// Update your handleDiscardAction function to handle reposts
18138/* function handleDiscardAction() {
18139    if ($('#repostId').val()) {
18140        // If reposting, ask for confirmation
18141        if (confirm('Discard repost?')) {
18142            clearRepost();
18143            $('#social-popup').fadeOut();
18144            $('body').removeClass('overflow-hidden');
18145        }
18146    } else {
18147        // Original discard logic
18148        $('#social-popup').fadeOut();
18149        $('body').removeClass('overflow-hidden');
18150    }
18151} */
18152 
18153
18154// Add this to clear repost state when opening drafts
18155$('.draft a').on('click', function() {
18156    clearRepost();
18157});
18158
18159// Add this to clear repost state when switching to poll
18160$('.create-poll').on('click', function() {
18161    clearRepost();
18162});
18163
18164// Helper function to clear media previews
18165function clearMediaPreviews() {
18166    $('#imagePreviewBox').hide();
18167    $('#videoPreviewBox').hide();
18168    $('#gifPreviewBox').hide();
18169    $('#imageCarousel .swiper-wrapper').empty();
18170    $('#videoPreview').attr('src', '');
18171    $('#gifPreviewAddPost').attr('src', '');
18172}
18173
18174// Helper function to reset form for repost
18175function resetFormForRepost() {
18176    // Reset post settings
18177    $('#commentsOff').prop('checked', false);
18178    $('#hideLike').prop('checked', false);
18179    
18180    // Reset schedule
18181    $('#scheduletime').val('');
18182    $('#scheduledate').val('');
18183    $('#scheduled').val('0');
18184    $('#scheduledone').hide();
18185    
18186    // Enable submit button
18187    $('#addPost-form-submit').removeClass('disabled');
18188    $('#addPost-form-submit').prop('disabled', false);
18189    
18190    // Reset character count
18191    updateCharacterCount();
18192}
18193 
18194
18195
18196/* function copyContentToPopup(postId) {
18197    // Get the contentDivID dynamically based on the postId
18198    const contentDiv = $(`#contentDivID-${postId}`);
18199    
18200    // Extract the post text (inside .post-text)
18201    const postText = contentDiv.find('.post-text').html();
18202    
18203    // Extract the image URL (inside .blog-main-image img)
18204    const postImage = contentDiv.find('.blog-main-image img').attr('src');
18205    
18206    // Update the popup post text
18207    $('#repost-popup .post-data p').html(postText);
18208
18209    // Update the popup image if available
18210    if (postImage) {
18211        $('#repost-popup .post-for-repost .postprofile').attr('src', postImage);
18212    }
18213
18214    // Display the popup
18215    $('#repost-popup').fadeIn();
18216    $('body').addClass('overflow-hidden');
18217} */
18218
18219const API_KEY = 'uGguGjuTdE4Zqe3SFEah6hTQHb3E4mkG'; // Replace with your Giphy API key
18220// Elements
18221// Elements
18222const gifTrigger = document.getElementById('gif-trigger-for-repost');
18223const gifModal = document.getElementById('gifModal');
18224const gifSearchInput = document.getElementById('gifSearch');
18225const gifSearchBtn = document.getElementById('gifSearchBtn');
18226const gifResults = document.getElementById('gifResults');
18227const previewGifs = document.getElementById('previewGifs');
18228const textarea = document.getElementById('repostTextarea');
18229
18230
18231// Handle GIF search on typing in the input field
18232if (gifSearchInput) gifSearchInput.addEventListener('keyup', function(e) {
18233    const query = gifSearchInput.value.trim();
18234    if (query) fetchGifs(query);
18235});
18236
18237
18238
18239// Show/Hide GIF Modal
18240if (gifTrigger) gifTrigger.addEventListener('click', function(e) {
18241    e.preventDefault();
18242    gifModal.style.display = 'block'; // Always show the modal when triggered
18243    fetchTrendingGifs(); // Fetch trending GIFs on modal open
18244
18245    setTimeout(function() {
18246        $('.gif-modal').append('<span class="close-x">&times;</span>');
18247        $('.gif-modal span.close-x').click(function() {
18248            $('.gif-modal').hide();
18249        })
18250    }, 1000)
18251});
18252
18253// Fetch GIFs from Giphy API
18254function fetchGifs(query) {
18255    const url = `https://api.giphy.com/v1/gifs/search?api_key=${API_KEY}&q=${query}&limit=20&offset=0&rating=g&lang=en`;
18256    fetch(url)
18257        .then(response => response.json())
18258        .then(data => {
18259            displayGifs(data.data);
18260        })
18261        .catch(error => {
18262            console.error('Error fetching GIFs:', error);
18263        });
18264
18265
18266}
18267
18268// Fetch Trending GIFs from Giphy API
18269function fetchTrendingGifs() {
18270    const url = `https://api.giphy.com/v1/gifs/trending?api_key=${API_KEY}&limit=20&rating=g`;
18271    fetch(url)
18272        .then(response => response.json())
18273        .then(data => {
18274            displayGifs(data.data);
18275        })
18276        .catch(error => {
18277            console.error('Error fetching trending GIFs:', error);
18278        });
18279}
18280
18281// Display GIFs in the results container
18282function displayGifs(gifs) {
18283    gifResults.innerHTML = ''; // Clear previous results
18284    gifs.forEach(gif => {
18285        const img = document.createElement('img');
18286        img.src = gif.images.original.url; // Use fixed-width image
18287        img.alt = gif.title;
18288        img.addEventListener('click', () => selectGifForRepost(gif.images.original.url));
18289        gifResults.appendChild(img);
18290    });
18291}
18292
18293// Select a GIF and display it in the preview area
18294function selectGifForRepost(url) {
18295    $('div#previewGifs').show();
18296    previewGifs.innerHTML = `<img src="${url}" alt="Selected GIF">`;
18297    textarea.value += `\n[GIF: ${url}]`; // Optional: Add GIF URL to textarea
18298
18299    // Ensure the modal is closed
18300    gifModal.style.display = 'none';
18301
18302    // Add a log for debugging
18303    //console.log('GIF selected, modal closed.');
18304    $('#imageCarousel').empty().removeClass('owl-carousel owl-theme').trigger('destroy.owl.carousel');
18305    $('#imagePreviewBox').hide();
18306
18307    // Clear video
18308    const videoElement = $('#videoPreview')[0];
18309    $('#videoSource').attr('src', '');
18310
18311
18312    setTimeout(function() {
18313        $('div#previewGifs').append('<span class="close-x">&times;</span>');
18314        $('div#previewGifs span.close-x').click(function() {
18315            $('div#previewGifs').hide();
18316        })
18317    }, 1000)
18318}
18319
18320
18321//ADD POST CODE GIF
18322
18323document.addEventListener('DOMContentLoaded', function() {
18324
18325// Elements for Add Post
18326const gifTriggerForAddPost = document.getElementById('gif-trigger-for-addpost');
18327const gifModalForAddPost = document.getElementById('gifModalForAddPost');
18328const gifSearchInputForAddPost = document.getElementById('gifSearchForAddPost');
18329const gifSearchBtnForAddPost = document.getElementById('gifSearchBtnForAddPost');
18330const gifResultsForAddPost = document.getElementById('gifResultsForAddPost');
18331const previewGifsForAddPost = document.getElementById('previewGifsForAddPost');
18332const textareaForAddPost = document.getElementById('addPostTextarea');
18333
18334if (!gifTriggerForAddPost) return;
18335
18336// Show/Hide GIF Modal for Add Post
18337gifTriggerForAddPost.addEventListener('click', function(e) {
18338console.log("gif trigger for add post clicked");
18339    e.preventDefault();
18340    gifModalForAddPost.style.display = 'block'; // Always show the modal when triggered
18341    fetchTrendingGifsForAddPost(); // Fetch trending GIFs on modal open
18342
18343    setTimeout(function() {
18344        $('.gif-modal').append('<span class="close-x">&times;</span>');
18345        $('.gif-modal span.close-x').click(function() {
18346            $('.gif-modal').hide();
18347        });
18348    }, 1000);
18349});
18350});
18351
18352function openGifModalForAddPost() {
18353    gifModalForAddPost.style.display = 'block'; // Show the modal
18354    fetchTrendingGifsForAddPost(); // Fetch trending GIFs on modal open
18355
18356    setTimeout(function() {
18357        $('.gif-modal').append('<span class="close-x">&times;</span>');
18358        $('.gif-modal span.close-x').click(function() {
18359            $('.gif-modal').hide();
18360        });
18361    }, 1000);
18362}
18363
18364// Fetch GIFs from Giphy API for Add Post (search function)
18365function fetchGifsForAddPost(query) {
18366    const url = `https://api.giphy.com/v1/gifs/search?api_key=${API_KEY}&q=${query}&limit=20&offset=0&rating=g&lang=en`;
18367    fetch(url)
18368        .then(response => response.json())
18369        .then(data => {
18370            displayGifsForAddPost(data.data);
18371        })
18372        .catch(error => {
18373            console.error('Error fetching GIFs:', error);
18374        });
18375}
18376
18377// Fetch Trending GIFs from Giphy API for Add Post
18378function fetchTrendingGifsForAddPost() {
18379    const url = `https://api.giphy.com/v1/gifs/trending?api_key=${API_KEY}&limit=20&rating=g`;
18380    fetch(url)
18381        .then(response => response.json())
18382        .then(data => {
18383            displayGifsForAddPost(data.data);
18384        })
18385        .catch(error => {
18386            console.error('Error fetching trending GIFs:', error);
18387        });
18388}
18389
18390// Display GIFs in the results container for Add Post
18391function displayGifsForAddPost(gifs) {
18392    gifResultsForAddPost.innerHTML = ''; // Clear previous results
18393    gifs.forEach(gif => {
18394        const img = document.createElement('img');
18395        img.src = gif.images.original.url; // Use fixed-width image
18396        img.alt = gif.title;
18397        img.addEventListener('click', () => selectGifForAddPost(gif.images.original.url));
18398        gifResultsForAddPost.appendChild(img);
18399    });
18400}
18401// Select a GIF and display it in the preview area for Add Post
18402function selectGifForAddPost(url) {
18403    clearPreviews();
18404    clearAllImageSources();
18405    $('#videoSource').attr('src', '');
18406    $('#videoPreviewBox').hide();
18407
18408    // Show the GIF preview box
18409    $('div#gifPreviewBox').show();
18410    const gifPreviewAddPost = document.getElementById('gifPreviewAddPost');
18411
18412    // Set the GIF source
18413    gifPreviewAddPost.src = url;
18414
18415    // Ensure the modal is closed
18416    const gifModalForAddPost = document.getElementById('gifModalForAddPost');
18417    if (gifModalForAddPost) {
18418        gifModalForAddPost.style.display = 'none';
18419    }
18420
18421    // Add a close button dynamically
18422    setTimeout(function() {
18423        if (!$('div#gifPreviewBox .close-x').length) { // Avoid duplicate close buttons
18424            //$('div#gifPreviewBox').append('<span class="close-x">&times;</span>');
18425        }
18426        // Add click handler for the close button
18427        $('div#gifPreviewBox span.close-x').click(function() {
18428            $('div#gifPreviewBox').hide();
18429            gifPreviewAddPost.src = ''; // Clear the GIF preview
18430        });
18431    }, 1000);
18432    // Reset image and video in whole we have to define twise LN 581 riaz
18433    $('#imagePreviewBox').hide();
18434    $('#imagePreview').attr('src', '');
18435
18436
18437    // Check if any content exists to keep the button active
18438    // const postText = $('#addPostTextarea').val().trim();
18439    const postText = $('#addPostTextarea').text().trim();
18440    const hasImage = $('#imageInput-repost')[0]?.files.length > 0;
18441    const hasVideo = $('#videoSource').attr('src')?.trim() !== '';
18442    const hasGif = $('#gifPreviewBox').is(':visible') && $('#gifPreviewAddPost').attr('src')?.trim() !== '';
18443
18444    const shouldEnable = postText.length > 0 || hasImage || hasVideo || hasGif;
18445
18446    if (shouldEnable) {
18447        $('.addPost-form-submit').removeClass('disabled').addClass('active');
18448    } else {
18449        $('.addPost-form-submit').removeClass('active').addClass('disabled');
18450    }
18451
18452
18453    // clear image and video SRC 
18454    // for image
18455    closePreview();
18456    //for video
18457    const videoElement = $('#videoPreview')[0];
18458    $('#videoSource').attr('src', '');
18459    if (videoElement) {
18460        videoElement.pause();
18461        videoElement.load();
18462    }
18463}
18464
18465
18466
18467// Handle Search Button Click for searching GIFs in Add Post
18468gifSearchBtnForAddPost.addEventListener('click', function(e) {
18469    e.preventDefault(); // Prevent default button action
18470    const query = gifSearchInputForAddPost.value.trim();
18471    if (query) fetchGifsForAddPost(query);
18472});
18473
18474
18475var debounceTimeout;
18476
18477var gifSearchInputForAddPost = document.getElementById('gifSearchForAddPost');
18478if (gifSearchInputForAddPost) gifSearchInputForAddPost.addEventListener('keyup', function(e) {
18479    clearTimeout(debounceTimeout); // Clear the previous timeout
18480    const query = gifSearchInputForAddPost.value.trim();
18481    if (query) {
18482        debounceTimeout = setTimeout(() => {
18483            fetchGifsForAddPost(query);
18484        }, 300); // Adjust the delay as needed
18485    }
18486});
18487
18488
18489
18490// Optional: Close modal when clicking outside in Add Post
18491window.onclick = function(event) {
18492    if (event.target === gifModalForAddPost) {
18493        gifModalForAddPost.style.display = 'none';
18494    }
18495}
18496
18497
18498
18499
18500function showNotification(type, message) {
18501
18502    $('#message-notification-text').text('')
18503
18504    iconurl = base_url + '/public/images/' + type + '-icon.png';
18505    $('#message-notification-image').attr('src', iconurl)
18506    $('#message-notification-text').text(message)
18507    $('#message-notification').addClass('show-notification')
18508    if (type == 'error') {
18509        // shakeForm('message-notification')
18510    }
18511
18512    setTimeout(() => {
18513        $('#message-notification').removeClass('show-notification')
18514    }, 3000);
18515}
18516
18517function showNotificationWithLink(type, message, link = '', duration = 3000) {
18518    const iconurl = base_url + '/public/images/' + type + '-icon.png';
18519    $('#message-notification-image').attr('src', iconurl);
18520
18521    let finalMessage = message;
18522    if (link) {
18523        finalMessage +=
18524            ` <a href="${link}" target="_blank" style="color:#00aaff;text-decoration:underline;">View here</a>`;
18525    }
18526
18527    $('#message-notification-text').html(finalMessage);
18528    $('#message-notification').addClass('show-notification');
18529
18530    setTimeout(() => {
18531        $('#message-notification').removeClass('show-notification');
18532    }, duration);
18533}
18534
18535
18536
18537/* 
18538 $('#repost-form-submit').on('click', function (e) {
18539    e.preventDefault();
18540    console.log("click at 3192");
18541
18542    // Collect post data from the popup
18543    let postText = $('#re-post-textarea').val();
18544    let repostId = $('#repostId').val();
18545    let mediatype = 0; // Default to 0, meaning no media
18546    let mediaUrl = ''; // URL for GIF or other media
18547
18548    // Check for media files (image or video)
18549    if ($('#imageInput-repost')[0].files.length > 0) {
18550        mediatype = 1; // Image
18551    } else if ($('#videoInput-repost')[0].files.length > 0) {
18552        mediatype = 2; // Video
18553    }
18554    // Check for GIF
18555    else if ($('#previewGifs').find('img').length > 0) {
18556        mediatype = 3; // GIF
18557        mediaUrl = $('#previewGifs img').attr('src'); // Extract the selected GIF URL
18558    }
18559
18560    // Validate that post text or media is provided
18561    if (!postText && mediatype === 0) {
18562        showNotification('error', 'Please add some content before posting.');
18563        return;
18564    }
18565
18566    // Prepare form data for the AJAX request
18567    let formData = new FormData();
18568    formData.append('postText', postText);
18569    formData.append('media_type', mediatype);
18570    formData.append('media_url', mediaUrl);
18571    formData.append('repostId', repostId);
18572    formData.append('duration', 0);
18573
18574    // Handle image or video files
18575    if (mediatype === 1) {
18576        formData.append('repost-image', $('#imageInput-repost')[0].files[0]);
18577    } else if (mediatype === 2) {
18578        formData.append('repost-video', $('#videoInput-repost')[0].files[0]);
18579    }
18580
18581    // Make the AJAX request to save the post
18582    $.ajax({
18583        url: base_url + '/addPost', // this will save data in RE-Post
18584        type: 'POST',
18585        data: formData,
18586        processData: false,
18587        contentType: false,
18588        success: function (response) {
18589            let result = JSON.parse(response);
18590            if (result.status) {
18591                showNotification('success', 'Post added successfully!');
18592                 
18593                // Optionally, reset the popup form
18594                $('#re-post-textarea').val('');
18595                $('#imageInput-repost').val('');
18596                $('#videoInput-repost').val('');
18597                $('#repostId').val('');
18598                $('#previewGifs').empty();
18599
18600                // Close the popup
18601                $('#repost-popup').fadeOut();
18602                $('body').removeClass('overflow-hidden');
18603                 
18604                getSocialFeed('3','1','1', '');
18605            } else {
18606                showNotification('error', result.message || 'An error occurred while adding the post.');
18607            }
18608        },
18609        error: function (xhr, status, error) {
18610            console.error('Error:', error);
18611            showNotification('error', 'Failed to add the post. Please try again.');
18612        }
18613    });
18614}); */
18615
18616//30 jan for repost button 
18617
18618function handleAddRePost(isDraft = 0) {
18619    // Fetch scheduled data
18620    let scheduled = $('#scheduled').val();
18621    let scheduledate = $('#scheduledate').val();
18622    let scheduletime = $('#scheduletime').val();
18623
18624    // Fetch post text
18625    let postText = $('#re-post-textarea').val();
18626
18627    // Initialize media type and variables
18628    let mediatype = 0;
18629    let alreadyAsMedia = false;
18630    let mediaUrl = '';
18631    let imagesData = [];
18632
18633
18634    // Get the state of the checkboxes
18635    let commentsOff = $('#post-setting-box input[type="checkbox"]:eq(0)').is(':checked') ? 1 : 0;
18636    let hideLike = $('#post-setting-box input[type="checkbox"]:eq(1)').is(':checked') ? 1 : 0;
18637
18638
18639
18640
18641    let formData = new FormData();
18642
18643    // Detect media type
18644    if ($('#imageInput-repost')[0].files.length > 0) {
18645        mediatype = 1; // Image post
18646    } else if ($('#videoInput-repost')[0].files.length > 0) {
18647        mediatype = 2; // Video post
18648    } else if ($('#gifPreviewBox').is(':visible')) {
18649        mediatype = 3; // GIF post
18650        mediaUrl = $('#gifPreviewAddPost').attr('src'); // Get GIF URL
18651    }
18652
18653    // Prevent posting if no content is provided
18654    if (!postText && mediatype === 0) {
18655        //console.log('Please add some content before posting.');
18656        showNotification('error', 'Please add some content before posting.');
18657        return;
18658    }
18659
18660    // Handle images (from carousel or directly uploaded)
18661    $('#imageCarousel .item').each(function(index) {
18662        let embeddedLink = $(this).find('img').attr('data-embeded-link') || '';
18663        let embeddedText = $(this).find('img').attr('data-alt') || '';
18664        let imageFile = $('#imageInput-repost')[0].files[index] || null;
18665
18666        imagesData.push({
18667            embeddedLink: embeddedLink,
18668            embeddedText: embeddedText,
18669            fileName: imageFile ? imageFile.name : ''
18670        });
18671    });
18672
18673    // Append image files and metadata to formData
18674    if (mediatype === 1) {
18675        const files = $('#imageInput-repost')[0].files;
18676        Array.from(files).forEach((file, index) => {
18677            formData.append('repost-images[]', file);
18678            formData.append('repost-embeddedLink[]', imagesData[index]?.embeddedLink || '');
18679            formData.append('repost-altText[]', imagesData[index]?.embeddedText || '');
18680        });
18681    }
18682
18683    // Append video file (if uploaded)
18684    if (mediatype === 2 && $('#videoInput-repost')[0].files.length > 0) {
18685        formData.append('repost-video', $('#videoInput-repost')[0].files[0]);
18686    }
18687
18688    // Append existing video URL (if any)
18689    if ($('#videoSource').length > 0 && $('#videoSource').attr('src')) {
18690        alreadyAsMedia = true;
18691        mediatype = 2;
18692        const videoUrl = $('#videoSource').attr('src');
18693        formData.append('repost-video', videoUrl);
18694    }
18695
18696    // Handle GIF (if selected)
18697    if (mediatype === 3 && mediaUrl) {
18698        alreadyAsMedia = true;
18699        formData.append('media_url', mediaUrl);
18700    }
18701
18702    // Append scheduling data
18703    formData.append('scheduled', scheduled);
18704    formData.append('scheduledate', scheduledate);
18705    formData.append('scheduletime', scheduletime);
18706
18707    // Append post content and other metadata
18708    formData.append('alreadyAsMedia', alreadyAsMedia);
18709    formData.append('postText', postText);
18710    formData.append('media_type', mediatype);
18711    formData.append('media_url', mediaUrl);
18712    formData.append('duration', 0);
18713    formData.append('is_draft', isDraft);
18714
18715
18716    // Append the checkbox data
18717    formData.append('IsCommentBlocked', commentsOff);
18718    formData.append('hideLike', hideLike);
18719
18720    // AJAX request to add post
18721    $.ajax({
18722        url: base_url + '/addPost', // API endpoint
18723        type: 'POST',
18724        data: formData,
18725        processData: false,
18726        contentType: false,
18727        beforeSend: function() {
18728            let originalText = $('#addPost-form-submit').text();
18729            $('#addPost-form-submit')
18730                .prop('disabled', true)
18731                .data('original-text', originalText)
18732                .html('<span class="jloader"></span>');
18733
18734        },
18735        success: function(response) {
18736
18737            // console.log("success reponse comes......");
18738            $('#addPost-form-submit')
18739                .prop('disabled', false)
18740                .html($('#addPost-form-submit').data('original-text'));
18741
18742
18743            let result = JSON.parse(response);
18744            if (result.status) {
18745                let message = isDraft ? 'Draft Saved' : 'Post sent successfully.';
18746                showNotification('success', message);
18747
18748                // Reset form and close modal
18749                resetRepostForm();
18750                isNewPost = true;
18751                //$('#addPostTextarea').val('');
18752                $('#addPostTextarea').text('');
18753                $('#imageInput-repost').val('');
18754                $('#videoInput-repost').val('');
18755                $('#previewGifsForAddPost').empty();
18756                $('#repost-popup').fadeOut();
18757                $('body').removeClass('overflow-hidden');
18758                $('#post-setting-box input[type="checkbox"]').prop('checked', false);
18759                // Refresh feed
18760                console.log("refersh feed called....");
18761                getSocialFeed('3', '1', '1', '');
18762            } else {
18763                showNotification(result.message || 'An error occurred while processing the request.');
18764            }
18765        },
18766        error: function(xhr, status, error) {
18767            console.error('Error:', error);
18768            showNotification('Failed to process the request. Please try again.');
18769        }
18770    });
18771}
18772
18773
18774
18775// Error Handling Functions
18776function setError(element, message) {
18777    clearError(element);
18778    const errorElement = document.createElement("div");
18779    errorElement.className = "error-message";
18780    errorElement.style.color = "red";
18781    errorElement.innerText = message;
18782    element.insertAdjacentElement("afterend", errorElement);
18783}
18784
18785function clearError(element) {
18786    if (
18787        element.nextSibling &&
18788        element.nextSibling.nodeType === 1 && // Ensure it's an element node
18789        element.nextSibling.classList.contains("error-message")
18790    ) {
18791        element.nextSibling.remove();
18792    }
18793}
18794// Select elements
18795/* const imageInput = document.getElementById('repost-image');
18796const videoInput = document.getElementById('repost-video'); */
18797
18798const imageInput = document.querySelector('#imageInput-repost');
18799const videoInput = document.querySelector('.videoInput-repost');
18800
18801const previewBox = document.getElementById('preview-repost-image');
18802
18803
18804
18805// Function to handle file preview with close button
18806function previewFile(file, type) {
18807    // Clear any existing content in the preview box
18808    previewBox.innerHTML = '';
18809
18810    // Create a wrapper for the preview and close button
18811    const wrapper = document.createElement('div');
18812    wrapper.style.position = 'relative';
18813    wrapper.style.display = 'inline-block';
18814
18815    // Create an element based on file type
18816    let mediaElement;
18817    if (type === 'image') {
18818        mediaElement = document.createElement('img');
18819        mediaElement.src = URL.createObjectURL(file);
18820        mediaElement.alt = 'Selected Image';
18821        mediaElement.style.maxWidth = '100%';
18822        mediaElement.style.maxHeight = '200px';
18823    } else if (type === 'video') {
18824        mediaElement = document.createElement('video');
18825        mediaElement.src = URL.createObjectURL(file);
18826        mediaElement.controls = true;
18827        mediaElement.style.maxWidth = '100%';
18828        mediaElement.style.maxHeight = '200px';
18829    }
18830
18831    // Add the media element to the wrapper
18832    wrapper.appendChild(mediaElement);
18833
18834    // Create the close button
18835    const closeButton = document.createElement('span');
18836    closeButton.innerHTML = '&times;';
18837    closeButton.style.position = 'absolute';
18838    closeButton.style.top = '5px';
18839    closeButton.style.right = '5px';
18840    closeButton.style.backgroundColor = 'red';
18841    closeButton.style.color = 'white';
18842    closeButton.style.padding = '5px';
18843    closeButton.style.cursor = 'pointer';
18844    closeButton.style.borderRadius = '50%';
18845    closeButton.style.fontSize = '16px';
18846    closeButton.style.lineHeight = '1';
18847
18848    // Add event listener to the close button
18849    closeButton.addEventListener('click', () => {
18850        previewBox.innerHTML = ''; // Clear the preview box
18851        imageInput.value = ''; // Reset the image input
18852        videoInput.value = ''; // Reset the video input
18853    });
18854
18855    // Add the close button to the wrapper
18856    wrapper.appendChild(closeButton);
18857
18858    // Append the wrapper to the preview box
18859    previewBox.appendChild(wrapper);
18860}
18861
18862// Event listener for image input
18863/* imageInput.addEventListener('change', function () {
18864    const file = this.files[0];
18865    if (file) {
18866        previewFile(file, 'image');
18867    }
18868});
18869
18870// Event listener for video input
18871videoInput.addEventListener('change', function () {
18872    const file = this.files[0];
18873    if (file) {
18874        previewFile(file, 'video');
18875    }
18876}); */
18877
18878/* 
18879document.getElementById('re-post-textarea').addEventListener('input', function () {
18880    const buttonContainer = document.getElementById('repost-form-submit');
18881     if (this.value.trim() !== '') {
18882        buttonContainer.classList.add('active'); // Add your desired class
18883    } else {
18884        buttonContainer.classList.remove('active'); // Remove the class when empty
18885    }  
18886});
18887 */
18888//repost image and vdo preview logic 
18889
18890$('#imageInput-repost').on('change', function(event) {
18891    const files = event.target.files; // Get selected files
18892    const imageCarousel = $('#imageCarousel-repost'); // Carousel container
18893    const previewBox = $('#imagePreviewBox-repost'); // Preview box
18894
18895    $('#videoSource-repost').attr('src', '');
18896    $('#videoPreviewBox-repost').hide();
18897
18898
18899    // Clear existing content and reset carousel
18900    imageCarousel.trigger('destroy.owl.carousel'); // Destroy Owl Carousel if initialized
18901    imageCarousel.empty(); // Remove all child elements from the carousel
18902    previewBox.hide(); // Hide the preview box
18903
18904    $('#gifPreviewBox').hide();
18905    $('#gifPreviewAddPost').attr('src', '');
18906
18907
18908    if (files.length > 0) {
18909        // Loop through files and create image elements
18910        Array.from(files).forEach((file, index) => {
18911            const reader = new FileReader();
18912            reader.onload = function(e) {
18913                /* const imageItem = `
18914                    <div class="item" data-index="${index}">
18915                        <img class="multi-image-wrapper" src="${e.target.result}" alt="Uploaded Image" style="width: 100%; height: auto;" />
18916                    </div>`; */
18917
18918                const imageItem = `
18919                        <div id="image-preview-${index}" class="item" data-index="${index}">
18920                            <img id="preview-img-${index}" class="multi-image-wrapper" src="${e.target.result}" alt="Uploaded Image" style="width: 100%; height: auto;" 
18921                                data-embeded-link="" data-alt="Jumpspree" />
18922                            <div class="embed-and-alt d-flex mt-3">
18923                                <div class="embed-link">
18924                                    <a href="javascript:void(0)" onclick="openEmbedLinkPopup(event, ${index})">
18925                                        <i class="hgi hgi-stroke hgi-link-05"></i>
18926                                    </a>
18927                                </div>
18928                                <div class="add-alt-text">
18929                                    <a href="javascript:void(0)" onclick="openAltTextPopup(event, ${index})">
18930                                        <span class="alt-icon">Alt</span>
18931                                    </a>
18932                                </div>
18933                            </div>
18934                        </div>`;
18935
18936
18937                imageCarousel.append(imageItem);
18938            };
18939            reader.readAsDataURL(file);
18940        });
18941
18942        // Reinitialize Owl Carousel for multiple images
18943        setTimeout(() => {
18944            if (files.length > 1) {
18945                imageCarousel.addClass('owl-carousel owl-theme'); // Ensure carousel class is applied
18946                imageCarousel.owlCarousel({
18947                    loop: false,
18948                    margin: 10,
18949                    nav: false,
18950                    dots: true,
18951                    autoplay: false,
18952                    responsive: {
18953                        0: {
18954                            items: 1,
18955                            loop: false
18956                        },
18957                        600: {
18958                            items: 1,
18959                            loop: false
18960                        },
18961                        1000: {
18962                            items: 1,
18963                            loop: false
18964                        },
18965                    },
18966                });
18967            } else {
18968                // Remove carousel styling for a single image
18969                $('.addpostImagePreview').removeClass('owl-carousel owl-theme');
18970                $('#imagePreviewBox-repost').addClass('single-image-preview');
18971                imageCarousel.removeClass('owl-carousel owl-theme');
18972                const element = document.querySelector('.multi-image-wrapper');
18973                if (element) { // Ensure the element exists to avoid errors
18974                    element.classList.remove('multi-image-wrapper');
18975                }
18976
18977            }
18978
18979            previewBox.show(); // Show the preview box
18980        }, 500);
18981    }
18982});
18983
18984
18985$('#re-post-textarea').on('input', function() {
18986    let maxChars = 260;
18987    const isVerified = null;
18988    if (isVerified != 0 || isVerified != '0') {
18989        maxChars = 880;
18990    }
18991
18992    const circleRadius = 22; // Match the radius in the SVG
18993    const circleCircumference = 2 * Math.PI * circleRadius;
18994
18995    const buttonContainer = $('#repost-form-submit');
18996    const progressCircle = $('#progress-circle');
18997    //const postText = this.value.trim(); // Get the trimmed value of the textarea
18998    const postText = this.innerText.trim();
18999
19000    const currentLength = postText.length;
19001
19002    // Calculate remaining characters
19003    const remainingChars = maxChars - currentLength;
19004
19005    // Update the character count display (with minus counter logic)
19006    const charCountDisplay = $('#char-count-repost');
19007    charCountDisplay.text(remainingChars); // Show remaining characters
19008    if (remainingChars < 0) {
19009        charCountDisplay.css('color', 'red'); // Negative count in red
19010    } else {
19011        charCountDisplay.css('color', ''); // Default color
19012    }
19013
19014    // Update the progress circle
19015    const percentage = Math.min(currentLength / maxChars, 1); // Limit to 100%
19016    const offset = circleCircumference * (1 - percentage); // Calculate stroke-dashoffset
19017    progressCircle.css('stroke-dasharray', `${circleCircumference}`); // Set total circle length
19018    progressCircle.css('stroke-dashoffset', offset); // Set the progress based on percentage
19019
19020    // Enable or disable the Post button based on text length
19021    if (currentLength > 0 && currentLength <= maxChars) {
19022        buttonContainer.prop('disabled', false) // Enable the button
19023            .removeClass('disabled')
19024            .addClass('blue-bg active');
19025    } else {
19026        buttonContainer.prop('disabled', true) // Disable the button
19027            .removeClass('active blue-bg')
19028            .addClass('disabled');
19029    }
19030
19031    // Prevent typing beyond max characters
19032    /* if (currentLength > maxChars) {
19033        this.value = postText.substring(0, maxChars); // Truncate excess characters
19034    } */
19035});
19036
19037
19038
19039function resetRepostForm(clearPreviewBox=true) {
19040    // Reset text input and file inputs
19041    // $('#addPostTextarea').val('');
19042    $('#addPostTextarea').text('');
19043    $('#imageInput').val('');
19044    $('#videoInput').val('');
19045
19046    // Reset preview boxes
19047    $('#previewGifsForAddPost').empty(); // Clear GIF previews
19048    if(clearPreviewBox){
19049        $('#imageCarousel').empty(); // Clear image carousel
19050        $('#imagePreviewBox').empty(); // Clear single image preview
19051    }
19052
19053    // Hide preview boxes
19054    $('#gifPreviewBox').hide();
19055    $('#imagePreviewBox').hide();
19056    $('#videoPreviewBox').hide();
19057
19058    // Reset form inputs for scheduled posts
19059    $('#scheduled').val('');
19060    $('#scheduledate').val('');
19061    $('#scheduletime').val('');
19062
19063    // Re-initialize dynamic elements (if any)
19064    if ($('.addpostImagePreview').hasClass('owl-carousel')) {
19065        $('.addpostImagePreview').trigger('destroy.owl.carousel'); // Destroy existing carousel
19066        $('.addpostImagePreview').owlCarousel({ // Re-initialize carousel
19067            loop: false,
19068            margin: 10,
19069            nav: false,
19070            dots: true,
19071            autoplay: false,
19072            responsive: {
19073                0: {
19074                    items: 1
19075                },
19076                600: {
19077                    items: 1
19078                },
19079                1000: {
19080                    items: 1
19081                },
19082            },
19083        });
19084        $('.owl-carousel').owlCarousel({
19085            loop: false,
19086            margin: 10,
19087            nav: false,
19088            dots: true,
19089            autoplay: false,
19090            responsive: {
19091                0: {
19092                    items: 1
19093                },
19094                600: {
19095                    items: 1
19096                },
19097                1000: {
19098                    items: 1
19099                },
19100            },
19101        });
19102    }
19103    $('.social-popup').fadeOut('fast');
19104    $('#post-setting-box input[type="checkbox"]').prop('checked', false);
19105    // Re-bind event listeners (if necessary)
19106    bindPostEventListeners();
19107}
19108
19109// Example: Bind event listeners
19110function bindPostEventListeners() {
19111    // Example of re-attaching click events to dynamically created buttons
19112    $('.delete-preview-btn').off('click').on('click', function() {
19113        $(this).closest('.preview-item').remove();
19114    });
19115
19116    // Any other event listeners that need to be re-bound
19117}
19118
19119
19120/* 
19121$('.discard-btn').on('click', function () {
19122    // Clear form inputs
19123    $('#re-post-textarea').val('');
19124    $('#imageInput').val('');
19125    $('#videoInput').val('');
19126    $('#repostId').val('');
19127    $('#previewGifs').empty(); // Remove previewed GIFs or media
19128
19129    // Optionally, reset classes or styles
19130    $('#repost-form-submit').removeClass('active');
19131
19132    // Execute the inline functionality
19133    $(this).parents('.discard-conformation').fadeOut('fast');
19134    $('.social-popup').fadeOut('fast');
19135    $('body').removeClass('overflow-hidden');
19136    $('.social-shadow').hide();
19137    $('.add-post').removeClass('add-post-opened');
19138    $('.add-post-drop-box').hide();
19139}); */
19140
19141
19142// may 1   When no media and no text discard button should be direct closed without asking save to draft 
19143function handleDiscardPollAction_old() {
19144    $('#poll-save-draft').show();
19145    //$('.social-popup').fadeOut('fast');
19146    //$('body').removeClass('overflow-hidden');
19147    //$('.social-shadow').hide();
19148    //$('.add-post').removeClass('add-post-opened');
19149    //$('.add-post-drop-box').hide();    
19150
19151    // Hide Poll
19152    // $('#create-poll-main-box, #post-footer-for-poll').hide(); 
19153    //$('#post-footer-for-post').show(); 
19154    //$('#add-post-full-container').show();
19155    //$('#discard-for-poll').hide();
19156    //$('#discard-for-post').show();
19157
19158}
19159
19160function handleDiscardPollAction() {
19161
19162    const pollQuestion = $('#pollDescription').val().trim();
19163
19164    let hasOptions = false;
19165
19166    // Check if any poll option has text
19167    $('.create-poll-option .poll-option-input').each(function() {
19168        if ($(this).val().trim() !== '') {
19169            hasOptions = true;
19170            return false; // Exit loop early
19171        }
19172    });
19173
19174    // Check if poll duration is filled
19175    const pollDuration = $('#pollDuration').val();
19176    // const hasDuration = pollDuration && parseInt(pollDuration) > 0;
19177
19178    // Final check
19179    const hasPollContent = pollQuestion.length > 0 || hasOptions; // ||hasDuration
19180
19181    console.log("Poll discard check — Question:", pollQuestion, "| Options filled:", hasOptions, "| Duration:", 0);
19182
19183    if (hasPollContent) {
19184        // Show save draft confirmation box
19185        $('#poll-save-draft').show(); // You can style or handle this however you want
19186    } else {
19187        // Close the poll popup directly — no confirmation
19188        $('.discard-conformation').fadeOut('fast');
19189        $('.social-popup').fadeOut('fast');
19190        $('body').removeClass('overflow-hidden');
19191        $('.social-shadow').hide();
19192        $('.add-post').removeClass('add-post-opened');
19193        $('.add-post-drop-box').hide();
19194
19195        // Reset poll state (optional)
19196        $('#create-poll-main-box, #post-footer-for-poll').hide();
19197        $('#post-footer-for-post').show();
19198        $('#add-post-full-container').show();
19199        $('#discard-for-poll').hide();
19200        $('#discard-for-post').show();
19201    }
19202
19203    // Reset poll setting toggles (if any)
19204    $('#poll-setting-box input[type="checkbox"]').prop('checked', false);
19205}
19206
19207
19208function handleDiscardPollActionFinal() {
19209    // Close popup
19210    $('.social-popup').fadeOut('fast');
19211    $('body').removeClass('overflow-hidden');
19212    $('.social-shadow').hide();
19213    $('.add-post').removeClass('add-post-opened');
19214    $('.add-post-drop-box').hide();
19215    $('#social-popup .add-post-inner').removeClass('draft-open');
19216    $('#draft-box').hide();
19217    // Hide Poll UI, show Post UI
19218    $('#create-poll-main-box, #post-footer-for-poll').hide();
19219    $('#post-footer-for-post').show();
19220    $('#add-post-full-container').show();
19221    $('#discard-for-poll').hide();
19222    $('#discard-for-post').show();
19223
19224    // ✅ Reset poll description
19225    $('#pollDescription').val('');
19226
19227    // ✅ Re-render poll options as fresh (Option 1, Option 2, Add more)
19228    $('#pollOptionsContainer').html(`
19229        <div class="option">
19230            <input type="text" class="poll-option-input" placeholder="Option 1">
19231            <button class="delete-option" type="button" style="display: none;">
19232                <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
19233            </button>
19234        </div>
19235        <div class="option">
19236            <input type="text" class="poll-option-input" placeholder="Option 2">
19237            <button class="delete-option" type="button" style="display: none;">
19238                <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
19239            </button>
19240        </div>
19241        <div class="option add-another-option">
19242            <input type="text" id="newPollOptionInput" class="poll-option-input" placeholder="Add more">
19243            <button class="delete-option" type="button" style="display: none;">
19244                <img src="https://www.jumpspree.com/public/images/trash.png" alt="Delete" title="Delete">
19245            </button>
19246        </div>
19247    `);
19248
19249    // ✅ Reset poll duration to "1 day"
19250    $('.duration-btn').removeClass('selected');
19251    $('.duration-btn').each(function() {
19252        if ($(this).text().includes('1 day')) {
19253            $(this).addClass('selected');
19254        }
19255    });
19256
19257    // ✅ Reset hour input in case it was used
19258    $('#pollDuration').val('');
19259
19260    // ✅ Disable the submit button
19261    $('.addPost-form-submit').addClass('disabled').removeClass('active');
19262}
19263
19264
19265function handleDiscardAction() {
19266
19267    // let postText = $('#addPostTextarea').val().trim();
19268    let postText = $('#addPostTextarea').text().trim();
19269    const imageInput = document.getElementById('imageInput');
19270    const videoInput = document.getElementById('videoInput');
19271    const gifBox = document.getElementById('gifPreviewBox');
19272    const gifPreview = document.getElementById('gifPreviewAddPost');
19273
19274    const hasImage = imageInput && imageInput.files.length > 0;
19275    const hasVideo = $('#videoSource').attr('src')?.trim() !== '';
19276    const hasGif = gifBox && gifBox.style.display !== 'none' && gifPreview && gifPreview.getAttribute('src');
19277
19278    const hasContent = postText.length > 0 || hasImage || hasVideo || hasGif;
19279
19280    console.log("Discard action check — Text:", postText, "Image:", hasImage, "Video:", hasVideo, "GIF:", hasGif);
19281
19282    if (hasContent) {
19283        $('#save-draft').show(); // Prompt to save draft
19284    } else {
19285
19286        // Optionally, reset classes or styles
19287        $('#repost-form-submit').removeClass('active');
19288
19289        // Execute the inline functionality
19290        $(this).parents('.discard-conformation').fadeOut('fast');
19291        $('.social-popup').fadeOut('fast');
19292        $('body').removeClass('overflow-hidden');
19293        $('.social-shadow').hide();
19294        $('.add-post').removeClass('add-post-opened');
19295        $('.add-post-drop-box').hide();
19296    }
19297    const val = $("#repostId").val();
19298    if(val && val.length > 0){
19299        clearRepost();
19300    }
19301    
19302    $('#post-setting-box input[type="checkbox"]').prop('checked', false);
19303     
19304}
19305
19306function handleClearAll(){
19307    console.log("click at handleClearAll 13399");
19308    closePreview();
19309    clearPreviews();
19310    const gifPreviewAddPost = document.getElementById('gifPreviewAddPost');
19311    gifPreviewAddPost.src = '';
19312    $('#videoSource').attr('src', '');
19313    $('#gifPreviewAddPost').attr('src', '');
19314
19315    // Clear form inputs
19316    $('#re-post-textarea').val('');
19317    //$('#addPostTextarea').val('');
19318    $('#addPostTextarea').text('');
19319    $('#imageInput').val('');
19320    $('#videoInput').val('');
19321    $('#repostId').val('');
19322    $('#previewGifs').empty(); // Remove previewed GIFs or media
19323
19324    // Optionally, reset classes or styles
19325    $('#repost-form-submit').removeClass('active');
19326
19327    // Execute the inline functionality
19328    $(this).parents('.discard-conformation').fadeOut('fast');
19329    $('.social-popup').fadeOut('fast');
19330    $('body').removeClass('overflow-hidden');
19331    $('.social-shadow').hide();
19332    $('.add-post').removeClass('add-post-opened');
19333    $('.add-post-drop-box').hide();
19334    $('#save-draft').fadeOut();
19335}
19336
19337//added 23 jan 
19338
19339$('.discard-btn').on('click', function() {
19340    console.log("click at discard-btn 13402");
19341    closePreview();
19342    clearPreviews();
19343    const gifPreviewAddPost = document.getElementById('gifPreviewAddPost');
19344    gifPreviewAddPost.src = '';
19345    $('#videoSource').attr('src', '');
19346    $('#gifPreviewAddPost').attr('src', '');
19347
19348    // Clear form inputs
19349    $('#re-post-textarea').val('');
19350    //$('#addPostTextarea').val('');
19351    $('#addPostTextarea').text('');
19352    $('#imageInput').val('');
19353    $('#videoInput').val('');
19354    $('#repostId').val('');
19355    $('#previewGifs').empty(); // Remove previewed GIFs or media
19356
19357    // Optionally, reset classes or styles
19358    $('#repost-form-submit').removeClass('active');
19359
19360    // Execute the inline functionality
19361    $(this).parents('.discard-conformation').fadeOut('fast');
19362    $('.social-popup').fadeOut('fast');
19363    $('body').removeClass('overflow-hidden');
19364    $('.social-shadow').hide();
19365    $('.add-post').removeClass('add-post-opened');
19366    $('.add-post-drop-box').hide();
19367});
19368
19369
19370//added on 16 may 
19371function voteMyPoll(optionId, userToken, pollId) {
19372    /*$('input[name="poll'+pollId+'"]').each(function() {
19373            if ($(this).is(':checked')) {
19374                $(this).parent().addClass('checkedhai').removeClass('checkednahihai');
19375            } else {
19376                $(this).parent().addClass('checkednahihai').removeClass('checkedhai');
19377            }
19378        });*/
19379
19380    if (!optionId || !userToken || !pollId) {
19381        window.location.href = base_url + '/signin';
19382        //showNotification('error', "Missing required data to cast your vote.");
19383        //return;
19384    }
19385
19386    $.ajax({
19387        url: base_url + '/set-poll-vote',
19388        method: 'POST',
19389        headers: {
19390            'Authorization': `Bearer ${userToken}`,
19391        },
19392        contentType: 'application/json',
19393        data: JSON.stringify({
19394            pollId,
19395            optionId
19396        }),
19397
19398        success: function(data) {
19399            if (data.status) {
19400                // showNotification('success', data.message || 'Vote recorded successfully!');
19401
19402                // Update the bars
19403                data.pollOptions.forEach(option => {
19404                    const bar = $(`.poll-percentage-bar[data-option-id="${option.id}"]`);
19405                    const newWidth = `${option.percentage}%`;
19406                    bar.animate({
19407                        width: newWidth
19408                    }, 500);
19409                    bar.html(
19410                        `${option.option} <span class="percent-text hide">${parseFloat(option.percentage).toFixed(2)}</span>`
19411                        );
19412                    $(`input[name="poll${pollId}"][value="${optionId}"]`).removeClass('hide');
19413
19414                });
19415
19416                // Update total votes
19417                $('.votes').text(`${data.total_votes} votes`);
19418
19419                // ✅ Extract poll ID from input name and disable all
19420                const pollName = `poll${pollId}`;
19421                $(`input[name="${pollName}"]`).prop('disabled', true);
19422
19423            } else {
19424                window.location.href = base_url + '/signin';
19425                //showNotification('error', data.message || 'Failed to record your vote.');
19426            }
19427        },
19428        error: function(xhr, status, error) {
19429            console.error('Error submitting vote:', error);
19430            showNotification('error', 'An error occurred. Please try again later.');
19431        }
19432    });
19433}
19434
19435
19436
19437// Function to handle the actions only if the user is logged in
19438function performAction(action, userToken, username, postId, element, currentUser, post) {
19439
19440    if (currentUser) {
19441        // Perform the action based on the function passed (e.g., follow, mute, block)
19442        if (action === 'follow') {
19443            toggleFollow(userToken, username, postId, element, post);
19444        } else if (action === 'mute') {
19445            toggleMute(userToken, username, postId, element, post);
19446        } else if (action === 'block') {
19447            toggleBlock(userToken, username, postId, element, post);
19448        }
19449    } else {
19450        // If user is not logged in, redirect to the login page
19451        window.location.href = "https://www.jumpspree.com/sign-in";
19452    }
19453}
19454
19455// Toggle Follow/Unfollow
19456function toggleFollow(userToken, username, postId, element, post) {
19457    post.is_follow = post.is_follow == "1" ? "0" : "1"; // Toggle follow state
19458    element.innerHTML =
19459        `${post.is_follow == "1" ? `Unfollow @${username}` : `Follow @${username}`} <i class="fa-regular fa-user-check"></i>`;
19460    followUnfollowUser(userToken, username, postId);
19461}
19462
19463// Toggle Mute/Unmute
19464function toggleMute(userToken, username, postId, element, post) {
19465    post.mute = post.mute == "1" ? "0" : "1"; // Toggle mute state
19466    element.innerHTML =
19467        `${post.mute == "1" ? `Unmute @${username}` : `Mute @${username}`} <i class="fa-regular fa-volume-slash"></i>`;
19468    muteUser(userToken, username, postId);
19469}
19470
19471// Toggle Block/Unblock
19472function toggleBlock(userToken, username, postId, element, post) {
19473    post.block = post.block == "1" ? "0" : "1"; // Toggle block state
19474    element.innerHTML =
19475        `${post.block == "1" ? `Unblock @${username}` : `Block @${username}`} <i class="fa-regular fa-ban"></i>`;
19476    blockUser(userToken, username, postId);
19477}
19478
19479
19480
19481function mentionUser_old(username) {
19482    $('#social-popup').fadeIn('fast');
19483    $('body').addClass('overflow-hidden');
19484    $('.add-post-drop-box').hide();
19485    $('.social-shadow').hide();
19486    $('.add-post').removeClass('add-post-opened');
19487
19488    const textareaForAddPost = document.getElementById('addPostTextarea');
19489    textareaForAddPost.value = '@' + username;
19490}
19491
19492function mentionUser(username) {
19493    $('#social-popup').fadeIn('fast');
19494    $('body').addClass('overflow-hidden');
19495    $('.add-post-drop-box').hide();
19496    $('.social-shadow').hide();
19497    $('.add-post').removeClass('add-post-opened');
19498
19499    const textareaForAddPost = document.getElementById('addPostTextarea');
19500    textareaForAddPost.innerText = '@' + username;
19501    textareaForAddPost.focus(); // optional, to focus on the div
19502}
19503</script>
vendor: 2 bytes, line 19503
19503
19504<script>
19505function showUnfollow(whom, username, usertype, recid = '', feed = '0') {
19506    // alert(username)
19507
19508    $('#footerunfollowbtn').text('Unfollow')
19509    $('#unfollowusernamefooter').text('@' + username + '');
19510    $('#footerunfollowbtn').data('user', whom)
19511    $('#footerunfollowbtn').data('type', usertype)
19512    $('#footerunfollowbtn').data('rec', recid)
19513    $('#footerunfollowbtn').data('feed', feed)
19514
19515    $('#unfollow-confirmation').show()
19516
19517
19518}
19519
19520function deleteAllDrafts() {
19521
19522    $.ajax({
19523        url: base_url + '/delete-draft/all', // Replace with your API endpoint
19524        type: 'POST',
19525        data: {
19526            token: "userToken"
19527        },
19528        dataType: 'json',
19529        beforeSend: function() {
19530            // Optional: Show a loader or disable the button
19531            $('#areyousureDraft').prop('disabled', true).text('Deleting...');
19532        },
19533        success: function(response) {
19534            if (response.status === 'success') {
19535                showNotification('success', response.message);
19536                // Remove drafts from the UI
19537                $('.draft-outer .drafts').remove();
19538                $('.no-drafts').addClass('no-draft-show');
19539
19540                // Hide the confirmation modal
19541                $('.discard-conformation').fadeOut('fast');
19542
19543                // Show success notification
19544                getAllMyDrafts();
19545                const draftContainer = $('#draft-container');
19546                const draftHtml = `
19547                            <div class="no-drafts">
19548                                    <p>No drafts available</p>
19549                                </div>
19550                        `;
19551                draftContainer.append(draftHtml);
19552            } else {
19553                // Show error notification
19554                showNotification('error', response.message);
19555            }
19556
19557            // Reset the button state
19558            //$('.copy-embed').prop('disabled', false).text('Yes');
19559            $('#discard-btn').prop('disabled', false).text('Discard');
19560        },
19561        error: function(xhr, status, error) {
19562            // Show error notification
19563            showNotification('error', 'An error occurred while deleting drafts.');
19564
19565            // Reset the button state
19566            //$('.copy-embed').prop('disabled', false).text('Yes');
19567            $('#discard-btn').prop('disabled', false).text('Discard');
19568        }
19569    });
19570}
19571
19572function deleteAllDraftsSingle(id) {
19573
19574    $.ajax({
19575        url: base_url + '/delete-draft/' + id, // Replace with your API endpoint
19576        type: 'POST',
19577        data: {
19578            token: "userToken"
19579        },
19580        dataType: 'json',
19581        beforeSend: function() {
19582            // Optional: Show a loader or disable the button
19583            $('#areyousureDraft').prop('disabled', true).text('Deleting...');
19584        },
19585        success: function(response) {
19586            if (response.status === 'success') {
19587
19588                getAllMyDrafts();
19589                // Remove drafts from the UI
19590                //draftDiv-1513 
19591                if (response.remaining_count < 1) {
19592                    const deleteAllDraftBtn = document.getElementById('deleteAllDraftBtn');
19593                    deleteAllDraftBtn.style.display = 'none';
19594
19595                    // console.log("we have zero records");
19596                    const draftContainer = $('#draft-container');
19597                    const draftHtml = `
19598                            <div class="no-drafts">
19599                                    <p>No drafts available</p>
19600                                </div>
19601                        `;
19602                    draftContainer.append(draftHtml); // Append to container
19603                }
19604                $('#draftDiv-' + id).hide();
19605                // Show success notification
19606                showNotification('success', response.message);
19607            } else {
19608                // Show error notification
19609                showNotification('error', response.message);
19610            }
19611        },
19612        error: function(xhr, status, error) {
19613            // Show error notification
19614            showNotification('error', 'An error occurred while deleting drafts.');
19615
19616            // Reset the button state
19617            $('.copy-embed').prop('disabled', false).text('Yes');
19618        }
19619    });
19620}
19621
19622
19623function unfollow() {
19624
19625    whom = $('#footerunfollowbtn').data('user');
19626    whomtype = $('#footerunfollowbtn').data('type');
19627    recId = $('#footerunfollowbtn').data('rec');
19628    feed = $('#footerunfollowbtn').data('feed');
19629
19630
19631    stext = $('#footerunfollowbtn').text();
19632    $.ajax({
19633        url: base_url + '/unfollow',
19634        type: 'POST',
19635        data: {
19636            whom: whom,
19637            whomtype: whomtype
19638        },
19639        dataType: "Json",
19640        beforeSend: function() {
19641
19642            $('#footerunfollowbtn').html('<span class="jloader"></span>');
19643
19644        },
19645        success: function(response) {
19646            msg = response.message;
19647            if (response.status) {
19648
19649
19650                $('#unfollow-confirmation').fadeOut('fast');
19651                showNotification('success', msg);
19652
19653                if (feed == '0') {
19654                    $('#' + recId).text(response.text)
19655                    $('#' + recId).addClass('notFollowing')
19656                    $('#' + recId).removeClass('isFollowing')
19657                    $('.fcb').removeClass('show-tip')
19658                } else {
19659                    $('#' + recID).find('span').text('Follow @' + user)
19660
19661                }
19662
19663
19664            } else {
19665                $('#unfollow-confirmation').fadeOut('fast');
19666                showNotification('error', msg);
19667                //  $(thisid).html(stext); 
19668            }
19669
19670
19671        },
19672        error: function(xhr, status, error) {
19673            $('#unfollow-confirmation').fadeOut('fast');
19674            $('#footerunfollowbtn').html(stext);
19675            //  $('#loader').hide();
19676            // console.error('AJAX error:', error);
19677        }
19678    });
19679
19680}
19681
19682
19683
19684function copyFeedlinktoshare(weblink) {
19685    var dummy = document.createElement('input'),
19686        text = weblink;
19687
19688    document.body.appendChild(dummy);
19689    dummy.value = text;
19690    dummy.select();
19691    document.execCommand('copy');
19692
19693
19694    document.body.removeChild(dummy);
19695
19696    $('#post-Link-copied').addClass('show-notification');
19697    setTimeout(function() {
19698
19699        $('#post-Link-copied').removeClass('show-notification');
19700    }, 3000)
19701
19702
19703
19704}
19705
19706function CopyFeedTextToClipboard(containerid) {
19707    if (window.getSelection) {
19708        if (window.getSelection().empty) { // Chrome
19709            window.getSelection().empty();
19710        } else if (window.getSelection().removeAllRanges) { // Firefox
19711            window.getSelection().removeAllRanges();
19712        }
19713    } else if (document.selection) { // IE?
19714        document.selection.empty();
19715    }
19716
19717    if (document.selection) {
19718        var range = document.body.createTextRange();
19719        range.moveToElementText(document.getElementById(containerid));
19720        range.select().createTextRange();
19721        document.execCommand("copy");
19722    } else if (window.getSelection) {
19723        var range = document.createRange();
19724        range.selectNode(document.getElementById(containerid));
19725        window.getSelection().addRange(range);
19726        document.execCommand("copy");
19727    }
19728
19729
19730    $('#post-text-copied').addClass('show-notification');
19731    setTimeout(function() {
19732
19733        $('#post-text-copied').removeClass('show-notification');
19734    }, 3000)
19735}
19736</script>
19736
19737
19738
19739<!-- Footer code END -->
19740
19741<script>
19742txt = window.location;
19743$('#share-url').text(txt)
19744</script>
19744
19745
19746
19747<link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
19748<noscript><link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" rel="stylesheet" type="text/css"></noscript>
19749<link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
19750<noscript><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css"></noscript>
19751<script defer src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
19751
19752<!-- 
19752<script defer src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
19752 -->
19753<script defer src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script>
19753
19754
19755
19756
19757<script>
19758$(function () {
19759
19760    $("#datepicker").datepicker({
19761        autoclose: true,
19762        startDate: new Date()
19763    });
19764
19765    $('.timepicker').timepicker({
19766        timeFormat: 'hh:mm a',
19767        interval: 1,
19768        minTime: '0',
19769        maxTime: '11:59 pm',
19770        defaultTime: '10:24',
19771        startTime: '00:00',
19772        dynamic: true,
19773        dropdown: true,
19774        scrollbar: true
19775    });
19776
19777});
19778</script>
vendor: 2 bytes, line 19778
19778
19779<script>
19780    
19781// $(document).ready(function () {
19782//     $("#datepicker").datepicker({
19783//         autoclose: true,
19784//         startDate: new Date()
19785//     });
19786// });
19787
19788$('#datepicker').on('show', function(e) {
19789
19790
19791    if (e.date) {
19792        $(this).data('stickyDate', e.date);
19793    } else {
19794        $(this).data('stickyDate', null);
19795    }
19796});
19797
19798$('#datepicker').on('hide', function(e) {
19799
19800    var stickyDate = $(this).data('stickyDate');
19801
19802    if (!e.date && stickyDate) {
19803
19804        $(this).datepicker('setDate', stickyDate);
19805        $(this).data('stickyDate', null);
19806    }
19807});
19808
19809$('#datepicker').on('changeDate', function(e) {
19810
19811    curDate = '10/01/2026';
19812    if (e.format() != curDate) {
19813
19814        $('.timepicker').timepicker('setTime', '00:00');
19815    } else {
19816
19817        $('.timepicker').timepicker('setTime', '10:24');
19818
19819    }
19820});
19821// $('.timepicker').timepicker({
19822//     timeFormat: 'hh:mm a',
19823//     interval: 1,
19824//     minTime: '0',
19825//     maxTime: '11:59 pm',
19826//     defaultTime: '10:24',
19827//     startTime: '00:00',
19828//     dynamic: true,
19829//     dropdown: true,
19830//     scrollbar: true
19831// });
19832
19833// Close timepicker when clicking outside
19834$('.Schedule-message-wrapper').on('click', function(e) {
19835    if (!$(e.target).closest('.ui-timepicker-container, .timepicker').length) {
19836        $('.ui-timepicker-container').hide();
19837    }
19838});
19839
19840
19841function convertDateToLongFormat(date) {
19842    // Split the input date
19843    let [month, day, year] = date.split('/').map(Number);
19844
19845    // Array of full month names
19846    const months = [
19847        "January", "February", "March", "April", "May", "June",
19848        "July", "August", "September", "October", "November", "December"
19849    ];
19850
19851    // Get the full month name
19852    let monthName = months[month - 1];
19853
19854    // Format and return the result
19855    return `${monthName} ${day}, ${year}`;
19856}
19857
19858function convertTo12HourFormat(time) {
19859    // Parse the hours and minutes
19860    let [hours, minutes] = time.split(':').map(Number);
19861    let meridian = hours >= 12 ? 'pm' : 'am';
19862
19863    // Convert hours to 12-hour format
19864    hours = hours % 12 || 12;
19865
19866    // Format hours and minutes as two digits
19867    let hours12 = hours.toString().padStart(2, '0');
19868    let minutes12 = minutes.toString().padStart(2, '0');
19869
19870    return `${hours12}:${minutes12} ${meridian}`;
19871}
19872
19873function convertTo24HourFormat(time) {
19874    // Parse the time and period (AM/PM)
19875    let [timePart, meridian] = time.split(' ');
19876    let [hours, minutes] = timePart.split(':').map(Number);
19877
19878    // Convert hours based on AM/PM
19879    if (meridian.toLowerCase() === 'pm' && hours !== 12) {
19880        hours += 12;
19881    } else if (meridian.toLowerCase() === 'am' && hours === 12) {
19882        hours = 0;
19883    }
19884
19885    // Format hours and minutes as two digits
19886    let hours24 = hours.toString().padStart(2, '0');
19887    let minutes24 = minutes.toString().padStart(2, '0');
19888
19889    return `${hours24}:${minutes24}`;
19890}
19891
19892function convertDateFormat(date) {
19893    // Split the input date by '/'
19894    let [month, day, year] = date.split('/');
19895
19896    // Return the date in yyyy-mm-dd format
19897    return `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`;
19898}
19899
19900function schedulePost() {
19901    date = $('#datepicker').val();
19902    longFormat = convertDateToLongFormat(date);
19903    postDate = convertDateFormat(date);
19904    time = $('#timepicker').val();
19905    postTime = convertTo24HourFormat(time);
19906
19907    $('#scheduled').val('1');
19908    $('#scheduledate').val(postDate);
19909    $('#scheduletime').val(postTime);
19910    $('#scheduledfor').text('Scheduled for ' + longFormat + ' at ' + time + ' ');
19911
19912
19913
19914    $('#social-popup > .add-post-inner').removeClass('schedule-box-opened');
19915    $('.Schedule-message-wrapper').hide();
19916    $('.schedule-done').show();
19917    $('#social-popup').addClass('scheduled-success');
19918    handleAddPost();
19919}
19920
19921function unschedulePost() {
19922    $('#scheduled').val('0');
19923    $('#scheduledate').val('');
19924    $('#scheduletime').val('');
19925    $('#scheduledfor').text('');
19926    $('.schedule-done').hide();
19927    $('#unschedule').fadeOut('fast');
19928    $('#social-popup').removeClass('scheduled-success');
19929}
19930
19931function showScheduler(thisid) {
19932    $(thisid).addClass('active');
19933    $('#draft-btn').removeClass('active');
19934    $('#draft-container').hide();
19935    $('#schedule-container').fadeIn();
19936    fetchScheduleList();
19937
19938}
19939</script>
19939
19940
19941<script>
19942// mention popup logic 2 may riaz new modified code 
19943const input = document.getElementById('addPostTextarea');
19944const popup = document.querySelector('.mention-popup');
19945var mentionStartIndex = -1;
19946var debounceTimer;
19947
19948input.addEventListener('input', handleMentionInput);
19949
19950document.addEventListener('click', (e) => {
19951    if (!popup.contains(e.target) && e.target !== input) {
19952        hideMentionPopup();
19953    }
19954});
19955
19956//workig but only for mention below at bottom new function for mention and hashtasg 
19957/* function handleMentionInput(e) {
19958    const el = e.target; // ✅ Fix: define el
19959    const value = el.innerText;
19960
19961    // ✅ Calculate cursor position manually for contenteditable
19962    let cursorPosition = 0;
19963    const selection = window.getSelection();
19964    if (selection.rangeCount > 0) {
19965        const range = selection.getRangeAt(0);
19966        const preCaretRange = range.cloneRange();
19967        preCaretRange.selectNodeContents(el);
19968        preCaretRange.setEnd(range.endContainer, range.endOffset);
19969        cursorPosition = preCaretRange.toString().length;
19970    }
19971
19972    const textBeforeCursor = value.slice(0, cursorPosition);
19973    const lastAtSymbol = textBeforeCursor.lastIndexOf('@');
19974
19975    if (lastAtSymbol !== -1 && !textBeforeCursor.slice(lastAtSymbol).includes(' ')) {
19976        mentionStartIndex = lastAtSymbol;
19977        const query = textBeforeCursor.slice(lastAtSymbol + 1).trim();
19978        if (query) {
19979            searchUsersMention(query);
19980        } else {
19981            hideMentionPopup();
19982            clearTimeout(debounceTimer);
19983        }
19984    } else {
19985        hideMentionPopup();
19986        clearTimeout(debounceTimer);
19987    }
19988} */
19989
19990/* 
19991const input = document.getElementById('addPostTextarea');
19992const popup = document.querySelector('.mention-popup');
19993var mentionStartIndex = -1;
19994var debounceTimer;
19995
19996input.addEventListener('input', handleMentionInput);
19997
19998
19999document.addEventListener('click', (e) => {
20000    const popup = document.querySelector('.mention-popup');
20001
20002    if (!popup.contains(e.target) && e.target !== input) {
20003        hideMentionPopup();
20004    }
20005});
20006
20007
20008function handleMentionInput(e) {
20009   // const value = e.target.value;
20010    const value = el.innerText;
20011    const cursorPosition = e.target.selectionStart;
20012    const textBeforeCursor = value.slice(0, cursorPosition);
20013    const lastAtSymbol = textBeforeCursor.lastIndexOf('@');
20014
20015    if (lastAtSymbol !== -1 && !textBeforeCursor.slice(lastAtSymbol).includes(' ')) {
20016        mentionStartIndex = lastAtSymbol;
20017        const query = textBeforeCursor.slice(lastAtSymbol + 1).trim();
20018        //console.log(query);
20019        if (query) {
20020            searchUsersMention(query);
20021        } else {
20022            hideMentionPopup();
20023            clearTimeout(debounceTimer);
20024        }
20025    } else {
20026        hideMentionPopup();
20027        clearTimeout(debounceTimer);
20028    }
20029}
20030 */
20031
20032function debounceMention(func, delay) {
20033    return function(...args) {
20034        clearTimeout(debounceTimer);
20035        debounceTimer = setTimeout(() => {
20036            func.apply(this, args);
20037        }, delay);
20038    }
20039}
20040
20041const searchUsersMention = debounceMention((query) => {
20042
20043    if (!query || query.trim().length == 0) {
20044        hideMentionPopup();
20045        return;
20046    }
20047
20048    $.ajax({
20049        url: 'https://www.jumpspree.com/getUserListForMentions', //'http://localhost:8080/getUserListForMentions',
20050        type: 'POST',
20051        data: {
20052            query
20053        },
20054        dataType: "json",
20055        success: function(response) {
20056            //console.log(response);
20057
20058            if (!response.status) {
20059                hideMentionPopup();
20060                return;
20061            }
20062
20063            const users = response.data;
20064            if (users && users.length > 0) {
20065                displayUsersMention(users);
20066            } else {
20067                console.log("No data")
20068                hideMentionPopup();
20069            }
20070
20071
20072        },
20073        error: function(xhr, status, error) {
20074            hideMentionPopup();
20075            console.error(error);
20076        }
20077    });
20078}, 500);
20079
20080function displayUsersMention(users) {
20081    const popup = document.querySelector('.mention-popup');
20082
20083    popup.innerHTML = users.map(user => {
20084        let avatarHtml;
20085
20086        if (user.profile_photo && user.profile_photo.trim() !== "") {
20087            // Use profile photo
20088            avatarHtml = `<img class="user-avatar" src="${user.profile_photo}" alt="${user.full_name}">`;
20089        } else {
20090            // Use first letter of username
20091            const firstChar = user.username ? user.username.charAt(0).toUpperCase() : "?";
20092            avatarHtml = `<div class="user-avatar-placeholder">${firstChar}</div>`;
20093        }
20094
20095        return `
20096            <div class="user-item" onclick="insertUserMention('${user.username}')">
20097                ${avatarHtml}
20098                <div class="user-info">
20099                    <span class="user-name">
20100                        ${user.full_name} 
20101                        <span>${user.is_verified == '1' ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon" >' : ''}</span>
20102                    </span>
20103                    <span class="user-username">@${user.username}</span>
20104                </div>
20105            </div>
20106        `;
20107    }).join('');
20108
20109    popup.style.display = 'block';
20110}
20111
20112
20113/* 
20114function displayUsersMention(users) {
20115    const popup = document.querySelector('.mention-popup');
20116
20117    popup.innerHTML = users.map(user => `
20118                <div class="user-item" onclick="insertUserMention('${user.username}')">
20119                    <img class="user-avatar" src="${user.profile_photo ?? "https://www.jumpspree.com/public/images/user-icon.png?ver:1.02"}" alt="${user.full_name}">
20120                    <div class="user-info">
20121                        <span class="user-name">${user.full_name} 
20122                            <span> ${user.is_verified=='1' ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon">' : ''}</span>
20123                        </span>
20124                        <span class="user-username">@${user.username}</span>
20125                    </div>
20126                </div>
20127            `).join('');
20128    popup.style.display = 'block';
20129} */
20130/* 
20131function displayUsersMention(users) {
20132    const popup = document.querySelector('.mention-popup');
20133
20134    popup.innerHTML = users.map(user => {
20135        let avatarHtml;
20136
20137        if (user.profile_photo && user.profile_photo.trim() !== '') {
20138            avatarHtml = `<img class="user-avatar" src="${user.profile_photo}" alt="${user.full_name}">`;
20139        } else {
20140            const firstChar = user.full_name ? user.full_name.charAt(0).toUpperCase() : '?';
20141            avatarHtml = `<div class="user-avatar-fallback">${firstChar}</div>`;
20142        }
20143
20144        return `
20145            <div class="user-item" onclick="insertUserMention('${user.username}')">
20146                ${avatarHtml}
20147                <div class="user-info">
20148                    <span class="user-name">
20149                        ${user.full_name}
20150                        <span>
20151                            ${user.is_verified == '1' 
20152                                ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon">' 
20153                                : ''}
20154                        </span>
20155                    </span>
20156                    <span class="user-username">@${user.username}</span>
20157                </div>
20158            </div>
20159        `;
20160    }).join('');
20161
20162    popup.style.display = 'block';
20163}
20164 */
20165
20166// riaz may 02   
20167function insertUserMention(username) {
20168    const input = document.getElementById('addPostTextarea');
20169    const selection = window.getSelection();
20170    if (!selection.rangeCount) return;
20171
20172    const range = selection.getRangeAt(0);
20173    const preCaretRange = range.cloneRange();
20174    preCaretRange.selectNodeContents(input);
20175    preCaretRange.setEnd(range.endContainer, range.endOffset);
20176    const cursorPosition = preCaretRange.toString().length;
20177
20178    const text = input.innerText;
20179    const before = text.slice(0, mentionStartIndex);
20180    const after = text.slice(cursorPosition);
20181
20182    input.innerHTML =
20183        `${escapeHtml(before)}<span class="highlight-mention">@${username}</span>&nbsp;${escapeHtml(after)}`;
20184
20185    hideMentionPopup();
20186
20187    placeCaretAtEnd(input);
20188    input.focus();
20189}
20190
20191
20192
20193// Helper function to place caret at a specific character offset in contenteditable
20194function setCaretPosition_old(el, chars) {
20195    const range = document.createRange();
20196    const selection = window.getSelection();
20197    range.selectNodeContents(el);
20198    range.collapse(true);
20199
20200    let node = el;
20201    let remaining = chars;
20202
20203    function traverse(node) {
20204        if (node.nodeType === 3) { // text node
20205            if (node.length >= remaining) {
20206                range.setStart(node, remaining);
20207                range.collapse(true);
20208                return true;
20209            } else {
20210                remaining -= node.length;
20211            }
20212        } else {
20213            for (let child of node.childNodes) {
20214                if (traverse(child)) return true;
20215            }
20216        }
20217        return false;
20218    }
20219
20220    traverse(el);
20221    selection.removeAllRanges();
20222    selection.addRange(range);
20223}
20224
20225function hideMentionPopup() {
20226    const popup = document.querySelector('.mention-popup');
20227
20228    popup.style.display = 'none';
20229    mentionStartIndex = -1;
20230}
20231
20232/* function insertUserMention(userName) {
20233    const input = document.getElementById('addPostTextarea');
20234
20235    const before = input.value.slice(0, mentionStartIndex);
20236    const after = input.value.slice(input.selectionStart);
20237    input.value = before + '@' + userName + ' ' + after;
20238    hideMentionPopup();
20239    input.focus();
20240} */
20241
20242//code for hashtags 
20243var hashtagStartIndex = -1;
20244const hashtagPopup = document.getElementById('hashTags-popup');
20245
20246function handleMentionInput(e) {
20247    const el = e.target;
20248    const value = el.innerText;
20249
20250    let cursorPosition = 0;
20251    const selection = window.getSelection();
20252    if (selection.rangeCount > 0) {
20253        const range = selection.getRangeAt(0);
20254        const preCaretRange = range.cloneRange();
20255        preCaretRange.selectNodeContents(el);
20256        preCaretRange.setEnd(range.endContainer, range.endOffset);
20257        cursorPosition = preCaretRange.toString().length;
20258    }
20259
20260    const textBeforeCursor = value.slice(0, cursorPosition);
20261    const lastAtSymbol = textBeforeCursor.lastIndexOf('@');
20262    const lastHashSymbol = textBeforeCursor.lastIndexOf('#');
20263
20264    // @mention handling
20265    if (lastAtSymbol !== -1 && !textBeforeCursor.slice(lastAtSymbol).includes(' ')) {
20266        mentionStartIndex = lastAtSymbol;
20267        const query = textBeforeCursor.slice(lastAtSymbol + 1).trim();
20268        if (query) {
20269            searchUsersMention(query);
20270        } else {
20271            hideMentionPopup();
20272        }
20273    } else {
20274        hideMentionPopup();
20275    }
20276
20277    // #hashtag handling
20278    if (lastHashSymbol !== -1 && !textBeforeCursor.slice(lastHashSymbol).includes(' ')) {
20279        hashtagStartIndex = lastHashSymbol;
20280        const query = textBeforeCursor.slice(lastHashSymbol + 1).trim();
20281        if (query) {
20282            searchHashtags(query);
20283        } else {
20284            hideHashtagPopup();
20285        }
20286    } else {
20287        hideHashtagPopup();
20288    }
20289}
20290
20291function searchHashtags(query) {
20292    if (!query || query.trim().length === 0) {
20293        hideHashtagPopup();
20294        return;
20295    }
20296
20297    /* $.ajax({
20298        url: 'https://app.cubesnack.com/cubesnackapp/ws/search.php',
20299        type: 'GET',
20300        data: {
20301            type: 'hashtag',
20302            search: query
20303        },
20304        dataType: "json",
20305        success: function(response) {
20306            if (!response.status || !response.suggestions || response.suggestions.length === 0) {
20307                hideHashtagPopup();
20308                return;
20309            }
20310            displayHashtagSuggestions(response.suggestions);
20311        },
20312        error: function(xhr, status, error) {
20313            hideHashtagPopup();
20314            console.error(error);
20315        }
20316    }); */
20317    $.ajax({
20318        url: '/hashtag-proxy.php',
20319        type: 'GET',
20320        data: {
20321            search: query
20322        },
20323        dataType: "json",
20324        success: function(response) {
20325            if (!response.status || !response.suggestions || response.suggestions.length === 0) {
20326                hideHashtagPopup();
20327                return;
20328            }
20329            displayHashtagSuggestions(response.suggestions);
20330        },
20331        error: function(xhr, status, error) {
20332            hideHashtagPopup();
20333            console.error(error);
20334        }
20335    });
20336
20337
20338}
20339
20340function displayHashtagSuggestions(hashtags) {
20341    const popup = document.getElementById('hashTags-popup');
20342
20343    popup.innerHTML = hashtags.map(tag => `
20344        <div class="user-item" onclick="insertHashtag('${tag.display}')">
20345            <div class="user-info">
20346                <span class="user-name">#${tag.display}</span>
20347            </div>
20348        </div>
20349    `).join('');
20350
20351    popup.style.display = 'block';
20352}
20353
20354
20355function insertHashtag(tag) {
20356    const input = document.getElementById('addPostTextarea');
20357    const selection = window.getSelection();
20358    if (!selection.rangeCount) return;
20359
20360    const range = selection.getRangeAt(0);
20361    const preCaretRange = range.cloneRange();
20362    preCaretRange.selectNodeContents(input);
20363    preCaretRange.setEnd(range.endContainer, range.endOffset);
20364    const cursorPosition = preCaretRange.toString().length;
20365
20366    const text = input.innerText;
20367    const before = text.slice(0, hashtagStartIndex);
20368    const after = text.slice(cursorPosition);
20369
20370    input.innerHTML = `${escapeHtml(before)}<span class="highlight-hashtag">#${tag}</span>&nbsp;${escapeHtml(after)}`;
20371
20372    hideHashtagPopup();
20373
20374    placeCaretAtEnd(input);
20375    input.focus();
20376}
20377
20378function escapeHtml(text) {
20379    return text.replace(/[&<>"']/g, function(m) {
20380        return ({
20381            '&': '&amp;',
20382            '<': '&lt;',
20383            '>': '&gt;',
20384            '"': '&quot;',
20385            "'": '&#39;'
20386        })[m];
20387    });
20388}
20389
20390function placeCaretAtEnd(el) {
20391    el.focus();
20392    const range = document.createRange();
20393    range.selectNodeContents(el);
20394    range.collapse(false);
20395    const sel = window.getSelection();
20396    sel.removeAllRanges();
20397    sel.addRange(range);
20398}
20399
20400
20401
20402function hideHashtagPopup() {
20403    hashtagPopup.style.display = 'none';
20404    hashtagStartIndex = -1;
20405}
20406
20407
20408//below function is used entire post-text div to be clickable and navigate to the details page (which is the first anchor's href), 
20409// but you want to exclude clicks on @mentions, #hashtags, and other special links. 02-may riaz
20410$(document).on('click', '.post-text', function(e) {
20411    const $firstLink = $(this).find('a:first');
20412    const detailsUrl = $firstLink.attr('href');
20413
20414    if (
20415        !detailsUrl ||
20416        $(e.target).closest(
20417            'a.mention-link, a.hashtag-link, a[href^="javascript:"], a[href^="http"], a[href^="#"]').length
20418    ) {
20419        return;
20420    }
20421
20422    window.location.href = detailsUrl;
20423});
20424
20425
20426// end hashtags logic 
20427
20428function highlightText_old(div) {
20429    // Use textContent to get raw text without HTML
20430    const text = div.textContent;
20431
20432    // If text is completely cleared, reset the div to truly empty
20433    if (!text.trim()) {
20434        div.innerHTML = "";
20435        return;
20436    }
20437
20438    // Split by spaces (and keep them)
20439    const parts = text.split(/(\s+)/);
20440
20441    // Rebuild with highlights
20442    const newHTML = parts.map(part => {
20443        if (part.startsWith("#") || part.startsWith("@")) {
20444            return `<span class="highlight">${part}</span>`;
20445        }
20446        return part;
20447    }).join("");
20448
20449    // Save current cursor position
20450    const sel = window.getSelection();
20451    const range = sel.getRangeAt(0);
20452    const offset = range.startOffset;
20453
20454    // Update content
20455    div.innerHTML = newHTML;
20456
20457    // Move cursor to end
20458    setCursorToEnd(div);
20459}
20460
20461function setCursorToEnd(el, pos) {
20462    const range = document.createRange();
20463    const sel = window.getSelection();
20464    range.selectNodeContents(el);
20465    range.collapse(false);
20466    sel.removeAllRanges();
20467    sel.addRange(range);
20468}
20469
20470function highlightText(div) {
20471    // Save total caret position as character offset
20472    const caretPosition = getCaretCharacterOffsetWithin(div);
20473
20474    // Get raw text content
20475    const text = div.textContent;
20476
20477    // If text is empty, reset HTML and return
20478    if (!text.trim()) {
20479        div.innerHTML = "";
20480        return;
20481    }
20482
20483    // Split by words (preserving spaces)
20484    const parts = text.split(/(\s+)/);
20485
20486    // Highlight # and @ words
20487    const newHTML = parts.map(part => {
20488        if (part.startsWith("#") || part.startsWith("@")) {
20489            return `<span class="highlight">${part}</span>`;
20490        }
20491        return part;
20492    }).join("");
20493
20494    // Replace content
20495    div.innerHTML = newHTML;
20496
20497    // Restore caret position
20498    setCaretPosition(div, caretPosition);
20499}
20500
20501
20502function getCaretCharacterOffsetWithin(element) {
20503    const selection = window.getSelection();
20504    let caretOffset = 0;
20505    if (selection.rangeCount > 0) {
20506        const range = selection.getRangeAt(0);
20507        const preCaretRange = range.cloneRange();
20508        preCaretRange.selectNodeContents(element);
20509        preCaretRange.setEnd(range.startContainer, range.startOffset);
20510        caretOffset = preCaretRange.toString().length;
20511    }
20512    return caretOffset;
20513}
20514
20515function setCaretPosition(element, offset) {
20516    const range = document.createRange();
20517    const selection = window.getSelection();
20518
20519    let currentOffset = 0;
20520    let found = false;
20521
20522    const treeWalker = document.createTreeWalker(
20523        element,
20524        NodeFilter.SHOW_TEXT,
20525        null,
20526        false
20527    );
20528
20529    while (!found && treeWalker.nextNode()) {
20530        const node = treeWalker.currentNode;
20531        const nextOffset = currentOffset + node.length;
20532
20533        if (offset <= nextOffset) {
20534            range.setStart(node, offset - currentOffset);
20535            range.collapse(true);
20536            found = true;
20537            break;
20538        }
20539
20540        currentOffset = nextOffset;
20541    }
20542
20543    if (found) {
20544        selection.removeAllRanges();
20545        selection.addRange(range);
20546    }
20547}
20548
20549
20550
20551//
20552
20553const addPostTextarea = document.getElementById('addPostTextarea');
20554var editHistory = [];
20555var historyIndex = -1;
20556
20557// Save initial state
20558saveState();
20559
20560// Listen for input changes
20561addPostTextarea.addEventListener('input', () => saveState());
20562
20563// Handle both Ctrl+Z (Windows/Linux) and Cmd+Z (Mac)
20564addPostTextarea.addEventListener('keydown', (e) => {
20565    const isUndo = (e.ctrlKey || e.metaKey) && e.key === 'z' && !e.shiftKey;
20566    const isRedo = (e.ctrlKey || e.metaKey) && (e.key === 'y' || (e.shiftKey && e.key === 'z'));
20567
20568    if (isUndo) {
20569        e.preventDefault();
20570        undo();
20571    } else if (isRedo) {
20572        e.preventDefault();
20573        redo();
20574    }
20575});
20576
20577function saveState() {
20578    // Remove future history if we undo and then make new changes
20579    editHistory = editHistory.slice(0, historyIndex + 1);
20580
20581    // Save current HTML
20582    editHistory.push(addPostTextarea.innerHTML);
20583    historyIndex = editHistory.length - 1;
20584}
20585
20586function undo() {
20587    if (historyIndex > 0) {
20588        historyIndex--;
20589        restoreState();
20590    }
20591}
20592
20593function redo() {
20594    if (historyIndex < editHistory.length - 1) {
20595        historyIndex++;
20596        restoreState();
20597    }
20598}
20599
20600function restoreState() {
20601    const prevState = editHistory[historyIndex];
20602    addPostTextarea.innerHTML = prevState;
20603
20604    // Move cursor to the end after undo/redo
20605    const range = document.createRange();
20606    const selection = window.getSelection();
20607    range.selectNodeContents(addPostTextarea);
20608    range.collapse(false); // Move cursor to end
20609    selection.removeAllRanges();
20610    selection.addRange(range);
20611}
20612
20613
20614
20615document.addEventListener('DOMContentLoaded', () => {
20616    const pickerWrapper = document.getElementById('emojiPickerWrapper');
20617    const picker = document.getElementById('emojiPicker');
20618    const closeBtn = document.getElementById('closeEmojiPicker');
20619    const button = document.getElementById('myemojiBtn');
20620    const editable = document.getElementById('addPostTextarea');
20621
20622    // Toggle show/hide on button click
20623    button.addEventListener('click', (e) => {
20624        if (pickerWrapper.style.display === 'none') {
20625            const rect = button.getBoundingClientRect();
20626            pickerWrapper.style.top = (rect.bottom + window.scrollY + 10) + 'px';
20627            pickerWrapper.style.left = (rect.left + window.scrollX) + 'px';
20628            pickerWrapper.style.display = 'block';
20629        } else {
20630            pickerWrapper.style.display = 'none';
20631        }
20632    });
20633
20634    // Close on ❌ button
20635    closeBtn.addEventListener('click', () => {
20636        pickerWrapper.style.display = 'none';
20637    });
20638
20639    // Emoji selection
20640    picker.addEventListener('emoji-click', event => {
20641        const emoji = event.detail.unicode;
20642        insertAtCursor(editable, emoji);
20643        pickerWrapper.style.display = 'none';
20644    });
20645
20646    function insertAtCursor(el, emoji) {
20647        el.focus();
20648        const sel = window.getSelection();
20649        if (!sel.rangeCount) return;
20650
20651        const range = sel.getRangeAt(0);
20652        range.deleteContents();
20653
20654        const textNode = document.createTextNode(emoji);
20655        range.insertNode(textNode);
20656
20657        range.setStartAfter(textNode);
20658        range.collapse(true);
20659        sel.removeAllRanges();
20660        sel.addRange(range);
20661    }
20662});
20663</script>
20663
20664
20665<script src="https://cdnjs.cloudflare.com/ajax/libs/lottie-web/5.10.2/lottie.min.js"></script>
vendor: 2 bytes, line 20665
20665
20666<script>
20667var animation = lottie.loadAnimation({
20668    container: document.getElementById('lottie-animation'), // the dom element
20669    renderer: 'svg', // or 'canvas' or 'html'
20670    loop: true,
20671    autoplay: true,
20672    path: 'https://www.jumpspree.com/public/css/load_signup.json' // replace with your actual path
20673});
20674
20675var animation2 = lottie.loadAnimation({
20676    container: document.getElementById('lottie-animation2'), // the dom element
20677    renderer: 'svg', // or 'canvas' or 'html'
20678    loop: true,
20679    autoplay: true,
20680    path: 'https://www.jumpspree.com/public/css/success_signup.json' // replace with your actual path
20681});
20682
20683
20684
20685
20686function animationstart() {
20687    setTimeout(function() {
20688        $('#step07 .setup-account').hide()
20689        $('#step07 .all-set').fadeIn();
20690        setTimeout(function() {
20691            //            window.location.href='https://www.jumpspree.com';
20692            $('#step07').hide()
20693            $('#step08').fadeIn()
20694        }, 3000)
20695    }, 5000)
20696}
20697</script>
vendor: 2 bytes, line 20697
20697
20698<script>
20699var animation1 = null;
20700
20701function showAnimation_old() {
20702    $('#step08').hide();
20703    $('#step09').fadeIn();
20704    $('#step09').addClass('show-anim');
20705    $('#lottie-animation3').show();
20706    var animation3 = lottie.loadAnimation({
20707        container: document.getElementById('lottie-animation3'), // the dom element
20708        renderer: 'svg', // or 'canvas' or 'html'
20709        loop: true,
20710        autoplay: true,
20711        path: 'https://www.jumpspree.com/public/css/cofetti.json' // replace with your actual path
20712    });
20713
20714    setTimeout(function() {
20715        $('#signup-new-process, #step09').fadeOut();
20716        $('#signup-new-process #step01').fadeIn('slow');
20717    }, 5000)
20718}
20719
20720function showAnimation() {
20721    $('#step08').hide();
20722    $('#step09').fadeIn();
20723    $('#step09').addClass('show-anim');
20724    $('#lottie-animation3').show();
20725    var animation3 = lottie.loadAnimation({
20726        container: document.getElementById('lottie-animation3'), // the dom element
20727        renderer: 'svg', // or 'canvas' or 'html'
20728        loop: true,
20729        autoplay: true,
20730        path: 'https://www.jumpspree.com/public/css/cofetti.json' // replace with your actual path
20731    });
20732    // Set default welcome message
20733    const postContent =
20734        `Just joined Jumpspree 🎉\n\nExcited to see what this new space is all about. Follow me and say hey—I'm new here 👋\n\n#Jumpspree #JustJoined #NewHere`;
20735
20736    // Inject text into the editor or target field
20737    $('#addPostTextarea').text(postContent); // ✅ this is the field your API reads
20738
20739    // Ensure no media selected
20740    $('#imageInput').val('');
20741    $('#videoInput').val('');
20742    $('#gifPreviewBox').hide();
20743
20744    // Uncheck settings
20745    $('#post-setting-box input[type="checkbox"]').prop('checked', false);
20746
20747    // Optionally set user image and name if needed
20748    const username = $('#userNewName').text(); // e.g., "@ChrisRay"
20749    const avatarSrc = $('#userAvtar img').attr('src');
20750    $('.add-post-profile .fig img').attr('src', avatarSrc);
20751    $('.add-post-profile .user-name').text(username);
20752
20753    // ✅ Finally, call your function
20754    handleAddPost(0); // not a draft
20755
20756
20757
20758
20759    setTimeout(function() {
20760        $('#signup-new-process, #step09').fadeOut();
20761        $('#signup-new-process #step01').fadeIn('slow');
20762        $('body').removeClass('overflow-hidden');
20763    }, 5000)
20764
20765}
20766
20767
20768
20769
20770
20771$('.pick-intrest-buttons button').click(function() {
20772    $(this).toggleClass('active')
20773})
20774
20775function showmaybelater() {
20776    $('#step08').hide();
20777    $('#step09').fadeIn();
20778    $('#step09').addClass('show-anim');
20779    $('#lottie-animation3').show();
20780    var animation3 = lottie.loadAnimation({
20781        container: document.getElementById('lottie-animation3'), // the dom element
20782        renderer: 'svg', // or 'canvas' or 'html'
20783        loop: true,
20784        autoplay: true,
20785        path: 'https://www.jumpspree.com/public/css/cofetti.json' // replace with your actual path
20786    });
20787
20788
20789
20790    setTimeout(function() {
20791        $('#signup-new-process, #step09').fadeOut();
20792        $('#signup-new-process #step01').fadeIn('slow');
20793        $('body').removeClass('overflow-hidden');
20794    }, 5000)
20795
20796}
20797</script>
vendor: 2 bytes, line 20797
20797
20798<script>
20799function readURL(input) {
20800    if (input.files && input.files[0]) {
20801        var reader = new FileReader();
20802        reader.onload = function(e) {
20803            $('#imagePreview').css('background-image', 'url(' + e.target.result + ')');
20804            $('#imagePreview').hide();
20805            $('#imagePreview').fadeIn(650);
20806        }
20807        reader.readAsDataURL(input.files[0]);
20808    }
20809}
20810$("#imageUpload").change(function() {
20811    readURL(this);
20812});
20813</script>
vendor: 2 bytes, line 20813
20813
20814<script>
20815$('.scoller-step-4, .scoller-step-5').on('scroll', function() {
20816    var bodyScroll = $(this).scrollTop();
20817    $('#step04 .email-box, #step05 .email-box').scrollTop(bodyScroll);
20818});
20819
20820
20821
20822
20823
20824
20825
20826$(document).ready(function() {
20827    $('#generatebox').on('input', function() {
20828        const inputVal = $(this).val().trim();
20829
20830        if (inputVal.length > 0) {
20831            $('#generateBtn').removeClass('disabled');
20832        } else {
20833            $('#generateBtn').addClass('disabled');
20834        }
20835    });
20836});
20837
20838function regenerateText(val) {
20839
20840    content = $('#generatebox').val();
20841
20842    const $btn = $('#generateBtn');
20843    const $spinner = $('#spinner');
20844    const $text = $('#generateText');
20845
20846    // Show spinner, hide text, disable button
20847
20848
20849    $.ajax({
20850        url: base_url + '/regenerateText',
20851        type: 'POST',
20852        dataType: "Json",
20853        data: {
20854            content: content
20855        },
20856        beforeSend: function() {
20857
20858            if (val == 1) {
20859                $spinner.show();
20860                $text.hide();
20861                $btn.prop('disabled', true);
20862
20863            }
20864            if (val == 2) {
20865                $('#regenerateicon').addClass('iconspin');
20866
20867            }
20868
20869
20870            // $('#footerunfollowbtn').html('<span class="jloader"></span>');
20871
20872        },
20873        success: function(response) {
20874            msg = response.message;
20875            if (response.status) {
20876
20877                reply = response.reply
20878                totalcredit = parseInt(response.totalcredits);
20879                totalcreditremaining = parseInt(response.totalcreditsremaining);
20880                text = totalcreditremaining + '/' + totalcredit;
20881                $('#creditremainingstats').text(text)
20882                $('#generatebox').val(reply)
20883
20884                $('#g-ai-btn').addClass('no-margin').fadeIn('fast');
20885                $('#g-ai-button').hide();
20886
20887
20888
20889            } else {
20890
20891                showNotification('error', response.message);
20892
20893
20894
20895            }
20896
20897
20898        },
20899        error: function(xhr, status, error) {
20900
20901            showNotification('error',
20902                'We encountered an issue while retrieving the response. Please try again shortly.');
20903        },
20904        complete: function() {
20905            $spinner.hide();
20906            $text.show();
20907            $btn.prop('disabled', false);
20908            $('#regenerateicon').removeClass('iconspin');
20909
20910
20911
20912        }
20913    });
20914
20915
20916}
20917
20918function generatewithai() {
20919
20920    clearRepost();
20921    cleanGenerateWithAiBox()
20922
20923    $('#genrate-with-ai-step01').fadeIn('fast');
20924    $('#generateBtn').addClass('disabled');
20925    $.ajax({
20926        url: base_url + '/generatewithai',
20927        type: 'POST',
20928        dataType: "Json",
20929        beforeSend: function() {
20930
20931            // $('#footerunfollowbtn').html('<span class="jloader"></span>');
20932
20933        },
20934        success: function(response) {
20935            msg = response.message;
20936            if (response.status) {
20937                totalcredit = parseInt(response.totalCredit);
20938                totalcreditremaining = parseInt(response.totalCreditremaining);
20939                text = totalcreditremaining + '/' + totalcredit;
20940                $('#creditremainingstats').text(text)
20941                if (totalcreditremaining <= 0) {
20942
20943                    showNotification('error',
20944                        'Insufficient credits. Please buy additional credits to continue.');
20945                    $('#generateBtn').prop('disabled', true);
20946
20947                } else {
20948                    //  $('#generateBtn').prop('disabled', false);
20949
20950                }
20951
20952
20953            } else {
20954
20955                showNotification('error',
20956                    'We encountered an issue while retrieving your number of credits. Please try again shortly.'
20957                    );
20958
20959
20960
20961            }
20962
20963
20964        },
20965        error: function(xhr, status, error) {
20966
20967
20968        }
20969    });
20970
20971
20972
20973
20974}
20975
20976function keepPost() {
20977
20978    const textToCopy = $('#generatebox').val();
20979    $('#addPostTextarea').text(textToCopy);
20980    $('#genrate-with-ai-step01').fadeOut();
20981}
20982
20983function cleanGenerateWithAiBox() {
20984
20985    $('#generatebox').val('');
20986    $('#g-ai-btn').hide('fast');
20987    $('#g-ai-button').show();
20988
20989
20990}
20991
20992function copyPost() {
20993
20994    const textToCopy = $('#generatebox').val();
20995
20996    if (textToCopy == '') {
20997        showNotification('error', 'Please paste something in, then copy with a click!');
20998        return false;
20999    }
21000
21001    if (navigator.clipboard) {
21002        navigator.clipboard.writeText(textToCopy)
21003            .then(function() {
21004
21005                showNotification('success', 'Copied to clipboard.');
21006                // Optional: show tooltip or feedback
21007            })
21008            .catch(function(err) {
21009                showNotification('error', 'We couldn’t copy the text. Please select and copy it manually.');
21010
21011
21012            });
21013    } else {
21014        // Fallback for older browsers
21015        const textarea = document.getElementById('generatebox');
21016        textarea.select();
21017        document.execCommand('copy');
21018    }
21019
21020}
21021
21022
21023
21024
21025
21026function getAIPlans() {
21027
21028
21029    $('#genrate-with-ai-step02').fadeIn('fast')
21030    $.ajax({
21031        url: base_url + '/getaiplans',
21032        type: 'POST',
21033        dataType: "Json",
21034        beforeSend: function() {
21035
21036            // $('#footerunfollowbtn').html('<span class="jloader"></span>');
21037
21038        },
21039        success: function(response) {
21040            msg = response.message;
21041            _html = '';
21042            if (response.status) {
21043
21044                plans = response.plans;
21045                console.log(plans.length)
21046                if (plans.length > 0) {
21047
21048                    $.each(plans, function(i, val) {
21049
21050                        _html += `<li><span><b>$${val.amount} </b> ${val.credittext}`;
21051                        if (val.best == 1) {
21052                            _html +=
21053                                `<span class="best-value"><img src="https://www.jumpspree.com/public/images/star-green.png" alt="Best Value" title="Best Value"> Best value</span>`;
21054                        }
21055
21056                        _html += `</span>
21057                <span><button class="select-plan" data-id="${val.id}"  onclick="selectPlan(this)">Select</button></span>
21058                </li>`
21059
21060
21061
21062
21063                    })
21064
21065
21066
21067
21068                } else {
21069
21070                    _html += `<li>
21071                            <span><b>No Plans</b> available yet</span>
21072                            
21073                        </li>`
21074                }
21075                //    $('#planloader').hide()
21076                $('#planlist').show()
21077                $('#planlist').html(_html)
21078
21079            } else {
21080
21081                //  showNotification('error','We encountered an issue while retrieving the payment plans. Please try again shortly.');
21082
21083
21084
21085            }
21086
21087
21088        },
21089        error: function(xhr, status, error) {
21090
21091            showNotification('error',
21092                'We encountered an issue while retrieving the payment plans. Please try again shortly.');
21093
21094        }
21095    });
21096
21097
21098}
21099var selectedPlan = '';
21100
21101function selectPlan(thisid) {
21102
21103    $('.select-plan').removeClass('active');
21104
21105    // Add active to current
21106    $(thisid).addClass('active');
21107    selectedPlan = $(thisid).data('id');
21108
21109    // alert(selectedPlan)
21110}
21111
21112function buyaiplan() {
21113
21114    if (selectedPlan == '') {
21115        showNotification('error', "Please select a plan to proceed");
21116        return false;
21117    } else {
21118
21119
21120        $.ajax({
21121            url: base_url + '/buyaiplan',
21122            type: 'POST',
21123            dataType: "Json",
21124            data: {
21125                planId: selectedPlan
21126            },
21127            beforeSend: function() {
21128
21129                $('.buy-btn-text').text('Redirecting . . .')
21130
21131                // $('#footerunfollowbtn').html('<span class="jloader"></span>');
21132
21133            },
21134            success: function(response) {
21135                msg = response.message;
21136                if (response.status) {
21137
21138                    link = response.link
21139                    // console.log(link)
21140
21141                    window.location.href = link;
21142
21143                } else {
21144
21145                    showNotification('error',
21146                        'We encountered an issue while retrieving the response. Please try again shortly.'
21147                        );
21148
21149                }
21150
21151
21152            },
21153            error: function(xhr, status, error) {
21154                //  $('#genrate-with-ai-step03').fadeIn('fast');
21155                showNotification('error',
21156                    'We encountered an issue while retrieving the response. Please try again shortly.');
21157            },
21158            complete: function() {
21159
21160                $('.buy-btn-text').text('Buy now')
21161            }
21162        });
21163
21164
21165    }
21166
21167
21168}
21169</script>
vendor: 2 bytes, line 21169
21169
21170<script>
21171$(document).on('click', '#enter-new-password .toggle-password', function() {
21172    const $icon = $(this).find('i');
21173    const targetInput = $($(this).data('target'));
21174
21175    if (targetInput.attr('type') === 'password') {
21176        targetInput.attr('type', 'text');
21177        $icon.removeClass('fa-eye').addClass('fa-eye-slash');
21178    } else {
21179        targetInput.attr('type', 'password');
21180        $icon.removeClass('fa-eye-slash').addClass('fa-eye');
21181    }
21182});
21183
21184$(document).on('click', '#enter-new-password .toggle-password2', function() {
21185    const $icon = $(this).find('i');
21186    const targetInput = $($(this).data('target'));
21187
21188    if (targetInput.attr('type') === 'password') {
21189        targetInput.attr('type', 'text');
21190        $icon.removeClass('fa-eye').addClass('fa-eye-slash');
21191    } else {
21192        targetInput.attr('type', 'password');
21193        $icon.removeClass('fa-eye-slash').addClass('fa-eye');
21194    }
21195});
21196
21197$(document).on('click', '#signin-new-process .toggle-password2', function() {
21198    var $icon = $(this).find('i');
21199    var targetInput = $($(this).data('target'));
21200
21201    if (targetInput.attr('type') === 'password') {
21202        targetInput.attr('type', 'text');
21203        $icon.removeClass('fa-eye').addClass('fa-eye-slash');
21204    } else {
21205        targetInput.attr('type', 'password');
21206        $icon.removeClass('fa-eye-slash').addClass('fa-eye');
21207    }
21208});
21209
21210function cancelSignupProcess() {
21211    $('#signin-new-process').fadeOut();
21212    $('body').removeClass('overflow-hidden');
21213
21214    // Clear all relevant input fields
21215    $('#loginname').val('');
21216    $('#loginpassword').val('');
21217    $('#loginname_validate').text('');
21218    $('#loginpassword_validate').text('');
21219}
21220</script>
vendor: 2 bytes, line 21220
21220
21221<script>
21222function getmorepopup() {
21223    //alert('d')
21224    sessid = '';
21225    if (sessid == '') {
21226        $('#signup-new-process').hide();
21227        $('#signin-new-process').fadeIn('fast');
21228        $('body').addClass('overflow-hidden');
21229    } else {
21230        window.location.href = 'https://www.jumpspree.com/jumpspree-more';
21231    }
21232
21233}
21234
21235
21236
21237function openContentPopup(postId) {
21238    // Build the element ID (like ni1581, ni1582 etc)
21239    let sourceId = "#ni" + postId;
21240
21241    // Clone that post content
21242    let clonedContent = $(sourceId).clone(true, true);
21243
21244    // Replace the popup .email-box with the cloned content
21245    $("#capture .email-box").html(clonedContent.html());
21246
21247    // Finally, show the popup
21248    $("#shareimage").fadeIn();
21249}
21250</script>
21250
21251
21252<!-- ////////////////////////////////////////////////////  LANGUAGE MODEL LOGIC START /////////////////////////////////////////////////////-->
21253<!-- //////////////////////////////////////  LANGUAGE MODEL LOGIC START ////////////////////////////////////// -->
21254
21255<!-- Language & Currency Button -->
21256<button id="langCurrencyBtn" class="langCurrencyBtn" onclick="openLangPopup()">
21257    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" style="display:block;height:16px;width:16px;fill:#fff;">
21258        <path d="M8 .25a7.77 7.77 0 0 1 7.75 7.78 7.75 7.75 0 0 1-7.52 7.72h-.25A7.75 
21259             7.75 0 0 1 .25 8.24v-.25A7.75 7.75 0 0 1 8 .25zm1.95 
21260             8.5h-3.9c.15 2.9 1.17 5.34 1.88 5.5H8c.68 0 1.72-2.37 
21261             1.93-5.23zm4.26 0h-2.76c-.09 1.96-.53 3.78-1.18 
21262             5.08A6.26 6.26 0 0 0 14.17 9zm-9.67 0H1.8a6.26 
21263             6.26 0 0 0 3.94 5.08 12.59 12.59 0 0 1-1.16-4.7l-.03-.38zm1.2-6.58
21264             -.12.05a6.26 6.26 0 0 0-3.83 5.03h2.75c.09-1.83.48-3.54 
21265             1.06-4.81zm2.25-.42c-.7 0-1.78 2.51-1.94 5.5h3.9c-.15-2.9-1.18-5.34
21266             -1.89-5.5h-.07zm2.28.43.03.05a12.95 12.95 0 0 1 1.15 
21267             5.02h2.75a6.28 6.28 0 0 0-3.93-5.07z"></path>
21268    </svg>
21269</button>
21270
21271<!-- Popup -->
21272<div id="langCurrencyPopup" class="popup-overlay notranslate">
21273    <div class="popup-content">
21274        <div class="tabbs-section">
21275            <div class="tabs">
21276                <button class="tab active" data-tab="lang">Language and Region</button>
21277                <button class="tab" data-tab="currency">Currency</button>
21278            </div>
21279            <span id="popupClose"><img src="https://www.jumpspree.com/public/images/close-language.png" alt="Close"
21280                    title="Close"></span>
21281        </div>
21282
21283        <div class="inner-language-box">
21284            <!-- Languages -->
21285            <div id="tab-lang" class="tab-content active">
21286                <h3 class="popup-label">Choose your preferred language</h3>
21287                <div id="allLanguagesContainer"></div>
21288            </div>
21289
21290            <!-- Currency -->
21291            <div id="tab-currency" class="tab-content">
21292                <h3>Choose a currency</h3>
21293                <div id="allCurrencies"></div>
21294            </div>
21295        </div>
21296
21297        <div class="note-language">
21298            <p>Note: Language and currency conversion is a beta feature. Some languages may slightly affect UI labels or
21299                buttons.</p>
21300        </div>
21301    </div>
21302</div>
21303
21304<!-- Hidden Google Translate -->
21305<div id="google_translate_element" style="position:absolute;top:-9999px;left:-9999px;opacity:0;"></div>
21306
21307<!-- //////////////////////////////////////  STYLES  ////////////////////////////////////// -->
21308<style>
21309/* Hide Google Translate artifacts */
21310iframe[id^=":"],
21311.goog-te-banner-frame,
21312.goog-te-balloon-frame,
21313.goog-te-menu-frame,
21314.goog-logo-link,
21315.goog-tooltip,
21316.goog-text-highlight {
21317    display: none !important;
21318    opacity: 0 !important;
21319    visibility: hidden !important;
21320    pointer-events: none !important;
21321}
21322
21323#google_translate_element {
21324    display: none !important;
21325}
21326
21327body {
21328    top: 0px !important;
21329    position: static !important;
21330}
21331
21332/* Popup design */
21333.popup-overlay {
21334    display: none;
21335    position: fixed;
21336    inset: 0;
21337    background: rgba(0, 0, 0, 0.6);
21338    z-index: 9999;
21339    justify-content: center;
21340    align-items: center;
21341}
21342
21343.popup-content {
21344    background: #fff;
21345    border-radius: 10px;
21346    padding: 20px;
21347    width: 90%;
21348    max-width: 480px;
21349    position: relative;
21350}
21351
21352.tabs {
21353    display: flex;
21354    border-bottom: 1px solid #ddd;
21355}
21356
21357.tabs .tab {
21358    flex: 1;
21359    padding: 10px;
21360    cursor: pointer;
21361    text-align: center;
21362    background: #f4f4f4;
21363    border: none;
21364    font-weight: 600;
21365}
21366
21367.tabs .tab.active {
21368    background: #008489;
21369    color: #fff;
21370}
21371
21372.tab-content {
21373    display: none;
21374    margin-top: 15px;
21375}
21376
21377.tab-content.active {
21378    display: block;
21379}
21380
21381#popupClose {
21382    position: absolute;
21383    top: 10px;
21384    right: 15px;
21385    cursor: pointer;
21386}
21387
21388.language-option {
21389    display: flex;
21390    flex-direction: column;
21391    align-items: flex-start;
21392    padding: 10px;
21393    border: 1px solid #ddd;
21394    margin: 5px;
21395    border-radius: 6px;
21396    cursor: pointer;
21397    transition: all 0.2s ease;
21398}
21399
21400.language-option:hover {
21401    background: #f1f1f1;
21402}
21403
21404.language-option.active {
21405    background: #008489;
21406    color: #fff;
21407    font-weight: bold;
21408}
21409
21410.lang-main {
21411    font-size: 14px;
21412}
21413
21414.lang-sub {
21415    font-size: 12px;
21416    color: #666;
21417}
21418
21419#allCurrencies button {
21420    margin: 5px;
21421    padding: 8px 12px;
21422    border-radius: 5px;
21423    border: 1px solid #ccc;
21424    cursor: pointer;
21425}
21426
21427#allCurrencies button.active {
21428    background: #008489;
21429    color: #fff;
21430    border-color: #008489;
21431}
21432</style>
21433<style>
21434.langCurrencyBtn {
21435    position: relative;
21436    background: none;
21437    border: none;
21438}
21439
21440.langCurrencyBtn .touch-area {
21441    display: flex;
21442    align-items: center;
21443    gap: 6px;
21444    padding: 6px 10px;
21445}
21446</style>
21447
21448<!-- //////////////////////////////////////  SCRIPTS  ////////////////////////////////////// -->
21449<script>
21450/* =========  Google Translate Helpers  ========= */
21451function googleTranslateElementInit() {
21452    new google.translate.TranslateElement({
21453        pageLanguage: 'en'
21454    }, 'google_translate_element');
21455}
21456
21457function waitForTranslateSelectAsync(timeout = 12000) {
21458    return new Promise((resolve, reject) => {
21459        const start = Date.now();
21460        (function check() {
21461            const sel = document.querySelector('select.goog-te-combo');
21462            if (sel) return resolve(sel);
21463            if (Date.now() - start > timeout) return reject(new Error('Google translate select not found'));
21464            requestAnimationFrame(check);
21465        })();
21466    });
21467}
21468
21469/*   async function triggerGoogleTranslate(requestedCode) {
21470    try {
21471      const select = await waitForTranslateSelectAsync();
21472      const opts = Array.from(select.options).map(o => o.value);
21473      let val = "en";
21474      if (opts.includes(requestedCode)) val = requestedCode;
21475      else if (opts.includes(requestedCode.split('-')[0])) val = requestedCode.split('-')[0];
21476
21477      select.value = val;
21478      select.dispatchEvent(new Event('input', { bubbles: true }));
21479      select.dispatchEvent(new Event('change', { bubbles: true }));
21480
21481      localStorage.setItem("userLang", requestedCode);
21482      document.getElementById("langCurrencyPopup").style.display = "none";
21483      document.body.classList.remove("overflow-hidden");
21484      console.log("🌐 Language switched:", requestedCode);
21485    } catch (e) {
21486      console.error("Translation trigger failed:", e);
21487    }
21488  } */
21489
21490
21491/* Trigger Translation (Windows-safe fix) */
21492/* Trigger Translation (Windows-safe + Airbnb-style label) */
21493async function triggerGoogleTranslate(requestedCode) {
21494    try {
21495        const select = await waitForTranslateSelectAsync();
21496        const opts = Array.from(select.options).map(o => o.value);
21497        let val = "en";
21498        if (opts.includes(requestedCode)) val = requestedCode;
21499        else if (opts.includes(requestedCode.split('-')[0])) val = requestedCode.split('-')[0];
21500
21501        select.value = val;
21502        // Fire both input and change (needed for Windows Chrome)
21503        select.dispatchEvent(new Event('input', {
21504            bubbles: true
21505        }));
21506        select.dispatchEvent(new Event('change', {
21507            bubbles: true
21508        }));
21509
21510        localStorage.setItem("userLang", requestedCode);
21511        document.getElementById("langCurrencyPopup").style.display = "none";
21512        document.body.classList.remove("overflow-hidden");
21513        console.log("🌐 Language switched:", requestedCode);
21514
21515        // ✅ Find full display name like Airbnb ("हिन्दी (भारत)")
21516        const langObj = languages.find(l =>
21517            l.code === requestedCode || l.code.split('-')[0] === requestedCode.split('-')[0]
21518        );
21519
21520        if (langObj && document.getElementById("langName")) {
21521            const displayText = langObj.country ?
21522                `${langObj.language} (${langObj.country})` :
21523                langObj.language;
21524
21525            // Update text instantly — no short codes anymore
21526            document.getElementById("langName").textContent = displayText;
21527
21528            // Save pretty label for next time
21529            localStorage.setItem("selectedLanguage", JSON.stringify(langObj));
21530        } else {
21531            console.warn("⚠️ No matching language object found for:", requestedCode);
21532            document.getElementById("langName").textContent = requestedCode;
21533        }
21534
21535    } catch (e) {
21536        console.error("Translation trigger failed:", e);
21537    }
21538}
21539
21540
21541
21542
21543
21544/* =========  Popup Open / Close  ========= */
21545const popupLangEl = document.getElementById("langCurrencyPopup");
21546
21547function openLangPopup() {
21548
21549    if (!popupLangEl) {
21550        console.error("❌ Popup element #langCurrencyPopup not found!");
21551        return;
21552    }
21553    console.log("⚙️ Opening popup...");
21554
21555    loadLanguages(localStorage.getItem("userLang") || "en-IN");
21556    loadCurrencies(localStorage.getItem("userCurrency") || "INR");
21557    popupLangEl.style.display = "flex";
21558    document.body.classList.add("overflow-hidden");
21559    console.log("🎉 Popup opened successfully!");
21560    document.querySelector(".blog-side-menu").classList.remove("blog-side-menu-show");
21561}
21562
21563document.getElementById("popupClose").addEventListener("click", () => {
21564    popupLangEl.style.display = "none";
21565    document.body.classList.remove("overflow-hidden");
21566});
21567
21568/* =========  Tab Switching  ========= */
21569document.querySelectorAll(".tabs .tab").forEach(tab => {
21570    tab.addEventListener("click", () => {
21571        document.querySelectorAll(".tabs .tab").forEach(t => t.classList.remove("active"));
21572        document.querySelectorAll(".tab-content").forEach(c => c.classList.remove("active"));
21573        tab.classList.add("active");
21574        document.getElementById("tab-" + tab.dataset.tab).classList.add("active");
21575    });
21576});
21577/* =========  Languages & Currencies Data (Localized Country Names)  ========= */
21578var languages = [
21579    // English Variants
21580    {
21581        code: "en-US",
21582        language: "English",
21583        country: "United States"
21584    },
21585    {
21586        code: "en-IN",
21587        language: "English",
21588        country: "India"
21589    },
21590    {
21591        code: "en-AU",
21592        language: "English",
21593        country: "Australia"
21594    },
21595    {
21596        code: "en-CA",
21597        language: "English",
21598        country: "Canada"
21599    },
21600    {
21601        code: "en-GB",
21602        language: "English",
21603        country: "United Kingdom"
21604    },
21605    {
21606        code: "en-SG",
21607        language: "English",
21608        country: "Singapore"
21609    },
21610    {
21611        code: "en-IE",
21612        language: "English",
21613        country: "Ireland"
21614    },
21615    {
21616        code: "en-NZ",
21617        language: "English",
21618        country: "New Zealand"
21619    },
21620
21621    // Indian Languages (localized)
21622    {
21623        code: "hi",
21624        language: "हिन्दी",
21625        country: "भारत"
21626    },
21627    {
21628        code: "ta",
21629        language: "தமிழ்",
21630        country: "இந்தியா"
21631    },
21632    {
21633        code: "te",
21634        language: "తెలుగు",
21635        country: "భారతదేశం"
21636    },
21637    {
21638        code: "bn",
21639        language: "বাংলা",
21640        country: "ভারত"
21641    },
21642    {
21643        code: "mr",
21644        language: "मराठी",
21645        country: "भारत"
21646    },
21647    {
21648        code: "kn",
21649        language: "ಕನ್ನಡ",
21650        country: "ಭಾರತ"
21651    },
21652    {
21653        code: "gu",
21654        language: "ગુજરાતી",
21655        country: "ભારત"
21656    },
21657    {
21658        code: "pa",
21659        language: "ਪੰਜਾਬੀ",
21660        country: "ਭਾਰਤ"
21661    },
21662    {
21663        code: "ml",
21664        language: "മലയാളം",
21665        country: "ഇന്ത്യ"
21666    },
21667    {
21668        code: "ur",
21669        language: "اردو",
21670        country: "پاکستان / بھارت"
21671    },
21672    {
21673        code: "or",
21674        language: "ଓଡ଼ିଆ",
21675        country: "ଭାରତ"
21676    },
21677    {
21678        code: "as",
21679        language: "অসমীয়া",
21680        country: "ভাৰত"
21681    },
21682
21683    // Spanish Variants
21684    {
21685        code: "es-ES",
21686        language: "Español",
21687        country: "España"
21688    },
21689    {
21690        code: "es-MX",
21691        language: "Español",
21692        country: "México"
21693    },
21694    {
21695        code: "es-AR",
21696        language: "Español",
21697        country: "Argentina"
21698    },
21699    {
21700        code: "es-CO",
21701        language: "Español",
21702        country: "Colombia"
21703    },
21704    {
21705        code: "es-CL",
21706        language: "Español",
21707        country: "Chile"
21708    },
21709    {
21710        code: "es-PE",
21711        language: "Español",
21712        country: "Perú"
21713    },
21714    {
21715        code: "es-US",
21716        language: "Español",
21717        country: "Estados Unidos"
21718    },
21719
21720    // French Variants
21721    {
21722        code: "fr-FR",
21723        language: "Français",
21724        country: "France"
21725    },
21726    {
21727        code: "fr-CA",
21728        language: "Français",
21729        country: "Canada"
21730    },
21731    {
21732        code: "fr-BE",
21733        language: "Français",
21734        country: "Belgique"
21735    },
21736    {
21737        code: "fr-CH",
21738        language: "Français",
21739        country: "Suisse"
21740    },
21741    {
21742        code: "fr-LU",
21743        language: "Français",
21744        country: "Luxembourg"
21745    },
21746
21747    // German Variants
21748    {
21749        code: "de-DE",
21750        language: "Deutsch",
21751        country: "Deutschland"
21752    },
21753    {
21754        code: "de-AT",
21755        language: "Deutsch",
21756        country: "Österreich"
21757    },
21758    {
21759        code: "de-CH",
21760        language: "Deutsch",
21761        country: "Schweiz"
21762    },
21763
21764    // Portuguese
21765    {
21766        code: "pt-PT",
21767        language: "Português",
21768        country: "Portugal"
21769    },
21770    {
21771        code: "pt-BR",
21772        language: "Português",
21773        country: "Brasil"
21774    },
21775
21776    // Chinese Variants
21777    {
21778        code: "zh-CN",
21779        language: "简体中文",
21780        country: "中国"
21781    },
21782    {
21783        code: "zh-TW",
21784        language: "繁體中文",
21785        country: "台灣"
21786    },
21787    {
21788        code: "zh-HK",
21789        language: "繁體中文",
21790        country: "香港"
21791    },
21792
21793    // Other Major Languages
21794    {
21795        code: "ja",
21796        language: "日本語",
21797        country: "日本"
21798    },
21799    {
21800        code: "ko",
21801        language: "한국어",
21802        country: "대한민국"
21803    },
21804    {
21805        code: "ru",
21806        language: "Русский",
21807        country: "Россия"
21808    },
21809    {
21810        code: "uk",
21811        language: "Українська",
21812        country: "Україна"
21813    },
21814    {
21815        code: "it",
21816        language: "Italiano",
21817        country: "Italia"
21818    },
21819    {
21820        code: "nl",
21821        language: "Nederlands",
21822        country: "Nederland"
21823    },
21824    {
21825        code: "sv",
21826        language: "Svenska",
21827        country: "Sverige"
21828    },
21829    {
21830        code: "da",
21831        language: "Dansk",
21832        country: "Danmark"
21833    },
21834    {
21835        code: "fi",
21836        language: "Suomi",
21837        country: "Suomi"
21838    },
21839    {
21840        code: "no",
21841        language: "Norsk",
21842        country: "Norge"
21843    },
21844    {
21845        code: "tr",
21846        language: "Türkçe",
21847        country: "Türkiye"
21848    },
21849    {
21850        code: "el",
21851        language: "Ελληνικά",
21852        country: "Ελλάδα"
21853    },
21854    {
21855        code: "pl",
21856        language: "Polski",
21857        country: "Polska"
21858    },
21859    {
21860        code: "cs",
21861        language: "Čeština",
21862        country: "Česká republika"
21863    },
21864    {
21865        code: "ro",
21866        language: "Română",
21867        country: "România"
21868    },
21869    {
21870        code: "hu",
21871        language: "Magyar",
21872        country: "Magyarország"
21873    },
21874    {
21875        code: "bg",
21876        language: "Български",
21877        country: "България"
21878    },
21879    {
21880        code: "sr",
21881        language: "Српски",
21882        country: "Србија"
21883    },
21884    {
21885        code: "hr",
21886        language: "Hrvatski",
21887        country: "Hrvatska"
21888    },
21889    {
21890        code: "he",
21891        language: "עברית",
21892        country: "ישראל"
21893    },
21894    {
21895        code: "ar",
21896        language: "العربية",
21897        country: "السعودية"
21898    },
21899    {
21900        code: "fa",
21901        language: "فارسی",
21902        country: "ایران"
21903    },
21904    {
21905        code: "th",
21906        language: "ไทย",
21907        country: "ประเทศไทย"
21908    },
21909    {
21910        code: "vi",
21911        language: "Tiếng Việt",
21912        country: "Việt Nam"
21913    },
21914    {
21915        code: "id",
21916        language: "Bahasa Indonesia",
21917        country: "Indonesia"
21918    },
21919    {
21920        code: "ms",
21921        language: "Bahasa Melayu",
21922        country: "Malaysia"
21923    },
21924    {
21925        code: "fil",
21926        language: "Filipino",
21927        country: "Pilipinas"
21928    },
21929    {
21930        code: "sw",
21931        language: "Kiswahili",
21932        country: "Kenya"
21933    }
21934];
21935
21936
21937function loadLanguages(selected) {
21938    const container = document.getElementById("allLanguagesContainer");
21939    container.innerHTML = "";
21940    languages.forEach(lang => {
21941        const btn = document.createElement("button");
21942        btn.className = "language-option";
21943        btn.innerHTML =
21944            `<div class="lang-main">${lang.language}</div><div class="lang-sub">${lang.country}</div>`;
21945        if (selected === lang.code) btn.classList.add("active");
21946        btn.onclick = () => {
21947            document.querySelectorAll(".language-option").forEach(b => b.classList.remove("active"));
21948            btn.classList.add("active");
21949            triggerGoogleTranslate(lang.code);
21950        };
21951        container.appendChild(btn);
21952    });
21953}
21954
21955/* =========  Currencies  ========= */
21956const CURRENCIES = ["USD", "EUR", "GBP", "JPY", "AUD", "CAD", "INR", "CNY", "BRL", "SGD"];
21957
21958function loadCurrencies(selected) {
21959    const container = document.getElementById("allCurrencies");
21960    container.innerHTML = "";
21961    CURRENCIES.forEach(cur => {
21962        const b = document.createElement("button");
21963        b.textContent = cur;
21964        if (selected === cur) b.classList.add("active");
21965        b.onclick = () => {
21966            document.querySelectorAll("#allCurrencies button").forEach(bb => bb.classList.remove("active"));
21967            b.classList.add("active");
21968            localStorage.setItem("userCurrency", cur);
21969            console.log("💰 Currency set:", cur);
21970            popupLangEl.style.display = "none";
21971            document.body.classList.remove("overflow-hidden");
21972        };
21973        container.appendChild(b);
21974    });
21975}
21976
21977/* =========  Restore saved language on load  ========= */
21978window.addEventListener("load", () => {
21979    const saved = localStorage.getItem("userLang");
21980    if (saved) setTimeout(() => triggerGoogleTranslate(saved), 2000);
21981});
21982</script>
21982
21983
21984<!-- Google Translate script loaded in header.php — removed duplicate here -->
21985
21986<!-- //////////////////////////////////////  LANGUAGE MODEL LOGIC END ////////////////////////////////////// -->
21987
21988<!-- IMG AND VID DRAG ON ADD POST DIV -->
21989
21990<style>
21991.social-popup.image-entered .add-post-inner {
21992    /*    opacity: 0.5;*/
21993}
21994
21995div#social-popup .add-post-inner {
21996    transition: all 0.3s ease;
21997}
21998
21999.show-placeholder {
22000    display: none
22001}
22002
22003.social-popup.image-entered .add-post-inner .show-placeholder {
22004    display: block;
22005    position: absolute;
22006    width: 100px;
22007    left: 50%;
22008    top: 50%;
22009    z-index: 999;
22010    transform: translate(-50%, -50%);
22011    filter: invert(1) brightness(0.4);
22012}
22013
22014.social-popup.image-entered .add-post-inner #add-post-full-container,
22015.social-popup.image-entered .popup-top-header,
22016.social-popup.image-entered #post-footer-for-post,
22017.social-popup.image-entered .header-add-post {
22018    opacity: 0.1
22019}
22020
22021.social-popup.image-entered .header-post.social-add-header {
22022    background: url(https://www.jumpspree.com/public/home-assets/image-gallery.png?ver:1.03);
22023    background-size: 102px;
22024    background-repeat: no-repeat;
22025    background-position: center;
22026}
22027
22028#social-popup div#imagePreviewBox {
22029    max-width: 98%;
22030}
22031
22032#addPostTextarea.drag-over {
22033    border: 2px dashed #555;
22034    /* padding-bottom: 80px !important; */
22035}
22036</style>
22037
22038
22039
22040<script>
22041const addPostArea = document.getElementById('add-post-div');
22042const addPostTextArea = document.getElementById('addPostTextarea');
22043var postAreaDragCounter = 0;
22044
22045
22046addPostArea.addEventListener('dragenter', e => {
22047    e.preventDefault();
22048    postAreaDragCounter++;
22049    addPostTextArea.classList.add('drag-over');
22050    $('#social-popup').addClass('image-entered');
22051});
22052
22053addPostArea.addEventListener('dragleave', e => {
22054    e.preventDefault();
22055    postAreaDragCounter--;
22056    if (postAreaDragCounter === 0) {
22057        addPostTextArea.classList.remove('drag-over');
22058        $('#social-popup').removeClass('image-entered');
22059    }
22060});
22061
22062addPostArea.addEventListener('dragover', e => {
22063    e.preventDefault();
22064    //$('#social-popup').removeClass('image-entered');
22065});
22066
22067addPostArea.addEventListener('drop', e => {
22068    e.preventDefault();
22069    addPostTextArea.classList.remove('drag-over');
22070    postAreaDragCounter = 0;
22071
22072    const file = e.dataTransfer.files[0];
22073    if (!file) return;
22074
22075    if (file.type.startsWith('image/')) {
22076        const imageInp = document.getElementById('imageInput');
22077
22078        imageInp.files = e.dataTransfer.files;
22079        imageInp.dispatchEvent(new Event('change'));
22080
22081    } else if (file.type.startsWith('video/')) {
22082        const videoInp = document.getElementById('videoInput');
22083
22084        videoInp.files = e.dataTransfer.files;
22085        videoInp.dispatchEvent(new Event('change'));
22086    }
22087
22088    $('#social-popup').removeClass('image-entered');
22089
22090});
22091</script>
22091
22092
22093<!-- Interests and Links js -->
22094
22095<script>
22096$('.add-intrest-input').focus(function() {
22097    $('.inner-topic-full-wrapper').addClass('add-topic-active');
22098    $('.inner-topic-search').addClass('inner-topic-search-active');
22099    //$('.inner-topic-search .search-topic input').focus();
22100})
22101$('.inner-topic-search .cancel-topic').click(function() {
22102    $('.inner-topic-full-wrapper').removeClass('add-topic-active');
22103    $('.inner-topic-search').removeClass('inner-topic-search-active');
22104})
22105$('.add-intrest-input').keypress(function() {
22106    $('.dropdwn-intrest').slideDown()
22107})
22108$('.dropdwn-intrest li').click(function() {
22109    $('.dropdwn-intrest').hide();
22110})
22111
22112function handleAddLinksButtonClick() {
22113    if ($("#add-links .all-links .link-detail").length >= 8) {
22114        return;
22115    }
22116
22117    $("#add-link-new-popup input").val("");
22118
22119    $('#add-link-new-popup').slideToggle();
22120
22121    /*$('#add-links-popup').fadeIn('fast')
22122    setTimeout(function(){
22123    $('#add-links-popup .inner-link-section').addClass('showMe')
22124    },100)*/
22125}
22126
22127var deleteLinks = [];
22128var newlyCreatedLinks = [];
22129var updatedLinks = [];
22130
22131var deleteInterests = [];
22132var newlyCreatedInterests = [];
22133
22134var trendingInterests = [];
22135var originalInterestsSearchItems = [];
22136
22137
22138function renderLinksAssociated(links) {
22139    let container = $("#add-links .all-links");
22140    container.empty();
22141
22142    if (links.length === 0) {
22143        $("#add-links .your-links").hide();
22144        return;
22145    } else {
22146        $("#add-links .your-links").show();
22147    }
22148
22149    links.forEach(link => {
22150        let favicon = getFaviconFromGoogle(link.link);
22151
22152        let html = `
22153                <div class="link-detail" data-id=${link.id}>
22154                    <div class="link-left">
22155                        <div class="link-logo">
22156                            <img src="${favicon}" alt="" onerror="this.classList.add('no-image'); this.src='https://www.jumpspree.com/public/images/link-icon2.png?ver:1.027'">
22157                        </div>
22158                        <div class="link-desc">
22159                            <span>${link.title}</span>
22160                            <span class="url">${link.link}</span>
22161                        </div>
22162                    </div>
22163                    <div class="right-link">
22164                        <a href="javascript:void(0)" onclick="openEditPopup(${link.id}, '${link.title}', '${link.link}')">
22165                            <i class="hgi hgi-stroke hgi-pencil-edit-02"></i>
22166                        </a>
22167                        <a href="#" class="delete-btn" onclick="handleLinkDelete(${link.id}, this)">
22168                            <i class="hgi hgi-stroke hgi-delete-02"></i>
22169                        </a>
22170                    </div>
22171                </div>
22172            `;
22173
22174        container.append(html);
22175    });
22176}
22177
22178function renderInterestsAssociated(interests) {
22179    const $list = $(".all-topics ul");
22180
22181    if (interests.length === 0) {
22182        $("#add-intrest .your-topics").hide();
22183        return;
22184    } else {
22185        $("#add-intrest .your-topics").show();
22186    }
22187
22188    $list.empty();
22189
22190    interests.forEach(interest => {
22191        const li = `
22192            <li class="d-flex justify-content-between" data-id=${interest.attached_id}>
22193                <span>${interest.tags}</span>
22194                <span>
22195                <a href="#" class="delete-btn" onclick="handleInterestDelete(${interest.attached_id}, this)">
22196                    <i class="hgi hgi-stroke hgi-delete-02"></i>
22197                </a>
22198                </span>
22199            </li>
22200            `;
22201        $list.append(li);
22202
22203    });
22204}
22205
22206
22207function getFaviconFromGoogle(url) {
22208    try {
22209        const parsed = new URL(url);
22210        return `https://www.google.com/s2/favicons?sz=64&domain=${parsed.hostname}`;
22211    } catch (e) {
22212        return 'https://www.jumpspree.com/public/images/link-icon2.png?ver:1.027';
22213    }
22214}
22215
22216
22217function displayUserInterests() {
22218
22219    $.ajax({
22220        url: base_url + '/getUserInterests',
22221        type: 'GET',
22222        dataType: 'json',
22223        success: function(response) {
22224            if (response.status && response.interests) {
22225                console.log(response.interests);
22226                renderInterestsAssociated(response.interests);
22227            } else {
22228                //$(".all-links").html("<p>No links found.</p>");
22229            }
22230        },
22231        error: function() {
22232            //$(".all-links").html("<p>Error loading links.</p>");
22233        }
22234    });
22235}
22236
22237function displayUserLinks() {
22238
22239    $.ajax({
22240        url: base_url + '/getUserLinks',
22241        type: 'GET',
22242        dataType: 'json',
22243        success: function(response) {
22244            if (response.status && response.links) {
22245                console.log();
22246                renderLinksAssociated(response.links);
22247            } else {
22248                //$(".all-links").html("<p>No links found.</p>");
22249            }
22250        },
22251        error: function() {
22252            //$(".all-links").html("<p>Error loading links.</p>");
22253        }
22254    });
22255}
22256
22257function handleInterestDelete(id, el, temp = false) {
22258    if (!temp) {
22259        deleteInterests.push(id);
22260    } else {
22261        newlyCreatedInterests = newlyCreatedInterests.filter(i => i.id != id);
22262    }
22263
22264    $(el).closest("li").remove();
22265    console.log("deleteInterests array:", deleteInterests);
22266    console.log("newlyCreatedInterests:", newlyCreatedInterests);
22267
22268
22269    if ($("#add-intrest .all-topics li").length === 0) {
22270        $("#add-intrest .your-topics").hide();
22271    }
22272
22273
22274}
22275
22276function handleInterestAllDelete() {
22277    const $allLis = $("#add-intrest .all-topics ul li");
22278
22279    $allLis.each(function() {
22280        let id = $(this).data("id");
22281        if (id !== undefined && id !== null) {
22282            deleteInterests.push(id);
22283        }
22284    });
22285
22286    $("#add-intrest .all-topics ul").empty();
22287    console.log("deleteInterests array:", deleteInterests);
22288    console.log("newlyCreatedInterests:", newlyCreatedInterests);
22289
22290    $("#add-intrest .your-topics").hide();
22291
22292}
22293
22294function handleLinkDelete(id, el, temp = false) {
22295    if (!temp) {
22296        deleteLinks.push(id);
22297        updatedLinks = updatedLinks.filter(link => link.id !== id);
22298    } else {
22299        newlyCreatedLinks = newlyCreatedLinks.filter(link => link.tempId != id);
22300    }
22301
22302    $(el).closest(".link-detail").remove();
22303
22304    if ($("#add-links .link-detail").length === 0) {
22305        $("#add-links .your-links").hide();
22306    }
22307
22308
22309    console.log("deleteLinks array:", deleteLinks);
22310    console.log("newlyCreatedLinks:", newlyCreatedLinks);
22311    console.log("updatedLinks:", updatedLinks);
22312}
22313
22314function openEditPopup(id, title, link) {
22315    $("#add-link-new-popup input[placeholder='Title']").val(title);
22316    $("#add-link-new-popup input[placeholder='Link']").val(link);
22317
22318    $("#add-link-new-popup").attr("data-edit-id", id);
22319
22320    $("#add-link-new-popup").slideToggle();
22321    // setTimeout(function(){
22322    // $('#add-link-new-popup .inner-link-section').addClass('showMe')
22323    // },100)
22324}
22325
22326$(document).on("click", "#save-link-btn", function(e) {
22327    e.preventDefault();
22328    let popup = $("#add-link-new-popup");
22329    let id = popup.attr("data-edit-id");
22330    let newTitle = popup.find("input[placeholder='Title']").val().trim();
22331    let newLink = popup.find("input[placeholder='Link']").val().trim();
22332
22333    if (!newTitle || newTitle.length === 0) {
22334        alert("Please enter a title");
22335        return;
22336    }
22337
22338    const urlPattern = /^(https?:\/\/)?([\w\-]+\.)+[a-z]{2,}(\/.*)?$/i;
22339
22340    if (!newLink || !urlPattern.test(newLink)) {
22341        alert("Please enter a valid URL (something like https://example.com).");
22342        return;
22343    }
22344
22345    let normalizedUrl = newLink;
22346    if (normalizedUrl && !/^https?:\/\//i.test(normalizedUrl)) {
22347        normalizedUrl = "https://" + normalizedUrl;
22348    }
22349
22350
22351    let favicon = getFaviconFromGoogle(normalizedUrl);
22352
22353    if (id) {
22354        // --- update existing ---
22355        let linkDiv = $(`#add-links .all-links .link-detail[data-id='${id}']`);
22356        linkDiv.find(".link-desc span:first").text(newTitle);
22357        linkDiv.find(".link-desc .url").text(newLink);
22358        linkDiv.find(".link-logo img").attr("src", favicon).on("error", function() {
22359            $(this).off("error"); // prevent infinite loop
22360            $(this).attr("src", "https://www.jumpspree.com/public/images/link-icon2.png?ver=1.027");
22361            $(this).addClass("no-image");
22362        });
22363
22364        linkDiv.find(".right-link a:first").attr(
22365            "onclick",ß
22366            `openEditPopup('${id}', '${newTitle}', '${newLink}')`
22367        );
22368
22369        let existingIndex = updatedLinks.findIndex(l => l.id === id);
22370        if (existingIndex !== -1) {
22371            // update existing entry
22372            updatedLinks[existingIndex].title = newTitle;
22373            updatedLinks[existingIndex].link = newLink;
22374        } else {
22375            // push new entry
22376            updatedLinks.push({
22377                id: id,
22378                title: newTitle,
22379                link: newLink
22380            });
22381        }
22382
22383        console.log("updatedLinks array:", updatedLinks);
22384    } else {
22385        // --- create new ---
22386        // (generate a temporary unique id, backend will replace later)
22387        let tempId = "new" + Date.now();
22388
22389        let html = `
22390                <div class="link-detail" data-id="${tempId}">
22391                    <div class="link-left">
22392                        <div class="link-logo">
22393                            <img src="${favicon}" alt="" 
22394                                onerror="this.classList.add('no-image'); this.src='https://www.jumpspree.com/public/images/link-icon2.png?ver:1.027'">
22395                        </div>
22396                        <div class="link-desc">
22397                            <span>${newTitle}</span>
22398                            <span class="url">${newLink}</span>
22399                        </div>
22400                    </div>
22401                    <div class="right-link">
22402                        <a href="javascript:void(0)" onclick="openEditPopup('${tempId}', '${newTitle}', '${newLink}')">
22403                            <i class="hgi hgi-stroke hgi-pencil-edit-02"></i>
22404                        </a>
22405                        <a href="#" class="delete-btn" onclick="handleLinkDelete('${tempId}', this, true)">
22406                            <i class="hgi hgi-stroke hgi-delete-02"></i>
22407                        </a>
22408                    </div>
22409                </div>
22410            `;
22411
22412        $("#add-links .all-links").append(html);
22413
22414        newlyCreatedLinks.push({
22415            tempId: tempId,
22416            title: newTitle,
22417            link: newLink
22418        });
22419        console.log("newlyCreatedLinks array:", newlyCreatedLinks);
22420
22421    }
22422
22423    popup.hide().removeAttr("data-edit-id");
22424    popup.find("input").val("");
22425    $("#add-links .your-links").show();
22426    $('.inner-link-section').removeClass('showMe');
22427});
22428
22429
22430// BOOT: defer displayUserLinks, displayUserInterests, get-topic-list until after feed renders — 2026-05-15
22431// ROLLBACK: replace the three defer() calls below with direct calls:
22432//   displayUserLinks();  displayUserInterests();  $.ajax({ url: ... get-topic-list ... });
22433// and restore the $(document).ready wrapper around them.
22434(function () {
22435    var loadTopicList = function () {
22436        $.ajax({
22437            url: base_url + "/get-topic-list",
22438            type: "GET",
22439            success: function(res) {
22440                console.log("Trending Interests:", res);
22441
22442                const $list = $("#add-intrest .dropdown-serach-result ul");
22443                $list.empty(); // clear old list
22444
22445                res.trending.forEach(topic => {
22446                    $list.append(
22447                        `<li data-id=${topic.topic_id}><a href="#">${topic.topic_name}</a></li>`
22448                        );
22449                });
22450
22451                res.others.forEach(topic => {
22452                    $list.append(
22453                        `<li data-id=${topic.topic_id}><a href="#">${topic.topic_name}</a></li>`
22454                        );
22455                });
22456
22457                originalInterestsSearchItems = $list.children().clone();
22458            }
22459        });
22460    };
22461
22462    if (window.JumpSocialBoot) {
22463        // Staggered low-priority idle-deferred calls — only populate profile-edit dropdowns
22464        window.JumpSocialBoot.defer(displayUserLinks,    'low', true);
22465        window.JumpSocialBoot.defer(displayUserInterests,'low', true);
22466        window.JumpSocialBoot.defer(loadTopicList,       'low', true);
22467    } else {
22468        // Fallback: no orchestrator (other pages) — fire immediately on ready
22469        $(document).ready(function () {
22470            displayUserLinks();
22471            displayUserInterests();
22472            loadTopicList();
22473        });
22474    }
22475}());
22476
22477
22478function handleAddLinksSave() {
22479    // delete existing links
22480    let requests = [];
22481
22482    if (deleteLinks.length > 0) {
22483        let req = $.ajax({
22484            url: base_url + "/deleteUserLinks",
22485            type: "POST",
22486            data: {
22487                link_id: deleteLinks
22488            }, // send array of ids
22489            success: function(res) {
22490                console.log("Deleted links response:", res);
22491                deleteLinks = [];
22492            }
22493        });
22494
22495        requests.push(req);
22496    }
22497
22498    // save newly created links
22499    if (newlyCreatedLinks.length > 0) {
22500        let titles = [];
22501        let links = [];
22502
22503        newlyCreatedLinks.forEach(link => {
22504            titles.push(link.title);
22505            links.push(link.link);
22506        });
22507
22508        let req = $.ajax({
22509            url: base_url + "/saveUserLinks",
22510            type: "POST",
22511            data: {
22512                title: titles,
22513                link: links
22514            }, // send array of {title, link}
22515            success: function(res) {
22516                console.log("New links saved:", res);
22517                newlyCreatedLinks = [];
22518
22519            }
22520        });
22521
22522        requests.push(req);
22523
22524    }
22525
22526    // update edited links
22527    if (updatedLinks.length > 0) {
22528        let ids = [];
22529        let titles = [];
22530        let links = [];
22531
22532        updatedLinks.forEach(link => {
22533            ids.push(link.id);
22534            titles.push(link.title);
22535            links.push(link.link);
22536        });
22537
22538        let req = $.ajax({
22539            url: base_url + "/updateUserLinks",
22540            type: "POST",
22541            data: {
22542                ids: ids,
22543                titles: titles,
22544                links: links
22545            }, // send array of {id, title, link}
22546            success: function(res) {
22547                console.log("Updated links response:", res);
22548                updatedLinks = [];
22549
22550            }
22551        });
22552
22553        requests.push(req);
22554
22555    }
22556
22557    if (requests.length > 0) {
22558        $.when.apply($, requests).done(function() {
22559            console.log("All requests done");
22560            location.reload();
22561        }).fail(function(err) {
22562            console.error("One of the requests failed:", err);
22563        });
22564    }
22565
22566    $('#add-links').fadeOut();
22567    //location.reload();
22568
22569}
22570
22571function handleAddInterestsSave() {
22572    let requests = [];
22573
22574    // delete existing interests
22575    if (deleteInterests.length > 0) {
22576        let req = $.ajax({
22577            url: base_url + "/deleteUserInterests",
22578            type: "POST",
22579            data: {
22580                interest_id: deleteInterests
22581            }, // send array of ids
22582            success: function(res) {
22583                console.log("Deleted interests response:", res);
22584                deleteInterests = [];
22585            }
22586        });
22587
22588        requests.push(req);
22589    }
22590
22591    // save newly created interests
22592    if (newlyCreatedInterests.length > 0) {
22593        let ids = [];
22594        let tags = [];
22595        let isNew = [];
22596
22597        newlyCreatedInterests.forEach(item => {
22598            ids.push(item.id);
22599            tags.push(item.tag);
22600            isNew.push(item.isNew ? 1 : 0);
22601        });
22602
22603        let req = $.ajax({
22604            url: base_url + "/saveUserInterests",
22605            type: "POST",
22606            data: {
22607                ids: ids,
22608                tags: tags,
22609                isNew: isNew
22610            },
22611            dataType: "json",
22612            success: function(res) {
22613                console.log("New links interests:", res);
22614                newlyCreatedInterests = [];
22615            }
22616        });
22617
22618        requests.push(req);
22619    }
22620
22621    if (requests.length > 0) {
22622        $.when.apply($, requests).done(function() {
22623            console.log("All requests done");
22624            location.reload();
22625        }).fail(function(err) {
22626            console.error("One of the requests failed:", err);
22627        });
22628    }
22629
22630    $('#add-intrest').fadeOut();
22631
22632}
22633
22634$(document).ready(function() {
22635    const $input = $("#add-intrest .search-topic-header input");
22636    const $list = $("#add-intrest .dropdown-serach-result ul");
22637
22638    $input.on("input", function() {
22639        let query = $(this).val().toLowerCase().trim();
22640        $list.empty(); // clear current list
22641
22642        if (query === "") {
22643            // restore all original items if input is empty
22644            $list.append(originalInterestsSearchItems.clone());
22645            return;
22646        }
22647
22648        // filter original items by query
22649        let matched = originalInterestsSearchItems.filter(function() {
22650            return $(this).text().toLowerCase().includes(query);
22651        });
22652
22653        if (matched.length > 0) {
22654            $list.append(matched.clone());
22655        } else {
22656            // no match → show "Add new topic" option
22657            const newLi = `
22658                    <li>
22659                    <a href="#">${query}</a>
22660                    <div class="add-topic">Add new topic</div>
22661                    </li>`;
22662            $list.append(newLi);
22663        }
22664    });
22665});
22666
22667$(document).on("click", "#add-intrest .dropdown-serach-result li", function(e) {
22668    e.preventDefault();
22669
22670    $('.inner-topic-full-wrapper').removeClass('add-topic-active');
22671    $('.inner-topic-search').removeClass('inner-topic-search-active');
22672    let $li = $(this);
22673
22674    let topicName = $(this).find("a").text().trim();
22675    if (!topicName) return;
22676
22677    let exists = false;
22678    $("#add-intrest .all-topics ul li span:first-child").each(function() {
22679        if ($(this).text().trim().toLowerCase() === topicName.toLowerCase()) {
22680            exists = true;
22681            return false;
22682        }
22683    });
22684
22685    if (exists) {
22686        // already added → just reset search list & exit
22687        $("#add-intrest .search-topic-header input").val("");
22688        const $searchList = $("#add-intrest .dropdown-serach-result ul");
22689        $searchList.empty().append(originalInterestsSearchItems.clone());
22690        return;
22691    }
22692
22693    let topicId = $li.data("id");
22694    let tempId = topicId;
22695    if (topicId) {
22696        newlyCreatedInterests.push({
22697            id: topicId,
22698            tag: topicName,
22699            isNew: false
22700        });
22701    } else {
22702        tempId = "new" + Date.now();
22703        newlyCreatedInterests.push({
22704            id: tempId,
22705            tag: topicName,
22706            isNew: true
22707        });
22708    }
22709
22710    console.log('Newly Created INterests: ', newlyCreatedInterests);
22711
22712    const newLi = `
22713            <li class="d-flex justify-content-between">
22714            <span>${topicName}</span>
22715            <span>
22716                <a href="#" class="delete-btn" onclick="handleInterestDelete(${tempId}, this, true)">
22717                <i class="hgi hgi-stroke hgi-delete-02"></i>
22718                </a>
22719            </span>
22720            </li>
22721        `;
22722
22723    $("#add-intrest .all-topics ul").append(newLi);
22724
22725    // clear search input and results
22726    $("#add-intrest .search-topic-header input").val("");
22727    const $searchList = $("#add-intrest .dropdown-serach-result ul");
22728    $searchList.empty().append(originalInterestsSearchItems.clone());
22729
22730    $("#add-intrest .your-topics").show();
22731
22732});
22733</script>
22733
22734
22735<!-- ----------------------------- SUPER CREATOR STUFF ----------------------------- -->
22736<script>
22737var allTipsData = [];
22738var engagementStats = {
22739    'data': null,
22740    'change': null
22741};
22742var allEarningsData = [];
22743
22744$('.fixed-amount button').click(function() {
22745    $('.fixed-amount button').removeClass('active');
22746    $(this).addClass('active');
22747
22748    const span = $("#tips-and-donations-by-user .users-detail .sent-gift-amount span");
22749
22750    let amount = 5;
22751    if ($(this).hasClass("custom-amount-input")) {
22752        amount = $("#tips-and-donations-by-user .custom-amount input").val();
22753
22754        if (amount.length === 0) {
22755            return;
22756        }
22757
22758        const amountCheck = Number(amount);
22759        if (isNaN(amountCheck) || amountCheck <= 0) {
22760            return;
22761        }
22762    } else {
22763        amount = $(this).text().replace("$", "").trim();
22764    }
22765
22766    console.log(amount);
22767    span.html(
22768        `<img src="https://www.jumpspree.com/public/images/gift-green.png" alt=""> Sent you $${amount} 🎊`);
22769});
22770
22771$("#tips-and-donations-by-user .personalized-message textarea").on("input", function() {
22772    const value = $(this).val();
22773    const $p = $("#tips-and-donations-by-user .users-detail .user-box p");
22774
22775    if (value) {
22776        $p.text(value).show();
22777    } else {
22778        $p.hide();
22779    }
22780});
22781
22782$('.views-container .all-format a').click(function() {
22783    $('.all-format a').removeClass('actived');
22784    $(this).addClass('actived');
22785})
22786
22787$('.date-view').click(function(e) {
22788    e.stopPropagation(); // stop bubbling
22789    var $dropdown = $(this).next('.date-in-dropdown');
22790    $('.date-in-dropdown').not($dropdown).slideUp('fast'); // close others
22791    $dropdown.slideToggle('fast');
22792});
22793
22794
22795$('#tips-and-donations .date-in-dropdown li').click(function() {
22796    $('.date-in-dropdown').hide();
22797    var days = $(this).text();
22798    $(this).parents('.display-date').find('.date-view span').text(days);
22799
22800    let daysMap = {
22801        "7 days": 7,
22802        "14 days": 14,
22803        "30 days": 30,
22804        "3 months": 90,
22805        "6 months": 180
22806    };
22807
22808    const key = days.replace(/\s+/g, ' ').trim().toLowerCase(); // normalize
22809
22810    let selectedDays = daysMap[key] ?? 7;
22811
22812    // Calculate cutoff date
22813    let now = new Date();
22814    let cutoffDate = new Date();
22815    cutoffDate.setDate(now.getDate() - selectedDays);
22816
22817    let tbody = $('#some-transactions table tbody');
22818    tbody.empty();
22819
22820    const options = {
22821        year: 'numeric',
22822        month: 'short',
22823        day: 'numeric'
22824    };
22825
22826    let filteredTips = allTipsData.filter(function(tip) {
22827        const tipDate = new Date(tip.posteddate);
22828        return tipDate >= cutoffDate;
22829    });
22830
22831    // If no transactions
22832    if (filteredTips.length === 0) {
22833        $('#no-transactions').show();
22834        $('#some-transactions').hide();
22835        return;
22836    }
22837
22838    // Otherwise show table
22839    $('#no-transactions').hide();
22840    $('#some-transactions').show();
22841
22842    filteredTips.forEach(function(tip) {
22843        const tipDate = new Date(tip.posteddate);
22844
22845        let row = `
22846            <tr>
22847                <td>${tipDate.toLocaleDateString('en-US', options)}</td>
22848                <td>$${Number(tip.amount)/100}</td>
22849                <td>
22850                    <img class="sender-img" src="${tip.sender_img}" alt=""> 
22851                    @${tip.paid_by_username}
22852                </td>
22853                <td>
22854                    <button type="button" onclick="setPopDonationMessage('${tip.paid_by_username}', '${tip.sender_img}', '${tip.message}', '${Number(tip.amount)/100}')">View</button>
22855                </td>
22856            </tr>
22857        `;
22858        tbody.append(row);
22859
22860    });
22861
22862
22863})
22864
22865$('#engagement-and-insights .date-in-dropdown li').click(function() {
22866    $('.date-in-dropdown').hide();
22867    var days = $(this).text();
22868    $(this).parents('.display-date').find('.date-view span').text(days);
22869
22870    let daysMap = {
22871        "7 days": '7',
22872        "14 days": '14',
22873        "30 days": '30',
22874        "3 months": '3',
22875        "6 months": '6'
22876    };
22877
22878    const key = days.replace(/\s+/g, ' ').trim().toLowerCase(); // normalize
22879
22880    let selectedDays = daysMap[key] ?? '7';
22881
22882    setEngagementStats(selectedDays, engagementStats['data'], engagementStats['change']);
22883
22884})
22885
22886$('#earning-and-transaction .date-in-dropdown').each(function(index) {
22887
22888    $(this).find('li').click(function() {
22889        $('.date-in-dropdown').hide();
22890
22891        let daysMap = {
22892            "7 days": 7,
22893            "14 days": 14,
22894            "30 days": 30,
22895            "3 months": 90,
22896            "6 months": 180
22897        };
22898
22899        const days = $(this).text();
22900        $(this).parents('.display-date').find('.date-view span').text(days);
22901
22902        const key = days.replace(/\s+/g, ' ').trim().toLowerCase(); // normalize
22903
22904        let selectedDays = daysMap[key] ?? 7;
22905
22906
22907        if (index === 0) {
22908            // First dropdown clicked
22909            setEarningsData(selectedDays, allEarningsData);
22910
22911        } else {
22912            // Second dropdown clicked
22913            setTransactionData(selectedDays, allEarningsData);
22914
22915        }
22916    });
22917});
22918
22919// Close on outside click
22920$(document).click(function(e) {
22921    if (!$(e.target).closest('.date-view, .date-in-dropdown').length) {
22922        $('.date-in-dropdown').slideUp('fast');
22923    }
22924});
22925
22926
22927$(document).on('wheel', function(e) {
22928    if ($("#engagement-and-insights").is(":visible")) {
22929        e.preventDefault(); // stop body scroll
22930        var $box = $("#engagement-and-insights .eni-inner");
22931        var scrollTop = $box.scrollTop();
22932        var scrollHeight = $box.prop("scrollHeight");
22933        var height = $box.height();
22934
22935        // Scroll box instead of body
22936        if (e.originalEvent.deltaY > 0) {
22937            // scroll down
22938            if (scrollTop + height < scrollHeight) {
22939                $box.scrollTop(scrollTop + 5);
22940            }
22941        } else {
22942            // scroll up
22943            if (scrollTop > 0) {
22944                $box.scrollTop(scrollTop - 5);
22945            }
22946        }
22947    }
22948});
22949$(document).on('wheel', function(e) {
22950    if ($("#tips-and-donations-by-user").is(":visible")) {
22951        e.preventDefault(); // stop body scroll
22952        var $box = $("#tips-and-donations-by-user .eni-inner");
22953        var scrollTop = $box.scrollTop();
22954        var scrollHeight = $box.prop("scrollHeight");
22955        var height = $box.height();
22956
22957        // Scroll box instead of body
22958        if (e.originalEvent.deltaY > 0) {
22959            // scroll down
22960            if (scrollTop + height < scrollHeight) {
22961                $box.scrollTop(scrollTop + 5);
22962            }
22963        } else {
22964            // scroll up
22965            if (scrollTop > 0) {
22966                $box.scrollTop(scrollTop - 5);
22967            }
22968        }
22969    }
22970});
22971
22972function checkSuperCreatorEligibility() {
22973
22974    $.ajax({
22975        url: base_url + '/checkSuperCreatorEligibility',
22976        type: 'GET',
22977        dataType: 'json',
22978        success: function(response) {
22979            console.log(response);
22980
22981            if (response.status) {
22982
22983                const postsCount = Number(response.postsCount);
22984                const postsViewCount = Number(response.postsViewCount);
22985                const activeDays = Number(response.activeDays);
22986                const userDetails = response.userDetails;
22987                const isVerified = userDetails.is_verified == 1;
22988                const isSubToJumpspreeMore = userDetails.is_plan_active == 1;
22989                const followers = Number(userDetails.followers);
22990
22991
22992                toggleSuperCreatorCheck(
22993                    ".eligibility-wrapper .checklist-for-eligibility:first ul li:nth-child(1) img",
22994                    isSubToJumpspreeMore);
22995                toggleSuperCreatorCheck(
22996                    ".eligibility-wrapper .checklist-for-eligibility:first ul li:nth-child(2) img",
22997                    isVerified);
22998                toggleSuperCreatorCheck(
22999                    ".eligibility-wrapper .checklist-for-eligibility:first ul li:nth-child(3) img",
23000                    activeDays >= 30);
23001                toggleSuperCreatorCheck(
23002                    ".eligibility-wrapper .checklist-for-eligibility:first ul li:nth-child(4) img",
23003                    postsCount >= 30);
23004                toggleSuperCreatorCheck(
23005                    ".eligibility-wrapper .checklist-for-eligibility:first ul li:nth-child(5) img",
23006                    followers >= 100);
23007
23008                // Monetization unlock conditions
23009                toggleSuperCreatorCheck(
23010                    ".eligibility-wrapper .checklist-for-eligibility:last ul li:nth-child(1) img",
23011                    postsViewCount >= 10000);
23012                toggleSuperCreatorCheck(
23013                    ".eligibility-wrapper .checklist-for-eligibility:last ul li:nth-child(2) img",
23014                    isSubToJumpspreeMore);
23015                toggleSuperCreatorCheck(
23016                    ".eligibility-wrapper .checklist-for-eligibility:last ul li:nth-child(3) img",
23017                    followers >= 500);
23018
23019
23020
23021            } else {
23022                console.error("⚠️ Error: " + response.message);
23023            }
23024        },
23025        error: function(xhr, status, error) {
23026            console.error("AJAX Error:", error);
23027        }
23028    });
23029
23030    $('#check-eligibility').fadeIn();
23031
23032}
23033
23034function activateDeactivateSuperCreator(type) {
23035    if (type !== 1 && type !== 2 && type !== 3) return;
23036
23037    $.ajax({
23038        url: base_url + '/activateCreatorAccount',
23039        type: 'POST',
23040        data: {
23041            type: type
23042        },
23043        success: function(response) {
23044            console.log('Message response:', response);
23045
23046            if (type === 1) {
23047                $('#apply-super-creator-popup').fadeOut(200);
23048                $('#apply-super-creator').hide();
23049                $('#activated-super-creator').show();
23050            } else if (type === 2) {
23051                $('#roll-camera-action-popup').fadeIn(200);
23052            } else {
23053                $('#were-sad-to-see-you-go').fadeIn('fast');
23054            }
23055        },
23056        error: function(xhr) {
23057            console.error('Message error:', xhr.responseText);
23058        }
23059    });
23060}
23061
23062function toggleSuperCreatorCheck(selector, condition) {
23063    if (condition) {
23064        $(selector).removeClass("check-dim");
23065    } else {
23066        $(selector).addClass("check-dim");
23067    }
23068}
23069
23070function toggleCreatorTip() {
23071    $.ajax({
23072        url: base_url + '/toggleCreatorTip',
23073        type: 'POST',
23074        success: function(response) {
23075            console.log('Toggle response:', response);
23076            $('.Tipbtn-enable').toggle()
23077        },
23078        error: function(xhr) {
23079            console.error('Toggle error:', xhr.responseText);
23080        }
23081    });
23082
23083}
23084
23085function setTipPersonalizedMessage() {
23086
23087    const message = $('.personalized-message textarea').val().trim();
23088
23089    $.ajax({
23090        url: base_url + '/setTipPersonalizedMessage',
23091        type: 'POST',
23092        data: {
23093            message: message
23094        },
23095        success: function(response) {
23096            console.log('Message response:', response);
23097        },
23098        error: function(xhr) {
23099            console.error('Message error:', xhr.responseText);
23100        }
23101    });
23102}
23103
23104function getAllTipsDetails() {
23105
23106    $.ajax({
23107        url: base_url + '/getAllTipsDetails',
23108        type: 'GET',
23109        success: function(response) {
23110            console.log('Message response:', response);
23111            $('.personalized-message textarea').val(response.tips_thanks_message);
23112            $('#dmToggleCheckbox').prop('checked', response.tip_enabled);
23113
23114            if (response.tips_info.length === 0) {
23115                $('#no-transactions').show();
23116                $('#some-transactions').hide();
23117            } else {
23118                $('#no-transactions').hide();
23119                $('#some-transactions').show();
23120
23121                let tbody = $('#some-transactions table tbody');
23122                tbody.empty();
23123                const options = {
23124                    year: 'numeric',
23125                    month: 'short',
23126                    day: 'numeric'
23127                };
23128
23129                let totalAmount = 0;
23130                allTipsData = response.tips_info;
23131
23132                let now = new Date();
23133                let cutoffDate = new Date();
23134                cutoffDate.setDate(now.getDate() - 7);
23135
23136                let filteredTips = response.tips_info.filter(function(tip) {
23137                    const date = new Date(tip.posteddate);
23138                    return date >= cutoffDate;
23139                });
23140
23141                if (filteredTips.length === 0) {
23142                    $('#no-transactions').show();
23143                    $('#some-transactions').hide();
23144                }
23145
23146
23147                response.tips_info.forEach(function(tip) {
23148                    totalAmount += Number(tip.amount);
23149                    const date = new Date(tip.posteddate);
23150
23151                    if (date >= cutoffDate) {
23152                        let row = `
23153                                <tr>
23154                                    <td>${date.toLocaleDateString('en-US', options)}</td>
23155                                    <td>$${Number(tip.amount)/100}</td>
23156                                    <td>
23157                                        <img class="sender-img" src="${tip.sender_img}" alt=""> 
23158                                        @${tip.paid_by_username}
23159                                    </td>
23160                                    <td>
23161                                        <button type="button" onclick="setPopDonationMessage('${tip.paid_by_username}', '${tip.sender_img}', '${tip.message}', '${Number(tip.amount)/100}')">View</button>
23162                                    </td>
23163                                </tr>`;
23164
23165                        tbody.append(row);
23166                    }
23167                });
23168
23169
23170                $('.total-received-money .amount').text(`$${totalAmount/100}`);
23171
23172            }
23173
23174        },
23175        error: function(xhr) {
23176            console.error('Message error:', xhr.responseText);
23177        }
23178    });
23179}
23180
23181function setPopDonationMessage(senderName, senderImg, message, amount) {
23182
23183    $('#tippp-sender .sender-img').attr('src', senderImg);
23184
23185    // Update sender username
23186    $('#tippp-sender .user .user').text(senderName);
23187
23188    // Update gift amount
23189    $('#tippp-sender .sent-gift-amount span').html(
23190        `<img src="https://www.jumpspree.com/public/images/gift-green.png" alt=""> Sent you $${amount} 🎉`
23191    );
23192
23193    // Update personalized message
23194    $('#tippp-sender p').text(message);
23195
23196    $('#tippp-sender').fadeIn('fast');
23197
23198}
23199
23200function getEngagementStats() {
23201    $.ajax({
23202        url: base_url + '/superCreatorEngagementStats',
23203        type: 'GET',
23204        dataType: 'json',
23205        success: function(response) {
23206            console.log('Message response:', response);
23207            setEngagementStats('7', response.data, response.change);
23208            engagementStats['data'] = response.data;
23209            engagementStats['change'] = response.change;
23210
23211        },
23212        error: function(xhr) {
23213            console.error('Message error:', xhr.responseText);
23214        }
23215    });
23216}
23217
23218function setEngagementStats(range, data, change) {
23219
23220
23221    // Views
23222    $("#engagement-and-insights .views-container:eq(0) .mid-sec .right-side").text(data['views']['all'][range]);
23223
23224    // Followers
23225    $("#engagement-and-insights .views-container:eq(1) .mid-sec .right-side").text(data['followers'][range]);
23226
23227
23228    // Likes
23229    $("#engagement-and-insights #engagement-last-box .list-views li:eq(0) .value").text(data['likes']['all'][range]);
23230
23231    // Comments
23232    $("#engagement-and-insights #engagement-last-box .list-views li:eq(1) .value").text(data['comments']['all'][range]);
23233
23234    // Reposts
23235    $("#engagement-and-insights #engagement-last-box .list-views li:eq(2) .value").text(data['reposts']['all'][range]);
23236
23237    // Engagement
23238    $("#engagement-and-insights #engagement-last-box .mid-sec .right-side").text(data['comments']['all'][range] + data[
23239        'reposts']['all'][range] + data['likes']['all'][range]);
23240
23241}
23242
23243function getEarningsData() {
23244    $.ajax({
23245        url: base_url + '/getAllEarningsDetails',
23246        type: 'GET',
23247        dataType: 'json',
23248        success: function(response) {
23249            console.log('Message response:', response);
23250            // TODO : ADD payouts as well
23251            allEarningsData = response.tips_info;
23252
23253            setEarningsData(7, allEarningsData);
23254            setTransactionData(7, allEarningsData);
23255        },
23256        error: function(xhr) {
23257            console.error('Message error:', xhr.responseText);
23258        }
23259    });
23260}
23261
23262function setEarningsData(range, data) {
23263
23264    let total = 0;
23265    const options = {
23266        year: 'numeric',
23267        month: 'short',
23268        day: 'numeric'
23269    };
23270
23271
23272    // Calculate cutoff date
23273    let now = new Date();
23274    let cutoffDate = new Date();
23275    cutoffDate.setDate(now.getDate() - range);
23276
23277    let filteredData = allEarningsData.filter(function(tx) {
23278        const tipDate = new Date(tx.posteddate);
23279        return tipDate >= cutoffDate;
23280    });
23281
23282    filteredData.forEach(function(tx) {
23283        let amount = parseFloat(tx.amount.replace(/[$,]/g, ""));
23284        total += amount;
23285    });
23286
23287    total = total / 100;
23288    $("#earning-and-transaction .earning-box:first .right-side").text(`$${total.toLocaleString()}`);
23289}
23290
23291function setTransactionData(range, data) {
23292    let $tbody = $("#transactions-border table tbody");
23293    $tbody.empty();
23294
23295    const options = {
23296        year: 'numeric',
23297        month: 'short',
23298        day: 'numeric'
23299    };
23300
23301    const transactions = data;
23302
23303    // Calculate cutoff date
23304    let now = new Date();
23305    let cutoffDate = new Date();
23306    cutoffDate.setDate(now.getDate() - range);
23307
23308    let filteredData = allEarningsData.filter(function(tx) {
23309        const tipDate = new Date(tx.posteddate);
23310        return tipDate >= cutoffDate;
23311    });
23312
23313    filteredData.forEach(function(tx) {
23314        let amount = parseFloat(tx.amount.replace(/[$,]/g, ""));
23315        amount = amount / 100;
23316        const date = new Date(tx.posteddate);
23317
23318        let row = `
23319            <tr>
23320                <td>${date.toLocaleDateString('en-US', options)}</td>
23321                <td>$${amount.toLocaleString()}</td>
23322                <td class="success">Success</td>
23323            </tr>
23324        `;
23325        $tbody.append(row);
23326    });
23327
23328}
23329
23330function getConnectedBanks() {
23331    $.ajax({
23332        url: base_url + '/getRegisteredBankAccounts',
23333        type: 'GET',
23334        dataType: 'json',
23335        success: function(response) {
23336            console.log('Message response:', response);
23337            if (response.length === 0) {
23338                $('#connectBankHeading').show();
23339                $('#linkedBankHeading').hide();
23340
23341                $('#linkedAccounts').hide();
23342                $('#banks').show();
23343
23344            } else {
23345                $('#connectBankHeading').hide();
23346                $('#linkedBankHeading').show();
23347
23348                $('#linkedAccounts').show();
23349                $('#banks').hide();
23350
23351                $('#linkedAccounts h3').text(`${response[0].bank_name} ending in ${response[0].last4}`);
23352
23353                $('#linkedAccounts .delete-account-super').attr('onclick',
23354                    `deleteConnectedBanks('${response[0].connect_id}')`);
23355            }
23356
23357        },
23358        error: function(xhr) {
23359            console.error('Message error:', xhr.responseText);
23360        }
23361    });
23362}
23363
23364function deleteConnectedBanks(connect_id) {
23365    $.ajax({
23366        url: base_url + '/deleteConnectedBankAccount',
23367        type: 'POST',
23368        dataType: 'json',
23369        data: {
23370            connect_id: connect_id
23371        },
23372        success: function(response) {
23373            console.log('Message response:', response);
23374            if (response.status) {
23375                $('#connectBankHeading').show();
23376                $('#linkedBankHeading').hide();
23377
23378                $('#linkedAccounts').hide();
23379                $('#banks').show();
23380
23381            }
23382
23383        },
23384        error: function(xhr) {
23385            console.error('Message error:', xhr.responseText);
23386        }
23387    });
23388}
23389
23390function getStripeConnectUrl() {
23391    $.ajax({
23392        url: base_url + '/connectUserAccount',
23393        type: 'GET',
23394        dataType: 'json',
23395        success: function(response) {
23396            console.log('Message response:', response);
23397            if (response.status) {
23398                window.location.href = response.url.url;
23399            }
23400        },
23401        error: function(xhr) {
23402            console.error('Message error:', xhr.responseText);
23403        }
23404    });
23405}
23406
23407function sendUserTip() {
23408    let $activeBtn = $("#tips-and-donations-by-user .fixed-amount button.active");
23409
23410    let username = $(".profile-box .profile-detail .name h1").first().text().trim();
23411    username = username.replace(/^@/, ""); // remove leading @
23412    console.log(username)
23413
23414    let amount = 0;
23415    if ($activeBtn.hasClass("custom-amount-input")) {
23416        amount = $("#tips-and-donations-by-user .custom-amount input").val();
23417        if (amount.length === 0) {
23418            showNotification('error', 'Enter a tip amount.')
23419            return;
23420        }
23421    } else {
23422        amount = $activeBtn.text().replace("$", "").trim();
23423    }
23424
23425    amount = Number(amount);
23426    console.log(amount);
23427
23428    if (isNaN(amount) || amount <= 0) {
23429        showNotification('error', 'Enter a valid tip amount.')
23430        return;
23431    }
23432
23433    const message = $("#tips-and-donations-by-user .personalized-message textarea").val().trim();
23434    console.log("Saved message:", message);
23435
23436    $.ajax({
23437        url: base_url + "/tipSuperUser",
23438        type: "POST",
23439        dataType: "json",
23440        data: {
23441            tipAmount: amount,
23442            message: message,
23443            username: username
23444        },
23445        success: function(response) {
23446            console.log("Server response:", response);
23447            window.location.href = response.link;
23448            //$('#tip-sentsuccess-with-custom-message').fadeIn('fast')
23449        },
23450        error: function(xhr, status, error) {
23451            console.error("AJAX Error:", error);
23452        }
23453    });
23454
23455
23456}
23457
23458
23459
23460
23461// dec 18 
23462function unrepostPost(postId) {
23463    // Confirm with user
23464    /* if (!confirm('Are you sure you want to remove this repost?')) {
23465        return;
23466    } */
23467    
23468    // Get user token
23469    const userToken = getCurrentUserToken();
23470    
23471    // Get UI elements
23472    const repostButton = document.querySelector(`a[onclick*="unrepostPost('${postId}')"]`);
23473    const repostIcon = repostButton.querySelector('.fa-arrows-repeat');
23474    const repostCountSpan = document.getElementById(`repost-count-${postId}`);
23475    
23476    if (!repostButton) return;
23477    
23478    // Show loading
23479    repostIcon.classList.add('fa-spin');
23480    
23481    // FIX: Add user_token to request
23482    // Send AJAX request - FIX route if needed
23483    fetch('/unrepost', {  // Changed from '/unrepost' to '/post/unrepost'
23484        method: 'POST',
23485        headers: {
23486            'Content-Type': 'application/json',
23487            'X-Requested-With': 'XMLHttpRequest'
23488        },
23489        body: JSON.stringify({
23490            post_id: postId,
23491            user_token: userToken  // Added user token
23492        })
23493    })
23494    .then(response => response.json())
23495    .then(data => {
23496        // Remove loading
23497        repostIcon.classList.remove('fa-spin');
23498        
23499        // FIX: Check for status === true (not 'success')
23500        if (data.status === true) {
23501            // Update UI
23502            repostIcon.classList.remove('user-reposted-post');
23503            repostButton.classList.remove('reposted');
23504            repostButton.classList.add('no-repost');
23505            
23506            // Update onclick to show repost dropdown again
23507            repostButton.setAttribute('onclick', `handleRepostDropdown(event, this)`);
23508            
23509            // FIX: Use data.reposted_count (not responseData)
23510            const newCount = data.reposted_count; // FIX: changed from responseData to data
23511            
23512            if (newCount > 0) {
23513                repostCountSpan.textContent = newCount;
23514                repostCountSpan.style.display = 'inline';
23515            } else {
23516                repostCountSpan.style.display = 'none';
23517            }
23518            
23519            // Update dropdown text
23520            const dropdown = repostButton.nextElementSibling;
23521            if (dropdown && dropdown.classList.contains('drop-down-menu-share')) {
23522                const dropdownLink = dropdown.querySelector('a');
23523                if (dropdownLink) {
23524                    dropdownLink.textContent = 'Repost';
23525                    dropdownLink.setAttribute('onclick', `handleRepostPopup(this, '${postId}')`);
23526                    const dropdownIcon = dropdownLink.querySelector('.fa-arrows-repeat');
23527                    if (dropdownIcon) {
23528                        dropdownIcon.classList.remove('user-reposted-post');
23529                    }
23530                }
23531            } 
23532            // Show success message
23533            showNotification('success', data.message || 'Repost removed.'); 
23534            getSocialFeed('3', '1', '1', '');
23535        } else {
23536            showNotification('error', data.message || 'Failed to remove repost');
23537
23538        }
23539    })
23540    .catch(error => {
23541        console.error('Error:', error);
23542        repostIcon.classList.remove('fa-spin');
23543            showNotification('error', 'Network error. Please try again.');
23544    });
23545}
23546
23547// Helper function to get current user token
23548function getCurrentUserToken() {
23549    return window.currentUserToken || localStorage.getItem('user_token') || '';
23550}
23551
23552 
23553
23554// Helper function to get current user token (implement based on your auth system)
23555function getCurrentUserToken() {
23556    // Example: Get from localStorage, cookie, or global variable
23557    return window.currentUserToken || localStorage.getItem('user_token') || '';
23558}
23559
23560</script>
vendor: 2 bytes, line 23560
23560
23561<script>
23562    $('#privatepostbtn').on('change', function () {
23563        if (this.checked) {
23564            $('.write-article-and-tag-a-product.member-guidlines').fadeIn();
23565        } else {
23566            $('.write-article-and-tag-a-product.member-guidlines').fadeOut();
23567        }
23568    });
23569    
23570    
23571
23572    // PRIVATE MEMBERS POPUP
23573
23574    let privateMembersDebounceTimer;
23575
23576    $('#members-box .search-product input').on('input', function () {
23577        const query = $(this).val().trim();
23578        clearTimeout(privateMembersDebounceTimer);
23579
23580        if (!query) {
23581            $('#members-box .product-drop ul').empty();
23582            return;
23583        }
23584
23585        privateMembersDebounceTimer = setTimeout(function () {
23586            $.ajax({
23587                url: 'https://www.jumpspree.com/getUserListForMentions',
23588                method: 'POST',
23589                data: {  query },
23590                dataType: "json",
23591                success: function (res) {
23592                    const $ul = $('#members-box .product-drop ul');
23593                    $ul.empty();
23594
23595                    console.log(res);
23596                    if(!res.status) return;
23597                    // dummyPrivateMembers; 
23598                    
23599                    res.data.slice(0, 5).forEach(user => {
23600                        const foundIdx = addedPrivateMembers.indexOf(user.user_token);
23601                        
23602                        const addedClass = foundIdx !== -1  ? 'add added' : 'add';
23603                        const btnText = foundIdx !== -1 ? 'Added' : 'Add';
23604
23605                        let profilePhoto = "https://www.jumpspree.com/public/images/user-icon.png?ver%3A1_03=";
23606
23607                        if(user.profile_photo && user.profile_photo.length !== 0){
23608                            profilePhoto = user.profile_photo;
23609                        }
23610
23611                        const li = `
23612                        <li class="d-flex justify-content-between" data-token="${user.user_token}">
23613                            <div class="d-flex align-items-center">
23614                                <a href="/${user.username}" class="fig">
23615                                    <img src="${profilePhoto}" style="border-radius:50%">
23616                                </a>
23617                                <div class="fnc-title">
23618                                    <h4>
23619                                        <a href="/${user.username}" class="profile-link">${user.full_name}</a>
23620                                        <div class="user">@${user.username}</div>
23621                                    </h4>
23622                                </div>
23623                            </div>
23624                            <div class="${addedClass}" onclick="addPrivateMembers(this)">
23625                                <a href="javascript:void(0);">${btnText}</a>
23626                            </div>
23627                        </li>`;
23628                        $ul.append(li);
23629                    });
23630                }
23631            });
23632        }, 400);
23633    });
23634
23635
23636    function addPrivateMembers(el) {
23637        // e.preventDefault();
23638
23639        if ($(el).hasClass('added')) return;
23640
23641        console.log('clicked');
23642
23643        const $li = $(el).closest('li');
23644        const token = $li.attr('data-token');
23645        const name = $li.find('.profile-link').text();
23646        const img = $li.find('img').attr('src');
23647
23648        console.log(token);
23649
23650
23651        $li.find('.add').addClass('added').find('a').text('Added');
23652
23653        const addedItem = `
23654        <li data-token="${token}">
23655            <img src="${img}" style="border-radius:50%">
23656            <div class="close-added" onclick="removePrivateMembers(this)">×</div>
23657            <p>${name}</p>
23658        </li>`;
23659
23660        addedPrivateMembers.push(token);
23661
23662        $('#members-box .added-list ul').append(addedItem);
23663    }
23664
23665
23666    function removePrivateMembers(el){
23667        const $li = $(el).closest('li');
23668        const token = $li.attr('data-token');
23669
23670        $li.remove();
23671
23672        addedPrivateMembers = addedPrivateMembers.filter(t => t !== token);
23673
23674        const $btn = $('#members-box .product-drop li[data-token="' + token + '"] .add');
23675        $btn.removeClass('added').find('a').text('Add');
23676    }
23677
23678
23679</script>
23679
23680
23681
23682<script>
23683
23684
23685    // For report div
23686    function showAdditionalReportDiv(val){
23687
23688        if(val=='8'){
23689            $('#additional-comment-all').show('slow');
23690        }else{
23691            $('#additional-comment-all').hide();
23692        }
23693
23694    }
23695
23696    $('#report-additional-message').keyup(function(){
23697        let $remaining = $('#remaining-report-count')
23698        let chars = parseInt(this.value.length);
23699    
23700        remaining = 300 - chars;
23701        $remaining.text(`${chars}/300`);
23702
23703    });
23704
23705    function reportPost(){
23706
23707        const postId = $('#report-brand').attr('data-postid');
23708        console.log(postId);
23709
23710        if(!postId || postId.length === 0){
23711            return;
23712        }
23713
23714        reasonId = $('input[name="post-report-reason-check"]:checked').val();
23715
23716        if(!reasonId){
23717            showNotification('error', "Please choose atleast one option"); 
23718            return;  
23719        }
23720
23721        stext = $('#report-post-btn').text();
23722        message = $('#report-additional-message').val();
23723        reasonId = $('input[name="post-report-reason-check"]:checked').val();
23724      
23725        $.ajax({
23726            url: base_url + '/report-post', 
23727            type: 'POST',
23728            data: { reasonId: reasonId, message: message, postId: postId}, 
23729            dataType: "json",
23730            beforeSend: function() {
23731                $('#report-post-btn').html ('<span class="jloader"></span>');
23732            },
23733            success: function(response) {
23734                msg = response.message;
23735           
23736                if(response.status){
23737                    $('#report-brand-success').fadeIn('fast'); 
23738                    $('#report-brand').hide();
23739                    $('#report-brand').removeAttr('data-postid');
23740                }else{
23741                    showNotification('error', msg); 
23742                
23743                }
23744            },
23745            error: function(xhr, status, error) {
23746                //  $('#loader').hide();
23747                // console.error('AJAX error:', error);
23748            },
23749            complete: function() {
23750                $('#report-post-btn').html(stext); 
23751                    //  setTimeout(function() {
23752                    //      $('#errormessage').fadeOut()
23753                //  }, 5000)
23754            }
23755        });
23756
23757    }
23758</script>
23758
23759
23760
23761<script>
23762
23763document.addEventListener('DOMContentLoaded', function () {
23764
23765    const STORAGE_KEY = 'site-theme';
23766
23767    const body = document.body;
23768
23769    const segmented = document.getElementById('segmented');
23770
23771    const btnLight = document.getElementById('btnLight');
23772    const btnDark = document.getElementById('btnDark');
23773
23774    const switchLight = document.getElementById('switchLight');
23775    const switchNight = document.getElementById('switchNight');
23776
23777
23778    /*
23779    |--------------------------------------------------------------------------
23780    | PHP cookie value
23781    |--------------------------------------------------------------------------
23782    |
23783    | PHP sends:
23784    |
23785    | light-mode
23786    | dark-mode
23787    |
23788    */
23789
23790    const cookieBodyClass = null;
23791
23792
23793    /*
23794    |--------------------------------------------------------------------------
23795    | Convert body class to theme
23796    |--------------------------------------------------------------------------
23797    */
23798
23799    function classToTheme(bodyClass) {
23800
23801        return bodyClass === 'light-mode'
23802            ? 'light'
23803            : 'dark';
23804    }
23805
23806
23807    /*
23808    |--------------------------------------------------------------------------
23809    | Convert theme to body class
23810    |--------------------------------------------------------------------------
23811    */
23812
23813    function themeToClass(theme) {
23814
23815        return theme === 'light'
23816            ? 'light-mode'
23817            : 'dark-mode';
23818    }
23819
23820
23821    /*
23822    |--------------------------------------------------------------------------
23823    | Set Cookie
23824    |--------------------------------------------------------------------------
23825    */
23826
23827    function setThemeCookie(theme) {
23828
23829        const bodyClass = themeToClass(theme);
23830
23831        document.cookie =
23832            'bodyClass=' +
23833            encodeURIComponent(bodyClass) +
23834            '; path=/' +
23835            '; max-age=' + (60 * 60 * 24 * 365) +
23836            '; SameSite=Lax';
23837    }
23838
23839
23840    /*
23841    |--------------------------------------------------------------------------
23842    | Apply Theme
23843    |--------------------------------------------------------------------------
23844    */
23845
23846    function applyTheme(theme) {
23847
23848        /*
23849        | Make sure only light/dark is allowed
23850        */
23851
23852        if (theme !== 'light' && theme !== 'dark') {
23853            theme = 'dark';
23854        }
23855
23856
23857        /*
23858        |--------------------------------------------------------------------------
23859        | Body class
23860        |--------------------------------------------------------------------------
23861        */
23862
23863        body.classList.remove(
23864            'light-mode',
23865            'dark-mode'
23866        );
23867
23868        body.classList.add(
23869            themeToClass(theme)
23870        );
23871
23872
23873        /*
23874        |--------------------------------------------------------------------------
23875        | Save to localStorage
23876        |--------------------------------------------------------------------------
23877        */
23878
23879        localStorage.setItem(
23880            STORAGE_KEY,
23881            theme
23882        );
23883
23884
23885        /*
23886        |--------------------------------------------------------------------------
23887        | Save to Cookie
23888        |--------------------------------------------------------------------------
23889        */
23890
23891        setThemeCookie(theme);
23892
23893
23894        /*
23895        |--------------------------------------------------------------------------
23896        | Update UI
23897        |--------------------------------------------------------------------------
23898        */
23899
23900        updateUI(theme);
23901    }
23902
23903
23904    /*
23905    |--------------------------------------------------------------------------
23906    | Update UI
23907    |--------------------------------------------------------------------------
23908    */
23909
23910    function updateUI(theme) {
23911
23912        const isDark = theme === 'dark';
23913
23914
23915        /*
23916        |--------------------------------------------------------------------------
23917        | Desktop pill
23918        |--------------------------------------------------------------------------
23919        */
23920
23921        if (segmented) {
23922
23923            segmented.setAttribute(
23924                'data-active',
23925                theme
23926            );
23927        }
23928
23929
23930        if (btnLight) {
23931
23932            btnLight.classList.toggle(
23933                'active',
23934                !isDark
23935            );
23936        }
23937
23938
23939        if (btnDark) {
23940
23941            btnDark.classList.toggle(
23942                'active',
23943                isDark
23944            );
23945        }
23946
23947
23948        /*
23949        |--------------------------------------------------------------------------
23950        | Mobile switches
23951        |--------------------------------------------------------------------------
23952        */
23953
23954        if (switchLight && switchNight) {
23955
23956            switchLight.classList.toggle(
23957                'on',
23958                !isDark
23959            );
23960
23961            switchNight.classList.toggle(
23962                'on',
23963                isDark
23964            );
23965        }
23966    }
23967
23968
23969    /*
23970    |--------------------------------------------------------------------------
23971    | INIT
23972    |--------------------------------------------------------------------------
23973    |
23974    | Priority:
23975    |
23976    | 1. Cookie
23977    | 2. localStorage
23978    | 3. Dark
23979    |
23980    |--------------------------------------------------------------------------
23981    */
23982
23983    let initialTheme = null;
23984
23985
23986    /*
23987    |--------------------------------------------------------------------------
23988    | 1. Check PHP Cookie
23989    |--------------------------------------------------------------------------
23990    */
23991
23992    if (
23993        cookieBodyClass === 'light-mode' ||
23994        cookieBodyClass === 'dark-mode'
23995    ) {
23996
23997        initialTheme = classToTheme(
23998            cookieBodyClass
23999        );
24000    }
24001
24002
24003    /*
24004    |--------------------------------------------------------------------------
24005    | 2. If cookie doesn't exist, check localStorage
24006    |--------------------------------------------------------------------------
24007    */
24008
24009    if (!initialTheme) {
24010
24011        const saved = localStorage.getItem(
24012            STORAGE_KEY
24013        );
24014
24015        if (
24016            saved === 'light' ||
24017            saved === 'dark'
24018        ) {
24019
24020            initialTheme = saved;
24021        }
24022    }
24023
24024
24025    /*
24026    |--------------------------------------------------------------------------
24027    | 3. Default = Dark
24028    |--------------------------------------------------------------------------
24029    */
24030
24031    if (!initialTheme) {
24032
24033        initialTheme = 'dark';
24034    }
24035
24036
24037    /*
24038    |--------------------------------------------------------------------------
24039    | Apply initial theme
24040    |--------------------------------------------------------------------------
24041    */
24042
24043    applyTheme(initialTheme);
24044
24045
24046    /*
24047    |--------------------------------------------------------------------------
24048    | Desktop events
24049    |--------------------------------------------------------------------------
24050    */
24051
24052    if (btnLight) {
24053
24054        btnLight.addEventListener(
24055            'click',
24056            function () {
24057
24058                applyTheme('light');
24059
24060            }
24061        );
24062    }
24063
24064
24065    if (btnDark) {
24066
24067        btnDark.addEventListener(
24068            'click',
24069            function () {
24070
24071                applyTheme('dark');
24072
24073            }
24074        );
24075    }
24076
24077
24078    /*
24079    |--------------------------------------------------------------------------
24080    | Mobile events
24081    |--------------------------------------------------------------------------
24082    */
24083
24084    if (switchLight) {
24085
24086        switchLight.addEventListener(
24087            'click',
24088            function () {
24089
24090                applyTheme('light');
24091
24092            }
24093        );
24094    }
24095
24096
24097    if (switchNight) {
24098
24099        switchNight.addEventListener(
24100            'click',
24101            function () {
24102
24103                applyTheme('dark');
24104
24105            }
24106        );
24107    }
24108
24109});
24110
24111</script>
24111
24112
24113<!-- SEARCH DISPLAY -->
24114
24115
24116<script>
24117    
24118    let selectedSearchIndex = -1;
24119
24120    // BEFORE SEARCH
24121
24122    function getSearchHistory(){
24123        $.ajax({
24124            url: "https://www.jumpspree.com/searchHistory",
24125            type: "GET",
24126            dataType: "json",
24127            beforeSend: function() {
24128                console.log("Search Request started...");
24129            },
24130            success: function(response) {
24131                console.log(response);
24132
24133                if(!response.status){
24134                    return;
24135                }
24136
24137                appendSearchHistory(response.history);
24138
24139            },
24140            error: function(xhr, status, error) {
24141                console.error(error);
24142            },
24143            complete: function(xhr, status) {
24144                console.log("Search Request completed:", status);
24145            }
24146        });
24147    }
24148
24149    function appendSearchHistory(history){
24150        const searchHistoryTemplate = `           
24151            ${
24152                history && history.length > 0
24153                    ? `
24154                        <ul>
24155                            ${history.map(h => `
24156                                <li>
24157                                    <div onclick="getSearchResults('${h.search_key}')">
24158                                        ${h.search_key}
24159                                    </div>
24160                                </li>
24161                            `).join('')}
24162                        </ul>
24163                    `
24164                    : ''
24165            }         
24166        `;
24167
24168        if(history && history.length > 0){
24169            $('#search-history-results').html(searchHistoryTemplate);
24170            $('#search-history-div').show();
24171            $('#search-popup-wrapper-new').addClass('history-added');
24172        }else{
24173            $('#search-history-div').hide();
24174            $('#search-popup-wrapper-new').removeClass('history-added');
24175        }
24176        
24177    }
24178
24179    function deleteAllSearch(){
24180        $.ajax({
24181            url: 'https://www.jumpspree.com/removeAllSearches',
24182            method: 'POST',
24183            dataType: 'json',
24184            success: function(response) {
24185                $('#search-history-div').hide();
24186                $('#search-popup-wrapper-new').removeClass('history-added');
24187            },
24188            error: function(xhr) {
24189                console.log('can;t delete');
24190            }
24191        });
24192    }
24193
24194    function debounceSearch(fn, delay) {
24195        let timeoutId;
24196        return function(...args) {
24197            clearTimeout(timeoutId);
24198            timeoutId = setTimeout(() => {
24199                fn.apply(this, args);
24200            }, delay);
24201        };
24202    }
24203
24204    function handleSearch() {
24205        selectedSearchIndex = -1;
24206        let query = $('#search-main-input').val().trim();
24207
24208        if (query.length === 0) {
24209            $('#search-suggestion-list').hide();
24210            $('#search-suggestion-list-ul').empty();
24211            return;
24212        }
24213
24214        $.ajax({
24215            url: 'https://www.jumpspree.com/getSearchSuggestions', //  base_url
24216            method: 'GET',
24217            dataType: 'json',
24218            data: {
24219                query: query
24220            },
24221            success: function(response) {
24222                let list = $('#search-suggestion-list-ul');
24223                list.empty();
24224
24225                if (response) {
24226                    let hasResults = false;
24227                    let count = 0;
24228
24229                    for (let key in response) {
24230                        if (response.hasOwnProperty(key)) {
24231                            if (count >= 8) break;
24232                            list.append('<li><a href="#" class="search-item">' + key + '</a></li>');
24233                            hasResults = true;
24234                            count++;
24235                        }
24236                    }
24237
24238                    if (hasResults) {
24239                        $('#search-suggestion-list').show();
24240                    } else {
24241                        $('#search-suggestion-list').hide();
24242                    }
24243                } else {
24244                    $('#search-suggestion-list').hide();
24245                }
24246            },
24247            error: function(xhr) {
24248                console.log('No search');
24249            }
24250        });
24251    }
24252
24253    $(document).ready(function() {
24254
24255        $('#search-main-input').on('input', debounceSearch(handleSearch, 500));
24256
24257        $('#search-suggestion-list').on('click', 'a.search-item', function(e) {
24258            e.preventDefault();
24259
24260            const clickedText = $(this).text();
24261            getSearchResults(clickedText);
24262        });
24263
24264
24265        $('#search-main-input').on('keydown', function (e) {
24266
24267            const $items = $('#search-suggestion-list li');
24268
24269            // Arrow Down
24270            if (e.key === 'ArrowDown') {
24271                e.preventDefault();
24272
24273                if (!$items.length) return;
24274
24275                selectedSearchIndex++;
24276
24277                if (selectedSearchIndex >= $items.length) {
24278                    selectedSearchIndex = 0;
24279                }
24280
24281                $items.removeClass('active');
24282                $items.eq(selectedSearchIndex).addClass('active');
24283
24284                // Put selected suggestion into input
24285                $(this).val($items.eq(selectedSearchIndex).text().trim());
24286            }
24287
24288            // Arrow Up
24289            else if (e.key === 'ArrowUp') {
24290                e.preventDefault();
24291
24292                if (!$items.length) return;
24293
24294                selectedSearchIndex--;
24295
24296                if (selectedSearchIndex < 0) {
24297                    selectedSearchIndex = $items.length - 1;
24298                }
24299
24300                $items.removeClass('active');
24301                $items.eq(selectedSearchIndex).addClass('active');
24302
24303                $(this).val($items.eq(selectedSearchIndex).text().trim());
24304            }
24305
24306            // Enter
24307            else if (e.key === 'Enter') {
24308                e.preventDefault();
24309
24310                if (selectedSearchIndex >= 0) {
24311                    $items.eq(selectedSearchIndex).find('a')[0].click();
24312                }else{
24313                    const inp = $(this).val().trim();
24314                    getSearchResults(inp);
24315                }
24316            }
24317
24318            // Escape
24319            else if (e.key === 'Escape') {
24320                $('#search-suggestion-list').hide();
24321                selectedSearchIndex = -1;
24322            }
24323        });
24324
24325
24326        getSearchHistory();
24327
24328    });
24329
24330
24331    // AFTER SEARCH
24332
24333    function setSearchFilter(type){
24334        let filterValue = $('#ctg-filter').data('filter');
24335
24336        if (filterValue === type) {
24337            return;
24338        }
24339
24340        let activeCategory = document.querySelector('.ctg.active')?.textContent || '';
24341
24342        $('#ctg-filter').data('filter', type);
24343
24344        let $recentSpan = $('#recent-filter a > span');
24345        let $relevanceSpan = $('#relevance-filter a > span');
24346
24347       if (type === 'recent') {
24348            if ($recentSpan.find('i.fa-check').length === 0) {
24349                $recentSpan.append(' <i class="fa-solid fa-check"></i>');
24350            }
24351            $relevanceSpan.find('i.fa-check').remove();
24352
24353        } else if (type === 'relevance') {
24354            if ($relevanceSpan.find('i.fa-check').length === 0) {
24355                $relevanceSpan.append(' <i class="fa-solid fa-check"></i>');
24356            }
24357            $recentSpan.find('i.fa-check').remove();
24358        }
24359
24360        let tabsToHide = [];
24361
24362        if(type === "recent"){
24363            tabsToHide = ['#tab-products', '#tab-articles', '#tab-people', '#tab-posts', '#tab-brands'];
24364
24365        }else if(type=="relevance"){
24366            tabsToHide = ['#tab-products-recent', '#tab-articles-recent', '#tab-people-recent', '#tab-posts-recent', '#tab-brands'];
24367        
24368        }
24369
24370        // Hide original tabs
24371        tabsToHide.forEach(selector => {
24372            $(selector).hide();
24373        });
24374
24375        let targetId = `tab-${activeCategory.toLowerCase()}`;
24376        if(type==="recent"){
24377            targetId = `tab-${activeCategory.toLowerCase()}-recent`;
24378        }
24379
24380        const targetDiv = document.getElementById(targetId);
24381        if (targetDiv) {
24382            targetDiv.style.display = 'block';
24383        } else {
24384            console.warn("No content found for category:", targetId);
24385        }
24386        
24387    
24388    }
24389
24390    function setSearchActiveCategory(button) {
24391        let filterValue = $('#ctg-filter').data('filter');
24392
24393        let activeCategory = document.querySelector('.ctg.active')?.textContent || '';
24394
24395        let selectedCategory = button.textContent.trim();
24396
24397        if (selectedCategory === activeCategory) return;
24398
24399        document.querySelectorAll('.ctg').forEach(btn => btn.classList.remove('active'));
24400        button.classList.add('active');
24401
24402        activeCategory = selectedCategory;
24403        console.log("Active category changed to:", activeCategory);
24404
24405        document.querySelectorAll('.ctg-content').forEach(div => {
24406            div.style.display = 'none';
24407        });
24408
24409        // Show the selected category's content
24410        let targetId = `tab-${selectedCategory.toLowerCase()}`;
24411        if(filterValue==="recent"){
24412            targetId = `tab-${selectedCategory.toLowerCase()}-recent`;
24413        }
24414
24415        const targetDiv = document.getElementById(targetId);
24416        if (targetDiv) {
24417            targetDiv.style.display = 'block';
24418        } else {
24419            console.warn("No content found for category:", targetId);
24420        }
24421       
24422    }
24423
24424    function getSearchResults(text){
24425
24426        if(!text || text.length === 0){
24427            return;
24428        }
24429
24430        $('#search-popup-wrapper, #search-suggestion-list').hide();
24431
24432        $('#search-entry h3').text(text);
24433        $('#search-popup-wrapper-new').addClass('search-res-visible');
24434        $('#search-entry').show();
24435
24436        $.ajax({
24437            url: "https://www.jumpspree.com/searchResults",
24438            type: "GET",
24439            data: {
24440                input: text
24441            },
24442            dataType: "json",
24443            beforeSend: function() {
24444                console.log("Request started...");
24445                $('#search-results .ctg-content')
24446                    .empty()
24447                    .html('<div style="height: 350px; display: flex; align-items: center; justify-content: center;"><span class="jloader"></span></div>');
24448            },
24449            success: function(response) {
24450                console.log(response);
24451
24452                if(!response.status){
24453                    console.log('Failed to load the results...');
24454                    return;
24455                }
24456
24457                appendSearchResults(response.data);
24458
24459            },
24460            error: function(xhr, status, error) {
24461                console.error(error);
24462            },
24463            complete: function(xhr, status) {
24464                console.log("Request completed:", status);
24465                selectedSearchIndex = -1;
24466            }
24467        });
24468    }
24469
24470    function appendSearchResults(data){
24471        const searchResults = data.searchResults;
24472        const sortedSearchResults = data.sortedSearchResults;
24473
24474        if(!searchResults){
24475            return;
24476        }
24477
24478        $('.ctg[data-tab="Posts"]').click();
24479
24480        $('#tab-posts').html(renderSearchResults(Object.values(searchResults.posts), 'post'));
24481        $('#tab-posts-recent').html(renderSearchResults(sortedSearchResults.posts, 'post'));
24482
24483        $('#tab-people').html(renderSearchResults(searchResults.profiles, 'profile'));
24484        $('#tab-people-recent').html(renderSearchResults(sortedSearchResults.profiles, 'profile'));
24485
24486        $('#tab-articles').html(renderSearchResults(Object.values(searchResults.articles), 'article'));
24487        $('#tab-articles-recent').html(renderSearchResults(sortedSearchResults.articles, 'article'));
24488
24489        $('#tab-products').html(renderSearchResults(searchResults.products, 'product'));
24490        $('#tab-products-recent').html(renderSearchResults(sortedSearchResults.products, 'product'));
24491
24492        // $('#tab-brands').html(renderSearchResults(searchResults.products, 'brand'));
24493        // $('#tab-brands-recent').html(renderSearchResults(sortedSearchResults.products, 'brand'));
24494        
24495    }
24496
24497    function renderSearchResults(results, type) {
24498        if (!results || results.length === 0) {
24499            return renderNoResults(type);
24500        }
24501
24502        if(type === 'post'){
24503            $('#tab-posts, #tab-posts-recent').removeClass('no-results');
24504        }else if(type === 'profile'){
24505            $('#tab-people, #tab-people-recent').removeClass('no-results');
24506        }else if(type === 'article'){
24507            $('#tab-articles, #tab-articles-recent').removeClass('no-results');
24508        }else if(type === 'product'){
24509            $('#tab-products, #tab-products-recent').removeClass('no-results');
24510        }else if(type === 'brand'){
24511            $('#tab-brands, #tab-brands-recent').removeClass('no-results');
24512        }
24513
24514
24515        const renderers = {
24516            post: renderSearchPost,
24517            profile: renderSearchProfile,
24518            article: renderSearchArticle,
24519            product: renderSearchProduct
24520        };
24521
24522        const renderer = renderers[type];
24523
24524        if (!renderer) {
24525            console.error(`Unknown result type: ${type}`);
24526            return '';
24527        }
24528
24529        return results.map(renderer).join('');
24530    }
24531
24532    function renderNoResults(type){
24533
24534        let msg = 'results';
24535        if(type === 'post'){
24536            msg = 'posts';
24537            $('#tab-posts, #tab-posts-recent').addClass('no-results');
24538        }else if(type === 'profile'){
24539            msg = 'profiles';
24540            $('#tab-people, #tab-people-recent').addClass('no-results');
24541        }else if(type === 'article'){
24542            msg = 'articles';
24543            $('#tab-articles, #tab-articles-recent').addClass('no-results');
24544        }else if(type === 'product'){
24545            msg = 'products';
24546            $('#tab-products, #tab-products-recent').addClass('no-results');
24547        }else if(type === 'brand'){
24548            msg = 'brands';
24549            $('#tab-brands, #tab-brands-recent').addClass('no-results');
24550        }
24551
24552
24553        return `
24554            <div class="no-results" style="height: 363px; display: flex; align-items: center; justify-content: center;">
24555                <p style="color: white;">
24556                    No ${msg} found
24557                </p>
24558            </div>
24559        `;
24560    }
24561
24562
24563    function renderSearchPost(p) {
24564
24565        const username = p.username || '';
24566        const postId = p.id || '';
24567        const postText = p.post || '';
24568        const profilePhoto = p.profile_photo || '';
24569
24570        const postUrl = `https://www.jumpspree.com/ps/${encodeURIComponent(username)}/jumpid${postId}`;
24571
24572        const profileUrl = `https://www.jumpspree.com/${encodeURIComponent(username)}`;
24573
24574        const avatar = profilePhoto
24575            ? `
24576                <img
24577                    src="${escapeHtml(profilePhoto)}"
24578                    style="border-radius:50%"
24579                    alt="Profile Photo"
24580                >
24581            `
24582            : `
24583                <div class="avatar-placeholder">
24584                    ${escapeHtml(username.charAt(0).toUpperCase())}
24585                </div>
24586            `;
24587
24588        const verified = p.is_verified == '1'
24589            ? `
24590                <img
24591                    src="https://www.jumpspree.com/public/images/blue-cube.png"
24592                    class="blue-cube-icon"
24593                    alt="Verified Icon"
24594                >
24595            `
24596            : '';
24597
24598        const media = renderPostMedia(p.files);
24599
24600        const textFlex = media ? '85%' : '100%';
24601
24602        return `
24603            <div class="postdiv" style=" margin: 10px; background-color: #171717; border-radius: 20px; padding: 10px; padding-bottom: 0; padding-top: 0;" onclick="window.location.href='${postUrl}'">
24604
24605                <div class="row user-sec-strip2">
24606                    <div class="col-md-12">
24607
24608                        <div class="fnc mt-0 justify-content-between mb-1 align-items-start">
24609
24610                            <div class="d-flex align-items-center">
24611
24612                                <a href="${profileUrl}" class="fig">
24613
24614                                    <div class="online-green"></div>
24615
24616                                    ${avatar}
24617
24618                                </a>
24619
24620                                <div class="fnc-title">
24621                                    <h4>
24622
24623                                        <a href="${profileUrl}" class="profile-link">
24624                                            @${username}
24625                                        </a>
24626
24627                                        ${verified}
24628
24629                                    </h4>
24630                                </div>
24631
24632                            </div>
24633
24634                        </div>
24635
24636                    </div>
24637                </div>
24638
24639                <div class="row" style="cursor: pointer;">
24640                    <div class="col-md-12" style="padding-bottom: 20px;">
24641
24642                        <div class="post-text" style="display: flex; align-items: center; gap: 5px;">
24643
24644                            <a href="${postUrl}" style=" flex: 0 0 ${textFlex}; display: flex; align-items: center; text-decoration: none;">
24645                                <p style="align-self: center; margin: 0; cursor: pointer;">
24646                                    ${escapeHtml(postText)}
24647                                </p>
24648                            </a>
24649
24650                            ${media}
24651
24652                        </div>
24653
24654                    </div>
24655                </div>
24656
24657            </div>
24658        `;
24659    }
24660
24661    function renderPostMedia(files) {
24662
24663        if (!files || files.length === 0) {
24664            return '';
24665        }
24666
24667        const file = files[0];
24668
24669        if (!file?.url) {
24670            return '';
24671        }
24672
24673        const url = escapeHtml(file.url);
24674
24675        if (file.type == '1' || file.type == '3') {
24676
24677            return `
24678                <div class="post-img" style="flex: 0 0 15%; max-width: 80px;">
24679                    <img src="${url}" style="width: 80px; height: 70px; object-fit: cover; border-radius: 4px; display: block;">
24680                </div>
24681            `;
24682        }
24683
24684        if (file.type == '2') {
24685
24686            return `
24687                <div class="post-img" style="flex: 0 0 15%; max-width: 80px;">
24688                    <video src="${url}" style="width: 80px;height: 70px;object-fit: cover;border-radius: 4px;display: block;">
24689                        Your browser does not support the video tag.
24690                    </video>
24691                </div>
24692            `;
24693        }
24694
24695        return '';
24696    }
24697
24698    function renderSearchProfile(p) {
24699
24700        const username = p.username || '';
24701
24702        if (!username) {
24703            return '';
24704        }
24705
24706        const profileUrl = `https://www.jumpspree.com/${encodeURIComponent(username)}`;
24707
24708        const avatar = p.profile_photo
24709            ? `
24710                <img src="${escapeHtml(p.profile_photo)}" style="border-radius:50%" alt="Profile Photo">
24711            `
24712            : `
24713                <div class="avatar-placeholder">
24714                    ${escapeHtml(username.charAt(0).toUpperCase())}
24715                </div>
24716            `;
24717
24718        const verified = p.is_verified == '1'
24719            ? `
24720                <img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon">
24721            `
24722            : '';
24723
24724        return `
24725            <div class="postdiv" style="margin: 10px;background-color: #171717;border-radius: 20px;padding: 10px;padding-bottom: 20px; padding-top: 11px; cursor: pointer;" onclick="window.location.href='${profileUrl}'">
24726                <div class="row user-sec-strip2" style="width: 100%;">
24727                    <div class="col-md-12">
24728
24729                        <div class="fnc mt-0 justify-content-between mb-1 pt-3 align-items-start" style="padding-left:15px;">
24730
24731                            <div class="d-flex align-items-center">
24732
24733                                <a href="${profileUrl}" class="fig">
24734
24735                                    <div class="online-green"></div>
24736
24737                                    ${avatar}
24738
24739                                </a>
24740
24741                                <div class="fnc-title">
24742                                    <h4>
24743                                        <a href="${profileUrl}" class="profile-link">
24744                                            @${escapeHtml(username)}
24745                                        </a>
24746
24747                                        ${verified}
24748                                    </h4>
24749                                </div>
24750
24751                            </div>
24752
24753                        </div>
24754
24755                    </div>
24756                </div>
24757            </div>
24758        `;
24759    }
24760
24761    function renderSearchArticle(p) {
24762
24763        const username = p.username || '';
24764        const title = p.title || '';
24765        const postId = p.id || '';
24766
24767        const postUrl = `https://www.jumpspree.com/ps/${encodeURIComponent(username)}/jumpid${postId}`;
24768
24769        const profileUrl = `https://www.jumpspree.com/${encodeURIComponent(username)}`;
24770
24771        const profilePhoto = p.profile_photo ? escapeHtml(p.profile_photo) : 'https://www.jumpspree.com/public/images/user-icon.png';
24772
24773        const verified = p.is_verified == '1'
24774            ? `
24775                <img
24776                    src="https://www.jumpspree.com/public/images/blue-cube.png"
24777                    class="blue-cube-icon"
24778                    alt="Verified Icon"
24779                >
24780            `
24781            : '';
24782
24783        const media = renderPostMedia(p.files);
24784
24785        const textFlex = media ? '85%' : '100%';
24786
24787        return `
24788            <div class="postdiv"
24789                style="
24790                    margin: 10px;
24791                    background-color: #171717;
24792                    border-radius: 20px;
24793                    padding: 10px;
24794                    padding-bottom: 20px;
24795                " onclick="window.location.href='${postUrl}'">
24796
24797                <div class="row user-sec-strip2">
24798
24799                    <div class="col-md-12">
24800
24801                        <div class="fnc mt-0 justify-content-between mb-1 align-items-start">
24802
24803                            <div class="d-flex align-items-center">
24804
24805                                <a href="${profileUrl}" class="fig">
24806
24807                                    <div class="online-green"></div>
24808
24809                                    <img src="${profilePhoto}" style="border-radius:50%" alt="Profile Photo">
24810
24811                                </a>
24812
24813                                <div class="fnc-title">
24814
24815                                    <h4>
24816                                        <a href="${profileUrl}" class="profile-link">
24817                                            @${escapeHtml(username)}
24818                                        </a>
24819
24820                                        ${verified}
24821                                    </h4>
24822
24823                                </div>
24824
24825                            </div>
24826
24827                        </div>
24828
24829                    </div>
24830
24831                </div>
24832
24833                <div class="row">
24834
24835                    <div class="col-md-12" style="padding-bottom: 0px;">
24836
24837                        <div class="post-text" style="display: flex; align-items: start; gap: 5px;">
24838
24839                            <a href="${postUrl}"
24840                                style="
24841                                    flex: 0 0 ${textFlex};
24842                                    display: flex;
24843                                    align-items: center;
24844                                    text-decoration: none;
24845                                ">
24846                                <p style="align-self: center; margin: 0;cursor: pointer;">
24847                                    ${escapeHtml(title)}
24848                                </p>
24849                            </a>
24850
24851                            ${media}
24852
24853                        </div>
24854                    </div>
24855                </div>
24856            </div>
24857        `;
24858    }
24859
24860    function renderSearchProduct(p) {
24861
24862        const productId = p.id || '';
24863        const productTitle = p.producttitle || '';
24864        const imagePath = p.imagepath || '';
24865
24866        const price = p.discountedprice
24867            ? p.discountedprice
24868            : p.sellingprice;
24869
24870        // Same slug logic as:
24871        // preg_replace('/[\/\s#?]+/', '-', $p['producttitle'])
24872        const slug = productTitle.replace(/[\/\s#?]+/g, '-');
24873
24874        const productUrl = `https://www.jumpspree.com/p/${encodeURIComponent(slug)}/${productId}`;
24875
24876        const image = imagePath
24877            ? `
24878                <div class="post-img" style="flex: 0 0 20%; max-width: 90px;">
24879                    <img src="${escapeHtml(imagePath)}"
24880                        style="
24881                            width: 90px;
24882                            height: 90px;
24883                            object-fit: cover;
24884                            border-radius: 4px;
24885                            display: block;
24886                        "
24887                        alt="${escapeHtml(productTitle)}">
24888                </div>
24889            `
24890            : '';
24891
24892        const textFlex = imagePath ? '80%' : '100%';
24893
24894        return `
24895            <div class="postdiv"
24896                style="
24897                    margin: 10px;
24898                    background-color: #171717;
24899                    border-radius: 20px;
24900                    padding: 10px;
24901                    padding-bottom: 20px;
24902                    padding-top: 20px;
24903                "
24904                onclick="window.location.href='${productUrl}'">
24905
24906                <div class="row">
24907
24908                    <div class="col-md-12">
24909
24910                        <div class="post-text" style="display: flex; align-items: center; gap: 20px;">
24911
24912                            ${image}
24913
24914                            <a href="${productUrl}" style="flex: 0 0 ${textFlex};display: flex;flex-direction: column;text-decoration: none;">
24915
24916                                <p class="product-title" style="margin: 0; cursor: pointer;">
24917                                    ${escapeHtml(productTitle)}
24918                                </p>
24919
24920                                <p style="margin-bottom: 0;">
24921                                    $${escapeHtml(price)}
24922                                </p>
24923
24924                            </a>
24925
24926                        </div>
24927                    </div>
24928                </div>
24929            </div>
24930        `;
24931    }
24932
24933    function escapeHtml(value) {
24934        return String(value ?? '')
24935            .replace(/&/g, '&amp;')
24936            .replace(/</g, '&lt;')
24937            .replace(/>/g, '&gt;')
24938            .replace(/"/g, '&quot;')
24939            .replace(/'/g, '&#039;');
24940    }
24941</script>
24941
24942
24943<!-- BUG REPORT -->
24944<script>
24945    let bugReportFiles = [];
24946    let bugReportFileId = 0;
24947
24948    /*
24949    |--------------------------------------------------------------------------
24950    | Select files
24951    |--------------------------------------------------------------------------
24952    */
24953    $('#attachmentForReport').on('change', function () {
24954
24955        const selectedFiles = Array.from(this.files);
24956
24957        let addedCount = 0;
24958        let limitReached = false;
24959
24960        selectedFiles.forEach(function (file) {
24961
24962            // Check duplicate
24963            const exists = bugReportFiles.some(function (item) {
24964
24965                return item.file.name === file.name &&
24966                    item.file.size === file.size &&
24967                    item.file.lastModified === file.lastModified;
24968
24969            });
24970
24971            if (exists) {
24972                return;
24973            }
24974
24975            // Check maximum
24976            if (bugReportFiles.length >= 10) {
24977                limitReached = true;
24978                return;
24979            }
24980
24981            bugReportFiles.push({
24982                id: bugReportFileId++,
24983                file: file
24984            });
24985
24986            addedCount++;
24987        });
24988
24989        if (limitReached) {
24990            showNotification('error', 'Maximum 10 files are allowed.');
24991        }
24992
24993        renderBugReportFiles();
24994
24995        // Reset input
24996        $(this).val('');
24997    });
24998
24999
25000    /*
25001    |--------------------------------------------------------------------------
25002    | Render attachment previews
25003    |--------------------------------------------------------------------------
25004    */
25005    function renderBugReportFiles(){
25006        const container = $('#attachment-preview-container');
25007        const preview = $('#attachment-preview-inner');
25008
25009        preview.empty();
25010
25011        if (bugReportFiles.length === 0) {
25012            container.hide();
25013            return;
25014        }
25015
25016        container.show();
25017
25018        bugReportFiles.forEach(function (item) {
25019
25020            const file = item.file;
25021
25022            const fileUrl = URL.createObjectURL(file);
25023
25024            let content = '';
25025
25026            /*
25027            |--------------------------------------------------------------------------
25028            | Image
25029            |--------------------------------------------------------------------------
25030            */
25031            if (file.type.startsWith('image/')) {
25032
25033                content = `
25034                    <img
25035                        src="${fileUrl}"
25036                        alt="${escapeDivHtml(file.name)}"
25037                    >
25038                `;
25039
25040            /*
25041            |--------------------------------------------------------------------------
25042            | Video
25043            |--------------------------------------------------------------------------
25044            */
25045            } else if (file.type.startsWith('video/')) {
25046
25047                content = `
25048                    <video
25049                        src="${fileUrl}"
25050                        controls
25051                        preload="metadata">
25052                    </video>
25053                `;
25054
25055            /*
25056            |--------------------------------------------------------------------------
25057            | PDF / Other supported file
25058            |--------------------------------------------------------------------------
25059            */
25060            } else {
25061
25062                content = `
25063                    <div class="file-preview">
25064                        <span>📄</span>
25065                    </div>
25066                `;
25067            }
25068
25069
25070            preview.append(`
25071                <div class="attachment-item" data-id="${item.id}" style="position:relative;">
25072
25073                    <div class="attachment-preview">
25074                        ${content}
25075                    </div>
25076
25077                    <button type="button" class="remove-report-attachment" data-id="${item.id}">
25078                        <img src="https://www.jumpspree.com/public/images/cross-icon.png" alt="Cross" title="Cross">
25079                    </button>
25080
25081                </div>
25082            `);
25083        });
25084    }
25085
25086
25087    /*
25088    |--------------------------------------------------------------------------
25089    | Remove attachment
25090    |--------------------------------------------------------------------------
25091    */
25092    $('#attachment-preview-container').on('click', '.remove-report-attachment', function () {
25093
25094        const id = Number($(this).attr('data-id'));
25095
25096        bugReportFiles = bugReportFiles.filter(function (item) {
25097            return item.id !== id;
25098        });
25099
25100        console.log(id);
25101
25102        renderBugReportFiles();
25103    });
25104
25105
25106    /*
25107    |--------------------------------------------------------------------------
25108    | Send bug report
25109    |--------------------------------------------------------------------------
25110    */
25111    $('#sendReport').on('click', function () {
25112
25113        const subject = $('#bug-report-title').val().trim();
25114        const message = $('#problem_text').val().trim();
25115        
25116        if (!subject) {
25117            showNotification('error' ,'Please enter a title.');
25118            return;
25119        }
25120
25121        if (!message) {
25122            showNotification('error' ,'Please enter a description.');
25123            return;
25124        }
25125
25126
25127        const formData = new FormData();
25128
25129        formData.append('subject', subject);
25130        formData.append('message', message);
25131
25132        bugReportFiles.forEach(function (item) {
25133            formData.append('files[]', item.file);
25134        });
25135
25136
25137        $.ajax({
25138
25139            url: "https://www.jumpspree.com/createBugReport",
25140            type: 'POST',
25141            data: formData,
25142            processData: false,
25143            contentType: false,
25144            beforeSend: function () {
25145                $('#sendReport').prop('disabled', true).text('Sending...');
25146            },
25147            success: function (response) {
25148
25149                if (response.status) {
25150
25151                    /*
25152                    |--------------------------------------------------------------------------
25153                    | Clear everything after successful submission
25154                    |--------------------------------------------------------------------------
25155                    */
25156
25157                    bugReportFiles = [];
25158                    bugReportFileId = 0;
25159                    renderBugReportFiles();
25160                    $('#bug-report-title').val('');
25161                    $('#problem_text').val('');
25162                    $('#attachmentForReport').val('');
25163                    $('#report-on-more-option').fadeOut('fast');
25164
25165                    showNotification('success' , 'Bug reported succesfully');
25166
25167                } else {
25168                    showNotification('error' , response.message);
25169                }
25170            },
25171
25172            error: function (xhr) {
25173                showNotification('error' , 'Unable to submit bug report');
25174            },
25175
25176            complete: function () {
25177                $('#sendReport').prop('disabled', false).text('Send');
25178            }
25179
25180        });
25181    });
25182
25183
25184    function escapeDivHtml(value){
25185        return $('<div>').text(value).html();
25186    }
25187
25188    $('#problem_text').on('input', function() {
25189        const isEmpty = $(this).val().trim() === '';
25190        const $sendBtn = $('#sendReport');
25191
25192        $sendBtn.prop('disabled', isEmpty);
25193
25194        if (isEmpty) {
25195            $sendBtn.removeClass('btnisenable').addClass('btnisdisable');
25196        } else {
25197            $sendBtn.removeClass('btnisdisable').addClass('btnisenable');
25198        }
25199    });
25200
25201
25202
25203</script>
25203<!-- Footer code END --> 
25204
25205
25206<div id="download-app-popup" style="display:none;background:url('https://www.jumpspree.com/public/images/app-dwnload-bg.jpg')">
25207<style>
25208body.dark-mode .get-app-qr-code-wrapper {
25209    backdrop-filter: blur(30px);
25210}    
25211</style>
25212    <div id="download-app-popup-inner">
25213<div class="close-getstart" style="color:#fff;right: 20px;top: 0px;" onclick="$('#download-app-popup').fadeOut('fast');$('body').removeClass('overflow-hidden'); $('.left_section').show();">&times;</div>
25214       
25215       <h2>Experience Jumpspree <br>to the fullest.</h2>
25216       <p>Access all the good stuff: Premium social and shop feeds, online shopping, post editing, articles, dynamic profile, and more!</p>
25217         <div class="download-btns">
25218             <a href="javascript:void(0)" onclick="$('#ios-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/apple-icons.png" width="20" alt="Apple Store" title="Apple Store"> App Store</a>
25219             <a href="javascript:void(0)" onclick="$('#android-app').fadeIn('fast')"><img src="https://www.jumpspree.com/public/images/android-icon.png" width="20" alt="Play Store" title="Play Store link"> Play Store</a>
25220         </div>
25221        <div class="ss hide-on-mob"><img src="https://www.jumpspree.com/public/images/mob-popup.png" alt="Graphic" title="Graphic" loading="lazy"></div> 
25222        <div class="ss hide-on-desktop"><img src="https://www.jumpspree.com/public/images/mob-full-image.png" alt="Graphic" title="Graphic" loading="lazy"></div> 
25223    </div>
25224</div>
25225
25226
25227<script>
25228   // Copy the share URL to the clipboard
25229function copyLink(event) {
25230    event.preventDefault(); // Prevent the default link behavior
25231
25232    // Define the shareable link
25233    const shareableLink = "https://www.jumpspree.com";
25234
25235    // Create a temporary input to copy the text
25236    const tempInput = document.createElement("input");
25237    document.body.appendChild(tempInput);
25238    tempInput.value = shareableLink;
25239    tempInput.select();
25240    tempInput.setSelectionRange(0, 99999); // For mobile devices
25241    document.execCommand("copy");
25242    document.body.removeChild(tempInput);
25243
25244    const successMsg = document.getElementById("copySuccessMsg");
25245    if (successMsg) {
25246        successMsg.style.display = "inline"; // Show the message
25247        setTimeout(() => {
25248            successMsg.style.display = "none";  
25249        }, 3000); // Adjust the timeout duration if needed
25250    }
25251
25252    // Provide feedback to the user
25253    //showNotification("success", "Link copied to clipboard!");
25254}
25255
25256// Refresh social feed
25257function refreshFeed(event) {
25258    event.preventDefault(); // Prevent the default link behavior
25259
25260    showNotification("success", "Feed refreshed");
25261    // Call the getSocialFeed function
25262    getSocialFeed('3', 1, '1', '');
25263}
25264 
25265
25266// Function to set active page when a tab is clicked
25267function setActivePage(pageType) {
25268    activePage = pageType;  // Set the active page to either 'social' or 'shop'
25269    page = 1; // Reset page count when switching tabs
25270    maxReached = false; // Reset flag when switching tabs
25271    // Optionally clear existing posts
25272    if (pageType === 'social') {
25273        $('#posts-container-shop').html(''); // Clear shop posts when switching to social
25274    } else if (pageType === 'shop') {
25275        $('#posts-container').html(''); // Clear social posts when switching to shop
25276    }
25277}
25278function decodeHTMLEntities(text) {
25279    var textarea = document.createElement('textarea');
25280    textarea.innerHTML = text;
25281    return textarea.value;
25282}
25283
25284function convertHashtagsToLinks_old(text) {
25285    // First, decode any HTML entities (like &#39;)
25286    text = decodeHTMLEntities(text);// this function os created bcz in text special characters like &#39; coming and our # tag logic wont work here so.
25287    
25288    // Then, convert hashtags to links
25289    return text.replace(/#(\w+)/g, function(match, tag) {
25290        return `<a href="javascript:void(0)" class="hashtag-link" onclick="getSocialFeed('3','1','1', '${tag}')" data-tag="${tag}">#${tag}</a>`;
25291    });
25292} 
25293
25294function convertHashtagsToLinks_movedtofooter(text) {
25295    // First, decode any HTML entities (like &#39;)
25296    text = decodeHTMLEntities(text);
25297
25298    // Regex pattern for URLs
25299    const urlRegex = /(https?:\/\/[^\s]+)/g;
25300
25301    // Replace URLs with <a> tags
25302    text = text.replace(urlRegex, function(match) {
25303        return `<a href="${match}" class="dynamicPostLink" target="_blank">${match}</a>`;
25304    });
25305
25306    // Convert hashtags to links
25307    text = text.replace(/#(\w+)/g, function(match, tag) {
25308        return `<a href="javascript:void(0)" class="hashtag-link" onclick="getSocialFeed('3','1','1', '${tag}')" data-tag="${tag}">#${tag}</a>`;
25309    });
25310
25311    return text;
25312}
25313 
25314/* function generateMediaContent(postFiles) {
25315    return postFiles.map(file => {
25316        if (file.type === "1") {
25317            return `<img src="${file.imagepath}" alt="Post Image" class="post-media">`;
25318        } else if (file.type === "3") {
25319            return `<img src="${file.imagepath}" alt="Post GIF" class="post-media">`;
25320        }
25321        return '';
25322    }).join('');
25323} */
25324
25325
25326 
25327
25328// Function to count YouTube links in the post text
25329function countYouTubeLinks(postText) {
25330    const youtubeRegex = /https?:\/\/(www\.)?(youtube\.com\/watch\?v=|youtu\.be\/)([a-zA-Z0-9_-]{11})/g;
25331    const matches = postText.match(youtubeRegex);
25332    return matches ? matches.length : 0;
25333}
25334
25335function extractUrls_old_5thJun(text) {
25336    // Remove <br> and other unwanted HTML tags from the text
25337    const sanitizedText = text.replace(/<br\s*\/?>/g, '').replace(/<[^>]+>/g, '');
25338    
25339    // Regular expression to match URLs
25340    const regex = /(https?:\/\/[^\s]+)/g;
25341    
25342    //console.log("comes 851");
25343    //console.log(sanitizedText);
25344    
25345    return sanitizedText.match(regex) || [];
25346}
25347//new 5 june 
25348function extractUrls(text) {
25349    // Replace <br> and newlines with spaces
25350    const sanitizedText = text
25351        .replace(/<br\s*\/?>/gi, ' ')
25352        .replace(/\r?\n|\r/g, ' ')
25353        .replace(/<[^>]+>/g, ''); // remove any other HTML tags
25354
25355    // Match URLs starting with http/https or www.
25356    const regex = /\b((https?:\/\/|www\.)[^\s<]+)/gi;
25357
25358    let matches = sanitizedText.match(regex) || [];
25359
25360    // Normalize all www. links to full https URLs
25361    matches = matches.map(url => {
25362        if (!url.startsWith('http')) {
25363            return 'https://' + url;
25364        }
25365        return url;
25366    });
25367
25368    return matches;
25369}
25370
25371
25372
25373  
25374// Helper function to truncate long text
25375function truncateText(text) {
25376    const maxLength = 150; // Customize the length as needed
25377    if (text.length > maxLength) {
25378        return text.substring(0, maxLength) + '...';
25379    }
25380    return text;
25381}
25382
25383// Helper function to generate media content
25384function generateMediaContent(postFiles, post, postIndex) {
25385    if (!postFiles || postFiles.length === 0) return '';
25386    const isFirstPost = (postIndex === 0);
25387
25388    let mediaHtml = '';
25389    postFiles.forEach((file, index) => {
25390        if (file.ext === 'image' || file.ext === 'gif' || file.ext === 'jpg' || file.ext === 'jpeg') {
25391            const lazyAttr  = (!isFirstPost || index > 0) ? ' loading="lazy"' : '';
25392            const prioAttr  = (isFirstPost && index === 0)  ? ' fetchpriority="high"' : '';
25393            mediaHtml += `
25394                <div class="item">
25395                    <a href="${file.imagepath}" data-sub-html="<div class='fnc-title'><h4>${post.userFullName}</h4><p>@${post.username}</p></div>">
25396                        <div style="aspect-ratio:4/3;background:#111;overflow:hidden;border-radius:8px;">
25397                            <img src="${file.imagepath}" alt="Image ${index + 1}" class="img-fluid"${lazyAttr}${prioAttr} style="width:100%;height:100%;object-fit:cover;">
25398                        </div>
25399                    </a>
25400                </div>
25401            `;
25402        } else if (file.ext === 'video') {
25403            mediaHtml += `
25404                <div class="item video-container" style="aspect-ratio:16/9;background:#111;border-radius:8px;overflow:hidden;">
25405                    <video controls class="img-fluid" style="width:100%;height:100%;object-fit:cover;">
25406                        <source src="${file.imagepath}" type="video/mp4">
25407                        Your browser does not support the video tag.
25408                    </video>
25409                </div>
25410            `;
25411        }
25412    });
25413
25414    return mediaHtml;
25415}
25416
25417function fetchLinkPreview(url, element) {
25418    $.getJSON('/fetch_link_preview.php?url=' + encodeURIComponent(url), function(data) {
25419        //console.log(data);
25420        if (data) {
25421            // Set the title, description, and image for the element
25422            $(element).find('.link-title p').text(data.title || url);
25423            $(element).find('.link-preview a').attr('href',  url);
25424            $(element).find('.link-description').text(data.description || 'No description available.');
25425            if (data.image) {
25426                $(element).find('.link-image').attr('src', data.image).show();
25427            } else {
25428                $(element).find('.link-image').hide();
25429            }
25430        } else {
25431            $(element).find('.link-text h4').text('No metadata found');
25432        }
25433    }).fail(function() {
25434        // In case of an error
25435        $(element).find('.link-text h4').text('Failed to load preview');
25436        $(element).find('.link-description').text('Could not fetch metadata.');
25437        $(element).find('.link-image').hide();
25438    });
25439}
25440
25441 
25442
25443</script>
25443
25444
25445
25446<!-- REMOVED 2026-05-15: duplicate DOMContentLoaded .link-preview.each() loop was dead code
25447     on the social page (feed posts are dynamic, no .link-preview in DOM at ready-time).
25448     The same loop in all-scripts.js still runs for static-page link previews.
25449     ROLLBACK: restore the 
25449<script>$(document).ready... block that was here. -->
25450
25451<script>
25452    $(window).scroll(function() {
25453    if ($(this).scrollTop() >= 1500) {
25454     //   $('#create-new-account-or-login').fadeIn('fast');
25455    //    $('body').addClass('overflow-hidden');
25456    }
25457}); 
25458</script>
25458
25459           
25460
25461
25462
25463<script>
25464       $(function(){
25465     
25466           
25467        $('body').click(function(){
25468            $('.drop-down-blog ul').hide();
25469            $('.share-icons').hide();
25470        })    
25471        $('.drop-down-blog a').click(function(e){
25472            e.stopPropagation();
25473        })   
25474           
25475    $('.social-popup').click(function(){
25476        $(this).fadeOut();
25477        $('body').removeClass('overflow-hidden');
25478    })       
25479           
25480    $('.add-post-inner').click(function(e){
25481        e.stopPropagation();
25482    })     
25483    $('.like-post a').click(function(e){
25484        e.preventDefault();
25485        $(this).toggleClass('liked')
25486    })    
25487  
25488           
25489  })           
25490</script>
25490
25491     
25492
25493    
25494<script>
25495    
25496/* Product fetching and rendering code starts  */
25497function getProductOrGigForWeb(apendtype = '1') {
25498    $('#posts-container').empty();
25499
25500    $('#loader').show();
25501    $('#skeleton-container').show(); 
25502    let pageCount = parseInt($('#pageCount').val());
25503    let productType = $('#productType').val();
25504    let base_url = ''; // Ensure base_url is defined or passed dynamically
25505
25506    $.ajax({
25507        method: 'POST',
25508        url: base_url + '/getProductDataForWeb', // new api created on 19 oct where trending code removed 
25509        data: {
25510            productType: productType,
25511            pageCount: pageCount,
25512            category: $('#category').val(),
25513            subcategory: $('#subcategory').val(),
25514            filterId: $('#datatype').val()
25515        },
25516        dataType: "json",
25517        beforeSend: function () {
25518            $('.post-wrapper').append(loader);
25519            $('#limg').remove();
25520        },
25521        success: function (response) {
25522            $('#loader').hide();
25523                setTimeout(() => {
25524                    $('#skeleton-container').hide();  // Hide skeleton loader after 2 seconds
25525                }, 2000); // Hold the skeleton loader for 2 seconds
25526            if (response.status) {
25527                pageCount += 1;
25528                $('#pageCount').val(pageCount);
25529
25530                let products = response.productArr;
25531                let _html = '';
25532
25533                if (products.length > 0) {
25534                    $.each(products, function (index, product) {
25535                        let userPhotoUrl = (product.photo == null)
25536                            ? base_url + '/public/images/noimage.png'
25537                            : product.photo;
25538
25539
25540                    //const sellerNameSlug = product.sellerName.replace(/\s+/g, '-');
25541                    //const productNameSlug = product.productName.replace(/\s+/g, '-');
25542
25543
25544                    
25545                    const sellerNameSlug = product.sellerName.replace(/\s+/g, '-');
25546                    const productNameSlug = product.productName.replace(/\s+/g, '-');
25547 
25548                    const productUrl = `${sellerNameSlug}/${productNameSlug}/${product.productId}`;
25549 
25550                  //  const productUrl = `/p/${sellerNameSlug}/${productNameSlug}/${product.productId}`;
25551
25552
25553                    
25554                        // Generate product HTML with dynamic data
25555                        _html += `<div class="email-box">
25556                                    <div class="row">
25557                                        <div class="col-md-12">
25558                                            <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
25559                                                <div class="d-flex align-items-center">
25560                                                    <a href="/${product.username}" class="fig">
25561                                                        <img src="${userPhotoUrl}" style="border-radius:50%" alt="Profile-Photo" title="Profile Photo">
25562                                                    </a>
25563                                                    <div class="fnc-title">
25564                                                        <h4 class="notranslate">
25565                                                            <a href="/${product.username}" class="profile-link">@${product.username}</a>
25566                                                            
25567                                                            ${product.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
25568
25569                                                        </h4>
25570                                                        <p style="display:none"><a href="/${product.username}" class="profile-link">@${product.username}</a></p>
25571                                                    </div>
25572                                                </div>
25573                                                <!-- Dropdown menu code -->
25574                            <div class="profile-drop-down" style="display:none">
25575                               <a href="javascript:void(0)" onclick="window.event.cancelBubble = true;$(this).next().slideToggle()" aria-label="drop down"><i class="fa-regular fa-ellipsis" aria-hidden="true"></i></a>
25576                               <ul style="display: none;">
25577                                    <li><a href="javascript:void(0)">
25577Not interested in this post <span><i class="hgi hgi-stroke hgi-meh"></i></span></a></li>
25578                                   <li><a href="javascript:void(0)">Block @levarjewelry <span><i class="hgi hgi-stroke hgi-unavailable"></i></span></a></li>
25579                                     <li style="display:none"><a href="javascript:void(0)">Feedback <span><i class="fa-regular fa-comment-lines"></i></span></a></li>
25580                                    <li style="display:none"><a href="javascript:void(0)" onclick="$('#report-product').fadeIn('fast'); $('body').addClass('overflow-hidden');">Report item <span><i class="fa-regular fa-circle-exclamation"></i></span></a></li>
25581                               </ul>
25582
25583                           </div>
25584                                            </div>
25585                                        </div>
25586                                    </div>
25587                                    <div class="row">
25588                                        <div class="col-md-12" data-id="is-blog-${product.is_blog}"  id="contentDivID-${product.postId}">
25589                                            
25590                                            <div class="blog-main-image mb-10 movie-trailer product-image-feedpage">
25591                                                <div class="">
25592                                                    <div class="item lightgallery">
25593                                                        <div data-src="${product.mainImage}" data-sub-html="<div class='fnc mt-0 justify-content-between mb-0 align-items-start'><div class='d-flex'><div class='fig'><img  src='${userPhotoUrl}' style='border-radius:50%'></div><div class='fnc-title'><h4>${product.username}</h4><p>@${product.username}</p></div></div></div>">
25594                                                            <a style="border:none" href="${productUrl}"><img  src="${product.productImage}" alt="Post Image" title=""></a>
25595                                                        </div>
25596                                                    </div> 
25597                                                </div>
25598                                            </div>
25599                                            <div id="chekcID" class="post-text">
25600                                                            
25601                                               <a href="${productUrl}">
25602                                                    <p>${product.productName}</p>
25603                                                </a>
25604                                            </div>
25605
25606                                            <div style="color:white;" class="price-box d-flex align-items-center">
25607                                                ${
25608                                                     
25609                                                    Number(product.discountedPrice) > 0
25610                                                        ? `<div class="price" style="font-size: large; margin-right: 5px;">$${Number(product.discountedPrice).toFixed(2)}</div>
25611                                                        <span class="old-price" style="font-size: small; color: gray;"> was $${Number(product.sellingPrice).toFixed(2)}</span>`
25612                                                        : `<div class="price" style="font-size: large;">$${Number(product.sellingPrice).toFixed(2)}</div>`
25613                                                
25614                                                }
25615                                            </div>
25616                                        </div>
25617                                    </div>
25618                                    <div style="display:none" class="row">
25619                                        <div class="col-md-12">
25620                                            <div class="date">
25621                                                <ul class="d-flex m-0">
25622                                                    <li>${product.postDate}</li>
25623                                                    <li><span>•</span></li>
25624                                                    <li>${product.postTime}</li>
25625                                                </ul>
25626                                            </div>
25627                                        </div>
25628                                    </div>
25629                                    <div class="row">
25630                                        <div class="col-md-12">
25631                                            <div class="date ogl">
25632                                                <ul class="d-flex align-items-start">
25633                                                    
25634                                                    <li class="like-post">
25635                                                        
25636                                                        <a href="javascript:void(0)" class="like-button ${product.liked == '1' ? 'likeIsActive' : 'likeIsDeactive'}"  data-postid="${product.productId}">
25637                                                            <span class="c-img">
25638                                                            <img src="${product.isLiked	 == '1' ? 'https://www.jumpspree.com/public/images/heart-filled.png?ver:2.005' : 'https://www.jumpspree.com/public/images/favourite-stroke-rounded.png'}" alt="Like" title="like"></span>
25639                                                            <span id="like-id-${product.productId}" class="like-count ${product.liked == '1' ? 'likeCountIsActive' : 'likeCountIsDeactive'}">${product.likes}</span>
25640                                                        </a>
25641                                                    </li>
25642                                        <li class="repost-post">
25643                                        <a href="javascript:void(0)" class="repost-button" onclick="$('#repost-popup-product').fadeIn('fast'); $('body').addClass('overflow-hidden')">
25644                                            <span class="c-img">
25645                                                <i class="fa-light fa-arrows-repeat" aria-hidden="true"></i></span>
25646                                            <span id="repost-id-1005" class="like-count">${product.reposted_count}</span>
25647                                        </a>
25648                                    </li>
25649                                                    <li class="repost-post" style="pointer-events: none; display:none">
25650                                        <a href="javascript:void(0)" class="repost-button">
25651                                            <span class="c-img">
25652                                                <i class="fa-solid fa-chart-simple"></i></span>
25653                                            <span id="like-id-${product.productId}" class="like-count" style="${product.viewcount == 0 ? 'display:none' : ''}">${product.viewcount}</span>
25654                                             
25655
25656                                        </a>
25657                                    </li>
25658                                                    
25659                                                    
25660                                        <li class="view-post" style="display:none">
25661                                            <a href="javascript:void(0)">
25662                                                <span class="c-img"><i class="fa-regular fa-bookmark" aria-hidden="true"></i> </span>
25663                                            
25664                                            </a>
25665                                        </li>
25666                                                    <li class="share-post uplad" style="display:none">
25667                                        <a href="javascript:void(0)" class="share-button-desktop" onclick="window.event.cancelBubble = true;$('.drop-down-menu-share').hide();$(this).next().fadeToggle(200);">
25668                                            <span class="c-img">
25669                                                            <i class="fa-solid fa-ellipsis" aria-hidden="true"></i>
25670                                                    </span>
25671                                        </a>
25672                                                        <div class="drop-down-menu-share" style="display: none;">
25673                                                            <ul>
25674                                                            <li><a href="javascript:void(0)" onclick="window.event.cancelBubble = true; $('#share-site-link').addClass('share-in-open'); $('.drop-down-menu-share').hide();$('#embed-code').removeClass('embed-in');">Share <span><i class="fa-regular fa-arrow-up-from-bracket"></i> </span>  </a></li>
25675                                                            <li><a href="javascript:void(0)">Copy link to share <span><i class="hgi hgi-stroke hgi-link-05"></i> </span></a></li>
25676                                                            <li><a href="javascript:void(0)">Copy text <span><img src="https://www.jumpspree.com/public/images/copy-text.png?ver:1.02" alt="Copy" title="Copy"> </span></a></li>
25677                                                            <li style="display:none"><a href="javascript:void(0)" onclick="window.event.cancelBubble = true; $('#embed-code').addClass('embed-in'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');">Embed <span><img src="https://www.jumpspree.com/public/images/embed.png?ver:1.05" alt="embed" title="embed" style="max-width: 20p
25677x !important;"> </span></a></li>
25678                                                            </ul>  
25679                                                            </div>
25680       
25681                                    </li>
25682                                                </ul>
25683                                            </div>
25684                                        </div>
25685                                    </div>
25686                                </div>`;
25687                    });
25688                } else {
25689                    _html += `<div class="no-record-found">
25690                                <img src="${base_url}/public/images/no-search.svg" alt="Jumpspree">
25691                                <h2>No Products Found.</h2>
25692                            </div>`;
25693                }
25694
25695                if (apendtype == '1') {
25696                    $('#posts-container-product').html(_html);
25697                } else if (apendtype == '2') {
25698                    $('#posts-container-product').append(_html);
25699                    if (response.count == '0') {
25700                        $(window).unbind('scroll');
25701                    }
25702                }
25703
25704                $('#posts-container-product').on('click', '.email-box', function () {
25705                                
25706                                    const scrollY = window.pageYOffset || document.documentElement.scrollTop;
25707                                    const page = $(this).data('page'); 
25708                                    sessionStorage.setItem("hasReturnedFromShop", true);
25709                                    sessionStorage.setItem('shopScrollY', scrollY);
25710                                    sessionStorage.setItem('shopPage', page);
25711                                });
25712
25713
25714            }
25715        },
25716        complete: function () {
25717            $('.post-wrapper .loader').remove();
25718        }
25719    });
25720}
25721
25722
25723
25724let maxReached = false;
25725$(document).ready(function() {
25726           let activePage = sessionStorage.getItem('activeTab') || 'social';
25727            let page = 1; 
25728            let hashTagValue = document.getElementById('hashTagValue'); 
25729            let hashTag =  hashTagValue.value  ;
25730            //
25731            let isFetching = false;
25732            let scrollTimeout;
25733            console.log("page is loaded !");
25734            // Initial load for social feed
25735
25736
25737
25738            
25739           // getSocialFeed('3', page, '1', '');
25740
25741
25742
25743  if(activePage==="social"){
25744                if (_preloadedPosts && _preloadedPosts.length > 0) {
25745                    // Defer rendering to next tick — lets browser paint skeleton first, reducing TBT
25746                    setTimeout(function() {
25747                        appendPosts(_preloadedPosts, _preloadedUserData, '');
25748                        if (_preloadedDrafts && _preloadedDrafts.length > 0) {
25749                            appendDrafts(_preloadedDrafts);
25750                        }
25751                        if (typeof $.fn.owlCarousel !== 'undefined') {
25752                            $('.owl-carousel').owlCarousel('destroy');
25753                            $('.owl-carousel-home-feed').owlCarousel({
25754                                loop:false, margin:10, nav:false, dots:false, autoplay:false, autoplayTimeout:5000,
25755                                responsive:{ 0:{items:2.2,loop:false,mouseDrag:false,autoWidth:true,touchDrag:false,pullDrag:false,freeDrag:false}, 600:{items:3}, 1000:{items:3.2,autoWidth:true} }
25756                            });
25757                            $('.owl-carousel').owlCarousel({
25758                                loop:true, margin:10, nav:false, dots:false, autoplay:false, autoplayTimeout:5000,
25759                                responsive:{ 0:{items:1}, 600:{items:1}, 1000:{items:1} }
25760                            });
25761                        }
25762                        $('#loader').hide();
25763                        $('#skeleton-container').hide();
25764                        if (window.JumpSocialBoot) { window.JumpSocialBoot.feedReady(); }
25765                    }, 0);
25766                    // page stays at 1 so first scroll increments to 2 and loads page 2
25767                } else {
25768                    getSocialFeed('3', page, '1', '');
25769                }
25770            }else if(activePage==="shop") {
25771                const hasReturnedFromProductPage = sessionStorage.getItem("hasReturnedFromShop") ?? 'false';
25772                const prevShopPage = sessionStorage.getItem("shopPage");
25773                if(hasReturnedFromProductPage === 'true'){  
25774                    sessionStorage.setItem("hasReturnedFromShop", false);
25775                }
25776                
25777                getProductOrGigForWeb(page);
25778                
25779            }
25780
25781
25782
25783            // Handle tab switch to 'Shop'
25784            $('#shoplinkforweb').click(function() {
25785                $('.profile-menu').hide();
25786                if (activePage !== 'shop') {
25787                    if (window.location.pathname !== '/shop') {
25788                        window.location.href = '/shop';
25789                    }
25790                    /* console.log("Shop is activated");
25791                    setActivePage('shop');
25792                    page = 1; // Reset page count for shop
25793                    maxReached = false; // Reset maxReached when switching tabs
25794                    getProductOrGigForWeb(page); // Load shop products for page 1
25795                    sessionStorage.setItem("activeTab", 'shop');
25796                    // Update active tab
25797                    $('#shoplinkforweb').addClass('active');
25798                    $('#postlink').removeClass('active'); */
25799                }
25800            });
25801
25802            // Handle tab switch to 'Social'
25803            $('#postlink').click(function() {
25804                 $('.profile-menu').hide();
25805                if (activePage !== 'social') {
25806                    console.log("Social is activated");
25807                    setActivePage('social');
25808                    page = 1; // Reset page count for social
25809                    maxReached = false; // Reset maxReached when switching tabs
25810                    getSocialFeed('3', page, '1', hashTag); // Load social feed for page 1
25811 sessionStorage.setItem('activeTab', 'social');
25812                    // Update active tab
25813                    $('#postlink').addClass('kkl');
25814                    $('#shoplinkforweb').removeClass('active');
25815                }
25816            });
25817
25818            // Debounced scroll handler
25819            $(window).scroll(function() {
25820                if (maxReached) {
25821                    return;
25822                }
25823
25824                if (scrollTimeout) {
25825                    clearTimeout(scrollTimeout); // Clear the previous timeout if it's still pending
25826                }
25827
25828                scrollTimeout = setTimeout(function() {
25829                    //if ($(window).scrollTop() + $(window).height() >= $(document).height() - 100 && !maxReached && !isFetching) {
25830                    // below loads wehn 75% screen 31 des riaz load
25831                    if ($(window).scrollTop() + $(window).height() >= $(document).height() * 0.75 && !maxReached && !isFetching) {
25832
25833                        isFetching = true; // Set fetching flag to prevent multiple API calls
25834
25835                        // Call the appropriate function based on the active page
25836                        if (activePage === 'social') {
25837                            const _currentHashtag = document.getElementById('hashTagValue').value;
25838
25839                            if (_currentHashtag) {
25840                                // Hashtag feed: dedicated counter, never touches regular feed's page
25841                                _hashtagPage++;
25842                                getSocialFeed('3', _hashtagPage, '1', _currentHashtag, function() {
25843                                    isFetching = false;
25844                                });
25845                            } else {
25846                                // Regular feed: increment once here
25847                                page++;
25848                                getSocialFeed('3', page, '1', '', function() {
25849                                    isFetching = false;
25850                                });
25851                            }
25852                        } else if (activePage === 'shop') {
25853                            if(page > 1){
25854                                page =2;
25855                            }
25856                            getProductOrGigForWeb(page); // Pass the incremented page number for shop
25857                            isFetching = false; // Reset fetching flag
25858                            console.log("Shop isFetching : ", isFetching, "page number:", page);
25859                        }
25860                    }
25861                }, 300); // Wait 300ms before triggering the API call to prevent rapid firing
25862            });
25863
25864            // Helper function to set active page and reset states
25865            function setActivePage(pageName) {
25866                activePage = pageName;
25867                document.querySelector('body').classList.remove('social', 'shop');
25868                document.querySelector('body').classList.add(activePage);
25869
25870
25871                 sessionStorage.setItem('activeTab', pageName);
25872                //sessionStorage.setItem('page', 1);
25873                sessionStorage.setItem('hasReturnedFromShop', false);
25874            }
25875        
25876    // Log for debugging
25877    console.log("Document ready. Active page:", activePage);
25878
25879
25880   
25881    //Like unlike functionality :
25882    // Like button handler
25883    $(document).on('click', '.like-button', function() {
25884            var postId = $(this).data('postid');
25885            var likeButton = $(this);   
25886            var likeId = 'like-id-' + postId;
25887
25888            checkAccess(function() {
25889                $.ajax({
25890                    url: base_url + '/likeUnlike',
25891                    type: 'POST',
25892                    data: { pid: postId },
25893                    dataType: 'json',
25894                    success: function(response) {
25895                        if (response.status) {
25896                            var likeCount = response.likes;
25897                            var likeIcon = likeButton.find('img').first();  // Find the first image element
25898                            var likeCountElement = document.getElementById(likeId);
25899
25900                            // Update the like count
25901                            if(response.hideLike == "0" || response.hideLike == 0){
25902                                if (likeCountElement) {
25903                                    likeCountElement.textContent = likeCount;
25904                                    //likeCountElement.style.color = "#FF0088";
25905
25906                                } else {
25907                                    console.warn('Like count element not found with ID:', likeId);
25908                                }
25909                            }
25910
25911                            // Update the heart icon based on the like/unlike status
25912                            if (response.result === "1") {  // Strict comparison for consistency 
25913                                //'likeIsActive' : 'likeIsDeactive'
25914                                likeButton.addClass('likeIsActive');
25915                                likeButton.removeClass('likeIsDeactive');
25916                                 
25917                                
25918                                $(likeCountElement).addClass('likeCountIsActive');
25919                                $(likeCountElement).removeClass('likeCountIsDeactive');
25920
25921                                likeIcon.attr('src', 'https://www.jumpspree.com/public/images/heart-filled.png?ver:1.0251');  // Liked
25922                                 if (parseInt(response.likes) > 0) {
25923                                    $(likeCountElement).text(response.likes).css('display', 'inline-block');
25924                                } else {
25925                                    $(likeCountElement).hide(); // fallback if backend sends 0 even on like
25926                                }
25927
25928
25929                            } else {
25930                                likeButton.addClass('likeIsDeactive');
25931                                likeButton.removeClass('likeIsActive');  
25932                                $(likeCountElement).addClass('likeCountIsDeactive');
25933                                 $(likeCountElement).removeClass('likeCountIsActive'); 
25934                                likeIcon.attr('src', 'https://www.jumpspree.com/public/images/favourite-stroke-rounded.png');  // Unliked
25935
25936                                // Hide like count if 0
25937                                if (parseInt(response.likes) === 0) {
25938                                    $(likeCountElement).hide();
25939                                } else {
25940                                    $(likeCountElement).text(response.likes).css('display', 'inline-block');
25941                                }
25942                            }
25943                        } else {
25944                            console.log('Error: ', response.message);
25945                        }
25946                    },
25947                    error: function(xhr, status, error) {
25948                        console.error('AJAX error: ', error);
25949                        console.error('Response Text: ', xhr.responseText);
25950                    }
25951                });
25952            });
25953        });
25954
25955});
25956
25957 
25958
25959
25960function removeNonAlphanumeric(inputString) {
25961    return inputString.replace(/[^a-zA-Z0-9]/g, '-');
25962};
25963
25964function handleBackButtonClick() {
25965    // Show posts-container 
25966    const postsContainer = document.getElementById('posts-container');
25967    const hashTagsDiv = document.getElementById('hashTagsDiv');
25968    const add_post_top = document.getElementById('add-post-top');
25969    const fixedHashTagsDiv = document.getElementById('fixed-heading-hashTag');
25970    $('.post-area').removeClass('hashtagopen');
25971   
25972
25973      
25974    add_post_top.style.display = 'block';
25975    if (postsContainer) {
25976        postsContainer.style.display = 'block';
25977    } else {
25978        console.error('Element with ID "posts-container" not found.');
25979    }
25980
25981    // Hide and clear posts-container-hashTags
25982    const hashTagContainer = document.getElementById('posts-container-hashTags');
25983    if (hashTagContainer) {
25984        hashTagContainer.style.display = 'none';
25985        hashTagsDiv.style.display = 'none';
25986       
25987        fixedHashTagsDiv.style.display = 'none';
25988        hashTagContainer.innerHTML = ''; // Clear the content
25989        $('body').removeClass('hashtag-active');
25990    } else {
25991        console.error('Element with ID "posts-container-hashTags" not found.');
25992    }
25993
25994    // Reset hashtag value
25995    const hashTagValueElement = document.getElementById('hashTagValue');
25996    if (hashTagValueElement) {
25997        hashTagValueElement.value = ''; // Reset to null
25998    } else {
25999        console.error('Element with ID "hashTagValue" not found.');
26000    }
26001    maxReached =  false;
26002}
26003
26004
26005
26006// renamed jan 23 
26007//new code 
26008  const userToken = "";
26009
26010function getSocialFeed(type = '3', page = 1, apendtype = '1', hashtag = '', onComplete = null) {
26011
26012    console.log("You are on page:", page);
26013    console.log("You are logged or not? :", userToken ? "Logged In" : "Guest");
26014
26015    if (!userToken && page > 1 && !hashtag) {
26016        // Guest users: only block page > 1 for the regular feed, not hashtag browsing
26017        $('#signup-new-process').hide();
26018        $('#signin-new-process').fadeIn('fast');
26019        $('body').addClass('feed-stopped');
26020        $('html, body').animate({ scrollTop: 0 }, 'fast');
26021        if (typeof onComplete === 'function') { onComplete(); } // reset isFetching so popup re-triggers on next scroll
26022
26023    }else{
26024
26025
26026        $('#posts-container-product').empty();
26027
26028        if(apendtype=='0'){
26029
26030            $('#posts-container').empty();
26031
26032        }
26033
26034        // New hashtag selected (page 1) — clear previous results and reset page counter
26035        if (hashtag && page == 1) {
26036            $('#posts-container-hashTags').empty();
26037            _hashtagPage = 1;
26038
26039            // Immediately switch to hashtag view so skeleton appears in the right place
26040            $('#posts-container').hide();
26041            $('#posts-container-hashTags').show();
26042            $('#hashTagsDiv').show();
26043            $('#add-post-top').hide();
26044            document.getElementById('currentHashTag').innerText = '#' + hashtag;
26045            $('html, body').animate({ scrollTop: 0 }, 150);
26046        }
26047
26048        document.getElementById('hashTagValue').value = hashtag;
26049
26050        setActiveLink('postlink');
26051        $('#loader').show();
26052        $('#skeleton-container').show();
26053
26054
26055        $.ajax({
26056            url: base_url + '/getPostBlogTest',
26057            type: 'POST',
26058            //data: { productType: type, page: 1 },
26059            data: { productType: type, pageCount: page, hashtag: hashtag  },
26060            dataType: "Json",
26061            success: function(response) {
26062                $('#loader').hide();
26063                setTimeout(() => {
26064                    $('#skeleton-container').hide();
26065                }, 2000); // Hold the skeleton loader for 2 seconds
26066                // Signal orchestrator: feed is ready — release deferred API calls
26067                if (window.JumpSocialBoot) { window.JumpSocialBoot.feedReady(); }
26068                //console.log(response);  // Log the response to verify data structure
26069
26070                if (response.status) {
26071                    if (response.productArr && response.productArr.length > 0) {
26072                        console.log("coomes if 338"); 
26073                        appendPosts(response.productArr, response.userData, hashtag );  
26074                        //draft logic below
26075                        if (response.draftArray && response.draftArray.length > 0) {
26076                            appendDrafts(response.draftArray); // Pass drafts to append function
26077                        } else {
26078                            console.log("No drafts available."); 
26079                        }
26080                        $('.owl-carousel').owlCarousel('destroy'); 
26081                        $('.owl-carousel-home-feed').owlCarousel({
26082                            loop:false,
26083                            margin:10,
26084                            nav:false,
26085                            dots:false,
26086                            autoplay:false,
26087                            autoplayTimeout:5000,   
26088                            
26089                            responsive:{
26090                                0:{
26091                                    items:2.2,
26092                                    loop:false,
26093                                    mouseDrag: false,
26094                                    autoWidth: true,
26095                                    touchDrag: false,
26096                                    pullDrag: false,
26097                                    freeDrag: false,
26098                                },
26099                                600:{
26100                                    items:3
26101                                },
26102                                1000:{
26103                                    items:3.2,
26104                                    autoWidth: true,
26105                                    
26106                                }
26107                            }
26108                        });
26109                        $('.owl-carousel').owlCarousel({
26110                            loop:true,
26111                            margin:10,
26112                            nav:false,
26113                            dots:false,
26114                            autoplay:false,
26115                            autoplayTimeout:5000,    
26116                            responsive:{
26117                                0:{
26118                                    items:1
26119                                },
26120                                600:{
26121                                    items:1
26122                                },
26123                                1000:{
26124                                    items:1
26125                                }
26126                            }
26127                        });
26128                        
26129                        page++;  // Increment page for next call
26130                    } else {
26131                        
26132                        console.log("coomes else 363"); 
26133                        // If no data returned, stop further loading
26134                        maxReached = true;
26135                        $('#loader').hide();  // Optionally hide the loader
26136                        $('#noMorePosts').show();  // Show "No more posts" message
26137                    }
26138                } else {
26139                    //console.log('No posts found or error:', response.message);
26140                    $('#loader').hide();  // Hide loader
26141                    $('#noMorePosts').show();  // Show "No more posts" message
26142                    maxReached = true;  // Set maxReached flag to stop further API calls
26143                }
26144                /* if (response.status) {
26145                    appendPosts(response.productArr);
26146                } else {
26147                    console.log('No posts found or error:', response.message);
26148                } */
26149            },
26150            error: function(xhr, status, error) {
26151                $('#loader').hide();
26152            // console.error('AJAX error:', error);
26153            },
26154            complete: function() {
26155                if (typeof onComplete === 'function') onComplete();
26156            }
26157        });
26158
26159    }
26160
26161}
26162
26163
26164
26165
26166// start of renderPosts function
26167
26168function appendPosts(posts, userData, hashtag) {
26169    const container = document.getElementById('posts-container'); // standard div
26170    const hashTagContainer = document.getElementById('posts-container-hashTags'); // standard div
26171   
26172    const hashTagsDiv = document.getElementById('hashTagsDiv'); 
26173    
26174    const add_post_top = document.getElementById('add-post-top');
26175    const currentHashTag = document.getElementById('currentHashTag');
26176    
26177    //container.innerHTML = ''; // Clear container before appending new posts
26178     
26179    if (!container) {
26180       console.error('Container not found but may be hastags found');
26181        // return; // commented on Jan 2 if any issue pls uncomment
26182    }else{
26183         console.log('Container found');
26184    } 
26185    
26186    if(isNewPost) {
26187        container.innerHTML = '';
26188        hashTagContainer.innerHTML = '';
26189        isNewPost = false; // reset — only clear once, not on every subsequent scroll
26190    }
26191    
26192    
26193    // Toggle visibility based on the hashtag presence 
26194    if (hashtag) {
26195        hashTagsDiv.style.display = "block";
26196        add_post_top.style.display = "none";
26197        currentHashTag.innerText = `#${hashtag}`;
26198        container.style.display = "none";
26199        hashTagContainer.style.display = "block";
26200    } else {
26201        hashTagsDiv.style.display = "none";
26202        add_post_top.style.display = "block";
26203        currentHashTag.innerText = '';
26204        container.style.display = "block";
26205        hashTagContainer.style.display = "none";
26206    }
26207
26208
26209
26210    // Reset link preview stagger so each feed page starts at 0ms delay — 2026-05-15
26211    window._lpStagger = 0;
26212
26213    posts.forEach((post, _pi) => {
26214        const _targetContainer = hashtag ? hashTagContainer : container;
26215        if (_targetContainer && _targetContainer.querySelector(`#ni${post.postId}`)) return;
26216        let postHtml = '';
26217        let currentUser = userData ? userData.full_name : null;
26218        let currentUserName = userData ? userData.username : null;
26219        const postTextWithLinks = convertHashtagsToLinks(post.postText); // Convert hashtags to clickable links
26220        const uniqueId = `link-preview-${post.postId}-${Math.floor(Math.random() * 1000)}`;
26221        let shopfeedurl='https://www.jumpspree.com/ps/'+post.username+'/jumpid'+post.postId+'';
26222        // console.log("_______________comes");
26223        // console.log(post.quoteDetails);
26224        let dynamicCss = post.quoteDetails ? 'repost-social' : '';
26225        //repost-social
26226        let onlineStatusClass = post.online_status == 0 ? 'online-green' : 'online-red';
26227
26228
26229
26230        footerButtonsForAll = `     
26231                    <div class="row">
26232                        <div class="col-md-12">
26233                            <div class="date ogl pt-0">
26234                                <ul class="d-flex align-items-start pt-0">
26235                                    <li style="display:none"  class="comment-post">
26236                                        
26237                                    <a href="javascript:void(0)" onclick="openCommentPopup('${post.username}', '${post.name}', ${post.postId}, '${currentUser}', '${currentUserName}')"> 
26238                                            <span class="c-img">
26239                                                <i class="fa-regular fa-message-middle" aria-hidden="true"></i></span> <span class="c-img">${post.comments}</span>
26240                                        </a>
26241                                    </li>
26242                                    
26243                                    <li class="like-post">
26244                                        <a href="javascript:void(0)"  class="like-button ${post.liked == '1' ? 'likeIsActive' : 'likeIsDeactive'}"   data-postid="${post.postId}">
26245                                            <span class="c-img">
26246                                                <img src="${post.liked == '1' ? 'https://www.jumpspree.com/public/images/heart-filled.png?ver:3.015' : 'https://www.jumpspree.com/public/images/favourite-stroke-rounded.png?ver:1.05'}" alt="Like" title="Like"></span>
26247                                            <span style="${post.likes == 0 ? 'display:none' : ''}" id="like-id-${post.postId}" class="like-count  ${post.liked == '1' ? 'likeCountIsActive' : 'likeCountIsDeactive'}">${post.hideLike == 1 ? '' : post.likes}</span>
26248                                        </a>
26249                                    </li> 
26250                                                            
26251                                <li class="comment-post"> 
26252                                                                                    <a href="javascript:void(0);" onclick="$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');">
26253                                                <span class="c-img">
26254                                                    <img src="https://www.jumpspree.com/public/images/comment-03-stroke-rounded.png" alt="Comment" title="Comment">
26255                                                </span> 
26256                                                <span class="c-count" style="${post.comments == 0 ? 'display:none' : ''}">${post.comments}</span>
26257                                            </a>
26258                                                                            </li>
26259        
26260                                    
26261                                
26262                                    
26263                                    <li class="repost-btn share-post">
26264                                        <a href="javascript:void(0)" 
26265                                        class="repost-button ${post.is_reposted_by_user ? 'reposted' : 'no-repost'}" 
26266                                        style="flex-direction:column" 
26267                                        onclick="${post.is_reposted_by_user ? `unrepostPost('${post.postId}')` : `handleRepostDropdown(event, this)`}">
26268                                            <span class="c-img">
26269                                                <i style="display:none" class="fa-light fa-arrows-repeat" aria-hidden="true"></i>
26270                                                <i class="fa-light fa-arrows-repeat ${post.is_reposted_by_user ? 'user-reposted-post' : ''}" aria-hidden="true"></i>
26271                                            </span>
26272                                            <span id="repost-count-${post.postId}" class="like-count" style="${post.reposted_count == 0 ? 'display:none' : ''}">
26273                                                ${post.reposted_count}
26274                                            </span>
26275                                        </a>
26276                                        <div class="drop-down-menu-share" style="display:none">
26277                                            <ul>
26278                                                <li>
26279                                                    <a href="javascript:void(0)" 
26280                                                    onclick="${post.is_reposted_by_user ? `unrepostPost('${post.postId}')` : `handleRepostPopup(this, '${post.postId}')`}">
26281                                                    ${post.is_reposted_by_user ? 'Undo Repost' : 'Repost'} 
26282                                                    <span><i class="fa-light fa-arrows-repeat ${post.is_reposted_by_user ? 'user-reposted-post' : ''}" aria-hidden="true"></i></span>
26283                                                    </a>
26284                                                </li>
26285                                                <li>
26286                                                    <a href="javascript:void(0)" 
26287                                                    class="repost-button" 
26288                                                    data-username="${post.username}"  
26289                                                    data-postprofile="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.03'}"  
26290                                                    data-name="${post.name}" 
26291                                                    data-postid="${post.postId}" 
26292                                                    data-posttext="${encodeURIComponent(post.postText)}"
26293                                                    data-currentuser="${currentUser}" 
26294                                                    data-currentusername="${currentUserName}" 
26295                                                    onclick="openRePostPopupOnPage(this)">
26296                                                    ${post.is_reposted_by_user ? 'Remove Quote Repost' : 'Add Caption and Repost'} 
26297                                                    <span><i class="fa-sharp fa-regular fa-pen-line"></i></span>
26298                                                    </a>
26299                                                </li> 
26300                                            </ul>  
26301                                        </div>
26302                                    </li>
26303
26304                                                        
26305                                    <li class="view-post" style="display:none">
26306                                        <a href="javascript:void(0)"  class="repost-button">
26307                                            <span class="c-img">
26308                                                <img style="width:20px !important" src="https://www.jumpspree.com/public/images/analytics-03-stroke-rounded.png" alt="view" title="view"></span>
26309                                            <span style="${post.viewcount == 0 ? 'display:none' : ''}" id="like-id-${post.postId}" class="like-count">${post.viewcount}</span>
26310                                                
26311
26312                                        </a>
26313                                    </li>
26314                                        
26315                                    
26316                                    <li class="repost-post save-bookmark" data-postid="${post.postId}">
26317                                                                            <a href="javascript:void(0)">
26318                                            <span class="c-img">
26319                                                ${post.is_wishlist == '1' ? '<img class="bookmark-active" style="height: 17px !important; width: 15px !important" src="https://www.jumpspree.com/public/images/bookmark-filled.png?v=2" alt="bookmark" title="bookmark" />'  : '<img style="height: 17px !important; width: 15px !important" class="bookmark-inactive" src="https://www.jumpspree.com/public/images/bookmark-021.png" alt="bookmark" title="bookmark" />'}
26320                                            </span>
26321                                        </a> 
26322                                        
26323                                        <a style="display:none"  href="javascript:void(0)" class="repost-button" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">
26324                                            <span class="c-img">
26325                                                <img src="https://www.jumpspree.com/public/images/bookmark-021.png" alt="bookmark" title="bookmark" id="bookmarkicon" onclick="bookmark('')" />
26326                                            </span>
26327                                        </a>
26328                                                                    </li>
26329
26330                                    
26331                                                        
26332                                    <li class="share-post uplad hide-on-desktop" style="display:none !important">
26333                                        <a href="javascript:void(0)" class="share-button">
26334                                            <img src="https://www.jumpspree.com/public/images/share-outline.png" alt="share-icon" title="share-icon">
26335                                        </a>
26336                                    </li>                    
26337                                                        
26338                                                        
26339                                    <li class="view-post" style="display:none">
26340                                        <a href="javascript:void(0)">
26341                                            <span class="c-img"><img style="width:20px !important" src="https://www.jumpspree.com/public/images/analytics-03-stroke-rounded.png" alt="view" title="view"> </span> 
26342                                                
26343                                            <span class="c-count" style="${post.viewcount == 0 ? 'display:none' : ''}">${post.viewcount}</span>
26344
26345                                        </a>
26346                                    </li>                    
26347                                    
26348                                    <li class="share-post uplad hide-on-desktop" style="display:block !important">
26349                                        <a href="javascript:void(0)" class="share-button"  onclick="window.event.cancelBubble = true; openPostShareDialog('${post.postId}','${post.username}'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');">
26350                                            <span class="c-img share05">
26351                                                            <img src="https://www.jumpspree.com/public/images/plane-share.png" alt="Share" title="Share" style="filter:invert()">
26352                                                    </span>
26353                                        </a>
26354                                    </li>
26355                                                
26356                                            
26357                                    <li class="share-post uplad" style="display:none !important">
26358                                        <a href="javascript:void(0)" class="share-button-desktop" onclick="window.event.cancelBubble = true;$('.drop-down-menu-share').hide();$(this).next().fadeToggle(200);">
26359                                            <span class="c-img">
26360                                                            <i class="fa-solid fa-ellipsis" aria-hidden="true"></i>
26361                                                    </span>
26362                                        </a>
26363                                                        <div class="drop-down-menu-share" style="display:none">
26364                                                            <ul>
26365                                                            <!-- <li><a href='javascript:void(0)' onclick="window.event.cancelBubble = true; $('#share-site-link').addClass('share-in-open'); $('.drop-down-menu-share').hide();$('#embed-code').removeClass('embed-in');">Share <span><i class="fa-regular fa-arrow-up-from-bracket"></i> </span>  </a></li> -->
26366
26367
26368                                                            <li>
26369                                                                <a href='javascript:void(0)' 
26370                                                                onclick="window.event.cancelBubble = true; openShareDialog('post-${post.postId}'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');">
26371                                                                    Share 
26372                                                                    <sp
26372an><i class="fa-regular fa-arrow-up-from-bracket"></i></span>
26373                                                                </a>
26374                                                            </li>
26375
26376
26377                                                            <li><a href='javascript:void(0)'>Copy link to share <span><i class="hgi hgi-stroke hgi-link-05"></i> </span></a></li>
26378                                                            <li><a href='javascript:void(0)'>Copy text <span><img src="https://www.jumpspree.com/public/images/copy-text.png?ver:1.02" alt="Copy" title="Copy"> </span></a></li>
26379                                                            <li style="display:none"><a href='javascript:void(0)' onclick="window.event.cancelBubble = true; $('#embed-code').addClass('embed-in'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');">Embed <span><img src="https://www.jumpspree.com/public/images/embed.png?ver:1.05" alt="Jumpspree" style="max-width: 20px !important;"> </span></a></li>
26380                                                            </ul>  
26381                                                            </div>
26382    
26383                                    </li>
26384                                </ul>
26385                            </div>
26386                        </div>
26387                    </div>`;
26388
26389        //if (post.is_blog === '1' && post.source != 1 || && post.source != '1') {
26390      if ((post.is_blog === '1' || post.is_blog == 1) && post.source !== 1 && post.source !== '1') {
26391
26392            const hasImage =
26393            post.postFiles &&
26394            post.postFiles.length > 0 &&
26395            post.postFiles[0].imagepath &&
26396            post.postFiles[0].imagepath.trim() !== '';
26397
26398            const containerClass = `email-box article-feed ${hasImage ? 'article-feed-has-image' : 'article-feed-no-image'} ${dynamicCss} dp${post.postId}`;
26399           
26400            const hideClassIfnoImage = hasImage ? 'style="display:block"' : 'style="display:none"';
26401
26402            // Blog Design
26403            postHtml = `
26404                    
26405                            <div data="blogStatic" data-is-blog="${post.is_blog}" data-source="${post.source}" class="${containerClass}" id="ni${post.postId}">
26406                                <div class="row">
26407                                    <div class="col-md-12">
26408                                        <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
26409                                            <div class="d-flex align-items-center notranslate">
26410                                                <!-- Link wrapping the profile photo -->
26411                                                <a href="/${post.username}" class="fig">
26412                                                    <div id="online-dot-${post.postId}" class=" ${onlineStatusClass}"></div>   
26413                                                <img src="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.004'}" 
26414                                                        style="border-radius:50%" 
26415                                                        alt="Profile-Photo" title="Profile Photo">
26416                                                    
26417                                                </a>
26418
26419                                                <div class="fnc-title">
26420                                                    <!-- Link wrapping the profile name -->
26421                                                    <h4>
26422                                                        <a href="/${post.username}" class="profile-link">
26423                                                            ${post.username}
26424                                                        </a>
26425                                                            ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
26426                                                                
26427                                                            <div data-uoutput="${post.pdate} ${post.ptime}" class="datenew">
26428                                                                ${formatPostDate(post.pdate + ' ' + post.ptime)}
26429                                                            </div>
26430                                                    </h4>
26431                                                    
26432                                                    <!-- Link wrapping the username -->
26433                                                    <p style="display:none">
26434                                                        <a href="/${post.username}" class="profile-link">
26435                                                            @${post.username}
26436                                                        </a>
26437                                                    </p>
26438                                                </div>
26439                                            </div>
26440
26441                                        
26442                                            <!-- Dropdown menu code -->
26443                                            <div class="profile-drop-down">
26444                                                                <a  href="javascript:void(0)" onclick="window.event.cancelBubble = true;$('.more-setting-pop').removeClass('more-settings');
26444$('.status .profile-drop-down > ul').hide();$(this).parents('.email-box').siblings().find('.profile-drop-down > ul').hide();$(this).next().slideToggle('fast');$('.user-sec-strip').removeClass('zin9');$(this).parents('.user-sec-strip').addClass('zin9')" aria-label="drop down"><i class="fa-regular fa-ellipsis" aria-hidden="true"></i></a>
26445                                                                
26446                                                            
26447                                                            
26448                                                            <ul> `;
26449                                                            if(post.session == 1){      
26450                                                            
26451                                                                if(post.self != 1){     
26452
26453
26454                                                                postHtml += ` <li >
26455                                                                    <a href="javascript:void(0)" onclick="postNotInterested('${post.postId}')">
26456                                                                    Not interested in this post <span><i class="hgi hgi-stroke hgi-meh"></i></span>
26457                                                                    </a>
26458                                                                </li>
26459
26460                                                                <li>
26461                                                                    <a href="javascript:void(0)" onclick="socialFeedMuteUser(this, '${post.user_token}')">
26462                                                                    ${post.mute == "1" ? `<span>Unmute @${post.username}</span>` : `<span>Mute @${post.username}</span>`}
26463                                                                    <i class="fa-regular fa-volume-slash"></i>
26464                                                                    </a>
26465                                                                </li>
26466                                                                <li>
26467                                                                    <a href="javascript:void(0)" data-bu="${post.block}" id="bk${Math.floor(1000000 + Math.random() * 100000)}"  onclick="socialFeedBlockUser(this, '${post.user_token}','${post.username}')"><span>
26468                                                                    ${post.block == "1" ? `Unblock @${post.username}` : `Block @${post.username}`}</span>
26469                                                                    <i class="hgi hgi-stroke hgi-unavailable"></i>
26470                                                                    </a>
26471                                                                </li>
26472                                                                <li>
26473                                                                    <a href="javascript:void(0)" onclick="mentionUser('${post.username}')">
26474                                                                    Mention @${post.username} <i class="hgi hgi-stroke hgi-at"></i>
26475                                                                    </a>
26476                                                                </li>
26477                                                                <li>
26478                                                                    <a href="javascript:void(0)" onclick="openPostReportPopup(${post.postId}, this)">
26479                                                                    Report post <i class="fa-regular fa-circle-exclamation"></i>
26480                                                                    </a>
26481                                                                </li>`;
26482
26483                                                                }else{
26484
26485                                                                    postHtml += `<!-- <li>
26486                                                                    <a href="javascript:void(0)" ">
26487                                                                    Share <i class=" fa-regular fa-arrow-up-from-bracket"></i>
26488                                                                    </a>
26489                                                                </li> -->
26490                                                                <li>
26491                                                                    <a href="javascript:void(0)" style="color: #ff0026 !important; " onclick="deleteOwnPostPoll(this,'${post.postId}','article')">
26492                                                                    Delete <i class="hgi hgi-stroke hgi-delete-02"></i>
26493                                                                    </a>
26494                                                                </li>
26495                                                                `;
26496
26497                                                                }
26498                                                            }
26499                                                    
26500                                                            else {
26501                                                                    const postDateTimeStr = `${post.pdate} ${post.ptime}`;
26502                                                                    const postDateTime = new Date(postDateTimeStr.replace(/-/g, '/')); // safer parsing
26503                                                                    const now = new Date();
26504
26505                                                                    const diffInMinutes = (now - postDateTime) / (1000 * 60); // milliseconds to minutes
26506
26507                                                                    postHtml += `<li>
26508                                                                        <a href="javascript:void(0)" style="color: #ff0026 !important;" onclick="deleteOwnPostPoll(this,'${post.postId}','post')">
26509                                                                            Delete <i class="hgi hgi-stroke hgi-delete-02"></i>
26510                                                                        </a>
26511                                                                    </li>`;
26512
26513                                                                    // Show Edit only if is_blog == 1 and time < 30 minutes
26514                                                                    if (post.is_blog == 1 && diffInMinutes <= 30) {
26515                                                                        postHtml = `
26516                                                                            <li>
26517                                                                                <a href="/add-article?id=${post.postId}">
26518                                                                                    Edit <i class="hgi hgi-stroke hgi-edit-03"></i>
26519                                                                                </a>
26520                                                                            </li>
26521                                                                        ` + postHtml; // Prepend edit before delete
26522                                                                    }
26523                                                                }
26524                                                            
26525                                                            postHtml += `<li><a href="javascript:void(0)" onclick="copyFeedlinktoshare('${shopfeedurl}')">Copy link to share <span><i class="hgi hgi-stroke hgi-link-05"></i> </span></a></li>
26526                                                            
26527                                                            <li style="display:none"><a href="javascript:void(0)" onclick="CopyFeedTextToClipboard('contentDivID-${post.postId}')" >
26527Copy text <span><i class="hgi hgi-stroke hgi-copy-01"></i> </span></a></li>`
26528
26529                                                            postHtml += ` </ul>   
26530
26531
26532                                            </div>
26533
26534
26535                                            
26536                                        </div>
26537                                    </div>
26538                                </div>
26539
26540                                <div class="row">
26541                                    <div class="col-md-12">
26542                                        <a data-old-url="/ps/${post.username}/jumpid${post.postId}" 
26543                                                href="/ps/${post.username}/${post.postTitle.replace(/\s+/g, '-').replace(/[^\w\-]/g, '')}/jumpid${post.postId}" 
26544                                                class="blog-main-link">
26545    
26546                                        
26547                                            <div class="blog-main-image mb-10 blog-section"> 
26548                                                ${hasImage ? `
26549                                                    <img loading="lazy" src="${post.postFiles[0].imagepath}" alt="Jumpspree">
26550                                                ` : ''}
26551                                                
26552                                                <div class="blog-title-feed">
26553                                                    <div class="article-label">
26554                                                        <label>Article</label>
26555                                                    </div>  
26556                                                    <div class="article-title">${post.postTitle}</div>
26557                                                    <div class="date" style="border: none;padding: 0;">
26558                                                        <ul class="d-flex m-0" style="padding: 0;">
26559                                                            <li>Published</li>              
26560                                                            <li>${post.pdate}</li>
26561                                                            <li><span>&bull;</span></li>
26562                                                            <li>${post.ptime}</li>
26563                                                        </ul>
26564                                                    </div>
26565                                                </div>
26566                                            </div>
26567                                        </a>
26568                                    </div>
26569                                </div>
26570
26571                                <div style="display:none" class="row">
26572                                    <div class="col-md-12">
26573                                        <div class="date">
26574                                            <ul class="d-flex m-0">
26575                                                    <li>${post.pdate}</li>
26576                                                <li><span>&bull;</span></li>
26577                                                <li>${post.ptime}</li>
26578                                            </ul>
26579                                        </div>
26580                                    </div>
26581                                </div>
26582
26583                                    <div class="row">
26584                                    <div class="col-md-12">
26585                                        <div class="date ogl pt-0">
26586                                            <ul class="d-flex align-items-start pt-0">
26587                                                <li style="display:none"  class="comment-post">
26588                                                    
26589                                                <a href="javascript:void(0)" onclick="openCommentPopup('${post.username}', '${post.name}', ${post.postId}, '${currentUser}', '${currentUserName}')"> 
26590                                                        <span class="c-img">
26591                                                            <i class="fa-regular fa-message-middle" aria-hidden="true"></i></span> <span class="c-img">${post.comments}</span>
26592                                                    </a>
26593                                                </li>
26594                                                
26595                                                <li class="like-post">
26596                                                    <a href="javascript:void(0)"  class="like-button ${post.liked == '1' ? 'likeIsActive' : 'likeIsDeactive'}"   data-postid="${post.postId}">
26597                                                        <span class="c-img">
26598                                                            <img src="${post.liked == '1' ? 'https://www.jumpspree.com/public/images/heart-filled.png?ver:3.015' : 'https://www.jumpspree.com/public/images/favourite-stroke-rounded.png?ver:1.05'}" alt="Like" title="Like"></span>
26599                                                        <span style="${post.likes == 0 ? 'display:none' : ''}" id="like-id-${post.postId}" class="like-count  ${post.liked == '1' ? 'likeCountIsActive' : 'likeCountIsDeactive'}">${post.hideLike == 1 ? '' : post.likes}</span>
26600                                                    </a>
26601                                                </li> 
26602                                                                        
26603                                            <li class="comment-post"> 
26604                                                                                                            <a href="javascript:void(0);" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">
26605                                                            <span class="c-img">
26606                                                                <img src="https://www.jumpspree.com/public/images/comment-03-stroke-rounded.png" alt="comment" title="comment">
26607                                                            </span> 
26608                                                            <span class="c-count" style="${post.comments == 0 ? 'display:none' : ''}">${post.comments}</span>
26609                                                        </a>
26610                                                                                                    </li>
26611                    
26612                                                
26613                                            
26614                                                <li class="repost-btn share-post">
26615                                                    <a href="javascript:void(0)" 
26616                                                    class="repost-button ${post.is_reposted_by_user ? 'reposted' : 'no-repost'}" 
26617                                                    style="flex-direction:column" 
26618                                                    onclick="${post.is_reposted_by_user ? `unrepostPost('${post.postId}')` : `handleRepostDropdown(event, this)`}">
26619                                                        <span class="c-img">
26620                                                            <i style="display:none" class="fa-light fa-arrows-repeat" aria-hidden="true"></i>
26621                                                            <i class="fa-light fa-arrows-repeat ${post.is_reposted_by_user ? 'user-reposted-post' : ''}" aria-hidden="true"></i>
26622                                                        </span>
26623                                                        <span id="repost-count-${post.postId}" class="like-count" style="${post.reposted_count == 0 ? 'display:none' : ''}">
26624                                                            ${post.reposted_count}
26625                                                        </span>
26626                                                    </a>
26627                                                    <div class="drop-down-menu-share" style="display:none">
26628                                                        <ul>
26629                                                            <li>
26630                                                                <a href="javascript:void(0)" 
26631                                                                onclick="${post.is_reposted_by_user ? `unrepostPost('${post.postId}')` : `handleRepostPopup(this, '${post.postId}')`}">
26632                                                                ${post.is_reposted_by_user ? 'Undo Repost' : 'Repost'} 
26633                                                                <span><i class="fa-light fa-arrows-repeat ${post.is_reposted_by_user ? 'user-reposted-post' : ''}" aria-hidden="true"></i></span>
26634                                                                </a>
26635                                                            </li>
26636                                                            <li>
26637                                                                <a href="javascript:void(0)" 
26638                                                                class="repost-button" 
26639                                                                data-username="${post.username}"  
26640                                                                data-postprofile="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.03'}"  
26641                                                                data-name="${post.name}" 
26642                                                                data-postid="${post.postId}" 
26643                                                                data-posttext="${encodeURIComponent(post.postText)}"
26644                                                                data-currentuser="${currentUser}" 
26645                                                                data-currentusername="${currentUserName}" 
26646                                                                onclick="openRePostPopupOnPage(this)">
26647                                                                ${post.is_reposted_by_user ? 'Remove Quote Repost' : 'Add Caption and Repost'} 
26648                                                                <sp
26648an><i class="fa-sharp fa-regular fa-pen-line"></i></span>
26649                                                                </a>
26650                                                            </li> 
26651                                                        </ul>  
26652                                                    </div>
26653                                                </li>
26654                                                                    
26655                                                <li class="view-post" style="display:none">
26656                                                    <a href="javascript:void(0)"  class="repost-button">
26657                                                        <span class="c-img">
26658                                                            <img style="width:20px !important" src="https://www.jumpspree.com/public/images/analytics-03-stroke-rounded.png" alt="view" title="view"></span>
26659                                                        <span  style="${post.viewcount == 0 ? 'display:none' : ''}"  id="like-id-${post.postId}" class="like-count">${post.viewcount}</span>
26660                                                    </a>
26661                                                </li>
26662                                                    
26663                                                
26664                                                <li class="repost-post save-bookmark" data-postid="${post.postId}">
26665                                                                                                    <a href="javascript:void(0)">
26666                                                        <span class="c-img">
26667                                                            ${post.is_wishlist == '1' ? '<img class="bookmark-active" style="height: 17px !important; width: 15px !important" src="https://www.jumpspree.com/public/images/bookmark-filled.png?v=2" alt="bookmark" title="bookmark" />'  : '<img style="height: 17px !important; width: 15px !important" class="bookmark-inactive" src="https://www.jumpspree.com/public/images/bookmark-021.png" alt="bookmark" title="bookmark" />'}
26668                                                        </span>
26669                                                    </a> 
26670                                                    
26671                                                    <a style="display:none"  href="javascript:void(0)" class="repost-button" onclick="$('#signup-new-process').hide();$('#signin-new-process').fadeIn('fast')">
26672                                                        <span class="c-img">
26673                                                            <img src="https://www.jumpspree.com/public/images/bookmark-021.png" alt="bookmark" title="bookmark" id="bookmarkicon" onclick="bookmark('')" />
26674                                                        </span>
26675                                                    </a>
26676                                                                                            </li>
26677
26678                                                
26679                                                                    
26680                                                <li class="share-post uplad hide-on-desktop" style="display:none !important">
26681                                                    <a href="javascript:void(0)" class="share-button">
26682                                                        <img src="https://www.jumpspree.com/public/images/share-outline.png" alt="Share" title="Share">
26683                                                    </a>
26684                                                </li>                    
26685                                                                    
26686                                                                    
26687                                                <li class="view-post" style="display:none">
26688                                                    <a href="javascript:void(0)">
26689                                                        <span class="c-img"><img style="width:20px !important" src="https://www.jumpspree.com/public/images/analytics-03-stroke-rounded.png" alt="view" title="view"> </span> 
26690                                                    <span class="c-count" style="${post.viewcount == 0 ? 'display:none' : ''}">${post.viewcount}</span>
26691
26692                                                    </a>
26693                                                </li>                    
26694                                                
26695                                                <li class="share-post uplad hide-on-desktop" style="display:block !important">
26696                                                    <a href="javascript:void(0)" class="share-button"  onclick="window.event.cancelBubble = true; openPostShareDialog('${post.postId}','${post.username}'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');">
26697                                                        <span class="c-img share05">
26698                                                                        <img src="https://www.jumpspree.com/public/images/plane-share.png" alt="Share" title="Share" style="filter:invert()!important">
26699                                                                </span>
26700                                                    </a>
26701                                                </li>
26702                                                            
26703                                                        
26704                                                <li class="share-post uplad" style="display:none !important">
26705                                                    <a href="javascript:void(0)" class="share-button-desktop" onclick="window.event.cancelBubble = true;$('.drop-down-menu-share').hide();$(this).next().fadeToggle(200);">
26706                                                        <span class="c-img">
26707                                                                        <i class="fa-solid fa-ellipsis" aria-hidden="true"></i>
26708                                                                </span>
26709                                                    </a>
26710                                                                    <div class="drop-down-menu-share" style="display:none">
26711                                                                        <ul>
26712                                                                        <!-- <li><a href='javascript:void(0)' onclick="window.event.cancelBubble = true; $('#share-site-link').addClass('share-in-open'); $('.drop-down-menu-share').hide();$('#embed-code').removeClass('embed-in');">Share <span><i class="fa-regular fa-arrow-up-from-bracket"></i> </span>  </a></li> -->
26713
26714
26715                                                                        <li>
26716                                                                            <a href='javascript:void(0)' 
26717                                                                            onclick="window.event.cancelBubble = true; openShareDialog('post-${post.postId}'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');">
26718                                                                                Share 
26719                                                                                <span><i class="fa-regular fa-arrow-up-from-bracket"></i></span>
26720                                                                            </a>
26721                                                                        </li>
26722
26723
26724                                                                        <li><a href='javascript:void(0)'>Copy link to share <span><i class="hgi hgi-stroke hgi-link-05"></i> </span></a></li>
26725                                                                        <li><a href='javascript:void(0)'>Copy text <span><img src="https://www.jumpspree.com/public/images/copy-text.png?ver:1.02" alt="Copy" title="Copy"> </span></a></li>
26726                                                                        <li style="display:none"><a href='javascript:void(0)' onclick="window.event.cancelBubble = true; $('#embed-code').addClass('embed-in'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');">Embed <span><img src="https://www.jumpspree.com/public/images/embed.png?ver:1.05" alt="Jumpspree" style="max-width: 20p
26726x !important;"> </span></a></li>
26727                                                                        </ul>  
26728                                                                        </div>
26729                
26730                                                </li>
26731                                            </ul>
26732                                        </div>
26733                                    </div>
26734                                </div>
26735
26736
26737
26738
26739                            </div>
26740                        
26741                    
26742            `;
26743
26744
26745
26746
26747
26748        } else  if (post.is_blog === '2') {
26749            // Poll Design
26750            const totalVotes = post.poll_options.reduce((total, option) => total + option.votes, 0);
26751            postHtml = `
26752                <div data="pollStatic" data-is-blog="${post.is_blog}" data-source="${post.source}" class="email-box ${dynamicCss} dp${post.postId}" id="ni${post.postId}" >
26753                        <div class="row user-sec-strip2">
26754                        <div class="col-md-12">
26755                            <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
26756                                <div class="d-flex align-items-center">
26757                                
26758                                    <a href="/${post.username}" class="fig">
26759                                        <div id="online-dot-${post.postId}" class=" ${onlineStatusClass}"></div>
26760                                        <img src="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.038'}" 
26761                                            style="border-radius:50%" 
26762                                            alt="Profile Photo" title="Profile Photo">
26763                                    </a>
26764                                    <div class="fnc-title">
26765                                        <h4 class="notranslate">
26766                                            <a href="/${post.username}" class="profile-link">@${post.username}</a>
26767                                            ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
26768                                                            
26769                                                        <div data-uoutput="${post.pdate} ${post.ptime}" class="datenew">
26770                                                            ${formatPostDate(post.pdate + ' ' + post.ptime)}
26771                                                        </div>
26772
26773                                        </h4>
26774                                        <p style="display:none">
26775                                            <a href="/${post.username}" class="profile-link">@${post.username}</a>
26776                                        </p>
26777                                            <div id="follow-card-box" class="fcb">
26778                                                <div class="follow-card">
26779                                                    <div class="card-top">
26780                                                    <div class="user-icon">
26781                                                    <div id="online-dot-${post.postId}" class=" ${onlineStatusClass}"></div>
26782                                                        <img src="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.03'}" alt="Jumpspree">
26783                                                    </div>
26784                                                <img src="${post.cover_photo || 'https://www.jumpspree.com/public/images/cover-placeholdernew.jpg?ver:1.03'}" alt="Jumpspree">     
26785                                                    </div>
26786                                                    <div class="card-inside">
26787                                                        <div class="user-name-section d-flex justify-content-between">
26788                                                            <div class="name">
26789                                                                <h2>${post.name} ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}</h2>
26790                                                                <p>@${post.username}</p>
26791                                                            </div>
26792
26793                                                        ${currentUserName !== post.username ? `
26794                                                                        <div class="follow-btn">
26795                                                                            <a id="fbtn${post.postId}" href="javascript:void(0)" 
26796                                                                            class="${post.is_follow == 1 ? 'isFollowing' : 'notFollowing'}" 
26797                                                                            onclick="${post.session == 0 
26798                                                                            ? `$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');` 
26799                                                                            : post.session != 1 
26800                                                                            ? '' 
26801                                                                            : `followUser('${post.userId}', '${post.private}', this)`}">
26802                                                                            ${post.is_follow == 1 ? 'Following' : 'Follow'}
26803                                                                            </a>
26804                                                                        </div>
26805                                                                        ` : ''}
26806                                                        
26807                                                        </div>
26808                                                        <div class="stats d-flex justify-content-strat">
26809                                                                            <div class="stat" style="cursor:pointer" onclick="window.location.href='https://www.jumpspree.com/followers/${post.username}'">
26810                                                                                <a href="https://www.jumpspree.com/followers/${post.username}">${post.followers} Followers</a>
26811                                                                            </div>
26812                                                                            <div class="stat">
26813                                                                                •
26814                                                                            </div>
26815
26816                                                                                
26817                                                                                <div class="stat" style="cursor:pointer" onclick="window.location.href='https://www.jumpspree.com/followings/${post.username}'">
26818                                                                                <a href="https://www.jumpspree.com/followings/${post.username}">${post.followings} Following</a>
26819                                                                            </div>
26820                                                                        </div>
26821                                                                        
26822                                                        <div class="bio">
26823                                                            <p>${post.about_us}</p>
26824                                                        </div>                   
26825                                                    </div>
26826                                                </div>
26827                                            </div>
26828                                    </div>
26829                                </div>
26830                                <div class="profile-drop-down">
26831                                    <a href="javascript:void(0)" onclick="window.event.cancelBubble = true;$(this).next().slideToggle('fast')" aria-label="drop down"><i class="fa-regular fa-ellipsis" aria-hidden="true"></i></a>
26832                                    
26833                                                    
26834                                            
26835                                                    <ul> `;
26836                                                if(post.session == 1){      
26837                                                
26838                                                    if(post.self != 1){     
26839
26840
26841                                                    postHtml += ` <li >
26842                                                        <a href="javascript:void(0)" onclick="postNotInterested('${post.postId}')">
26843                                                        Not interested in this post <sp
26843an><i class="hgi hgi-stroke hgi-meh"></i></span>
26844                                                        </a>
26845                                                    </li>
26846
26847                                                    <li>
26848                                                        <a href="javascript:void(0)" onclick="socialFeedMuteUser(this, '${post.user_token}')">
26849                                                        ${post.mute == "1" ? `<span>Unmute @${post.username}</span>` : `<span>Mute @${post.username}</span>`}
26850                                                        <i class="fa-regular fa-volume-slash"></i>
26851                                                        </a>
26852                                                    </li>
26853                                                    <li>
26854                                                        <a href="javascript:void(0)" data-bu="${post.block}" id="bk${Math.floor(1000000 + Math.random() * 100000)}"  onclick="socialFeedBlockUser(this, '${post.user_token}','${post.username}')"><span>
26855                                                        ${post.block == "1" ? `Unblock @${post.username}` : `Block @${post.username}`}</span>
26856                                                        <i class="hgi hgi-stroke hgi-unavailable"></i>
26857                                                        </a>
26858                                                    </li>
26859                                                    <li>
26860                                                        <a href="javascript:void(0)" onclick="mentionUser('${post.username}')">
26861                                                        Mention @${post.username} <i class="hgi hgi-stroke hgi-at"></i>
26862                                                        </a>
26863                                                    </li>
26864                                                    <li>
26865                                                        <a href="javascript:void(0)" onclick="openPostReportPopup(${post.postId}, this)">
26866                                                        Report post <i class="fa-regular fa-circle-exclamation"></i>
26867                                                        </a>
26868                                                    </li>`;
26869
26870                                                    }else{
26871
26872                                                        postHtml += `<!-- <li>
26873                                                        <a href="javascript:void(0)" ">
26874                                                        Share <i class=" fa-regular fa-arrow-up-from-bracket"></i>
26875                                                        </a>
26876                                                    </li> -->
26877                                                    <li>
26878                                                        <a href="javascript:void(0)" style="color: #ff0026 !important; " onclick="deleteOwnPostPoll(this,'${post.postId}','poll')">
26879                                                        Delete <i class="hgi hgi-stroke hgi-delete-02"></i>
26880                                                        </a>
26881                                                    </li>
26882                                                    `;
26883
26884                                                    }
26885                                                }else{
26886
26887                                                    postHtml += `<li style="display:none">
26888                                                        <a href="javascript:void(0)" "onclick="window.event.cancelBubble = true; openPostShareDialog('${post.postId}','${post.username}'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');"
26889                                                        Share <i class=" fa-regular fa-arrow-up-from-bracket1"></i>
26890                                                        </a>
26891                                                    </li>`;
26892
26893                                                }
26894                                                
26895                                                postHtml += `<li><a href="javascript:void(0)" onclick="copyFeedlinktoshare('${shopfeedurl}')">Copy link to share <span><i class="hgi hgi-stroke hgi-link-05"></i> </span></a></li>
26896                                                
26897                                                `
26898
26899                                                postHtml += ` </ul>   
26900
26901
26902                                </div>
26903                            </div>
26904                        </div>
26905                    </div>
26906
26907
26908                     <a href="/ps/${post.username}/jumpid${post.postId}">    
26909                        <div class="row">
26910                            <div class="col-md-12">
26911                                <div class="feed-poll-both">
26912                                    <div class="feed-poll-inner">
26913                                        <div class="poll-question">${post.postTitle}</div>
26914
26915                                            <div class="poll-options">
26916                                            ${post.poll_options.map(option => {
26917                                                let percentage = totalVotes > 0 ? (option.votes / totalVotes) * 100 : 0;
26918                                                let isChecked = post.has_voted == 1 && post.user_voted_option_id == option.id ? 'checked' : '';
26919                                                
26920                                                let isPollEnded = post.poll_closed == 1 ? true : false;
26921                                                let isDisabled = (post.has_voted == 1 || isPollEnded) ? 'disabled' : '';
26922
26923                                                let checkClass = ''; 
26924                                                let  isHide  = 'hide'; 
26925                                                
26926                                                if (post.has_voted == '1') {
26927                                                    checkClass = isChecked === 'checked' ? 'checkedhai' : 'checkednahihai';
26928                                                    // isHide = isChecked === 'checked' ? 'Unhide' : 'hide';
26929                                                    isHide = (isChecked === 'checked' && userData.user_token) ? 'Unhide' : 'hide';
26930                                                }
26931                                                if (!userData.user_token) {
26932                                                    isHide = 'hide';
26933                                                }
26934
26935                                                return `
26936                                                    <div class="poll-option">
26937                                                        <label class="${checkClass}">
26938                                                            <div class="poll-percentage-bar" data-option-id="${option.id}" style="width:${percentage}%;">
26939                                                                ${option.option} <span class="percent-text hide">${percentage.toFixed(2)}</span>
26940                                                            </div>
26941                                                            <input  class="${isHide}"
26942                                                                onClick="voteMyPoll('${option.id}', '${userData.user_token}', '${post.postId}')" 
26943                                                                type="radio" 
26944                                                                name="poll${post.postId}" 
26945                                                                value="${option.id}" 
26946                                                                ${isChecked} ${isDisabled}>
26947                                                        </label>
26948                                                    </div>
26949                                                `;
26950                                            }).join('')}
26951                                        </div>
26952
26953
26954
26955                                        <div class="d-flex poll-view-details align-items-center">    
26956                                        <div class="votes">${totalVotes} votes</div>
26957                                        <div class="poll-divider">&bull;</div>
26958                                        <div class="poll-ending">${post.poll_time_remaining	} </div>
26959                                        </div>
26960                                    </div>
26961
26962                                    <div class="participate-confidently">
26963                                        <div class="icon"><img src="https://www.jumpspree.com/public/images/poll--icon.png?ver:1.02"></div>
26964                                        <div class="text-note">
26965                                            <h5>Participate Confidently</h5>
26966                                            <p>Jumpspree keeps your profile private. Only the poll owner can view the participants.</p>
26967                                        </div>
26968                                    </div>
26969
26970                                    <div class="created-by" style="display:none">
26971                                        <h6>Created by</h6>
26972                                        <div class="d-flex">
26973                                            <!-- Link wrapping the profile photo -->
26974                                            <a href="/${post.username}" class="fig">
26975                                                <div id="online-dot-${post.postId}" class=" ${onlineStatusClass}"></div>
26976                                                <img src="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.035?ver:1.03'}" 
26977                                                    style="border-radius:50%" 
26978                                                    alt="Profile Photo" title="Profile Photo">
26979                                            </a>
26980
26981                                            <div class="fnc-title">
26982                                                <!-- Link wrapping the profile name -->
26983                                                <h4>
26984                                                    <a href="/${post.username}" class="profile-link">
26985                                                        ${post.name}
26986                                                    </a>
26987                                                    ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
26988                                                </h4>
26989
26990                                                <!-- Link wrapping the username -->
26991                                                <p>
26992                                                    <a href="/${post.username}" class="profile-link">
26993                                                        @${post.username}
26994                                                    </a>
26995                                                </p>
26996                                            </div>
26997                                        </div>
26998                                    </div>
26999                                </div>
27000                            </div>
27001                        </div>
27002
27003                    </a>
27004
27005
27006                    <div style="display:none" class="row">
27007                        <div class="col-md-12">
27008                            <div class="date">
27009                                <ul class="d-flex m-0">
27010                                    <li>${post.pdate}</li>
27011                                    <li><span>&bull;</span></li>
27012                                    <li>${post.ptime}</li>
27013                                </ul>
27014                            </div>
27015                        </div>
27016                    </div>
27017
27018
27019                    ${footerButtonsForAll}
27020                    
27021
27022                    
27023                </div>
27024            `;
27025        } 
27026        
27027        else if (post.is_blog == 0 || post.is_blog === '0')  {
27028            // Post Design with Images/Videos
27029            //const mediaContent = generateMediaContent(post.postFiles);
27030            const mediaContent = generateMediaContent(post.postFiles, post, _pi);
27031
27032            const imageCount = post.postFiles.filter(file => 
27033                file.imagepath.endsWith('.jpeg') || 
27034                file.imagepath.endsWith('.jpg') || 
27035                file.imagepath.endsWith('.png') || 
27036                file.imagepath.endsWith('.heic') || 
27037                file.imagepath.endsWith('.gif') ||
27038                 file.imagepath.endsWith('.webp')
27039            ).length;
27040
27041                        
27042            // Assuming postText is available
27043            const youtubeLinkCount = countYouTubeLinks(post.postText);
27044            const carouselClass = imageCount > 1 || youtubeLinkCount > 1 ? 'swiper mySwiper' : 'post-single-image';
27045            
27046            const twimages = imageCount === 2 ? 'tw-images' : 'mtw-images';
27047             const threeimages = imageCount === 3 ? 'three-images' : 'mtw-images';
27048
27049            //const carouselClass = imageCount > 1 ? 'owl-carousel owl-theme' : '';
27050            carouselClassRePost = "";
27051            // carosel css for repost desin 
27052            if (post?.quoteDetails?.postFiles?.length) {
27053
27054                const imageFiles = post.quoteDetails.postFiles.filter(file => {
27055                    const cleanImagePath = file.imagepath.split('?')[0];
27056                    return cleanImagePath.match(/\.(jpeg|jpg|png|gif|webp|heic)$/i);
27057                });
27058
27059                const carouselClassRePost = imageFiles.length > 1 ? 'owl-carousel owl-theme' : '';
27060
27061            } else {
27062                // Handle the case where post.quoteDetails or postFiles is null/undefined
27063                //console.error("post.quoteDetails is null or postFiles is empty");
27064                //return ''; // or return a fallback HTML
27065            }
27066            if(post.is_wishlist=='1'){
27067                wishlistclass="fa-solid";
27068            }else{
27069                wishlistclass="fa-regular";
27070            }
27071
27072            const urls = extractUrls(post.postText);
27073            const urlCount = urls.length;
27074            const carouselClass2 = urlCount > 1 ? 'swiper mySwiper' : 'post-single-image';
27075            const kapil = urlCount > 1 ? 'link-carousel' : 'link-no-carousel';
27076
27077           // console.log(post.postText);
27078           // console.log("______________________________");
27079           // console.log(urls);
27080
27081            
27082            const hasImage =
27083            post.postFiles &&
27084            post.postFiles.length > 0 &&
27085            post.postFiles[0].imagepath &&
27086            post.postFiles[0].imagepath.trim() !== '';
27087
27088            const containerClass = `email-box article-feed ${hasImage ? 'article-feed-has-image' : 'article-feed-no-image'} ${dynamicCss} dp${post.postId}`;
27089           
27090            const hideClassIfnoImage = hasImage ? 'imageFound"' : 'noImageFound"';
27091
27092
27093            let inlineStyle = '';
27094            if (
27095                post.quoteDetails &&
27096                (post.quoteDetails.is_blog == 1 || post.quoteDetails.is_blog === '1') &&
27097                (post.quoteDetails.source == 1 || post.quoteDetails.source === '1')
27098                ) {
27099                inlineStyle = 'display: none;';
27100            }
27101
27102
27103            let hideProduct = '';
27104            if (
27105                post.quoteDetails &&
27106                (post.quoteDetails.is_blog == 0 || post.quoteDetails.is_blog === '0') &&
27107                (post.quoteDetails.source == 1 || post.quoteDetails.source === '1')
27108                ) {
27109                hideProduct = 'display: none;';
27110            }
27111
27112            postHtml = ` 
27113               <div style="${inlineStyle}" data="postStatic" 
27114                    data-is-blog="${post.is_blog}" data-source="${post.source}" 
27115                    class="email-box ${post.is_reposted_version ? 'repost-wrapper ' : ''}${dynamicCss} dp${post.postId}" 
27116                        id="ni${post.postId}">
27117                  <div class="row user-sec-strip2">
27118                        <div class="col-md-12">
27119 ${post.is_reposted_version && post.reposted_by ? `
27120                                        <div class="repost-header repost-wrapper-main">
27121                                            <i class="fa-light fa-arrows-repeat"></i>
27122                                            <span>
27123                                                ${post.reposted_by.is_self ? 
27124                                                    'You reposted' : 
27125                                                    `<a href="/${post.reposted_by.username}">@${post.reposted_by.username}</a> reposted`
27126                                                }
27127                                            </span>
27128                                        </div>
27129                                    ` : ''}
27130
27131                            <div class="fnc mt-0 justify-content-between mb-9 align-items-start">
27132
27133                                <div class="d-flex align-items-center">
27134                                  
27135                                
27136                                   
27137                                    <a href="/${post.username}" class="fig">
27138                                        <div id="online-dot-${post.postId}" class=" ${onlineStatusClass}"></div>
27139                                        <img loading="lazy" src="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.038'}" 
27140                                            style="border-radius:50%" 
27141                                            alt="Profile Photo" title="Profile Photo">
27142                                    </a>
27143                                    <div class="fnc-title">
27144                                        <h4 class="notranslate">
27145                                            <a href="/${post.username}" class="profile-link">@${post.username}</a>
27146                                            ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
27147                                                            
27148                                                        <div data-uoutput="${post.pdate} ${post.ptime}" class="datenew">
27149                                                            ${formatPostDate(post.pdate + ' ' + post.ptime)}
27150                                                        </div>
27151
27152                                        </h4>
27153                                        <p style="display:none"><a href="/${post.username}" class="profile-link">@${post.username}</a></p>
27154                                            <div id="follow-card-box" class="fcb">
27155                                                <div class="follow-card">
27156                                                    <div class="card-top">
27157                                                    <div class="user-icon">
27158                                                    <div id="online-dot-${post.postId}" class=" ${onlineStatusClass}"></div>
27159                                                        <img loading="lazy" src="${post.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.03'}" alt="Jumpspree">
27160                                                    </div>
27161                                                <img loading="lazy" src="${post.cover_photo || 'https://www.jumpspree.com/public/images/cover-placeholdernew.jpg?ver:1.03'}" alt="Jumpspree">     
27162                                                    </div>
27163                                                    <div class="card-inside">
27164                                                        <div class="user-name-section d-flex justify-content-between">
27165                                                            <div class="name">
27166                                                                <h2>@${post.username} ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}</h2>
27167                                                                <h2 style="display:none">${post.name} ${post.is_verified == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}</h2>
27168                                                                <p style="display:none">@${post.username}</p>
27169                                                            </div>
27170
27171                                                        ${currentUserName !== post.username ? `
27172                                                                        <div class="follow-btn">
27173                                                                        <a id="fbtn${post.postId}" href="javascript:void(0)" 
27174                                                                        class="${post.is_follow == 1 ? 'isFollowing' : 'notFollowing'}" 
27175                                                                        onclick="${post.session == 0 
27176                                                                        ? `$('#signin-new-process').fadeIn('fast'); $('body').addClass('overflow-hidden');`
27177                                                                        : post.session != 1 
27178                                                                        ? '' 
27179                                                                        : `followUser('${post.userId}', '${post.private}', this)`}">
27180                                                                        ${post.is_follow == 1 ? 'Following' : 'Follow'}
27181                                                                        </a>
27182                                                                        </div>
27183                                                                        ` : ''}
27184                                                        
27185                                                        </div>
27186                                                        <div class="stats d-flex justify-content-strat">
27187                                                                            <div class="stat" style="cursor:pointer" onclick="window.location.href='https://www.jumpspree.com/followers/${post.username}'">
27188                                                                                <a href="https://www.jumpspree.com/followers/${post.username}">${post.followers} Followers</a>
27189                                                                            </div>
27190                                                                            <div class="stat">
27191                                                                                •
27192                                                                            </div>
27193
27194                                                                                
27195                                                                                <div class="stat" style="cursor:pointer" onclick="window.location.href='https://www.jumpspree.com/followings/${post.username}'">
27196                                                                                <a href="https://www.jumpspree.com/followings/${post.username}">${post.followings} Following</a>
27197                                                                            </div>
27198                                                                        </div>
27199                                                                        
27200                                                        <div class="bio">
27201                                                            <p>${post.about_us}</p>
27202                                                        </div>                   
27203                                                    </div>
27204                                                </div>
27205                                            </div>
27206                                    </div>
27207                                </div>
27208                                <!-- Dropdown menu code -->
27209                                <div class="profile-drop-down">
27210                                                    <a href="javascript:void(0)" onclick="window.event.cancelBubble = true;$('.more-setting-pop').removeClass('more-settings');
27210$('.status .profile-drop-down > ul').hide();$(this).parents('.email-box').siblings().find('.profile-drop-down > ul').hide();$(this).next().slideToggle('fast');$('.user-sec-strip').removeClass('zin9');$(this).parents('.user-sec-strip').addClass('zin9')" aria-label="drop down"><i class="fa-regular fa-ellipsis" aria-hidden="true"></i></a>
27211                                                    
27212                                                
27213                                                
27214                                                <ul> `;
27215                                                if(post.session == 1){      
27216                                                
27217                                                    if(post.self != 1){     
27218
27219
27220                                                    postHtml += ` <li >
27221                                                        <a href="javascript:void(0)" onclick="postNotInterested('${post.postId}')">
27222                                                        Not interested in this post <span><i class="hgi hgi-stroke hgi-meh"></i></span>
27223                                                        </a>
27224                                                    </li>
27225
27226                                                    <li>
27227                                                        <a href="javascript:void(0)" onclick="socialFeedMuteUser(this, '${post.user_token}')">
27228                                                        ${post.mute == "1" ? `<span>Unmute @${post.username}</span>` : `<span>Mute @${post.username}</span>`}
27229                                                        <i class="fa-regular fa-volume-slash"></i>
27230                                                        </a>
27231                                                    </li>
27232                                                    <li>
27233                                                        <a href="javascript:void(0)" data-bu="${post.block}" id="bk${Math.floor(1000000 + Math.random() * 100000)}"  onclick="socialFeedBlockUser(this, '${post.user_token}','${post.username}')"><span>
27234                                                        ${post.block == "1" ? `Unblock @${post.username}` : `Block @${post.username}`}</span>
27235                                                        <i class="hgi hgi-stroke hgi-unavailable"></i>
27236                                                        </a>
27237                                                    </li>
27238                                                    <li>
27239                                                        <a href="javascript:void(0)" 
27240                                                        id="fu${Math.floor(1000000 + Math.random() * 100000)}"
27241                                                        onclick="socialFeedFollowUser('${post.userId}', '${post.private}', this)">
27242
27243                                                            <span>
27244                                                                ${post.is_follow == 1 ? 'Unfollow @' + post.username : 'Follow @' + post.username}
27245                                                            </span> 
27246                                                            <i class="hgi hgi-stroke hgi-user-check-02"></i>
27247                                                        </a>
27248                                                    </li>
27249
27250                                                    <li>
27251                                                        <a href="javascript:void(0)" onclick="mentionUser('${post.username}')">
27252                                                        Mention @${post.username} <i class="hgi hgi-stroke hgi-at"></i>
27253                                                        </a>
27254                                                    </li>
27255                                                    <li>
27256                                                        <a href="javascript:void(0)" onclick="openPostReportPopup(${post.postId}, this)">
27257                                                        Report post <i class="fa-regular fa-circle-exclamation"></i>
27258                                                        </a>
27259                                                    </li>`;
27260
27261                                                    }else{
27262
27263                                                        postHtml += `<!-- <li>
27264                                                        <a href="javascript:void(0)" ">
27265                                                        Share <i class=" fa-regular fa-arrow-up-from-bracket"></i>
27266                                                        </a>
27267                                                    </li> -->
27268                                                    <li>
27269                                                        <a href="javascript:void(0)" style="color: #ff0026 !important; " onclick="deleteOwnPostPoll(this,'${post.postId}','post')">
27270                                                        Delete <i class="hgi hgi-stroke hgi-delete-02"></i>
27271                                                        </a>
27272                                                    </li>
27273                                                    `;
27274
27275                                                    }
27276                                                }else{
27277
27278                                                    postHtml += `<li style="display:none">
27279                                                        <a href="javascript:void(0)" "oncl
27279ick="window.event.cancelBubble = true; openPostShareDialog('${post.postId}','${post.username}'); $('.drop-down-menu-share').hide(); $('#embed-code').removeClass('embed-in');"
27280                                                        Share <i class=" fa-regular fa-arrow-up-from-bracket1"></i>
27281                                                        </a>
27282                                                    </li>`;
27283
27284                                                }
27285                                                
27286                                                postHtml += `<li><a href="javascript:void(0)" onclick="copyFeedlinktoshare('${shopfeedurl}')">Copy link to share <span><i class="hgi hgi-stroke hgi-link-05"></i> </span></a></li>
27287                                                
27288                                                <li><a href="javascript:void(0)" onclick="CopyFeedTextToClipboard('contentDivID-${post.postId}')" >Copy text <span><i class="hgi hgi-stroke hgi-copy-01"></i> </span></a></li>`
27289
27290                                                postHtml += ` </ul>   
27291
27292
27293                                </div>
27294                            </div>
27295                        </div>
27296                    </div>
27297
27298                    <div class="row">
27299                        <div class="col-md-12" data-id="is-blog-${post.is_blog}"  id="contentDivID-${post.postId}" >
27300                                <div class="post-text" style="${post.postText ? '' : 'display: none;'}">
27301                                    <a href="/ps/${post.username}/jumpid${post.postId}">
27302                                        <p>${postTextWithLinks}</p>
27303                                    </a>
27304                                </div>
27305
27306                            
27307                            <div  class="blog-main-image mb-10 movie-trailer alt-link ${kapil} ${hideClassIfnoImage}">
27308                                                <div class="show-image-caption">
27309                                                    <div class="embed-link">
27310                                                        <a href="javascript:void(0)" onclick="window.event.cancelBubble = true; $('#add-alt-tag-preview').addClass('embed-in');$('#add-alt-tag').removeClass('embed-in'); $('.drop-down-menu-share').hide(); $('#share-site-link').removeClass('share-in-open');">
27311                                                            Alt
27312                                                        </a>
27313                                                    </div>
27314                                                    <div class="embed-link">
27315                                                        <a href="javascript:void(0)">Open Link <i class="fa-regular fa-arrow-up-right-from-square">
27316                                                        </i>
27317                                                        </a>
27318                                                    </div>
27319                                                </div>   
27320
27321
27322                                        <div class="${carouselClass2}">   
27323                                            <div class="swiper-wrapper ${post.postFilesAspectRatio}">
27324                                                    ${urls.map((url, index) => {
27325                                                        const uniqueId = `link-preview-${post.postId}-${index}`;
27326
27327                                                        // Trigger dynamic metadata fill after DOM render
27328                                                        setTimeout(() => {
27329                                                        fetchLinkPreviewYT(url, `#${uniqueId}`);
27330                                                        }, 10);
27331
27332                                                        // Return placeholder HTML inside swiper-slide
27333                                                        return `
27334                                                        <div class="swiper-slide">
27335                                                            <div id="${uniqueId}" class="link-preview">
27336                                                            <a data-id="on-return-condition" class="postLink" href="${url}" target="_blank">
27337                                                                <sp
27337an class="trailer-image">
27338                                                                <img loading="lazy" src="" class="link-image" style="max-width:100%; display: none;" />
27339                                                                </span>
27340                                                                <span class="trailer-text imageNotAvailable">
27341                                                                <h4 class="link-title">Loading...</h4>
27342                                                                <p class="link-description">${url}</p>
27343                                                                </span>
27344                                                            </a>
27345                                                            </div>
27346                                                        </div>
27347                                                        `;
27348                                                    }).join('')}
27349                                            </div>
27350                                        </div>
27351                                        
27352                                        
27353                                    <div class="${carouselClass}">
27354                                        <div data-image-count="${imageCount}" id="swipperDivForImages" class="swiper-wrapper ${twimages} ${threeimages} ${post.postFilesAspectClass}">
27355                                
27356                                        ${post.postFiles.map(file => {
27357                                            const cleanImagePath = file.imagepath.split('?')[0]; // Strip query parameters
27358
27359                                            // Check for video formats
27360                                            if (cleanImagePath.match(/\.(mp4|webm|ogg|mov)$/i)) {
27361                                                return `
27362                                                    <div class="item video-container">
27363                                                        <video autoplay playsinline loop  muted src="${file.imagepath}" controls></video>
27364                                                    </div>
27365                                                `;
27366                                            } 
27367                                            // Check for image formats
27368                                            else if (cleanImagePath.match(/\.(jpeg|jpg|png|gif|webp|heic)$/i)) {
27369                                                return `
27370                                                    <div class="swiper-slide item"> 
27371                                                        <a data-lightbox="gallery-${post.postId}" href="${file.imagepath}">
27372
27373                                                            <img width="300" height="300" loading="lazy" src="${file.imagepath}" alt="Post Image" title="">
27374                                                        </a>  
27375                                                    </div> 
27376                                                    
27377                                                `;
27378                                            } else {
27379                                                return ''; // Unsupported formats
27380                                            }
27381                                        }).join('')}
27382                                
27383                                    </div>   <!-- end of dynamic carousel class   -->          
27384                                    </div>   <!-- end of dynamic carousel class   -->          
27385                                                    
27386                                
27387                            </div>
27388                        </div>
27389                    </div>
27390
27391
27392                    
27393                    
27394
27395
27396                    <!-- removed Repost Section OLDDDDDDDD -->  
27397                    
27398
27399
27400                    <!-- Repost Section checking null-->
27401                    ${post.quoteDetails ? `
27402                        ${post.quoteDetails.is_product == '1' ? `
27403                                <!-- Repost for PRODUCT data-->
27404                                <div class="repost-social product-repost-wrapper">
27405                                    <div class="repost-wrapper">
27406                                        <div class="email-box">
27407                                            <div class="row">
27408                                                <div class="col-md-12">
27409                                                    <div class="fnc mt-0 justify-content-between mb-9 align-items-start" style="padding: 0 15px;">
27410                                                        <div class="d-flex align-items-center">
27411                                                            ${post.quoteDetails.storeDetails?.storePhoto ? `
27412                                                                <a href="/${post.quoteDetails?.username || '#'}" class="fig">
27413                                                                    <img loading="lazy" src="${post.quoteDetails.storeDetails.storePhoto}" style="border-radius:50%" alt="Store Photo" title="Store Photo">
27414                                                                </a>
27415                                                            ` : `
27416                                                                <a href="/${post.quoteDetails?.username || '#'}" class="fig">
27417                                                                    <img loading="lazy" src="${post.quoteDetails?.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.035'}" style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
27418                                                                </a>
27419                                                            `}
27420                                                            <div class="fnc-title">
27421                                                                <h4 class="notranslate">
27422                                                                    ${post.quoteDetails.storeDetails?.storeusername ? `
27423                                                                        <a href="/${post.quoteDetails?.username || '#'}" class="profile-link">${post.quoteDetails.storeDetails.storeusername}</a>
27424                                                                    ` : `
27425                                                                        <a href="/${post.quoteDetails?.username || '#'}" class="profile-link">@${post.quoteDetails?.username || 'User'}</a>
27426                                                                    `}
27427                                                                    ${post.quoteDetails.bluetick == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
27428                                                                </h4>
27429                                                                    
27430
27431                                                                    <div data-uoutput="${post.quoteDetails.pdate} ${post.quoteDetails.ptime}" class="datenew">
27432                                                                            ${formatPostDate(post.quoteDetails.pdate + ' ' + post.quoteDetails.ptime)}
27433                                                                    </div>
27434
27435                                                                    
27436                                                            </div>
27437                                                        </div>
27438                                                        ${post.quoteDetails.product?.sellingprice ? `
27439                                                            <div class="buy-btn">
27440                                                                <a href="/${post.quoteDetails?.username || ''}/${encodeURIComponent(slugify(post?.quoteDetails?.product?.producttitle ?? 'Product'))}/${post.quoteDetails.product?.id}" 
27441                                                                class="buy-now-button">
27442                                                                    Buy Now  
27443                                                                    <img src="https://www.jumpspree.com/public/images/tilt-arrow.png" alt="" style="width: 12px;filter: invert(1);">
27444                                                                </a>
27445                                                            </div>
27446                                                        ` : ''}
27447                                                    </div>
27448                                                </div>
27449                                            </div>
27450
27451                                            <div class="row">
27452                                                <div class="col-md-12" data-id="is-blog-${post.quoteDetails?.is_blog || '0'}" id="contentDivID-${post.quoteDetails?.postId || '4275'}">
27453                                                    <div class="post-text">
27454                                                        <p>
27455                                                                
27456                                                            <a href="/${post.quoteDetails.username}/${slugify(post?.quoteDetails?.product?.producttitle || 't')}/${post.quoteDetails.product?.id || '1176'}">
27457                                                                ${post.quoteDetails.product?.producttitle || post.quoteDetails.postText}
27458                                                            </a>
27459                                                        </p>
27460                                                    </div>
27461                                                    
27462                                                    ${post.quoteDetails.product?.sellingprice || post.quoteDetails.product?.discountedprice ? `
27463                                                        <div class="product-price-wrapper">
27464                                                            ${post.quoteDetails.product?.discountedprice ? `
27465                                                                <div class="price-main">$${post.quoteDetails.product?.discountedprice}</div>
27466                                                                ${post.quoteDetails.product?.discountPercent > 0 ? `
27467                                                                    <div style="display:none"  class="price-discount">${post.quoteDetails.product?.discountPercent}% OFF</div>
27468                                                                ` : ''}
27469                                                                <div   class="price-main-small">was $${post.quoteDetails.product?.sellingprice}</div>
27470                                                            ` : `
27471                                                                <div style="display:none"  class="price-main">$${post.quoteDetails.product?.sellingprice}</div>
27472                                                            `}
27473                                                        </div>
27474                                                    ` : ''}
27475                                                    
27476                                                    ${post.quoteDetails.product?.description ? `
27477                                                        <div style="display:none" class="product-description">
27478                                                            <p>${convertHashtagsToLinks(post.quoteDetails.product?.description.substring(0, 150) + (post.quoteDetails.product?.description.length > 150 ? '...' : ''))}</p>
27479                                                        </div>
27480                                                    ` : ''}
27481                                                    
27482                                                    <!-- Product Rating -->
27483                                                    ${post.quoteDetails.product?.rating && post.quoteDetails.product?.rating > 0 ? `
27484                                                        <div style="display:none"  class="product-rating">
27485                                                            <span class="stars">${generateStars(post.quoteDetails.product.rating)}</span>
27486                                                            <span class="rating-text">${post.quoteDetails.product.rating}</span>
27487                                                        </div>
27488                                                    ` : ''}
27489                                                    
27490                                                    <!-- Shipping Info -->
27491                                                    <div style="display:none"  class="product-shipping-info">
27492                                                        ${post.quoteDetails.product?.isFreeShipping == '1' ? `
27493                                                            <span class="shipping-badge"><i class="fa-regular fa-truck"></i> Free Shipping</span>
27494                                                        ` : ''}
27495                                                        ${post.quoteDetails.product?.inStorePickup == '1' ? `
27496                                                            <span class="pickup-badge"><i class="fa-regular fa-store"></i> In-store Pickup</span>
27497                                                        ` : ''}
27498                                                        ${post.quoteDetails.product?.sameDayDelivery == '1' ? `
27499                                                            <span class="delivery-badge"><i class="fa-regular fa-bolt"></i> Same Day Delivery</span>
27500                                                        ` : ''}
27501                                                    </div>
27502                                                    
27503                                                    ${post.quoteDetails?.postFiles?.length ? `
27504                                                        <div class="blog-main-image mb-10 movie-trailer">
27505                                                            ${(() => {
27506                                                                const firstFile = post.quoteDetails.postFiles[0];
27507                                                                const cleanImagePath = firstFile.imagepath.split('?')[0];
27508                                                                
27509                                                                // Check if image
27510                                                                if (cleanImagePath.match(/\.(jpeg|jpg|png|gif|webp|heic)$/i)) {
27511                                                                    return `
27512                                                                        <div class="lightgallery">
27513                                                                            <a href="${firstFile.imagepath}" data-lightbox="product-image">
27514                                                                                <img loading="lazy" src="${firstFile.imagepath}" alt="Product Image">
27515                                                                            </a>
27516                                                                        </div>
27517                                                                    `;
27518                                                                }
27519                                                                // Check if video
27520                                                                else if (cleanImagePath.match(/\.(mp4|webm|ogg|mov)$/i)) {
27521                                                                    return `
27522                                                                        <div class="video-container">
27523                                                                            <video loop muted controls>
27524                                                                                <source src="${firstFile.imagepath}" type="video/mp4">
27525                                                                            </video>
27526                                                                        </div>
27527                                                                    `;
27528                                                                }
27529                                                                return '';
27530                                                            })()}
27531                                                        </div>
27532                                                    ` : ''}
27533                                                </div>
27534                                            </div>
27535                                        </div>
27536                                    </div>
27537                                </div>
27538                                
27539
27540                            ` : `
27541
27542
27543
27544                            <!-- Repost for POST data (not product)-->
27545                            <div class="repost-social">
27546                                <div class="repost-wrapper">
27547                                    <div class="email-box">
27548                                        <div class="row">
27549                                            <div class="col-md-12">
27550                                                <div class="fnc mt-0 justify-content-between mb-9 align-items-start" style="padding: 0 15px;">
27551                                                    <div class="d-flex align-items-center">
27552                                                        <a href="/${post.quoteDetails?.username || '#'}" class="fig">
27553                                                            <img loading="lazy" src="${post.quoteDetails?.profile_photo || 'https://www.jumpspree.com/public/images/user-icon.png?ver:1.035'}" style="border-radius:50%" alt="Profile Photo" title="Profile Photo">
27554                                                        </a>
27555                                                        <div class="fnc-title">
27556                                                            <h4 class="notranslate">
27557                                                                <a href="/${post.quoteDetails?.username || '#'}" class="profile-link">@${post.quoteDetails?.username || 'User'}</a>
27558                                                                ${post.quoteDetails.bluetick == 1 ? '<img src="https://www.jumpspree.com/public/images/blue-cube.png" class="blue-cube-icon" alt="Verified Icon" title="Verified Icon">' : ''}
27559                                                            </h4>
27560                                                            <p style="display: none;">
27561                                                                <a href="/${post.quoteDetails?.username || '#'}" class="profile-link">
27562                                                                    @${post.quoteDetails?.username || 'unknown'}
27563                                                                </a>
27564                                                            </p>
27565                                                        </div>
27566
27567
27568                                                            <div data-uoutput="${post.quoteDetails.pdate} ${post.quoteDetails.ptime}" class="datenew">
27569                                                                    ${formatPostDate(post.quoteDetails.pdate + ' ' + post.quoteDetails.ptime)}
27570                                                            </div>
27571                                                    </div>
27572                                                </div>
27573                                            </div>
27574                                        </div>
27575
27576                                        <div class="row">
27577                                            <div class="col-md-12" data-id="is-blog-${post.quoteDetails?.is_blog || '0'}" id="contentDivID-${post.quoteDetails?.postId || '0'}">
27578                                                <div class="post-text">
27579                                                    <p>
27580                                                        <a href="/ps/${post.quoteDetails?.username || 'unknown'}/jumpid${post.quoteDetails?.postId || '0'}">
27581                                                            ${post.quoteDetails?.is_blog === '1' 
27582                                                                ? formatTextWithLineBreaksForRepostBlock(post.quoteDetails?.postTitle || '{}')
27583                                                                : convertHashtagsToLinks(post.quoteDetails?.postText || '')}
27584                                                        </a>
27585                                                    </p>
27586                                                </div>
27587                                                
27588                                                ${post.quoteDetails?.postFiles?.length ? `
27589                                                    <div class="blog-main-image mb-10 movie-trailer">
27590                                                        <div class="${post.quoteDetails.postFiles.length > 1 ? 'owl-carousel owl-theme' : ''}">
27591                                                            ${post.quoteDetails.postFiles.map(file => {
27592                                                                const cleanImagePath = file.imagepath.split('?')[0];
27593                                                                if (cleanImagePath.match(/\.(jpeg|jpg|png|gif|webp|heic)$/i)) {
27594                                                                    return `
27595                                                                        <div class="item lightgallery">
27596                                                                            <div data-src="${file.imagepath}">
27597                                                                                <a href="/ps/${post.quoteDetails?.username || 'unknown'}/jumpid${post.quoteDetails?.postId || '0'}">
27598                                                                                    <img loading="lazy" src="${file.imagepath}" width="300" height="300" alt="Repost Image" title="">
27599                                                                                </a>
27600                                                                            </div>
27601                                                                        </div>
27602                                                                    `;
27603                                                                } else if (cleanImagePath.match(/\.(mp4|webm|ogg|mov)$/i)) {
27604                                                                    return `
27605                                                                        <div class="item video-container">
27606                                                                            <video loop muted src="${file.imagepath}" controls></video>
27607                                                                        </div>
27608                                                                    `;
27609                                                                } else {
27610                                                                    return '';
27611                                                                }
27612                                                            }).join('')}
27613                                                        </div>
27614                                                    </div>
27615                                                ` : ''}
27616
27617                                                ${(() => {
27618                                                    const quoteUrls = extractUrls(post.quoteDetails?.postText || '');
27619                                                    if (!quoteUrls.length) return '';
27620                                                    return quoteUrls.map((qUrl, qIdx) => {
27621                                                        const qId = `link-preview-${post.postId}-q${qIdx}`;
27622                                                        setTimeout(() => fetchLinkPreviewYT(qUrl, `#${qId}`), 10);
27623                                                        return `
27624                                                        <div class="blog-main-image mb-10 movie-trailer alt-link">
27625                                                            <div class="post-single-image">
27626                                                                <div id="${qId}" class="link-preview">
27627                                                                    <a data-id="on-return-condition" class="postLink" href="${qUrl}" target="_blank">
27628                                                                        <sp
27628an class="trailer-image">
27629                                                                            <img loading="lazy" src="" class="link-image" style="max-width:100%; display:none;" />
27630                                                                        </span>
27631                                                                        <span class="trailer-text imageNotAvailable">
27632                                                                            <h4 class="link-title">Loading...</h4>
27633                                                                            <p class="link-description">${qUrl}</p>
27634                                                                        </span>
27635                                                                    </a>
27636                                                                </div>
27637                                                            </div>
27638                                                        </div>`;
27639                                                    }).join('');
27640                                                })()}
27641
27642                                            </div>
27643                                        </div>
27644                                    </div>
27645                                </div>
27646                            </div>
27647                        `}
27648
27649
27650                    ` : ''}
27651
27652
27653
27654
27655                    <div class="row" style="display:none">
27656                        <div class="col-md-12">
27657                            <div class="date">
27658                                <ul class="d-flex m-0">
27659                                    <li>${post.pdate}</li>
27660                                    <li><span>&bull;</span></li>
27661                                    <li>${post.ptime}</li>
27662                                </ul>
27663                            </div>
27664                        </div>
27665                    </div>
27666                    ${footerButtonsForAll}
27667                </div>        
27668            `;
27669        }
27670            
27671        
27672            //container.innerHTML += postHtml; // Append the generated HTML
27673            //container.insertAdjacentHTML('beforeend', postHtml);//beforeend 
27674            if (hashtag) {
27675                hashTagContainer.insertAdjacentHTML('beforeend', postHtml);
27676            } else {
27677                container.insertAdjacentHTML('beforeend', postHtml);
27678            }
27679        
27680    });
27681    
27682} 
27683// End of renderPosts function
27684
27685
27686/* 
27687function formatTextWithLineBreaksForRepostBlock(text) {
27688    if (!text) return ''; // Handle empty or null text
27689    const lines = text.split('\n'); // Split the text into lines
27690    return lines.map(line => `${line.trim()}<br>`).join(''); // Add <br> to each line
27691}
27692 */
27693function formatTextWithLineBreaksForRepostBlock(text) {
27694    if (!text) return '';
27695    return text.replace(/\n/g, '<br>'); // Simple, clean, efficient
27696}
27697
27698// Helper function to create URL-friendly slugs
27699function slugify(text) {
27700    return text.toString().toLowerCase()
27701        .replace(/\s+/g, '-')           // Replace spaces with -
27702        .replace(/[^\w\-]+/g, '')       // Remove all non-word chars
27703        .replace(/\-\-+/g, '-')         // Replace multiple - with single -
27704        .replace(/^-+/, '')             // Trim - from start of text
27705        .replace(/-+$/, '');            // Trim - from end of text
27706}
27707
27708function formatPostDate(dateTimeStr) {
27709    // Remove day name (Sat, Sun, etc.) and trim whitespace
27710    dateTimeStr = dateTimeStr.replace(/^[A-Za-z]+\s+/, '').trim();
27711    
27712    try {
27713        // Parse the date (06/14/25 12:29 pm)
27714        const postDate = new Date(dateTimeStr);
27715        
27716        if (isNaN(postDate.getTime())) {
27717            throw new Error("Invalid date");
27718        }
27719        
27720        const now = new Date();
27721        const diffInMs = now - postDate;
27722        const diffInDays = Math.floor(diffInMs / (1000 * 60 * 60 * 24));
27723        
27724        // Same day - return time only
27725        if (diffInDays === 0) {
27726            return postDate.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
27727        }
27728        
27729        // Less than 7 days
27730        if (diffInDays < 7) {
27731            return diffInDays === 1 ? '1d' : `${diffInDays}d`;
27732        }
27733        
27734        // Less than 30 days (approx 1 month)
27735        if (diffInDays < 30) {
27736            const weeks = Math.floor(diffInDays / 7);
27737            return weeks === 1 ? '1 week ' : `${weeks} weeks`;
27738        }
27739        
27740        // Months ago
27741        const months = Math.floor(diffInDays / 30);
27742        return months === 1 ? '1 month ' : `${months} months`;
27743        
27744    } catch (e) {
27745        // If parsing fails, return the original string
27746        return dateTimeStr;
27747    }
27748}
27749
27750
27751</script>
27751
27752           
27753
27754<script>
27755     $(document).on('click', '.save-bookmark', function() {
27756        var postId = $(this).data('postid'); // Extract post ID from data attribute
27757        //var productType = $(this).data('producttype'); // Optional: Extract product type
27758        var bookmarkIcon = $(this).find('img'); // Target the icon inside the clicked element
27759
27760        // Call checkAccess to verify user authentication
27761        checkAccess(function() {
27762            $.ajax({
27763                url: base_url + '/bookmarkToggle', // API endpoint
27764                type: 'POST',
27765                data: {
27766                    pid: postId,
27767                    producttype: "3" // Optional: Include product type
27768                },
27769                dataType: 'json',
27770                success: function(response) {
27771                    if (response.status) {
27772                        // Update the bookmark icon based on the response result
27773                        if (response.result == 1) {
27774                            // Bookmark added
27775                            bookmarkIcon.removeClass('bookmark-inactive').addClass('bookmark-active');
27776                            showNotification('success', 'Added to Bookmarks');
27777                            bookmarkIcon.attr('src', 'https://www.jumpspree.com/public/images/bookmark-filled.png?v=2');
27778                        } else {
27779                            // Bookmark removed
27780                            bookmarkIcon.removeClass('bookmark-active').addClass('bookmark-inactive'); 
27781                            showNotification('success', 'Removed from Bookmarks');
27782                            bookmarkIcon.attr('src', 'https://www.jumpspree.com/public/images/bookmark-021.png');
27783                        }
27784                    } else {
27785                        console.log('Error:', response.message);
27786                    }
27787                },
27788                error: function(xhr, status, error) {
27789                    console.error('AJAX error:', error);
27790                }
27791            });
27792        });
27793    });
27794    function bookmark_old(postId){
27795        bookmarkIcon=$('#bookmarkicon'+postId)
27796        $.ajax({
27797                url: base_url + '/bookmarkToggle', // API endpoint
27798                type: 'POST',
27799                data: {
27800                    pid: postId,
27801                    producttype: "3" // Optional: Include product type
27802                },
27803                dataType: 'json',
27804                success: function(response) {
27805                    if (response.status) {
27806                        // Update the bookmark icon based on the response result
27807                        if (response.result == 1) {
27808                            // Bookmark added
27809                            showNotification('success', 'Added to Bookmarks.');
27810                            bookmarkIcon.removeClass('fa-regular').addClass('fa-solid'); // Example class change
27811                        } else {
27812                            // Bookmark removed
27813                            showNotification('success', 'Removed from Bookmarks.');
27814                            bookmarkIcon.removeClass('fa-solid').addClass('fa-regular'); // Example class change
27815                        }
27816                    } else {
27817                        console.log('Error:', response.message);
27818                    }
27819                },
27820                error: function(xhr, status, error) {
27821                    console.error('AJAX error:', error);
27822                }
27823            });
27824
27825    }
27826  </script>
27826  
27827          
27828          
27829          
27830 
27830<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
27830
27831
27832  <!-- Initialize Swiper -->
27833  
27833<script>
27834    $(window).on('load', function(){
27835       setInterval(function(){
27836      var swiper = new Swiper(".mySwiper", {
27837      slidesPerView: 'auto',
27838      spaceBetween: 15,
27839      freeMode: true,
27840      pagination: {
27841        el: ".swiper-pagination",
27842        clickable: true,
27843      },
27844          breakpoints: {
27845    // When window width is <= 767px (mobile)
27846    0: {
27847      spaceBetween: 10,
27848    }
27849  }
27850    });  
27851           
27852    },3000)   
27853    })
27854      
27855    
27856  </script>
27856    
27857             
27858<script>
27859$(document).ready(function(){
27860    const popupKey = 'downloadAppPopupShownAt';
27861    const lastShown = localStorage.getItem(popupKey);
27862    const now = new Date().getTime();
27863    const hours24 = 24 * 60 * 60 * 1000; // 24 hours in ms
27864
27865    if (!lastShown || now - parseInt(lastShown) > hours24) {
27866        // $('#download-app-popup').fadeIn();
27867        // $('body').addClass('overflow-hidden');
27868        // $('.left_section').addClass('okld');
27869        localStorage.setItem(popupKey, now);
27870    }
27871
27872    // Optional: Close popup when clicked anywhere
27873    $('#download-app-popup').click(function(){
27874        $(this).fadeOut();
27875         $('body').removeClass('overflow-hidden');
27876        $('.left_section').removeClass('okld');;
27877    });
27878    $('#download-app-popup-inner').click(function(e){
27879        e.stopPropagation();
27880    })
27881});
27882
27883  
27884
27885
27886
27887</script>
27887  
27888
27889
27890
27891<style>
27892        .repost-btn.share-post .drop-down-menu-share ul li:last-child {
27893        display: block !important;
27894    }
27895</style>
27896
27897<script>
27898
27899
27900    $(document).ready(function () {
27901
27902        const url = new URL(window.location.href);
27903        let centrrl = sessionStorage.getItem('signinRedirectCentrlShare');
27904
27905        if(!centrrl){
27906            centrrl = url.searchParams.get("centrrl");
27907        }
27908
27909        if (!centrrl) return;
27910
27911        let decoded;
27912        try {
27913            decoded = decodeURIComponent(centrrl);
27914        } catch {
27915            return;
27916        }
27917
27918        console.log(decoded);
27919
27920
27921        // $('#social-popup').fadeIn('fast'); $('body').addClass('overflow-hidden'); $('.add-post-drop-box').hide(); $('.social-shadow').hide(); $('.add-post').removeClass('add-post-opened');$('#scheduledone').hide();$('#scheduled').val('0');$('#schedued-btn').removeClass('active');
27922        $('.add-post .plus-wrapper').each(function () {
27923            const span = $(this).find('span');
27924            const anchor = $(this).find('a');
27925
27926            if (span.length) {
27927                span.trigger('click');
27928                sessionStorage.removeItem('signinRedirectCentrlShare');
27929            } else if (anchor.length) {
27930                anchor.trigger('click');
27931                sessionStorage.setItem('signinRedirectCentrlShare', centrrl);
27932            }
27933        });
27934
27935        const editor = $("#addPostTextarea");
27936        editor.text(decoded);
27937        editor.trigger("input");
27938
27939        url.searchParams.delete("centrrl");
27940        window.history.replaceState({}, document.title, url.toString());
27941
27942
27943    });
27944</script>
27944
27945
27946<script>
27947    function openPostReportPopup(postId, element){
27948        if(!postId || postId.length === 0){
27949            return;
27950        }
27951
27952        const strip = $(element).closest('.user-sec-strip2');
27953        const parent = strip.closest('.email-box');
27954
27955        const img = strip.find('img').first();
27956        const username = strip.find('h4 .profile-link').text().trim();
27957
27958        const blueCube = strip.find('h4 .blue-cube-icon');
27959
27960        if (blueCube.length) {
27961            $('#report-username-check').show();
27962        }else{
27963            $('#report-username-check').hide();
27964        }
27965
27966        const postTextElem = parent.find('.post-text p');
27967
27968        if(postTextElem.length){
27969            let postText = postTextElem.first().text();
27970            $('#report-post-txt').text(postText);
27971            $('#report-post-txt').show();
27972        }else{
27973            $('#report-post-txt').hide();
27974        }
27975
27976        $('#report-user-img img').attr('src', img.attr('src'));
27977        // $('#report-user-desc h3').text(username);
27978        $('#report-username-txt').text(username);
27979
27980        $('#report-brand').attr('data-postid', postId);
27981        $('#report-brand').fadeIn();
27982    }
27983</script>
27983
27984       
27985       
27986  </div>
27987  
27988  <style>
27989.copy-right p a {
27990    color: #999 !important;
27991    text-decoration: underline;
27992}
27993</style>
27994   <footer>
27995               <div class="footer-inner">
27996<div class="container">
27997<!--                   <p>©2024 Jumpspree, Inc. All rights reserved.</p>-->
27998                  <div class="copy-right">
27999                        <p>©2026 Jumpspree by Nexa Platforms, Inc. <a target="_blank" href="https://www.jumpspree.com/terms-of-use">Terms</a> and <a href="https://www.jumpspree.com/privacy-policy" target="_blank">Privacy</a>.</p>
28000                   </div>
28001                   <ul class="d-flex" style="padding:0px;">
28002<!--
28003                       <li><a href="https://www.jumpspree.com/refer-and-win-with-jumpspree">Referral Program</a></li>
28004                       |
28005-->
28006                       <li><a href="https://www.jumpspree.com/blog">Blog</a></li>
28007                       |
28008                       <li><a href="https://www.jumpspree.com/terms-of-use">Terms of Use</a></li>
28009                       |
28010                       <li><a href="https://www.jumpspree.com/privacy-policy">Privacy Policy</a></li>
28011                       |
28012<!--                       <li><a href="/support">Support</a></li>-->
28013                       <li><a href="mailto:[email protected]">Support</a></li>
28014                       |
28015                       <li><a href="https://www.jumpspree.com/selling-fees">Selling Fees</a></li>
28016                       |
28017                       <li><a href="https://www.jumpspree.com/platform-guidelines">Platform Guidelines</a></li>
28018                       |
28019<!--
28020                       <li><a href="https://www.jumpspree.com/selling-fees">Shipping Guidelines</a></li>
28021                       |
28022-->
28023                       <li><a href="https://www.jumpspree.com/livestream-returns">Livestream Returns</a></li>
28024                       |
28025                       <li><a href="https://www.jumpspree.com/return-policy">Return Policy</a></li>
28026                       |
28027                       <li><a href="https://www.jumpspree.com/frequently-asked-questions">FAQs</a></li>
28028                     </ul>
28029               </div>
28030           </div>
28031</footer>
28032  
28033  <style>
28034/*      #report-on-more-option{display: none !important;}*/
28035      #report-on-more-option {
28036    background: #21212170 !important;
28037    backdrop-filter: blur(10px);
28038    -webkit-backdrop-filter: blur(10px);
28039}
28040#report-on-more-option .add-post-inner {
28041    background: #fff;
28042    max-width: 600px;
28043    height: 350px;
28044    border-radius: 25px;
28045    position: absolute;
28046    top: 0;
28047    left: 0;
28048    z-index: 9999;
28049    width: 600px;
28050    left: 50%;
28051    top: 50%;
28052    transform: translate(-50%, -50%);
28053    padding: 25px;
28054}      
28055#report-on-more-option .add-post-inner {
28056    background: #171717;
28057    border: 1px solid #3241585c;
28058    padding: 30px;
28059    border-radius: 35px;
28060    height: auto;
28061    max-width: 500px;
28062}      
28063#report-on-more-option h2 {
28064    color: #fff;
28065    font-weight: 600;
28066    font-size: 25px;
28067}
28068#report-on-more-option .cross {
28069    position: absolute;
28070    right: 30px;
28071    top: 30px;
28072    width: 34px;
28073}
28074#report-on-more-option .add-post-inner a {
28075    font-size: 18px !important;
28076    color: #444eff !important;
28077}
28078#report-on-more-option textarea {
28079    color: #fff;
28080    border: none;
28081    resize: none;
28082    height: 200px;
28083    background: none;
28084    overflow-y: auto;
28085    padding-right: 40px;
28086}
28087#report-on-more-option div#attachment-preview-container {
28088    width: 200px;
28089    position: relative;
28090    margin-bottom: 10px;
28091}
28092#report-on-more-option button#remove-attachment {
28093    position: absolute;
28094    background: no-repeat;
28095    color: #fff;
28096    border: none;
28097    background: #000000ad;
28098    width: 20px;
28099    height: 20px;
28100    color: #ffffff !important;
28101    border-radius: 70px;
28102    line-height: 7px;
28103    position: absolute;
28104    right: 5px;
28105    top: 5px;
28106}
28107.attach {
28108    position: relative;
28109    overflow: hidden;
28110    cursor: pointer;
28111}
28112.report-foot.d-flex .attach img {
28113    width: 35px;
28114}   
28115#report-on-more-option .social-popup {
28116    position: fixed;
28117    top: 0;
28118    left: 0;
28119    right: 0;
28120    bottom: 0;
28121    height: 100%;
28122    background: #6f6f6f82;
28123    z-index: 99999999999999;
28124    display: none;
28125}   
28126@media (max-width: 767px) {
28127#report-on-more-option textarea {
28128    width: 100%;
28129        padding-right: 20px;
28130    }     
28131    #report-on-more-option .add-post-inner {
28132        border: none;
28133        padding: 20px;
28134        border-radius: 0px;
28135        max-width: 500px;
28136        height: 100%;
28137        border-radius: 0;
28138        width: 100%;
28139        display: flex;
28140        flex-direction: column;
28141        background: #171717;
28142        position: absolute;
28143    }
28144.annoucement h2 {
28145        line-height: 26px;
28146    }
28147    #report-on-more-option .cross {
28148        right: 20px;
28149        top: 20px;
28150        width: 30px;
28151    }   
28152#report-on-more-option .cross img {
28153    width: 100%;
28154}    
28155#report-on-more-option .pop-inner {
28156        flex: 1;
28157    }
28158.report-foot button.send {
28159    background: none;
28160    border: 1px solid #3241585c;
28161    color: #fff;
28162    padding: 0 20px;
28163    width: auto;
28164    border-radius: 35px;
28165    font-size: 14px;
28166}
28167.report-foot .send
28168 {
28169    width: auto;
28170    margin: 0;
28171}
28172.send {
28173    margin-left: 10px;
28174    width: 40px;
28175    height: 40px;
28176}
28177.attach input {
28178    position: absolute;
28179    left: 0;
28180    height: 35px;
28181    cursor: pointer;
28182    opacity: 0;
28183}  
28184    #signup-new-process #step03 .form-box h2.signup-title, #signup-new-process #step04 .form-box h2.signup-title, #signup-new-process #step02 .form-box h2.signup-title, #signup-new-process #step05 .form-box h2.signup-title, #signup-new-process #step06 .form-box h2.signup-title {
28185        font-size: 18px !important; 
28186        margin: 0 !important;
28187        margin-bottom: 8px !important;
28188    }
28189    #signup-new-process #step03 .email-box {
28190        padding-top: 9px;
28191    }
28192}      
28193</style>
28194 
28195 <style>
28196.get-app-qr-code-wrapper {
28197    background: #000000bd;
28198}
28199.get-app-qr-code-wrapper {
28200    position: fixed;
28201    top: 0;
28202    z-index: 9999999999;
28203    bottom: 0;
28204    display: flex;
28205    align-items: center;
28206    justify-content: center;
28207    display: none;
28208    background: #00000082;
28209    left: 0;
28210    right: 0;
28211}
28212.get-app-qr-code-wrapper .email-verification.after-login {
28213    border: 1px solid #333333;
28214    border-radius: 42px;
28215}
28216body.light-mode .get-app-qr-code-wrapper .email-verification.after-login {
28217    border: 1px solid #fff;
28218}
28219.get-app-qr-code-wrapper .email-verification.after-login {
28220    padding: 30px 20px !important;
28221}
28222.get-app-qr-code-wrapper > div {
28223    background: #161616;
28224}
28225.get-app-qr-code-wrapper > div {
28226    background: #252525;
28227    max-width: 390px;
28228    height: auto;
28229    border-radius: 20px;
28230    position: absolute;
28231    top: 0;
28232    left: 0;
28233    z-index: 9999;
28234    width: 390px;
28235    left: 50%;
28236    top: 50%;
28237    transform: translate(-50%, -50%);
28238    padding: 25px;
28239    margin: 0;
28240}
28241 .get-app-qr-code-wrapper > div h4.text-center {
28242    color: #fff;
28243}
28244body.light-mode .get-app-qr-code-wrapper > div h4.text-center {
28245    color: #222;
28246}
28247.scanner img {
28248    width: 100%;
28249}
28250.close-getstart {
28251    position: absolute;
28252    right: 40px;
28253    font-size: 33px;
28254    color: #555555;
28255    top: 20px;
28256    font-weight: 100;
28257    cursor: pointer;
28258}
28259.download-btn {
28260    margin-top: 15px;
28261}
28262    .download-btn {
28263    text-align: center;
28264    width: 130px;
28265    margin: 0 auto;
28266}
28267.get-app-qr-code-wrapper .note-line p {
28268    color: #fff;
28269}
28270body.light-mode .get-app-qr-code-wrapper .note-line p {
28271    color: #222;
28272}
28273.get-androd-app {
28274    text-align: center;
28275}
28276.get-androd-app a {
28277    font-size: 12px;
28278    color: #5566FF;
28279    margin-top: 14px;
28280    display: block;
28281}
28282.get-app-qr-code-wrapper .note-line p {
28283    line-height: 18px;
28284    text-align: center;
28285    margin-top: 20px;
28286    font-size: 12px;
28287    color: #fff;
28288}
28289.get-app-qr-code-wrapper > div {
28290    background: #161616;
28291}     
28292.scanner {
28293    width: 230px;
28294    margin: 0px auto 15px;
28295    max-width: 230px;
28296} 
28297.get-app-qr-code-wrapper h4 {
28298    color: #fff;
28299    font-weight: 600;
28300    font-size: 22px;
28301    margin-bottom: 10px;
28302    line-height: 32px;
28303} 
28304    .get-app-qr-code-wrapper .email-box {
28305    width: 100%;
28306    padding: 15px;
28307}  
28308     #report-on-more-option{display: none;}     
28309@media (max-width: 767px) {
28310#sellerpad-android-app .email-verification.after-login, #sellerpad-ios-app .email-verification.after-login {
28311    max-width: 95%;
28312}    
28313    div#ios-app .email-verification.after-login, div#android-app .email-verification.after-login {
28314        width: 90%;
28315        max-width: 90%;
28316    }
28317
28318}     
28319
28320</style>
28321  
28322  
28323  <div class="get-app-qr-code-wrapper" id="ios-app" style="display:none">
28324    <div class="email-verification after-login">
28325       <div class="close-getstart" onclick="$('#ios-app').fadeOut('fast');">×</div>
28326        <div class="email-box">
28327            <h4 class="text-center">Get Jumpspree <br>for iOS</h4>
28328
28329
28330            <div class="scanner">
28331                <a target="_blank"
28332                    href="https://apps.apple.com/us/app/jumpspree-make-friends-shop/id1558701442?ign-itscg=30200&ign-itsct=apps_box_link&mttnsubad=1558701442">
28333<!--
28334                       <img
28335                        src="https://www.jumpspree.com/public/images/Jumpspree-for-iOS-2025.png?ver:1.03" alt="">
28336-->
28337                       <img
28338                        src="https://www.jumpspree.com/public/images/Jumpspree-for-iOS-n.png?ver:1.03" alt="Download" title="Download">
28339                        </a>
28340            </div>
28341
28342            <div class="download-btn">
28343                <a target="_blank"
28344                    href="https://apps.apple.com/us/app/jumpspree-make-friends-shop/id1558701442?ign-itscg=30200&ign-itsct=apps_box_link&mttnsubad=1558701442"><img
28345                        src="https://www.jumpspree.com/public/images/ios-download.png" alt="Download" title="Download"></a>
28346            </div>
28347
28348
28349            <div class="note-line">
28350                <p class="mb-0">Scan the QR code with your smartphone or tablet to download the Jumpspree app for iOS,
28351                    or simply tap the button on your mobile device.</p>
28352            </div>
28353
28354            <div class="get-androd-app">
28355                <a href="javascript:void(0);" onclick="$('#android-app').fadeIn(); $('#ios-app').hide()">Get Jumpspree
28356                    for Android instead</a>
28357            </div>
28358
28359
28360
28361        </div>
28362        <!--
28363                       <div class="action-wrapper">
28364                           <button class="btn btn-success">Claim Username</button>
28365                       </div>
28366        -->
28367    </div>
28368</div>
28369
28370<div class="get-app-qr-code-wrapper" id="android-app" style="display:none">
28371    <div class="email-verification after-login">
28372              <div class="close-getstart" onclick="$('#android-app').fadeOut('fast');">×</div>
28373
28374        <div class="email-box">
28375            <h4 class="text-center">Get Jumpspree <br>for Android</h4>
28376
28377
28378            <div class="scanner">
28379                <a target="_blank" href="https://play.google.com/store/apps/details?id=com.blueastral.cubesnack&hl=en">
28380                    <img src="https://www.jumpspree.com/public/images/Jumpspree-for-Android-n.png?ver:1.027" alt="Download" title="Download"></a>
28381            </div>
28382
28383            <div class="download-btn">
28384                <a target="_blank"
28385                    href="https://play.google.com/store/apps/details?id=com.blueastral.cubesnack&hl=en"><img
28386                        src="https://www.jumpspree.com/public/images/download-android.png" alt="Download" title="Download"></a>
28387            </div>
28388
28389
28390            <div class="note-line">
28391                <p class="mb-0">Scan the QR code with your smartphone or tablet to download the Jumpspree app for
28392                    Android, or simply tap the button on your mobile device.</p>
28393            </div>
28394
28395            <div class="get-androd-app">
28396                <a href="javascript:void(0);" onclick="$('#android-app').hide(); $('#ios-app').fadeIn()">Get Jumpspree
28397                    for iOS instead</a>
28398            </div>
28399
28400
28401
28402        </div>
28403        <!--
28404                       <div class="action-wrapper">
28405                           <button class="btn btn-success">Claim Username</button>
28406                       </div>
28407        -->
28408    </div>
28409</div>
28410   
28411   
28412   <div class="get-app-qr-code-wrapper" id="sellerpad-android-app" style="display:none">
28413    <div class="email-verification after-login">
28414              <div class="close-getstart" onclick="$('#sellerpad-android-app').fadeOut('fast');">×</div>
28415
28416        <div class="email-box" style="border: none !important;">
28417            <h4 class="text-center">Get Seller Pad <br>for Android</h4>
28418
28419
28420            <div class="scanner">
28421                <a target="_blank" href="https://play.google.com/store/apps/details?id=com.jumpspree.pad">
28422                    <img src="https://www.jumpspree.com/public/images/Seller-Pad-for-Android.png?ver:1.029" alt="Download" title="Download"></a>
28423            </div>
28424
28425            <div class="download-btn">
28426                <a target="_blank"
28427                    href="https://play.google.com/store/apps/details?id=com.jumpspree.pad"><img
28428                        src="https://www.jumpspree.com/public/images/download-android.png" alt="Download" title="Download"></a>
28429            </div>
28430
28431
28432            <div class="note-line">
28433                <p class="mb-0">Scan the QR code with your smartphone or tablet to download the Seller Pad app for
28434                    Android, or simply tap the button on your mobile device.</p>
28435            </div>
28436
28437            <div class="get-androd-app">
28438                <a href="javascript:void(0);" onclick="$('#sellerpad-android-app').hide(); $('#sellerpad-ios-app').fadeIn()">Get Seller Pad
28439                    for iOS instead</a>
28440            </div>
28441
28442
28443
28444        </div>
28445        <!--
28446                       <div class="action-wrapper">
28447                           <button class="btn btn-success">Claim Username</button>
28448                       </div>
28449        -->
28450    </div>
28451</div>
28452   
28453   <div class="get-app-qr-code-wrapper" id="sellerpad-ios-app" style="display:none">
28454    <div class="email-verification after-login">
28455              <div class="close-getstart" onclick="$('#sellerpad-ios-app').fadeOut('fast');">×</div>
28456
28457        <div class="email-box" style="border: none !important;">
28458            <h4 class="text-center">Get Seller Pad <br>for IOS</h4>
28459
28460
28461            <div class="scanner">
28462                <a target="_blank" href="https://apps.apple.com/us/app/seller-pad/id6738024608">
28463                    <img src="https://www.jumpspree.com/public/images/Seller-Pad-for-iOS.png?ver:1.028" alt="Download" title="Download"></a>
28464            </div>
28465
28466            <div class="download-btn">
28467                <a target="_blank"
28468                    href="https://apps.apple.com/us/app/seller-pad/id6738024608"><img
28469                        src="https://www.jumpspree.com/public/images/ios-download.png" alt="Download" title="Download"></a>
28470            </div>
28471
28472
28473            <div class="note-line">
28474                <p class="mb-0">Scan the QR code with your smartphone or tablet to download the Seller Pad app for
28475                    IOS, or simply tap the button on your mobile device.</p>
28476            </div>
28477
28478            <div class="get-androd-app">
28479                <a href="javascript:void(0);" onclick="$('#sellerpad-ios-app').hide(); $('#sellerpad-android-app').fadeIn()">Get Seller Pad
28480                    for android instead</a>
28481            </div>
28482
28483
28484
28485        </div>
28486        <!--
28487                       <div class="action-wrapper">
28488                           <button class="btn btn-success">Claim Username</button>
28489                       </div>
28490        -->
28491    </div>
28492</div>
28493  
28494  
28495   
28496<style>
28497footer p br {
28498    display: none;
28499}
28500    @media screen and (max-width:767px){
28501 footer p br {
28502    display: block;
28503}       
28504    }    
28505</style>  
28506   
28507   
28508<!--   
28508<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
28508
28509-->    
28509<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
28509
28510   
28510<script>
28511      /* $(function(){
28512  
28513           
28514$('.hamburger').click(function(){
28515    $('.nav-bar.hide-on-desktop').slideToggle('fast');
28516})           
28517      
28518           
28519          
28520           
28521  })  */
28522/*$(window).on('load', function(){
28523    setTimeout(function(){
28524        $('body').addClass('body-loaded');
28525    },2000)
28526})  */      
28527    </script>
28527
28528     
28528<script src="https://www.jumpspree.com/public/js/clipboard.min.js"></script>
28528
28529     
28529<script>
28530       $(function(){
28531      let lastScrollTop = 0;
28532  const navbarHeight = $(".header-wrapper").outerHeight();
28533  const header = $(".header-wrapper")
28534
28535  $(window).scroll(hasScrolled);
28536
28537  function hasScrolled() {
28538      
28539    const st = $(this).scrollTop();
28540    header.toggleClass("hiddeNavBar scrollup", st > lastScrollTop && st > navbarHeight );
28541    lastScrollTop = st;  
28542    //$('.announcement-popup').remove();  
28543  }
28544           
28545$('.hamburger').click(function(){
28546    $('.nav-bar.hide-on-desktop').slideToggle('fast');
28547})     
28548           
28549           
28550
28551$(document).on('keydown', function(e) {
28552    if (e.key === 'Escape' || e.keyCode === 27) {
28553        $('.get-app-qr-code-wrapper').fadeOut('fast');
28554        $('body').removeClass('overflow-hidden');
28555       
28556    }
28557});
28558  $(document).on("click", ".get-app-qr-code-wrapper", function (e) {
28559    // If clicked outside .daily-limit-box
28560    if (!$(e.target).closest(".get-app-qr-code-wrapper > .email-verification").length) {
28561        $(".get-app-qr-code-wrapper").fadeOut('fast');
28562        $("body").removeClass("overflow-hidden");
28563    }
28564});            
28565           
28566// this page
28567           
28568$( ".drop-menu" ).hover(
28569  function() {
28570    $('.sub-nav').stop().slideDown();
28571  }, function() {
28572    $('.sub-nav').stop().slideUp('fast');
28573  }
28574);   
28575           
28576           
28577
28578var clipboard = new Clipboard('.btn-copy', {
28579    text: function() {
28580        return document.querySelector('input[type=hidden]').value;
28581    }
28582});
28583clipboard.on('success', function(e) {
28584  $('.copied').fadeIn();
28585    setTimeout(function(){
28586        $('.copied').fadeOut();
28587    },1000)
28588  e.clearSelection();
28589});
28590
28591    
28592              
28593           
28594  })  
28595  
28596  
28597           
28598    </script>
28598
28599    
28600    
28600<script>
28601			$(function(){
28602				var current = location.href;
28603				$('.nav-menu-for-active li a').each(function(){
28604				var $this = $(this);
28605				// if the current path is like this link, make it active
28606				console.log($this)
28607				if( $this.attr('href') ==current ){
28608				
28609				$this.parent().addClass('active');
28610				}
28611				})
28612				
28613			})
28614	</script>
28614
28615   
28616  <!-- 
28616<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
vendor: 2 bytes, line 28616
28616
28617<script>
28618    $(document).ready(function() {
28619            var bodyClass = $.cookie('bodyClass');
28620            if (bodyClass=='light-mode') {
28621                //$('body').removeAttr();
28622                $('body').addClass('light-mode');
28623                $('body').removeClass('dark-mode');
28624            }
28625
28626              
28627    });
28628</script>
28628-->
28629    
28630    
28631     
28632 <!-- //////////////////////////////////////  LANGUAGE MODEL LOGIC START ////////////////////////////////////// -->
28633
28634<!-- Language & Currency Button -->
28635<button id="langCurrencyBtn" class="langCurrencyBtn" onclick="openLangPopup()">
28636  <svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 16 16"
28637       style="display:block;height:16px;width:16px;fill:#fff;">
28638    <path d="M8 .25a7.77 7.77 0 0 1 7.75 7.78 7.75 7.75 0 0 1-7.52 7.72h-.25A7.75 
28639             7.75 0 0 1 .25 8.24v-.25A7.75 7.75 0 0 1 8 .25zm1.95 
28640             8.5h-3.9c.15 2.9 1.17 5.34 1.88 5.5H8c.68 0 1.72-2.37 
28641             1.93-5.23zm4.26 0h-2.76c-.09 1.96-.53 3.78-1.18 
28642             5.08A6.26 6.26 0 0 0 14.17 9zm-9.67 0H1.8a6.26 
28643             6.26 0 0 0 3.94 5.08 12.59 12.59 0 0 1-1.16-4.7l-.03-.38zm1.2-6.58
28644             -.12.05a6.26 6.26 0 0 0-3.83 5.03h2.75c.09-1.83.48-3.54 
28645             1.06-4.81zm2.25-.42c-.7 0-1.78 2.51-1.94 5.5h3.9c-.15-2.9-1.18-5.34
28646             -1.89-5.5h-.07zm2.28.43.03.05a12.95 12.95 0 0 1 1.15 
28647             5.02h2.75a6.28 6.28 0 0 0-3.93-5.07z"></path>
28648  </svg>
28649</button>
28650
28651<!-- Popup -->
28652<div id="langCurrencyPopup" class="popup-overlay notranslate">
28653  <div class="popup-content">
28654    <div class="tabbs-section">
28655      <div class="tabs">
28656        <button class="tab active" data-tab="lang">Language and Region</button>
28657        <button class="tab" data-tab="currency">Currency</button>
28658      </div>
28659      <span id="popupClose"><img src="https://www.jumpspree.com/public/images/close-language.png" alt="close" title="close"></span>
28660    </div>
28661
28662    <div class="inner-language-box">
28663      <!-- Languages -->
28664      <div id="tab-lang" class="tab-content active">
28665        <h3 class="popup-label">Choose your preferred language</h3>
28666        <div id="allLanguagesContainer"></div>
28667      </div>
28668
28669      <!-- Currency -->
28670      <div id="tab-currency" class="tab-content">
28671        <h3>Choose a currency</h3>
28672        <div id="allCurrencies"></div>
28673      </div>
28674    </div>
28675
28676    <div class="note-language">
28677      <p>Note: Language and currency conversion is a beta feature. Some languages may slightly affect UI labels or buttons.</p>
28678    </div>
28679  </div>
28680</div>
28681
28682<!-- Hidden Google Translate -->
28683<div id="google_translate_element" style="position:absolute;top:-9999px;left:-9999px;opacity:0;"></div>
28684
28685<!-- //////////////////////////////////////  STYLES  ////////////////////////////////////// -->
28686<style>
28687  /* Hide Google Translate artifacts */
28688  iframe[id^=":"] , .goog-te-banner-frame , .goog-te-balloon-frame ,
28689  .goog-te-menu-frame , .goog-logo-link , .goog-tooltip , .goog-text-highlight {
28690    display:none !important; opacity:0 !important; visibility:hidden !important;
28691    pointer-events:none !important;
28692  }
28693  #google_translate_element { display:none !important; }
28694  body { top:0px !important; position:static !important; }
28695
28696  /* Popup design */
28697  .popup-overlay {
28698    display:none; position:fixed; inset:0; background:rgba(0,0,0,0.6);
28699    z-index:9999; justify-content:center; align-items:center;
28700  }
28701  .popup-content {
28702    background:#fff; border-radius:10px; padding:20px; width:90%;
28703    max-width:480px; position:relative;
28704  }
28705  .tabs { display:flex; border-bottom:1px solid #ddd; }
28706  .tabs .tab {
28707    flex:1; padding:10px; cursor:pointer; text-align:center;
28708    background:#f4f4f4; border:none; font-weight:600;
28709  }
28710  .tabs .tab.active { background:#008489; color:#fff; }
28711  .tab-content { display:none; margin-top:15px; }
28712  .tab-content.active { display:block; }
28713  #popupClose { position:absolute; top:10px; right:15px; cursor:pointer; }
28714  .language-option {
28715    display:flex; flex-direction:column; align-items:flex-start;
28716    padding:10px; border:1px solid #ddd; margin:5px; border-radius:6px;
28717    cursor:pointer; transition:all 0.2s ease;
28718  }
28719  .language-option:hover { background:#f1f1f1; }
28720  .language-option.active {
28721    background:#008489; color:#fff; font-weight:bold;
28722  }
28723  .lang-main { font-size:14px; }
28724  .lang-sub { font-size:12px; color:#666; }
28725  #allCurrencies button {
28726    margin:5px; padding:8px 12px; border-radius:5px;
28727    border:1px solid #ccc; cursor:pointer;
28728  }
28729  #allCurrencies button.active {
28730    background:#008489; color:#fff; border-color:#008489;
28731  }
28732</style>
28733<style>
28734.langCurrencyBtn {
28735  position: relative;
28736  background: none;
28737  border: none;
28738}
28739.langCurrencyBtn .touch-area {
28740  display: flex;
28741  align-items: center;
28742  gap: 6px;
28743  padding: 6px 10px;
28744}
28745</style>
28746
28747<!-- //////////////////////////////////////  SCRIPTS  ////////////////////////////////////// -->
28748<script>
28749  /* =========  Google Translate Helpers  ========= */
28750  function googleTranslateElementInit() {
28751    new google.translate.TranslateElement({ pageLanguage: 'en' }, 'google_translate_element');
28752  }
28753
28754  function waitForTranslateSelectAsync(timeout = 12000) {
28755    return new Promise((resolve, reject) => {
28756      const start = Date.now();
28757      (function check() {
28758        const sel = document.querySelector('select.goog-te-combo');
28759        if (sel) return resolve(sel);
28760        if (Date.now() - start > timeout) return reject(new Error('Google translate select not found'));
28761        requestAnimationFrame(check);
28762      })();
28763    });
28764  }
28765
28766/*   async function triggerGoogleTranslate(requestedCode) {
28767    try {
28768      const select = await waitForTranslateSelectAsync();
28769      const opts = Array.from(select.options).map(o => o.value);
28770      let val = "en";
28771      if (opts.includes(requestedCode)) val = requestedCode;
28772      else if (opts.includes(requestedCode.split('-')[0])) val = requestedCode.split('-')[0];
28773
28774      select.value = val;
28775      select.dispatchEvent(new Event('input', { bubbles: true }));
28776      select.dispatchEvent(new Event('change', { bubbles: true }));
28777
28778      localStorage.setItem("userLang", requestedCode);
28779      document.getElementById("langCurrencyPopup").style.display = "none";
28780      document.body.classList.remove("overflow-hidden");
28781      console.log("🌐 Language switched:", requestedCode);
28782    } catch (e) {
28783      console.error("Translation trigger failed:", e);
28784    }
28785  } */
28786
28787
28788  /* Trigger Translation (Windows-safe fix) */
28789  /* Trigger Translation (Windows-safe + Airbnb-style label) */
28790async function triggerGoogleTranslate(requestedCode) {
28791  try {
28792    const select = await waitForTranslateSelectAsync();
28793    const opts = Array.from(select.options).map(o => o.value);
28794    let val = "en";
28795    if (opts.includes(requestedCode)) val = requestedCode;
28796    else if (opts.includes(requestedCode.split('-')[0])) val = requestedCode.split('-')[0];
28797
28798    select.value = val;
28799    // Fire both input and change (needed for Windows Chrome)
28800    select.dispatchEvent(new Event('input', { bubbles: true }));
28801    select.dispatchEvent(new Event('change', { bubbles: true }));
28802
28803    localStorage.setItem("userLang", requestedCode);
28804    document.getElementById("langCurrencyPopup").style.display = "none";
28805    document.body.classList.remove("overflow-hidden");
28806    console.log("🌐 Language switched:", requestedCode);
28807
28808    // ✅ Find full display name like Airbnb ("हिन्दी (भारत)")
28809    const langObj = languages.find(l => 
28810      l.code === requestedCode || l.code.split('-')[0] === requestedCode.split('-')[0]
28811    );
28812
28813    if (langObj && document.getElementById("langName")) {
28814      const displayText = langObj.country
28815        ? `${langObj.language} (${langObj.country})`
28816        : langObj.language;
28817
28818      // Update text instantly — no short codes anymore
28819      document.getElementById("langName").textContent = displayText;
28820
28821      // Save pretty label for next time
28822      localStorage.setItem("selectedLanguage", JSON.stringify(langObj));
28823    } else {
28824      console.warn("⚠️ No matching language object found for:", requestedCode);
28825      document.getElementById("langName").textContent = requestedCode;
28826    }
28827
28828  } catch (e) {
28829    console.error("Translation trigger failed:", e);
28830  }
28831}
28832
28833
28834
28835
28836
28837  /* =========  Popup Open / Close  ========= */
28838  const popupLang = document.getElementById("langCurrencyPopup");
28839
28840  function openLangPopup() {
28841      
28842    if (!popupLang) {
28843      console.error("❌ Popup element #langCurrencyPopup not found!");
28844      return;
28845    }
28846    console.log("⚙️ Opening popup...");
28847
28848    loadLanguages(localStorage.getItem("userLang") || "en-IN");
28849    loadCurrencies(localStorage.getItem("userCurrency") || "INR");
28850    popupLang.style.display = "flex";
28851    document.body.classList.add("overflow-hidden");
28852    console.log("🎉 Popup opened successfully!");
28853    document.querySelector(".blog-side-menu").classList.remove("blog-side-menu-show");
28854  }
28855
28856  document.getElementById("popupClose").addEventListener("click", () => {
28857    popupLang.style.display = "none";
28858    document.body.classList.remove("overflow-hidden");
28859  });
28860
28861  /* =========  Tab Switching  ========= */
28862  document.querySelectorAll(".tabs .tab").forEach(tab => {
28863    tab.addEventListener("click", () => {
28864      document.querySelectorAll(".tabs .tab").forEach(t => t.classList.remove("active"));
28865      document.querySelectorAll(".tab-content").forEach(c => c.classList.remove("active"));
28866      tab.classList.add("active");
28867      document.getElementById("tab-" + tab.dataset.tab).classList.add("active");
28868    });
28869  });
28870/* =========  Languages & Currencies Data (Localized Country Names)  ========= */
28871const languages = [
28872  // English Variants
28873  { code: "en-US", language: "English", country: "United States" },
28874  { code: "en-IN", language: "English", country: "India" },
28875  { code: "en-AU", language: "English", country: "Australia" },
28876  { code: "en-CA", language: "English", country: "Canada" },
28877  { code: "en-GB", language: "English", country: "United Kingdom" },
28878  { code: "en-SG", language: "English", country: "Singapore" },
28879  { code: "en-IE", language: "English", country: "Ireland" },
28880  { code: "en-NZ", language: "English", country: "New Zealand" },
28881
28882  // Indian Languages (localized)
28883  { code: "hi", language: "हिन्दी", country: "भारत" },
28884  { code: "ta", language: "தமிழ்", country: "இந்தியா" },
28885  { code: "te", language: "తెలుగు", country: "భారతదేశం" },
28886  { code: "bn", language: "বাংলা", country: "ভারত" },
28887  { code: "mr", language: "मराठी", country: "भारत" },
28888  { code: "kn", language: "ಕನ್ನಡ", country: "ಭಾರತ" },
28889  { code: "gu", language: "ગુજરાતી", country: "ભારત" },
28890  { code: "pa", language: "ਪੰਜਾਬੀ", country: "ਭਾਰਤ" },
28891  { code: "ml", language: "മലയാളം", country: "ഇന്ത്യ" },
28892  { code: "ur", language: "اردو", country: "پاکستان / بھارت" },
28893  { code: "or", language: "ଓଡ଼ିଆ", country: "ଭାରତ" },
28894  { code: "as", language: "অসমীয়া", country: "ভাৰত" },
28895
28896  // Spanish Variants
28897  { code: "es-ES", language: "Español", country: "España" },
28898  { code: "es-MX", language: "Español", country: "México" },
28899  { code: "es-AR", language: "Español", country: "Argentina" },
28900  { code: "es-CO", language: "Español", country: "Colombia" },
28901  { code: "es-CL", language: "Español", country: "Chile" },
28902  { code: "es-PE", language: "Español", country: "Perú" },
28903  { code: "es-US", language: "Español", country: "Estados Unidos" },
28904
28905  // French Variants
28906  { code: "fr-FR", language: "Français", country: "France" },
28907  { code: "fr-CA", language: "Français", country: "Canada" },
28908  { code: "fr-BE", language: "Français", country: "Belgique" },
28909  { code: "fr-CH", language: "Français", country: "Suisse" },
28910  { code: "fr-LU", language: "Français", country: "Luxembourg" },
28911
28912  // German Variants
28913  { code: "de-DE", language: "Deutsch", country: "Deutschland" },
28914  { code: "de-AT", language: "Deutsch", country: "Österreich" },
28915  { code: "de-CH", language: "Deutsch", country: "Schweiz" },
28916
28917  // Portuguese
28918  { code: "pt-PT", language: "Português", country: "Portugal" },
28919  { code: "pt-BR", language: "Português", country: "Brasil" },
28920
28921  // Chinese Variants
28922  { code: "zh-CN", language: "简体中文", country: "中国" },
28923  { code: "zh-TW", language: "繁體中文", country: "台灣" },
28924  { code: "zh-HK", language: "繁體中文", country: "香港" },
28925
28926  // Other Major Languages
28927  { code: "ja", language: "日本語", country: "日本" },
28928  { code: "ko", language: "한국어", country: "대한민국" },
28929  { code: "ru", language: "Русский", country: "Россия" },
28930  { code: "uk", language: "Українська", country: "Україна" },
28931  { code: "it", language: "Italiano", country: "Italia" },
28932  { code: "nl", language: "Nederlands", country: "Nederland" },
28933  { code: "sv", language: "Svenska", country: "Sverige" },
28934  { code: "da", language: "Dansk", country: "Danmark" },
28935  { code: "fi", language: "Suomi", country: "Suomi" },
28936  { code: "no", language: "Norsk", country: "Norge" },
28937  { code: "tr", language: "Türkçe", country: "Türkiye" },
28938  { code: "el", language: "Ελληνικά", country: "Ελλάδα" },
28939  { code: "pl", language: "Polski", country: "Polska" },
28940  { code: "cs", language: "Čeština", country: "Česká republika" },
28941  { code: "ro", language: "Română", country: "România" },
28942  { code: "hu", language: "Magyar", country: "Magyarország" },
28943  { code: "bg", language: "Български", country: "България" },
28944  { code: "sr", language: "Српски", country: "Србија" },
28945  { code: "hr", language: "Hrvatski", country: "Hrvatska" },
28946  { code: "he", language: "עברית", country: "ישראל" },
28947  { code: "ar", language: "العربية", country: "السعودية" },
28948  { code: "fa", language: "فارسی", country: "ایران" },
28949  { code: "th", language: "ไทย", country: "ประเทศไทย" },
28950  { code: "vi", language: "Tiếng Việt", country: "Việt Nam" },
28951  { code: "id", language: "Bahasa Indonesia", country: "Indonesia" },
28952  { code: "ms", language: "Bahasa Melayu", country: "Malaysia" },
28953  { code: "fil", language: "Filipino", country: "Pilipinas" },
28954  { code: "sw", language: "Kiswahili", country: "Kenya" }
28955];
28956
28957
28958  function loadLanguages(selected) {
28959    const container = document.getElementById("allLanguagesContainer");
28960    container.innerHTML = "";
28961    languages.forEach(lang => {
28962      const btn = document.createElement("button");
28963      btn.className = "language-option";
28964      btn.innerHTML = `<div class="lang-main">${lang.language}</div><div class="lang-sub">${lang.country}</div>`;
28965      if (selected === lang.code) btn.classList.add("active");
28966      btn.onclick = () => {
28967        document.querySelectorAll(".language-option").forEach(b => b.classList.remove("active"));
28968        btn.classList.add("active");
28969        triggerGoogleTranslate(lang.code);
28970      };
28971      container.appendChild(btn);
28972    });
28973  }
28974
28975  /* =========  Currencies  ========= */
28976  const currencies = ["USD","EUR","GBP","JPY","AUD","CAD","INR","CNY","BRL","SGD"];
28977  function loadCurrencies(selected) {
28978    const container = document.getElementById("allCurrencies");
28979    container.innerHTML = "";
28980    currencies.forEach(cur => {
28981      const b = document.createElement("button");
28982      b.textContent = cur;
28983      if (selected === cur) b.classList.add("active");
28984      b.onclick = () => {
28985        document.querySelectorAll("#allCurrencies button").forEach(bb => bb.classList.remove("active"));
28986        b.classList.add("active");
28987        localStorage.setItem("userCurrency", cur);
28988        console.log("💰 Currency set:", cur);
28989        popupLang.style.display = "none";
28990      };
28991      container.appendChild(b);
28992    });
28993  }
28994
28995  /* =========  Restore saved language on load  ========= */
28996  window.addEventListener("load", () => {
28997    const saved = localStorage.getItem("userLang");
28998    if (saved) setTimeout(() => triggerGoogleTranslate(saved), 2000);
28999  });
29000</script>
29000
29001
29002<!-- Load Google Translate script -->
29003<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
29003
29004
29005</body>
29006</html>      

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.