Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html
URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,83 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Accordion - Sortable</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.mouse.js"></script> + <script src="../../ui/jquery.ui.sortable.js"></script> + <script src="../../ui/jquery.ui.accordion.js"></script> + <link rel="stylesheet" href="../demos.css"> + <script> + $(function() { + var stop = false; + $( "#accordion h3" ).click(function( event ) { + if ( stop ) { + event.stopImmediatePropagation(); + event.preventDefault(); + stop = false; + } + }); + $( "#accordion" ) + .accordion({ + header: "> div > h3" + }) + .sortable({ + axis: "y", + handle: "h3", + stop: function() { + stop = true; + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div id="accordion"> + <div> + <h3><a href="#">Section 1</a></h3> + <div> + <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p> + </div> + </div> + <div> + <h3><a href="#">Section 2</a></h3> + <div> + <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p> + </div> + </div> + <div> + <h3><a href="#">Section 3</a></h3> + <div> + <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p> + <ul> + <li>List item one</li> + <li>List item two</li> + <li>List item three</li> + </ul> + </div> + </div> + <div> + <h3><a href="#">Section 4</a></h3> + <div> + <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p> + </div> + </div> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>Drag the header to re-order panels.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/accordion/sortable.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects - addClass demo</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.effects.core.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .toggler { width: 500px; height: 200px; position: relative; } + #button { padding: .5em 1em; text-decoration: none; } + #effect { width: 240px; padding: 1em; font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; } + .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; } + </style> + <script> + $(function() { + $( "#button" ).click(function() { + $( "#effect" ).addClass( "newClass", 1000, callback ); + return false; + }); + + function callback() { + setTimeout(function() { + $( "#effect" ).removeClass( "newClass" ); + }, 1500 ); + } + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="toggler"> + <div id="effect" class=" ui-corner-all"> + Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. + </div> +</div> + +<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>This demo adds a class which animates: text-indent, letter-spacing, width, height, padding, margin, and font-size.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/default.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects Demos</title> + <link rel="stylesheet" href="../demos.css"> +</head> +<body> + +<div class="demos-nav"> + <h4>Examples</h4> + <ul> + <li class="demo-config-on"><a href="default.html">Default functionality</a></li> + </ul> +</div> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/addClass/index.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects - Animate demo</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.effects.core.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .toggler { width: 500px; height: 200px; position: relative; } + #button { padding: .5em 1em; text-decoration: none; } + #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; background: #fff; } + #effect h3 { margin: 0; padding: 0.4em; text-align: center; } + </style> + <script> + $(function() { + $( "#button" ).toggle( + function() { + $( "#effect" ).animate({ + backgroundColor: "#aa0000", + color: "#fff", + width: 500 + }, 1000 ); + }, + function() { + $( "#effect" ).animate({ + backgroundColor: "#fff", + color: "#000", + width: 240 + }, 1000 ); + } + ); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="toggler"> + <div id="effect" class="ui-widget-content ui-corner-all"> + <h3 class="ui-widget-header ui-corner-all">Animate</h3> + <p> + Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi. + </p> + </div> +</div> + +<a href="#" id="button" class="ui-state-default ui-corner-all">Toggle Effect</a> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>Click the button above to preview the effect.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/default.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects Demos</title> + <link rel="stylesheet" href="../demos.css"> +</head> +<body> + +<div class="demos-nav"> + <h4>Examples</h4> + <ul> + <li class="demo-config-on"><a href="default.html">Default functionality</a></li> + </ul> +</div> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/animate/index.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,71 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Categories</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete-category { + font-weight: bold; + padding: .2em .4em; + margin: .8em 0 .2em; + line-height: 1.5; + } + </style> + <script> + $.widget( "custom.catcomplete", $.ui.autocomplete, { + _renderMenu: function( ul, items ) { + var self = this, + currentCategory = ""; + $.each( items, function( index, item ) { + if ( item.category != currentCategory ) { + ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" ); + currentCategory = item.category; + } + self._renderItem( ul, item ); + }); + } + }); + </script> + <script> + $(function() { + var data = [ + { label: "anders", category: "" }, + { label: "andreas", category: "" }, + { label: "antal", category: "" }, + { label: "annhhx10", category: "Products" }, + { label: "annk K12", category: "Products" }, + { label: "annttop C13", category: "Products" }, + { label: "anders andersson", category: "People" }, + { label: "andreas andersson", category: "People" }, + { label: "andreas johnson", category: "People" } + ]; + + $( "#search" ).catcomplete({ + delay: 0, + source: data + }); + }); + </script> +</head> +<body> + +<div class="demo"> + <label for="search">Search: </label> + <input id="search" /> +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>A categorized search result. Try typing "a" or "n".</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/categories.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,163 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Combobox</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.button.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-button { margin-left: -1px; } + .ui-button-icon-only .ui-button-text { padding: 0.35em; } + .ui-autocomplete-input { margin: 0; padding: 0.48em 0 0.47em 0.45em; } + </style> + <script> + (function( $ ) { + $.widget( "ui.combobox", { + _create: function() { + var self = this, + select = this.element.hide(), + selected = select.children( ":selected" ), + value = selected.val() ? selected.text() : ""; + var input = $( "<input>" ) + .insertAfter( select ) + .val( value ) + .autocomplete({ + delay: 0, + minLength: 0, + source: function( request, response ) { + var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" ); + response( select.children( "option" ).map(function() { + var text = $( this ).text(); + if ( this.value && ( !request.term || matcher.test(text) ) ) + return { + label: text.replace( + new RegExp( + "(?![^&;]+;)(?!<[^<>]*)(" + + $.ui.autocomplete.escapeRegex(request.term) + + ")(?![^<>]*>)(?![^&;]+;)", "gi" + ), "<strong>$1</strong>" ), + value: text, + option: this + }; + }) ); + }, + select: function( event, ui ) { + ui.item.option.selected = true; + self._trigger( "selected", event, { + item: ui.item.option + }); + }, + change: function( event, ui ) { + if ( !ui.item ) { + var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ), + valid = false; + select.children( "option" ).each(function() { + if ( this.value.match( matcher ) ) { + this.selected = valid = true; + return false; + } + }); + if ( !valid ) { + // remove invalid value, as it didn't match anything + $( this ).val( "" ); + select.val( "" ); + return false; + } + } + } + }) + .addClass( "ui-widget ui-widget-content ui-corner-left" ); + + input.data( "autocomplete" )._renderItem = function( ul, item ) { + return $( "<li></li>" ) + .data( "item.autocomplete", item ) + .append( "<a>" + item.label + "</a>" ) + .appendTo( ul ); + }; + + $( "<button> </button>" ) + .attr( "tabIndex", -1 ) + .attr( "title", "Show All Items" ) + .insertAfter( input ) + .button({ + icons: { + primary: "ui-icon-triangle-1-s" + }, + text: false + }) + .removeClass( "ui-corner-all" ) + .addClass( "ui-corner-right ui-button-icon" ) + .click(function() { + // close if already visible + if ( input.autocomplete( "widget" ).is( ":visible" ) ) { + input.autocomplete( "close" ); + return; + } + + // pass empty string as value to search for, displaying all results + input.autocomplete( "search", "" ); + input.focus(); + }); + } + }); + })( jQuery ); + + $(function() { + $( "#combobox" ).combobox(); + $( "#toggle" ).click(function() { + $( "#combobox" ).toggle(); + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label>Your preferred programming language: </label> + <select id="combobox"> + <option value="">Select one...</option> + <option value="ActionScript">ActionScript</option> + <option value="AppleScript">AppleScript</option> + <option value="Asp">Asp</option> + <option value="BASIC">BASIC</option> + <option value="C">C</option> + <option value="C++">C++</option> + <option value="Clojure">Clojure</option> + <option value="COBOL">COBOL</option> + <option value="ColdFusion">ColdFusion</option> + <option value="Erlang">Erlang</option> + <option value="Fortran">Fortran</option> + <option value="Groovy">Groovy</option> + <option value="Haskell">Haskell</option> + <option value="Java">Java</option> + <option value="JavaScript">JavaScript</option> + <option value="Lisp">Lisp</option> + <option value="Perl">Perl</option> + <option value="PHP">PHP</option> + <option value="Python">Python</option> + <option value="Ruby">Ruby</option> + <option value="Scala">Scala</option> + <option value="Scheme">Scheme</option> + </select> +</div> +<button id="toggle">Show underlying select</button> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>A custom widget built by composition of Autocomplete and Button. You can either type something into the field to get filtered suggestions based on your input, or use the button to get the full list of selections.</p> +<p>The input is read from an existing select-element for progressive enhancement, passed to Autocomplete with a customized source-option.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/combobox.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,95 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Custom data and display</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + #project-label { + display: block; + font-weight: bold; + margin-bottom: 1em; + } + #project-icon { + float: left; + height: 32px; + width: 32px; + } + #project-description { + margin: 0; + padding: 0; + } + </style> + <script> + $(function() { + var projects = [ + { + value: "jquery", + label: "jQuery", + desc: "the write less, do more, JavaScript library", + icon: "jquery_32x32.png" + }, + { + value: "jquery-ui", + label: "jQuery UI", + desc: "the official user interface library for jQuery", + icon: "jqueryui_32x32.png" + }, + { + value: "sizzlejs", + label: "Sizzle JS", + desc: "a pure-JavaScript CSS selector engine", + icon: "sizzlejs_32x32.png" + } + ]; + + $( "#project" ).autocomplete({ + minLength: 0, + source: projects, + focus: function( event, ui ) { + $( "#project" ).val( ui.item.label ); + return false; + }, + select: function( event, ui ) { + $( "#project" ).val( ui.item.label ); + $( "#project-id" ).val( ui.item.value ); + $( "#project-description" ).html( ui.item.desc ); + $( "#project-icon" ).attr( "src", "images/" + ui.item.icon ); + + return false; + } + }) + .data( "autocomplete" )._renderItem = function( ul, item ) { + return $( "<li></li>" ) + .data( "item.autocomplete", item ) + .append( "<a>" + item.label + "<br>" + item.desc + "</a>" ) + .appendTo( ul ); + }; + }); + </script> +</head> +<body> + +<div class="demo"> + <div id="project-label">Select a project (type "j" for a start):</div> + <img id="project-icon" src="images/transparent_1x1.png" class="ui-state-default"/> + <input id="project"/> + <input type="hidden" id="project-id"/> + <p id="project-description"></p> +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>You can use your own custom data formats and displays by simply overriding the default focus and select actions.</p> +<p>Try typing "j" to get a list of projects or just press the down arrow.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/custom-data.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,64 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Default functionality</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <script> + $(function() { + var availableTags = [ + "ActionScript", + "AppleScript", + "Asp", + "BASIC", + "C", + "C++", + "Clojure", + "COBOL", + "ColdFusion", + "Erlang", + "Fortran", + "Groovy", + "Haskell", + "Java", + "JavaScript", + "Lisp", + "Perl", + "PHP", + "Python", + "Ruby", + "Scala", + "Scheme" + ]; + $( "#tags" ).autocomplete({ + source: availableTags + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="tags">Tags: </label> + <input id="tags" /> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p> +<p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/default.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,62 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Accent folding</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <script> + $(function() { + var names = [ "Jörn Zaefferer", "Scott González", "John Resig" ]; + + var accentMap = { + "á": "a", + "ö": "o" + }; + var normalize = function( term ) { + var ret = ""; + for ( var i = 0; i < term.length; i++ ) { + ret += accentMap[ term.charAt(i) ] || term.charAt(i); + } + return ret; + }; + + $( "#developer" ).autocomplete({ + source: function( request, response ) { + var matcher = new RegExp( $.ui.autocomplete.escapeRegex( request.term ), "i" ); + response( $.grep( names, function( value ) { + value = value.label || value.value || value; + return matcher.test( value ) || matcher.test( normalize( value ) ); + }) ); + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <form> + <label for="developer">Developer: </label> + <input id="developer" /> + </form> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>The autocomplete field uses a custom source option which will match results that have accented characters even when the text field doesn't contain accented characters. However if the you type in accented characters in the text field it is smart enough not to show results that aren't accented.</p> +<p>Try typing "Jo" to see "John" and "Jörn", then type "Jö" to see only "Jörn".</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/folding.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/jquery_32x32.png URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/jquery_32x32.png?rev=1033976&view=auto ============================================================================== Binary file - no diff available. Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/jquery_32x32.png ------------------------------------------------------------------------------ svn:mime-type = image/png Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/jqueryui_32x32.png URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/jqueryui_32x32.png?rev=1033976&view=auto ============================================================================== Binary file - no diff available. Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/jqueryui_32x32.png ------------------------------------------------------------------------------ svn:mime-type = image/png Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/sizzlejs_32x32.png URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/sizzlejs_32x32.png?rev=1033976&view=auto ============================================================================== Binary file - no diff available. Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/sizzlejs_32x32.png ------------------------------------------------------------------------------ svn:mime-type = image/png Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/transparent_1x1.png URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/transparent_1x1.png?rev=1033976&view=auto ============================================================================== Binary file - no diff available. Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/transparent_1x1.png ------------------------------------------------------------------------------ svn:mime-type = image/png Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/ui-anim_basic_16x16.gif URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/ui-anim_basic_16x16.gif?rev=1033976&view=auto ============================================================================== Binary file - no diff available. Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/images/ui-anim_basic_16x16.gif ------------------------------------------------------------------------------ svn:mime-type = image/gif Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete Demos</title> + <link rel="stylesheet" href="../demos.css"> +</head> +<body> + <div class="demos-nav"> + <h4>Examples</h4> + <ul> + <li class="demo-config-on"><a href="default.html">Default functionality</a></li> + <li><a href="remote.html">Remote datasource</a></li> + <li><a href="remote-with-cache.html">Remote with caching</a></li> + <li><a href="remote-jsonp.html">Remote JSONP datasource</a></li> + <li><a href="maxheight.html">Scrollable results</a></li> + <li><a href="combobox.html">Combobox</a></li> + <li><a href="custom-data.html">Custom data and display</a></li> + <li><a href="xml.html">XML data parsed once</a></li> + <li><a href="categories.html">Categories</a></li> + <li><a href="folding.html">Accent folding</a></li> + <li><a href="multiple.html">Multiple values</a></li> + <li><a href="multiple-remote.html">Multiple, remote</a></li> + </ul> + </div> +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/index.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml Thu Nov 11 16:04:58 2010 @@ -0,0 +1,114 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<geonames style="MEDIUM"> +<totalResultsCount>6987</totalResultsCount> +<geoname> +<name>London</name> +<lat>51.5084152563931</lat> +<lng>-0.125532746315002</lng> +<geonameId>2643743</geonameId> +<countryCode>GB</countryCode> +<countryName>United Kingdom</countryName> + +<fcl>P</fcl> +<fcode>PPLC</fcode> +</geoname> +<geoname> +<name>London</name> +<lat>42.983389283</lat> +<lng>-81.233042387</lng> +<geonameId>6058560</geonameId> +<countryCode>CA</countryCode> +<countryName>Canada</countryName> + +<fcl>P</fcl> +<fcode>PPL</fcode> +</geoname> +<geoname> +<name>East London</name> +<lat>-33.0152850934643</lat> +<lng>27.9116249084473</lng> +<geonameId>1006984</geonameId> +<countryCode>ZA</countryCode> +<countryName>South Africa</countryName> + +<fcl>P</fcl> +<fcode>PPL</fcode> +</geoname> +<geoname> +<name>City</name> +<lat>51.5133363996235</lat> +<lng>-0.0890064239501953</lng> +<geonameId>2643744</geonameId> +<countryCode>GB</countryCode> +<countryName>United Kingdom</countryName> + +<fcl>A</fcl> +<fcode>ADM2</fcode> +</geoname> +<geoname> +<name>London</name> +<lat>37.1289771</lat> +<lng>-84.0832646</lng> +<geonameId>4298960</geonameId> +<countryCode>US</countryCode> +<countryName>United States</countryName> + +<fcl>P</fcl> +<fcode>PPL</fcode> +</geoname> +<geoname> +<name>The Tower of London</name> +<lat>51.5082349601834</lat> +<lng>-0.0763034820556641</lng> +<geonameId>6286786</geonameId> +<countryCode>GB</countryCode> +<countryName>United Kingdom</countryName> + +<fcl>S</fcl> +<fcode>CSTL</fcode> +</geoname> +<geoname> +<name>London Reefs</name> +<lat>8.85</lat> +<lng>112.5333333</lng> +<geonameId>1879967</geonameId> +<countryCode> </countryCode> +<countryName> </countryName> + +<fcl>U</fcl> +<fcode>RFSU</fcode> +</geoname> +<geoname> +<name>Greater London</name> +<lat>51.5</lat> +<lng>-0.1666667</lng> +<geonameId>2648110</geonameId> +<countryCode>GB</countryCode> +<countryName>United Kingdom</countryName> + +<fcl>A</fcl> +<fcode>ADM2</fcode> +</geoname> +<geoname> +<name>London</name> +<lat>46.1666667</lat> +<lng>6.0166667</lng> +<geonameId>2661811</geonameId> +<countryCode>CH</countryCode> +<countryName>Switzerland</countryName> + +<fcl>H</fcl> +<fcode>STM</fcode> +</geoname> +<geoname> +<name>London Borough of Islington</name> +<lat>51.5333333</lat> +<lng>-0.1333333</lng> +<geonameId>3333156</geonameId> +<countryCode>GB</countryCode> +<countryName>United Kingdom</countryName> + +<fcl>A</fcl> +<fcode>ADM2</fcode> +</geoname> +</geonames> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/london.xml ------------------------------------------------------------------------------ svn:mime-type = text/xml Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,75 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Scrollable results</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete { + max-height: 100px; + overflow-y: auto; + } + /* IE 6 doesn't support max-height + * we use height instead, but this forces the menu to always be this tall + */ + * html .ui-autocomplete { + height: 100px; + } + </style> + <script> + $(function() { + var availableTags = [ + "ActionScript", + "AppleScript", + "Asp", + "BASIC", + "C", + "C++", + "Clojure", + "COBOL", + "ColdFusion", + "Erlang", + "Fortran", + "Groovy", + "Haskell", + "Java", + "JavaScript", + "Lisp", + "Perl", + "PHP", + "Python", + "Ruby", + "Scala", + "Scheme" + ]; + $( "#tags" ).autocomplete({ + source: availableTags + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="tags">Tags: </label> + <input id="tags" /> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>When displaying a long list of options, you can simply set the max-height for the autocomplete menu to prevent the menu from growing too large. Try typing "a" or "s" above to get a long list of results that you can scroll through.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/maxheight.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,76 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Multiple, remote</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } + </style> + <script> + $(function() { + function split( val ) { + return val.split( /,\s*/ ); + } + function extractLast( term ) { + return split( term ).pop(); + } + + $( "#birds" ).autocomplete({ + source: function( request, response ) { + $.getJSON( "search.php", { + term: extractLast( request.term ) + }, response ); + }, + search: function() { + // custom minLength + var term = extractLast( this.value ); + if ( term.length < 2 ) { + return false; + } + }, + focus: function() { + // prevent value inserted on focus + return false; + }, + select: function( event, ui ) { + var terms = split( this.value ); + // remove the current input + terms.pop(); + // add the selected item + terms.push( ui.item.value ); + // add placeholder to get the comma-and-space at the end + terms.push( "" ); + this.value = terms.join( ", " ); + return false; + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="birds">Birds: </label> + <input id="birds" size="50" /> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>Usage: Enter at least two characters to get bird name suggestions. Select a value to continue adding more names.</p> +<p>This is an example showing how to use the source-option along with some events to enable autocompleting multiple values into a single field.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple-remote.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,91 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Multiple values</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <script> + $(function() { + var availableTags = [ + "ActionScript", + "AppleScript", + "Asp", + "BASIC", + "C", + "C++", + "Clojure", + "COBOL", + "ColdFusion", + "Erlang", + "Fortran", + "Groovy", + "Haskell", + "Java", + "JavaScript", + "Lisp", + "Perl", + "PHP", + "Python", + "Ruby", + "Scala", + "Scheme" + ]; + function split( val ) { + return val.split( /,\s*/ ); + } + function extractLast( term ) { + return split( term ).pop(); + } + + $( "#tags" ).autocomplete({ + minLength: 0, + source: function( request, response ) { + // delegate back to autocomplete, but extract the last term + response( $.ui.autocomplete.filter( + availableTags, extractLast( request.term ) ) ); + }, + focus: function() { + // prevent value inserted on focus + return false; + }, + select: function( event, ui ) { + var terms = split( this.value ); + // remove the current input + terms.pop(); + // add the selected item + terms.push( ui.item.value ); + // add placeholder to get the comma-and-space at the end + terms.push( "" ); + this.value = terms.join( ", " ); + return false; + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="tags">Tag programming languages: </label> + <input id="tags" size="50" /> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>Usage: Type something, eg. "j" to see suggestions for tagging with programming languages. Select a value, then continue typing to add more.</p> +<p>This is an example showing how to use the source-option along with some events to enable autocompleting multiple values into a single field.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/multiple.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,86 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Remote JSONP datasource</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } + #city { width: 25em; } + </style> + <script> + $(function() { + function log( message ) { + $( "<div/>" ).text( message ).prependTo( "#log" ); + $( "#log" ).attr( "scrollTop", 0 ); + } + + $( "#city" ).autocomplete({ + source: function( request, response ) { + $.ajax({ + url: "http://ws.geonames.org/searchJSON", + dataType: "jsonp", + data: { + featureClass: "P", + style: "full", + maxRows: 12, + name_startsWith: request.term + }, + success: function( data ) { + response( $.map( data.geonames, function( item ) { + return { + label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName, + value: item.name + } + })); + } + }); + }, + minLength: 2, + select: function( event, ui ) { + log( ui.item ? + "Selected: " + ui.item.label : + "Nothing selected, input was " + this.value); + }, + open: function() { + $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" ); + }, + close: function() { + $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" ); + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="city">Your city: </label> + <input id="city" /> + Powered by <a href="http://geonames.org">geonames.org</a> +</div> + +<div class="ui-widget" style="margin-top:2em; font-family:Arial"> + Result: + <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are cities, displayed when at least two characters are entered into the field.</p> +<p>In this case, the datasource is the <a href="http://geonames.org">geonames.org webservice</a>. While only the city name itself ends up in the input after selecting an element, more info is displayed in the suggestions to help find the right entry. That data is also available in callbacks, as illustrated by the Result area below the input.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-jsonp.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Remote with caching</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } + </style> + <script> + $(function() { + var cache = {}, + lastXhr; + $( "#birds" ).autocomplete({ + minLength: 2, + source: function( request, response ) { + var term = request.term; + if ( term in cache ) { + response( cache[ term ] ); + return; + } + + lastXhr = $.getJSON( "search.php", request, function( data, status, xhr ) { + cache[ term ] = data; + if ( xhr === lastXhr ) { + response( data ); + } + }); + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="birds">Birds: </label> + <input id="birds" /> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are bird names, displayed when at least two characters are entered into the field.</p> +<p>Similar to the remote datasource demo, though this adds some local caching to improve performance. The cache here saves just one query, and could be extended to cache multiple values, one for each term.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote-with-cache.html ------------------------------------------------------------------------------ svn:mime-type = text/html Added: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html URL: http://svn.apache.org/viewvc/ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html?rev=1033976&view=auto ============================================================================== --- ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html (added) +++ ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html Thu Nov 11 16:04:58 2010 @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Autocomplete - Remote datasource</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.4.3.js"></script> + <script src="../../ui/jquery.ui.core.js"></script> + <script src="../../ui/jquery.ui.widget.js"></script> + <script src="../../ui/jquery.ui.position.js"></script> + <script src="../../ui/jquery.ui.autocomplete.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } + </style> + <script> + $(function() { + function log( message ) { + $( "<div/>" ).text( message ).prependTo( "#log" ); + $( "#log" ).attr( "scrollTop", 0 ); + } + + $( "#birds" ).autocomplete({ + source: "search.php", + minLength: 2, + select: function( event, ui ) { + log( ui.item ? + "Selected: " + ui.item.value + " aka " + ui.item.id : + "Nothing selected, input was " + this.value ); + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + +<div class="ui-widget"> + <label for="birds">Birds: </label> + <input id="birds" /> +</div> + +<div class="ui-widget" style="margin-top:2em; font-family:Arial"> + Result: + <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div> +</div> + +</div><!-- End demo --> + + + +<div class="demo-description"> +<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are bird names, displayed when at least two characters are entered into the field.</p> +<p>The datasource is a server-side script which returns JSON data, specified via a simple URL for the source-option. In addition, the minLength-option is set to 2 to avoid queries that would return too many results and the select-event is used to display some feedback.</p> +</div><!-- End demo-description --> + +</body> +</html> Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html ------------------------------------------------------------------------------ svn:eol-style = native Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html ------------------------------------------------------------------------------ svn:keywords = Date Rev Author URL Id Propchange: ofbiz/branches/jquery/framework/images/webapp/images/jquery/ui/development-bundle/demos/autocomplete/remote.html ------------------------------------------------------------------------------ svn:mime-type = text/html |
Free forum by Nabble | Edit this page |