/*
 * CommikForm Fields Parameters
 * 
 * blank       => Doesn't accept blank field.
 * email       => Only accept valid email address.
 * website     => Only accept valid URL.
 * numeric     => Only accept numeric value.
 * withinN-N   => The field must contain between N and N value (ie. within6-12). Also accept an empty field.
 * login       => Identify a login field (Use for determining the password strength).
 * password    => Identify a password field. (SEE passconfirm)
 * passconfirm => The passconfirm and pass fields must have the same value.
 * passlevel   => Show a progress bar indicating the strength of the password.
 * 
 */

var CommikForm = {
  message_sending: 'Sending data, please wait...'.l(),
  message_form_error: 'The form contain errors'.l(),
  message_field: 'This field'.l(),
  message_blank: 'This field cannot be blank'.l(),
  message_email: 'The email address is invalid'.l(),
  message_website: 'The website address is invalid'.l(),
  message_numeric: 'This field must be numeric'.l(),
  message_passconfirm: 'The confirmation don\'t match the password'.l(),
  message_within: 'This field must have between #min and #max characters'.l(),
  message_extensions: 'Only the #extensions are accepted'.l(),
  message_radio: 'You must select one choice'.l(),
  message_terms: 'You must accept the terms and conditions'.l(),
  message_very_weak: 'Very Weak'.l(),
  message_weak: 'Weak'.l(),
  message_medium: 'Medium'.l(),
  message_strong: 'Strong'.l(),
  message_very_strong: 'Very Strong'.l(),
  
  generate: function() {
    var password_field;

    if($$('form.commik').first()){
            
      $$('form.commik').each(function(form){
        Event.observe(form, 'submit', function(event){
          CommikForm.validate(event, form);
  	  	});
        
        if(form.select('div.line-button').first() != null){
          CommikForm.set_load_form(form);
        }
        
        if(form.select('input[type="file"]').first() != null){
          CommikForm.style_browse(form);
        }
        
        form.select('div.terms a').each(function(term){
          Event.observe(term, 'click', function(event){
            CommikForm.pop_terms(event, term.href);
  	  	  });
        });
        
        form.select('div.line input.passlevel').each(function(field){
          CommikForm.add_password_progress(field);
        });
      });
    }
  },
  
  set_load_form: function(form){
    var load_animation = '';
    
    load_animation += '<div class="line-button-load" style="display:none;">';
    load_animation += '<object type="application/x-shockwave-flash" data="/images/ico/form-load.swf"><param name="menu" value="false" /><param name="wmode" value="transparent" /><param name="movie" value="/images/ico/form-load.swf" /></object>';
    load_animation += '<div class="text">' + CommikForm.message_sending + '</div>';
    load_animation += '</div>';
    
    form.select('div.line-button').first().insert({after:load_animation})
  },
  
  style_browse: function(form){
    var wrapper;
    var skin;
        
    form.select('input[type="file"]').each(function(field){
      skin = '<div class="skin-browse"><input class="filename" value="' + $F(field).get_filename() + '" readonly="readonly"><a href="#" class="browse"></a></div>';
      Event.observe(field, 'mouseover', CommikForm.browse_over.bindAsEventListener(CommikForm, field));
			Event.observe(field, 'mouseout', CommikForm.browse_out.bindAsEventListener(CommikForm, field));
      Event.observe(field, 'change', CommikForm.browse_change.bindAsEventListener(CommikForm, field));
      
      wrapper = field.wrap('div', { 'class': 'mask' }).wrap('div', {'class' : 'wrapper-browse'});
      wrapper.insert({top:skin});
      
      if($(field.name + '_error') != null) {field.show_error($F(field.name + '_error'));}
      
    });
    
    //var frame_inserted = false;
    //var frame_code = '<iframe id="frameupload" name="frameupload" src="about:blank"></iframe>'
    /* if(!frame_inserted){wrapper.insert({bottom:frame_code});}
     * <div id="upload-progress"><div id="progress-bar"></div></div>*/
  },
  
  browse_over: function(e, field){field.up('div.wrapper-browse').select('div.skin-browse a.browse').first().setStyle({backgroundPosition: 'bottom'});},
  browse_out: function(e, field){field.up('div.wrapper-browse').select('div.skin-browse a.browse').first().setStyle({backgroundPosition: 'top'});},
  browse_change: function(e, field){field.up('div.wrapper-browse').select('div.skin-browse input.filename').first().value = $F(field).get_filename();},
  
  validate: function(event, form){
    var valid = true;
    
    valid = CommikForm.validate_fields(form, 'input');
    valid = CommikForm.validate_fields(form, 'textarea') && valid;
    valid = CommikForm.val_radio(form) && valid;
    
    
    if(!valid){
      if(form.hasClassName('alert-error')){
        alert(CommikForm.message_form_error);
      }
      event.stop();
    }else{
      if(form.select('div.line-button-load').first() != null){
        form.select('div.line-button-load').first().show();
        form.select('div.line-button').first().hide();
      }  
    }
  },
  
  validate_fields: function(form, type){
    var form_valid = true;
    var error_message = '';
    var error_message_group = '';
    var fields_group = '';
    var next_fields_group = '';
    var field_valid;
    
    form.select(type).each(function(field){
      error_message = '';
      next_fields_group = '';
      
      if (field.up('div.fields-group') != null) {next_fields_group = field.up('div.fields-group').id;}
      
      if (fields_group != next_fields_group) {
        CommikForm.manage_error_group_fields(fields_group, error_message_group);
        error_message_group = '';
        fields_group = next_fields_group;
      }
      
      if (field.readAttribute('type') != 'check' && field.readAttribute('type') != 'radio') {
        if (error_message ==  '') {error_message = CommikForm.val_blank(field);}
        if (error_message ==  '') {error_message = CommikForm.val_within(field);}
        
        if(type == 'input'){
          if (error_message ==  '') {error_message = CommikForm.val_email(field);}
          if (error_message ==  '') {error_message = CommikForm.val_website(field);}
          if (error_message ==  '') {error_message = CommikForm.val_numeric(field);} 
          if (error_message ==  '') {error_message = CommikForm.val_extensions(field);}
          if (error_message ==  '') {error_message = CommikForm.val_passconfirm(form, field);} 
        }
        
        if(field.title != ''){
          error_message = error_message.replace(CommikForm.message_field, field.title);
        }  
      }
      
      if(fields_group != ''){
        if(error_message_group != '' && error_message != ''){error_message_group += '<br/>';}
        error_message_group += error_message;
      }else{
        field.hide_error();
        if(error_message != ''){
          field.show_error(error_message);
          form_valid = false;
        }  
      }
    });
    CommikForm.manage_error_group_fields(fields_group, error_message_group);
    
    
    if(type == 'input'){
      form.select('div.terms input').each(function(check){
        check.hide_error();
        if(!check.checked){
          check.show_error(CommikForm.message_terms);
          form_valid = false;
        }
      });  
    }
    
    return form_valid;
  },
  
  val_blank: function(field){
    if(field.hasClassName('blank') && $F(field) == ''){
      return CommikForm.message_blank;
    }
    return '';
  },
  
  val_email: function(field){
    var value;
    
    if(field.hasClassName('email')){
      if(!$F(field).is_email() && !$F(field).empty()){
        return CommikForm.message_email;
      }
    }
    return '';
  },
  
  val_website: function(field){
    if(field.hasClassName('website')){
      if(!field.value.empty()){
        field.value = field.value.toLowerCase();
        if(!field.value.startsWith('http')) {field.value = 'http://' + field.value;}
        if(!field.value.is_url()){
          return CommikForm.message_website;
        }  
      }
    }
    return '';
  },
  
  val_numeric: function(field){
    if(field.hasClassName('numeric') && !$F(field).is_numeric()){
      return CommikForm.message_numeric;
    }
    return '';
  },
  
  val_within: function(field){
    var value_length;
    var interval;
    var message;
    
    if(field.className.include('within') && $F(field) != ''){
      value_length = $F(field).length;
      
      interval = CommikForm.get_validation_array(field, 'within');
      
      if(value_length < interval[0] || value_length > interval[1]){
        message = CommikForm.message_within;
        message = message.replace(/\#min/, interval[0]);
        message = message.replace(/\#max/, interval[1]);
        return message;
      }
    }
    return '';
  },
  
  val_extensions: function(field){
    var file_extension;
    var extensions;
    var valid = false;
    var message;
    
    if(field.className.include('extensions') && $F(field) != ''){
      file_extension = $F(field).get_file_extension();
      
      extensions = CommikForm.get_validation_array(field, 'extensions');
      
      extensions.each(function(extension){
        if(extension == file_extension){valid = true;}
      });
      
      if(!valid){
        message = CommikForm.message_extensions;
        message = message.replace(/\#extensions/, extensions.join(', ').toUpperCase());
        return message;
      }
    }
    return '';
  },
  
  val_passconfirm: function(form, field){
    if(field.hasClassName('passconfirm')){
      if($F(form.select('input.password').first()) != $F(form.select('input.passconfirm').first())){
        return CommikForm.message_passconfirm;
      }
    }
    return '';
  },
  
  val_radio: function(form){
    var current_radio = '';
    var current_group = '';
    var selection = true;
    var form_valid = true;
    
    form.getInputs('radio').each(function(field){
      if (field.hasClassName('blank')) {
        if(current_radio != field.name){
          if(current_radio != ''){
            if(!selection){
              form_valid = false;
              CommikForm.manage_error_group_fields(current_group, CommikForm.message_radio); 
            }else{
              $(current_group).hide_error();
            }
          }
          selection = false;
          current_radio = field.name;
          current_group = field.up('div.fields-group').id;
        }
        
        if(field.checked){selection = true;}
      }  
      
    });
    
    if(!selection){
      form_valid = false;
      CommikForm.manage_error_group_fields(current_group, CommikForm.message_radio); 
    }else{
      $(current_group).hide_error();
    }
    
    return form_valid;
  },
  
  get_validation_array: function(field, keyword){
    var start_data;
    var end_data;
    var values;
    
    start_data = field.className.indexOf(keyword) + keyword.length + 1;
    end_data = field.className.indexOf(' ', start_data);
    if(end_data == -1) {end_data = 9999;}
     
    return field.className.substring(start_data, end_data).split('-');
  },
  
  manage_error_group_fields: function(name, message){
    if (name != ''){
      $(name).hide_error();
      if(message != ''){
        $(name).show_error(message);
      }
    }
  },
  
  add_password_progress: function(field){
    var parent = $(field.up());
    var progress = '<div class="password-strength"><div class="progress"></div><div class="message"></div></div>'
    var login_field = $(field).up('form').select('input.login').first();
    
    parent.insert({bottom:progress});
    
    if($F(field) != ''){
      CommikForm.update_password_strength(field);  
    }
    
    Event.observe(field, 'keyup', function(event){CommikForm.update_password_strength(field);});
    if(login_field){
      Event.observe(login_field, 'keyup', function(event){CommikForm.update_password_strength(field);});
    }
  },
  
  update_password_strength: function(field){
    var parent = field.up('div.line');
    var login_field = $(field).up('form').select('input.login').first();
    var login_value = '';
    var strength;
    var status;
    var color = new Array('b81b1b', 'b81b1b', 'b63a1a', 'b65a1a', 'cba51d', 'cbcb1d', 'a5cb1d', '85cb1d', '64cb1d', '45cb1d', '1ecd1e');
    
    if(login_field){login_value = $F(login_field);}
    
    strength = CommikForm.get_password_strength($F(field), login_value);
    
    switch(strength){
      case 0:
        status = "";
        break;
      case 1:
      case 2:
        status = CommikForm.message_very_weak;
        break;
      case 3:
      case 4:
        status = CommikForm.message_weak;
        break;
      case 5:
      case 6:
        status = CommikForm.message_medium;
        break;
      case 7:
      case 8:
        status = CommikForm.message_strong;
        break;
      case 9:
      case 10:
        status = CommikForm.message_very_strong;
        break;
        
    }
    
    parent.select('div.progress').each(function(progress){
      progress.innerHTML = '<div style="background-color:#' + color[strength] + ';height:100%;width:' + strength + '0%;"></div>';
    });
    
    parent.select('div.message').each(function(message){
      message.innerHTML = status;
    });

  },
  
  get_password_strength: function(password, login){
    var pass_length = password.length;
    var pass_strip = "";
    var numeric = 0;
    var symbols = 0;
    var upper = 0;
    var strength = 0;
    
    if(password == ''){return 0;}
    
    if(login == password){return 1;}
    
    pass_strip = password.replace(/[0-9]/g,"");
    numeric = password.length - pass_strip.length;
    
    pass_strip = password.replace(/\W/g,"");
    symbols = password.length - pass_strip.length;
    
    pass_strip = password.replace(/[A-Z]/g,"");
    upper = password.length - pass_strip.length;
    
    if(numeric > 3) {numeric = 3;}
    if(symbols > 3) {symbols = 3;}
    if(upper > 3) {upper = 3;}
    if(pass_length > 5) {pass_length = 5;}
    
    strength = ((pass_length*10)-20) + (numeric*10) + (symbols*15) + (upper*10);
    strength = Math.round(strength/10);    
    if(strength < 0) {strength = 0;}
    if(strength > 10) {strength = 10;}
    
    return strength;
  },
  
  pop_terms: function(event, url_terms){
    var pop_width = 800;
    var pop_height = 550;
    var pop = window.open(url_terms, "terms", "status=0,toolbar=0,location=0,menubar=0,directories=0,resizable=1,scrollbars=1,height=" + pop_height + ",width=" + pop_width);
    var posX = (screen.width - pop_width)/2;
    var posY = (screen.height - pop_height)/2; 
    
    pop.moveTo(posX, posY);
    
    event.stop();
  }
};

Event.observe(window, 'load', CommikForm.generate);