Ext.ns('blablar');
Ext.QuickTips.init();

Ext.ux.IFrameComponent = Ext.extend(Ext.BoxComponent,
{
   onRender : function(ct, position)
   {
      this.el = ct.createChild(
      {
         tag : 'iframe', id : 'iframe-' + this.id, frameBorder : 0, src : this.url
      }
      );
   }
}
);

function renderPost(value, p, record)
{
   var post = record.data['contents'].replace(/(<([^>]+)>)/ig, "");
   // strip html

   if (post.length > 200)
   {
      post = post.substr(0, 200) + ' [...]';
      // shorten it
   }

   return String.format('<p><b>{0}</b><br />{1}</p>', value, post);
}



function enviarSMS()
{

   var genres = new Ext.data.Store(
   {
      reader : new Ext.data.JsonReader(
      {
         fields : ['id', 'numero'],
         root : 'rows'
      }
      ),
      proxy : new Ext.data.HttpProxy(
      {
         url : 'numeros.aspx'
      }
      ),
      autoLoad : true
   }
   );

   var mensajero = new Ext.FormPanel(
   {
      labelWidth : 80,
      url : './enviar.aspx',  // en ejemplo
      iconCls : 'sms-icon',
      frame : true,
      title : 'Escribe tu mensaje',
      monitorValid : true,
      // ENTRADA
      items : [
      {
         xtype : 'combo',
         fieldLabel : 'N&uacute;mero celular',
         name : 'Celdestinatario',
         mode : 'local',
         store : genres,
         displayField : 'numero',
         valueField : 'id',
         hiddenName : 'destinatario',
         vtype : 'alphanum',
         maxLength : 10,
         // minLength : 10,
         maxLengthText : 'El numero de caracteres m&iacute;nimo es  10',
         // minLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         width : 120
      }
      ,
      {
         xtype : 'textarea',
         fieldLabel : 'Mensaje',
         emptyText : 'Escribe aqui tu mensaje, maximo 100 letras',
         name : 'mensaje',
         width : 260,
         height : 60,
         maxLength : 100,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es de 100',
         allowBlank : false
      }
      ,
      {
         fieldLabel : 'C&oacute;digo de Validaci&oacute;n'
         , xtype : 'box'
         , anchor : ''
         , autoLoad : true
         , isFormField : true
         , autoEl :
         {
            tag : 'div', children : [
            {
               tag : 'img'
               , qtip : 'Escribe este texto en el recuadro de abajo.'
               , src : './images/validar.aspx?nc=' + new Date().getTime()
            }
            ,
            {
               tag : 'div'
               , style : 'margin:0 0 0 0'
               , html : ''
            }
            ]
         }
      }
      ,
      {
         name : 'checkcode',
         xtype : 'textfield',
         allowBlank : false,
         vtype : 'alphanum',
         maxLength : 10,
         isFormField : true,
         width : 120
      }
      ]
   }
   );


   // VENTANA PRINCIPAL
   var sms_win = new Ext.Window(
   {
      title : 'Envio de Mensajes',
      layout : 'fit',
      width : 440,
      height : 310,
      iconCls : 'msg-icon',
      closable : true,
    renderTo: document.hostess,
      resizable : false,
      plain : true,
      // border : true,
      draggable : true
      , modal : false
      , closeAction : 'close'
      , resizable : false
      , shadow : true
      , items : [
      {
         xtype : 'tabpanel'
         , activeTab : 0
         , defaults :
         {
            autoScroll : true, bodyStyle : 'padding:8px'
         }
         , region : 'center'
         , deferredRender : false
         , autoScroll : true
         , items : [mensajero,
         {
            title : '&iquest;Necesitas ayuda?'
            , iconCls : 'help-icon'
            , autoLoad :
            {
               url : 'sms-faq.html'
            }
            , width : 300
            , height : 200
         }
         ],

         // BOTON
         buttons : [
         {
            text : 'Enviar',
            formBind : true,
            // FUNCION DE BOTON PARA ENVIAR MENSAJE
            handler : function()
            {
               mensajero.getForm().submit(
               {
                  method : 'POST',
                  waitTitle : 'Espere',
                  waitMsg : 'Enviando mensaje...',

                  // FUNCION PARA ENVIO DE MENSAJE

                  success : function()
                  {
                     /* Ext.Msg.alert('Aviso',
                     '<b>El mensaje se ha enviado.</b><br>Recuerda que puede tardar hasta 1 minuto<br>en llegar a su destinatario'); */
                     postSMS();
                     sms_win.close();
                  }
                  ,

                  // VALIDACIONES

                  failure : function(form, action)
                  {
                     if(action.failureType == 'server')
                     {
                        obj = Ext.util.JSON.decode(action.response.responseText);
                        Ext.Msg.show({icon: 'cant-msg-icon', title: 'Fallo el env&iacute;o de mensaje', msg: obj.errors.reason, buttons: Ext.Msg.OK});
                     }
                     else
                     {
                        Ext.Msg.alert('Warning!', 'Server is unreachable : ' + action.response.responseText);
                     }
                  }
               }
               );
            }
         }
         ]
      }
      ]
   }
   );
   sms_win.show();
}

