// Handlers
//
console.log("Loading profile.js...");

yourprofileImgOff = new Image()
yourprofileImgOff.src = "/images/btn_yourprofile_off.gif"
editYourAccountImgOff= new Image()
editYourAccountImgOff.src = "/images/btn_edityouraccount_off.gif"

yourprofileImg = new Image()
yourprofileImg.src = "/images/btn_yourprofile.gif"
editYourAccountImg = new Image()
editYourAccountImg.src = "/images/btn_edityouraccount.gif"

editBioBtnOff = new Image();
editBioBtnOff.src = 'images/btn_profile_bio_off.gif';
editBioBtnOn = new Image();
editBioBtnOn.src = 'images/btn_profile_bio_on.gif';

editEmailBtnOff = new Image();
editEmailBtnOff.src = 'images/btn_profile_email_off.gif';
editEmailBtnOn = new Image();
editEmailBtnOn.src = 'images/btn_profile_email_on.gif';

editPasswordBtnOff = new Image();
editPasswordBtnOff.src = 'images/btn_profile_password_off.gif';
editPasswordBtnOn = new Image();
editPasswordBtnOn.src = 'images/btn_profile_password_on.gif';

editPhotoBtnOff = new Image();
editPhotoBtnOff.src = 'images/btn_profile_photo_off.gif';
editPhotoBtnOn = new Image();
editPhotoBtnOn.src = 'images/btn_profile_photo_on.gif';

editAvatarBtnOff = new Image();
editAvatarBtnOff.src = 'images/btn_profile_avatar_off.gif';
editAvatarBtnOn = new Image();
editAvatarBtnOn.src = 'images/btn_profile_avatar_on.gif';

tabMixesImgOff = new Image();
tabMixesImgOff.src = 'images/btn_profile_mixes_off.gif';
tabMixesImgOn = new Image();
tabMixesImgOn.src = 'images/btn_profile_mixes_on.gif';

tabPlaylistsImgOff = new Image();
tabPlaylistsImgOff.src = 'images/btn_profile_playlist_off.gif';
tabPlaylistsImgOn = new Image();
tabPlaylistsImgOn.src = 'images/btn_profile_playlist_on.gif';

tabLastRatedImgOff = new Image();
tabLastRatedImgOff.src = 'images/btn_profile_highest_off.gif';
tabLastRatedImgOn = new Image();
tabLastRatedImgOn.src = 'images/btn_profile_highest_on.gif';

tabCommentedImgOff = new Image();
tabCommentedImgOff.src = 'images/btn_profile_commented_off.gif';
tabCommentedImgOn = new Image();
tabCommentedImgOn.src = 'images/btn_profile_commented_on.gif';

function initProfilePage(from) {
    //
	hideListen();
    hideActiveUsers();


    if($('btn-yourprofile')) {
	Event.observe('btn-yourprofile', 'click', function(event) { 
	    Event.stop(event); 
	    if(from != "profile") {
		FwDispatch.content($('btn-yourprofile').href,'view-container',null,handleProfile);
	    }
	});
    }
    
    if(from != "profile") {
	
	if($('btn-yourprofile-img')) {
	    Event.observe('btn-yourprofile-img', 'mouseover', function(event) { 
		Event.stop(event); 
		$('btn-yourprofile-img').src = yourprofileImg.src;
	    });
	}
	
	if($('btn-yourprofile-img')) {
	    Event.observe('btn-yourprofile-img', 'mouseout', function(event) { 
		Event.stop(event); 
		$('btn-yourprofile-img').src = yourprofileImgOff.src;
	    });
	}
    } else {
	if($('btn-yourprofile-img')) {
	    $('btn-yourprofile-img').src = yourprofileImg.src;
	    Event.observe('btn-yourprofile-img', 'mouseout', function(event) { 
		Event.stop(event); 
		$('btn-yourprofile-img').src = yourprofileImg.src;
	    });
	}
    }

    if($('btn-edityouraccount-img')) {
	Event.observe('btn-edityouraccount', 'click', function(event) { 
	    Event.stop(event);
	    if(from != "profileedit") {	    
		FwDispatch.content($('btn-edityouraccount').href,'view-container',null,handleProfileEdit);
	    }
	});

	if(from != "profileedit") {
	    Event.observe('btn-edityouraccount-img', 'mouseover', function(event) { 
		Event.stop(event); 
		$('btn-edityouraccount-img').src = editYourAccountImg.src;
	    });
	    
	    Event.observe('btn-edityouraccount-img', 'mouseout', function(event) { 
		Event.stop(event); 
		$('btn-edityouraccount-img').src = editYourAccountImgOff.src;
	    });
	} else {
	    $('btn-edityouraccount-img').src = editYourAccountImg.src;

	    Event.observe('btn-edityouraccount-img', 'mouseout', function(event) { 
		Event.stop(event); 
		$('btn-edityouraccount-img').src = editYourAccountImg.src;
	    });
	}
    }

}

