Home » Source Code » » swato-suggest.js

swato-suggest.js ( File view )

From:
  • By 2010-08-11
  • View(s):5
  • Download(s):0
  • Point(s): 1
			/**
 * Provides suggestions
 * @class
 * @scope public
 */
function Suggestions(suggestions) {

    this.suggestionList = suggestions||[];

}

/**
 * Request suggestions for the given autosuggest control. 
 * @scope protected
 * @param oAutoSuggestControl The autosuggest control to provide suggestions for.
 */
Suggestions.prototype.requestSuggestions = function (oAutoSuggestControl /*:AutoSuggestControl*/,
                                                          bTypeAhead /*:boolean*/,
                                                          showAll /*:boolean*/) {

    var aSuggestions = [];
    var sTextboxValue = oAutoSuggestControl.textbox.value;

    if ( showAll || sTextboxValue.length > 0){

        for (var i=0; i < this.suggestionList.length; i++) {
 
            var suggestionText=this.suggestionList[i].value||this.suggestionList[i];
            if (showAll || suggestionText.indexOf(sTextboxValue) == 0) {

                aSuggestions.push(this.suggestionList[i]);
            
} 
        
}
    
}

    //provide suggestions to the control
    oAutoSuggestControl.autosuggest(aSuggestions, bTypeAhead);

};

/**
 * An autosuggest textbox control.
 * @class
 * @scope public
 */
function AutoSuggestControl(oTextbox /*:HTMLInputElement Name*/) {

    
    /**
     * The currently selected suggestions.
     * @scope private
     */   
    this.cur /*:int*/ = -1;

    /**
     * The dropdown list layer.
     * @scope private
     */
    this.layer = null;
    
    /**
     * Suggestion provider for the autosuggest feature.
     * @scope private.
     */
//    this.provider /*:SuggestionProvider*/ = oProvider;
    
    /**
     * The textbox to capture.
     * @scope private
     */
    this.textbox /*:HTMLInputElement*/ = $(oTextbox);
    
    //initialize the control
//    this.init();
    

}

/**
 * Autosuggests one or more suggestions for what the user has typed.
 * If no suggestions are passed in, then no autosuggest occurs.
 * @scope private
 * @param aSuggestions An array of suggestion strings.
 * @param bTypeAhead If the control should provide a type ahead suggestion.
 */
AutoSuggestControl.prototype.autosuggest = function (aSuggestions /*:Array*/,
                                                     bTypeAhead /*:boolean*/) {

    
    //make sure there's at least one suggestion
    if (aSuggestions.length > 0) {

        if (bTypeAhead) {

           this.typeAhead(aSuggestions[0]);
        
}
        
        this.showSuggestions(aSuggestions);
    
} else {

        this.hideSuggestions();
    
}

};

/**
 * Creates the dropdown layer to display multiple suggestions.
 * @scope private
 */
AutoSuggestControl.prototype.createDropDown = function () {


    var oThis = this;

    //create the layer and assign styles
    this.layer = document.createElement("div");
    this.layer.className = "suggestions";
    this.layer.style.visibility = "hidden";
    this.layer.style.width = this.textbox.offsetWidth+'px';
    
    //when the user clicks on the a suggestion, get the text (innerHTML)
    //and place it into a textbox
    this.layer.onmousedown = 
    this.layer.onmouseup = 
    this.layer.onmouseover = function (oEvent) {

        oEvent = oEvent || window.event;
        oTarget = oEvent.target || oEvent.srcElement;

        if (oEvent.type == "mousedown") {

            oThis.textbox.value = oTarget.firstChild.nodeValue;
            oThis.hideSuggestions();
        
} else if (oEvent.type == "mouseover") {

            oThis.highlightSuggestion(oTarget);
        
} else {

            oThis.textbox.focus();
        
}
    
};
    
    
    document.body.appendChild(this.layer);

};

/**
 * Gets the left coordinate of the textbox.
 * @scope private
 * @return The left coordinate of the textbox in pixels.
 */
AutoSuggestControl.prototype.getLeft = function () /*:int*/ {


    var oNode = this.textbox;
    var iLeft = 0;
    
    while(oNode.tagName != "BODY") {

        iLeft += oNode.offsetLeft;
        oNode = oNode.offsetParent;
    
}
	if(navigator&&navigator.userAgent.toLowerCase().indexOf("msie")==-1){

		return iLeft;
	
}else{

		return iLeft+oNode.offsetLeft;
	
}

};

/**
 * Gets the top coordinate of the textbox.
 * @scope private
 * @return The top coordinate of the textbox in pixels.
 */
AutoSuggestControl.prototype.getTop = function () /*:int*/ {


    var oNode = this.textbox;
    var iTop = 0;
    
    while(oNode.tagName != "BODY") {

        iTop += oNode.offsetTop;
        oNode = oNode.offsetParent;
    
}
	if(navigator&&navigator.userAgent.toLowerCase().indexOf("msie")==-1){

	    return iTop;
	
}else{

		return iTop+oNode.offsetTop;
	
}


};

