/*
 *
 * File: login.php
 *
 * Description: CMS Ext login page
 *
 */
function loadURL(url) {
	var oRequest = new XMLHttpRequest();
	oRequest.open('GET', url, false);
	//oRequest.setRequestHeader("User-Agent", navigator.userAgent);
	oRequest.send(null)
	
	return oRequest.responseText;
};

Ext.define('EnertechXchange.CMS.Login', {
    extend : 'Ext.form.Panel',
    timeout: 360000,
    scope : this,
    id: 'loginForm',

    initComponent : function () {

        Ext.apply(this, {

            frame : true,
            scope : this,
            title : 'Xchange Documentation System Login',
            width : 350,
            layout : 'anchor',
            cls : 'login',
            items : [
                this.fieldset = new Ext.form.FieldSet({
                        style : 'padding: 10px 10px 10px 10px',
                        title : 'Login',
                        items : [
                            this.eulaAccepted = new Ext.form.Hidden({
                                    name : 'eulaAccepted',
                                    id : 'eulaAccepted',
                                    value: 0
                                }),
                            
                            this.username = new Ext.form.TextField({
                                    allowBlank : false,
                                    fieldLabel : 'User Name *',
                                    name : 'username',
                                    listeners : {
                                        scope : this,
                                        specialkey : function (f, e) {
                                            if (e.getKey() == e.RETURN || e.getKey() == e.ENTER) {
                                                this.doLogin();
                                            }
                                        }
                                    }
                                }),
                            this.password = new Ext.form.TextField({
                                    allowBlank : false,
                                    fieldLabel : 'Password *',
                                    inputType : 'password',
                                    name : 'password',
                                    scope : this,
                                    listeners : {
                                        scope : this,
                                        specialkey : function (f, e) {
                                            if (e.getKey() == e.RETURN || e.getKey() == e.ENTER) {
                                                this.doLogin();
                                            }
                                        }
                                    }
                                }),
                            this.site = new Ext.form.ComboBox({
                                    displayField : 'name',
                                    emptyText : 'Select site ...',
                                    fieldLabel : 'Site *:',
                                    labelSeparator : '',
                                    forceSelection : true,
                                    queryMode : 'local',
                                    name : 'site',
                                    style : 'margin-bottom: 0px;',
                                    triggerAction : 'all',
                                    typeAhead : true,
                                    valueField : 'id',
                                    store : new Ext.data.Store({
                                        listeners : {
                                            scope : this,
                                            load : function (me, records, successful) {
                                                if (successful == false) {
                                                    displayErrors(this.site.store, 'store');
                                                }
                                            }
                                        },
                                        proxy : {
                                            type : 'ajax',
                                            url : 'ajax/login_ajax.php',
                                            extraParams : {
                                                'a' : 'sites',
                                                'prgid' : 1,
                                                'fstl' : 1
                                            },
                                            reader : {
                                                type : 'json',
                                                root : 'results',
                                                totalProperty : 'total'
                                            },
                                            actionMethods : {
                                                read : 'POST'
                                            }
                                        },
                                        fields : ['id', 'name'],
						                sorters : [{
											property : 'name',
											direction : 'ASC'
										}]
                                    })
                                }), {
                                xtype : 'container',
                                padding : '5 0 0 0',
                                style : {
                                    'text-align' : 'right'
                                },
                                items : [{
                                        xtype : 'button',
                                        handler : this.doLogin,
                                        iconCls : 'iconLogin',
                                        scope : this,
                                        text : 'Login',
                                        padding : '2 10 2 10'
                                    }
                                ]
                            },
                            this.errorMessage = new Ext.container.Container({
                                    bodyStyle : 'margin: 10px 10px 5px 10px; text-align: center',
                                    hidden : true,
                                    id : 'errorMessage'
                                })
                        ]
                    }),

                this.forgotPassword = new Ext.form.field.Checkbox({
                        boxLabel : 'Forgot Password',
                        labelSeparator : '',
                        cls : 'form_label',
                        style : 'text-align: center',
                        listeners : {
                            change : function () {
                                var forgotPasswordForm = Ext.getCmp('forgotPasswordForm');
                                if (this.getValue() == true) {
                                    forgotPasswordForm.getForm().reset();
                                    forgotPasswordForm.errorForgotPasswordMessage.el.dom.innerHTML = '';
                                    forgotPasswordForm.show();
                                } else {
                                    forgotPasswordForm.hide();
                                }
                            }
                        }
                    })

            ]//end of items
        });

        EnertechXchange.CMS.Login.superclass.initComponent.apply(this, arguments);

        if (this.site) {
            //this.site.fieldLabel  = '';
            this.site.hide();
            //this.site.store.load();
            //this.site.setValue(0);
        }
        
    },
    doLogin : function () {
        var me = this;
        if (this.username.getValue() == '' && this.password.getValue() == '') {
            this.username.markInvalid('User Name is required');
            this.password.markInvalid('Password is required');
            return;
        } else if (this.username.getValue() == '') {
            this.username.markInvalid('User Name is required');
            return;
        } else if (this.password.getValue() == '') {
            this.password.markInvalid('Password is required');
            return;
        }
        this.getEl().mask('Logging in ...');

        this.getForm().submit({
            submitEmptyText : false,
            scope : this,
            url : 'ajax/login_ajax.php',
            params : {
                'mysite' : this.site.getValue()
            },
            success : function (form, action) {
                //var obj = Ext.JSON.decode(action.response.responseText);
                var obj = Ext.decode(action.response.responseText);
                //console.log(obj);
                if (obj.success && obj.returnPage) {
               
                    //if access level < 99 ->redirect, if not show site select
                    window.location = obj.returnPage;
                    this.errorMessage.hide();
                    
                } else {
                    if (me.site) {
                        me.site.store.load({
                            callback: function(){
                                if (me.site.store.getCount() > 0) {
                                    me.errorMessage.hide();
                                    me.site.setValue('Select site ...');
                                    me.site.show();
                                } else {
                                    var message = ' There are no sites with loaded data, please load data first ';
                                    me.errorMessage.el.dom.innerHTML = '<div class="x-panel-bwrap"><div style="margin: 5px 0px; text-align: center;" class="x-panel-body x-panel-body-noheader"><p style="color: rgb(255, 0, 0); font-weight: bold;">' + message + '</p></div></div>';
                                    me.errorMessage.show();
                                }
                                me.getEl().unmask();
                            }
                        });
                    }
                }
            },
            failure : function (form, action) {
                if(action.result.eulaAccepted == 0){
                        
                                this.getEl().unmask();
                                var win = Ext.widget('window', {
                                    title: 'Xchange End User License Agreement',
                                    html: loadURL('eula_2015.html'),

                                    modal: true,
                                    width: 700,
                                    height: 400,
                                    bodyStyle: 'padding: 10px 20px;',
                                    closable: false,
                                    autoScroll: true,
                                    buttons: [
                                    {
                                        text: 'Download as PDF',
                                        style: 'margin-right: 420px;',
                                        href: 'EULA.pdf'
                                    }, {                                    
                                        text: 'Decline',

                                        handler: function() {
                                            this.up('window').close();
                                            var messageCmp = Ext.getCmp('errorMessage');
                                            messageCmp.el.dom.innerHTML = '<div class="x-panel-bwrap"><div style="margin: 5px 0px; text-align: center;" class="x-panel-body x-panel-body-noheader"><p style="color: rgb(255, 0, 0); font-weight: bold;">' + (typeof(action.result) != 'undefined' ? action.result.errors : 'Sorry, we were not able to identify you.') + '</p></div></div>';
                                            messageCmp.show();
                                            //this.getEl().unmask();
                                        }
                                    }, {
                                        text: 'Accept',
                                        disabled: true,
                                        id: 'btnAccept',
                                        handler: function() {
                                            this.up('window').close();
                                            Ext.getCmp('eulaAccepted').setValue(1);
                                            Ext.getCmp('loginForm').doLogin();
                                        }
                                    }],
                                    listeners: {

                                        afterrender: function(){
                                            win.getTargetEl().on('scroll', function(e, t) {
                                            var height = win.getTargetEl().getHeight();
                                            if (height + t.scrollTop >= t.scrollHeight) {
                                                //console.log('bottom');
                                                Ext.getCmp('btnAccept').enable();
                                            }
                                        });
                                        }
                                    }
                                });
                                win.show();
                                //console.log(win);
                                //win.header.body.applyStyles({ 
                                //'background-color':'red',
                                //'border': '1px solid blue'
                                //});

                 } //if user had not accepted eula yet
                 else {
                    this.username.markInvalid('User Name might be invalid');
                    this.password.markInvalid('Password might be invalid');
                    this.errorMessage.el.dom.innerHTML = '<div class="x-panel-bwrap"><div style="margin: 5px 0px; text-align: center;" class="x-panel-body x-panel-body-noheader"><p style="color: rgb(255, 0, 0); font-weight: bold;">' + (typeof(action.result) != 'undefined' ? action.result.errors : 'Sorry, we were not able to identify you.') + '</p></div></div>';
                    this.errorMessage.show();
                    this.getEl().unmask();
                }
            }
        });
    }
}); //end of form panel