/* SearchField written by Alen Grakalic, provided by Css Globe (cssglobe.com) please visit http://cssglobe.com/post/1202/style-your-websites-search-field-with-jscss/ for more info */ this.searchfield = function(){ // CONFIG // this is id of the search field you want to add this script to. // You can use your own id just make sure that it matches the search field in your html file. var id = "searchfield"; // Text you want to set as a default value of your search field. var defaultText = "Search by keyword..."; // set to either true or false // when set to true it will generate search suggestions list for search field based on content of variable below var suggestion = true; // static list of suggestion options, separated by comma // replace with your own var suggestionText = " 306BE, 802BE, 803BE, 805BE, 806BE, 808BE, 812BE, EMB1000, EMB1200, EMB8, EMB10, EMB10BP, EMB12, EMB12BP, EMB21, 32AL, 33AL, 43CUBE, 63CUBE, 31CS, 110CS, 62CA6, 62CA8, 62CFX, 62CS, 62CSQ, 110FX-4, 32FX, 33FX, 35FX, 35CSFX, 62FX, 63FX, 64CSFX, 82FX, 83FX, 84CSFX, 110FX, 62ASX, 62UE, 63UE, 66UE, 101ST, 101ST70, 105TS, 121ST, 121ST70, 211ST, 61ST70, 31ODS70, 62ODS70, 103T , 103T70, 101T, 101T70, 109GS70, 129GS70, 1000PTM, 1200PT-1M, 1200PT-2M, 1500PTM, 31CSM, 650PTM, 800PTM, 62CFXM, 62CSM, 32FXM, 110SDXM, 33FXM, 62ASXM, 62CSQM, 42OW, 43OW, 62OW, 63OW, PL39LCR-AL, 1000PT, 1200PT-1, 1200PT-2, 1500PT, QX1010, QX1020, QX320, QX330, QX620, QX630, QX820, QX830, 63SA-4, 63SA-7, 101SA-6, 110SDX, 210SDX, SPL36CS-AL, SPL39LCR-AL, SPL618LCR, SPL67LCR,custom,FX,Marine,BE,CSFX,LCR,SDX,GS,Centergy,ODS,AL,CS,Powerpipe,Amplifiers,m1000,QSC Amplifiers,Technologies,AFDC,Landscape Speakers,Cube,In-wall Speakers,On-wall Speakers,Free-Standing Speakers"; // END CONFIG (do not edit below this line, well unless you really, really want to change something :) ) // Peace, // Alen var field = document.getElementById(id); var classInactive = "sf_inactive"; var classActive = "sf_active"; var classText = "sf_text"; var classSuggestion = "sf_suggestion"; this.safari = ((parseInt(navigator.productSub)>=20020000)&&(navigator.vendor.indexOf("Apple Computer")!=-1)); if(field && !safari){ field.value = defaultText; field.c = field.className; field.className = field.c + " " + classInactive; field.onfocus = function(){ this.className = this.c + " " + classActive; this.value = (this.value == "" || this.value == defaultText) ? "" : this.value; }; field.onblur = function(){ this.className = (this.value != "" && this.value != defaultText) ? this.c + " " + classText : this.c + " " + classInactive; this.value = (this.value != "" && this.value != defaultText) ? this.value : defaultText; clearList(); }; if (suggestion){ var selectedIndex = 0; field.setAttribute("autocomplete", "off"); var div = document.createElement("div"); var list = document.createElement("ul"); list.style.display = "none"; div.className = classSuggestion; list.style.width = field.offsetWidth + "px"; div.appendChild(list); field.parentNode.appendChild(div); field.onkeypress = function(e){ var key = getKeyCode(e); if(key == 13){ // enter selectList(); selectedIndex = 0; return false; }; }; field.onkeyup = function(e){ var key = getKeyCode(e); switch(key){ case 13: return false; break; case 27: // esc field.value = ""; selectedIndex = 0; clearList(); break; case 38: // up navList("up"); break; case 40: // down navList("down"); break; default: startList(); break; }; }; this.startList = function(){ var arr = getListItems(field.value); if(field.value.length > 0){ createList(arr); } else { clearList(); }; }; this.getListItems = function(value){ var arr = new Array(); var src = suggestionText; var src = src.replace(/, /g, ","); var arrSrc = src.split(","); for(i=0;i 0) { for(i=0;i li.length) selectedIndex = 1; navListItem(selectedIndex); }; this.navListItem = function(index){ selectedIndex = index; li = list.getElementsByTagName("li"); for(var i=0;i