diff options
| -rwxr-xr-x | StoneIsland/www/css/products.css | 11 | ||||
| -rwxr-xr-x | StoneIsland/www/js/lib/products/CollectionView.js | 45 | ||||
| -rw-r--r-- | StoneIsland/www/js/lib/products/filters/SizeFilter.js | 1 |
3 files changed, 53 insertions, 4 deletions
diff --git a/StoneIsland/www/css/products.css b/StoneIsland/www/css/products.css index 2256d662..dd3c217a 100755 --- a/StoneIsland/www/css/products.css +++ b/StoneIsland/www/css/products.css @@ -108,6 +108,17 @@ max-width:100%; } +.product-group { + margin-top: 28px; + margin-bottom: 18px; + font-weight: bold; + text-align: center; + font-size: 17px; +} +.product-group:first-child { + margin-top: 0; +} + #product::before { content:''; width:100%; diff --git a/StoneIsland/www/js/lib/products/CollectionView.js b/StoneIsland/www/js/lib/products/CollectionView.js index ad98da65..803acc76 100755 --- a/StoneIsland/www/js/lib/products/CollectionView.js +++ b/StoneIsland/www/js/lib/products/CollectionView.js @@ -126,16 +126,53 @@ var CollectionView = ScrollableView.extend({ // } console.log( data.SearchResponseFull.Results.Items.length ) - data.SearchResponseFull.Results.Items.forEach(function(item){ - console.log(">>> ITEM") - this.append(item, is_single_product) - }.bind(this)) + if (app.store.GroupBy === 'size') { + this.groupBySize( data.SearchResponseFull.Results.Items, is_single_product ) + } + else { + this.appendItems( data.SearchResponseFull.Results.Items, is_single_product ) + } this.deferScrollToTop() } this.afterFetchCallback && this.afterFetchCallback() app.collection.deferRefresh() }, + groupBySize: function(items, is_single_product){ + var groups = {} + items.forEach(function(item){ + if (! item.Sizes.length) return + var size = item.Sizes[0] + var id = size['Text'] + if ( ! (id in groups) ) { + groups[id] = { + label: SIZE_LOOKUP[ id ], + items: [], + } + } + groups[id].items.push( item ) + }.bind(this)) + + Object.keys(groups).sort(function(a,b){ + var ao = SIZE_ORDER.indexOf( a ) + var bo = SIZE_ORDER.indexOf( b ) + return ao - bo + }).forEach(function(id){ + var size = groups[id] + var $el = $("<div>") + $el.addClass("product-group") + $el.html( size.label ) + this.$content.append($el) + this.appendItems( size.items, is_single_product ) + }.bind(this)) + }, + + appendItems: function(items, is_single_product){ + items.forEach(function(item){ + this.append(item, is_single_product) + }.bind(this)) + }, + append: function(item, is_single_product){ this.items[ item['Code8'] ] = item var t = this.template.replace(/{{image}}/, sdk.image(item['DefaultCode10'], is_single_product ? '13_f' : '11_f')) diff --git a/StoneIsland/www/js/lib/products/filters/SizeFilter.js b/StoneIsland/www/js/lib/products/filters/SizeFilter.js index 6efcdeec..a009dd15 100644 --- a/StoneIsland/www/js/lib/products/filters/SizeFilter.js +++ b/StoneIsland/www/js/lib/products/filters/SizeFilter.js @@ -19,6 +19,7 @@ var SizeFilter = View.extend({ sizes.sort(function(a,b){ return a.Id - b.Id }) + var cats = sizes.map(function(cat){ return { id: cat.Id, |