Sample Js file

Jquery_example.js

(function ($) {
    
    app = {}
    
    app.globalSetting = {
        url : {
            'local': Drupal.settings.ajaxify.baseUrl
        },
        noAjaxUrl :[
        'blogs',
        'blog',
        'user'
        ]
    }
    
    var DEFAULT_LAN = 'ar';
    
    /* debug utility method */
    app.debug = function(param, die){
        console.log("Starting debugging!");
        console.log(param);
        if(die == true){
            throw new Error("Die");
        }
    }
    
    /* this method returns current user selected language base on path" */
    app.getCurrentLanguage = function(){
        var urlParts = window.location.href.split('/');
        if (urlParts.length > 4){
            if (urlParts[3].search('ar') > -1){
                return 'ar';
            }
            if (urlParts[3].search('en') > -1){
                return 'en';
            }
            return DEFAULT_LAN;
        }
        else if(urlParts[3] == "" || urlParts[3] == '#'){
            return DEFAULT_LAN;
        }
        return urlParts[3];
        
    }
    
    /* this method binds events after successful ajax call */
    app.bindAfterAjax = function(path){
        app.callSubMenu();
        if (path.search("/portfolio") > -1 || window.location.href.search('news') > -1 ){
            app.popUpDetails();
        }
        else if (path.search('career') > -1 || path.search('contact') > -1){
            app.serviceBlockEvents();  
        }
        else if (path.search('services') > -1){
            app.servicePageNavigation();
            var request_path = path.replace('/ar','').replace('/en', '');
            window.location.href = '#'+request_path;
        }
    }
    
    /* this method handles language switching logics and events */
    app.handleLangSwitch = function(){
        $('.language-switcher-locale-url li a').live('click', function(e){
            e.preventDefault();
            var urlParts =  $(this).attr('href').split('/');
            if ((urlParts[1] == 'ar' && urlParts.length == 2) || 
                (urlParts[1] == 'en' && urlParts.length == 2)){
                window.location.href = '/'+urlParts[1];
            }
            else{
                var origin = window.location.protocol+'//'+window.location.host;
                if (app.getCurrentLanguage() == 'en'){
                    window.location.href = origin+$(this).attr('href').replace('ar', 'ar#');
                }
                else{
                    window.location.href = origin+$(this).attr('href').replace('en', 'en#');
                }
            }
        });
    }
    
    /*common ajax call method */
    app.ajaxCall = function(path){
        
        var path = '/'+app.getCurrentLanguage()+path;
        
        $.ajax({
            url: path,
            type: "GET",
            dataType: "html",
            success:function(data) {
                $('.home_page').css('display','block');
                $('.container').html(data);
                var classes = ($(data).filter('div#classes_finder').attr('class'));
                $('body').removeClass().addClass(classes);
                
                $('.section-portfolio .content').css('display','none');
                $('.section-portfolio .content').slideDown(2000).delay(800);
                $('.section-portfolio .content').css('display','block');
               
                app.bindAfterAjax(path);
                
            },
            error: function(jqXHR, exception){
                console.log(jqXHR.status);
            }
            
        });
    }
    
    /*bind events here */
    app.bind = function(){
        app.urlRouting();
        app.disableMenuRightClick();
        app.callSubMenu();
        app.backButtonHandler();
        app.handleLangSwitch();
    }

    /* write event driven anonymous method here */
    app.menuEvents = function(){
        $('.menu_bar ul.menu a').live('click', function(e){
            e.preventDefault();
            isAjax = true;
            path_slug = $(this).attr('href').replace('/','');
            /* checking and changing browser url if needed */
            if($.inArray(path_slug, app.globalSetting.noAjaxUrl) > -1){
                isAjax = false;
            }
            if(isAjax){
                if(app.getCurrentLanguage() == 'en'){
                    window.location.hash = $(this).attr('href').replace('/en','');
                }
                else{
//                    app.debug("Inside Menu"+app.getCurrentLanguage(), true);
                    window.location.hash = $(this).attr('href').replace('/ar','');
                }
            }
            else{
                window.location.href = path_slug;
            }
        });
        if (window.location.href.search('career') > -1 || window.location.href.search('contact') > -1){
            app.serviceBlockEvents();  
        }
    }

    app.slideHomePage = function(){
        $('.container .header').css('display','none');
        $('.container .feature_row').css('display','none');
        $('.container .region-content-bottom').css('display','none');
        $('.container .region-footer').css('display','none');
        
        
        $('.container .header').slideDown(2000).delay(800);
        $('.container .header').css('display','block');
        
        $('.container .feature_row').slideDown(2000).delay(800);
        $('.container .feature_row').css('display','block');
        
        
        $('.container .region-content-bottom').slideDown(2000).delay(800);
        $('.container .region-content-bottom').css('display','block');
        
        $('.container .region-footer').slideDown(2000).delay(800);
        $('.container .region-footer').css('display','block');
        
        app.serviceBlockEvents();
    }

    app.urlRouting = function(){
        home = false;
        $.each(app.globalSetting.url, function(env, url){
            var wlhref = window.location.href;
            if (url == wlhref || url+'en' == wlhref || url+'ar' == wlhref){
                home = true;  
            }   
        });
    
        if (home == true){
            $('.home_page').css('display','block');
            app.slideHomePage();
        }
        else if(window.location.href.search('portfolio') >-1 || window.location.href.search('news') > -1){  
//            app.debug("Adding Potfolio Animation......");
            app.popUpDetails();
        }
        
        app.menuEvents();
    }
    /* check it */
    app.disableMenuRightClick = function(){
        $('.menu_bar ul.menu a').live("contextmenu", function(e) {
            e.preventDefault();
        });
    }

    app.popUpDetails = function(){
        app.popUpDetails.showPopUp = function(selector){
            $(selector).click(function(e){
                e.preventDefault();
                portfolio_detail_obj = $(this).next().find('.portfolio_detail');
                image_html = "<div class='image'>"+'<img src='+$(this).find('img').attr('src')+'></img></div>';
            
                var PortfolioLabels = {
                    'en' : {
                        'client_name' : 'Client Name:',
                        'project' : 'Project:',
                        'what_we_do' : 'What we did:'
                    },
                    'ar' :{
                        'client_name' : ':اسم العميل',
                        'project' : ':المشروع',
                        'what_we_do' : ':إنجازاتنا'
                    } 
                }
                var currentLanguage = app.getCurrentLanguage();
                if (window.location.hash.search('news') > -1){
                    var title = "<div class='news_title'>"+portfolio_detail_obj.find('.news_title h1').text()+"</div>";
                    var created_at = "<div class='news_created'>"+portfolio_detail_obj.find('.created_at').text()+"</div>";
                    var description = "<div class='news_desc'>"+portfolio_detail_obj.find('.descriptions').text()+"</div>";
                    $.colorbox({
                        html:image_html+title+created_at+description
                    }); 
                }
                else{
                    var client = "<div class='lightwrap'><div class='client_name'>"+'<label>'+PortfolioLabels[currentLanguage]['client_name']+'</label>'+'<span>'+portfolio_detail_obj.find('.client_name').text()+'</span>'+'</div>';
                    var project = "<div class='project_name'>"+'<label>'+PortfolioLabels[currentLanguage]['project']+'</label>'+'<span>'+portfolio_detail_obj.find('.field_project').text()+'</span>'+'</div>';
                    var wht_we_do = "<div class='what_we_do'>"+'<label>'+PortfolioLabels[currentLanguage]['what_we_do']+'</label>'+'<span>'+portfolio_detail_obj.find('.portfolio_detail').find('.what_we_do').text()+'</span>'+'</div></div>';
//                    app.debug(currentLanguage);
                    $.colorbox({
                        html:image_html+client+project+wht_we_do
                    }); 
                }
            });
        }
       
       app.popUpDetails.showPopUp('.colorbox-inline');
       app.popUpDetails.showPopUp('.news_item');
        
    }

    app.backButtonHandler = function(){
        $.address.change(function(event){
            if (event.value == "/"){
                return  false;
            }
            else{
                var path = event.value;
                app.ajaxCall(path);
            }
        });
    }
    
    app.callSubMenu = function(){
        $('li.expanded').hover(
            function() {
                $(this).addClass('hover');
            },   
            function() {
                if (! $(this).children('ul').hasClass('hover')) {
                    $(this).removeClass('hover');
                }
            });
    
        $('li.expanded ul li').hover(
            function() {
                $(this).parent("ul").addClass('hover');
            },    
            function() {
                $(this).parent("ul").removeClass('hover');
            });
    }
    
    /* this method is used for service page internal navigation */
    
    app.servicePageNavigation = function(){
        $('.sub-menu .field-content a').bind('click', function(e){
            e.preventDefault();
            var request_path = $(this).attr('href').replace('/en', '').replace('/ar','');
            app.ajaxCall(request_path);
        });
    }
    
    /* this method navigate to the details page of home serviec details */
   
    app.serviceBlockEvents = function(){
      
        sliderNavigate = function(selector){
            $(selector).live('click', function(e){
                e.preventDefault();
                if (app.getCurrentLanguage() == 'en'){
                    window.location.href = $(this).attr('href').replace('en', 'en#');
                }
                else{
                    window.location.href = $(this).attr('href').replace('ar', 'ar#');
                }
            });
        }
        
        alterNavigate = function(selector){
            $(selector).live('click', function(e){
                e.preventDefault();
                if (app.getCurrentLanguage() == 'en'){
                    window.location.href = $(this).attr('href').replace('en', 'en#');
                }
                else{
                    window.location.href = $(this).attr('href').replace('ar', 'ar#');
                }
            });
        }
        
        sliderNavigate('.slide_img a');
        sliderNavigate('.slide_desc a');
        alterNavigate('a.know_more');
        alterNavigate('.view-home-page-services h2 a');
    }

    $(document).ready(function(){
        app.bind();  
    });

    
})(jQuery);