/*================================================================================*/
/* AJAX */
/*================================================================================*/
var ajaxData = {};   
/*--------------------------------------------------------------------------------*/
function apiCall(sID, sURL, aData, fCallback, bLoading, bMulti){ 
    if( bLoading ){ 
        if( $('.js-loading').length<=0 ){
            $('body').append('<div class="csss2_loading js-loading"></div>');
        }
        $('.js-loading').show();  
    }
    if( sID in ajaxData ){
        if( ajaxData[sID]['status'] == 2 ){ 
            if( !bMulti ){ 
                console.log('Ajax in progress: '+sID); return false; /*ajax in progress*/
            }
        }
    }
    ajaxData[sID] = { 'status':2, 'url':sURL,'callback':fCallback , 'query':aData, 'data':false, 'loading':bLoading };

    sURL = sURL;
    var sType = 'get';//(''+sURL).indexOf('.json')>=0?'get':'post';
    if( sType == 'get' ){ sURL += '?t='+(new Date()).getTime(); }
    console.log('--------------------------------------------------------------------------------');
    console.log('#'+sID+' Ajax:'+sURL);
    console.log('url: '+sURL+'?'+(new URLSearchParams(aData).toString()));
    console.log(aData);
    $.ajax({'id':sID,'url':sURL,'type':sType,'data':aData,'dataType':'json','success':apiCallSuccess,'error':apiCallFailure});
    console.log('--------------------------------------------------------------------------------');
    return true;
}
/*--------------------------------------------------------------------------------*/
function apiCallSuccess(aData){
    if( (''+window.location).indexOf('127.0.0.1')>0 ){
        setTimeout(function(){
            $('.js-loading').hide();
        },1000)
    }else{
        $('.js-loading').hide();
    }
    
    var sID = this.id;
    if( sID in ajaxData ){
        console.log('================================================================================');
        console.log('#'+sID+' Ajax Success:');
        console.log(aData);
        console.log('================================================================================');
        ajaxData[sID]['status'] = 1;
        ajaxData[sID]['data'] = aData;
        try{             
            if( isEmpty(aData) ){ aData = {}; }
            ajaxData[sID]['callback'](true,sID,aData); 
        }catch(e){
            console.log('==== API Callback Exception (S) ====');
        }
    }    
}
/*--------------------------------------------------------------------------------*/
function apiCallFailure(aData){
    $('.js-loading').hide();
    var sID = this.id;
    if( sID in ajaxData ){
        console.log('#'+sID+' Ajax Failure');                
        ajaxData[sID]['status'] = 0;                
        try{ 
            if( isEmpty(aData) ){ aData = {}; }
            ajaxData[sID]['callback'](false,sID,aData); 
        }catch(e){
            console.log('==== API Callback Exception (F) ====');
        }
    }    
}
/*--------------------------------------------------------------------------------*/
function isEmpty(sVar){
    return (sVar == '' || sVar == 'null' || sVar == null || sVar == false || sVar == undefined);
}
function isObj(oObj){
    return typeof oObj == 'object' || typeof oObj == 'array'
}
function getValue(aArray, sKey, sDft){    
    if( isEmpty(aArray) ){ 
        return sDft!=undefined ? sDft : false; 
    }
    if( (''+sKey).indexOf('.') >= 0 ){
        var aKey = (''+sKey).split('.');
        var aTemp = aArray;
        for( var i=0; i<aKey.length; i++ ){ aTemp = getValue(aTemp,aKey[i],sDft); }
        return aTemp;

    }else if( isObj(aArray) ){
        if( sKey in aArray ){
            return aArray[sKey];
        }
    }
    return sDft!=undefined ? sDft : false;
}
/*================================================================================*/
/*================================================================================*/
var csssListingData = {};
/*--------------------------------------------------------------------------------*/
function csssLoadListing(){
    var iCnt = 0;
    $('.js-listing').each(function(){
        var sURL = $(this).attr('data-src');
        var sID  = 'csss_listing_'+iCnt;
        $(this).find('.template').hide();

        if( !$(this).hasClass('inited') ){
            $(this).attr('id',sID);
            $(this).addClass('inited');
            $(this).find('.js-listing-filter').on('change',cssListingFilter);
            $(this).find('.js-listing-prev').on('click',cssListingPrev);
            $(this).find('.js-listing-next').on('click',cssListingNext);
            $(this).find('.js-listing-page').on('keyup',cssListingInput);
        }
        
        $(this).find('.js-listing-filter,.js-listing-page').each(function(){
            var sNam = $(this).attr('name');
            var sVal = $(this).val();
            sURL = (''+sURL).replace('{'+sNam+'}',sVal);
        });


        apiCall(sID,sURL,{},csssLoadListingComplete,true);
        iCnt++;
    });       
}
/*--------------------------------------------------------------------------------*/
function csssLoadListingComplete(bSuc, sID, aData){
    csssListingData[sID] = bSuc ? aData : [];
    csssShowListingData(sID);
}
/*--------------------------------------------------------------------------------*/
function csssSideBannerFix() {
    $(".move-to-txt-btm").each(function(){
        var holder = $(this).parent();
        if(!holder.length || !holder.find(".csss2_side_banner_text")) return;
        var txt = holder.find(".csss2_side_banner_text")
        $(txt).append($(this))
    })
}
/*--------------------------------------------------------------------------------*/
function csssShowListingData(sID, bClick){
    if( sID in csssListingData ){
        var oRoot = $('#'+sID).get(0);  
        var aRaw  = csssListingData[sID];
        var aData = getValue(aRaw,'detail',[]);
        var iPag  = getValue(aRaw,'totalPage',1);
                
        $(oRoot).find('.js-listing-empty').hide();
        $(oRoot).find('.js-listing-result').show();
        $(oRoot).find('.js-listing-paging').show();
        if( aData.length <= 0 ){ 
            $(oRoot).find('.js-listing-empty').show();
            $(oRoot).find('.js-listing-result').hide();
            $(oRoot).find('.js-listing-paging').hide();
            return; 
        }
        $(oRoot).find('.clone').remove();
        $(oRoot).find('.js-listing-total').html(iPag);
        $(oRoot).attr('data-total',iPag);
        var oTmp  = $(oRoot).find('.template').get(0);
        for( var i=0; i<aData.length; i++ ){
            var aDat = aData[i];
            var oCln = $(oTmp).clone();
            aDat['#pop_id']    = 'popup_id_'+i;
            aDat['img']        = getValue(aDat,'img',getValue(aDat,'thumb',''));
            aDat['name']       = getValue(aDat,'name',getValue(aDat,'title',''));
            aDat['desc']       = getValue(aDat,'desc',getValue(aDat,'source',''));
            aDat['popup_img']  = getValue(aDat,'popup_img',getValue(aDat,'img',getValue(aDat,'image','')));
            aDat['popup_desc'] = getValue(aDat,'popup_desc',getValue(aDat,'content',getValue(aDat,'Content','')));

            /* aDat['popup_img']  = getValue(aDat,'popup_img',getValue(aDat,'image','')); */
            /* aDat['popup_desc'] = getValue(aDat,'popup_desc',getValue(aDat,'content','')); */
            var sURL = getValue(aDat,'url','');

            for( var sK in aDat ){
                var sVal = aDat[sK];
                $(oCln).find('[data-name="'+sK+'"]').each(function(){
                    var sAttr = $(this).attr('data-attr');
                    switch( sAttr ){
                        case 'src': 
                            $(this).attr(sAttr,sVal); 
                            var sAlt = aDat[sK+'_alt'];
                            if( sAlt ){ $(this).attr('alt',sAlt); }
                            break;
                        
                        case null     :
                        case false    :
                        case undefined:
                        case 'html'   : 
                        case ''       : $(this).html(sVal); break;
                        default       : $(this).attr(sAttr,sVal); break; 
                    }
                });
            }
            if( isEmpty(sURL) ){
                $(oCln).find('[data-name="url"]').hide();
            }

            var sDtl = getValue(aDat,'detailUrl','');
            if( sDtl != '' ){
                if(sDtl.indexOf('/tc/') < 0 && sDtl.indexOf('/sc/') < 0 && sDtl.indexOf("/en/") < 0) {
                    sDtl = "/" +lang + sDtl;
                }
                $(oCln).find('a').attr('href',sDtl);
            }/* else{
                $(oCln).find('a').click(csssOnAnchor);
            } */
            $(oCln).find('a').click(csssOnAnchor);

            csssResetEffect(oCln);
            
            $(oCln).addClass('clone').show();
            $(oCln).insertBefore(oTmp);  
        }   
        var iCur = parseInt($('.js-listing-page').val());
        $(oRoot).find('.js-listing-next').removeClass('disabled')
        $(oRoot).find('.js-listing-prev').removeClass('disabled')
        if( iPag <= 1 ){
            $(oRoot).find('.js-listing-next').addClass('disabled')
            $(oRoot).find('.js-listing-prev').addClass('disabled')
        }
        if( iCur <= 1 ){
            $(oRoot).find('.js-listing-prev').addClass('disabled')
        }
        if( iCur >= iPag  ){
            $(oRoot).find('.js-listing-next').addClass('disabled')
        }
        if( bClick ) { csssScrollTo('#'+sID); }
        csssOnScroll();
    }     
}
/*--------------------------------------------------------------------------------*/
function cssListingFilter(e){
    var oRoot = $(e.target).closest('.js-listing');    
    $(oRoot).find('.js-listing-page').val( 1 );
    csssLoadListing();   
}
/*--------------------------------------------------------------------------------*/
function cssListingPrev(e, bNxt){
    if( e ){ e.preventDefault(); } 
    var oRoot = $(e.target).closest('.js-listing');    
    cssListingGoToPage(oRoot, bNxt?1:-1);
}
/*--------------------------------------------------------------------------------*/
function cssListingNext(e){
    cssListingPrev(e,true);
}
/*--------------------------------------------------------------------------------*/
function cssListingInput(e){
    if( e.which == 13 ){
        var oRoot = $(e.target).closest('.js-listing');
        cssListingGoToPage(oRoot,0);
    }
}
function cssListingGoToPage(oRoot, iAdd){
    var iTtl  = parseInt($(oRoot).attr('data-total'));
    var iPge  = parseInt($(oRoot).find('.js-listing-page').val() );
    var iNew  = iPge + iAdd;
    if( isNaN(iTtl) ){ iTtl = 1; }
    if( isNaN(iPge) ){ iPge = 1; }
    if( isNaN(iNew) ){ iNew = 1; }
    if( iNew > iTtl ){ iNew = iTtl; }
    if( iNew < 1    ){ iNew = 1; }

    $(oRoot).find('.js-listing-page').val( iNew );
    csssLoadListing();   
}
/*================================================================================*/
/*================================================================================*/
var lang = $("html").attr("lang")
function sendGaEvent(name, action, link, pageAction) {
    var params = {'CSS_Action': action, 'CSS_Page_Action': pageAction, 'CSS_Language': lang,};
    var notCallback = ["mailto:", "tel:", "javascript:", "#"],
        needRedirect = true;
    for (var i = 0; i < notCallback.length; i++) {
        if (link.indexOf(notCallback[i]) !== 0) {
            needRedirect = false
            break
        }
    }
    if (needRedirect) {
        params['event_callback'] = function() {
            window.location.href = link;
        };
        params['event_timeout'] = 2000;
    }
    gtag('event',name,params);
}
function csssMobileMenu(e){    
    if( e ){ e.preventDefault(); } 
    var oLink = $(e.target).closest('a');
    $(oLink).toggleClass('open');

    if( $(oLink).hasClass('open') ){
        $('.js-mobile_menu').addClass('open');
        if( !$('.js-mobile_menu').hasClass('inited') ){
            $('.js-mobile_menu').addClass('inited');
            $('.js-mobile_menu .csss_main').html( $('.csss_head_menu').html() );
            $('.js-mobile_menu .csss_main').find('.lang').remove();
            $('.js-mobile_menu .csss_main').find('.mobile').remove();
            $('.js-mobile_menu').find('li').each(function(){
                if( $(this).find('ul').length > 0 ){
                    $(this).append('<a href="#mobile_toggle" class="toggle" aria-label="Toggle" title="Toggle"></a>');
                }
            });
            $('.js-mobile_menu').find('.toggle').click(csssOnAnchor);
        }
        $('body').css({'overflow':'hidden'});
    }else{
        $('.js-mobile_menu').removeClass('open');
        $('body').css({'overflow':'auto'});
    }
    csssOnScroll();
}
/*--------------------------------------------------------------------------------*/
function csssMobileMenuToggle(e){    
    if( e ){ e.preventDefault(); } 

    var oLink = $(e.target).closest('a');
    $(oLink).toggleClass('open');
    if( $(oLink).hasClass('open') ){
        $(oLink).parent().find('>ul').slideDown();
    }else{
        $(oLink).parent().find('>ul').slideUp();
    }
}
/*================================================================================*/
/*================================================================================*/
var quizData = [];
var quizSubmitted = false;
/*--------------------------------------------------------------------------------*/
function csssQuizInit(){
    $('.js-quiz').hide();
    $('.js-quiz .js-quiz_result').hide();
    $('.js-quiz .js-quiz_error').hide();
    $('.js-quiz .js-quiz_error_api').hide();
    $('.js-quiz .template').hide();
    $('.js-quiz .clone').remove();
    if( quizData ){
        var oTmp = $('.js-quiz').find('.template').get(0);
        for( var i=0; i<quizData.length; i++ ){
            var oCln = $(oTmp).clone();
            var aQ = quizData[i];
            for( var sK in aQ ){
                var sV = aQ[sK];
                if( typeof sV == 'object' || typeof sV == 'array' ){
                    var oTm2 = $(oCln).find('[data-name="'+sK+'"]').get(0);    
                    for( var sK2 in sV ){
                        var oCn2 = $(oTm2).clone();
                        $(oCn2).html(sV[sK2]);
                        $(oCn2).attr('data-index',sK2);
                        $(oCn2).insertBefore(oTm2);
                    }
                    $(oTm2).remove();
                }else{
                    $(oCln).find('[data-name="'+sK+'"]').html(sV);
                }
            }
            $(oCln).find('.js-quiz_ans').click(csssQuizAns);
            $(oCln).find('[data-name="no"]').html(i+1);
            $(oCln).addClass('clone').show();
            $(oCln).insertBefore(oTmp);

        }
        $('.js-quiz').show();
        $('.js-quiz .js-quiz_submit:not(.inited)').addClass('inited').click(csssQuizConfirm);
    }
}
/*--------------------------------------------------------------------------------*/
function csssQuizAns(e){
    if( e ){ e.preventDefault(); } 
    if( quizSubmitted ){ return; }

    var oRoot = $(e.target).closest('.clone');
    var oThis = $(e.target).closest('.js-quiz_ans');
    $(oRoot).find('.selected').removeClass('selected');
    $(oThis).addClass('selected');
}
/*--------------------------------------------------------------------------------*/
function csssQuizConfirm(e){
    if( e ){ e.preventDefault(); } 

    var aAns  = {};
    var oRoot = $(e.target).closest('.js-quiz').get(0);
    var sURL  = $(oRoot).attr('data-api');
    var sQID  = $(oRoot).attr('data-id');
    $(oRoot).find('.js-quiz_error').hide();
    $(oRoot).find('.js-quiz_error_api').hide();
    
    if( quizData ){
        if( $(oRoot).find('.js-quiz_ans.selected').length < quizData.length ){
            $(oRoot).find('.js-quiz_error').show();
           return;
        }        
        quizSubmitted = true;
        aAns['from'] = (''+window.location);
        aAns['id'  ] = sQID;
        
        var i = 0; var iC = 0; var iW = 0;
        $(oRoot).find('.clone').each(function(){            
            var aDat = quizData[i];
            var sCrt = aDat['ans'];
            var sDsc = aDat['desc'];
            var sSel = $(this).find('.js-quiz_ans.selected').attr('data-index');
            $(this).find('.js-quiz_ans[data-index="'+sCrt+'"]').addClass('correct');

            if( sCrt != '' ){
                if( sSel == sCrt ){                 
                    $(this).addClass('correct');
                    iC ++;                     
                }else{                 
                    $(this).addClass('wrong');
                    iW ++; 
                }
            }
            if( $(this).find('.csss_quiz_d').length<=0 ){
                $(this).append('<div class="csss_quiz_d">'+sDsc+'</div>');
            }
            aAns['q'+(i+1)] = sSel?sSel:'';
            i++;
        });
        
        $('.js-quiz .js-quiz_total').html(quizData.length);
        $('.js-quiz .js-quiz_correct').html(iC);
        $('.js-quiz .js-quiz_wrong').html(iW);

        if( iC <= 0 && iW <= 0 && i > 0 ){ $(oRoot).find('.clone').hide(); }    
        if( sURL ){
            apiCall('quiz',sURL,aAns,csssQuizConfirmSumbit,true);
        }else{
            csssQuizConfirmSumbit();
        }
    }
}
function csssQuizConfirmSumbit(bSuc, sID, aData){       
    if( getValue( aData,'status') == 1 ){
        $('.js-quiz .js-quiz_result').show();
        $('.js-quiz .js-quiz_submit').hide();
        csssScrollTo('.js-quiz .js-quiz_result');
    }else{
        $('.js-quiz .js-quiz_result').hide();
        $('.js-quiz .js-quiz_submit').show();
        $('.js-quiz .js-quiz_error_api').show();
        var sMsg = getValue(aData,'message','');
        if( sMsg != '' ){
            $('.js-quiz .js-quiz_error_api').html(sMsg);
        }
    }
}
/* =================================================================================*/
/* Chart */
/* =================================================================================*/
var csssChartTitleCfg = {        
    'display': true,
    'position':'top',
    'align':'center',
    'color':'#707070',
    'font':{'size': 20}
}
var csssChartLengendCfg = {
    'display' : true,
    'position':'bottom',
    'align':'start',
    'labels':{
        'boxWidth':45,
        'boxHeight':15
    }
}
var csssChartBarCfg = {    
    'categoryPercentage':0.5,
    'barPercentage':0.8,
    'borderWidth': 0
}
var csssChartBarAxisCfg =  {
    'grid':{
        'lineWidth':1,
        'tickWidth':1,
        'tickColor':'#999',
        'borderWidth':1,
        'borderColor':'#999'
    },
    'suggestedMin': 0,
    'suggestedMax': 100,
    'stacked':true
}
var csssChartLineCfg = {    
}
var linkCharLineAxisCfg =  {
    'grid':{
        'lineWidth':1,
        'lineColor':'#EEE',
        'tickWidth':1,
        'tickColor':'#999',
        'borderWidth':1,
        'borderColor':'#999'
    },    
    'suggestedMin': 0,
    'suggestedMax': 100,
    'stacked':true
}
var csssChartColor = [
    '#C6A95F','#B3B3B3','#4A6F6F','#3E3E3E',
    '#779094','#479A4C','#CAFA97','#9DBCBC',
    '#E4F0E4','#EFEFBF','#CC0800','#FF4B4B'
];
var csssChartID = 0;
/*--------------------------------------------------------------------------------*/
function csssChartInit(){
    
    $('.js-chart.inside:not(.inited)').each(function(){
        $(this).addClass('inited');
        var sCID  = 'chart_'+csssChartID;
        try{
            var aJson = JSON.parse( $(this).find('.data').html());
            var sType = aJson['type'];
            var aCfg  = {}; 
            var iW1 = 300; var iH1 = 150;
            var iW2 = 300; var iH2 = 300;
            switch( sType ){
                case 'mix':  
                    var aX   = aJson['x'];
                    var aY   = aJson['y'];

                    var aSet = []; var iCnt = 0;
                    for( var sK in aY ){
                        var sClr = csssChartColor[ iCnt % csssChartColor.length ];
                        var aTmp = {
                            'type' :aY[sK]['type'],
                            'label':aY[sK]['name'],
                            'data' :aY[sK]['data']
                        }                        
                        if( aTmp['type'] == 'bar' ){
                            
                            
                            aTmp['backgroundColor'] =  sClr;
                            for( var sK2 in csssChartBarCfg ){ aTmp[sK2] = csssChartBarCfg[sK2]; }
                        }
                        if( aTmp['type'] == 'line' ){
                            aTmp['backgroundColor'] =  sClr;
                            aTmp['borderColor'] =  sClr;
                            for( var sK2 in csssChartLineCfg ){ aTmp[sK2] = csssChartLineCfg[sK2]; }
                        }
                        aSet.push(aTmp);
                        
                        iCnt++;
                    }
                    aCfg['data' ] = {'labels': aX,'datasets': aSet};
                    
                    var aAXS = linkCharLineAxisCfg;                                   
                    aCfg['options'] = {
                        'scales': {'x':aAXS, 'y':aAXS},
                        'plugins': {'legend':csssChartLengendCfg}
                    }
                    if( aJson['title'] ){
                        var aTmp = {'text':aJson['title']};
                        for( var sK2 in csssChartTitleCfg ){ aTmp[sK2] = csssChartTitleCfg[sK2]; }
                        aCfg['options']['plugins']['title'] = aTmp;
                    }
                    break;

                case 'line': 
                case 'bar': 
                    var aX   = aJson['x'];
                    var aY   = aJson['y'];
                    var aSet = []; var iCnt = 0;
                    for( var sK in aY ){
                        var sClr = csssChartColor[ iCnt % csssChartColor.length ];
                        var aTmp = {
                            'label':aY[sK]['name'],
                            'data' :aY[sK]['data'],                            
                        }
                        if( sType == 'bar' ){
                            aTmp['backgroundColor'] = sClr;
                            for( var sK2 in csssChartBarCfg ){ aTmp[sK2] = csssChartBarCfg[sK2]; }
                        }
                        if( sType == 'line' ){
                            aTmp['backgroundColor'] = sClr;
                            aTmp['borderColor'] = sClr;
                            for( var sK2 in csssChartLineCfg ){ aTmp[sK2] = csssChartLineCfg[sK2]; }
                        }
                        if( aY[sK]['group'] ){
                            aTmp['stack'] = aY[sK]['group'];
                        }
                        
                        aSet.push(aTmp);
                        iCnt++;
                    }
                    var aAXS = sType=='line'? linkCharLineAxisCfg : csssChartBarAxisCfg
                    aCfg['type' ] = sType;
                    aCfg['data' ] = {'labels': aX,'datasets': aSet};
                    aCfg['options'] = {
                        'scales': {'x':aAXS, 'y':aAXS},
                        'plugins': {'legend':csssChartLengendCfg}
                    }
                    if( aJson['title'] ){
                        var aTmp = {'text':aJson['title']};
                        for( var sK2 in csssChartTitleCfg ){ aTmp[sK2] = csssChartTitleCfg[sK2]; }
                        aCfg['options']['plugins']['title'] = aTmp;
                    }
                    break;
                
                case 'pie':
                case 'donut':
                    var aX   = aJson['x'];
                    var aY   = aJson['y'];
                    var aSet = []; var aClr = []; var iCnt = 0;
                    var sLgn = '';
                    for( var sK in aY ){
                        var sClr = csssChartColor[ iCnt % csssChartColor.length ];
                        aSet.push(aY[sK]);
                        aClr.push(sClr);
                        sLgn += '<div class="legend_item"><span class="box" style="background:'+sClr+'"></span>'+aX[sK]+'</div>';
                        iCnt ++;
                    }                        
                    aCfg['type' ] = sType=='donut'?'doughnut':sType;                  
                    aCfg['data' ] = {'labels': aX,'datasets': [{'data':aSet,'backgroundColor':aClr}]};
                    aCfg['options'] = {
                        'cutout':'70%',
                        'plugins': {'legend':{'display':false}}
                    }                    
                    iW1 = 300; iH1 = 300;

                    sLgn = '<div class="legend_items">'+sLgn+'</div>';
                    if( aJson['desc'] ){
                        sLgn = '<p>'+aJson['desc']+'</p>'+sLgn;
                    }
                    if( aJson['title'] ){
                        sLgn = '<h3 class="h5">'+aJson['title']+'</h3>'+sLgn;
                    }
                    $(this).addClass('donut');
                    $(this).prepend('<div class="legend">'+sLgn+'</div>');
                    break;                

                case 'donut_lite':
                    var aX   = aJson['x'];
                    var aY   = aJson['y'];
                    var aSet = []; var aClr = []; var iCnt = 0;
                    var sLgn = '';
                    for( var sK in aY ){
                        var sClr = csssChartColor[ iCnt % csssChartColor.length ];
                        aSet.push(aY[sK]);
                        aClr.push(sClr);
                        iCnt ++;
                    }      
                    aCfg['type' ] = 'doughnut';                       
                    aCfg['data' ] = {'labels': aX,'datasets': [{'data':aSet,'backgroundColor':aClr}]};
                    aCfg['options'] = {
                        'cutout':'70%',
                        'plugins': {'legend':{'display':false}}
                    }  
                    iW1 = 300; iH1 = 300; 
                    if( aJson['desc'] ){
                        sLgn = '<p>'+aJson['desc']+'</p>'+sLgn;
                    }
                    if( aJson['title'] ){
                        sLgn = '<h3 class="h5">'+aJson['title']+'</h3>'+sLgn;
                    }
                    $(this).addClass('donut_lite');
                    $(this).prepend('<div class="legend"><div>'+sLgn+'</div></div>');
                    break;
            }
            $(this).append('<div class="desktop"><canvas id="'+sCID+'_a"  width="'+iW1+'" height="'+iH1+'"></canvas></div>');
            $(this).append('<div class="mobile"><canvas id="'+sCID+'_b" width="'+iW2+'" height="'+iH2+'"></canvas></div>');
            var oCNV = document.getElementById(sCID+'_a');
            var oCHT = new Chart(oCNV, aCfg);
            var oCNV = document.getElementById(sCID+'_b');
            var oCHT = new Chart(oCNV, aCfg);
        }catch(e){

        }
        csssChartID++;
    });
}
/*================================================================================*/
/*================================================================================*/
function csssToggle(e){
    if( e ){ e.preventDefault(); } 

    var aCSS = ['li','a'];
    for( var i=0; i<aCSS.length; i++ ){
        var oLink = $(e.target).closest(aCSS[i]);
        if( oLink.length > 0 ){
            $(oLink).toggleClass('open');
            $(oLink).addClass('toggled');    
            return;
        }
    }
}
/*--------------------------------------------------------------------------------*/
function csssAccordionToggle(e){
    if( e ){ e.preventDefault(); } 
    var oRoot = $(e.target).closest('.js-accordion');
    var oItem = $(e.target).closest('.js-accordion_item');
    $(oItem).removeClass('open');
    if( $(oItem).find('.js-accordion_body:visible').length <= 0 ){
        $(oItem).addClass('open');
    }
    $(oItem).find('.js-accordion_body').slideToggle();    
}
/*--------------------------------------------------------------------------------*/
function csssTabToggle(e){
    if( e ){ e.preventDefault(); } 
    var oRoot = $(e.target).closest('.js-tab');
    var oItem = $(e.target).closest('.js-tab_item');
    var sHref = $(oItem).attr('href');
    
    $(oRoot).find('.js-tab_item').each(function(){
        $(this).removeClass('active');
        var sThis = $(this).attr('href'); $(sThis).hide();
        csssResetEffect(sThis);
        if( $(this).attr('href') == sHref ){
            $(this).addClass('active');
        }
    }); 
    $(sHref).show();
    csssSwiperInit();
    csssOnScroll();
}
/*--------------------------------------------------------------------------------*/
function csssTabInit(){
    $('.js-tab').each(function(){
        $(this).find('.js-tab_item:first').click();
    });
}
/*================================================================================*/
/*================================================================================*/
function csssEffect(iST){
    var iOF = (iST/2);
    var iWW = $(window).width();
    var iWH = $(window).height();
    
    $('.effect_fade_up, .effect_fade_left, .effect_fade_right, .effect_num, .effect_sphiral, .js-chart').each(function(){
        var iY = $(this).offset().top;
        var iX = $(this).offset().left;
        var iH = $(this).height();        
        var iY1 = iST + iWH * 0.15;
        var iY2 = iST + iWH * 0.95;

        if( $(this).hasClass('effect_fade_up') ){
            var iS = 1000;
            var iD = Math.max(Math.min(Math.round(iX/iWW*iS),iS),0);
            $(this).css({'transition-delay':iD+'ms'});
        }
        if( $(this).hasClass('effect_fade_left')|| $(this).hasClass('effect_fade_right') ){
            var iS = 500;
            var iD = Math.max(Math.min(Math.round((iY-iST)/iWH*iS),iS),0);
            $(this).css({'transition-delay':iD+'ms'});
        }
        if( $(this).hasClass('effect_num') ){   
            iY1 = iST;
        } 
        if( $(this).hasClass('effect_sphiral') ){
            iY += iWH*0.4;
        }
        if( $(this).hasClass('js-chart') ){
            iY += iWH*0.4;
        }

        if( iY+iH > iY1 && iY < iY2 ){
            $(this).addClass('inside');   
            $(this).removeClass('finish');
            
            if( $(this).hasClass('js-chart') ){
                csssChartInit();
            }
            if( $(this).hasClass('effect_num') ){                
                clearTimeout(csssNumTimer);
                csssNumTimer = setTimeout( csssNumberEffect, 10 );
                //csssNumberEffect();
            }
            
        }else{
            $(this).removeClass('inside');
            $(this).removeClass('finish');
            if( iY+iH <= iY1 ){
                $(this).addClass('finish');
            }
            if( $(this).hasClass('effect_running_number') ){
                $(this).attr('data-current',0);    
            }
        }
    });
    
}
/*--------------------------------------------------------------------------------*/
var csssNumTimer = null;
function csssResetEffect(oObj){
    $(oObj).removeClass('finish');
    $(oObj).find('.finish').removeClass('finish');
}
function cssFormatNum(sValue, iDec, sComma){ 
    var iValue = parseFloat(sValue);
    var iPower = Math.pow(10,iDec);
    var iRound = Math.round(iValue*iPower)/iPower;
    var sInt   = (''+iRound).replace(/[.].*$/gi,'');
    var sDec   = (''+(iRound==Math.floor(iRound)?'':iRound)).replace( /^.*[.]/gi,'');
    var sDec   = '.'+(''+sDec).padEnd(iDec,'0');
    if( sComma != '' ){ 
        sInt = (''+sInt).replace('-','');
        var sTemp = ''; var j = 0;
        for( var i=sInt.length-1; i>=0; i-- ){
            sTemp = (''+sInt).substring(i,i+1)+(j>0&&j%3==0?sComma:'')+sTemp; 
            j++;
        }
        sInt = (iRound<0?'-':'')+sTemp;
    }
    return sInt+(iDec>0?sDec:'');
}
function csssNumberEffectInit(){
    $('.effect_num').each(function(){
        var iTrg = parseFloat($(this).attr('data-val'));
        var iCur = parseFloat($(this).attr('data-cur'));
        var iDec = parseInt($(this).attr('data-dec'));
        var sPfx = $(this).attr('data-pfx');
        var sSfx = $(this).attr('data-sfx');
        if( isNaN(iCur) ){ iCur = iTrg*.1; }
        if( isNaN(iDec) ){ iDec = 0; }
        if( !sPfx ){ sPfx = ''; }
        if( !sSfx ){ sSfx = ''; }
        var iCur = (iTrg*.9)/100;   
        var iRnd = cssFormatNum(iCur,iDec,',');

        $(this).attr('data-cur',iCur);
        $(this).html(sPfx+iRnd+sSfx);
    })
}
function csssNumberEffect(){
    $('.effect_num.inside:not(.complete)').each(function(){
        var iTrg = parseFloat($(this).attr('data-val'));
        var iCur = parseFloat($(this).attr('data-cur'));
        var iDec = parseInt($(this).attr('data-dec'));
        var sPfx = $(this).attr('data-pfx');
        var sSfx = $(this).attr('data-sfx');
        if( isNaN(iCur) ){ iCur = iTrg*.1; }
        if( isNaN(iDec) ){ iDec = 0; }
        if( !sPfx ){ sPfx = ''; }
        if( !sSfx ){ sSfx = ''; }
        var iInc = (iTrg*.9)/100;        
        var iCur = iCur+iInc;
        var iRnd = cssFormatNum(iCur,iDec,',');
        if( iCur >= iTrg ){ 
            $(this).addClass('complete')
            iCur = iTrg; 
            iRnd = cssFormatNum(iTrg,iDec,',');;
        }

        $(this).attr('data-cur',iCur);
        $(this).html(sPfx+iRnd+sSfx);
        //$(this).css({color:'#F00'})
    })
    if( $('.effect_num.inside:not(.complete)').length>0 ){
        clearTimeout(csssNumTimer);
        csssNumTimer = setTimeout( csssNumberEffect, 10 );
    }
}
/*================================================================================*/
/*================================================================================*/
function csssScrollTo(iY){
    if( !isNaN(parseInt(iY)) ){
        $('html,body').animate({'scrollTop':iY});
    }else{
        if( $(iY+':visible').length > 0 ){
            var iST = $(iY+':visible').offset().top - 66;
            $('html,body').animate({'scrollTop':iST});
        }
    }
}
/*--------------------------------------------------------------------------------*/
function csssPopUp(sMsg, bLBX){
    $('body').removeClass('slided');
    $('body').removeClass('popped');
    $('.csss_pop').removeClass('type2');
    $('.csss_pop').removeClass('type3');

    if( bLBX ){ $('.csss_pop').addClass('type2'); }
    if( $('.js-listing').length>0 ){ $('.csss_pop').addClass('type3'); }

    $('.js-pop_content').html(sMsg);
    $('.js-pop_content').find('a').click(csssOnAnchor);
    $('body').addClass('popped');
    csssSwiperInit();

    setTimeout( function(){        
        $('body').addClass('slided');
    },100);

    try{
        $('.js-pop_content').find('video:first').get(0).play();
    }catch(e){}
}
/*--------------------------------------------------------------------------------*/
function csssPopUpClick(e){
    if( e ){ e.preventDefault(); } 
    var oRoot = $(e.target).closest('a');
    var sTrg = $(oRoot).attr('data-target');    
    if( sTrg ){
        var sMsg = $('#'+sTrg).html();
        var bLBX = $('#'+sTrg).hasClass('lightbox');
        csssPopUp(sMsg,bLBX);
    }
}
/*--------------------------------------------------------------------------------*/
function csssPopDown(e){
    if( e ){ e.preventDefault(); } 
    $('body').removeClass('slided');
    setTimeout( function(){        
        $('body').removeClass('popped');
    },300)
    $('.js-pop_content video').each(function(){
        this.pause();
    })
}
/*--------------------------------------------------------------------------------*/
function csssNewPost(e){
    if( e ){ e.preventDefault(); } 
    $('.csss_newpost').addClass('csss_newpost--show');
}
/*--------------------------------------------------------------------------------*/
function csssNewPostClose(e){
    if( e ){ e.preventDefault(); } 
    $('.csss_newpost').removeClass('csss_newpost--show');
}
/*--------------------------------------------------------------------------------*/
function csssFileChange(oObj){
    var oRoot = $(oObj).closest('.csss_upload');
    var sVal  = $(oRoot).find('input').val();
    var oFil  = $(oRoot).find('input').get(0);
    if( sVal != '' ){
        $(oRoot).addClass('selected');
        $(oRoot).find('.csss_upload_name').html((""+sVal).replace(/.*[\\\/]/gi,''));
        $(oRoot).find('.csss_upload_img').attr('src',URL.createObjectURL(oFil.files[0]));
    }else{
        $(oRoot).removeClass('selected');
    }    
}
/*--------------------------------------------------------------------------------*/
function csssFileClear(e){
    if( e ){ e.preventDefault(); } 
    var oRoot = $(e.target).closest('.csss_upload');
    $(oRoot).find('input').val('');
    csssFileChange($(oRoot).find('input').get(0));
}
/*================================================================================*/
/*================================================================================*/
var autoSwiper = null;
var autoSwiperTimer = null;
var autoSwiperPlay = false;
var autoSwiperDelay = 5000;

