setInterval in pugjs

Viewed 153

I trying to make time creater with mixin in pugjs. I taking speacial names from other pages as name "type" but ı taking unexpected text error on line second to last. I couldn't solve , please could you help me?

mixin createTimer(type)

    .col-6.col-md-2.p-0.mb-3
        a.btn.btn-warning.ml-0.mr-0.col-12.p-0.b(style="font-size:25px;" class=type) 
    
         
            -var saat = 2;
            -var dakika = 15;
            -var saniye = 0;
            -var bitti = false;
            -var sure = saat+':'+dakika+':'+saniye;
            sure = sure.toString();
            document.querySelector(type).innerHTML = 0:00:00
            -var kalanZaman = setInterval(()=>{        
            if saniye == 0
                saniye=60
                dakika=dakika-1
                
            
            saniye = saniye - 1
            if dakika==0&&saniye==0
                if saat==0
                    bitti=true
                else
                    saat=saat-1
                    dakika=60
                    
            

            if saniye<10
                saniyeF = saniye
                saniyeF.toString()
                saniyeF='0'+saniyeF
            else 
                saniyeF=saniye

            if dakika<10
                dakikaF = dakika
                dakikaF.toString()
                dakikaF='0'+dakika
            else 
                dakikaF=dakika

            sure = saat+':'+dakikaF+':'+saniyeF;
            if bitti==true
                document.querySelector(type).innerHTML='Time Finished'
                clearInterval(kalanZaman)
            else 
                document.querySelector(type).innerHTML = sure
                } , 1000)
            kalanZaman()
1 Answers

I found my mistake , i need to use "-" for all js codes but still its not working because of there is no way to directly dom manupulation with pug so i translated my code to javascript and i integrated in my pug file , now its working. my fixed js code:

.col-6.col-md-2.p-0.mb-3
    a.d-none.d-md-block.btn.btn-warning.ml-0.mr-0.col-12.p-0.b(style="font-size:25px;" class="des")
script.

    function kalanZaman(){
    var saat = 2;
    var dakika = 15;
    var saniye = 0;
    var bitti = false;
    var sure = saat+':'+dakika+':'+saniye;
    sure = sure.toString();
    document.querySelector('.des').innerHTML = '0:00:00';

    setInterval(() => {        
    if(saniye==0){
        saniye=60;
        dakika=dakika-1;
        }
    
    saniye = saniye - 1;
    if(dakika==0&&saniye==0){
        if(saat==0){
            bitti=true;

            }
        else{
            saat=saat-1;
            dakika=60;
            }
    }

            if(saniye<10){
        saniyeF = saniye;
        saniyeF.toString();
        saniyeF='0'+saniyeF;
    }else{saniyeF=saniye;}
    if(dakika<10){
        dakikaF = dakika;
        dakikaF.toString();
        dakikaF='0'+dakika;
    }else{dakikaF=dakika;}
    sure = saat+':'+dakikaF+':'+saniyeF;
    if(bitti==true){document.querySelector('.des').innerHTML='Time Finished';clearInterval(kalanZaman);}
    else{document.querySelector('.des').innerHTML = sure;}
    }, 1000)};
    
    kalanZaman();
Related