/** * 2013/1/5 jsong * search box in header * spell check, suggest * 2013/2/22 jsong * display discount price */ $(function() { var solrURL = "/index.php?route=product/solr_delegate"; if($("#search_box #filter_keyword").length==0) return; // set suggest drop box position var suggest_dropdown_left = $("#search_box #filter_keyword").position().left-($("#suggest_dropdown").width()-$("#search_box #filter_keyword").width()); var suggest_dropdown_top = $("#search_box #filter_keyword").position().top + $("#search_box #filter_keyword").innerHeight(); $("#suggest_dropdown").css({ "top" : suggest_dropdown_top+"px", "left" : suggest_dropdown_left+"px" }).click(function(e){ e.preventDefault(); return false; }); var filter_keyword = $("#search_box #filter_keyword"); var selected_suggest = null; var suggestion_caches = {}; /* * get suggested products */ function suggestHover(resultDiv, suggestion, prod_data) { // click action var click = function(suggestion) { return function() { $("#search_box #filter_keyword").val(suggestion); $("#search_box .search_btn").click(); }; }; var colourHover = function(result, img, url) { return function() { $("img", result).hide(); $('a', result).attr('href', url); img.show(); } } var colourClick = function(url){ return function(){ document.location.href = url; } }; var handler = function(data){ $('div', resultDiv).remove(); suggestion_caches[suggestion] = data; for (var i= data.response.docs.length-1;i>=0;--i) { var doc = data.response.docs[i]; var result = $("
").addClass("result").appendTo(resultDiv); // show image with colour buttons var images = $("
").addClass("images").appendTo(result); if(doc.hasOwnProperty('best_name')){ var img = $("").addClass("p_image").attr({ "width" : 110, "height" : 110, "src" : '/catalog/view/theme/default/image/helpful-information-small.jpg' }).css('cursor', 'pointer').appendTo(images).click(colourClick(doc.best_url)); } // $("").addClass("name_link").html(doc.name).appendTo(result).click(click(doc.product_url)); var titleDIV = $("
").addClass("p_title").appendTo(result); var anchor = $("").addClass("name_link").html(doc.name||doc.best_name).attr("href", ""+(doc.product_url||doc.best_url)).click(function(){ document.location.href = this.href; }).appendTo(titleDIV); if (doc.hasOwnProperty('original_from_price') && doc.hasOwnProperty('from_price') && doc.original_from_price > doc.from_price) { $("

").addClass("price").html("From " + doc.formatted_original_from_price + " "+doc.formatted_from_price+"").appendTo(result); }else if(doc.hasOwnProperty('from_price')) { $("

").addClass("price").html("From " + doc.formatted_from_price).appendTo(result); } var buttons = $("

").addClass("c_buttons").appendTo(result); for (var j = 0, len = doc.display_colour.length; j < len; ++j) { var color_json = doc.display_colour[j]; color_json = color_json.replace(/\t/g, " "); var color_info = $.parseJSON(color_json); var img_url = color_info.image; if (color_info.image.indexOf("?") > 0) { img_url += "&wid=110&hei=110"; } else { img_url += "?wid=110&hei=110"; } var product_url = doc.product_url+'#colour='+color_info.colour_id; var img = $("").addClass("p_image").attr({ "width" : 110, "height" : 110, "src" : img_url }).css('cursor', 'pointer').appendTo(images).click(colourClick(product_url)); if (j > 0) { img.hide(); } var button = $("").addClass("c_button").appendTo(buttons).hover(colourHover(result, img, doc.product_url+'#colour='+color_info.colour_id)).click(colourClick(product_url)); if(j==0) button.css('border','1px solid #bbb'); $("").addClass("c_button_colour").css("background-color", "#"+color_info.colour_rgb).attr("title", color_info.model).appendTo(button).hover(function(){ $(".c_button",$(this).parent().parent()).css('border','1px none'); $(this).parent().css('border','1px solid #bbb'); }); } } // add clear $("
").appendTo(resultDiv); // see more var seeMoreDiv = $("
").addClass("see_more").appendTo(resultDiv); $("see more like this...").appendTo(seeMoreDiv).click(click(suggestion)); }; // already have got results for this suggestion, show it and quite return function(event, type) { var self = $(this); // change the style of suggestions hovered $("#suggest_dropdown #suggestions_list .suggestions").removeClass("suggestions_hover"); $("#suggest_dropdown #suggested_products .product_results").hide(); $(this).parent().addClass("suggestions_hover"); selected_suggest = self.attr('id'); if(type=='keyboard'){ filter_keyword.val($(this).html()); } $("#suggest_dropdown").css('top', $("#search_box #filter_keyword").position().top + $("#search_box #filter_keyword").innerHeight()+'px'); if ($('.result', resultDiv).length >0) { $(resultDiv).show(); return; } if(prod_data){ handler(prod_data); } else{ if(suggestion_caches[suggestion]){ handler(suggestion_caches[suggestion]); } else{ // get product suggestion limit 3 rows $.getJSON(solrURL, {"action":"select", "wt":"json", "q":suggestion, "rows":3, "mm":"2<80%", "qf":"name^10.0 best_terms^100.0"}, handler); } } disappearProducts(); $(resultDiv).show(); } } function disappearProducts(){ $("#suggest_dropdown #suggested_products .product_results").hide(); } function UpAndDownKeyHandler (event) { var cur_suggestion = $("#suggest_dropdown #suggestions_list .suggestions_hover"); switch(event.which){ case 38: //up key $("#suggest_dropdown #suggestions_list .suggestions").removeClass("suggestions_hover"); $("#suggest_dropdown #suggested_products .product_results").hide(); var prev = cur_suggestion.prev(); if(prev.length==0){ $('#suggest_dropdown .suggestions:last p.suggestion').trigger('mouseover',['keyboard']); } else{ $('p.suggestion', prev).trigger('mouseover',['keyboard']); } break; case 40: //down key $("#suggest_dropdown #suggestions_list .suggestions").removeClass("suggestions_hover"); $("#suggest_dropdown #suggested_products .product_results").hide(); var next = cur_suggestion.next(); if(next.length==0){ $('#suggest_dropdown .suggestions:first p.suggestion').trigger('mouseover',['keyboard']); } else{ $('p.suggestion', next).trigger('mouseover',['keyboard']); } break; case 13: event.preventDefault(); if($('#suggest_dropdown').css('display')=='none'){ $('p.suggestion', cur_suggestion).trigger('click'); } else{ $("#search_box .search_btn").click(); } break; default: return false; } return true; } /* * bind focus, keyup event to search input box */ $("#search_box #filter_keyword").bind("focus keyup", function(event) { event.preventDefault(); if(UpAndDownKeyHandler(event)){ return false; } // word inputted var query = $("#search_box #filter_keyword").val(); if(encodeURIComponent(query)=='%C2%A0Enter%20item%20code%20or%20name%20here') return; // click action var click = function(suggestion) { return function() { ($('#suggest_dropdown').css('display')!='none' && $("#search_box #filter_keyword").val(suggestion)); $("#search_box .search_btn").click(); }; }; var buildSuggest = function(data, prod_data){ var suggestions = data.spellcheck.suggestions[1].suggestion; $("#suggest_dropdown #suggestions_list .suggestions").remove(); $("#suggest_dropdown #suggested_products .product_results").remove(); for (var i = 0, len = suggestions.length; i < len; ++i) { var result = $([ '
', '

',suggestions[i],'

', '
' ].join('')).appendTo($("#suggest_dropdown #suggestions_list")); var p = $('p.suggestion',result); // var result = $("
").addClass("suggestions").appendTo($("#suggest_dropdown #suggestions_list")); // var p = $("

").addClass("suggestion").html(suggestions[i]).appendTo(result).attr('id','suggestion_'+i); var product_results = $("

").appendTo($("#suggest_dropdown #suggested_products")); p.mouseover(suggestHover(product_results, suggestions[i], prod_data)); p.click(click(suggestions[i])); } $("#suggest_dropdown").show(); $('#suggest_dropdown .suggestions:first p.suggestion').trigger('mouseover'); }; var requestByModel = function(query){ $.getJSON(solrURL, {"action":"select", "wt":"json", "q":query, "rows":3}, function(data){ if(data && data.response.numFound>0){ buildSuggest({ spellcheck : { suggestions : [ query, { suggestion : [ query ] } ] } }, data); } else{ $("#suggest_dropdown").hide(); } }); }; // get spellcheck result $.getJSON(solrURL, {"action": "suggest", "wt":"json", "spellcheck..q": query, "rows":10}, function (data){ if (!data || !data.spellcheck || data.spellcheck.suggestions.length ==0) { requestByModel(query); return; } buildSuggest(data); }); }).bind("keydown", function(event) { switch(event.which){ case 13: event.preventDefault(); return false; } }); $(document).click(function(e){ $("#suggest_dropdown").hide(); }); });