function csssSwiperInit(){
    $('.swiper-container:visible:not(.inited)').each(function(){        
        $(this).addClass('inited'); 
        $(this).find('.csss_swiper_img').each(function(){
            var oCln = $(this).find('img:first').clone();
            $(oCln).css({'filter':'blur(10px) brightness(0.7)','object-fit':'cover'});
            $(this).prepend(oCln);
        });

        var oRoot = $(this).closest('.csss_swiper');
        var iCnt  = $(oRoot).find('.swiper-slide').length;
        var aCfg  = {
            spaceBetween:0, 
            loop: true,
            updateOnWindowResize: true
        };
        if( $(this).find(".swiper-slide").length == 1 ){ $(this).addClass("disabled-transform") }
        if( $(this).hasClass('csss_swiper_logos') ){            
            aCfg['breakpoints' ] = {1:{"slidesPerView":2},767:{"slidesPerView":3},1024:{"slidesPerView":4},1280:{"slidesPerView":5},1480:{"slidesPerView":6}};
            aCfg['spaceBetween'] = 20;
            aCfg['centeredSlides'] = false;
            aCfg['loop'        ] = false;
        }
        
        if( $(oRoot).find('.swiper-bullets').length && iCnt > 1 ){
            aCfg['pagination'] = {el:$(oRoot).find('.swiper-bullets').get(0), clickable:true};
            aCfg['pagination']['type'] = 'bullets'; 
        } 
        
        var oSwiper = new Swiper(this, aCfg); 
        oSwiper.on('slideChange', function(){ csssSwiperChange(this); });

        if( $('.js-swiper_link').length > 0 ){
            $('.js-swiper_link').click(function(e){
                var iSld = parseInt( $(e.target).closest('.js-swiper_link').attr('data-slide') );
                oSwiper.slideToLoop(iSld-1);
                autoSwiperPlay = false;
                $('.csss_swiper_play').addClass('paused');
            });
        }
        if( $(oRoot).hasClass('autoplay') ){
            autoSwiper = oSwiper;
            autoSwiperPlay = true;
            csssSwiperAutoPlay(true);

            $(oRoot).find('.swiper-bullets').append('<a href="" class="csss_swiper_play"></a>');
            $(oRoot).find('.swiper-bullets .csss_swiper_play').click(csssSwiperAutoPlayToggle);
        }
    });
}