function _buttonsOff() {
    $('edit-bio-btn').src      = editBioBtnOff.src;
    $('edit-email-btn').src    = editEmailBtnOff.src;
    $('edit-password-btn').src = editPasswordBtnOff.src;
    $('edit-photo-btn').src    = editPhotoBtnOff.src;
    $('edit-avatar-btn').src   = editAvatarBtnOff.src;
}

function handleProfileEdit(res) {
    initProfilePage("profileedit");

    activeTab = 'bio';

    if($('edit-bio-btn')) {
	$('edit-bio-btn').src = editBioBtnOn.src;
    }
    
    if($('edit-bio-btn-link')) {
	FwDispatch.content($('edit-bio-btn-link').href,'profile-inner-content',null,handleBio);   
    }
    Event.observe('edit-bio-btn-link', 'click', function(event) { 
	_buttonsOff();
	$('edit-bio-btn').src = editBioBtnOn.src;
	Event.stop(event);
  activeTab = 'bio' 
	FwDispatch.content($('edit-bio-btn-link').href,'profile-inner-content',null,handleBio);
  $('profile-result-msg').update('');
    });

 	Event.observe('edit-bio-btn', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'bio'){
        $('edit-bio-btn').src = editBioBtnOn.src;
      }
  });

 	Event.observe('edit-bio-btn', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'bio'){
        $('edit-bio-btn').src = editBioBtnOff.src;
      }
 	}); 

    Event.observe('edit-email-btn-link', 'click', function(event) { 
	_buttonsOff();
	$('edit-email-btn').src = editEmailBtnOn.src;
	Event.stop(event);
  activeTab = 'email'; 
	FwDispatch.content($('edit-email-btn-link').href,'profile-inner-content',null,handleEmail);
  $('profile-result-msg').update('');
    });

 	Event.observe('edit-email-btn-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'email'){
        $('edit-email-btn').src = editEmailBtnOn.src;
      }
  });

 	Event.observe('edit-email-btn', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'email'){
        $('edit-email-btn').src = editEmailBtnOff.src;
      }
 	}); 

    Event.observe('edit-password-btn-link', 'click', function(event) { 
	_buttonsOff();
	$('edit-password-btn').src = editPasswordBtnOn.src;
	Event.stop(event);
  activeTab = 'password'; 
	FwDispatch.content($('edit-password-btn-link').href,'profile-inner-content',null,handlePassword);
  $('profile-result-msg').update('');
    });

 	Event.observe('edit-password-btn-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'password'){
        $('edit-password-btn').src = editPasswordBtnOn.src;
      }
  });

 	Event.observe('edit-password-btn-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'password'){
        $('edit-password-btn').src = editPasswordBtnOff.src;
      }
 	}); 

    Event.observe('edit-photo-btn-link', 'click', function(event) { 
	_buttonsOff();
	$('edit-photo-btn').src = editPhotoBtnOn.src;
	Event.stop(event);
  activeTab = 'photo'; 
	FwDispatch.content($('edit-photo-btn-link').href,'profile-inner-content',null,handlePhoto);
  $('profile-result-msg').update('');
    });

 	Event.observe('edit-photo-btn-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'photo'){
        $('edit-photo-btn').src = editPhotoBtnOn.src;
      }
  });

 	Event.observe('edit-photo-btn-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'photo'){
        $('edit-photo-btn').src = editPhotoBtnOff.src;
      }
 	}); 

    Event.observe('edit-avatar-btn-link', 'click', function(event) { 
	_buttonsOff();
	$('edit-avatar-btn').src = editAvatarBtnOn.src;
	Event.stop(event);
  activeTab = 'avatar'; 
	FwDispatch.content($('edit-avatar-btn-link').href,'profile-inner-content',null,handleAvatar);
  $('profile-result-msg').update('');
    });

 	Event.observe('edit-avatar-btn-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'avatar'){
        $('edit-avatar-btn').src = editAvatarBtnOn.src;
      }
  });

 	Event.observe('edit-avatar-btn-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'avatar'){
        $('edit-avatar-btn').src = editAvatarBtnOff.src;
      }
 	}); 

}

