libs/js/jquery-mobile-1.1.0/js/jquery.mobile.forms.button.js

   1 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
   2 //>>description: Custom-styled native input/buttons
   3 //>>label: Buttons: Input or button-based
   4 //>>group: Forms
   5 //>>css: ../css/themes/default/jquery.mobile.theme.css,../css/structure/jquery.mobile.button.css
   6
   7 define( [ "jquery", "./jquery.mobile.widget", "./jquery.mobile.buttonMarkup"  ], function( $ ) {
   8 //>>excludeEnd("jqmBuildExclude");
   9 (function( $, undefined ) {
  10
  11 $.widget( "mobile.button", $.mobile.widget, {
  12         options: {
  13                 theme: null,
  14                 icon: null,
  15                 iconpos: null,
  16                 inline: false,
  17                 corners: true,
  18                 shadow: true,
  19                 iconshadow: true,
  20                 initSelector: "button, [type='button'], [type='submit'], [type='reset'], [type='image']",
  21                 mini: false
  22         },
  23         _create: function() {
  24                 var $el = this.element,
  25                         $button,
  26                         o = this.options,
  27                         type,
  28                         name,
  29                         classes = "",
  30                         $buttonPlaceholder;
  31
  32                 // if this is a link, check if it's been enhanced and, if not, use the right function
  33                 if( $el[ 0 ].tagName === "A" ) {
  34                         !$el.hasClass( "ui-btn" ) && $el.buttonMarkup();
  35                         return;
  36                 }
  37
  38                 // get the inherited theme
  39                 // TODO centralize for all widgets
  40                 if ( !this.options.theme ) {
  41                         this.options.theme = $.mobile.getInheritedTheme( this.element, "c" );
  42                 }
  43
  44                 // TODO: Post 1.1--once we have time to test thoroughly--any classes manually applied to the original element should be carried over to the enhanced element, with an `-enhanced` suffix. See https://github.com/jquery/jquery-mobile/issues/3577
  45                 /* if( $el[0].className.length ) {
  46                         classes = $el[0].className;
  47                 } */
  48                 if( !!~$el[0].className.indexOf( "ui-btn-left" ) ) {
  49                         classes = "ui-btn-left";
  50                 }
  51
  52                 if(  !!~$el[0].className.indexOf( "ui-btn-right" ) ) {
  53                         classes = "ui-btn-right";
  54                 }
  55
  56                 // Add ARIA role
  57                 this.button = $( "<div></div>" )
  58                         .text( $el.text() || $el.val() )
  59                         .insertBefore( $el )
  60                         .buttonMarkup({
  61                                 theme: o.theme,
  62                                 icon: o.icon,
  63                                 iconpos: o.iconpos,
  64                                 inline: o.inline,
  65                                 corners: o.corners,
  66                                 shadow: o.shadow,
  67                                 iconshadow: o.iconshadow,
  68                                 mini: o.mini
  69                         })
  70                         .addClass( classes )
  71                         .append( $el.addClass( "ui-btn-hidden" ) );
  72
  73         $button = this.button;
  74                 type = $el.attr( "type" );
  75                 name = $el.attr( "name" );
  76
  77                 // Add hidden input during submit if input type="submit" has a name.
  78                 if ( type !== "button" && type !== "reset" && name ) {
  79                                 $el.bind( "vclick", function() {
  80                                         // Add hidden input if it doesn’t already exist.
  81                                         if( $buttonPlaceholder === undefined ) {
  82                                                 $buttonPlaceholder = $( "<input>", {
  83                                                         type: "hidden",
  84                                                         name: $el.attr( "name" ),
  85                                                         value: $el.attr( "value" )
  86                                                 }).insertBefore( $el );
  87
  88                                                 // Bind to doc to remove after submit handling
  89                                                 $( document ).one("submit", function(){
  90                                                         $buttonPlaceholder.remove();
  91
  92                                                         // reset the local var so that the hidden input
  93                                                         // will be re-added on subsequent clicks
  94                                                         $buttonPlaceholder = undefined;
  95                                                 });
  96                                         }
  97                                 });
  98                 }
  99
 100         $el.bind({
 101             focus: function() {
 102                 $button.addClass( $.mobile.focusClass );
 103             },
 104
 105             blur: function() {
 106                 $button.removeClass( $.mobile.focusClass );
 107             }
 108         });
 109
 110                 this.refresh();
 111         },
 112
 113         enable: function() {
 114                 this.element.attr( "disabled", false );
 115                 this.button.removeClass( "ui-disabled" ).attr( "aria-disabled", false );
 116                 return this._setOption( "disabled", false );
 117         },
 118
 119         disable: function() {
 120                 this.element.attr( "disabled", true );
 121                 this.button.addClass( "ui-disabled" ).attr( "aria-disabled", true );
 122                 return this._setOption( "disabled", true );
 123         },
 124
 125         refresh: function() {
 126                 var $el = this.element;
 127
 128                 if ( $el.prop("disabled") ) {
 129                         this.disable();
 130                 } else {
 131                         this.enable();
 132                 }
 133
 134                 // Grab the button's text element from its implementation-independent data item
 135                 $( this.button.data( 'buttonElements' ).text ).text( $el.text() || $el.val() );
 136         }
 137 });
 138
 139 //auto self-init widgets
 140 $( document ).bind( "pagecreate create", function( e ){
 141         $.mobile.button.prototype.enhanceWithin( e.target, true );
 142 });
 143
 144 })( jQuery );
 145 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
 146 });
 147 //>>excludeEnd("jqmBuildExclude");