oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

upgrade to yui 2.5.1

Browse source
This commit is contained in:
JT Smith 2008-03-25 16:13:25 +00:00
parent e00050ad1c
commit ff7d72becc
1632 changed files with 812103 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

410
www/extras/yui/examples/autocomplete/ac_customize.html Normal file
View file

File diff suppressed because one or more lines are too long

311
www/extras/yui/examples/autocomplete/ac_customize_clean.html Normal file
View file

@ -0,0 +1,311 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Configurations Dashboard</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/connection/connection-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for this example */
#dashboard_autocomplete {margin:0 1em 0 0;width:40%;height:4em;}/* set width and height of widget here*/
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Configurations Dashboard</h1>
<div class="exampleIntro">
<p>This example is designed to allow you to experiment with the various
configuration properties provided by AutoComplete and to explore their impact
on the interaction. The first field after the AutoComplete input textbox
is a select element that
allows you to test for bleed-through on Internet Explorer when the AutoComplete
suggestion container descends to cover it. The remaining form fields allow you
to change property settings on the AutoComplete instance and to see immediately
how those changes feel in the browser.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<!-- AutoComplete begins -->
<h3>Search the Web Using Yahoo!'s Search API:</h3>
<div id="dashboard_autocomplete">
<input id="dashboard_input" type="text" name="p">
<div id="dashboard_container"></div>
</div>
<!-- AutoComplete ends -->
<!-- Panel begins -->
<h3>Use the Controls Below to Customize the Behavior of the AutoComplete Instance Above:</h3>
<form id="panel">
<!-- The following is in a select to demonstrate the useIFrame feature -->
<select><option>Customize configurations for AutoComplete</option></select>
<div>
<input id="animHoriz" type="checkbox">
<label for="animHoriz">Animate Horizontally</label>
</div>
<div>
<input id="animVert" type="checkbox" checked>
<label for="animVert">Animate Vertically</label>
</div>
<div>
<label for="animSpeedInput">Animation Speed: </label>
<input id="animSpeedInput" type="text" size="2" value="0.3">
<input id="animSpeed" type="button" value="Update">
</div>
<div>
<input id="useShadow" type="checkbox">
<label for="useShadow">Use Shadow</label>
</div>
<div>
<input id="useIFrame" type="checkbox">
<label for="useIFrame">Use IFrame</label>
</div>
<div>
<input id="autoHighlight" type="checkbox" checked>
<label for="autoHighlight">Automatically Highlight First Item</label>
</div>
<div>
<input id="typeAhead" type="checkbox">
<label for="typeAhead">Type Ahead</label>
</div>
<div>
<input id="forceSelection" type="checkbox">
<label for="forceSelection">Force a Selection</label>
</div>
<div>
<label for="maxResultsDisplayedInput">Maximum Results: </label>
<input id="maxResultsDisplayedInput" type="text" size="2" value="10">
<input id="maxResultsDisplayed" type="button" value="Update">
</div>
<div>
<label for="minQueryLengthInput">Minimum Query Length: </label>
<input id="minQueryLengthInput" type="text" size="2" value="1">
<input id="minQueryLength" type="button" value="Update">
</div>
<div>
<label for="queryDelayInput">Query Delay: </label>
<input id="queryDelayInput" type="text" size="2" value="0.2">
<input id="queryDelay" type="button" value="Update">
</div>
<div>
<label for="delimCharInput">Delimiter Character(s) like ; or [";", ","]</label><br>
<input id="delimCharInput" type="text" size="30" value="">
<input id="delimChar" type="button" value="Update">
</div>
<div>
<label for="highlightClassNameInput">Highlight Classname</label><br>
<input id="highlightClassNameInput" type="text" size="30" value="yui-ac-highlight" maxlength="30">
<input id="highlightClassName" type="button" value="Update">
</div>
<div>
<label for="prehighlightClassNameInput">Pre-highlight Classname</label><br>
<input id="prehighlightClassNameInput" type="text" size="30" value="" maxlength="30">
<input id="prehighlightClassName" type="button" value="Update">
</div>
<div>
<input id="allowBrowserAutocomplete" type="checkbox" checked>
<label for="allowBrowserAutocomplete">Allow Browser Autocomplete</label>
</div>
<div>
<input id="alwaysShowContainer" type="checkbox">
<label for="alwaysShowContainer">Always Show Container</label>
</div>
<div>
<label for="setHeaderInput">Set Header</label>
<input id="setHeader" type="button" value="Update"><br>
<textarea id="setHeaderInput" cols="25" rows="5"></textarea>
</div>
<div>
<label for="setBodyInput">Set Body</label>
<input id="setBody" type="button" value="Update"><br>
<textarea id="setBodyInput" cols="25" rows="5"></textarea>
</div>
<div>
<label for="setFooterInput">Set Footer</label>
<input id="setFooter" type="button" value="Update"><br>
<textarea id="setFooterInput" cols="25" rows="5"></textarea>
</div>
</form>
<!-- Panel ends -->
<script type="text/javascript">
YAHOO.example.Dashboard = new function() {
// Initialize widgets and the dashboard
this.init = function() {
// DataSource
this.myDataSource = new YAHOO.widget.DS_XHR("assets/php/ysearch_flat.php", ["\n", "\t"]);
// This is the one non-default value other than constructor params
this.myDataSource.responseType = YAHOO.widget.DS_XHR.TYPE_FLAT;
// AutoComplete
this.myAutoComp = new YAHOO.widget.AutoComplete("dashboard_input","dashboard_container", this.myDataSource);
// IFrame workaround for IE
var ua = navigator.userAgent.toLowerCase();
if(ua.indexOf('msie') != -1 && ua.indexOf('opera') < 0) {
this.myAutoComp.useIFrame = true;
YAHOO.util.Dom.get("useiframe").checked = true;
}
// Dashboard DOM event handling (assign scope to the HTML Element)
YAHOO.util.Event.addListener("animHoriz","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("animVert","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("useShadow","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("useIFrame","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("autoHighlight","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("typeAhead","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("forceSelection","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("allowBrowserAutocomplete","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("alwaysShowContainer","click",this.handleCheckboxEvent,this);
YAHOO.util.Event.addListener("animSpeed","click",this.handleNumberInputEvent,this);
YAHOO.util.Event.addListener("maxResultsDisplayed","click",this.handleNumberInputEvent,this);
YAHOO.util.Event.addListener("minQueryLength","click",this.handleNumberInputEvent,this);
YAHOO.util.Event.addListener("queryDelay","click",this.handleNumberInputEvent,this);
YAHOO.util.Event.addListener("delimChar","click",this.handleDelimiterInputEvent,this);
YAHOO.util.Event.addListener("highlightClassName","click",this.handleTextInputEvent,this);
YAHOO.util.Event.addListener("prehighlightClassName","click",this.handleTextInputEvent,this);
YAHOO.util.Event.addListener("setHeader","click",this.handleTextareaEvent,this);
YAHOO.util.Event.addListener("setBody","click",this.handleTextareaEvent,this);
YAHOO.util.Event.addListener("setFooter","click",this.handleTextareaEvent,this);
};
// For valid inputs
this.updateValue = function(property, value) {
this.myAutoComp[property] = value;
this.logSuccess(property);
};
// For invalid inputs
this.revertInput = function(property) {
YAHOO.util.Dom.get(property+"Input").value = this.myAutoComp[property];
this.logFailure(property);
};
// Log success message
this.logSuccess = function(property) {
YAHOO.log("Updated " + property + " to " + this.myAutoComp[property] + ".", "info", "example");
};
// Log failure message
this.logFailure = function(property, error) {
YAHOO.log("Could not update " + property + ".", "warn","example");
};
// DOM event handler (scope assigned to the HTML Element)
this.handleCheckboxEvent = function(e, oSelf) {
var property = this.id;
oSelf.updateValue(property, this.checked);
if(oSelf.myAutoComp.useShadow && oSelf.myAutoComp.alwaysShowContainer) {
YAHOO.log("The AutoComplete properties useShadow and alwaysShowContainer should not be enabled concurrently.","warn","example")
}
};
// DOM event handler (scope assigned to the HTML Element)
this.handleNumberInputEvent = function(e, oSelf) {
var property = this.id;
// Validate input
var nValue = YAHOO.util.Dom.get(property+"Input").value*1;
if(YAHOO.lang.isNumber(nValue)) {
oSelf.updateValue(property, nValue);
}
else {
oSelf.revertInput(property);
}
};
// DOM event handler (scope assigned to the HTML Element)
this.handleDelimiterInputEvent = function(e, oSelf) {
var property = this.id;
// Validate input
var sValue = YAHOO.util.Dom.get(property+"Input").value;
if((sValue.indexOf("[") == 0) &&
(sValue.indexOf("]") == sValue.length-1) &&
(sValue.indexOf("<") < 0) &&
(sValue.indexOf(">") < 0)) {
// Ok to turn into an array
try {
sValue = eval(sValue);
}
catch(e) {
// Not ok
oSelf.revertInput(property);
return;
}
}
else if(sValue.length !== 1){
// Not ok
oSelf.revertInput(property);
return;
}
oSelf.updateValue(property, sValue);
};
// DOM event handler (scope assigned to the HTML Element)
this.handleTextInputEvent = function(e, oSelf) {
var property = this.id;
oSelf.updateValue(property, YAHOO.util.Dom.get(property+"Input").value);
};
// DOM event handler (scope assigned to the HTML Element)
this.handleTextareaEvent = function(e, oSelf) {
var method = this.id;
var value = YAHOO.util.Dom.get(method+"Input").value;
switch(method) {
case "setHeader":
oSelf.myAutoComp.setHeader(value);
break
case "setBody":
oSelf.myAutoComp.setBody(value);
break;
case "setFooter":
oSelf.myAutoComp.setFooter(value);
break;
}
YAHOO.log("Called " + method + "() with " + value, "info", "example");
};
};
YAHOO.util.Event.addListener(this,'load',YAHOO.example.Dashboard.init,YAHOO.example.Dashboard,true);
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

414
www/extras/yui/examples/autocomplete/ac_customize_log.html Normal file
View file

File diff suppressed because one or more lines are too long

284
www/extras/yui/examples/autocomplete/ac_flickr_xml.html Normal file
View file

File diff suppressed because one or more lines are too long

117
www/extras/yui/examples/autocomplete/ac_flickr_xml_clean.html Normal file
View file

@ -0,0 +1,117 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Use AutoComplete with Flickr's XML Webservice</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/connection/connection-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for scrolling container */
.flickrautocomplete {
width:25em; /* set width of widget here */
padding-bottom:2em;
}
.flickrautocomplete .yui-ac-content {
max-height:30em;overflow:auto;overflow-x:hidden; /* set scrolling */
_height:30em; /* ie6 */
}
.flickrautocomplete .flickrImg {
width:6em;height:6em;padding:.1em;vertical-align:middle;
}
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Use AutoComplete with Flickr's XML Webservice</h1>
<div class="exampleIntro">
<p>This example uses a DataSource that points to Flickr Web
Services; Flickr returns XML data via a simple PHP proxy. In order to return
valid data from the Flickr application, <code>scriptQueryParameter</code>
has been customized to be <code>tags</code>, and <code>scriptQueryAppend</code> is used
to pass in additional required arguments. The cache has been disabled so
that each query is forced to make a trip to the live application.</p>
<p>This instance of AutoComplete defines a robust custom
<code>formatResult()</code> function to format the result data into
images in HTML. Automatic
highlighting of the first result item in the container has been disabled by
setting <code>autoHighlight</code> to <code>false</code>.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<h3>Enter Flickr tags to find a photo (separate with commas):</h3>
<div class="flickrautocomplete">
<input id="flickrinput" type="text">
<div id="flickrcontainer"></div>
</div>
<script type="text/javascript">
YAHOO.example.ACFlickr = new function() {
// Instantiate an XHR DataSource and define schema as an array:
// ["ResultNodeName",
// "QueryKeyAttributeOrNodeName",
// "AdditionalParamAttributeOrNodeName1",
// ...
// "AdditionalParamAttributeOrNodeNameN"]
this.oACDS = new YAHOO.widget.DS_XHR("assets/php/flickr_proxy.php",
["photo", "title", "id", "owner", "secret", "server"]);
this.oACDS.scriptQueryParam = "tags";
this.oACDS.responseType = YAHOO.widget.DS_XHR.TYPE_XML;
this.oACDS.maxCacheEntries = 0;
this.oACDS.scriptQueryAppend = "method=flickr.photos.search";
// Instantiate AutoComplete
this.oAutoComp = new YAHOO.widget.AutoComplete('flickrinput','flickrcontainer', this.oACDS);
this.oAutoComp.autoHighlight = false;
this.oAutoComp.formatResult = function(oResultItem, sQuery) {
// This was defined by the schema array of the data source
var sTitle = oResultItem[0];
var sId = oResultItem[1];
var sOwner = oResultItem[2];
var sSecret = oResultItem[3];
var sServer = oResultItem[4];
var sUrl = "http://static.flickr.com/" +
sServer +
"/" +
sId +
"_" +
sSecret +
"_s.jpg";
var sMarkup = "<img src='" + sUrl + "' class='flickrImg'> " + sTitle;
return (sMarkup);
};
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

288
www/extras/yui/examples/autocomplete/ac_flickr_xml_log.html Normal file
View file

File diff suppressed because one or more lines are too long

264
www/extras/yui/examples/autocomplete/ac_proxyless.html Normal file
View file

File diff suppressed because one or more lines are too long

103
www/extras/yui/examples/autocomplete/ac_proxyless_clean.html Normal file
View file

@ -0,0 +1,103 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Proxyless AutoComplete pointing to the Yahoo! Search API</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/get/get-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for this implementation */
#ysearchautocomplete { margin-bottom:2em;width:25em;}
#ysearchautocomplete .result {position:relative;height:62px;}
#ysearchautocomplete .name {position:absolute;bottom:0;left:64px;}
#ysearchautocomplete .img {position:absolute;top:0;left:0;width:58px;height:58px;border:1px solid black;}
#ysearchautocomplete .imgtext {position:absolute;width:58px;top:50%;text-align:center;}
#ysearchautocomplete img {width:60px;height:60px;margin-right:4px;}
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Proxyless AutoComplete pointing to the Yahoo! Search API</h1>
<div class="exampleIntro">
<p>This AutoComplete instance uses a Script Node type of DataSource in order to
retrieve data from a cross-domain server, Yahoo!'s Audio Search API, without
the need for a proxy. The webservice must support a "callback" parameter, which
the AutoComplete widget will use to pass in its internal callback function.
The DataSource schema is defined to parse the return data
for fields named "Name" and "Thumbnail" (in order to display a thumbnail image to
the user).</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<form action="http://audio.search.yahoo.com/search/audio" onsubmit="return YAHOO.example.ACScriptNode.validateForm();">
<h3>Yahoo! Audio Search:</h3>
<div id="ysearchautocomplete">
<input id="ysearchinput" type="text" name="p">
<div id="ysearchcontainer"></div>
</div>
</form>
<script type="text/javascript">
YAHOO.example.ACScriptNode = new function(){
// Instantiate an Script Node DataSource and define schema as an array:
// ["Multi-depth.object.notation.to.find.a.single.result.item",
// "Query Key",
// "Additional Param Name 1",
// ...
// "Additional Param Name n"]
this.oACDS = new YAHOO.widget.DS_ScriptNode("http://search.yahooapis.com/AudioSearchService/V1/artistSearch?appid=YahooDemo&output=json", ["ResultSet.Result","Name","Thumbnail"]);
this.oACDS.scriptQueryParam = "artist";
// Instantiate AutoComplete
this.oAutoComp = new YAHOO.widget.AutoComplete("ysearchinput","ysearchcontainer", this.oACDS);
this.oAutoComp.formatResult = function(oResultItem, sQuery) {
var img = "", nonimg = "";
var oThumbnail = oResultItem[1];
if(oThumbnail && (oThumbnail !== "")) {
img = "<img src=\""+ oThumbnail.Url + "\">";
}
else {
img = "<span class=\"img\"><span class=\"imgtext\">N/A</span></span>";
}
return "<div class=\"result\">" + img + "&nbsp;<span class=\"name\">" + oResultItem[0] + "</span></div>";
};
// Stub for form validation
this.validateForm = function() {
// Validation code goes here
return true;
};
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

268
www/extras/yui/examples/autocomplete/ac_proxyless_log.html Normal file
View file

File diff suppressed because one or more lines are too long

323
www/extras/yui/examples/autocomplete/ac_skinning.html Normal file
View file

File diff suppressed because one or more lines are too long

757
www/extras/yui/examples/autocomplete/ac_states_jsarray.html Normal file
View file

File diff suppressed because one or more lines are too long

563
www/extras/yui/examples/autocomplete/ac_states_jsarray_clean.html Normal file
View file

@ -0,0 +1,563 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Query a JavaScript Array for In-memory Data</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for multiple stacked instances */
#statesautocomplete,
#statesautocomplete2 {
width:15em; /* set width here */
padding-bottom:2em;
}
#statesautocomplete {
z-index:9000; /* z-index needed on top instance for ie & sf absolute inside relative issue */
}
#statesinput,
#statesinput2 {
_position:absolute; /* abs pos needed for ie quirks */
}
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Query a JavaScript Array for In-memory Data</h1>
<div class="exampleIntro">
<p>There are two AutoComplete widgets on this page that each point to a
different DS_JSArray DataSource instance. Driving each DataSource is a local
JavaScript array of strings: <code>statesArray</code> and <code>areaCodesArray</code>.
By pointing to arrays that are already loaded into memory the widget is
very fast to return data.</p>
<p>Enabling the
<code>prehighlightClassName</code> feature provides supplemental visual
feedback for mouse events on results in the container.</p>
<p>The <code>formatResult</code> method of the second AutoComplete instance
has been enhanced to display two data fields in the container, and the
<code>forceSelection</code> property has been enabled to prevent the user from
typing in a free-form selection.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<h3>Find a state:</h3>
<div id="statesautocomplete">
<input id="statesinput" type="text">
<div id="statescontainer"></div>
</div>
<h3>Find an area code</h3>
<div id="statesautocomplete2">
<input id="statesinput2" type="text">
<div id="statescontainer2"></div>
</div>
<!-- In-memory JS array begins-->
<script type="text/javascript">
YAHOO.example.statesArray = [
"Alabama",
"Alaska",
"Arizona",
"Arkansas",
"California",
"Colorado",
"Connecticut",
"Delaware",
"Florida",
"Georgia",
"Hawaii",
"Idaho",
"Illinois",
"Indiana",
"Iowa",
"Kansas",
"Kentucky",
"Louisiana",
"Maine",
"Maryland",
"Massachusetts",
"Michigan",
"Minnesota",
"Mississippi",
"Missouri",
"Montana",
"Nebraska",
"Nevada",
"New Hampshire",
"New Jersey",
"New Mexico",
"New York",
"North Dakota",
"North Carolina",
"Ohio",
"Oklahoma",
"Oregon",
"Pennsylvania",
"Rhode Island",
"South Carolina",
"South Dakota",
"Tennessee",
"Texas",
"Utah",
"Vermont",
"Virginia",
"Washington",
"West Virginia",
"Wisconsin",
"Wyoming"
];
YAHOO.example.areacodesArray = [
["201", "New Jersey"],
["202", "Washington, DC"],
["203", "Connecticut"],
["204", "Manitoba, Canada"],
["205", "Alabama"],
["206", "Washington"],
["207", "Maine"],
["208", "Idaho"],
["209", "California"],
["210", "Texas"],
["212", "New York"],
["213", "California"],
["214", "Texas"],
["215", "Pennsylvania"],
["216", "Ohio"],
["217", "Illinois"],
["218", "Minnesota"],
["219", "Indiana"],
["224", "Illinois"],
["225", "Louisiana"],
["227", "Maryland"],
["228", "Mississippi"],
["229", "Georgia"],
["231", "Michigan"],
["234", "Ohio"],
["239", "Florida"],
["240", "Maryland"],
["242", "Bahamas"],
["246", "Barbados"],
["248", "Michigan"],
["250", "British Columbia"],
["251", "Alabama"],
["252", "North Carolina"],
["253", "Washington"],
["254", "Texas"],
["256", "Alabama"],
["260", "Indiana"],
["262", "Wisconsin"],
["264", "Anguilla"],
["267", "Pennsylvania"],
["268", "Antigua and Barbuda"],
["269", "Michigan"],
["270", "Kentucky"],
["276", "Virginia"],
["281", "Texas"],
["283", "Ohio"],
["284", "British Virgin Islands"],
["289", "Ontario"],
["301", "Maryland"],
["302", "Delaware"],
["303", "Colorado"],
["304", "West Virginia"],
["305", "Florida"],
["306", "Saskatchewan, Canada"],
["307", "Wyoming"],
["308", "Nebraska"],
["309", "Illinois"],
["310", "California"],
["312", "Illinois"],
["313", "Michigan"],
["314", "Missouri"],
["315", "New York"],
["316", "Kansas"],
["317", "Indiana"],
["318", "Louisiana"],
["319", "Iowa"],
["320", "Minnesota"],
["321", "Florida"],
["323", "California"],
["330", "Ohio"],
["331", "Illinois"],
["334", "Alabama"],
["336", "North Carolina"],
["337", "Louisiana"],
["339", "Massachusetts"],
["340", "US Virgin Islands"],
["345", "Cayman Islands"],
["347", "New York"],
["351", "Massachusetts"],
["352", "Florida"],
["360", "Washington"],
["361", "Texas"],
["386", "Florida"],
["401", "Rhode Island"],
["402", "Nebraska"],
["403", "Alberta, Canada"],
["404", "Georgia"],
["405", "Oklahoma"],
["406", "Montana"],
["407", "Florida"],
["408", "California"],
["409", "Texas"],
["410", "Maryland"],
["412", "Pennsylvania"],
["413", "Massachusetts"],
["414", "Wisconsin"],
["415", "California"],
["416", "Ontario, Canada"],
["417", "Missouri"],
["418", "Quebec, Canada"],
["419", "Ohio"],
["423", "Tennessee"],
["424", "California"],
["425", "Washington"],
["434", "Virginia"],
["435", "Utah"],
["440", "Ohio"],
["441", "Bermuda"],
["443", "Maryland"],
["445", "Pennsylvania"],
["450", "Quebec, Canada"],
["464", "Illinois"],
["469", "Texas"],
["470", "Georgia"],
["473", "Grenada"],
["475", "Connecticut"],
["478", "Georgia"],
["479", "Arkansas"],
["480", "Arizona"],
["484", "Pennsylvania"],
["501", "Arkansas"],
["502", "Kentucky"],
["503", "Oregon"],
["504", "Louisiana"],
["505", "New Mexico"],
["506", "New Brunswick, Canada"],
["507", "Minnesota"],
["508", "Massachusetts"],
["509", "Washington"],
["510", "California"],
["512", "Texas"],
["513", "Ohio"],
["514", "Quebec, Canada"],
["515", "Iowa"],
["516", "New York"],
["517", "Michigan"],
["518", "New York"],
["519", "Ontario, Canada"],
["520", "Arizona"],
["530", "California"],
["540", "Virginia"],
["541", "Oregon"],
["551", "New Jersey"],
["557", "Missouri"],
["559", "California"],
["561", "Florida"],
["562", "California"],
["563", "Iowa"],
["564", "Washington"],
["567", "Ohio"],
["570", "Pennsylvania"],
["571", "Virginia"],
["573", "Missouri"],
["574", "Indiana"],
["580", "Oklahoma"],
["585", "New York"],
["586", "Michigan"],
["601", "Mississippi"],
["602", "Arizona"],
["603", "New Hampshire"],
["604", "British Columbia, Canada"],
["605", "South Dakota"],
["606", "Kentucky"],
["607", "New York"],
["608", "Wisconsin"],
["609", "New Jersey"],
["610", "Pennsylvania"],
["612", "Minnesota"],
["613", "Ontario, Canada"],
["614", "Ohio"],
["615", "Tennessee"],
["616", "Michigan"],
["617", "Massachusetts"],
["618", "Illinois"],
["619", "California"],
["620", "Kansas"],
["623", "Arizona"],
["626", "California"],
["630", "Illinois"],
["631", "New York"],
["636", "Missouri"],
["641", "Iowa"],
["646", "New York"],
["647", "Ontario, Canada"],
["649", "Turks and Caicos Islands"],
["650", "California"],
["651", "Minnesota"],
["660", "Missouri"],
["661", "California"],
["662", "Mississippi"],
["664", "Montserrat"],
["667", "Maryland"],
["670", "CNMI"],
["671", "Guam"],
["678", "Georgia"],
["682", "Texas"],
["701", "North Dakota"],
["702", "Nevada"],
["703", "Virginia"],
["704", "North Carolina"],
["705", "Ontario, Canada"],
["706", "Georgia"],
["707", "California"],
["708", "Illinois"],
["709", "Newfoundland, Canada"],
["712", "Iowa"],
["713", "Texas"],
["714", "California"],
["715", "Wisconsin"],
["716", "New York"],
["717", "Pennsylvania"],
["718", "New York"],
["719", "Colorado"],
["720", "Colorado"],
["724", "Pennsylvania"],
["727", "Florida"],
["731", "Tennessee"],
["732", "New Jersey"],
["734", "Michigan"],
["737", "Texas"],
["740", "Ohio"],
["754", "Florida"],
["757", "Viriginia"],
["758", "St. Lucia"],
["760", "California"],
["763", "Minnesota"],
["765", "Indiana"],
["767", "Dominica"],
["770", "Georgia"],
["772", "Florida"],
["773", "Illinois"],
["774", "Massachusetts"],
["775", "Nevada"],
["778", "British Columbia, Canada"],
["780", "Alberta, Canada"],
["781", "Massachusetts"],
["784", "St. Vincent &amp; Gren."],
["785", "Kansas"],
["786", "Florida"],
["787", "Puerto Rico"],
["801", "Utah"],
["802", "Vermont"],
["803", "South Carolina"],
["804", "Virginia"],
["805", "California"],
["806", "Texas"],
["807", "Ontario, Canada"],
["808", "Hawaii"],
["809", "Dominican Republic"],
["810", "Michigan"],
["812", "Indiana"],
["813", "Florida"],
["814", "Pennsylvania"],
["815", "Illinois"],
["816", "Missouri"],
["817", "Texas"],
["818", "California"],
["819", "Quebec, Canada"],
["828", "North Carolina"],
["830", "Texas"],
["831", "California"],
["832", "Texas"],
["835", "Pennsylvania"],
["843", "South Carolina"],
["845", "New York"],
["847", "Illinois"],
["848", "New Jersey"],
["850", "Florida"],
["856", "New Jersey"],
["857", "Massachusetts"],
["858", "California"],
["859", "Kentucky"],
["860", "Connecticut"],
["862", "New Jersey"],
["863", "Florida"],
["864", "South Carolina"],
["865", "Tennessee"],
["867", "Yukon, NW Territories, Canada"],
["868", "Trinidad and Tobago"],
["869", "St. Kitts &amp; Nevis"],
["870", "Arkansas"],
["872", "Illinois"],
["876", "Jamaica"],
["878", "Pennsylvania"],
["901", "Tennessee"],
["902", "Nova Scotia, Canada"],
["903", "Texas"],
["904", "Florida"],
["905", "Ontario, Canada"],
["906", "Michigan"],
["907", "Alaska"],
["908", "New Jersey"],
["909", "California"],
["910", "North Carolina"],
["912", "Georgia"],
["913", "Kansas"],
["914", "New York"],
["915", "Texas"],
["916", "California"],
["917", "New York"],
["918", "Oklahoma"],
["919", "North Carolina"],
["920", "Wisconsin"],
["925", "California"],
["928", "Arizona"],
["931", "Tennessee"],
["936", "Texas"],
["937", "Ohio"],
["939", "Puerto Rico"],
["940", "Texas"],
["941", "Florida"],
["947", "Michigan"],
["949", "California"],
["952", "Minnesota"],
["954", "Florida"],
["956", "Texas"],
["959", "Connecticut"],
["970", "Colorado"],
["971", "Oregon"],
["972", "Texas"],
["973", "New Jersey"],
["975", "Missouri"],
["978", "Massachusetts"],
["979", "Texas"],
["980", "North Carolina"],
["984", "North Carolina"],
["985", "Louisiana"],
["989", "Michigan"]
];
</script>
<!-- In-memory JS array ends-->
<script type="text/javascript">
YAHOO.example.ACJSArray = new function() {
// Instantiate first JS Array DataSource
this.oACDS = new YAHOO.widget.DS_JSArray(YAHOO.example.statesArray);
// Instantiate first AutoComplete
this.oAutoComp = new YAHOO.widget.AutoComplete('statesinput','statescontainer', this.oACDS);
this.oAutoComp.prehighlightClassName = "yui-ac-prehighlight";
this.oAutoComp.typeAhead = true;
this.oAutoComp.useShadow = true;
this.oAutoComp.minQueryLength = 0;
this.oAutoComp.textboxFocusEvent.subscribe(function(){
var sInputValue = YAHOO.util.Dom.get('statesinput').value;
if(sInputValue.length === 0) {
var oSelf = this;
setTimeout(function(){oSelf.sendQuery(sInputValue);},0);
}
});
// Instantiate second JS Array DataSource
this.oACDS2 = new YAHOO.widget.DS_JSArray(YAHOO.example.areacodesArray);
// Instantiate second AutoComplete
this.oAutoComp2 = new YAHOO.widget.AutoComplete('statesinput2','statescontainer2', this.oACDS2);
this.oAutoComp2.prehighlightClassName = "yui-ac-prehighlight";
this.oAutoComp2.typeAhead = true;
this.oAutoComp2.useShadow = true;
this.oAutoComp2.forceSelection = true;
this.oAutoComp2.formatResult = function(oResultItem, sQuery) {
var sMarkup = oResultItem[0] + " (" + oResultItem[1] + ")";
return (sMarkup);
};
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

761
www/extras/yui/examples/autocomplete/ac_states_jsarray_log.html Normal file
View file

File diff suppressed because one or more lines are too long

313
www/extras/yui/examples/autocomplete/ac_states_jsfunction.html Normal file
View file

File diff suppressed because one or more lines are too long

117
www/extras/yui/examples/autocomplete/ac_states_jsfunction_clean.html Normal file
View file

@ -0,0 +1,117 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Query a JavaScript Function for In-memory Data</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for scrolling container */
#statesautocomplete {
width:15em; /* set width of widget here*/
height:12em; /* define height for container to appear inline */
}
#statescontainer .yui-ac-content {
max-height:11em;overflow:auto;overflow-x:hidden; /* scrolling */
_height:11em; /* ie6 */
}
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Query a JavaScript Function for In-memory Data</h1>
<div class="exampleIntro">
<p>This example uses a DS_JSFunction DataSource pointing to a JavaScript function
that returns data as an array of strings. Since the data for this example is
already loaded into memory, queries should be very fast to return data,
and since there is no server load concern, the AutoComplete instance can be
configured to have a query delay of zero seconds.</p>
<p>In this example, the AutoComplete instance is able to keep its container
always open by customizing the appropriate CSS styles and enabling the
<code>alwaysShowContainer</code> property. We hook into the custom events
<code>containerExpandEvent</code> and <code>containerCollapseEvent</code>
and calling the <code>setHeader()</code>, <code>setBody()</code>, and
<code>setFooter()</code> methods to dynamically update the contents of the open
container. Finally, the AutoComplete's <code>formatResults()</code> method
has been customized to display multiple data fields in the container.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<h3>Filter the US states:</h3>
<div id="statesautocomplete">
<input id="statesinput" type="text">
<div id="statescontainer"></div>
</div>
<!-- In-memory JS dataset begins-->
<script type="text/javascript" src="assets/js/states_jsfunction.js"></script>
<!-- In-memory JS dataset ends-->
<script type="text/javascript">
YAHOO.example.ACJSFunction = new function(){
// Instantiate JS Function DataSource
this.oACDS = new YAHOO.widget.DS_JSFunction(getStates);
this.oACDS.maxCacheEntries = 0;
// Instantiate AutoComplete
this.oAutoComp = new YAHOO.widget.AutoComplete('statesinput','statescontainer', this.oACDS);
this.oAutoComp.alwaysShowContainer = true;
this.oAutoComp.minQueryLength = 0;
this.oAutoComp.maxResultsDisplayed = 50;
this.oAutoComp.formatResult = function(oResultItem, sQuery) {
var sMarkup = oResultItem[0] + " (" + oResultItem[1] + ")";
return (sMarkup);
};
// Show custom message if no results found
this.myOnDataReturn = function(sType, aArgs) {
var oAutoComp = aArgs[0];
var sQuery = aArgs[1];
var aResults = aArgs[2];
if(aResults.length == 0) {
oAutoComp.setBody("<div id=\"statescontainerdefault\">No matching results</div>");
}
};
this.oAutoComp.dataReturnEvent.subscribe(this.myOnDataReturn);
// Preload content in the container
this.oAutoComp.sendQuery("");
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

317
www/extras/yui/examples/autocomplete/ac_states_jsfunction_log.html Normal file
View file

File diff suppressed because one or more lines are too long

325
www/extras/yui/examples/autocomplete/ac_ysearch_flat.html Normal file
View file

File diff suppressed because one or more lines are too long

137
www/extras/yui/examples/autocomplete/ac_ysearch_flat_clean.html Normal file
View file

@ -0,0 +1,137 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Use AutoComplete to access flat-file data from a web service</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/connection/connection-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for multiple stacked instances with custom formatting */
#example0 { z-index:9001; } /* z-index needed on top instances for ie & sf absolute inside relative issue */
#example1 { z-index:9000; } /* z-index needed on top instances for ie & sf absolute inside relative issue */
.autocomplete { padding-bottom:2em;width:40%; }/* set width of widget here*/
.autocomplete .yui-ac-highlight .sample-quantity,
.autocomplete .yui-ac-highlight .sample-result,
.autocomplete .yui-ac-highlight .sample-query { color:#FFF; }
.autocomplete .sample-quantity { float:right; } /* push right */
.autocomplete .sample-result { color:#A4A4A4; }
.autocomplete .sample-query { color:#000; }
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Use AutoComplete to access flat-file data from a web service</h1>
<div class="exampleIntro">
<p>This example's XHR DataSource instance points to a custom PHP script that
returns data from tab-delimited text file. For maximum cache performance, the
DataSource property <code>queryMatchSubset</code> has been enabled, and the cache
itself has been turned up to 60 entries for fewer round trips to the server.</p>
<p>On this page there are three separate AutoComplete instances that all
point to a single DataSource, which further maximizes cache efficiency.
Queries can be delimited using the semi-colon (;) character. For
demonstration purposes, each instance decreases the query delay slightly,
and each instance formats the return data in the container with slightly
different markup.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<div id="autocomplete_examples">
<p><strong>Note:</strong> The flat-file database accessed here has a limited number of terms; for best results, type one-letter at at time and let the AutoComplete instance return &mdash; if you type a full, highly-specifc phrase (such as your name) you'll probably get no results from the small dataset.</p>
<h2>Sample Search (1 sec query delay):</h2>
<div id="example0" class="autocomplete">
<input id="ysearchinput0" type="text">
<div id="ysearchcontainer0"></div>
</div>
<h2>Sample Search (0.2 sec query delay):</h2>
<div id="example1" class="autocomplete">
<input id="ysearchinput1" type="text">
<div id="ysearchcontainer1"></div>
</div>
<h2>Sample Search (0 sec query delay):</h2>
<div id="example2" class="autocomplete">
<input id="ysearchinput2" type="text">
<div id="ysearchcontainer2"></div>
</div>
</div>
<script type="text/javascript">
YAHOO.example.ACFlatData = new function(){
// Define a custom formatter function
this.fnCustomFormatter = function(oResultItem, sQuery) {
var sKey = oResultItem[0];
var nQuantity = oResultItem[1];
var sKeyQuery = sKey.substr(0, sQuery.length);
var sKeyRemainder = sKey.substr(sQuery.length);
var aMarkup = ["<div class='sample-result'><div class='sample-quantity'>",
nQuantity,
"</div><span class='sample-query'>",
sKeyQuery,
"</span>",
sKeyRemainder,
"</div>"];
return (aMarkup.join(""));
};
// Instantiate one XHR DataSource and define schema as an array:
// ["Record Delimiter",
// "Field Delimiter"]
this.oACDS = new YAHOO.widget.DS_XHR("assets/php/ysearch_flat.php", ["\n", "\t"]);
this.oACDS.responseType = YAHOO.widget.DS_XHR.TYPE_FLAT;
this.oACDS.maxCacheEntries = 60;
this.oACDS.queryMatchSubset = true;
// Instantiate first AutoComplete
var myInput = document.getElementById('ysearchinput0');
var myContainer = document.getElementById('ysearchcontainer0');
this.oAutoComp0 = new YAHOO.widget.AutoComplete(myInput,myContainer,this.oACDS);
this.oAutoComp0.delimChar = ";";
this.oAutoComp0.queryDelay = 1;
this.oAutoComp0.formatResult = this.fnCustomFormatter;
// Instantiate second AutoComplete
this.oAutoComp1 = new YAHOO.widget.AutoComplete('ysearchinput1','ysearchcontainer1', this.oACDS);
this.oAutoComp1.delimChar = ";";
this.oAutoComp1.formatResult = this.fnCustomFormatter;
// Instantiate third AutoComplete
this.oAutoComp2 = new YAHOO.widget.AutoComplete('ysearchinput2','ysearchcontainer2', this.oACDS);
this.oAutoComp2.queryDelay = 0;
this.oAutoComp2.delimChar = ";";
this.oAutoComp2.prehighlightClassName = "yui-ac-prehighlight";
this.oAutoComp2.formatResult = this.fnCustomFormatter;
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

329
www/extras/yui/examples/autocomplete/ac_ysearch_flat_log.html Normal file
View file

File diff suppressed because one or more lines are too long

265
www/extras/yui/examples/autocomplete/ac_ysearch_json.html Normal file
View file

File diff suppressed because one or more lines are too long

107
www/extras/yui/examples/autocomplete/ac_ysearch_json_clean.html Normal file
View file

@ -0,0 +1,107 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Use AutoComplete to access the Yahoo! Search JSON API</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/connection/connection-min.js"></script>
<script type="text/javascript" src="../../build/json/json-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for centered example */
body, h1 { margin:0;padding:0; } /* needed for known issue with Dom.getXY() in safari for absolute elements in positioned containers */
#ysearch { text-align:center; }
#ysearchinput { position:static;width:20em; } /* to center, set static and explicit width: */
#ysearchcontainer { text-align:left;width:20em; } /* to center, set left-align and explicit width: */
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Use AutoComplete to access the Yahoo! Search JSON API</h1>
<div class="exampleIntro">
<p>This example's DataSource instance points to Yahoo! Search Web Services,
which returns JSON data via a simple PHP proxy. The DataSource schema will
parse the return data for fields named "Title", "Summary", and "Cache". In order
for the Yahoo! Search application to return
valid data, the DataSource property <code>scriptQueryAppend</code> is used
to pass along all the required query parameters, and the property
<code>queryMatchContains</code> has been enabled.</p>
<p>To achieve the shrink-wrapped, centered search module, custom CSS rules have
been applied, and the method <code>doBeforeExpandContainer</code> has been
customized to position the container directly below the input field.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<form action="http://search.yahoo.com/search" onsubmit="return YAHOO.example.ACJson.validateForm();">
<div id="ysearch">
<label>Yahoo! Search: </label>
<input id="ysearchinput" type="text" name="p">
<input id="ysearchsubmit" type="submit" value="Submit Query">
<div id="ysearchcontainer"></div>
</div>
</form>
<script type="text/javascript">
YAHOO.example.ACJson = new function(){
// Instantiate an XHR DataSource and define schema as an array:
// ["Multi-depth.object.notation.to.find.a.single.result.item",
// "Query Key",
// "Additional Param Name 1",
// ...
// "Additional Param Name n"]
this.oACDS = new YAHOO.widget.DS_XHR("assets/php/ysearch_proxy.php", ["ResultSet.Result","Title"]);
this.oACDS.queryMatchContains = true;
this.oACDS.scriptQueryAppend = "output=json&results=100"; // Needed for YWS
// Instantiate AutoComplete
this.oAutoComp = new YAHOO.widget.AutoComplete("ysearchinput","ysearchcontainer", this.oACDS);
this.oAutoComp.useShadow = true;
this.oAutoComp.formatResult = function(oResultItem, sQuery) {
return oResultItem[1].Title + " (" + oResultItem[1].Url + ")";
};
this.oAutoComp.doBeforeExpandContainer = function(oTextbox, oContainer, sQuery, aResults) {
var pos = YAHOO.util.Dom.getXY(oTextbox);
pos[1] += YAHOO.util.Dom.get(oTextbox).offsetHeight + 2;
YAHOO.util.Dom.setXY(oContainer,pos);
return true;
};
// Stub for form validation
this.validateForm = function() {
// Validation code goes here
return true;
};
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

269
www/extras/yui/examples/autocomplete/ac_ysearch_json_log.html Normal file
View file

File diff suppressed because one or more lines are too long

232
www/extras/yui/examples/autocomplete/ac_ysearch_xml.html Normal file
View file

File diff suppressed because one or more lines are too long

87
www/extras/yui/examples/autocomplete/ac_ysearch_xml_clean.html Normal file
View file

@ -0,0 +1,87 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Use AutoComplete to access the Yahoo! Search XML API</title>
<style type="text/css">
/*margin and padding on body element
can introduce errors in determining
element position and are not recommended;
we turn them off as a foundation for YUI
CSS treatments. */
body {
margin:0;
padding:0;
}
</style>
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="../../build/autocomplete/assets/skins/sam/autocomplete.css" />
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="../../build/animation/animation-min.js"></script>
<script type="text/javascript" src="../../build/connection/connection-min.js"></script>
<script type="text/javascript" src="../../build/autocomplete/autocomplete-min.js"></script>
<!--begin custom header content for this example-->
<style type="text/css">
/* custom styles for this example */
#ysearchautocomplete { margin-bottom:2em;width:25em; }
</style>
<!--end custom header content for this example-->
</head>
<body class=" yui-skin-sam">
<h1>Use AutoComplete to access the Yahoo! Search XML API</h1>
<div class="exampleIntro">
<p>This DataSource instance points to Yahoo! Search Web Services via a
simple PHP proxy. The DataSource schema is defined for XML data. In order
to be compatible with the Yahoo! Search application, the DataSource property
<code>queryMatchContains</code> is enabled, and the <code>scriptQueryAppend</code>
has been defined to pass in additional arguments.</p>
</div>
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
<form action="http://search.yahoo.com/search" onsubmit="return YAHOO.example.ACXml.validateForm();">
<h3>Yahoo! Search:</h3>
<div id="ysearchautocomplete">
<input id="ysearchinput" type="text" name="p">
<div id="ysearchcontainer"></div>
</div>
</form>
<script type="text/javascript">
YAHOO.example.ACXml = new function(){
// Instantiate an XHR DataSource and define schema as an array:
// ["Multi-depth.object.notation.to.find.a.single.result.item",
// "Query Key",
// "Additional Param Name 1",
// ...
// "Additional Param Name n"]
this.oACDS = new YAHOO.widget.DS_XHR("assets/php/ysearch_proxy.php", ["Result", "Title"]);
this.oACDS.responseType = YAHOO.widget.DS_XHR.TYPE_XML;
this.oACDS.queryMatchContains = true;
this.oACDS.scriptQueryAppend = "results=100"; // Needed for YWS
// Instantiate AutoComplete
this.oAutoComp = new YAHOO.widget.AutoComplete("ysearchinput","ysearchcontainer", this.oACDS);
// Stub for AutoComplete form validation
this.validateForm = function() {
// Validation code goes here
return true;
};
};
</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
</body>
</html>

236
www/extras/yui/examples/autocomplete/ac_ysearch_xml_log.html Normal file
View file

File diff suppressed because one or more lines are too long

116
www/extras/yui/examples/autocomplete/assets/js/states_jsfunction.js vendored Normal file
View file

@ -0,0 +1,116 @@
function getStates(sQuery) {
aResults = [];
if(sQuery && sQuery.length > 0) {
var charKey = sQuery.substring(0,1).toLowerCase();
var oResponse = dataset[charKey];
if(oResponse) {
for(var i = oResponse.length-1; i >= 0; i--) {
var sKey = oResponse[i].STATE;
var sKeyIndex = encodeURI(sKey.toLowerCase()).indexOf(sQuery.toLowerCase());
// Query found at the beginning of the key string for STARTSWITH
// returns an array of arrays where STATE is index=0, ABBR is index=1
if(sKeyIndex === 0) {
aResults.unshift([sKey, oResponse[i].ABBR]);
}
}
return aResults;
}
}
// Empty queries return all states
else {
for(var letter in dataset) {
var oResponse = dataset[letter];
for(var i = oResponse.length-1; i >= 0; i--) {
aResults.push([oResponse[i].STATE, oResponse[i].ABBR]);
}
}
return aResults;
}
}
//{"STATE" : "", "ABBR" : ""}
var dataset =
{'a': [{"STATE" : "Alabama", "ABBR" : "AL"},
{"STATE" : "Alaska", "ABBR" : "AK"},
{"STATE" : "Arizona", "ABBR" : "AZ"},
{"STATE" : "Arkansas", "ABBR" : "AR"}],
'b' : [
],
'c' : [
{"STATE" : "California", "ABBR" : "CA"},
{"STATE" : "Colorado", "ABBR" : "CO"},
{"STATE" : "Connecticut", "ABBR" : "CT"}],
'd' : [
{"STATE" : "Delaware", "ABBR" : "DE"}],
'e' : [
],
'f' : [
{"STATE" : "Florida", "ABBR" : "FL"}],
'g' : [
{"STATE" : "Georgia", "ABBR" : "GA"}],
'h' : [
{"STATE" : "Hawaii", "ABBR" : "HI"}],
'i' : [
{"STATE" : "Idaho", "ABBR" : "ID"},
{"STATE" : "Illinois", "ABBR" : "IL"},
{"STATE" : "Indiana", "ABBR" : "IN"},
{"STATE" : "Iowa", "ABBR" : "IA"}],
'j' : [
],
'k' : [
{"STATE" : "Kansas", "ABBR" : "KS"},
{"STATE" : "Kentucky", "ABBR" : "KY"}],
'l' : [
{"STATE" : "Louisiana", "ABBR" : "LA"}],
'm' : [
{"STATE" : "Maine", "ABBR" : "ME"},
{"STATE" : "Maryland", "ABBR" : "MD"},
{"STATE" : "Massachusetts", "ABBR" : "MA"},
{"STATE" : "Michigan", "ABBR" : "MI"},
{"STATE" : "Minnesota", "ABBR" : "MN"},
{"STATE" : "Mississippi", "ABBR" : "MS"},
{"STATE" : "Missouri", "ABBR" : "MO"},
{"STATE" : "Montana", "ABBR" : "MT"}],
'n' : [
{"STATE" : "Nebraska", "ABBR" : "NE"},
{"STATE" : "Nevada", "ABBR" : "NV"},
{"STATE" : "New Hampshire", "ABBR" : "NH"},
{"STATE" : "New Jersey", "ABBR" : "NJ"},
{"STATE" : "New Mexico", "ABBR" : "NM"},
{"STATE" : "New York", "ABBR" : "NY"},
{"STATE" : "North Dakota", "ABBR" : "ND"},
{"STATE" : "North Carolina", "ABBR" : "NC"}],
'o' : [
{"STATE" : "Ohio", "ABBR" : "OH"},
{"STATE" : "Oklahoma", "ABBR" : "OK"},
{"STATE" : "Oregon", "ABBR" : "OR"}],
'p' : [
{"STATE" : "Pennsylvania", "ABBR" : "PA"}],
'q' : [
],
'r' : [
{"STATE" : "Rhode Island", "ABBR" : "RI"}],
's' : [
{"STATE" : "South Carolina", "ABBR" : "SC"},
{"STATE" : "South Dakota", "ABBR" : "SD"}],
't' : [
{"STATE" : "Tennessee", "ABBR" : "TN"},
{"STATE" : "Texas", "ABBR" : "TX"}],
'u' : [
{"STATE" : "Utah", "ABBR" : "UT"}],
'v' : [
{"STATE" : "Vermont", "ABBR" : "VT"},
{"STATE" : "Virginia", "ABBR" : "VA"}],
'w' : [
{"STATE" : "Washington", "ABBR" : "WA"},
{"STATE" : "West Virginia", "ABBR" : "WV"},
{"STATE" : "Wisconsin", "ABBR" : "WI"},
{"STATE" : "Wyoming", "ABBR" : "WY"}],
'x' : [
],
'y' : [
],
'z' : [
]
};

33
www/extras/yui/examples/autocomplete/assets/php/flickr_proxy.php Normal file
View file

@ -0,0 +1,33 @@
<?php
// Yahoo! proxy
// Hard-code hostname and path:
define ('PATH', 'http://www.flickr.com/services/rest/');
// Get all query params
$query = "?";
foreach ($_GET as $key => $value) {
$query .= urlencode($key)."=".urlencode($value)."&";
}
foreach ($_POST as $key => $value) {
$query .= $key."=".$value."&";
}
$query .= "&api_key=30cc0cf363608a1ffa3fc1631854c8b8";
$url = PATH.$query;
// Open the Curl session
$session = curl_init($url);
// Don't return HTTP headers. Do return the contents of the call
curl_setopt($session, CURLOPT_HEADER, false);
curl_setopt($session, CURLOPT_RETURNTRANSFER, true);
// Make the call
$response = curl_exec($session);
header("Content-Type: text/xml");
echo $response;
curl_close($session);
?>

44109
www/extras/yui/examples/autocomplete/assets/php/ysearch_flat.php Normal file
View file

File diff suppressed because it is too large Load diff

45
www/extras/yui/examples/autocomplete/assets/php/ysearch_proxy.php Normal file
View file

@ -0,0 +1,45 @@
<?php
// Yahoo! proxy
// Hard-code hostname and path:
// search = http://api.search.yahoo.com/WebSearchService/V1/webSearch
// api.local
// api.travel
define ('PATH', 'http://api.search.yahoo.com/WebSearchService/V1/webSearch');
$type = "text/xml";
// Get all query params
$query = "?";
foreach ($_GET as $key => $value) {
if(($key == "output") && ($value == "json")) {
$type = "application/json";
}
$query .= urlencode($key)."=".urlencode($value)."&";
}
foreach ($_POST as $key => $value) {
if(($key == "output") && ($value == "json")) {
$type = "application/json";
}
$query .= $key."=".$value."&";
}
$query .= "appid=jennyhan_ac";
$url = PATH.$query;
// Open the Curl session
$session = curl_init($url);
// Don't return HTTP headers. Do return the contents of the call
curl_setopt($session, CURLOPT_HEADER, false);
curl_setopt($session, CURLOPT_RETURNTRANSFER, true);
// Make the call
$response = curl_exec($session);
header("Content-Type: ".$type);
echo $response;
curl_close($session);
?>

86
www/extras/yui/examples/autocomplete/index.html Normal file
View file

File diff suppressed because one or more lines are too long