/**
 * Handles three keydown events.
 * @scope private
 * @param oEvent The event object for the keydown event.
 */
AutoSuggestControl.prototype.handleKeyDown = function (oEvent /*:Event*/) {


    switch(oEvent.keyCode) {

        case 38: //up arrow
            this.previousSuggestion();
            break;
        case 40: //down arrow 
            this.nextSuggestion();
            break;
        case 13: //enter
            this.hideSuggestions();
            break;
    
}


};

/**
 * Handles keyup events.
 * @scope private
 * @param oEvent The event object for the keyup event.
 */
AutoSuggestControl.prototype.handleKeyUp = function (oEvent /*:Event*/) {


    var iKeyCode = oEvent.keyCode;
    //for backspace (8) and Enter(13) and delete (46), shows suggestions without typeahead
    if (iKeyCode == 8 || iKeyCode == 13 || iKeyCode == 46) {

        this.provider.requestSuggestions(this, false);
        
    //make sure not to interfere with non-character keys
    
} else if (iKeyCode < 32 || (iKeyCode >= 33 && iKeyCode < 46) || (iKeyCode >= 112 && iKeyCode <= 123)) {

        //ignore
    
} else {

        //request suggestions from the suggestion provider with typeahead
        this.provider.requestSuggestions(this, true);
    
}

};

/**
 * Handles double-click events.
 * @scope private
 * @param oEvent The event object for the double-click event.
 */
AutoSuggestControl.prototype.handleDblClick = function () {

        this.provider.requestSuggestions(this, true, true);

};

/**
 * Hides the suggestion dropdown.
 * @scope private
 */
AutoSuggestControl.prototype.hideSuggestions = function () {

    this.layer.style.visibility = "hidden";

};

/**
 * Highlights the given node in the suggestions dropdown.
 * @scope private
 * @param oSuggestionNode The node representing a suggestion in the dropdown.
 */
AutoSuggestControl.prototype.highlightSuggestion = function (oSuggestionNode) {

    
    for (var i=0; i < this.layer.childNodes.length; i++) {

        var oNode = this.layer.childNodes[i];
        if (oNode == oSuggestionNode) {

            oNode.className = "current"
        
} else if (oNode.className == "current") {

            oNode.className = "";
        
}
    
}

};

/**
 * Initializes the textbox with event handlers for
 * auto suggest functionality.
 * @scope private
 */
AutoSuggestControl.prototype.init = function () {


    //save a reference to this object
    var oThis = this;
    
    //assign the onkeyup event handler
    this.textbox.onkeyup = function (oEvent) {

    
        //check for the proper location of the event object
        if (!oEvent) {

            oEvent = window.event;
        
}    
        
        //call the handleKeyUp() method with the event object
        oThis.handleKeyUp(oEvent);
    
};
    
    //assign onkeydown event handler
    this.textbox.onkeydown = function (oEvent) {

    
        //check for the proper location of the event object
        if (!oEvent) {

            oEvent = window.event;
        
}    
        
        //call the handleKeyDown() method with the event object
        oThis.handleKeyDown(oEvent);
    
};
    
    //assign onblur event handler (hides suggestions)    
    this.textbox.onblur = function () {

        oThis.hideSuggestions();
    
};
    //show all suggestion when double click
    this.textbox.ondblclick = function() {

	    oThis.handleDblClick();
    
};
    
    //create the suggestions dropdown
    this.createDropDown();

};

/**
 * Highlights the next suggestion in the dropdown and
 * places the suggestion into the textbox.
 * @scope private
 */
AutoSuggestControl.prototype.nextSuggestion = function () {

    var cSuggestionNodes = this.layer.childNodes;

    if (cSuggestionNodes.length > 0 && this.cur < cSuggestionNodes.length-1) {

        var oNode = cSuggestionNodes[++this.cur];
        this.highlightSuggestion(oNode);
        this.textbox.value = oNode.firstChild.nodeValue; 
    
}

};

/**
 * Highlights the previous suggestion in the dropdown and
 * places the suggestion into the textbox.
 * @scope private
 */
AutoSuggestControl.prototype.previousSuggestion = function () {

    var cSuggestionNodes = this.layer.childNodes;

    if (cSuggestionNodes.length > 0 && this.cur > 0) {

        var oNode = cSuggestionNodes[--this.cur];
        this.highlightSuggestion(oNode);
        this.textbox.value = oNode.firstChild.nodeValue;   
    
}

};

/**
 * Selects a range of text in the textbox.
 * @scope public
 * @param iStart The start index (base 0) of the selection.
 * @param iLength The number of characters to select.
 */
