Skip to content
This repository was archived by the owner on May 16, 2019. It is now read-only.

Commit c466a63

Browse files
jjeffryesjjeffryes
committed
Update language, move links to support tab in about modal, adjust design, only show social panel to new users after a purchase.
1 parent 98a37ce commit c466a63

File tree

7 files changed

+125
-40
lines changed

7 files changed

+125
-40
lines changed

‎css/obBase.css‎

Lines changed: 59 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -414,6 +414,63 @@ h6, .h6 {
414414
padding: 0;
415415
}
416416

417+
.modal-about .supportWrapper {
418+
display: flex;
419+
height: 220px;
420+
margin: 10px 0 20px 0;
421+
}
422+
423+
.modal-about .socialReminder {
424+
position: static;
425+
width: 50%;
426+
padding: 10px;
427+
opacity: 1;
428+
background: none;
429+
box-shadow: none;
430+
transition: none;
431+
box-sizing: border-box;
432+
height: 100%;
433+
}
434+
435+
.modal-about .supportPayWrapper {
436+
display: flex;
437+
justify-content: center;
438+
align-items: center;
439+
padding: 10px;
440+
width: 50%;
441+
442+
}
443+
444+
.modal-about .socialReminder .socialLinkWrapper {
445+
flex-direction: column;
446+
height: 100%;
447+
}
448+
449+
.modal-about .socialReminder .socialLinkWrapper a {
450+
font-size: 12px;
451+
}
452+
453+
.modal-about .socialReminder .socialLink {
454+
background: #141414;
455+
width: 28px;
456+
height: 28px;
457+
padding: 0;
458+
margin-right: 2px;
459+
display: inline-block;
460+
}
461+
462+
.modal-about .socialReminder .socialLink .socialIcon {
463+
font-size: 14px;
464+
}
465+
466+
.modal-about .socialReminder .socialLink .socialIcon:before {
467+
line-height: 28px;
468+
}
469+
470+
.modal-about .socialTitle {
471+
margin-bottom: 10px;
472+
}
473+
417474
.navMoreButtons {
418475
border-bottom-left-radius: 2px;
419476
border-bottom-right-radius: 2px;
@@ -4881,7 +4938,7 @@ input[type="checkbox"].fieldItem:checked + label .togLabelOff {
48814938
bottom: -150px;
48824939
right: 0;
48834940
z-index: 1;
4884-
width: 398px;
4941+
width: 360px;
48854942
padding: 32px;
48864943
opacity: 0;
48874944
background: #141414;
@@ -4896,7 +4953,7 @@ input[type="checkbox"].fieldItem:checked + label .togLabelOff {
48964953
}
48974954

48984955
.socialReminder .socialTitle {
4899-
margin-bottom: 20px;
4956+
margin-bottom: 16px;
49004957
font-size: 16px;
49014958
}
49024959

‎js/languages/en-US.json‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -603,6 +603,7 @@
603603
"restart": "Restart Application",
604604
"about": "About OpenBazaar",
605605
"support": "Support OpenBazaar",
606+
"share": "Post About OpenBazaar",
606607
"Forward": "Forward",
607608
"Back": "Back",
608609
"newServer": "New Server",
@@ -735,15 +736,15 @@
735736
"title": "OpenBazaar",
736737
"explanationLink": "(%{linkText})",
737738
"explanationLinkText": "<span class='socialInfoLinkInner'>more</span>",
738-
"explanation": "You can grow the OpenBazaar Network on social media! Click below to share a link to OpenBazaar, and help us add more buyers, sellers, products and services.",
739+
"explanation": "Want to see more great buyers and sellers on this worldwide marketplace with no restrictions or fees? Please click below to share a link on social media and invite more people to #TradeFree.",
739740
"disclaimer": "A page will open in your browser with some suggested content. This panel won't appear again after you close it.",
740-
"blurb": "Join%20OpenBazaar%2C%20the%20P2P%20market%20where%20anyone%20anywhere%20can%20sell%20anything!",
741-
"shareTwitter": "Share OB on Twitter",
742-
"shareFacebook": "Share OB on Facebook",
743-
"sharePinterest": "Share OB on Pinterest",
744-
"shareLinkedIn": "Share OB on LinkedIn",
745-
"shareTumblr": "Share OB on Tumblr",
746-
"reminder": "Help Us Grow the OpenBazaar Network"
741+
"blurb": "Buy%20%26%20sell%20whatever%20you%20want%20online%20with%20no%20fees%2C%20no%20middlemen%20and%20no%20restrictions.%20Join%20%40OpenBazaar!",
742+
"shareTwitter": "Post about OB on Twitter",
743+
"shareFacebook": "Post about OB on Facebook",
744+
"sharePinterest": "Post about OB on Pinterest",
745+
"shareLinkedIn": "Post about OB on LinkedIn",
746+
"shareTumblr": "Post about OB on Tumblr",
747+
"reminder": "Help OpenBazaar Grow!"
747748
},
748749
"langChangeRestartTitle": "Restart needed for language change",
749750
"langChangeRestartMessage": "In order for your language change to fully take effect, you must restart the app.",

‎js/start.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -571,6 +571,7 @@ launchOnboarding = function(guidCreating) {
571571
loadProfile('#userPage/' + guid + '/store', true);
572572
startUpLoadingModal.open();
573573
});
574+
localStorage.setItem('firstTime', 'true');
574575
};
575576