function csssSwiperChange(oObj){
    var iIdx  = oObj.realIndex + 1;
    var oRoot = $(oObj.$el).closest('.swiper-root');
    if( $(oRoot).length <= 0 ){ oRoot = oObj.$el; }

    $('.effect_sphiral').attr('data-slide',iIdx);
}
function csssSwiperAutoPlay(bInit){
    if( !bInit && autoSwiperPlay ){
        autoSwiper.slideNext();
    }

    clearTimeout(autoSwiperTimer);
    autoSwiperTimer = setTimeout( csssSwiperAutoPlay, autoSwiperDelay);
}
function csssSwiperAutoPlayToggle(e){
    if( e ){ e.preventDefault(); }
    autoSwiperPlay = !autoSwiperPlay;
    if( autoSwiperPlay ){       
        $(e.target).closest('.csss_swiper_play').removeClass('paused');
        clearTimeout(autoSwiperTimer);
        csssSwiperAutoPlay();
    }else{
        $(e.target).closest('.csss_swiper_play').addClass('paused');
    }
}
/*================================================================================*/
/* VOTING */
/*================================================================================*/
function csssVote(e){
    if( e ){ e.preventDefault(); }
    var oGrp = $(e.target).closest('.js-vote_group');
    var oLnk = $(e.target).closest('.js-vote');
    var iLmt = $(oGrp).attr('data-limit');
    if( isNaN(iLmt) ){ iLmt = 2; }
    
    $(oLnk).find('input[type="hidden"]').val('0');
    if( $(oLnk).hasClass('active') ){
        $(oLnk).removeClass('active');
        return;
    }
    if( $(oGrp).find('.js-vote.active').length >= iLmt ){
        return;
    }
    $(oLnk).addClass('active');
    $(oLnk).find('input[type="hidden"]').val('1');
}        
function csssVoteSubmit(e){
    if( e ){ e.preventDefault(); }
    var aData = {};
    if( $('.js-vote_form .js-vote.active').length <= 0 ){
        $('.js-vote_form .js-vote_error').show();
        return;
    }
    $('.js-vote_form').find('input').each(function(){
        var sNam = $(this).attr('name');
        var sVal = $(this).val();
        aData[sNam]=sVal;
    });
    
    $('.js-vote_form').hide();
    $('.js-vote_message').show();

    var sURL = $('.js-vote_form').attr('data-api');
    apiCall('vote',sURL,aData,csssVoteComplete,true);
}
function csssVoteComplete(bSuc, sID, aData){
    if( getValue(aData,'status') == 1 ){
        var aRst = getValue(aData,'result',[]);

        $('.js-vote_result').find('.js-tab').html('');
        $('.js-vote_result').find('.csss_voting_result').remove();
        var iCnt = 0;
        for( var sK in aRst ){
            var aDat = aRst[sK];
            var sTab = '<a href="#vote_result_'+iCnt+'" class="js-tab_item">'+sK+'</a>';
            $('.js-vote_result').find('.js-tab').append(sTab);

            var sRst = '';
            sRst += '<div class="csss_voting_result " id="vote_result_'+iCnt+'">';
            for( var i=0; i<aDat.length && i<10; i++ ){
                var aDt = aDat[i];
                sRst += '<div class="csss_voting_result_item">';
                sRst += '<div class="no">'+(i+1)+'. </div>';

                sRst += '<a href="#pop_up" data-target="popup_vr_'+iCnt+'_'+i+'" class="img">';
                if( aDt['file'] != '' && aDt['file'] != undefined && aDt['file'] != null && aDt['file'] != false ){
                    sRst += '<img src="'+aDt['file']+'" />';
                }
                sRst += '</a>';

                sRst += '<div class="text">';
                sRst += '<p><strong>'+aDt['title']+'</strong></p>';
                sRst += '<p>'+aDt['description']+'</p>';
                sRst += '</div>';

                sRst += '<div class="percent">'+aDt['percentage']+'</div>';

                sRst += '<div style="display:none" id="popup_vr_'+iCnt+'_'+i+'">';
                sRst += '<p>';
                if( aDt['file'] != '' && aDt['file'] != undefined && aDt['file'] != null && aDt['file'] != false ){
                    sRst += '<img src="'+aDt['file']+'" alt="Photo" data-name="popup_img" data-attr="src">';
                }
                sRst += '</p>';
                sRst += '<h3 class="h3" data-name="name">'+aDt['title']+'</strong></h3>';
                sRst += '<p data-name="popup_desc">'+aDt['description']+'</p>';
                sRst += '</div>';

                sRst += '</div>';
            }
            sRst += '</div>';
            $('.js-vote_result .js-tab').parent().append(sRst);

            iCnt ++;
        }
        
        $('.js-vote_result').find('a:not(.anchored)').addClass('anchored').click(csssOnAnchor);            
        $('.js-vote_result').find('.js-tab_item:first').click();

        $('.js-vote_result').show();
        csssScrollTo('.js-vote_result');
    }else{
        $('.js-vote_result').hide();
        $('.js-vote_show_result').hide();
        $('.js-vote_api_error').show();
    }
}
function csssVoteShowResult(e){
    if( e ){ e.preventDefault(); }
    csssScrollTo('.js-vote_result');
}
function csssVoteInit(){
    $('.js-vote').click(csssVote);
    $('.js-vote_submit').click(csssVoteSubmit);
    $('.js-vote_show_result').click(csssVoteShowResult);
}
/*================================================================================*/
/*================================================================================*/
var prevgaAction;
function clickGa(el) {
    var gaEvent = "CSS_Click_Link",
        elHref = ''+el.attr('href'),
        elTxt = el.text().replace(/\n/g, ' ').replace(/  /g, ''),
        page = $("title").text().replace("sustainability | ", "") + "_",
        gaAction = "Click_" + elTxt,
        elParent = el.parent();
    if( (elHref).indexOf('#') == 0 ){
        gaEvent = "CSS_Click_Anchor";
    }
    if(el.parents('.menu').length > 0) {
        gaAction = "Click_Menu_" + elTxt;
    }
    if(elParent.is(".csss_head_logo")) {
        gaAction = "Click_Menu_Logo";
    }
    if(elParent.is(".logout")) {
        gaAction = (elHref === "/logout" ? 'Click_Menu_Logout' : 'Click_Menu_Login')
    }
    if(el.parents(".csss2_foot").length > 0) {
        gaAction = "Click_Footer_" + elTxt;
    }
    if(elParent.is('.csss2_management_text') || elParent.is('.csss_card_text') || elParent.is('.csss_heading') || elParent.is('.csss2_pill_item_text') || elParent.is('.csss2_framework_text')) {
        var titleEl = $(elParent).find('.h1,.h2,.h3,.h4,.h5').eq(0),
            titleTxt = $(titleEl).text()
        if($(titleEl).parents("a").length > 0 || elTxt === "") {
            gaAction = "Click_" + titleTxt;
        } else {
            gaAction = "Click_" + titleTxt + "_" + elTxt;
        }
    }
    if(elParent.is('.csss_card_img')) {
        var titleEl = el.parents(".csss_card").find('.h1,.h2,.h3,.h4,.h5').eq(0);
        if($(titleEl).length > 0) {
            var titleTxt = $(titleEl).text()
            if($(titleEl).parents("a").length > 0 || elTxt === "") {
                gaAction = "Click_" + titleTxt;
            } else {
                gaAction = "Click_" + titleTxt + "_" + elTxt;
            }
        }
    }
    if( el.parents('.csss_article').length > 0) {
        var titleEl = el.parents(".csss_article").find('.h1,.h2,.h3,.h4,.h5').eq(0);
        if($(titleEl).length > 0) {
            var titleTxt = $(titleEl).text()
            if($(titleEl).parents("a").length > 0 || elTxt === "") {
                gaAction = "Click_" + titleTxt;
            } else {
                gaAction = "Click_" + titleTxt + "_" + elTxt;
            }
        }
    }
    if(el.parents(".csss_intro").length > 0 || el.parents('.csss_outro').length > 0 || el.parents(".csss2_side_banner_text").length > 0) {
        var holder = $(elParent),
            innerHolder = el;
        while(holder.length > 0 && (!holder.is('.csss_intro') && !holder.is('.effect_fade_up') && !holder.is('.csss_outro') && !holder.is(".csss2_side_banner_text"))) {
            holder = holder.parent();
            innerHolder = innerHolder.parent();
        }
        var titleEl = innerHolder.prevUntil('.h1,.h2,.h3,.h4,.h5').prev()
        if($(titleEl).length > 0) {
            gaAction = "Click_" + $(titleEl).text() + "_" + elTxt;
        } else if  (el.parents('.csss_outro').length > 0) {
            gaAction = "Click_Outro_" + elTxt;
        }
    }
    if( el.hasClass('js-tab_item')){
        gaEvent = "CSS_Click_Tab";
        gaAction = "Click_Tab_" + elTxt;
    }
    if(elParent.is(".csss_crumb")) {
        gaEvent = "CSS_Click_Breadcrumb";
        gaAction = "Click_Breadcrumb_" + elTxt;
    }
    switch( elHref ){
        case '#top'          : gaAction = "Click_Back_To_Top"; break;
        case '#mobile'       : gaAction = "Click_Toggle_Mobile_Menu"; break;
        case '#mobile_toggle': gaEvent = "CSS_Click_Submenu" ; gaAction = "Click_Toggle_Submenu_" + el.parents(".menu").find("a").eq(0).text(); break;
        // case '#accordion'    : break;
        case '#pop_up'       :
            gaEvent = "CSS_Click_Popup";
            gaAction = "Click_Popup_" + el.parent().find(".h1,.h2,.h3,.h4,.h5").eq(0).text()
            if(el.is(".csss_btn")) gaAction += "_" + el.text();
            prevgaAction = gaAction;
            break;
        case '#pop_close'    :
            gaEvent = "CSS_Click_Close_Popup";
            gaAction = $(this).parent().find(".h1,.h2,.h3,.h4,.h5").eq(0).text();
            if(gaAction === "") gaAction = prevgaAction;
            break;

        case '#newpost'      : gaEvent = "CSS_Click_Popup"; gaAction = "Click_New_Post"; break;
        case '#newpost_close': gaEvent = "CSS_Click_Close_Popup"; gaAction = "Click_Close_New_Post"; break;
        case '#more_comment' :
            gaEvent = "CSS_Click_More_Comment";
            var titleTxt = $(".csss_landing .h2s").text()
            gaAction = "Click_More_Comment_" + titleTxt;
            break;
        case '#newpost_submit':
        gaEvent = "CSS_Click_Submit_New_Post";
        gaAction = "Click_Submit_new_Post";
        default : 
            if( el.parents('.csss_pop').length > 0 ){
                gaEvent = "CSS_Click_Popup_More";
                var titleTxt = el.parents(".csss_pop").find(".h1,.h2,.h3,.h4").eq(0).text();
                gaAction = "Click_Popup_More_" + titleTxt + "_" + elTxt
            }
            break; 
    }
    var gaPageAction = page + gaAction
    sendGaEvent(gaEvent, gaAction, elHref, gaPageAction)
}
function csssOnAnchor(e){
    var oLink = $(e.target).closest('a');
    var sHref = $(oLink).attr('href');
    clickGa($(oLink));
    if( (''+sHref).indexOf('#') == 0 ){
        if( e ){ e.preventDefault(); }
    }
    switch( sHref ){
        case '#top'          : csssScrollTo(0); break;
        case '#mobile'       : csssMobileMenu(e); break;
        case '#mobile_toggle': csssMobileMenuToggle(e); break;

        case '#toggle'       : csssToggle(e); break;
        case '#accordion'    : csssAccordionToggle(e); break;
        case '#pop_up'       : csssPopUpClick(e); break;
        case '#pop_close'    : csssPopDown(e); break;

        case '#newpost'      : csssNewPost(e); break;
        case '#newpost_close': csssNewPostClose(e); break;
        case '#upload_clear' : csssFileClear(e); break;
        case '#more_comment' :
            $('.csss_comment').each(function(){
                var iCnt = 0;
                $(this).find('.csss_comment_item.hidden').each(function(){        
                    if( iCnt < 5 ){ $(this).removeClass('hidden').show(); }
                    iCnt++
                });
            })
            if( $('.csss_comment_item.hidden').length <= 0 ){
                $(oLink).hide();
            }
            break;
        default : 
            if( $(oLink).hasClass('js-tab_item')){ csssTabToggle(e); }
            break; 
    }
}
/*--------------------------------------------------------------------------------*/
function csssOnScroll(){
    var iST = $(window).scrollTop();
    if( iST > 120 || $('.csss_head_menu .mobile .open').length > 0 ){
        $('.csss_head').addClass('scroll');
    }else{        
        $('.csss_head').removeClass('scroll');
    }

    $('.csss_home_bg').each(function(){
        var iT = $(this).position().top;
        var iY = Math.max(0,iST-iT)+100;
        $(this).css({'transform':'ease all 0.1s','background-position':'top '+iY+'px center'})
        
    });

    if( $(window).width() >= 1024 ){
        $('.csss2_banner').each(function(){
            var iT = $(this).position().top;
            var iY = Math.max( 0 , (iT-iST)/-2 );
            $(this).find('.csss2_banner_img').css({'top':iY+'px'})
            
        });
    }else{
        $('.csss2_banner').find('.csss2_banner_img').css({'top':'0px'})
    }
    
    $('.toggled').removeClass('open');
    csssEffect(iST);
}
/*--------------------------------------------------------------------------------*/
function csssInit(){
    $(window).bind('scroll',csssOnScroll);
    $('a:not(.anchored)').addClass('anchored').click(csssOnAnchor);
    if( $('.csss_banner--white').length > 0 ){ $('.csss_head').addClass('white'); }

    $('.csss_head_menu').mouseenter( function(e){
        $('.csss_head').addClass('hovered');
    });
    $('.csss_head_menu').mouseleave( function(e){
        $('.csss_head').removeClass('hovered');
    });

    $('.csss_comment').each(function(){
        var iCnt = 0;
        $(this).find('.csss_comment_item').each(function(){        
            if( iCnt >= 3){ $(this).addClass('hidden').hide(); }
            iCnt++
        });
    })

    csssTabInit();
    csssQuizInit();
    csssSwiperInit();
    csssNumberEffectInit();
    csssVoteInit();
    csssLoadListing();
    csssSideBannerFix()
    csssOnScroll();    

    if( (''+window.location).indexOf('#')>=0){
        var sAnc= (''+window.location).replace(/.+[#]/gi,'#');
        if( sAnc != '#' && $(sAnc).length >0 ){
            var iTop = $(sAnc).offset().top - 300;
            $('html,body').animate({scrollTop:iTop});
            
        }
    }

    $('#top .csss_head_menu .menu > a').each(function(){
        $(this).html( (''+$(this).html()).replace(/[\r\n]/gi,'<br/>') );
    })
}
/*================================================================================*/
$(document).ready(function(){
    csssInit();
});
/*--------------------------------------------------------------------------------*/