/*
 * gzPrettyForms - jQuery Plugin
 * simple and fancy form plugin
 *
 * Copyright (c) 2009 Gijs van Zon MA
 *
 * Version: 0.1.0 (25/12/2009)
 * Requires: jQuery v1.3+
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */

(function($){

  $.fn.gzPrettyForms = function(options){

    var extraBrowserWidth = 100;

    return this.each(function(){

      $this = this;
      $element = $($this);

      switch($this.tagName){
        case 'INPUT':
        case 'input':

          switch($element.attr('type')){
            case 'text':
              $element
                .addClass('gzPrettyForms-input');

              break;
          case 'radio':
          case 'checkbox':

            $element.addClass('gzPrettyForms-' + $element.attr('type'));

            if(!$element.next().is('label')) $element.after($('<label for="' + $element.attr('id') + '"><!-- --></label>').addClass('emptyLabel'));

            if($element.attr('checked')){
              $element.next()
                .data('checked', true)
                .addClass('checked');
            }else{
              $element.next().data('checked', false);
            };

            if($element.is(':disabled')){
              $element.next().addClass('disabled');
            };

            if($element.attr('type') == 'radio'){
              $element.bind('change', function(e){
                var label = $(this).next();

                var name = $(this).attr('name');
                name = (name+'').replace(/[\\"'\[\]]/g, '\\$&').replace(/\u0000/g, '\\0');
                $('input[name=' + name + ']').attr('checked', false);
                $('input[name=' + name + '] + label').removeClass('checked');
                $(this)
                  .attr('checked', 'checked')
                  .next().addClass('checked');
              });
            }else{
              $element.bind('change', function(e){
                var label = $(this).next();

                if($(this).is(':disabled')){
                  label.addClass('disabled');
                }else{
                  label.removeClass('disabled');
                };

                if($(this).attr('checked')){
                  label
                    .data('checked', true)
                    .addClass('checked');
                }else{
                  label
                    .data('checked', false)
                    .removeClass('checked');
                };
              });
            };
            break;
            case 'file':

              var self = this;

              var button = $('<div>').addClass('gzPrettyForms-file-button').html(browse);

              var attributes = $(self).attr('title').replace(/^\s+|\s+$/g,"").split(',');
              for(var i = 0; i < attributes.length; i++){
                var value = attributes[i].split(':');
                if(value[0] == 'route') button.data('route', value[1]);
                if(value[0] == 'target') button.data('target', value[1]);
                if(value[0] == 'single') button.data('single', value[1]);
                if(value[0] == 'title') button.data('title', value[1]);
              }

              if(button.data('title')){
                button.html(button.data('title'));
              }

              if(button.data('single')){
                $(self).addClass('gzPrettyForms-file').wrap('<div class="gzPrettyForms-file-holder">');

                var fakeFile = $('<div>').addClass('gzPrettyForms-file-fake');
                var input = $('<input type="text">');
                fakeFile
                  .append(input)
                  .append(button);

                $(self)
                  .after(fakeFile)
                  .css('width', input.width())
                  .attr('title', '')
                  .bind('change', function(){
                    input.val($(this).val());
                  });
              }else{
                $(self).before(button);
                $(self).remove();

                button.data('originalText', button.text());

                new AjaxUpload(button,{
                	action: button.data('route'),
                	name: 'file',
                	onSubmit: function(){
                    button.addClass('uploading');
                    button.data('interval', setInterval(function(){
                      if(button.text().length > 5)
                      {
                        button.text('');
                      }
                      else
                      {
                        button.text(button.text() + '.');
                      }
                    }, 200));
                	},
                	onComplete: function(file, response){
                    clearInterval(button.data('interval'));
                    button.text(button.data('originalText'));
                    button.removeClass('uploading');

                    var image = $(button.data('target'));

                    if(!image.find('ul').length) $(button.data('target')).append('<ul>');

                    var ul = image.find('ul');

                    if($(response).length < 1){
                      var li  = $('<li>').html(response);
                    }else{
                      var li = $(response);
                    }

                    ul.find('li.error').remove();
                    li.appendTo(ul);

                    li.find('input').gzPrettyForms().fhInputClear();

                    if(parent.window.location != window.location){
                      parent.fancybox.resize($('#iframe').outerHeight());
                    }
                	}
                });
              }
              break;
            case 'password':
              $element.addClass('gzPrettyForms-input');

              break;
            case 'submit':

              break;
          }

          break;

        /**
         * Create prettySelectBox
         */
        case 'SELECT':
        case 'select':

          var $selectWrapper = $('<p class="' + $element.attr('class') + ' gzPrettyForms-select">');
          $element.wrap($selectWrapper);

          var $select = $('<a></a>')
            .attr('class', 'gzPrettyForms-select-option')
            .css('width', $element.outerWidth() - 24)
            .html($element.find('option:selected').text())
            .prepend('<span><!-- --></span>');

          if($element.is(':disabled')){
            $select.addClass('disabled');
          };
          
          $element
            .before($select)
            .addClass('gzPrettyForms-original-select')
            .data('select', $select)
            .bind('focus', function(){
              $(this).data('select').addClass('focus');
            })
            .bind('blur', function(){
              $(this).data('select').removeClass('focus');
            })
            .bind('keydown', function(e){
              if(e.keyCode == 13){
                $(this).closest('form').submit();
              }
            })
            .bind('change', function(e){
              if($(this).is(':disabled')){
                $select.addClass('disabled');
              };
              $(this).data('select').html('<span><!-- --></span>' + this.options[this.selectedIndex].text);
            });
          break;

        /**
         * Create prettyButton
         */
        case 'BUTTON':
        case 'button':
          break;

        /**
         * Create prettyTextarea
         */
        case 'TEXTAREA':
        case 'textarea':
            $element.addClass('gzPrettyForms-textarea');
          break;
      }

    });
  };

})(jQuery);