// Main JavaScript Document for ...

// SET jQuery to new var; instead of "$"
var $_ = jQuery;





/** 
 * Document.Ready Functions
 * 
 */

        $_(document).ready(function(){
            
                                                  
            
            
  
  
  
            
            /**
             *
             * This is a test of connecting a click to the UI dialog function.
             * It will be removed in the final version.             
             *
             *  Connect the copyright mark  to jqModal copyright dialog by initializing it here.             
             **/                                       
            $_('#copyright_dialog').jqm();
            
             
            /******* this is for testing only
            $_("h2").click(function () {
                        $_(document.createElement("div"),"body").css("font-size","10px").css(
							"overflow","auto"
						).attr("id", "save_dialog").html(
							'This is a modal dialog creation test.'
						).dialog({
							modal:true,
							title:"modal dialog creation test",
							width:600,
							height:80,
							buttons: { "Ok": function() { $_(this).dialog("close"); } }
						}).bind('dialogclose', function(event, ui) {
							$_(this).remove();
						});
            });
            *************************************/



            
            
            /**
             *
             * This is the method we call when the user selects a class from
             * the dropdown.             
             *
             **/                                                   
            var changeClass = function(in_class){
                $_("body").removeClass($_("body").attr("class"));
                $_("body").addClass(in_class);
                setThemeCookie(in_class);
            }
            
            /**
             *
             * Here, we connect the class dropdown to the changeClass method
             * on document.ready().             
             *
             **/                                                               
            $_("select#changeclass").change(function(){
                changeClass($_("select#changeclass").val());
            });


            /**
             *
             * Use an ajax call to set the user's site theme
             * or class selection.
             *
             */                                                   
            var setThemeCookie = function(in_theme){
                    var proxyUrl = "proxy/_setThemeCookie.php";
                    $_.ajax({
						type: "POST",
						url: proxyUrl,
						data: {'in_theme':in_theme},
						dataType:"json",
						success:function (data, textStatus) {

							if 	( data.return_value == 0 ) {
								//// OK
							}						
							else {
								$_(document.createElement("div"),"body").css(
									"overflow","auto"
								).css("font-size","11px").html(
									"<!--<p>-->" + data.return_text + "<!--</p>-->"
								).dialog({
									modal:true,
									title:"We're Sorry! &nbsp;&nbsp; An Error Occurred While Processing Your Request",
									autoOpen: true,
									width:600,
									height:80,
									position: "center",
									buttons: { "Close": function() { $_(this).dialog("close"); } }
								}).bind('dialogclose', function(event, ui) {
									$_(this).remove();
								});
							}
						},
						complete:function(){ 
							 //// do this on complete
						 },
						error:function(e){
							var htmlStr = "<p><strong>We're Sorry!<br />An Error Occurred While Processing Your Request</strong></p><p>" + e.status + "<br />" + e.statusText + "</p><p>Please try again later.</p>";
							////console.log ( e );
							$_(document.createElement("div"),"body").css(
								"overflow","auto"
							).html(
								htmlStr
							).dialog({
								modal:true,
								title:"Error",
								autoOpen: true,
								width:400,
								height:300,
								buttons: { "Ok": function() { $_(this).dialog("close"); } }
							}).bind('dialogclose', function(event, ui) {
								$_(this).remove();
							});
						}
					});
            
            }


            /**
             *
             * Assign click event on any link to Open the Image Gallery.
             *
             **/  
                $_("#openImageGallery").click(function() {
                    openImageGallery();
                 } );
                 
                $_("#openImageGalleryMainNav").click(function() {
                    openImageGallery();
                 } );                 
                 
                 
                var openImageGallery = function(){
                    
                    $_("#homepagePhotoGallery").dialog('open');
                    
                       
                       /*
                        $_(document.createElement("div"),"body").css("font-size","10px").css(
							"overflow","auto"
						).attr("id", "photo_gallery_dialog").html(
                            'Loading...'
                        ).load(
							'dialog/photo_gallery.php'
						).dialog({
							modal:true,
							title:"Benson Grove Baptist Church Proteens .: Photo Gallery :.",
							width:600,
							height:270,
							buttons: { "Close": function() { $_(this).dialog("close"); } }
						}).bind('dialogclose', function(event, ui) {
							$_(this).remove();
						});
						*/
  
 
                }

            
            /**
             *
             * Next method comment
             *
             **/                                                   



            /**
             *
             * Init Photo Gallery Dialog
             *
             **/  

                        $_("#homepagePhotoGallery").dialog({
    							autoOpen: false,
                                modal:true,
    							title:"Benson Grove Baptist Church Proteens .: Photo Gallery :.",
    							width:600,
    							height:370, 
                                buttons: { "Close": function() { $_(this).dialog("close"); } }
						      }).css(
                              "font-size","10px"
                              ).bind('dialogclose', function(event, ui) {
							        // $_(this).remove(); // we don't remove from dom
						          }); 

        });