function invitarBlablar()
{
   var invitacion = new Ext.FormPanel(
   {
      labelWidth : 80,
      url : './envioCorreo.aspx',  // en ejemplo
      iconCls : 'sms-icon',
      frame : true,
      title : 'Escribe tu invitaci&oacute;n personal',
      monitorValid : true,
      // ENTRADA
      items : [
      {
         xtype : 'textfield',
         fieldLabel : 'Correo 1',
         name : 'correo1',
         width : 200,
         vtype : 'email',
         allowBlank : false
      }
      ,
      {
         xtype : 'textfield',
         fieldLabel : 'Correo 2',
         name : 'correo2',
         vtype : 'email',
         width : 200,
         allowBlank : true
      }
      ,
      {
         xtype : 'textfield',
         fieldLabel : 'Correo 3',
         vtype : 'email',
         name : 'correo3',
         width : 200,
         allowBlank : true
      }
      ,
      {
         xtype : 'textfield',
         fieldLabel : 'Correo 4',
         name : 'correo4',
         vtype : 'email',
         width : 200,
         allowBlank : true
      }
      ,
      {
         xtype : 'textfield',
         fieldLabel : 'Correo 5',
         name : 'correo5',
         vtype : 'email',
         width : 200,
         allowBlank : true
      }
      ,
      {
         xtype : 'textarea',
         fieldLabel : 'Mensaje Personal',
         emptyText : 'Escribe aqui tu invitacion personal, maximo 200 letras',
         name : 'mensaje',
         width : 260,
         height : 130,
         maxLength : 200,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es de 200',
         allowBlank : false
      }
      ]
   }
   );


   var invita_win = new Ext.Window(
   {
      title : 'Invita a tus amigos a conocer blablar.com',
      layout : 'fit',
      width : 410,
      height : 410,
      iconCls : 'multiple-icon',
      // closable : true,
      resizable : false,
      plain : true,
      // border : true,
      draggable : true
      , modal : false
      , closeAction : 'hide'
      , resizable : false
      , shadow : true
      , items : [
      {
         xtype : 'tabpanel'
         , activeTab : 0
         , defaults :
         {
            autoScroll : true, bodyStyle : 'padding:8px'
         }
         , region : 'center'
         , deferredRender : false
         , autoScroll : true
         , items : [invitacion,
         {
            title : '&iquest;Necesitas ayuda?'
            , iconCls : 'help-icon'
            , autoLoad :
            {
               url : 'sms-faq.html'
            }
            , width : 300
            , height : 200
         }
         ]
      }
      ],

      // BOTON
      buttons : [
      {
         text : 'Enviar',
         formBind : true,
         // FUNCION DE BOTON PARA ENVIAR MENSAJE
         handler : function()
         {
            invitacion.getForm().submit(
            {
               method : 'POST',
               waitTitle : 'Espere',
               waitMsg : 'Enviando invitaci&oacute;n...',

               // FUNCION PARA ENVIO DE MENSAJE

               success : function()
               {
                  Ext.Msg.alert('Aviso', 'Invitaci&oacute;n enviada.', function(btn, text)
                  {
                     if (btn == 'ok')
                     {
                        invita_win.close();
                     }
                  }
                  );
               }
               ,

               // VALIDACIONES

               failure : function(form, action)
               {
                  if(action.failureType == 'server')
                  {
                     obj = Ext.util.JSON.decode(action.response.responseText);
                     Ext.Msg.alert('Fallo el env&iacute;o de mensaje', obj.errors.reason);
                  }
                  else
                  {
                     Ext.Msg.alert('Warning!', 'Server is unreachable : ' + action.response.responseText);
                  }
               }
            }
            );
         }
      }
      ]
   }
   );

   invita_win.show();
}


