$(function() {
  //Stores IDs
  var accounts = [];
  
  // Dialog
  $('#dialog').dialog({
    autoOpen: true,
    width: 400,
    modal: true,
    buttons: {
      'Ok': function() { 
        var _accounts = $('#TwitterAccounts').val().split(',');
        accounts = [];
        //Cleans data
        for(var i in _accounts) {
          var data = $.trim(_accounts[i]);
          if (data != '') {
            accounts.push(data);
          }
        }/*
        //Validates quantity of accounts
        if(accounts.length != 3) {
          $('#warning').show();warning
          return false;
        }*/
        //Gets data
        getData();
        //Closes dialog window
        $('#dialog').dialog('close');
      }
    }
  });
  
  // Dialog Link
  $('#accounts_link').click(function() {
    $('#warning').hide();
    $('#dialog').dialog('open');
    return false;
  });
  
  //Refresh
  $('#accounts_refresh').click(getData);

  //hover states on the static widgets
  $('#accounts_link, #accounts_refresh').hover(
    function() { $(this).addClass('ui-state-hover'); }, 
    function() { $(this).removeClass('ui-state-hover'); }
  );
  
  //Prevents submitting the form
  $('#TwitterForm').submit(function () { return false});
  
  //Gets the data from CakePHP(twitter)
  function getData() {
    $("div#twitterData ul").html('');
    
    //Setting ajax timeout to 10 seconds
    $.ajaxSetup({timeout:10000});
    
    //url_data comes from home.ctp
    myajax = $.getJSON(url_data + "/", {accounts : accounts.join(',')}, function (j) {
      var options = '';

      if(j.error == 1) {
        $('#warning span.msg').html(j.msgError);
        $('#warning').show();
        $('#dialog').dialog('open');
        return false;
      }
      
      if(j.data.length > 0) {
        
        for (var i = 0; i < j.data.length; i++) {
          options += '<li>';
          if(j.data[i].profile_image_url != '') {
            options += '<div class=\'foto\'>';
            options += '<img src=\'' + j.data[i].profile_image_url + '\'/>';
            options += '</div>'
          }
          options += ' <div class=\'meta\'> Status for : ' + j.data[i].screen_name + '</div>';
          options += j.data[i].text + ' <div class=\'meta\'>' + j.data[i].created_at ;
          options += ' from ' + j.data[i].source + '</div>';
          options += ' <div class=\'clear\'></div>';
          options += '</li>';
        }
      }
      //Updates the screen
      $("div#twitterData ul").html(options);
    });
  }
  //Default options for blockUI
  $.blockUI.defaults = { 
    message : '<h1>Please wait...</h1>',
    overlayCSS:{
                  backgroundColor : '#fff',
                  opacity:'0.2'
               },
    css: { 
       padding:        0,
       margin:         0,
       width:          '30%', 
       top:            '40%', 
       left:           '35%', 
       textAlign:      'center', 
       color:          '#aaa', 
       border:         '3px solid #aaa',
       backgroundColor:'#fff',
       cursor:         'wait'
    }
  };
  
  //Shows message on ajax start
  $("#twitterData").ajaxStart(function() {
     $(this).block();
  });
  //Shows message on ajax error and abort ajax
  $("#twitterData").ajaxError(function() {
     $(this).unblock();
     $.blockUI({message: '<h1>An error has ocurred!</h1>'});
     //Oops an error, abort ajax
     myajax.abort();
     setTimeout($.unblockUI, 2000);
  });
  //Hides message
  $("#twitterData").ajaxStop(function() {
     $(this).unblock();
  });
  
  $.jGrowl("By <a href='http://www.ficticio.com'>ficticio.com</a>", { sticky: true, theme:'twitter' });
  
});