576577
// start - server connection and app initialization flow

‎js/templates/aboutModal.html‎

Lines changed: 40 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,47 @@
3838
</div>
3939
<% } else if (ob.tab === 'support') { %>
4040
<div class="modal-section custCol-primary modal-about-section js-externalLinks customThemeScrollbar lineHeight20">
41-
<div class="width100 alignCenter marginBottom12">
42-
<img src="./imgs/donations.png" />
41+
<% var shareURL = "https%3A%2F%2Fopenbazaar.org" %>
42+
<div class="supportWrapper">
43+
<div class="supportPayWrapper">
44+
<img src="./imgs/donations.png" />
45+
</div>
46+
<div class="socialReminder">
47+
<div class="socialLinkWrapper">
48+
<a href="https://twitter.com/intent/tweet/?text=<%= polyglot.t('socialReminder.blurb') %>&url=<%= shareURL %>&hashtags=TradeFree&related=openbazaar%3AOpenBazaar,News%20about%20OpenBazaar">
49+
<span class="socialLink">
50+
<span class="ion-social-twitter socialIcon"></span>
51+
</span>
52+
<%= polyglot.t('socialReminder.shareTwitter') %>
53+
</a>
54+
<a href="https://www.facebook.com/sharer/sharer.php?u=<%= shareURL %>">
55+
<span class="socialLink">
56+
<span class="ion-social-facebook socialIcon"></span>
57+
</span>
58+
<%= polyglot.t('socialReminder.shareFacebook') %>
59+
</a>
60+
<a href=http://pinterest.com/pin/create/button/?url=<%= shareURL %>&description=<%= polyglot.t('socialReminder.blurb') %>">
61+
<span class="socialLink">
62+
<span class="ion-social-pinterest socialIcon"></span>
63+
</span>
64+
<%= polyglot.t('socialReminder.sharePinterest') %>
65+
</a>
66+
<a href="https://www.linkedin.com/shareArticle?mini=true&url=<%= shareURL %>&title=<%= polyglot.t('socialReminder.title') %>&summary=<%= polyglot.t('socialReminder.blurb') %>&source=OpenBazaar">
67+
<span class="socialLink">
68+
<span class="ion-social-linkedin socialIcon"></span>
69+
</span>
70+
<%= polyglot.t('socialReminder.shareLinkedIn') %>
71+
</a>
72+
<a href="http://www.tumblr.com/share/link?url=<%= shareURL %>&name=OpenBazaar&description=<%= polyglot.t('socialReminder.blurb') %>">
73+
<span class="socialLink">
74+
<span class="ion-social-tumblr socialIcon"></span>
75+
</span>
76+
<%= polyglot.t('socialReminder.shareTumblr') %>
77+
</a>
78+
</div>
79+
</div>
4380
</div>
81+
<h2 class="socialTitle txt-center"><%= polyglot.t('socialReminder.reminder') %></h2>
4482
<%= polyglot.t('aboutSection.support') %>
4583
</div>
4684
<% } else if (ob.tab === 'contributors') { %>

‎js/templates/pageNav.html‎

Lines changed: 4 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -70,27 +70,9 @@
7070
<span class="ion-android-favorite fontSize11 marginRight2 textOpacity1"></span>
7171
<%= polyglot.t('nav.support') %>
7272
</a>
73-
<hr/>
74-
<% var shareURL = "https%3A%2F%2Fopenbazaar.org" %>
75-
<a href="https://twitter.com/intent/tweet/?text=<%= polyglot.t('socialReminder.blurb') %>&url=<%= shareURL %>&hashtags=OpenBazaar&related=openbazaar%3AOpenBazaar,News%20about%20OpenBazaar">
76-
<span class="ion-social-twitter fontSize11 marginRight2 textOpacity1"></span>
77-
<%= polyglot.t('socialReminder.shareTwitter') %>
78-
</a>
79-
<a href="https://www.facebook.com/sharer/sharer.php?u=<%= shareURL %>">
80-
<span class="ion-social-facebook fontSize11 marginRight2 textOpacity1"></span>
81-
<%= polyglot.t('socialReminder.shareFacebook') %>
82-
</a>
83-
<a href=http://pinterest.com/pin/create/button/?url=<%= shareURL %>&description=<%= polyglot.t('socialReminder.blurb') %>">
84-
<span class="ion-social-pinterest fontSize11 marginRight2 textOpacity1"></span>
85-
<%= polyglot.t('socialReminder.sharePinterest') %>
86-
</a>
87-
<a href="https://www.linkedin.com/shareArticle?mini=true&url=<%= shareURL %>&title=<%= polyglot.t('socialReminder.title') %>&summary=<%= polyglot.t('socialReminder.blurb') %>&source=OpenBazaar">
88-
<span class="ion-social-linkedin fontSize11 marginRight2 textOpacity1"></span>
89-
<%= polyglot.t('socialReminder.shareLinkedIn') %>
90-
</a>
91-
<a href="http://www.tumblr.com/share/link?url=<%= shareURL %>&name=OpenBazaar&description=<%= polyglot.t('socialReminder.blurb') %>">
92-
<span class="ion-social-tumblr fontSize11 marginRight2 textOpacity1"></span>
93-
<%= polyglot.t('socialReminder.shareTumblr') %>
73+
<a class="js-showSupportModal">
74+
<span class="ion-android-share fontSize11 marginRight2 textOpacity1"></span>
75+
<%= polyglot.t('nav.share') %>
9476
</a>
9577
</div>
9678

@@ -170,7 +152,6 @@ <h3 class="margin0 marginTop25"><%= polyglot.t('Discover') %></h3>
170152
</div>
171153
</div>
172154

173-
<% if (ob.showSocial) { %>
174155
<div class="socialReminder js-socialReminder">
175156
<% var shareURL = "https%3A%2F%2Fopenbazaar.org" %>
176157
<h3 class="socialTitle"><%= polyglot.t('socialReminder.reminder') %>&nbsp;
@@ -182,7 +163,7 @@ <h3 class="socialTitle"><%= polyglot.t('socialReminder.reminder') %>&nbsp;
182163
<p class="socialDisclaimer hide js-socialParagraph"><%= polyglot.t('socialReminder.disclaimer') %></p>
183164
<div class="closeBtn js-socialCloseBtn"><i class="ion-close"></i></div>
184165
<div class="socialLinkWrapper">
185-
<a class="socialLink" href="https://twitter.com/intent/tweet/?text=<%= polyglot.t('socialReminder.blurb') %>&url=<%= shareURL %>&hashtags=OpenBazaar&related=openbazaar%3AOpenBazaar,News%20about%20OpenBazaar">
166+
<a class="socialLink" href="https://twitter.com/intent/tweet/?text=<%= polyglot.t('socialReminder.blurb') %>&url=<%= shareURL %>&hashtags=TradeFree&related=openbazaar%3AOpenBazaar,News%20about%20OpenBazaar">
186167
<span class="ion-social-twitter socialIcon"></span>
187168
</a>
188169
<a class="socialLink" href="https://www.facebook.com/sharer/sharer.php?u=<%= shareURL %>">
@@ -199,4 +180,3 @@ <h3 class="socialTitle"><%= polyglot.t('socialReminder.reminder') %>&nbsp;
199180
</a>
200181
</div>
201182
</div>
202-
<% } %>

‎js/views/buyWizardVw.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -670,6 +670,13 @@ module.exports = baseModal.extend({
670670
var notificationSound = document.createElement('audio');
671671
notificationSound.setAttribute('src', './audio/notification.mp3');
672672
notificationSound.play();
673+
674+
// if this is a new user, show the social sharing panel
675+
if (localStorage.getItem('firstTime') === 'true') {
676+
$('.js-socialReminder').addClass('show');
677+
localStorage.setItem('firstTime', 'false');
678+
}
679+
673680
},
674681

675682
openCountrySelect: function(){

‎js/views/pageNavVw.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,8 @@ module.exports = baseVw.extend({
5858
this.languages = new languagesModel();
5959
this.showDiscIntro = options.showDiscIntro;
6060

61-
this.showSocial = localStorage.getItem('showSocial') !== 'hide';
61+
this.showSocial = localStorage.getItem('showSocial') !== 'hide' &&
62+
localStorage.getItem('firstTime') !== 'true';
6263

6364
this.listenTo(window.obEventBus, "updateProfile", function(){
6465
this.refreshProfile();
@@ -337,7 +338,6 @@ module.exports = baseVw.extend({
337338
self.$el.html(loadedTemplate(
338339
__.extend(self.model.toJSON(), {
339340
connectedServer: connectedServer && connectedServer.toJSON(),
340-
showSocial: self.showSocial,
341341
})
342342
));
343343

@@ -379,6 +379,8 @@ module.exports = baseVw.extend({
379379
self.$statusBar = self.$el.find('.js-navStatusBar');
380380
self.$serverSubmenu = self.$('.js-serverSubmenu');
381381
self.$serverSubmenuTrigger = self.$('.js-serverSubmenuTrigger');
382+
self.$socialReminder = self.$('.js-socialReminder');
383+
self.$socialParagraph = self.$('.js-socialParagraph');
382384

383385
self.suggestionsVw && self.suggestionsVw.remove();
384386
self.suggestionsVw = new SuggestionsVw({
@@ -409,12 +411,11 @@ module.exports = baseVw.extend({
409411
}
410412

411413
if (self.showSocial) {
412-
self.$socialReminder = self.$('.js-socialReminder');
413-
self.$socialParagraph = self.$('.js-socialParagraph');
414414
setTimeout(function() {
415415
self.$socialReminder.addClass('show');
416416
}, 10000);
417417
}
418+
418419
});
419420

420421
return this;

0 commit comments

Comments
 (0)