Время изготовления : в идеале можно за 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">
</div>
<div class="butt" id="bauto" onclick="eventAuto(this) ">
</div>
<div id="ao" onclick="eventAuto(this) ">
</div>
<div class="butt" id="b1" onclick="feedstartmas(1,this)">
</div>
<div class="butt" id="b2" onclick="feedstartmas(2,this)">
</div>
<div class="butt" id="b3" onclick="feedstartmas(3,this)">
</div>
<div class="butt" id="b4" onclick="feedstartmas(4,this)">
</div>
<div class="butt" id="b5" onclick="feedstartmas(5,this)">
</div>
<div class="butt" id="b6" onclick="feedstartmas(6,this)">
</div>
<div class="butt" id="b7" onclick="feedstartmas(7,this)">
</div>
<div class="butt" id="b8" onclick="feedstartmas(8,this)">
</div>
<div class="butt" id="b9" onclick="feedstartmas(9,this)">
</div>
<div class="butt" id="bminus" onclick="feedstartmas('-',this)">
</div>
<div class="butt" id="bdot" onclick="feedstartmas('.',this)">
</div>
<div class="butt" id="b0" onclick="feedstartmas(0,this)">
</div>
<div class="butt" id="bdel" onclick="fdel(this)">
</div>
<div class="butt" id="bok" onclick="fstart(this)">
</div>
<div class="butt" id="brootminus" onclick="powminus(this)">
</div>
<div class="butt" id="brootplus" onclick="powplus(this)">
</div>
<div class="butt" id="bempty" onclick="smenaFona(this)">
</div>
<div class="rt" id="rt1">
</div>
<div class="rt" id="rt2">
</div>
<div class="rt" id="rt3">
</div>
<div class="rt" id="rt4">
</div>
<div class="rt" id="rt5">
</div>
<div class="rt" id="rt6">
</div>
<div class="rt" id="rt7">
</div>
<div class="rt" id="rt8">
</div>
<div class="rt" id="rt9">
</div>
<div class="rt" id="rt10">
</div>
<div class="rt" id="rt11">
</div>
<div class="rt" id="rt12">
</div>
<div class="rt" id="rt13">
</div>
<div class="rt" id="rt14">
</div>
<div class="rt" id="rt15">
</div>
<div class="ans" id="ans1">
</div>
<div class="ans" id="ans2">
</div>
<div class="ans" id="ans3">
</div>
<div class="ans" id="ans4">
</div>
<div class="ans" id="ans5">
</div>
<div class="ans" id="ans6">
</div>
<div class="ans" id="ans7">
</div>
<div class="ans" id="ans8">
</div>
<div class="ans" id="ans9">
</div>
<div class="ans" id="ans10">
</div>
<div class="ans" id="ans11">
</div>
<div class="ans" id="ans12">
</div>
<div class="ans" id="ans13">
</div>
<div class="ans" id="ans14">
</div>
<div class="ans" id="ans15">
</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>