var submitBio = { 
    go: function(event) {
	Event.stop(event);
	console.log("got bio click");
	FwDispatch.form('ProfileBioForm','profile-inner-content',null,"handleBio");
    }
}

submitBio.bgo = submitBio.go.bindAsEventListener(submitBio);

function handleBio(res) {

    var bio = $('ProfileBioForm-textarea-bio').value;

    $('ProfileBioForm-textarea-bio').ancestors()[0].update('<div id="ProfileBioForm-background-bio"><textarea name="ProfileBioForm_bio" class="ProfileBioForm-textarea" id="ProfileBioForm-textarea-bio" maxlength="250" />'+bio+'</textarea></div>');

    $('ProfileBioForm-submit-button').ancestors()[0].update('<input type="image" src="../../images/btn_login_submit.gif" alt="Submit" id="ProfileBioForm-submit-button" class="submit-btn" />');


    init_btn_rollover("submit");

    var cMessageElm = 'profile-result-msg';
    var cFormElm    = 'ProfileBioForm-textarea-bio';
    var maxC        = 260;

    $(cMessageElm).setStyle({left:'113px',top:'200px',width:'191px',color:'#5E5E5E'});
    charCounter(cFormElm,cMessageElm,maxC);


    Event.observe('ProfileBioForm-textarea-bio', 'keyup', function(event) {
	charCounter(cFormElm,cMessageElm,maxC);
    });

    Event.observe('ProfileBioForm-textarea-bio', 'change', function(event) {
	charCounter(cFormElm,cMessageElm,maxC);
    });

    Event.observe('ProfileBioForm', 'submit', function(event) { 
	Event.stop(event);
	FwDispatch.form('ProfileBioForm','profile-inner-content',null,handleBio);

	$('profile-result-msg').setStyle({left:'139px',top:'200px',width:'191px',color:'#5E5E5E'});
	$('profile-result-msg').update('Your bio has been updated successfully.');
    });

}

function charCounter(felm,melm,max) {
    var clen = $(felm).value.length;
    $(melm).update('<div id="charcount"><span id="charcount-current">'+clen+'</span> / '+max+'</div>');

    if(clen > max) {
	$('charcount-current').setStyle({color:'#f00'});
    } else {
	$('charcount-current').setStyle({color:'#5E5E5E'});
    }
}

function handleBio2(res) {

}

function handleEmail(res) {

    emailValue = $('ProfileEmailForm-text-email-address').value;
    displayEmailValue = $('ProfileEmailForm-text-display-email-address').value;
    console.log("Got to profile email: [%s]", emailValue);

    $('ProfileEmailForm-text-email-address').ancestors()[0].update('<div id="ProfileEmailForm-background-email-address" class="ProfileEmailForm-background"><input type="text" name="ProfileEmailForm_email address" id="ProfileEmailForm-text-email-address" value="'+emailValue+'" class="ProfileEmailForm-text" /></div>');

    $('ProfileEmailForm-text-display-email-address').ancestors()[0].update('<div id="ProfileEmailForm-background-display-email-address" class="ProfileEmailForm-background"><input type="text" name="ProfileEmailForm_display_email_address" id="ProfileEmailForm-text-display-email-address" value="'+displayEmailValue+'" class="ProfileEmailForm-text" /></div>');

    $('ProfileEmailForm-submit-button').ancestors()[0].update('<input type="image" src="../../images/btn_login_submit.gif" alt="Submit" id="ProfileEmailForm-submit-button" class="submit-btn" />');

    init_btn_rollover("submit");

    Event.observe('ProfileEmailForm', 'submit', function(event) { 
	Event.stop(event);
	FwDispatch.form('ProfileEmailForm','profile-inner-content',null,handleEmail);

	$('profile-result-msg').setStyle({left:'70px',position:'relative',top:'88px',width:'261px',color:'#5E5E5E'});
	$('profile-result-msg').update('Your email information has been updated successfully.');
    });
}

