/*jslint nomen:true*/ /*global define, window*/ /** * @class jQuery.ui.productUiTopSellerWidget * @author Copyright 2006-2013, epages GmbH, All Rights Reserved * * The top seller widget displays the recently most ordered products of the shop. * * ### Example * HTML: * * <div class="ep-topseller"></div> * * JavaScript: * * $('div.ep-topseller').productUiTopSellerWidget({ * items: [ {'thumbnail': '/WebRoot/Store/Shops/DemoShop/Products/wb_1003111010/wb_1003111010_xs.jpg', 'count': 142, 'name': 'Pathfinder ZG', 'productId': '17161'}, {'thumbnail': 'BUNDLED_PRODUCT_IMAGE', 'count': 140, 'name': 'Black Bear Gemini', 'productId': '17234'}, {'thumbnail': '/WebRoot/Store/Shops/DemoShop/Products/nf_1005104010/nf_1005104010_xs.jpg', 'count': 138, 'name': 'North Face Tadpole 23', 'productId': '17162'}, {'thumbnail': '/WebRoot/Store/Shops/DemoShop/Products/md_49417110/md_49417110_xs.jpg', 'count': 136, 'name': 'Meindl Air Revolution 2.0', 'productId': '17214'} ], viewAction: 'MBO-ViewGeneral', bundleThumbnail: '/WebRoot/Store/Shops/DemoShop/BO/icons/list_ico_s_bundleproducts.png', noImageThumbnail: '/WebRoot/StoreTypes/6.16.2/Store/BO/icons/ico_m_product.png' * }); * * @uses jQuery.ui.widget * @uses ep.ui.dialog * * @chainable * @return {Object} de_epages */ define('de_epages/product/ui/topsellerwidget', [ 'jquery/ui/widget', 'de_epages', '$tmpl!./topsellerwidget', '$tmpl!./topsellerwidget-dialog', '$dict!./topsellerwidget', 'ep/ui/dialog' ], function ($, de_epages, tmplTopSellerWidget, tmplTopSellerWidgetDialog, dict) { 'use strict'; $.widget('ui.productUiTopSellerWidget', { /** * Options to be passed to the widgt on initialzation * * @cfg {Object} options * @cfg {Array} options.items Array of products (should contain thumbnail, count, name and product id) * @cfg {Number} [options.previewItemCount=''] Number of items which should be displayed in the previews * @cfg {String} [options.bundleThumbnail] Path of the thumbnail for bundle products * @cfg {String} [options.noImageThumbnail] Path of the thumbnail if no product image exists */ options: { items: [], previewItemCount: 3, bundleThumbnail: '', noImageThumbnail: '' }, /* * Sets the path and the thumbnail for items, calls the render method and sets the event listener for opening the dialog. * * @since 6.17.0 * @private */ _create: function () { var _this = this, o = this.options, items = o.items; items.forEach(function (item, i) { // Replace the thumbnail placeholders with real URLs if (item.thumbnail === 'BUNDLED_PRODUCT_IMAGE') { items[i].thumbnail = o.bundleThumbnail; } else if (item.thumbnail === 'NO_IMAGE') { items[i].thumbnail = o.noImageThumbnail; } items[i].detailLink = '?ViewAction=' + _this.options.viewAction + '&ObjectID=' + item.productId; }); this._render(items, o.previewItemCount).appendTo(this.element); $(this.element).find('.more-link').click(function () { _this._openDialog(); }); }, /* * Renders the preview template * * @since 6.17.0 * @private */ _render: function (items, previewItemCount) { return tmplTopSellerWidget({ items: items.slice(0, previewItemCount), displayMore: items.length > previewItemCount }).dictParse(dict, true); }, /* * Renders dialog template and creates new instance of ep.ui.dialog * * @since 6.17.0 * @private */ _openDialog: function () { var o, dialog; o = this.options; dialog = tmplTopSellerWidgetDialog({ items: o.items }).dictParse(dict, true); dialog.uiDialog({ width: 415 * Math.ceil(o.items.length / 10), title: o.dialogTitle, modal: true }); }, /** * Empties widget element * * @since 6.17.0 */ destroy: function () { this.element.empty(); this._superApply(arguments); } }); return de_epages; });