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

Commit ddc91ce

Browse files
jjeffryesjjeffryes
committed
Make addresses in the buy flow flexible
- same changes as in settings - add styling to deal with very long address strings
1 parent e1e3ffd commit ddc91ce

File tree

4 files changed

+41
-13
lines changed

4 files changed

+41
-13
lines changed

‎css/obBase.css‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4818,6 +4818,16 @@ input[type="checkbox"].fieldItem:checked + label .togLabelOff {
48184818
position: relative;
48194819
}
48204820

4821+
.buyAddressWrapper {
4822+
padding: 15px;
4823+
overflow: hidden;
4824+
}
4825+
4826+
.buyAddressWrapper > div {
4827+
overflow: hidden;
4828+
text-overflow: ellipsis;
4829+
}
4830+
48214831
/*========== utility classes ==========*/
48224832

48234833
/* the #ov1 id is on the HTML tag. It is used to force specificity

‎js/templates/buyAddresses.html‎

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
</div>
1010
</div>
1111
<% _.each(ob.user.shipping_addresses, function(address, i){ %>
12-
<% if(address.city && address.country && address.displayCountry && address.name && address.postal_code && address.state && address.street) { %>
12+
<% if(address.country && address.displayCountry && address.name) { %>
1313
<% if(ob.worldwide || ob.vendor_offer.listing.shipping.shipping_regions.indexOf(address.country) > -1){ %>
1414
<div class="flexRow custCol-primary custCol-border js-buyWizardAddress pad10">
1515
<input type="radio"
@@ -18,9 +18,18 @@
1818
value="<%= i %>" <% if(ob.selected == i){ %>checked<% } %> />
1919
<label for="buyWizardAddress<%= i %>" class="width100 textOpacity1 textSize13px paddingRight5">
2020
<div class="flexRow">
21-
<div class="flexCol-8 padding15">
22-
<div class="row10 txt-unleaded"><strong><%= address.name %></strong></div>
23-
<div class=""><%= address.street %><br/><%= address.city %>, <%= address.state %> <%= address.postal_code %><br/><%= address.displayCountry %></div>
21+
<div class="flexCol-8 buyAddressWrapper">
22+
<div class="row5 txt-unleaded"><strong><%= address.name %></strong></div>
23+
<div>
24+
<%= address.street %>
25+
</div>
26+
<div>
27+
<%= address.city %><% if(address.city && address.state || address.city && address.postal_code) print(",") %>
28+
<%= address.state %> <%= address.postal_code %>
29+
</div>
30+
<div>
31+
<%= address.displayCountry %>
32+
</div>
2433
</div>
2534
<div class="flexCol-4">
2635
<div class="fontWeight500 textOpacity1 textSize14px marginTop25 minWidth120 js-buyWizardAddressSelected ">
@@ -53,15 +62,24 @@
5362
<% });%>
5463

5564
<% _.each(ob.user.shipping_addresses, function(address, i){ %>
56-
<% if(address.city && address.country && address.displayCountry && address.name && address.postal_code && address.state && address.street) { %>
65+
<% if(address.country && address.displayCountry && address.name) { %>
5766
<% if(!ob.worldwide && ob.vendor_offer.listing.shipping.shipping_regions.indexOf(address.country) < 0){ %>
5867
<div class="flexRow custCol-primary custCol-border js-buyWizardAddress disabled2 pad10">
5968
<input type="radio" class="fieldItem" name="address" id="buyWizardAddressDisabled<%= i %>" value="<%= i %>" disabled/>
6069
<label for="buyWizardAddress<%= i %>" class="width100 textOpacity1 textSize13px paddingRight5">
6170
<div class="flexRow">
62-
<div class="flexCol-8 padding15">
63-
<div class="row10 txt-unleaded"><strong><%= address.name %></strong></div>
64-
<div class="txt-unleaded"><%= address.street %><br/><%= address.city %>, <%= address.state %> <%= address.postal_code %><br/><%= address.displayCountry %></div>
71+
<div class="flexCol-8 buyAddressWrapper">
72+
<div class="row5 txt-unleaded"><strong><%= address.name %></strong></div>
73+
<div>
74+
<%= address.street %>
75+
</div>
76+
<div>
77+
<%= address.city %><% if(address.city && address.state || address.city && address.postal_code) print(",") %>
78+
<%= address.state %> <%= address.postal_code %>
79+
</div>
80+
<div>
81+
<%= address.displayCountry %>
82+
</div>
6583
</div>
6684
<div class="flexCol-4">
6785
<div class="fontWeight500 textOpacity1 textSize14px marginTop25 minWidth120">

‎js/templates/buyWizard.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -428,7 +428,7 @@ <h2 class="margin0 marginTop80"><%= polyglot.t('buyFlow.HaveWallet') %></h2>
428428
</div>
429429
</div>
430430
<div class="flexCol-7 custCol-border">
431-
<input type="text" name="new_ship_to_street" class="fieldItem custCol-text" id="buyWizardStreetInput" required/>
431+
<input type="text" name="new_ship_to_street" class="fieldItem custCol-text" id="buyWizardStreetInput"/>
432432
</div>
433433
</div>
434434
<div class="flexRow">
@@ -438,7 +438,7 @@ <h2 class="margin0 marginTop80"><%= polyglot.t('buyFlow.HaveWallet') %></h2>
438438
</div>
439439
</div>
440440
<div class="flexCol-7 custCol-border">
441-
<input type="text" name="new_ship_to_city" class="fieldItem custCol-text" id="buyWizardCityInput" required/>
441+
<input type="text" name="new_ship_to_city" class="fieldItem custCol-text" id="buyWizardCityInput"/>
442442
</div>
443443
</div>
444444
<div class="flexRow">
@@ -448,7 +448,7 @@ <h2 class="margin0 marginTop80"><%= polyglot.t('buyFlow.HaveWallet') %></h2>
448448
</div>
449449
</div>
450450
<div class="flexCol-7 custCol-border">
451-
<input type="text" name="new_ship_to_state" class="fieldItem custCol-text js-buyWizardStateInput" id="buyWizardStateInput" required/>
451+
<input type="text" name="new_ship_to_state" class="fieldItem custCol-text js-buyWizardStateInput" id="buyWizardStateInput"/>
452452
</div>
453453
</div>
454454
<div class="flexRow">
@@ -458,7 +458,7 @@ <h2 class="margin0 marginTop80"><%= polyglot.t('buyFlow.HaveWallet') %></h2>
458458
</div>
459459
</div>
460460
<div class="flexCol-7 custCol-border">
461-
<input type="text" name="new_ship_to_street" class="fieldItem custCol-text js-buyWizardPostalInput" id="buyWizardPostalInput" required/>
461+
<input type="text" name="new_ship_to_street" class="fieldItem custCol-text js-buyWizardPostalInput" id="buyWizardPostalInput"/>
462462
</div>
463463
</div>
464464
<div class="flexRow">

‎js/views/buyWizardVw.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -343,7 +343,7 @@ module.exports = baseModal.extend({
343343
newAddress.country = this.$el.find('#buyWizardCountryInput').val();
344344
newAddress.displayCountry = this.$el.find('#buyWizardCountryInput option:selected').data('name');
345345

346-
if (newAddress.name && newAddress.street && newAddress.city && newAddress.state && newAddress.postal_code && newAddress.country) {
346+
if (newAddress.name && newAddress.country) {
347347
newAddresses.push(JSON.stringify(newAddress));
348348
}
349349

0 commit comments

Comments
 (0)