productItemLayout.js

require('entities/productDetails/hotelImages');
require('../views/productAllInfo');

var App = require('src/app');
var Backbone = require('backbone');
var Marionette = require('backbone.marionette');

var layoutTemplate = require('../templates/product.hbs');
var Gallery = require('brg-ui-gallery');

var productsCardChannel = Backbone.Wreqr.radio.channel('productsCard');

var ProductItemLayout = Marionette.LayoutView.extend({

    template: layoutTemplate,

    regions: {
        gallery: '[data-region="gallery"]',
        allInfo: '[data-region="all-info"]'
    },

    onRender: function () {
        this.Gallery = Gallery;
        this.showGallery();
        this.showAllInfo();
        this.initCarousel(this.galleryRegion.el);
    },

    showAllInfo: function () {
        var allInfoView = productsCardChannel.reqres.request('new:productsAllInfo:view', this.model);
        var allInfoRegion = this.getRegion('allInfo');
        allInfoRegion.show(allInfoView);
    },

    showGallery: function () {
        var hotelImagesCollection = App.request('new:hotelImagesCollection', this.model.get('images'));
        var galleryView = App.request('new:productGalleryView', hotelImagesCollection);
        this.galleryRegion = this.getRegion('gallery');
        this.galleryRegion.show(galleryView);
    },

    initCarousel: function (target) {
        this.gallery = this.Gallery({
            parentElement: target,
            thumbnails: false,
            defaultImage: 'http://www3.staticroot.com/images/ose/noimage_bkg_4_3.png',
            imgsCache: 2
        });
    }
});

App.reqres.setHandler('new:productItem:layout', function (model) {
    return new ProductItemLayout({ model: model });
});

module.exports = ProductItemLayout;