function handlePassword(res) {

   var foundError = false; 
   var checkErrors = true;

    var errors = Try.these(
      function() { return $H(res['data'].errors); }, 
      function() { checkErrors = false; return $H(); }
    );

    errorColor = "#ff0000";

    errors.each(
      function(h){

        console.log(h.key);

        if ((h.key == "current_password") || (h.key == "new_password") || (h.key == "confirm_password")) {
          $('profile-result-msg').setStyle({color:errorColor,top:'114px',left:'0px',width:'333px',textAlign:'right'});
          $('profile-result-msg').update(h.value);
          foundError = true;
        }

      }
    )

    if (!foundError && checkErrors){
      $('profile-result-msg').setStyle({left:'115px',top:'114px',width:'218px',color:'#5E5E5E'});
      $('profile-result-msg').update('Your password has been updated successfully.');
    }

    $('ProfilePasswordForm-password-current-password').ancestors()[0].update('<div id="ProfilePasswordForm-background-current-password" class="ProfilePasswordForm-background"><input type="password" name="ProfilePasswordForm_current password" id="ProfilePasswordForm-password-current-password" class="ProfilePasswordForm-password" /></div>');

    $('ProfilePasswordForm-password-new-password').ancestors()[0].update('<div id="ProfilePasswordForm-background-new-password" class="ProfilePasswordForm-background"><input type="password" name="ProfilePasswordForm_new_password" id="ProfilePasswordForm-password-new-password" class="ProfilePasswordForm-password" /></div>');

    $('ProfilePasswordForm-password-confirm-password').ancestors()[0].update('<div id="ProfilePasswordForm-background-confirm-password" class="ProfilePasswordForm-background"><input type="password" name="ProfilePasswordForm_confirm_password" id="ProfilePasswordForm-password-confirm-password" class="ProfilePasswordForm-password" /></div>');

    $('ProfilePasswordForm-submit-button').ancestors()[0].update('<input type="image" src="../../images/btn_login_submit.gif" alt="Submit" id="ProfilePasswordForm-submit-button" class="submit-btn" />');

    init_btn_rollover("submit");

    Event.observe('ProfilePasswordForm', 'submit', function(event) { 
	Event.stop(event);
	FwDispatch.form('ProfilePasswordForm','profile-inner-content',null,handlePassword);
    });
}

function handlePhoto(res) {

  Event.observe('profile-photo-file-input','change',function(event){
    
    $('profile-photo-fake-input').value=$('profile-photo-file-input').value;
  }); 

    init_btn_rollover("submit");

    Event.observe('photo-form', 'submit', function(event) { 
	IGET.submit($('photo-form'), {'onStart' : handlePhotoStarted, 'onComplete' : handlePhotoReturn});
      /*$('profile-result-msg').setStyle({left:'190px',top:'50px'});
      $('profile-result-msg').update('Your photo has been updated successfully.');*/
    });
}

function handlePhotoReturn(iget_resp) {
    // refresh photo
    FwDispatch.content($('edit-photo-btn-link').href,'profile-inner-content',null,handlePhoto);
}

function handlePhotoStarted() {
    console.log("Photo Upload Started... ");
}

function handleAvatar(res) {

  Event.observe('profile-avatar-file-input','change',function(event){
    
    $('profile-avatar-fake-input').value=$('profile-avatar-file-input').value;
  });

    init_btn_rollover("submit");

    Event.observe('avatar-form', 'submit', function(event) { 
	IGET.submit($('avatar-form'), {'onStart' : handleAvatarStarted, 'onComplete' : handleAvatarReturn});
      /*$('profile-result-msg').setStyle({left:'190px',top:'50px'});
      $('profile-result-msg').update('Your avatar has been updated successfully.');*/
    });
}

function handleAvatarStarted() {
    console.log("Avatar Upload Started... ");
}

function handleAvatarReturn(iget_resp) {
    // refresh avatar
    FwDispatch.content($('edit-avatar-btn-link').href,'profile-inner-content',null,handleAvatar);
}

var profileSlider;

function initProfileTabs() {
    $('tab-mixes-img').src     = tabMixesImgOff.src;
    $('tab-playlist-img').src  = tabPlaylistsImgOff.src;
    $('tab-lastrated-img').src = tabLastRatedImgOff.src;
    $('tab-commented-img').src = tabCommentedImgOff.src;

    if ($('profile-page-content').scrollHeight <= $('profile-page-content').offsetHeight) {
	$('profile-slider-handle').hide();
    } else {
	$('profile-slider-handle').show();
	setWheel(profileSlider,'profile-page-content','profile-page-content');
    }

    profileSlider.setValue(0);

}

