java script код калькулятора с интерфейсом который вычисляет кубический и другие корни

Время изготовления : в идеале можно за 2 часа, чтобы нарисовать все картинки. Раскидать их по своим местам, и быстро написать ужасный и неразборчивый  не ООП код, чтоб этот состав костылей кое-как ездил.

На самом деле пришлось потратить 10-12 часов, на всякие перерывы, исправления и поиск ошибок, бесконечно приходящие идеи , типа сделать проверки на отрицательные числа и четные показатели степени, или сделать блокировщик ввода двух точек или двух минусов под корень, ведь у числа максимум одна точка отделяющая десятичную дробь от целого. А самое неприятное оказалось внезапно , то что ява скрипт относиться к языкам неумеющим производить точные вычисления. Например он умножает 0.03*0.03 = 0.00090000000045



 
<title>Вычисляем корни</title>
<style >
#matka {position: absolute; width:500px;height:500px; background: url(/scripts/calculator/fon3.aspx)}
    .butt {position: absolute; width:60px; height:60px;}
    
    #b1 {background: url(/scripts/calculator/b1.aspx); left: 30px; top: 280px}
     #b2 {background: url(/scripts/calculator/b2.aspx); left: 90px; top: 280px}
     #b3 {background: url(/scripts/calculator/b3.aspx); left: 150px; top: 280px}
    
      #b4 {background: url(/scripts/calculator/b4.aspx); left: 30px; top: 340px}
     #b5 {background: url(/scripts/calculator/b5.aspx); left: 90px; top: 340px}
     #b6 {background: url(/scripts/calculator/b6.aspx); left: 150px; top: 340px}
    
      #b7 {background: url(/scripts/calculator/b7.aspx); left: 30px; top: 400px}
     #b8 {background: url(/scripts/calculator/b8.aspx); left: 90px; top: 400px}
     #b9 {background: url(/scripts/calculator/b9.aspx); left: 150px; top: 400px}
    
          #bminus {background: url(/scripts/calculator/bminus.aspx); left: 220px; top: 280px}
     #bdot {background: url(/scripts/calculator/bdot.aspx); left: 220px; top: 340px}
     #b0 {background: url(/scripts/calculator/b0.aspx); left: 220px; top: 400px}
    
         #bdel {background: url(/scripts/calculator/bdel.aspx); left: 285px; top: 400px}
     #bok {background: url(/scripts/calculator/bok.aspx); left: 350px; top: 400px}
    
       #brootminus {background: url(/scripts/calculator/brootminus.aspx); left: 415px; top: 280px}
       #brootplus {background: url(/scripts/calculator/brootplus.aspx); left: 415px; top: 340px}
       #bempty {background: url(/scripts/calculator/bempty.aspx); left: 285px; top: 280px}
    
    
    .rt {position: absolute; width:20px; height:20px; background-color:#111111}
    #rt1 {top: 140px; left: 120px}
     #rt2 {top: 140px; left: 140px}
     #rt3 {top: 140px; left: 160px}
     #rt4 {top: 140px; left: 180px}
     #rt5 {top: 140px; left: 200px}
     #rt6 {top: 140px; left: 220px}
     #rt7 {top: 140px; left: 240px}
      #rt8 {top: 140px; left: 260px}
      #rt9 {top: 140px; left: 280px}
      #rt10 {top: 140px; left: 300px}
      #rt11 {top: 140px; left: 320px}
      #rt12 {top: 140px; left: 340px}
      #rt13 {top: 140px; left: 360px}
      #rt14 {top: 140px; left: 380px}
      #rt15 {top: 140px; left: 400px}
    
    
    .ans {position: absolute; width:20px; height:20px; background-color:#222222}
    #ans1 {top: 190px; left: 120px}
     #ans2 {top: 190px; left: 140px}
     #ans3 {top: 190px; left: 160px}
     #ans4 {top: 190px; left: 180px}
     #ans5 {top: 190px; left: 200px}
     #ans6 {top: 190px; left: 220px}
     #ans7 {top: 190px; left: 240px}
      #ans8 {top: 190px; left: 260px}
      #ans9 {top: 190px; left: 280px}
      #ans10 {top: 190px; left: 300px}
      #ans11 {top: 190px; left: 320px}
      #ans12 {top: 190px; left: 340px}
      #ans13 {top: 190px; left: 360px}
      #ans14 {top: 190px; left: 380px}
      #ans15 {top: 190px; left: 400px}
    
    #pw {position:absolute; left: 72px; top:112px; width:20px ; height:20px ; background: url(/scripts/calculator/l5.aspx)}
       #ao {position:absolute; left: 80px; top:222px; width:200px ; height:50px ; background: url(/scripts/calculator/aonet.aspx)}
    #bauto {background: url(/scripts/calculator/bauto.aspx); left: 285px; top: 340px}</style>

<div id="matka">
    <div id="pw">
        &nbsp;</div>
    <div class="butt" id="bauto" onclick="eventAuto(this) ">
        &nbsp;</div>
    <div id="ao" onclick="eventAuto(this) ">
        &nbsp;</div>
    <div class="butt" id="b1" onclick="feedstartmas(1,this)">
        &nbsp;</div>
    <div class="butt" id="b2" onclick="feedstartmas(2,this)">
        &nbsp;</div>
    <div class="butt" id="b3" onclick="feedstartmas(3,this)">
        &nbsp;</div>
    <div class="butt" id="b4" onclick="feedstartmas(4,this)">
        &nbsp;</div>
    <div class="butt" id="b5" onclick="feedstartmas(5,this)">
        &nbsp;</div>
    <div class="butt" id="b6" onclick="feedstartmas(6,this)">
        &nbsp;</div>
    <div class="butt" id="b7" onclick="feedstartmas(7,this)">
        &nbsp;</div>
    <div class="butt" id="b8" onclick="feedstartmas(8,this)">
        &nbsp;</div>
    <div class="butt" id="b9" onclick="feedstartmas(9,this)">
        &nbsp;</div>
    <div class="butt" id="bminus" onclick="feedstartmas('-',this)">
        &nbsp;</div>
    <div class="butt" id="bdot" onclick="feedstartmas('.',this)">
        &nbsp;</div>
    <div class="butt" id="b0" onclick="feedstartmas(0,this)">
        &nbsp;</div>
    <div class="butt" id="bdel" onclick="fdel(this)">
        &nbsp;</div>
    <div class="butt" id="bok" onclick="fstart(this)">
        &nbsp;</div>
    <div class="butt" id="brootminus" onclick="powminus(this)">
        &nbsp;</div>
    <div class="butt" id="brootplus" onclick="powplus(this)">
        &nbsp;</div>
    <div class="butt" id="bempty" onclick="smenaFona(this)">
        &nbsp;</div>
    <div class="rt" id="rt1">
        &nbsp;</div>
    <div class="rt" id="rt2">
        &nbsp;</div>
    <div class="rt" id="rt3">
        &nbsp;</div>
    <div class="rt" id="rt4">
        &nbsp;</div>
    <div class="rt" id="rt5">
        &nbsp;</div>
    <div class="rt" id="rt6">
        &nbsp;</div>
    <div class="rt" id="rt7">
        &nbsp;</div>
    <div class="rt" id="rt8">
        &nbsp;</div>
    <div class="rt" id="rt9">
        &nbsp;</div>
    <div class="rt" id="rt10">
        &nbsp;</div>
    <div class="rt" id="rt11">
        &nbsp;</div>
    <div class="rt" id="rt12">
        &nbsp;</div>
    <div class="rt" id="rt13">
        &nbsp;</div>
    <div class="rt" id="rt14">
        &nbsp;</div>
    <div class="rt" id="rt15">
        &nbsp;</div>
    <div class="ans" id="ans1">
        &nbsp;</div>
    <div class="ans" id="ans2">
        &nbsp;</div>
    <div class="ans" id="ans3">
        &nbsp;</div>
    <div class="ans" id="ans4">
        &nbsp;</div>
    <div class="ans" id="ans5">
        &nbsp;</div>
    <div class="ans" id="ans6">
        &nbsp;</div>
    <div class="ans" id="ans7">
        &nbsp;</div>
    <div class="ans" id="ans8">
        &nbsp;</div>
    <div class="ans" id="ans9">
        &nbsp;</div>
    <div class="ans" id="ans10">
        &nbsp;</div>
    <div class="ans" id="ans11">
        &nbsp;</div>
    <div class="ans" id="ans12">
        &nbsp;</div>
    <div class="ans" id="ans13">
        &nbsp;</div>
    <div class="ans" id="ans14">
        &nbsp;</div>
    <div class="ans" id="ans15">
        &nbsp;</div>
</div>
<script>
    
   
    
    
    function renewingMasRootStart (a){
        
        for (var i=0; i<15; i++)
            {
                
           
                idiota(masRootStart[i],startmas[i])
              
            }
    }
    
    
     function renewingMasAnswerEnd (enterarray){
        
        for (var i=0; i<15; i++)
            {
                
           
                idiota(masAnswersEnd[i],enterarray[i])
              
            }
    }
    
      var stepen =document.getElementById("pw")
       var banner= document.getElementById("ao")
    
     var telo =document.getElementById("matka")
    var rut1 =document.getElementById("rt1")
     var rut2 =document.getElementById("rt2")
     var rut3= document.getElementById("rt3")
     var rut4 =document.getElementById("rt4")
     var rut5= document.getElementById("rt5")
    
      
    var rut6 =document.getElementById("rt6")
     var rut7= document.getElementById("rt7")
     var rut8= document.getElementById("rt8")
     var rut9= document.getElementById("rt9")
     var rut10 =document.getElementById("rt10")
    
    
      
    var rut11 =document.getElementById("rt11")
     var rut12= document.getElementById("rt12")
     var rut13 =document.getElementById("rt13")
     var rut14 =document.getElementById("rt14")
     var rut15= document.getElementById("rt15")
     
        var an1 =document.getElementById("ans1")
     var an2 =document.getElementById("ans2")
     var an3= document.getElementById("ans3")
     var an4 =document.getElementById("ans4")
     var an5= document.getElementById("ans5")
    
      
    var an6 =document.getElementById("ans6")
     var an7= document.getElementById("ans7")
     var an8= document.getElementById("ans8")
     var an9= document.getElementById("ans9")
     var an10 =document.getElementById("ans10")
    
    
      
    var an11 =document.getElementById("ans11")
     var an12= document.getElementById("ans12")
     var an13 =document.getElementById("ans13")
     var an14 =document.getElementById("ans14")
     var an15= document.getElementById("ans15")
     
 
     
     var masRootStart=[rut1,rut2,rut3,rut4,rut5,rut6,rut7,rut8,rut9,rut10,rut11,rut12,rut13,rut14,rut15]
    var masAnswersEnd=[an1,an2,an3,an4,an5,an6,an7,an8,an9,an10,an11,an12,an13,an14,an15]
    function idiota (elem,sym){
        if (String(elem)=="undefined"){return }
        if (sym==1){elem.style.backgroundImage="url(/scripts/calculator/l1.aspx)" ;return }
            if (sym==2){elem.style.backgroundImage="url(/scripts/calculator/l2.aspx)" ;return}
            if (sym==3){elem.style.backgroundImage="url(/scripts/calculator/l3.aspx)" ;return}
        
         if (sym==4){elem.style.backgroundImage="url(/scripts/calculator/l4.aspx)" ;return}
             if (sym==5){elem.style.backgroundImage="url(/scripts/calculator/l5.aspx)" ;return}
        if (sym==6){elem.style.backgroundImage="url(/scripts/calculator/l6.aspx)" ;return}
            if (sym==7){elem.style.backgroundImage="url(/scripts/calculator/l7.aspx)" ;return}
        if (sym==8){elem.style.backgroundImage="url(/scripts/calculator/l8.aspx)" ;return}
            if (sym==9){elem.style.backgroundImage="url(/scripts/calculator/l9.aspx)" ;return}
        if (sym==0){elem.style.backgroundImage="url(/scripts/calculator/l0.aspx)" ;return}
        
        
            if (sym==".") {elem.style.backgroundImage="url(/scripts/calculator/ld.aspx)" ;return}
        
        if (sym=="-"){elem.style.backgroundImage="url(/scripts/calculator/lminus.aspx)" ;return}
            else  {elem.style.background ="#020702"}
         
        
    }
    ////////////////////////
    ////////////////////////
    
    var startmas=[]
    var isdot=false
    
   
    var bannerYes = false;
    function eventAuto (arg) {
    lighter(arg)
        
        bannerYes=!bannerYes
        
        if (bannerYes) { banner.style.backgroundImage="url(/scripts/calculator/aoda.aspx)"}
       else {
            banner.style.backgroundImage="url(/scripts/calculator/aonet.aspx)"
           
       }
    
    }
    
    
    function smenaFona (arg){
        lighter(arg)
        telo.style.backgroundImage="url(/scripts/calculator/fon4.aspx)"
    }
    
    function lighter(ob){
        var avto=ob
        var t1=setTimeout (function(t){t.style.border="thin solid white"},100,avto)
    
              var t4=setTimeout (function(t){t.style.border="thin solid #55ff55"},200,avto)
              
                   var t6=setTimeout (function(t){t.style.border="thin solid #000000"},1100,avto)
           var t6=setTimeout (function(t){t.style.border="none"},6100,avto)
    }
    
    function fdel (arg){
        startmas=[];
        isdot=false;
        lighter(arg)
        renewingMasRootStart (startmas)
        var empt=[]
        renewingMasAnswerEnd (empt)
        
        
       
    }
    
    function feedstartmas (x){
         if ( (startmas.length==0)&&(x==".") ){return}
        if ((isdot==true) && (x==".")  ){return}
        if (x=="."){isdot=true}
        if ( (startmas.length>0)&&(x=="-") ){return}
        startmas.push(x)
            lighter(arguments[1])
        renewingMasRootStart (startmas)
      
    }
//////////////////////////////////////////////////
////////////////////////
//////////
////
////
 var numb
     
 var pow =5;
      var otricatelnie=false;  
    var answer;
    
    /// zapusk
     function fstart (th){
        lighter(th);
         numb=  startmas.join("");
         numb = starter(numb)
         
          // поставил отметку отриц\полож. отриц перевел в модуль
    //проверил на ноль и ошибки строки.
    if (String(numb)=="undefined"){throw new Error("The error . четная степень. отрицательное подкоренное выражение")}
    // проблема !!!!!!!!!!! дробей
         
         
         
    
    
    if (numb>=1) {   answer = (devider( numb, pow , 0 ,numb  )  )      }
    else if (numb>0)  {   
        
     
        
        answer = (devider2( numb, pow , numb ,1  )  )
      
    }
    else {alert ("Erroren   das underroot nicht (0;inf)")}
         
         
         
         
 
if (bannerYes) { answer=isCell(answer, numb,pow)}   
    

         
    if (otricatelnie) {answer*=-1}
         answer=String (answer)
    alert (answer)
        renewingMasAnswerEnd (answer.split(""))
         
       otricatelnie=false;
         
    }
    
     
    //////////
function powplus(arg){
    lighter(arg)
    if (pow>=9){
        return}
    pow++
       idiota (stepen,pow)
}
    
    function powminus(arg) {
         lighter(arg)
    if (pow<=2){
        return}
    pow--;
       idiota (stepen,pow)
}
    
    
    //MAIN FUNK 2   for drobey
        function devider2 (root, pow, start, finish) {
        
         
        
        
    
   var  medium=start+(finish-start)/2;    
    console.log("med"+medium)
 
    
        
        
        
       if (  Equiv (  step (medium,pow) , root      ) )
       {
        
          return medium
    
       
       }
        
        
        if (
            step (medium,pow) >root ) {   
            
           console.log ("seaching4")
    console.log (medium)
            
           return devider2 (root,pow,start,medium)}
        else {
            console.log ("seaching5")
    console.log (medium)
            
            return devider2 (root,pow,medium,finish)}
        
    }
    
    
    
    
    
    //////////////
 
    function devider (root, pow, start, finish) {
        
         
        
        
        var range = finish-start
   var  medium=start+(finish-start)/2;    
    

        
        
        
       if (  Equiv (  step (medium,pow) , root      ) )
       {
            
          return medium
       
            
       
       }
        
       
        
        
        if (
             
            step (medium,pow) >root ) {   
            
           
            
           return devider (root,pow,start,medium)}
        else { return devider (root,pow,medium,finish)}
        
    }
    
    
    /////////////
    function isCell (x, root,pow){
        var temp;
         var a=[]
        var ind;
        var stroka;
        if  ( step ( Math.round(x),pow) ==root ) {return Math.round(x)}
    
        
         else {
     
             temp=String(x)
           
            a=temp.split(".")
                
            if (a[1].indexOf("999") >0) {
                
            stroka=a[1].substr (0, a[1].indexOf("999")  )
               
                ind = (stroka.length)
                a[1]=stroka
                temp=a.join(".")
                temp = +temp;
                temp=temp+ 1/ (step (10, ind))
                temp = temp.toFixed(ind)
                return +temp
            }
             
             
               if (a[1].indexOf("0000",7) >0) {
                
            stroka=a[1].substr (0, a[1].indexOf("0000",7)  )
               
                ind = (stroka.length)
                a[1]=stroka
                temp=a.join(".")
                temp = +temp;
                temp = temp.toFixed(ind)
                return +temp
            }
             
             
             
             
                
        }      
        
        return x
        
    }
    ////////////
    
    ////MAIN FUNK
    function Equiv(a,b ){
        
        a=a.toFixed(15);
        b=b.toFixed(15);
        
       
        if ((Math.abs(a-b))<0.000000001) {
         
            return true}
        else {
           
            return false}
    }
    
    
    /// MAIN FUNK
    function step (base,pow){
        var ender = base*base
        for (var i=2; i<pow; i++)
            {ender=ender*base}
        return ender
    }
    
    
    
    
    function starter (arg){
       if (isZero(arg)) {return 0}
        if (isError(arg)) {alert("введенное число NOT NUMBER. Пиздец");return}
        if ((arg<0)&&(pow%2==0)  ) {alert("введенное число отрицательно, а степень четная. Пиздец. Ответ нет_такого_числа");return}
        return toPositive (   strToNum(arg)   )
        
    }
    
    function isZero (arg){if (arg==0){return true}}
    function isError (arg){
          arg = +arg
        if (String(arg)=="NaN") {return true}
         
        else return false
    }
    function strToNum (arg){return +(+arg)}
    function toPositive (arg){if (arg<0){
        otricatelnie=true;
        return Math.abs(arg)}
                             else return arg
                             }
    
 
    
</script>