Skip to content

Commit f226019

Browse files
peterdotjspeterdotjs
committed
Added promo modal
1 parent b9ca9ae commit f226019

File tree

7 files changed

+195
-7
lines changed

7 files changed

+195
-7
lines changed

‎css/index.css‎

Lines changed: 116 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎css/style.less‎

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -631,7 +631,7 @@ button.disabled {
631631

632632
}
633633

634-
#update-modal {
634+
.info-modal.modal-box {
635635
display: none;
636636
.modal-body {
637637
width: 450px;
@@ -684,6 +684,7 @@ button.disabled {
684684
}
685685

686686
a {
687+
color: #0181eb;
687688
&:visited {
688689
color: #0181eb;
689690
}
@@ -706,6 +707,12 @@ button.disabled {
706707
}
707708
}
708709

710+
#promo-modal {
711+
.modal-body .header-title-wrap .icon-48 {
712+
background: url('../images/icons/promo/icon48.png');
713+
}
714+
}
715+
709716
body.update {
710717
#update-modal {
711718
display: block;
@@ -715,6 +722,15 @@ body.update {
715722
}
716723
}
717724

725+
body.promo {
726+
#promo-modal {
727+
display: block;
728+
}
729+
.main-view {
730+
min-height: 500px;
731+
}
732+
}
733+
718734
body {
719735
&.align-right {
720736
.tab-layer {

‎images/icons/promo/icon48.png‎

1.78 KB
Loading

‎index.html‎

Lines changed: 35 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@
101101
</div>
102102
</div>
103103

104-
<div id="update-modal" class="modal-box">
104+
<div id="update-modal" class="modal-box info-modal">
105105
<div class="modal-body">
106106
<div class="header-title-wrap">
107107
<div class="icon-48"></div>
@@ -128,13 +128,45 @@
128128
</li>
129129
</ul>
130130
<div class="update-list-footer bold">
131-
You can checkout the <a target="_blank" href="http://youtu.be/GFHl98nAV04">video demo</a> for a more detailed description.
131+
You can checkout the <a target="_blank" href="https://www.youtube.com/watch?v=GFHl98nAV04" title="https://www.youtube.com/watch?v=GFHl98nAV04">video demo</a> for a more detailed description.
132132
</div>
133-
<div class="additional-message bold">If you like the extension and find it useful please show your support by rating it in the <a target="_blank" href="https://chrome.google.com/webstore/detail/tab-resize-split-screen-l/bkpenclhmiealbebdopglffmfdiilejc/reviews">web store</a>. Thanks! -Peter</div>
133+
<div class="additional-message bold">If you like the extension and find it useful please show your support by rating it in the <a target="_blank" href="https://chrome.google.com/webstore/detail/tab-resize-split-screen-l/bkpenclhmiealbebdopglffmfdiilejc/reviews" title="https://chrome.google.com/webstore/detail/tab-resize-split-screen-l/bkpenclhmiealbebdopglffmfdiilejc/reviews">web store</a>. Thanks! -Peter</div>
134134
</div>
135135
<div class="modal-footer">
136136
<button class="button primary" id="update-apply">Lets go!</button>
137137
</div>
138138
</div>
139+
140+
<div id="promo-modal" class="modal-box info-modal">
141+
<div class="modal-body">
142+
<div class="header-title-wrap">
143+
<div class="icon-48"></div>
144+
<div class="header-title">
145+
Quick Find for Google Chrome&#0153;
146+
</div>
147+
</div>
148+
<div class="update-list-header">Hey, I just finished building another Chrome extension and thought you might want to check it out.</div>
149+
<div class="update-list-header">Features:</div>
150+
<ul class="update-list">
151+
<li class="update-entry">
152+
<strong>Port of Firefox Quick Find features + awesome new ones.</strong>
153+
</li>
154+
<li class="update-entry">
155+
Search results in one location. Navigate to links in just a few keystrokes.
156+
</li>
157+
<li class="update-entry">
158+
Case match, link search, highlight all toggle, highlight and then search.
159+
</li>
160+
</ul>
161+
<div class="update-list-footer bold">
162+
You can checkout the <a target="_blank" href="https://www.youtube.com/watch?v=x2PEyTyJ6iM" title="https://www.youtube.com/watch?v=x2PEyTyJ6iM">video demo</a> or <a target="_blank" href="https://chrome.google.com/webstore/detail/quick-find-for-google-chr/dejblhmebonldngnmeidliaifgiagcjj" title="https://chrome.google.com/webstore/detail/quick-find-for-google-chr/dejblhmebonldngnmeidliaifgiagcjj">Chrome store page</a> for a more detailed description.
163+
</div>
164+
<div class="additional-message bold">Hope you find it as useful as Tab Resize! Thanks! -Peter</div>
165+
</div>
166+
<div class="modal-footer">
167+
<button class="button primary" id="promo-apply">Close</button>
168+
</div>
169+
</div>
170+
139171
</body>
140172
</html>

‎js/main.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -130,6 +130,8 @@
130130
}
131131
}).on('click','#update-apply',function(){
132132
options.hideUpdateModal();
133+
}).on('click','#promo-apply',function(){
134+
options.hidePromoModal();
133135
}).on('click','.signature a',function(){
134136
if($(this).hasClass('rate-it')){
135137
sendTracking('info-links','rate-it');

‎js/main_view.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,12 @@
9191
$body.addClass('update');
9292
resize.options.showUpdateModal();
9393
}
94+
95+
if(localStorage.getItem('update-seen') && updateCount === resize.badgeLimit && !localStorage.getItem('promo-seen')){
96+
var $body = $('body');
97+
$body.addClass('promo');
98+
resize.options.showPromoModal();
99+
}
94100
},
95101

96102
/**

‎js/options.js‎

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@
164164
},
165165

166166
/**
167-
* hides the default layout confirmation modal box
167+
* hides the update modal box
168168
*/
169169
hideUpdateModal: function() {
170170
$('body').removeClass('update');
@@ -173,11 +173,28 @@
173173
},
174174

175175
/**
176-
* shows the default layout confirmation modal box
176+
* shows the update modal box
177177
*/
178178
showUpdateModal: function() {
179179
$('#update-modal').trigger('show');
180180
$('.main-view').addClass('inactive');
181+
},
182+
183+
/**
184+
* hides the promo modal box
185+
*/
186+
hidePromoModal: function() {
187+
$('body').removeClass('promo');
188+
$('.main-view').removeClass('inactive');
189+
localStorage.setItem('promo-seen',true);
190+
},
191+
192+
/**
193+
* shows the promo modal box
194+
*/
195+
showPromoModal: function() {
196+
$('#promo-modal').trigger('show');
197+
$('.main-view').addClass('inactive');
181198
}
182199

183200
};

0 commit comments

Comments
 (0)