var div1Height;
$(document).ready(function(){
    placeThings(0,0,0);
    div1Height=document.getElementById('cover1').clientHeight;
    console.log(div1Height);
    $('#imgContainer').css('height',div1Height+'px');   
    $('#verify').css({'pointer-events':'none'});
})
var Kahaniyaan={}
var dataArr=[
{
    'list':[
        {
            'headingName':'Hair Styling L1',
            'link':'certificate.html',
            'imgName':'certified.png'
        },{
            'headingName':'Hair Styling L2',
            'link':'referrence.html',
            'imgName':'referred.png'
        },{
            'headingName':'Waxing',
            'link':'selfDeclared.html',
            'imgName':'self_declared.png'
        },{
            'headingName':'Threading',
            'link':'certificate.html',
            'imgName':'certified.png'
        }
    ]
},{
    'list':[
        {
            'headingName':'Hair Styling L3',
            'link':'certificate.html',
            'imgName':'certified.png'
        },{
            'headingName':'Hair Styling L4',
            'link':'referrence.html',
            'imgName':'referred.png'
        },{
            'headingName':'Waxing1',
            'link':'card.html',
            'imgName':'self_declared.png'
        },{
            'headingName':'Threading2',
            'link':'certificate.html',
            'imgName':'certified.png'
        }
    ]
}
   
];

var next=0,prev=0;
function nextPage(element)		//display story pages , calls on onclick of pre & next button
{
    clearTimeout(Kahaniyaan.turnClass,Kahaniyaan.removeClass);
	if(element=="prev" && next>0)			//if prev button clicked
	{
        var cloneCover1=$('#cover1').clone().addClass('remove');
        $('#personalInfo').append(cloneCover1);
       
		cloneCover1.css({'position':'absolute','z-index':1});
		//$('.cover1').addClass('prevturn page');
		next--;
        placeThings(1000,0,0);
        Kahaniyaan.addPageTurnClass('prevturn');
		/* var cloneCover1=$('#imgContainer').clone().addClass('remove');
        $('#cover2').append(cloneCover1);
       
		cloneCover1.css({'position':'absolute','z-index':1});
        next--;
        placeThings(1000,0,0);
        $(cloneCover1).addClass('prev page');
		setTimeout(function(){  
			$('.remove').addClass('prevturn page');
			setTimeout(() => {
				$('.remove').remove();	
			}, 510);
		},500) */
        //$(cloneCover1).addClass('prev page');
        
       /*  setTimeout(function(){  
			$('.remove').addClass('prevturn page');
			setTimeout(() => {
				$('.remove').remove();	
			}, 510);
		},500) */
	}		
	else if(element=="next" && next<dataArr.length-1)
	{
        next++;
		var cloneCover2=$('#imgContainer').clone().addClass('remove');
		$('#cover2').append(cloneCover2);
		cloneCover2.css({'position':'absolute','z-index':1});
	//	$('.cover2').addClass('nextturn page');
		placeThings(0,1000,next);
        Kahaniyaan.addPageTurnClass('nextturn');
		/* setTimeout(function(){
			$('.remove').addClass('nextturn page');
			setTimeout(() => {
				$('.remove').remove();	
			}, 510);			
		},500) */
	} 	
}
Kahaniyaan.addPageTurnClass=function(className)
{
	if(Kahaniyaan.turnClass)
	{
		clearTimeout(Kahaniyaan.turnClass);
		Kahaniyaan.turnClass=null;
	}
	Kahaniyaan.turnClass=setTimeout(()=>{
		$('.remove').addClass(className+' page');
		if(Kahaniyaan.removeClass)
		{
			clearTimeout(Kahaniyaan.removeClass);
			Kahaniyaan.removeClass=null;
		}
		Kahaniyaan.removeClass=setTimeout(() => {
			$('.remove').remove();	
		}, 510);
	},500);
}
function placeThings(textTimeout,imgTimeout,cnt)
{
	$('.cover1').removeClass('prevturn nextturn page')
	var parentDiv,divEle,heading,imgDiv,img;
    var counter=0;
    setTimeout(() => {
        document.getElementById("imgContainer").innerHTML="";
        for(var i=0;i<2;i++)
        {
            parentDiv=document.createElement('div');
            parentDiv.setAttribute('class','col-xs-12 col-sm-12 col-lg-12 col-md-12');
            parentDiv.setAttribute('id','div'+(i+1));
            $(parentDiv).css('height',div1Height/2);
            for(var j=0;j<2;j++)
            {
                divEle= document.createElement("div");
                divEle.setAttribute("class","skill_info  col-lg-6 col-md-6 col-xs-6 col-sm-6");
                divEle.setAttribute("id","div"+i+j);

                heading= document.createElement("h3");
                heading.setAttribute("class","skill_name text-center");
                heading.innerHTML=dataArr[cnt].list[counter].headingName;
                divEle.append(heading);

                imgDiv=document.createElement('div');
                imgDiv.setAttribute('class','certified_container col-lg-8 col-md-8 col-xs-8 col-sm-8 col-lg-offset-2 col-md-offset-2 col-xs-offset-2 col-sm-offset-2');

                a=document.createElement('a');
                a.setAttribute('target','_self');
                a.setAttribute('href',dataArr[cnt].list[counter].link);
                imgDiv.append(a);

                img=document.createElement('img');
                img.setAttribute('class','text-center img-responsive');
                img.setAttribute('src',dataArr[cnt].list[counter].imgName);
                a.append(img);
                divEle.append(imgDiv);
                parentDiv.append(divEle);
                counter++;
            }
            document.getElementById("imgContainer").appendChild(parentDiv);
        }	
    }, textTimeout);
 }