AutoSuggestControl.prototype.selectRange = function (iStart /*:int*/, iLength /*:int*/) {


    //use text ranges for Internet Explorer
    if (this.textbox.createTextRange) {

        var oRange = this.textbox.createTextRange(); 
        oRange.moveStart("character", iStart); 
        oRange.moveEnd("character", iLength - this.textbox.value.length);      
        oRange.select();
        
    //use setSelectionRange() for Mozilla
    
} else if (this.textbox.setSelectionRange) {

        this.textbox.setSelectionRange(iStart, iLength);
    
}     

    //set focus back to the textbox
    this.textbox.focus();      

}; 

/**
 * Builds the suggestion layer contents, moves it into position,
 * and displays the layer.

...
...
(Not finished, please download and read the complete file)
			
...
Expand> <Close

Want complete source code? Download it here

Point(s): 1

Download
0 lines left, continue to read
Sponsored links

File list

Tips: You can preview the content of files by clicking file names^_^
Name Size Date
auto_suggest.html1.09 kB03-12-07 00:11
crud.html1.68 kB03-12-07 00:11
03.00 B
2col_leftNav.css6.28 kB03-12-07 00:11
autosuggest.css335.00 B03-12-07 00:11
debug.png399.00 B03-12-07 00:11
error.png289.00 B03-12-07 00:11
fatal.png309.00 B03-12-07 00:11
info.png271.00 B03-12-07 00:11
logger.css1.88 kB03-12-07 00:11
magnet.png430.00 B03-12-07 00:11
site.css1.43 kB03-12-07 00:11
warn.png257.00 B03-12-07 00:11
03.00 B
auto_suggest.html.txt1.09 kB03-12-07 00:11
auto_suggest.js.txt669.00 B03-12-07 00:11
CountryList.java.txt3.00 kB03-12-07 00:11
crud.html.txt1.68 kB03-12-07 00:11
crud.js.txt1.40 kB03-12-07 00:11
crud.jst.txt755.00 B03-12-07 00:11
index.html.txt3.24 kB03-12-07 00:11
jst_demo.html.txt1.68 kB03-12-07 00:11
LabelValueBean.java.txt4.72 kB03-12-07 00:11
mvcPic.html.txt1.05 kB03-12-07 00:11
rdf.jst.txt284.00 B03-12-07 00:11
rss.jst.txt272.00 B03-12-07 00:11
rss_reader.html.txt1.20 kB03-12-07 00:11
rss_reader.js.txt642.00 B03-12-07 00:11
services.properties.txt168.00 B03-12-07 00:11
services.xml.txt435.00 B03-12-07 00:11
Test.java.txt17.36 kB03-12-07 00:11
TestBean.java.txt1.41 kB03-12-07 00:11
unit_test.html.txt1.03 kB03-12-07 00:11
unit_test.js.txt15.89 kB03-12-07 00:11
unit_test.jst.txt493.00 B03-12-07 00:11
unit_test_js.jst.txt765.00 B03-12-07 00:11
User.java.txt2.49 kB03-12-07 00:11
UserManager.java.txt2.04 kB03-12-07 00:11
web.xml.txt1.58 kB03-12-07 00:11
web.xml_no_spring.txt1.58 kB03-12-07 00:11
03.00 B
check.gif604.00 B03-12-07 00:11
debug.png399.00 B03-12-07 00:11
error.gif633.00 B03-12-07 00:11
error.png289.00 B03-12-07 00:11
fatal.png309.00 B03-12-07 00:11
info.png271.00 B03-12-07 00:11
magnet.png430.00 B03-12-07 00:11
swato_01.png5.22 kB03-12-07 00:11
swato_02.png13.94 kB03-12-07 00:11
swato_04.png7.94 kB03-12-07 00:11
swato_05.png14.42 kB03-12-07 00:11
swato_Layer-5-over.png27.12 kB03-12-07 00:11
swato_Layer_5.png28.45 kB03-12-07 00:11
wait.gif1.52 kB03-12-07 00:11
warn.png257.00 B03-12-07 00:11
index.html3.70 kB03-12-07 00:11
03.00 B
effects.js33.07 kB03-12-07 00:11
jkl-floating.js7.22 kB03-12-07 00:11
jkl-parsexml.js14.11 kB03-12-07 00:11
jkl-resizable.js5.05 kB03-12-07 00:11
json.js10.34 kB03-12-07 00:11
logger.js6.77 kB03-12-07 00:11
pop-it-menu.js4.44 kB03-12-07 00:11
prototype.js55.81 kB03-12-07 00:11
swato-engine.js5.06 kB03-12-07 00:11
swato-form.js3.00 kB03-12-07 00:11
swato-jst.js3.91 kB03-12-07 00:11
swato-select.js1.18 kB03-12-07 00:11
swato-suggest.js11.62 kB03-12-07 00:11
swato.js939.00 B03-12-07 00:11
window.js40.77 kB03-12-07 00:11
03.00 B
crud.jst744.00 B03-12-07 00:11
rdf.jst284.00 B03-12-07 00:11
rss.jst272.00 B03-12-07 00:11
unit_test.jst493.00 B03-12-07 00:11
unit_test_js.jst765.00 B03-12-07 00:11
jst_demo.html1.68 kB03-12-07 00:11
03.00 B
MANIFEST.MF106.00 B03-12-07 00:11
mvcPic.html1.05 kB03-12-07 00:11
rss_reader.html1.20 kB03-12-07 00:11
03.00 B
auto_suggest.js665.00 B03-12-07 00:11
crud.js1.41 kB03-12-07 00:11
portal.js4.66 kB03-12-07 00:11
rss_reader.js642.00 B03-12-07 00:11
unit_test.js15.89 kB03-12-07 00:11
swato.jar56.50 kB08-04-08 10:57
test.html18.36 kB03-12-07 00:11
unit_test.html1.03 kB03-12-07 00:11
03.00 B
03.00 B
03.00 B
03.00 B
JSONArray.class8.16 kB03-12-07 00:11
JSONObject$1.class199.00 B03-12-07 00:11
JSONObject$Null.class860.00 B03-12-07 00:11
JSONObject.class10.41 kB03-12-07 00:11
JSONTokener.class5.17 kB03-12-07 00:11
03.00 B
03.00 B
03.00 B
CountryList.class2.52 kB03-12-07 00:11
LabelValueBean$1.class825.00 B03-12-07 00:11
LabelValueBean.class2.15 kB03-12-07 00:11
LabelValueBeanTest.class1.88 kB03-12-07 00:11
ObjA.class571.00 B03-12-07 00:11
ObjB.class571.00 B03-12-07 00:11
Test$1.class565.00 B03-12-07 00:11
Test$2.class714.00 B03-12-07 00:11
Test$Foo.class231.00 B03-12-07 00:11
Test$InnerFoo.class643.00 B03-12-07 00:11
Test$InnerSubTestBean.class520.00 B03-12-07 00:11
Test$StaticInnerSubTestBean.class437.00 B03-12-07 00:11
Test$TestBeanInvocationHandler.class1.56 kB03-12-07 00:11
Test.class13.72 kB03-12-07 00:11
TestBean.class1.27 kB03-12-07 00:11
User.class1.65 kB03-12-07 00:11
UserManager.class2.27 kB03-12-07 00:11
JSONConverter.class8.00 kB03-12-07 00:11
JSONConverterTest$1.class240.00 B03-12-07 00:11
JSONConverterTest$TestBean.class1.73 kB03-12-07 00:11
JSONConverterTest.class6.13 kB03-12-07 00:11
03.00 B
JSONRequest.class2.96 kB03-12-07 00:11
JSONResponse.class2.41 kB03-12-07 00:11
JSONServlet.class4.00 kB03-12-07 00:11
PropsFileContext.class3.48 kB03-12-07 00:11
RequestAware.class198.00 B03-12-07 00:11
RequestParameterHolder.class2.36 kB03-12-07 00:11
RequestParameterRecorder.class2.17 kB03-12-07 00:11
RequestRedirector.class2.78 kB03-12-07 00:11
ServiceContext.class243.00 B03-12-07 00:11
SessionAware.class191.00 B03-12-07 00:11
SpringContext.class1.39 kB03-12-07 00:11
SwatoActionProxy.class4.86 kB03-12-07 00:11
SwatoVisible.class396.00 B03-12-07 00:11
03.00 B
Pipe.class2.02 kB03-12-07 00:11
Utils.class632.00 B03-12-07 00:11
services.properties168.00 B03-12-07 00:11
services.xml881.00 B03-12-07 00:11
03.00 B
commons-httpclient-2.0.2.jar220.09 kB03-12-07 00:11
commons-logging.jar37.12 kB03-12-07 00:11
spring-beans.jar213.99 kB03-12-07 00:11
spring-context.jar100.22 kB03-12-07 00:11
spring-core.jar71.98 kB03-12-07 00:11
web.xml1.58 kB03-12-07 00:11
...
Sponsored links

swato-suggest.js (884.61 kB)

Need 1 point
Your Point(s)

Your Point isn't enough.

Get point immediately by PayPal

More(Debit card / Credit card / PayPal Credit / Online Banking)

Submit your source codes. Get more point

LOGIN

Don't have an account? Register now
Need any help?
Mail to: support@codeforge.com

切换到中文版?

CodeForge Chinese Version
CodeForge English Version

Where are you going?

^_^"Oops ...

Sorry!This guy is mysterious, its blog hasn't been opened, try another, please!
OK

Warm tip!

CodeForge to FavoriteFavorite by Ctrl+D