document.observe('dom:loaded', function(){
    checkHTML5Feature();
    frontArticleList();
    miniTabControl();
});

function checkHTML5Feature(){
    // Used for detacting HTML5 features for an input element.
    var input = new Element('input');
    var isUnsupport = (function(){
        var ua = navigator.userAgent.toString().toLowerCase();
        return (/(safari|iphone|android)/).test(ua)
    })();
    // check for placeholder attribute support
    if(!('placeholder' in input)){
        var toggle_input = new togglingInput();
        $$('form').each(function(f){ toggle_input.obsvAllType(f); });
    }
    
    // check for required attribute support
    if(!('required' in input) || isUnsupport){
        contactUsForm();
    }
}

var togglingInput = Class.create({
    obsvAllType: function(form) {
        var form = typeof(form) == 'string' ? $(form) : form;
        if (form) {
            this.obsvTypeText(form.select('input[type="text"], input[type="search"]'));
            this.obsvTypePassword(form.select('input[type="password"]'));
        }
    },
    obsvTypeText: function(inp) {
        var self = this;
        inp = typeof(inp) == 'string' ? $$(inp) : inp;

        if (inp) {
            inp.each(function(i) {
                var placeholder = i.readAttribute('placeholder');
                if (placeholder) {
                    if (i.value.blank()) i.value = placeholder;
                    i.observe('focus', function(e) {
                        if (this.value == placeholder) this.clear();
                    });
                    i.observe('blur', function(e) {
                        if (this.value.blank()) this.value = placeholder;
                    });
                }
            });
        }
    },
    obsvTypePassword: function(inp) {
        var self = this;
        inp = typeof(inp) == 'string' ? $$(inp) : inp;

        if (inp) {
            inp.each(function(i) {
                var placeholder = i.readAttribute('placeholder');
                if (placeholder) {
                    var iText = new Element('input', { type: 'text' });
                    iText.writeAttribute('class', i.readAttribute('class'));
                    iText.value = placeholder;
                    i.insert({ after: iText });
                    i.hide();

                    iText.observe('focus', function(e) {
                        iText.hide();
                        i.show().focus();
                        if (i.value == placeholder) i.clear();
                    });
                    i.observe('blur', function(e) {
                        if (i.value.blank() || i.value == placeholder) {
                            iText.show();
                            i.hide();
                            i.value = placeholder;
                        }
                    })
                }
            });
        }
    }
});

function frontArticleList(){
    var container = $('front-article-list');
    if(container){
        var loader = new Element('div').addClassName('loader'),
            href = '/ajaxcall/?ajax_template=article/inc_front_article',
            article_container = $('front-article-scroller'),
            hideLoader = function(){
                loader.hide();
            },
            articleScroller = function(){
                var articles = article_container.select('li'),
                    disable = 'disable',
                    width = 578,
                    left = 0,
                    container_width = width * (articles.length / 2),
                    mostleft = (container_width - width) * -1,
                    nav = [
                        { move: 'right', elem: $('left-nav')},
                        { move: 'left', elem: $('right-nav')}
                    ],
                    setNav = function(){
                        left = parseInt(article_container.style.left) || 0;
                        if(left >= 0){
                            $('left-nav').addClassName(disable);
                        }else{
                            $('left-nav').removeClassName(disable);
                        }
                        if (left <= mostleft) {
                            $('right-nav').addClassName(disable);
                        }else{
                            $('right-nav').removeClassName(disable);
                        }
                    };
                    
                if(articles && articles.length > 2){
                    article_container.setStyle({ width: container_width + 'px' });
                    nav.each(function(a){
                        a.elem.observe('click', function(e){ 
                            Event.stop(e);
                            left = parseInt(article_container.style.left) || 0;
                            
                            if(left % width == 0 ){
                                var x = a.move == 'right' && left < 0 ? width : (a.move == 'left' && left > mostleft ? width * -1 : 0);
                                new Effect.Move(article_container, { x: x, afterFinish: setNav });
                            }
                        });
                    });
                }else{
                    [$('left-nav'),$('right-nav')].each(function(a){
                        a.addClassName(disable);
                        a.observe('click', function(e){ 
                            Event.stop(e);
                        });
                    });
                }
                hideLoader();
            };

        new Ajax.Request(href, {
            method: 'post',
            parameters: { debug: 'off' },
            onLoading: function () {
                container.insert({bottom : loader});
            },
            onFailure: function () {
                hideLoader();
            },
            onSuccess: function (res) {
                if(res.responseText){
                    var ul = article_container.down('ul');
                    if(!ul){
                        ul = new Element('ul').addClassName('container');
                        article_container.insert({top : ul});
                    }
                    ul.insert({bottom : res.responseText});
                }
                articleScroller();
            }
        }); //ajax
    }
}

function contactUsForm(){
    var form = $('contact-us-form');
    if (form) {
        var required = form.select('input,textarea').collect(function(o){
                return (o.readAttribute('required') == 'required' || o.required == true) ? o : null;
            }),
            cls = 'required-field',
            email = $(form['from']),
            emailPttr = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;

        form.observe('submit', function(e) {

            var chk = true;
            required.each(function(n) {
                if(n){
                    if(n.value == '' || n.value == n.readAttribute('placeholder')){
                      n.addClassName(cls);
                      chk = false;
                    }else{
                      n.removeClassName(cls);
                    }
                }
            });
            
            if(!emailPttr.test(email.value)){
                email.addClassName(cls);
                chk = false;
            }else{
                email.removeClassName(cls);
            }
            
            if (!chk) {
                Event.stop(e);
            }
            
        });
    }
}

function miniTabControl(){
    var minitab = $$('#sub-content-tab-list > li > a'),
        minicontent = $$('.sub-content-box[id$="-tab-content"]');
    if(!minitab || !minicontent) 
        return;
        
    minitab.each(function(tab){
        var id = tab.readAttribute('id');
        if(!id) 
            return;
        
        tab.observe('click', function(e){
            e.stop();
            
            minicontent.invoke('addClassName', 'hidden');
            minitab.invoke('removeClassName', 'active');
            
            tab.addClassName('active');
            $(id+'-content').removeClassName('hidden');
        });
    });
}