var url='https://devgamerepo.prathamopenschool.org/Game/Demo/SkillsPortal/index.html';

function whatsappShare_click(msg) {
   // window.open('https://api.whatsapp.com/send?text='+msg+'   Link-'+encodeURIComponent(url))
   $('#myModal').show();
   window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container');   
}
function getPhoneNumberFromUserInput()
    {
        return(document.getElementById('contact').value);
    }

var myFunction = function() 
    { 
        var phoneNumber = getPhoneNumberFromUserInput();
        firebase.auth().signInWithPhoneNumber(phoneNumber, window.recaptchaVerifier)
        .then(function (confirmationResult) {
        // SMS sent. Prompt user to type the code from the message, then sign the
        // user in with confirmationResult.confirm(code).
        window.confirmationResult = confirmationResult;
        console.log('success');
        document.getElementById('otpDiv').style.display='block';
        document.getElementById('contactDiv').style.display='none';
        $('#send').css({'pointer-events':'none'});
        $('#verify').css({'pointer-events':'auto'});

        }).catch(function (error) {
        // Error; SMS not sent
        // ...
        alert(error);
        console.log(error);
        });
    };
    function getCodeFromUserInput()
    {
        return(document.getElementById('otp').value);
    }
    function verify()
    {
        var code = getCodeFromUserInput();
        confirmationResult.confirm(code).then(function (result) {
        // User signed in successfully.
        var user = result.user;
        alert('verified successfully');
        var msg='View my skill passport';
        window.open('https://api.whatsapp.com/send?text='+msg+'   Link-'+encodeURIComponent(url));
        closeModal();
        // ...
        }).catch(function (error) {
        // User couldn't sign in (bad verification code?)
        console.log(error);
        alert(error);
        });
    }

 function fbShare_click() {
   // u = "https://prathamopenschool.org/";
    // t=document.title;
    t = $('hello').text();
    window.open('http://www.facebook.com/sharer.php?u=' + encodeURI(url) + '&t=' + encodeURIComponent(t), 'sharer', 'toolbar=0,status=0,width=626,height=436'); return false;
}
function twitterShare_click() {
   // u = url;
    // t=document.title;
    var text = $('hello').text();
    window.open('http://twitter.com/share?url=' + encodeURIComponent(url) + '&text=' + encodeURIComponent(text), '', 'left=0,top=0,width=550,height=450,personalbar=0,toolbar=0,scrollbars=0,resizable=0'); return false;
}


function closeModal(){
    $('#myModal').hide();
}