//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
//>>description: Theming and layout of headers, footers, and content areas
//>>label: Page Sections
//>>group: Core

define( [ "jquery", "../jquery.mobile.core", "./page" ], function( jQuery ) {
//>>excludeEnd("jqmBuildExclude");
(function( $, undefined ) {

$.mobile.page.prototype.options.backBtnText  = "Back";
$.mobile.page.prototype.options.addBackBtn   = false;
$.mobile.page.prototype.options.backBtnTheme = null;
$.mobile.page.prototype.options.headerTheme  = "a";
$.mobile.page.prototype.options.footerTheme  = "a";
$.mobile.page.prototype.options.contentTheme = null;

// NOTE bind used to force this binding to run before the buttonMarkup binding
//      which expects .ui-footer top be applied in its gigantic selector
// TODO remove the buttonMarkup giant selector and move it to the various modules
//      on which it depends
$.mobile.$document.bind( "pagecreate", function( e ) {
	var $page = $( e.target ),
		o = $page.data( "page" ).options,
		prefix = "data-"+$.mobile.ns,
		pageRole = $page[0].getAttribute( prefix + "role" ) || undefined,
		pageTheme = o.theme;

	$( ":jqmData(role='header'), :jqmData(role='footer'), :jqmData(role='content')", $page )
		.jqmEnhanceable()
		.each(function() {

		var $this = $( this ),
			role = $this[0].getAttribute( prefix + "role" ) || undefined,
			theme = $this[0].getAttribute( prefix + "theme" ) || undefined,
			contentTheme = theme || o.contentTheme || ( pageRole === "dialog" && pageTheme ),
			$headeranchors,
			leftbtn,
			rightbtn,
			$dest = $page.find( ".ui-footer" ),
			backBtn;

		$this.addClass( "ui-" + role );

		//apply theming and markup modifications to page,header,content,footer
		if ( role === "header" || role === "footer" ) {

			var thisTheme = theme || ( role === "header" ? o.headerTheme : o.footerTheme ) || pageTheme;

			$this
				//add theme class
				.addClass( "ui-bar-" + thisTheme )
				// Add ARIA role
				.attr( "role", role === "header" ? "banner" : "contentinfo" );

			if ( role === "header") {
				// Right,left buttons
				$headeranchors	= $this.children( "a, div.naviframe-button, a.naviframe-button, button" );
				leftbtn	= $headeranchors.hasClass( "ui-btn-left" );
				rightbtn = $headeranchors.hasClass( "ui-btn-right" );

				leftbtn = leftbtn || $headeranchors.eq( 0 ).not( ".ui-btn-right" ).addClass( "ui-btn-left" ).length;

				rightbtn = rightbtn || $headeranchors.eq( 1 ).addClass( "ui-btn-right" ).length;

				$( $headeranchors.get().reverse() ).each( function ( i ) {
					$( this ).addClass( "ui-btn-right-" + i );
				});
			}

			// Auto-add back btn on pages beyond first view
			if ( o.addBackBtn &&
				( role === "footer" || role === "header" ) &&
				$page[0].getAttribute( prefix + "url" ) !== $.mobile.path.stripHash( location.hash ) &&
				!leftbtn ) {

				if ( o.addBackBtn == "header" ) {
					$dest = $page.find( ".ui-header" );
				} else {
					$dest = $page.find( ".ui-footer" );
				}

				if ( !$dest.find( ".ui-btn-back" ).length ) {
					backBtn = $( "<a href='javascript:void(0);' class='ui-btn-back' data-" + $.mobile.ns + "rel='back'></a>" )
						// // If theme is provided, override default inheritance
						.buttonMarkup( { icon: "header-back-btn", theme: o.backBtnTheme || thisTheme } );

					backBtn.find( ".ui-btn-text" ).text( o.backBtnText );
					backBtn.appendTo( $dest );
				}
			}

			// Page title
			$this.children( "h1, h2, h3, h4, h5, h6" )
				.addClass( "ui-title" )
				// Regardless of h element number in src, it becomes h1 for the enhanced page
				.attr({
					"role": "heading",
					"aria-level": "1",
					"aria-label": "title",
					"tabindex": "0"
				});

			$( ".ui-title-text-sub" ).attr( { "tabindex": "0", "aria-label": "subtitle" } );

		} else if ( role === "content" ) {
			if ( contentTheme ) {
				$this.addClass( "ui-body-" + ( contentTheme ) );
			}

			// Add ARIA role
			$this.attr( "role", "main" );
		}
	});
});

})( jQuery );
//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
});
//>>excludeEnd("jqmBuildExclude");