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

Commit 5253438

Browse files
jjeffryesjjeffryes
committed
Fixes issues with store categories.
- changes code so the item list re-renders when a category is selected - filters the collection on render by the category, so counts are accurate - cleans up category selection code in the userPage view
1 parent 4195d8d commit 5253438

File tree

2 files changed

+60
-41
lines changed

2 files changed

+60
-41
lines changed

‎js/views/itemListVw.js‎

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -38,10 +38,16 @@ module.exports = baseVw.extend({
3838

3939
render: function(){
4040
var self = this;
41-
//clear the list
41+
// clear the list
4242
this.$el.empty();
43-
if (this.itemsShort.models.length > 0) {
44-
this.renderItemSet(this.nextToShow, this.showPerScroll);
43+
// create list based on category each time this is rendered
44+
if(this.category !== 'all') {
45+
this.categorizedItems = this.itemsShort.where({category: this.category})
46+
} else {
47+
this.categorizedItems = this.itemsShort.models;
48+
}
49+
if (this.categorizedItems.length > 0) {
50+
this.renderItemSet(0, this.showPerScroll);
4551
} else {
4652
self.renderNoneFound();
4753
}
@@ -51,16 +57,16 @@ module.exports = baseVw.extend({
5157
renderItemSet: function(start, end){
5258
let renderSet = [];
5359

54-
if (start >= this.itemsShort.models.length) return;
60+
if (start >= this.categorizedItems.length) return;
5561

56-
renderSet = __.filter(this.itemsShort.models, function(value, index){
62+
renderSet = __.filter(this.categorizedItems, function(value, index){
5763
return (index >= start) && (index < end);
5864
});
5965

6066
__.each(renderSet, (item) => {
6167
if (item.toJSON().category == this.category || this.category == "all") {
6268
this.renderContract(item);
63-
}
69+
}
6470
}, this);
6571

6672
this.nextToShow = end;

‎js/views/userPageVw.js‎

Lines changed: 48 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -303,10 +303,16 @@ UserPageVw = pageVw.extend({
303303
model.set('headerURL', self.options.userModel.get('serverUrl') + "get_image?hash=" + model.get('profile').header_hash + "&guid=" + self.pageID);
304304
model.set('avatarURL', self.options.userModel.get('serverUrl') + "get_image?hash=" + model.get('profile').avatar_hash + "&guid=" + self.pageID);
305305
}
306+
306307
// Cache user avatar in localStorage
307308
var profile = model.toJSON().profile;
308309
window.localStorage.setItem("avatar_" + self.pageID, profile.avatar_hash);
309310

311+
if (response.profile.website) {
312+
var website = profile.website;
313+
self.short_website = self.trimUrl(website);
314+
}
315+
310316
self.model.set({user: self.options.userModel.toJSON(), page: model.toJSON()});
311317
self.model.set({ownPage: self.options.ownPage});
312318
self.render();
@@ -317,6 +323,7 @@ UserPageVw = pageVw.extend({
317323
window.obEventBus.trigger('handleObtained', profile);
318324
app.appBar.setTitle(profile.handle);
319325
}
326+
320327
} else {
321328
//model was returned as a blank object
322329
self.loadingDeferred.reject();
@@ -377,7 +384,8 @@ UserPageVw = pageVw.extend({
377384
self.setCustomStyles();
378385
self.$el.html(loadedTemplate(
379386
__.extend(self.model.toJSON(), {
380-
backToTopTmpl: backToTopTmpl
387+
backToTopTmpl: backToTopTmpl,
388+
short_website: self.short_website
381389
})
382390
));
383391
self.fetchReviews();
@@ -387,6 +395,7 @@ UserPageVw = pageVw.extend({
387395
self.setCustomStyles();
388396
self.setState(self.state, self.currentItemHash, { replaceHistory: true });
389397
self.$backToTop = self.$('.backToTop');
398+
self.$categorySelect = self.$('.js-categories');
390399

391400
//check if user is blocked
392401
if (!self.options.ownPage && isBlocked) {
@@ -590,16 +599,24 @@ UserPageVw = pageVw.extend({
590599
}
591600
},
592601

593-
setCategory: function(category) {
594-
var $select;
602+
setCategorySelect: function(category) {
603+
if (category && this.$categorySelect.val() !== category &&
604+
this.$categorySelect.find('option[value="' + category + '"]').length) {
605+
this.$categorySelect.val(category);
606+
}
607+
this.showCategory(category);
608+
},
595609

596-
if (category) {
597-
$select = this.$el.find('.js-categories');
610+
categoryChanged: function() {
611+
this.showCategory(this.$categorySelect.val());
612+
},
598613

599-
if ($select.val() !== category && $select.find('option[value="' + category + '"]').length) {
600-
$select.val(category);
601-
this.categoryChanged();
602-
}
614+
showCategory: function(category) {
615+
if (this.itemList) {
616+
this.itemList.category = category;
617+
this.itemList.render();
618+
} else {
619+
this.renderItems(this.cachedListings);
603620
}
604621
},
605622

@@ -619,10 +636,6 @@ UserPageVw = pageVw.extend({
619636
}
620637
},
621638

622-
categoryChanged: function() {
623-
this.renderItems(this.listings.get('listings'));
624-
},
625-
626639
toggleFollowButtons: function(followed) {
627640
var followBtn = this.$('.js-follow'),
628641
unfollowBtn = this.$('.js-unfollow');
@@ -839,7 +852,6 @@ UserPageVw = pageVw.extend({
839852

840853
renderItems: function (model, skipNSFWmodal) {
841854
var self = this,
842-
select = this.$el.find('.js-categories'),
843855
selectOptions = [],
844856
addressCountries = self.options.userModel.get('shipping_addresses').map(function(address){
845857
return address.country;
@@ -849,38 +861,38 @@ UserPageVw = pageVw.extend({
849861
addressCountries.push(userCountry);
850862
skipNSFWmodal = skipNSFWmodal || this.skipNSFWmodal;
851863
model = model || [];
852-
__.each(model, function (arrayItem) {
864+
__.each(model, (arrayItem) => {
853865

854-
if (!self.showNSFWContent && !self.showNSFW &&!skipNSFWmodal && arrayItem.nsfw){
866+
if (!this.showNSFWContent && !this.showNSFW &&!skipNSFWmodal && arrayItem.nsfw){
855867
arrayItem.cloak = true;
856868
} else {
857869
arrayItem.cloak = false;
858870
}
859-
arrayItem.userCurrencyCode = self.options.userModel.get('currency_code');
860-
arrayItem.serverUrl = self.options.userModel.get('serverUrl');
871+
arrayItem.userCurrencyCode = this.options.userModel.get('currency_code');
872+
arrayItem.serverUrl = this.options.userModel.get('serverUrl');
861873
arrayItem.showAvatar = false;
862-
arrayItem.avatar_hash = self.model.get('page').profile.avatar_hash;
863-
arrayItem.handle = self.model.get('page').profile.handle;
864-
arrayItem.userID = self.pageID;
865-
arrayItem.ownPage = self.options.ownPage;
874+
arrayItem.avatar_hash = this.model.get('page').profile.avatar_hash;
875+
arrayItem.handle = this.model.get('page').profile.handle;
876+
arrayItem.userID = this.pageID;
877+
arrayItem.ownPage = this.options.ownPage;
866878
arrayItem.onUserPage = true;
867879
arrayItem.userCountries = addressCountries;
868880
arrayItem.skipNSFWmodal = skipNSFWmodal;
869-
if (arrayItem.category != "" && self.$el.find('.js-categories option[value="' + arrayItem.category + '"]').length == 0){
881+
if (arrayItem.category != "" && this.$el.find('.js-categories option[value="' + arrayItem.category + '"]').length == 0){
870882
selectOptions[arrayItem.category] = true;
871883
}
872-
if (self.options.ownPage === true){
873-
arrayItem.imageURL = self.options.userModel.get('serverUrl')+"get_image?hash="+arrayItem.thumbnail_hash;
884+
if (this.options.ownPage === true){
885+
arrayItem.imageURL = this.options.userModel.get('serverUrl')+"get_image?hash="+arrayItem.thumbnail_hash;
874886
} else {
875-
arrayItem.imageURL = self.options.userModel.get('serverUrl')+"get_image?hash="+arrayItem.thumbnail_hash+"&guid="+self.pageID;
887+
arrayItem.imageURL = this.options.userModel.get('serverUrl')+"get_image?hash="+arrayItem.thumbnail_hash+"&guid="+this.pageID;
876888
}
877889
});
878890

879-
Object.keys(selectOptions).sort().forEach(function(selectOption) {
891+
Object.keys(selectOptions).sort().forEach((selectOption) => {
880892
var opt = document.createElement('option');
881893
opt.value = selectOption;
882894
opt.innerHTML = selectOption;
883-
select.append(opt);
895+
this.$categorySelect.append(opt);
884896
});
885897

886898
this.itemList = new itemListView({
@@ -889,7 +901,7 @@ UserPageVw = pageVw.extend({
889901
title: window.polyglot.t('NoListings'),
890902
message: "",
891903
userModel: this.options.userModel,
892-
category: this.$el.find('.js-categories').val()
904+
category: this.$categorySelect.val(),
893905
});
894906

895907
this.registerChild(this.itemList);
@@ -1140,16 +1152,11 @@ UserPageVw = pageVw.extend({
11401152
},
11411153

11421154
storeTabClick: function(e) {
1143-
if (this.$el.find('.js-categories').val() != "all"){
1144-
$(".js-categories option[value='all']").attr("selected", "selected");
1145-
this.categoryChanged();
1146-
}
1147-
11481155
this.storeClick(e);
11491156
},
11501157

11511158
storeCatClick: function(e) {
1152-
this.setCategory($(e.target).text());
1159+
this.setCategorySelect($(e.target).text());
11531160
this.storeClick(e);
11541161
},
11551162

@@ -1839,6 +1846,12 @@ UserPageVw = pageVw.extend({
18391846
$('#obContainer').off('scroll', this.onScroll).removeClass('customizeUserPage ');
18401847

18411848
pageVw.prototype.remove.apply(this, arguments);
1849+
},
1850+
1851+
trimUrl: function(url) {
1852+
var parser = document.createElement('a');
1853+
parser.href = url;
1854+
return parser.hostname;
18421855
}
18431856

18441857
});

0 commit comments

Comments
 (0)