Export 0.1.63

[platform/framework/web/web-ui-fw.git] / src / widgets / searchbar / js / jquery.mobile.tizen.searchbar.js

diff --git a/src/widgets/searchbar/js/jquery.mobile.tizen.searchbar.js b/src/widgets/searchbar/js/jquery.mobile.tizen.searchbar.js
index 955fcf1..a004159 100755 (executable)
--- a/src/widgets/searchbar/js/jquery.mobile.tizen.searchbar.js
+++ b/src/widgets/searchbar/js/jquery.mobile.tizen.searchbar.js
@@ -61,6 +61,20 @@
  *             </div>
 */
 
+/**
+       @class SearchBar
+       The search bar widget is used to search for page content. This widget can be placed in the header, option header, or page content.
+
+       To add a search bar widget to the application, use the following code:
+
+               <label for="search-basic">Search Input:</label>
+               <input type="search" name="search" id="searc-basic" value="" data-mini="true" />
+
+       Tizen supports many search bar options as described in the jQueryMobile documentation for search bar options.
+       The search bar can define callbacks for events as described in the jQueryMobile documentation for search bar events.
+       You can use methods with the search bar as described in the jQueryMobile documentation for search bar methods.
+*/
+
 (function ( $, undefined ) {
 
        $.widget( "tizen.searchbar", $.mobile.widget, {
@@ -76,7 +90,6 @@
                                themeclass  = " ui-body-" + theme,
                                focusedEl,
                                clearbtn,
-                               searchicon,
                                cancelbtn,
                                defaultText,
                                defaultTextClass,
@@ -84,6 +97,7 @@
                                newClassName,
                                newStyle,
                                newDiv,
+                               searchimage,
                                inputedText;
 
                        function toggleClear() {
@@ -96,23 +110,12 @@
                                focusedEl
                                        .addClass( "ui-input-search-default" )
                                        .removeClass( "ui-input-search-wide" );
-                               cancelbtn
-                                       .addClass( "ui-btn-cancel-show" )
-                                       .removeClass( "ui-btn-cancel-hide" );
-                               searchicon.hide();
                        }
 
                        function hideCancel() {
                                focusedEl
                                        .addClass( "ui-input-search-wide" )
                                        .removeClass( "ui-input-search-default" );
-                               cancelbtn
-                                       .addClass( "ui-btn-cancel-hide" )
-                                       .removeClass( "ui-btn-cancel-show" );
-
-                               if ( input.val() == "" ) {
-                                       searchicon.show();
-                               }
 
                                toggleClear();
                        }
@@ -164,40 +167,7 @@
                        //SLP --start search bar with cancel button
                        focusedEl.wrapAll( "<div class='input-search-bar'></div>" );
 
-                       searchicon = $("<div class='ui-image-search ui-image-searchfield'></div>")
-                               .bind('click', function ( event ) {
-                                       if ( input.attr( "disabled" ) == "disabled" ) {
-                                               return false;
-                                       }
-                                       searchicon.hide();
-
-                                       input
-                                               .blur()
-                                               .focus();
-                               } )
-                               .appendTo( focusedEl );
-
-                       cancelbtn = $( "<a href='#' class='ui-input-cancel' title='clear text'>Cancel</a>" )
-                               .bind('click', function ( event ) {
-                                       if ( input.attr( "disabled" ) == "disabled" ) {
-                                               return false;
-                                       }
-                                       event.preventDefault();
-                                       event.stopPropagation();
-
-                                       input
-                                               .val( "" )
-                                               .blur()
-                                               .trigger( "change" );
-
-                                       hideCancel();
-                               } )
-                               .appendTo( focusedEl.parent() )
-                               .buttonMarkup( {
-                                       iconpos: "cancel",
-                                       corners: true,
-                                       shadow: true
-                               } );
+                       searchimage = $("<div class='ui-image-search'></div>").appendTo( focusedEl );
 
                        // Input Focused
                        input
@@ -212,30 +182,6 @@
                                        focusedEl.removeClass( $.mobile.focusClass );
                                });
 
-                       // Input Blured
-                       /* When user touch on page, it's same to blur */
-                       /* FIXME : if there is no problem, please remove this codes..
-                       $( "div.input-search-bar" ).tap( function ( event ) {
-                               if ( input.attr( "disabled" ) == "disabled" ) {
-                                       return false;
-                               }
-                               input.focus();
-                               event.stopPropagation();
-                       } );
-
-                       var currentPage = input.closest( ".ui-page" );
-                       $( currentPage ).bind("tap", function ( e ) {
-                               if ( input.attr( "disabled" ) == "disabled" ) {
-                                       return;
-                               }
-
-                               if ( $( input ).is( ":focus" ) ) {
-                                       focusedEl.removeClass( "ui-focus" );
-                                       hideCancel();
-                                       input.blur();
-                               }
-                       } );*/
-
                        // Default Text
                        defaultText = input.jqmData( "default-text" );
 
@@ -276,22 +222,20 @@
                                        } );
                        }
 
-                       if ( input.val() ) {
-                               searchicon.hide();
+                       if ( !input.attr("placeholder") ) {
+                               input.attr( "placeholder", "Search" );
                        }
                },
 
                disable: function () {
                        this.element.attr( "disabled", true );
                        this.element.parent().addClass( "ui-disabled" );
-                       this.element.parent().parent().find(".ui-input-cancel").addClass( "ui-disabled" );
                        $( this.element ).blur();
                },
 
                enable: function () {
                        this.element.attr( "disabled", false );
                        this.element.parent().removeClass( "ui-disabled" );
-                       this.element.parent().parent().find(".ui-input-cancel").removeClass( "ui-disabled" );
                        $( this.element ).focus();
                }
        } );