blablar.listaMensajes = Ext.extend(Ext.grid.GridPanel,
{
   initComponent : function()
   {
      var config =
      {
         trackMouseOver : true
         , columns : [
         {
            header : 'No'
            , width : 20
            , resizable : false
            , menuDisabled : true
            , sortable : true
            , dataIndex : 'lineaNo'
         }
         ,
         {
            header : 'Destinatario'
            , width : 80
            , resizable : false
            , menuDisabled : true
            , sortable : true
            , dataIndex : 'destino'
         }
         ,
         {
            header : 'Estatus'
            , menuDisabled : true
            , width : 45
            , sortable : true
            , dataIndex : 'estatus'
         }
         ,
         {
            header : "Mensaje"
            , menuDisabled : true
            , width : 190
            , sortable : true
            , dataIndex : 'mensaje'
         }
         ,
         {
            header : "Enviado el"
            , menuDisabled : true
            , width : 80
            , sortable : true
            // , renderer : date
            , dataIndex : 'enviado'
         }
         ]
         , viewConfig :
         {
            forceFit : true, enableRowBody : true, getRowClass : this.getRowClass
         }
         , loadMask :
         {
            msg : 'Cargando ...'
         }
      }
      ;

      this.on('rowdblclick', function (grid, rowIndex, e)
      {
         var r = grid.getStore().getAt(rowIndex);
         Ext.Msg.show(
         {
            title : 'Texto del mensaje'
            , msg : r.get('mensaje')
            , icon : Ext.MessageBox.INFO
         }
         );

      }
      );

      Ext.apply(this, Ext.apply(this.initialConfig, config));


      this.bbar = new Ext.PagingToolbar(
      {
         store : this.store
         , displayInfo : true
         , pageSize : 25
         , displayMsg : 'Mostrando del {0} al {1}, {2} en total'
         , emptyMsg : "No has enviado mensajes."

      }
      );
      blablar.listaMensajes.superclass.initComponent.apply(this, arguments);

      // load the store at the latest possible moment
      this.on(
      {
         afterlayout :
         {
            scope : this, single : true, fn : function()
            {
               this.store.load(
               {
                  params :
                  {
                     start : 0, limit : 25
                  }
               }
               );
            }
         }

      }
      );

   }
   // eo function initComponent
   /* , getRowClass : function(record, rowIndex, p, store)
   {
   p.body = record.get('mensaje');
   return p.body ? 'x-grid3-row-with-body' : '';
   } */

   , onRender : function()
   {
      this.store.load(
      {
         params :
         {
            start : 0, limit : 25
         }
      }
      );
      blablar.listaMensajes.superclass.onRender.apply(this, arguments);
   }
   // eo function onRender
}
);

Ext.reg('listaMensajes', blablar.listaMensajes);


function cargaListaSMS()
{

   var lstSMS_win = new Ext.Window(
   {
      title : 'Mensajes enviados',
      layout : 'fit',
      width : 610,
      height : 400,
      iconCls : 'sms-icon',
      // closable : true,
      resizable : false,
      plain : true,
      // border : true,
      draggable : true
      , modal : false
      , closeAction : 'close'
      , resizable : false
      , shadow : true
      , items : [
      {
         xtype : 'listaMensajes'
         , store : new Ext.data.JsonStore(
         {
            id : 'Mensajes'
            , totalProperty : 'totalCount'
            , root : 'rows'
            , url : './obtenSMS.aspx'
            // , sm : new Ext.grid.RowSelectionModel({singleSelect : true}
            , sm : new Ext.grid.RowSelectionModel(
            {
               singleSelect : true
               , listeners :
               {
                  rowselect : function(sm, rowIndex, record)
                  {
                     selRecordStore = record;
                  }
                  ,
                  rowdblclick : function(grid, rowIndex, e)
                  {
                     selRecordStore = record;
                  }
               }
            }
            )
            , fields : [
            {
               name : 'lineaNo', type : 'auto'
            }
            ,
            {
               name : 'destino', type : 'string'
            }
            ,
            {
               name : 'mensaje', type : 'string'
            }
            ,
            {
               name : 'enviado', type : 'auto'
            }
            ,
            {
               name : 'estatus', type : 'string'
            }
            ]
         }
         )
         , width : 610
         , height : 363
      }
      ]
   }
   );

   lstSMS_win.show();
}



