Ext.ns('S100');

S100.Community100 = function() {
    this.stepsEl = Ext.get('steps');

    S100.observer.on('fb_status', this.onFbGetLoginStatus, this);
    
    // Get cookie value and case boolean
    this.step1Setup = (/^true|1$/i).test(document.cookie.match(/c100_submit_step1_complete=(false|true|0|1);/)[1]);
    this.step2Setup = (/^true|1$/i).test(document.cookie.match(/c100_submit_step2_complete=(false|true|0|1);/)[1]);
    this.step3Setup = (/^true|1$/i).test(document.cookie.match(/c100_submit_step3_complete=(false|true|0|1);/)[1]);

    if (this.step2Setup) {
        this.setupStep3();
    } else {
        // this.setupStep1();
    }
};

// Set cookie and instance value for steps processed
S100.Community100.prototype.setSubmitStep = function(stepName, value) {
    value = value || true;
    document.cookie = 'c100_submit_' + stepName + '_complete=' + value;
    this[stepName+'Setup'] = true;
};

S100.Community100.prototype.onFbGetLoginStatus = function(opts) {
    var session = opts.session;

    if (session) {
        S100.fbSession = session;
        this.setSubmitStep('step1', true);

        if (this.step2Setup) { return; }

        if (Ext.isObject(S100.fbUser)) {
            this.setupSteps();
        } else {
            FB.api('/me', function(res) {
                S100.fbUser = res;

                this.setupSteps();
            }.createDelegate(this));
        }
    } else {
        this.setupStep1();
    }
};

S100.Community100.prototype.setupSteps = function() {
    this.setupStep1();
    this.setupStep2();
    this.setupStep3();
};

S100.Community100.prototype.setupStep1 = function() {
    this.stepsEl.child('.step1 .disable-step').hide();
    
    if (!Ext.isObject(S100.fbSession)) {
        Ext.fly('submit-login-btn').show();
    } else {
        if (Ext.fly('submit-login-btn')) {
            Ext.fly('submit-login-btn').remove();
        }
        // Add name and photo to step 1
        Ext.fly('fb-profile').child('img')
          .set({src: 'https://graph.facebook.com/me/picture?access_token=' + S100.fbSession.access_token});
        Ext.fly('fb-profile').child('.logged-in .name')
          .update('<p><small>Logged in as:</small><br><a href="' + S100.fbUser.link + '">' + S100.fbUser.name + '</p>');
    }
};

S100.Community100.prototype.setupStep2 = function() {
    if (!this.step1Setup) { return; }

    this.stepsEl.child('.step1').replaceClass('active', 'complete');
    this.stepsEl.child('.step1 .disable-step').show();
    
    this.stepsEl.child('.step2').addClass('active');
    Ext.fly('submit-c100-form').insertFirst({tag: 'input', "type": 'hidden', name: 'community_person[submitted_by]', value: S100.fbUser.id});
    this.stepsEl.child('.step2 .disable-step').hide();
};

S100.Community100.prototype.setupStep3 = function() {
    if (!this.step2Setup) { return; }
    this.setSubmitStep('step3', true);
    
    this.stepsEl.child('.step2').replaceClass('active', 'complete');
    this.stepsEl.child('.step2 .disable-step').show();
    
    this.stepsEl.child('.step3').addClass('active');
    this.stepsEl.child('.step3 .disable-step').hide();
    
    var leftPos = this.stepsEl.child('.step1').getWidth();
    leftPos += parseInt(this.stepsEl.child('.step2').getStyle('margin-right'), 10) * 2;
    if (Modernizr.csstransitions) {
        this.stepsEl.setStyle('left', -leftPos + 'px');
    } else {
        this.stepsEl.animate({left: {to: -leftPos, unit: 'px'}}, 0.35, null, 'easeNone');
    }
};