var npt = false;

   var c1 = document.getElementById('d1').style;
    var c2 = document.getElementById('d2').style;

    var w0  = 855;
    var w = 855;
    var l0 = 28;
    var dl = 12;

    var sk = "klikni in povleci za povečavo območja na klancu";
    var sd = "klikni in povleci, za natančnejšo določitev območja povečave";

    var mx = null;
    var my = null;

    var x0 = null;
    var x1 = null;
    var drag = null;
    var moved = true;
    var dr = null;

    //ob dvigu gumba

    function mUp (e) {
        mPos (e);
        var temp = x0;
        x0 = Math.min (x0, x1);
        x1 = Math.max (temp, x1);

        if (moved == false) {
            moved = true;
            if (drag === undefined) drag = null;
        }

        if (drag === undefined) drag = false;
        drag = (drag == null) ? null : false;

        if (drag == false) {
            document.getElementById('klanec').style.cursor = ((x1-x0)*w*(dolzina)/w0/w0 <= 200) ? "move" : "pointer";
            sk = ((x1-x0)*w*(dolzina)/w0/w0 <= 200) ? "NAPAKA: območje je manjše od najmanjše možne razdalje" : "klikni tu za povečavo izbranega območja (Enter)";
        } else {
            document.getElementById('klanec').style.cursor = "default";
            sk = "klikni in povleci za povečavo območja na klancu";
        }
        sd = "klikni in povleci, za natančnejšo določitev območja povečave";

    }

    // ob premiku misi

    function mMove(e) {
        mPos (e);

        if (moved == false) {
            movePlace (e, dr);
            moved = true;
        }
        if (drag == c1) {
            if (mx < x0) {
                if (mx>=0) {
                    c1.left = l0+"px";
                    c1.width = mx+dl+"px";
                    x1 = mx;
                } else {
                    c1.left = l0+"px";
                    c1.width = dl+"px";
                    x1 = 0;
                    if (mx<-10)  mUp (e);
                }
                if (c2.width != w0-x0+32+dl+"px" && drag == c1) {
                    c2.left = x0+l0+dl+"px";
                    c2.width = w0-x0+32+dl+"px";
                }
            } else {
                drag = c2;
            }
        } else if (drag == c2) {
            if (mx > x0) {
                if (mx<=w0) {
                    c2.left = mx+l0+dl+"px";
                    c2.width = w0-mx+32+dl+"px";
                    x1 = mx;
                } else {
                    c2.left = w0+28+dl+"px";
                    c2.width = 32+dl+"px";
                    x1 = w0;
                    if (mx>=w0+40) mUp (e);
                }
                if (c1.width != x0+dl+"px" && drag == c2) {
                    c1.left = l0+"px";
                    c1.width = x0+dl+"px";
                }
            } else {
                drag = c1;
            }
        }

        if ((drag == c1 || drag == c2) && c1.backgroundImage != ((Math.abs(x1-x0)*w*(dolzina)/w0/w0 >= 200) ? "url('img/t.gif')" : "url('img/t_o.gif')")) {
            c1.backgroundImage = c2.backgroundImage = (Math.abs(x1-x0)*w*(dolzina)/w0/w0 >= 200) ? "url('img/t.gif')" : "url('img/t_o.gif')";
        }
    }

    // zapise pozicijo misi

    function mPos(e) {

        var posx = 0;
        var posy = 0;
        var ee = (!e) ? window.event : e;
        if (ee.pageX || ee.pageY)
        {
            posx = ee.pageX;
            posy = ee.pageY;
        }
        else if (ee.clientX || ee.clientY) {
            posx = ee.clientX + document.body.scrollLeft;
            posy = ee.clientY + document.body.scrollTop;
        }

        mx = posx-l0-dl;
        my = posy;
    }

    // pripravi na postavitev

    function place (e, drg) {

        if (drg=="im" && document.getElementById('klanec').style.cursor == "pointer") {
            clearDrag ();
            loadKlanec (id, x0, x1, res);

            menuPrint ("povleci in klikni na izbrano območje za povečavo");
////                c1.backgroundImage = c2.backgroundImage = "url('img/t.gif')";
            sk = sd = "povleci in klikni na izbrano območje za povečavo";

        } else {
            if (my > 39 && my < 452+39) {
                if (drag==null) document.getElementById('klanec').style.cursor = "e-resize";
                moved = false;
                dr = drg;
            }
        }
//                  menuPrint ("povleci in klikni na izbrano območje za povečavo");
//              c1.backgroundImage = c2.backgroundImage = "url('img/t.gif')";
            sk = sd = "povleci in klikni na izbrano območje za povečavo";

    }

    // postavi ob premiku

    function movePlace (e, drg) {
        if (drg == "im" && drag != false) {
            if (mx<0) {
                c1.left = l0+"px";
                c1.width = dl+"px";
                c2.left = x0+l0+dl+"px";
                c2.width = w0-x0+26+dl+"px";
                x1 = x0 = 0;
            } else if (mx>w0) {
                c1.left = l0+"px";
                c1.width = x0+dl+"px";
                c2.left = w0+28+dl+"px";
                c2.width = 26+dl+"px";
                x1 = x0 = w0;
            } else {
                c1.left = l0+"px";
                c1.width = mx+"px";

                c2.left = mx+l0+"px";
                c2.width = w0-mx+26+dl+"px";
                x1 = x0 = mx;
            }
            c1.visibility = c2.visibility = "visible";
            menuEn ('c', true);
            drag = c1;
        }

        if (drag == false) {
            x0 = (drg.style==c1) ? x1 : x0;
            drag = drg.style;
        }
        document.getElementById('klanec').style.cursor = "e-resize";

    }

    function clearDrag () {

        document.getElementById('klanec').style.cursor = "default"
        drag = null;
        c1.visibility = c2.visibility = "hidden";
        menuEn ('c', false);
        sk = "klikni in povleci za povečavo območja na klancu";
    }

    function keyClear (evt) {
        evt = (evt) ? evt : event;
      var kkey = (evt.charCode) ? evt.charCode : ((evt.keyCode) ? evt.keyCode : ((evt.which) ? evt.which : 0));
         if (evt.ctrlKey) {
            if (kkey == 37)   moveKlanec(-0.75);
            else if (kkey == 39) moveKlanec(0.75);
            else if (kkey == 36) {  res=res0; zoomKlanec(0); }
            else if (kkey == 38) zoomKlanec(1);
            else if (kkey == 40) zoomKlanec(-1);
            else if (kkey == 90) loadHistory(-1);
            else if (kkey == 89) loadHistory(1);
            else if (kkey == 188)   changeRes(1);
            else if (kkey == 190)   changeRes(-1);
            else if (kkey == 45) toggle();
      }
      if (kkey == 27 && npt == false)  {
         clearDrag ();
      } else if (kkey == 13 && document.getElementById('klanec').style.cursor == "pointer") {
         clearDrag ();
         loadKlanec (id, x0, x1, res);
         sk = sd = "povleci in klikni na izbrano območje za povečavo";
      }
    }