function envioMultipleSMS()
{

   var genres = new Ext.data.Store(
   {
      reader : new Ext.data.JsonReader(
      {
         fields : ['id', 'numero'],
         root : 'rows'
      }
      ),
      proxy : new Ext.data.HttpProxy(
      {
         url : 'numeros.aspx'
      }
      ),
      autoLoad : true
   }
   );

   var mensajero = new Ext.FormPanel(
   {
      labelWidth : 80,
      url : './enviarm.aspx',  // en ejemplo
      iconCls : 'sms-icon',
      frame : true,
      title : 'Escribe tu mensaje, 5 n&uacute;meros m&aacute;ximo',
      // monitorValid : true,
      // ENTRADA
      items : [
      {
         xtype : 'combo',
         fieldLabel : 'Celular',
         name : 'Celdestinatario',
         mode : 'local',
         store : genres,
         displayField : 'numero',
         valueField : 'id',
         hiddenName : 'destinatario1',
         vtype : 'alphanum',
         maxLength : 10,
         // minLength : 10,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         // minLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         width : 120
      }
      ,
      {
         xtype : 'combo',
         fieldLabel : 'Celular',
         name : 'Celdestinatario',
         mode : 'local',
         store : genres,
         allowBlank : true,
         displayField : 'numero',
         valueField : 'id',
         hiddenName : 'destinatario2',
         // vtype : 'alphanum',
         maxLength : 10,
         // minLength : 10,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         // minLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         width : 120
      }
      ,
      {
         xtype : 'combo',
         fieldLabel : 'Celular',
         name : 'Celdestinatario',
         mode : 'local',
         allowBlank : true,
         store : genres,
         displayField : 'numero',
         valueField : 'id',
         hiddenName : 'destinatario3',
         // vtype : 'alphanum',
         maxLength : 10,
         // minLength : 10,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         // minLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         width : 120
      }
      ,
      {
         xtype : 'combo',
         fieldLabel : 'Celular',
         name : 'Celdestinatario',
         mode : 'local',
         store : genres,
         displayField : 'numero',
         valueField : 'id',
         hiddenName : 'destinatario4',
         // vtype : 'alphanum',
         allowBlank : true,
         maxLength : 10,
         // minLength : 10,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         // minLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         width : 120
      }
      ,
      {
         xtype : 'combo',
         fieldLabel : 'Celular',
         name : 'Celdestinatario',
         mode : 'local',
         allowBlank : true,
         store : genres,
         displayField : 'numero',
         valueField : 'id',
         hiddenName : 'destinatario5',
         // vtype : 'alphanum',
         maxLength : 10,
         // minLength : 10,
         maxLengthText : 'El numero de caracteres m&iacute;nimo es  10',
         // minLengthText : 'El numero de caracteres m&aacute;ximo es  10',
         width : 120
      }
      ,
      {
         xtype : 'textarea',
         fieldLabel : 'Mensaje',
         emptyText : 'Escribe aqui tu mensaje, maximo 100 letras',
         name : 'mensaje',
         width : 260,
         height : 60,
         maxLength : 100,
         maxLengthText : 'El numero de caracteres m&aacute;ximo es de 100',
         allowBlank : false
      }
      ,
      {
         fieldLabel : 'C&oacute;digo de Validaci&oacute;n'
         , xtype : 'box'
         , anchor : ''
         , autoLoad : true
         , isFormField : true
         , autoEl :
         {
            tag : 'div', children : [
            {
               tag : 'img'
               , qtip : 'Escribe este texto en el recuadro de abajo.'
               , src : './images/validar.aspx?nc=' + new Date().getTime()
            }
            ,
            {
               tag : 'div'
               , style : 'margin:0 0 0 0'
               , html : ''
            }
            ]
         }
      }
      ,
      {
         name : 'checkcode',
         xtype : 'textfield',
         allowBlank : false,
         vtype : 'alphanum',
         maxLength : 10,
         isFormField : true,
         width : 120
      }
      ]
   }
   );


   // VENTANA PRINCIPAL
   var sms_win = new Ext.Window(
   {
      title : 'Envio Multiple de Mensajes',
      layout : 'fit',
      width : 420,
      height : 420,
      iconCls : 'multiple-icon',
      closable : true,
      resizable : false,
      plain : true,
      // border : true,
      draggable : true
      , modal : false
      , closeAction : 'close'
      , resizable : false
      , shadow : true
      , items : [
      {
         xtype : 'tabpanel'
         , activeTab : 0
         , defaults :
         {
            autoScroll : true, bodyStyle : 'padding:8px'
         }
         , region : 'center'
         , deferredRender : false
         , autoScroll : true
         , items : [mensajero,
         {
            title : '&iquest;Necesitas ayuda?'
            , iconCls : 'help-icon'
            , autoLoad :
            {
               url : '5alavez-faq.html'
            }
            , width : 300
            , height : 200
         }
         ],

         // BOTON
         buttons : [
         {
            text : 'Enviar',
            // formBind : true,
            // FUNCION DE BOTON PARA ENVIAR MENSAJE
            handler : function()
            {
               mensajero.getForm().submit(
               {
                  method : 'POST',
                  waitTitle : 'Espere',
                  waitMsg : 'Enviando mensaje...',

                  // FUNCION PARA ENVIO DE MENSAJE

                  success : function()
                  {
                     Ext.Msg.alert('Aviso', 'Mensaje enviado.');
                     window.location = './default.aspx';
                  }
                  ,

                  // VALIDACIONES

                  failure : function(form, action)
                  {
                     if(action.failureType == 'server')
                     {
                        obj = Ext.util.JSON.decode(action.response.responseText);
                        Ext.Msg.alert('Fallo el env&iacute;o de mensaje', obj.errors.reason);
                     }
                     else
                     {
                        Ext.Msg.alert('Warning!', 'Server is unreachable : ' + action.response.responseText);
                     }
                  }
               }
               );
            }
         }
         ]
      }
      ]
   }
   );
   sms_win.show();
}


