@@ -15,6 +15,26 @@ const ads = [
1515 url : 'https://play.google.com/store/apps/details?id=com.solothought.wishin' ,
1616 alt : 'Wishin Product'
1717 } ,
18+ {
19+ image : 'https://solothought.com/products/assets/images/wishin/inner-proof.png' ,
20+ url : 'https://play.google.com/store/apps/details?id=com.solothought.wishin' ,
21+ alt : 'Wishin Product'
22+ } ,
23+ {
24+ image : 'https://solothought.com/products/assets/images/wishin/old-habit.png' ,
25+ url : 'https://play.google.com/store/apps/details?id=com.solothought.wishin' ,
26+ alt : 'Wishin Product'
27+ } ,
28+ {
29+ image : 'https://solothought.com/products/assets/images/wishin/reason-for-habit.png' ,
30+ url : 'https://play.google.com/store/apps/details?id=com.solothought.wishin' ,
31+ alt : 'Wishin Product'
32+ } ,
33+ {
34+ image : 'https://solothought.com/products/assets/images/wishin/together-memories-give-strength.png' ,
35+ url : 'https://play.google.com/store/apps/details?id=com.solothought.wishin' ,
36+ alt : 'Wishin Product'
37+ } ,
1838] ;
1939
2040// Function to get random ad
@@ -29,99 +49,117 @@ function shouldShowAd() {
2949 return lastShown !== today ;
3050}
3151
32- // Modified feature popup with ad on the left
33- $ ( function ( ) {
34- const showAd = shouldShowAd ( ) ;
35- const selectedAd = showAd ? getRandomAd ( ) : null ;
36-
37- const adColumn = showAd ? `
38- <div class="col-md-4" style="padding-right: 20px; border-right: 2px solid #eee;">
39- <a href="${ selectedAd . url } " target="_blank" onclick="logAdClick('${ selectedAd . url } ')">
40- <img src="${ selectedAd . image } "
41- alt="${ selectedAd . alt } "
42- style="width: 100%; height: auto; cursor: pointer; border-radius: 8px; margin-top: 10px;" />
43- </a>
44- </div>
45- ` : '' ;
46-
47- const featureColClass = showAd ? 'col-md-8' : 'col-md-12' ;
52+ // Function to show the ad popup
53+ function showAdPopup ( selectedAd , callback ) {
54+ $ . confirm ( {
55+ title : "" ,
56+ content : `
57+ <div style="text-align: center; padding: 20px;">
58+ <a href="${ selectedAd . url } " target="_blank" onclick="logAdClick('${ selectedAd . url } ')">
59+ <img src="${ selectedAd . image } "
60+ alt="${ selectedAd . alt } "
61+ style="max-width: 100%; height: auto; cursor: pointer; border-radius: 8px;" />
62+ </a>
63+ </div>
64+ ` ,
65+ escapeKey : true ,
66+ backgroundDismiss : true ,
67+ useBootstrap : false ,
68+ boxWidth : 600 ,
69+ buttons : {
70+ continue : {
71+ text : "Continue" ,
72+ action : function ( ) {
73+ // Save that ad was shown today
74+ localStorage . setItem ( 'adLastShown' , new Date ( ) . toDateString ( ) ) ;
75+ // Call the callback to show features
76+ callback ( ) ;
77+ } ,
78+ } ,
79+ close : {
80+ text : "Close" ,
81+ action : function ( ) {
82+ // Save that ad was shown today even if closed
83+ localStorage . setItem ( 'adLastShown' , new Date ( ) . toDateString ( ) ) ;
84+ } ,
85+ } ,
86+ } ,
87+ } ) ;
88+ }
4889
90+ // Function to show the features popup
91+ function showFeaturesPopup ( ) {
4992 $ . confirm ( {
5093 title : "" ,
5194 content : `
5295 <div id="featurepopup">
53- <div class="row">
54- ${ adColumn }
55- <div class="${ featureColClass } ">
56- <div class="row text-center">
57- <div class="col-md-4 col-sm-6">
58- <i class="icon-github-circled featureicon" style="font-size: 48px;"></i>
59- <div class="summary" style="font-size: 13px;">
60- Free & Open source
61- <a class="github-button" href="https://github.com/NaturalIntelligence/imglab" data-size="large" data-show-count="true" aria-label="Star NaturalIntelligence/imglab on GitHub">Star</a>
62- </div>
63- </div>
64- <div class="col-md-4 col-sm-6">
65- <i class="icon-user-secret featureicon" style="font-size: 48px;"></i>
66- <div class="summary" style="font-size: 13px;">Your images and data are safe, they are saved locally</div>
67- </div>
68- <div class="col-md-4 col-sm-6">
69- <i class="icon-object-group featureicon" style="font-size: 48px;"></i>
70- <div class="summary" style="font-size: 13px;">Multiple label types: point, circle, boundary box, polygon</div>
96+ <div class="row text-center">
97+ <div class="col-md-4 col-sm-6">
98+ <i class="icon-github-circled featureicon" style="font-size: 48px;"></i>
99+ <div class="summary" style="font-size: 13px;">
100+ Free & Open source
101+ <a class="github-button" href="https://github.com/NaturalIntelligence/imglab" data-size="large" data-show-count="true" aria-label="Star NaturalIntelligence/imglab on GitHub">Star</a>
71102 </div>
72103 </div>
73- <div class="row text-center">
74- <div class="col-md-4 col-sm-6">
75- <i class="icon-mouse-pointer featureicon" style="font-size: 48px;"></i>
76- <div class="summary" style="font-size: 13px;">1 click face landmarking</div>
77- </div>
78- <div class="col-md-4 col-sm-6">
79- <i class="icon-firefox featureicon" style="font-size: 48px;"></i>
80- <div class="summary" style="font-size: 13px;">No installation, works in your browser</div>
81- </div>
82- <div class="col-md-4 col-sm-6">
83- <i class="icon-doc-text featureicon" style="font-size: 48px;"></i>
84- <div class="summary" style="font-size: 13px;">Multiple supported formats: dlib XML, dlib pts, Pascal VOC, COCO ..</div>
85- </div>
104+ <div class="col-md-4 col-sm-6">
105+ <i class="icon-user-secret featureicon" style="font-size: 48px;"></i>
106+ <div class="summary" style="font-size: 13px;">Your images and data are safe, they are saved locally</div>
86107 </div>
87- <div class="row text-center">
88- <div class="col-md-4 col-sm-6">
89- <i class="icon-tags featureicon" style="font-size: 48px;"></i>
90- <div class="summary" style="font-size: 13px;">Multiple label types including name, category, tags</div>
91- </div>
92- <div class="col-md-4 col-sm-6">
93- <i class="icon-emo-thumbsup featureicon" style="font-size: 48px;"></i>
94- <div class="summary" style="font-size: 13px;">Better user experience with features like autofill, hotkeys, cut & paste labels...</div>
95- </div>
96- <div class="col-md-4 col-sm-6">
97- <i class="icon-globe featureicon" style="font-size: 48px;"></i>
98- <div class="summary" style="font-size: 13px;">Trusted by users from 45+ countries</div>
99- </div>
108+ <div class="col-md-4 col-sm-6">
109+ <i class="icon-object-group featureicon" style="font-size: 48px;"></i>
110+ <div class="summary" style="font-size: 13px;">Multiple label types: point, circle, boundary box, polygon</div>
100111 </div>
101- <div class="row text-center">
102- <div class="col-md-4 col-sm-6">
103- <i class="icon-laptop featureicon" style="font-size: 48px;"></i>
104- <div class="summary" style="font-size: 13px;">Basic IDE features: zoom in/out, light, move, image thumbnails, drag ...</div>
105- </div>
106- <div class="col-md-4 col-sm-6">
107- <div class="featureicon">
108- <img src="img/icons/Offline_logo.svg" width="48px" />
109- </div>
110- <div class="summary" style="font-size: 13px;">Works offline</div>
111- </div>
112- <div class="col-md-4 col-sm-6">
113- <i class="icon-picture featureicon" style="font-size: 48px;"></i>
114- <div class="summary" style="font-size: 13px;">0.5 millions images annotated monthly</div>
112+ </div>
113+ <div class="row text-center">
114+ <div class="col-md-4 col-sm-6">
115+ <i class="icon-mouse-pointer featureicon" style="font-size: 48px;"></i>
116+ <div class="summary" style="font-size: 13px;">1 click face landmarking</div>
117+ </div>
118+ <div class="col-md-4 col-sm-6">
119+ <i class="icon-firefox featureicon" style="font-size: 48px;"></i>
120+ <div class="summary" style="font-size: 13px;">No installation, works in your browser</div>
121+ </div>
122+ <div class="col-md-4 col-sm-6">
123+ <i class="icon-doc-text featureicon" style="font-size: 48px;"></i>
124+ <div class="summary" style="font-size: 13px;">Multiple supported formats: dlib XML, dlib pts, Pascal VOC, COCO ..</div>
125+ </div>
126+ </div>
127+ <div class="row text-center">
128+ <div class="col-md-4 col-sm-6">
129+ <i class="icon-tags featureicon" style="font-size: 48px;"></i>
130+ <div class="summary" style="font-size: 13px;">Multiple label types including name, category, tags</div>
131+ </div>
132+ <div class="col-md-4 col-sm-6">
133+ <i class="icon-emo-thumbsup featureicon" style="font-size: 48px;"></i>
134+ <div class="summary" style="font-size: 13px;">Better user experience with features like autofill, hotkeys, cut & paste labels...</div>
135+ </div>
136+ <div class="col-md-4 col-sm-6">
137+ <i class="icon-globe featureicon" style="font-size: 48px;"></i>
138+ <div class="summary" style="font-size: 13px;">Trusted by users from 45+ countries</div>
139+ </div>
140+ </div>
141+ <div class="row text-center">
142+ <div class="col-md-4 col-sm-6">
143+ <i class="icon-laptop featureicon" style="font-size: 48px;"></i>
144+ <div class="summary" style="font-size: 13px;">Basic IDE features: zoom in/out, light, move, image thumbnails, drag ...</div>
145+ </div>
146+ <div class="col-md-4 col-sm-6">
147+ <div class="featureicon">
148+ <img src="img/icons/Offline_logo.svg" width="48px" />
115149 </div>
150+ <div class="summary" style="font-size: 13px;">Works offline</div>
151+ </div>
152+ <div class="col-md-4 col-sm-6">
153+ <i class="icon-picture featureicon" style="font-size: 48px;"></i>
154+ <div class="summary" style="font-size: 13px;">0.5 millions images annotated monthly</div>
116155 </div>
117- </div>
118156 </div>
119157 </div>
120158 ` ,
121159 escapeKey : true ,
122160 backgroundDismiss : true ,
123161 useBootstrap : false ,
124- boxWidth : showAd ? 1100 : 900 ,
162+ boxWidth : 900 ,
125163 buttons : {
126164 confirm : {
127165 text : "Donate" ,
@@ -134,10 +172,19 @@ $(function () {
134172 } ,
135173 } ,
136174 } ) ;
175+ }
176+
177+ // Main initialization - show ad first, then features
178+ $ ( function ( ) {
179+ const showAd = shouldShowAd ( ) ;
137180
138- // Save that ad was shown today
139181 if ( showAd ) {
140- localStorage . setItem ( 'adLastShown' , new Date ( ) . toDateString ( ) ) ;
182+ const selectedAd = getRandomAd ( ) ;
183+ // Show ad first, then features popup
184+ showAdPopup ( selectedAd , showFeaturesPopup ) ;
185+ } else {
186+ // If no ad, just show features
187+ showFeaturesPopup ( ) ;
141188 }
142189} ) ;
143190
@@ -156,10 +203,8 @@ function displayDonationPrompt() {
156203 $ . dialog ( {
157204 title : "Donate" ,
158205 content : `<div style="text-align:center;">
159-
160206 <div><a onclick="javascript:logPaypal()" href="https://paypal.me/naturalintelligence" target="_blank"><img src="img/support_paypal.svg" width="200px"></a></div>
161-
162- <div>` ,
207+ </div>` ,
163208 escapeKey : true ,
164209 backgroundDismiss : true ,
165210 } ) ;
0 commit comments