Puting the Picture upload form under it's own separate tab. Here's my code.

okey, after much digging, I found some old code for 5.x from here http://www.chapterthree.com/blog/josh_koenig/drupal_howto_liberating_use... and after hacking and forking, I made my first module called "Avatar". Below is the code:

<?php
function avatar_user($op, &$edit, &$account, $category = NULL) {
  if ($op == 'categories') {
    $categories = array(array(
      'name' => 'avatar', 
      'title' => t('Picture'), 
      'weight' => 1)
    );
    return $categories;
  }
  if ($op == 'form' && $category == 'avatar') {
    $form = array();
    $form['avatar'] = array(
      '#type' => 'fieldset',
    );
    $form['avatar']['preview'] = array(
      '#type' => 'markup',
      '#value' => theme('user_picture', $account),
      '#prefix' => '<h2>'. t('Your current picture'). '</h2>',
    );
//    $form['avatar']['picture_upload'] = array(
//      '#type' => 'file',
//      '#title' => t('Upload a new picture'),
//      '#size' => 20,
//    );
    return $form;
  }
  if ($op == 'validate' && $category == 'avatar') {
    if ($file = file_save_upload('picture_upload')) {
      // user.module's function for validating pictures is plenty good
      user_validate_picture($file, $edit, $account);
    }
  }
}

function avatar_form_alter($form_id, &$form) {
  if($form_id == 'user_profile_form' && arg(3) == NULL) {
    // only fire this if it's user/<uid>/edit, not any other category
    unset($form['picture']);
//	unset($form['save']);
  }
}

in your own module I changed the line 303 to

if ($form_id == 'user_profile_form' && isset($form['picture']) && arg(3) == 'avatar') {

and also added

if($form_id == 'user_profile_form' && arg(3) == NULL) {
    // getting rid of the picture form in Account Settings form
    unset($form['picture']);
}  

What these codes do is that they unsets the picture upload form in user/*/edit and leaves it only for user/*/edit/avatar. Your form will now appear under its own tab (Awesome!). And it also unsets the core picture upload, so that only the Upload link from your Avatar Crop remains.

What I couldn't unset was the "Save" and "Delete" buttons which are probably coming from the User profile form and therefore are dangerous because one may accidentally press the Delete button and delete his own account, while thinking that he is deleting his picture. I could't give the form its own class or id, or else it would be possible to use CSS for the Save and Delete buttons and say "display:none". Removal of the Save and Delete buttons in this code needs to be tackled. (But I don't know how).

Would you like to adopt this code into your module?

PS: After trying this module for a while longer, I think redirecting the user through to other pages is not a very good idea. Now that Avatar crop has it's own tab (if, of course, you decide to adopt the above code), it would be a lot better if everything (uploading, croping, saving would take place on the same page using AJAX)