function enviarSMSdePrueba()
{

   var mensajero = new Ext.FormPanel(
   {
      labelWidth : 80,
      url : './test_enviar.aspx',  // en ejemplo
      frame : true,
      monitorValid : true,
      // ENTRADA
      items : [
      {
         name : 'celular',
         xtype : 'textfield',
         fieldLabel : 'Celular',
         allowBlank : false,
         vtype : 'alphanum',
         maxLength : 10,
         isFormField : true,
         width : 120
      }
      ,
      {
         name : 'nombre',
         fieldLabel : 'Tu nombre',
         xtype : 'textfield',
         allowBlank : false,
         vtype : 'alphanum',
         maxLength : 10,
         isFormField : true,
         width : 120
      }
      ]
   }
   );


   // VENTANA PRINCIPAL
   var sms_win = new Ext.Window(
   {
      title : 'Para que veas que si sirve =)',
      layout : 'fit',
      width : 260,
      height : 160,
      iconCls : 'msg-icon',
      closable : true,
      resizable : false,
      plain : true,
      // border : true,
      draggable : true
      , modal : false
      , closeAction : 'close'
      , resizable : false
      , shadow : true
      , items : [mensajero,
      {
         fieldLabel : 'Te enviaremos un SMS a tu celular.',
         name : 'Limite',
         xtype : 'label'
         //         isFormField : true
      }
      ]
      // BOTON
      , buttons : [
      {
         text : 'Enviar',
         // formBind : true,
         // FUNCION DE BOTON PARA ENVIAR MENSAJE
         handler : function()
         {
            mensajero.getForm().submit(
            {
               method : 'POST',
               waitTitle : 'Espere',
               waitMsg : 'Enviando mensaje...',

               // FUNCION PARA ENVIO DE MENSAJE

               success : function()
               {
                  Ext.Msg.alert('Aviso', 'Mensaje enviado.');
                  sms_win.close();
               }
               ,

               // VALIDACIONES

               failure : function(form, action)
               {
                  if(action.failureType == 'server')
                  {
                     obj = Ext.util.JSON.decode(action.response.responseText);
                     Ext.Msg.alert('Fallo el env&iacute;o de mensaje', obj.errors.reason);
                  }
                  else
                  {
                     Ext.Msg.alert('Warning!', 'Server is unreachable : ' + action.response.responseText);
                  }
               }
            }
            );
         }
      }
      ]

   }
   );
   sms_win.show();
}

function postSMS()
{
   var sms_winok = new Ext.Window(
   {
      title : 'Mensaje Enviado',
      layout : 'fit',
      width : 190,
      height : 160,
      iconCls : 'info-icon',
      closable : false,
      resizable : false,
      plain : true,
      // border : true,
      draggable : true
      , modal : true
      , closeAction : 'close'
      , resizable : false
      , shadow : true
      , items : [ new Ext.ux.IFrameComponent(
      {
         id : id, url : 'publicidad.aspx?seccion=PostSMS'
      }
      ) ]
      , buttons : [
      {
         text : 'Aceptar',
         // formBind : true,
         // FUNCION DE BOTON PARA ENVIAR MENSAJE
         handler : function()
         {
            sms_winok.close();
         }
      }
      ]
   }
   );
   sms_winok.show();
}