(function () {

    TRAVEL.ProductHitListElement = function (target) {

        var assets = TRAVEL.Assets.ProductList;

        var detailsAjaxLink = baseUrl + 'ajaxCommand.service?command=travel.MoreInfoProviderCommand';
        var bookAjaxLink = baseUrl + 'ajaxCommand.service?command=travel.JSONBookingModelProvider';
        var ajaxReviewProvider = baseUrl + 'ajaxCommand.service?command=travel.command.JSONReviewProvider';

        var self;
        var root;
        var data;

        var element;

        this.create = function (model) {

            data = model;

            var arr = [
                '<div class="item clearer">',
                    '<div class="item-wrapper">',
                        '<div class="item-body"><div class="item-min-height">',
                            '<div class="item-info">',
                                '<h2 class="item-name"><a href="', model.link,'">', model.name ,'</a></h2>',
                                '<div class="item-location">',
                                    '<a href="', model.producerlink,'"><strong>', model.producer,'</strong></a>, <a href="', model.citylink,'">', model.city,'</a>',
                                '</div>',
                            '</div>',
                            '<div class="item-description">', model.desc.replace(/&amp;/, '&'), '</div>',
                            '<div class="item-price">',
                                '<span>', assets.averageprice, ':</span>',
                                '<span class="price">', TRAVEL.formatMoney(model.avgprice, true, true), '</span>',
                            '</div>',
                            '<div class="panel">',
                                '<div class="item-restriction">',
                                    '<table><tbody><tr>',
                                        '<td class="time" title="', assets.duration, '"><div class="wrap"></div></td>',
                                        '<td class="person" title="', assets.peoplegroupboundaries, '"><div class="wrap"></div></td>',
                                    '</tr></tbody></table>',
                                '</div>',
                            '</div>',
                            '<ul class="tabs">',
                                '<li class="rating-holder"><span>',
                                    '<div class="item-rating readonly"></div>',
                                '</span></li>',
                                '<li><span>', assets.details, '</span></li>',
                                '<li><span>', assets.impressions, '</span></li>',
                                '<li><span>', assets.book, '</span></li>',
                            '</ul>',
                        '</div></div>',
                    '</div>',
                    '<div class="item-image">',
                        '<a href="', model.link, '">',
                            '<img src="', model.picSrc, '" alt="', model.name.replace(), '" />',
                        '</a>',
                    '</div>',
                    '<div class="item-open">', '</div>',
                '</div>'
            ];

            element = $(arr.join(''));

            var divDescription = $('div.item-description', element);
            var divRating = $('div.item-rating', element);
            var ulTabs = $('ul.tabs', element);
            var divInfo = $('div.item-open', element).get(0);

            var tdDuration = $('div.item-restriction td.time', element).get(0);
            var tdPersons = $('div.item-restriction td.person', element).get(0);

            if (model.duration != undefined) {
                tdDuration.firstChild.innerHTML = model.duration;
            } else {
                $(tdDuration).addClass("hidden");
            }

            if (model.minPersons != undefined && model.maxPersons != undefined) {
                tdPersons.firstChild.innerHTML = (model.minPersons == model.maxPersons) ? model.minPersons : (model.minPersons + "&ndash;" + model.maxPersons);
            } else {
                $(tdPersons).addClass("hidden");
            }

            $('li:not(.disabled):not(.rating-holder)', ulTabs).each(function (index) {
                var callbacks = [
                        // details hook
                        function () {
                            $.get(detailsAjaxLink, 'sp=' + model.id + '&sp=prdct',
                                function(responseText) {
                                    var jsonExpression = "(" + responseText + ")";
                                    var model = eval(jsonExpression);

                                    $(divInfo).empty();
                                    divInfo.style.display = "block";
                                    var details = new TRAVEL.ProductDetails(divInfo);
                                    details.create(model.description, data.link);
                                }
                            );
                        },
                        // impressions hook
                        function () {
                            TRAVEL.getJSON(ajaxReviewProvider, {'position': 0, 'entity': {'type': 'prdct', 'id': model.id}}, function (json) {
                                    $(divInfo).empty();
                                    divInfo.style.display = "block";
                                    var impressions = new TRAVEL.ProductImpressions(divInfo);
                                    impressions.create(json);
                                }
                            );
                        },
                        // booking hook
                        function () {
                            var liBook = this;
                            $.get(bookAjaxLink, 'sp=prdct&sp='+model.id,
                                function(responseText) {
                                    var jsonExpression = "(" + responseText + ")";
                                    var model = eval(jsonExpression);

                                    $(divInfo).empty();
                                    divInfo.style.display = "block";
                                    var book = new TRAVEL.Booking(
                                        $('<div class="item-open-headline"></div>').appendTo(divInfo).get(0)
                                    );
                                    book.create(model, true);
                                    book.attachObserver("onFoldUpClick", function () {
                                        $(liBook).click();
                                    });
                                }
                            );
                        }
                ];

                $(this).click(function () {
                    if ($(this).hasClass('selected')) {
                        $(this).removeClass('selected');
                        $(element).removeClass('open');
                        divInfo.style.display = "none";
                    } else {
                        $(this).addClass('selected').siblings().removeClass('selected');
                        $(element).addClass("open");
                        if (callbacks[index] instanceof Function) {
                            callbacks[index].apply(this);
                        }
                    }
                });

            });

            $(divRating).starrating( { value: model.rating, voters: model.voters } );

            $(root).append(element);
        }

        self = this;
        root = target;

        TRAVEL.Observable2(this);
    };
})();

(function () {

    TRAVEL.ProductDetails = function (target) {
        var self = this;
        var root = target;

        this.create = function (description, link) {
            var arr = [
                '<div class="item-open-headline">',
                    '<div class="item-open-bush">', TRAVEL.para(description),
                        // '<div class="readmore txr"><a href="', link, '">Read more info</a></div>',
                    '</div>',
                '</div>'
            ];
            $(root).append(arr.join(''));
        }
    };

    TRAVEL.ProductImpressions = function (target) {

        var assets = TRAVEL.Assets.ProductList;

        var self = this;
        var root = target;

        this.create = function (model) {
            var obj = [];

            obj.push('<div class="item-open-headline"><div class="item-open-bush">');
            if (model.review) {
                obj.push('<div class="review">',
                            '<h3>',
                                '<a href="', model.link || '#', '">',
                                    model.title,
                                '</a>',
                            '</h3>',
                            TRAVEL.para(model.review || ''),
                        '</div>');
            } else {
                obj.push(TRAVEL.para(assets.noimpressions));
            }
            obj.push('</div></div>');
            $(root).append(obj.join(''));
        };
    };
})();