1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
|
var GalleryView = View.extend({
el: "#gallery",
template: $("#gallery .template").html(),
events: {
// "click .left": "prev",
// "click .right": "next",
// "touchstart .gallery": "touchstart",
// "touchmove .gallery": "touchmove",
// "touchend .gallery": "touchend",
},
initialize: function(){
this.$(".template").remove()
},
reset: function(){
this.gallery && this.gallery.destroy()
this.$el.empty()
},
populate: function(code, image_ids){
var valid_styles = {}
image_ids.forEach(function(id){
if (id.indexOf("_") == -1) return
var partz = id.split("_")
var size = parseInt(partz[0]), style = partz[1]
if (size > 13) return;
if (! valid_styles[style] || valid_styles[style] < size) {
valid_styles[style] = size
}
})
Object.keys(valid_styles).sort(sort_image_styles).forEach(function(style){
var id = valid_styles[style] + "_" + style
var t = this.template.replace(/{{image}}/, sdk.image(code, id))
this.$el.append(t)
}.bind(this))
this.gallery = new Flickity( "#gallery", {
selector: '.item',
cellAlign: 'center',
autoPlay: false,
freeScroll: false,
wrapAround: true,
imagesLoaded: true,
prevNextButtons: false,
pageDots: false,
contain: true,
draggable: true,
})
},
touchstart: function(e){
},
touchmove: function(e){
},
touchend: function(e){
},
})
var YOOX_IMAGE_STYLE_ORDER = "ZZZ d f".split(" ")
function sort_image_styles (b,a){ return (YOOX_IMAGE_STYLE_ORDER.indexOf(a)) - (YOOX_IMAGE_STYLE_ORDER.indexOf(b)) }
|