function handleProfile(res) {
   initProfilePage("profile");

   activeTab = 'mixes';

    $('profile-slider').update('<div id="profile-slider-track" style="position:absolute;top:18px;left:403px;width:6px;height:319px;background-image:url(../../style/remix/images/bg_scroll_track.png);"><div id="profile-slider-handle" style="background-image:url(../../images/scroll_v_slider.gif);background-repeat:no-repeat;width:17px;height:8px;left:-5px;cursor:pointer;"></div>');
    
    profileSlider = new Control.Slider('profile-slider-handle', 'profile-slider-track', {
	axis: 'vertical',
	onSlide: function(v) { scrollVertical(v, $('profile-page-content'), profileSlider);  },
	onChange: function(v) { scrollVertical(v, $('profile-page-content'), profileSlider); }
    });
    
    if($('tab-mixes-link')) {
	$('tab-mixes-img').src = tabMixesImgOn.src;
	FwDispatch.content($('tab-mixes-link').href,'profile-page-content',null,handleMixes);

	Event.observe('tab-mixes-link', 'click', function(event) {
	    Event.stop(event);
      activeTab = 'mixes';
	    FwDispatch.content($('tab-mixes-link').href,'profile-page-content',null,handleMixes);
	});

  Event.observe('tab-mixes-link', 'mouseover', function(event) {
	    Event.stop(event);

      if (activeTab != 'mixes'){
        $('tab-mixes-img').src = tabMixesImgOn.src;
      }
  });

 	Event.observe('tab-mixes-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'mixes'){
        $('tab-mixes-img').src = tabMixesImgOff.src;
      }
 	}); 
    }

    if($('tab-playlist-link')) {
	Event.observe('tab-playlist-link', 'click', function(event) {
	    Event.stop(event);
      activeTab = 'playlist';
	    FwDispatch.content($('tab-playlist-link').href,'profile-page-content',null,handlePlaylists);
	});

	Event.observe('tab-playlist-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'playlist'){
        $('tab-playlist-img').src = tabPlaylistsImgOn.src;
      }
  });

 	Event.observe('tab-playlist-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'playlist'){
        $('tab-playlist-img').src = tabPlaylistsImgOff.src;
      }
 	});

    }

    if($('tab-lastrated-link')) {
	Event.observe('tab-lastrated-link', 'click', function(event) {
	    Event.stop(event);
      activeTab = 'lastrated';
	    FwDispatch.content($('tab-lastrated-link').href,'profile-page-content',null,handleLastRated);
	});

 	Event.observe('tab-lastrated-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'lastrated'){
        $('tab-lastrated-img').src = tabLastRatedImgOn.src;
      }
  });

 	Event.observe('tab-lastrated-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'lastrated'){
        $('tab-lastrated-img').src = tabLastRatedImgOff.src;
      }
 	}); 

    }

    if($('tab-commented-link')) {
	Event.observe('tab-commented-link', 'click', function(event) {
	    Event.stop(event);
      activeTab = 'commented';
	    FwDispatch.content($('tab-commented-link').href,'profile-page-content',null,handleCommented);
	});
    }

 	Event.observe('tab-commented-link', 'mouseover', function(event) {
      Event.stop(event);

      if (activeTab != 'commented'){
        $('tab-commented-img').src = tabCommentedImgOn.src;
      }
  });

 	Event.observe('tab-commented-link', 'mouseout', function(event) {
      Event.stop(event);

      if (activeTab != 'commented'){
        $('tab-commented-img').src = tabCommentedImgOff.src;
      }
 	}); 
/*
    Event.observe('RegStep2Form-select-country', 'change', function(event) {
      country = encodeURIComponent($('RegStep2Form-select-country').getValue());
      if (regStep2Error == 'country'){
        $('register2-error-msg').update('');
      }

      $('city-partial').clear();
      if (state) {
        $('RegStep2Form-select-city').setStyle({display:'none'});
        state='';
      }
      FwDispatch.content('auth/list_states_for_country_data.html?country='+country,'reg-state-select',null,changeState);
      $('RegStep2Form-state-or-province-data-cell').show();
    });
*/
}

function handleCommented(res) {
    initProfileTabs();
    $('tab-commented-img').src = tabCommentedImgOn.src;
    $('profile-playlists-subhdrs').setStyle({display:'none'});
    $('profile-main-subhdrs').setStyle({display:'block'});
}

function handleLastRated(res) {
    initProfileTabs();
    $('tab-lastrated-img').src = tabLastRatedImgOn.src;
    $('profile-playlists-subhdrs').setStyle({display:'none'});
    $('profile-main-subhdrs').setStyle({display:'block'});
}

function handlePlaylists(res) {
    initProfileTabs();
    $('tab-playlist-img').src = tabPlaylistsImgOn.src;
    $('profile-main-subhdrs').setStyle({display:'none'});
    $('profile-playlists-subhdrs').setStyle({display:'block'});
}

function handleMixes(res) {
    initProfileTabs();
    $('tab-mixes-img').src = tabMixesImgOn.src; 
    $('profile-playlists-subhdrs').setStyle({display:'none'});
    $('profile-main-subhdrs').setStyle({display:'block'});
}