Advertisement
terorama

JavaScript diff

Sep 11th, 2012
105
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var num_wins=0;
  2. var zz;
  3. //-----------------------------------------
  4. function init()
  5. {
  6.   zz=document.createElement('div');
  7.   zz.className='floatblock';
  8.   zz.style.background='#ffffe0';
  9.   zz.style.left='10px';
  10.   zz.style.top='90px';
  11.   document.body.appendChild(zz);
  12.  
  13.   };
  14.  
  15.  
  16.     function ShowMe (el,startX, startY, startOpacity, x,y) {
  17.          //-----------------------------
  18.          function setAll () {
  19.    
  20.             el.style.left=Math.floor(el.x)+'px';
  21.             el.style.top=Math.floor(el.y)+'px';
  22.            
  23.             if (el.opacityVal) {         
  24.                el.style.opacity=el.opacityVal;
  25.                el.style.filter="Alpha(Opacity="+(el.opacityVal*100)+")";
  26.              }
  27.          
  28.           };
  29.          //-----------------------------
  30.           function animOut() {
  31.    
  32.             var x1=el.x;
  33.             //alert(x1);
  34.             //alert(x1);
  35.             var y1=el.y;
  36.             var x=el.xtarget;
  37.             var y=el.ytarget;
  38.             if ((Math.abs(x-x1)>4) || (Math.abs(y-y1)>4))
  39.                {
  40.                
  41.                 el.x+=(x-x1)/100;
  42.                 el.y+=(y-y1)/100;
  43.                 if (el.opacityVal<1)
  44.                    el.opacityVal+=0.01;
  45.                 //endif  
  46.                 setAll();
  47.          
  48.                setTimeout(arguments.callee,1);
  49.          }}
  50.          
  51.          //-----------------------------
  52.          if (el.className=="floatblock")
  53.             {  
  54.             zz.innerHTML+=el.innerHTML+' ';
  55.             el.x=startX;
  56.             el.y=startY;
  57.             el.opacityVal=startOpacity;
  58.             el.xtarget=x;
  59.             el.ytarget=y;
  60.             setAll();
  61.             animOut();
  62.          }
  63.    }
  64.  
  65.  
  66. //-----------------------------------------
  67. function addblock(x,y,inText)
  68. {
  69.    b=document.body;
  70.    
  71.     u=document.getElementsByTagName('div');
  72.     for (i=0;i<u.length;i++)
  73.        {
  74.        //alert (u[i].firstChild.nodeValue);
  75.        if (u[i].className=='floatblock')
  76.        {
  77.           //alert(u[i].innerHTML);
  78.           r=u[i];
  79.           if (r.moveOut)
  80.              r.moveOut();
  81.           //return;
  82.          }
  83.          
  84.        }
  85.    
  86.    var z=document.createElement('div');
  87.    z.className="floatblock";
  88.    //z.onclick=function(){this.showMe(300,100)};
  89.  
  90.    z.innerHTML=inText;
  91.    
  92.    z.moveOut=function() {
  93.       o=this;
  94.       setTimeout(
  95.          function f() {ShowMe(o, o.x, o.y, num_wins*20, 700+num_wins*20,6)},40)}
  96.    
  97.    ShowMe(z, 50,50, 0, x+num_wins*20,y);
  98.    
  99.    b.appendChild(z);
  100.    
  101.    //alert(z);
  102.    //z.showMe(300,100);
  103.    
  104.    return(z);
  105.    
  106.  
  107. }
  108. //---------------------------------------
  109.    function confirmation(info) {
  110.       x=confirm(info+' Продолжить?');
  111.       if (!x)
  112.          return;
  113.          
  114.        y=prompt('Укажите Ваше имя','');
  115.        
  116.        if (y.trim().length!=0)
  117.           alert('Здравствуйте, '+y);
  118.      
  119.    }
  120.    //---------------------------------------
  121.    function navinfo()
  122.    {
  123.       num_wins++;
  124.       zz.innerHTML='->';
  125.       z=addblock(300,100,num_wins);
  126.    }
  127.  
  128.  
  129. ----------------------------------------------------------------------------------------------
  130. ----------------------------------------------------------------------------------------------
  131.  
  132.  
  133.    function init() {
  134.    //---------------------------------------------
  135.  
  136.        
  137.    HTMLDivElement.prototype.getu=function(s) {
  138.                      var y=this.style[s];
  139.                      y1=parseInt(y,y.slice(y,1,y.indexOf('px')-1));
  140.                      return y1;
  141.                    }
  142.    
  143.    HTMLDivElement.prototype.setu=function(s,x) {
  144.    
  145.                    for (var i=0;i<s.length;i++) {
  146.                        this.style[s[i]]=x[i]+'px';
  147.                        }
  148.                  } 
  149.                  
  150.     HTMLDivElement.prototype.wr=function(s) {
  151.                                    this.innerHTML+='<p>'+s+'</p>';
  152.                                   }
  153.                  
  154.    Document.prototype.appSquare=function () {
  155.          zblock=this.createElement('DIV');
  156.          zblock.className='menublock';
  157.          this.body.appendChild(zblock);
  158.          
  159.          return (zblock);
  160.    }
  161.    
  162.    
  163.      
  164.    //---------------------------------------------
  165.      
  166.    m= document.appSquare();
  167.    m.setu(['left','top','width','height'],
  168.    [100,100,300,300]);
  169.    
  170.    texts=["Таблица символов","Экранирование"];
  171.    funcs=[
  172.    //-----------------------------
  173.    function() {
  174.    
  175.       popup=document.appSquare();
  176.       popup.setu(['left','top','width','height'],
  177.    [10,10,1200,600]);
  178.      
  179.       popup.onclick= function () {this.parentNode.removeChild(this)};
  180.       popup.style["font-size"]="small";
  181.      
  182.       var tmp='';
  183.       for (var i=0;i<=10000;i++) {
  184.          switch (i<10) {
  185.             case true:
  186.                tmp3='0'+i;
  187.                break;
  188.                
  189.             case false:
  190.                tmp3=i;
  191.                break;
  192.          }
  193.      
  194.          tmp+=''+tmp3+' = <b>&#'+tmp3+';</b> <br> ';
  195.       }
  196.       popup.innerHTML=tmp;
  197.    
  198.    },
  199.    //-----------------------------
  200.    function() {
  201.    document.write('&#60;script&#62; alert(\'test\'); &#60;/script&#62;');
  202.    }
  203.    
  204.    ]
  205.    
  206.    ul=document.createElement('UL');
  207.    m.appendChild(ul);
  208.    for (var i=0; i<document.links.length;i++) {
  209.    
  210.       if (i>=texts.length) break;
  211.      
  212.       z=document.createTextNode(texts[i]);
  213.       document.links[i].appendChild(z);
  214.       document.links[i].onclick=funcs[i];
  215.      
  216.       li=document.createElement('LI');
  217.       li.appendChild(document.links[i]);
  218.      
  219.       ul.appendChild(li);
  220.    }
  221.      
  222.    //-------------------------------------------
  223.  
  224.    t= document.appSquare();
  225.    t.setu(['left','top','width','height'],
  226.    [500,50,400,600]);
  227.    
  228.    t.wr('Тесты');
  229.    
  230.    //---------------------------------------------
  231.    
  232.    var s2=' \u2014\x20';
  233.    var s = 'Это \u2014\u0020прото\x20пример';
  234.    t.wr(s2.concat(' - ',s,' - ',s.toUpperCase(),'-',s.toLowerCase()));
  235.    t.wr(s.replace('\u2014','\u4010'));
  236.  
  237.    t.wr(Math.pow(2,10));
  238.    
  239.    //---------------------------------------------
  240.    s='we use all means to reach our goals';
  241.    t.wr('----------');
  242.    t.wr(s);
  243.    var s1='';
  244.    for (var i=0; i<s.length;i++) {
  245.    s1+=s.charAt(i)+'-'+s.charCodeAt(i)+'; ';
  246.    }
  247.    t.wr(s1);
  248.    
  249.    t.wr('----------');
  250.    arr=s.split(' ');
  251.    t.wr(arr);
  252.    t.wr('<b>arr.slice(2,4)</b> '+arr.slice(2,4).join(' '));
  253.    t.wr('<b>arr.slice(-3,-1)</b> ' +arr.slice(-3,-1).join(' '));
  254.    t.wr('<b>arr.splice(2,2,\'different\',\'tools\')</b> '+ arr.splice(2,2,'different','tools').join(' '));
  255.    t.wr(arr.join(' '));
  256.    arr.sort(function(a,b) {return (a.length==b.length)? ((a<b)?-1:1) :(a.length-b.length);});
  257.    
  258.    t.wr('<b>sorted</b> '+arr.join(' ')); //arr.push arr.pop arr.unshift(12,3) arr.shift
  259.    
  260.    //---------------------------------------------
  261.    t.wr('-----------');
  262.    var s3 = 'Мы знаем, что монохромный цвет - это градации серого'; //исходная строка
  263.    var text = 'хром'; //известная часть слова
  264.    var word;
  265.  
  266.     /*
  267.     Найти слово, содержащее строку «хром» и записать в переменную word
  268.     indexOf(), lastIndexOf(), slice()
  269.      */
  270.     word = s3.slice(s3.lastIndexOf(' ', s3.indexOf("хром"))+1,s3.indexOf(' ',s3.indexOf("хром")));
  271.     t.wr(word);
  272.  
  273.    //---------------------------------------------
  274.    
  275.    x=(s=='inf')? 4: 6;  
  276.    switch (s) {
  277.       case 'inf':
  278.          alert('test1');
  279.          break;
  280.       case 'inf5':
  281.          alert('test5');
  282.          break;
  283.       default:  
  284.          s='inf8';   
  285.    }
  286.    
  287.    
  288.    //-----------------------------------
  289.    
  290.    }
  291. ----------------------------------------------------------------------------------------------
  292. ----------------------------------------------------------------------------------------------
  293.  
  294.  
  295. //------------------------------functions to apply to div objects
  296.    getu=function(s) {
  297.       var y=this.style[s];
  298.       y1=parseInt(y.substring(0,y.indexOf('px')));
  299.       return y1;
  300.    }
  301.    
  302.    setu=function(s,x) {
  303.       for (var i=0;i<s.length;i++) {
  304.          this.style[s[i]]=x[i]+'px';
  305.       }
  306.    }
  307.    
  308.    wr=function(s) {
  309.       this.innerHTML.concat('<p>',s,'</p>');
  310.    }
  311.    
  312.    //--------------------------------------------------------
  313.    document.appDiv = function (className) {
  314.    
  315.       zblock=this.createElement('DIV');
  316.       zblock.className=className;
  317.       this.body.appendChild(zblock);
  318.      
  319.       return(zblock);
  320.      
  321.    }
  322.    
  323.    
  324.    //-------------------------------
  325.    addInput=function (type,name,value,nrow,ncol) {
  326.    
  327.                        var inp=document.createElement('INPUT');
  328.                        inp.type=type;
  329.                        inp.name=name;
  330.                        inp.value=value;
  331.                        inp.id=name;
  332.                        
  333.                        var inTabs=this.getElementsByTagName('TABLE');
  334.                        var inTab=inTabs[0];
  335.                        //alert(inTab);
  336.                        var targetCell=inTab.rows[nrow].cells[ncol];
  337.                        
  338.                        targetCell.appendChild(inp);                  
  339.                   }
  340.                  
  341.    //-------------------------------                 
  342.     function filltable () {
  343.        function addSection(section,num) {
  344.           //alert(section);
  345.           var zrow, td;
  346.           for (var i=0;i<num; i++) {
  347.              zrow=section.insertRow(i);
  348.              
  349.              for (var j=0;j<num;j++) {
  350.                 td=zrow.insertCell(j);
  351.              }
  352.           }
  353.        }
  354.        //alert(this);
  355.        addSection ((this.tBodies[0] && this.tBodies[this.tBodies.length-1]) || this, 3);
  356.     }  
  357. //-----------------------------------------------------------
  358.  
  359. function move () {
  360.    //alert('test');
  361.    pic=document.getElementById('pic88');
  362.    switch (this.name) {
  363.       case 'bup':
  364.          pic.y--;
  365.          break;
  366.       case 'bdown':
  367.          pic.y++;
  368.          break;
  369.       case 'bleft':
  370.          pic.x--;
  371.          break;
  372.       case 'bright':
  373.          pic.x++;            
  374.    }
  375.    pic.style["background-position"]=pic.x+'px '+pic.y+'px';
  376.    var f=document.forms.yandsearch;
  377.    
  378.    if (!f)
  379.       f=document.forms[0];
  380.      
  381.    f.text3.value=pic.style["background-position"];
  382.    
  383. }
  384.  
  385. window.onload= function()
  386. {
  387.  
  388.   picdiv=document.appDiv("menublock test");
  389.  
  390.   setu.apply(picdiv,
  391.   [['left','top','width','height'],
  392.    [100,50,400,400]]);
  393.    
  394.   picdiv.id="pic88";
  395.   picdiv.x=0;
  396.   picdiv.y=0;
  397.   //picdiv.appendClass('test');
  398.  
  399.   frmdiv=document.appDiv("menublock");
  400.  
  401.  
  402.      setu.call(frmdiv, ['left','top','width','height'],
  403.    [50,50,300,300]);
  404.    
  405.    //------------------------set frmdiv at right of picdiv
  406.    
  407.    var leftOfs=0;
  408.    var t_el=picdiv;
  409.    
  410.    while (t_el) {
  411.       leftOfs+=t_el.offsetLeft;
  412.       t_el=t_el.offsetParent;
  413.      
  414.    }
  415.    leftOfs+=picdiv.offsetWidth+5;
  416.    setu.call(frmdiv,['left'],[leftOfs]);
  417.    
  418.    //---------------------------------------------
  419.    frmdiv.id="frm88";
  420.  
  421.    frmnames=["yandsearch","controlpanel"];
  422.    
  423.    for (i=0;i<frmnames.length;i++) {
  424.        var frm=document.createElement('FORM');
  425.        frm.name=frmnames[i];
  426.        frm.id=frmnames[i];
  427.  
  428.  
  429.        
  430.        var layTab=document.createElement('TABLE');
  431.        layTab.className="formtable";
  432.        
  433.        filltable.apply(layTab);    
  434.        frm.appendChild(layTab);
  435.        
  436.        a=document.getElementById("frm88");
  437.        a.appendChild(frm);     
  438.   }
  439.  
  440.  
  441.    
  442.    //-------------------------------
  443.   var f=document.forms["yandsearch"];
  444.   if (!f)
  445.      f=document.forms[0];
  446.      
  447.   f.method="get";
  448.   f.action="http://yandex.ru/yandsearch";
  449.  
  450.   f.addInput=addInput;
  451.  
  452.   f.addInput('TEXT','text3','введите текст',1,1);
  453.   f.addInput('SUBMIT','subm','Search',2,1);
  454.  
  455.   var submf=f.subm;
  456.   if (!submf)
  457.      submf=document.getElementById('subm');
  458.      
  459.      //alert(submf);
  460.      
  461.   submf.onclick=function() {
  462.                  
  463.                   pic=document.getElementById('pic88');
  464.                   pic.style["background-position"]=this.parentNode.text3.value;
  465.                   return false;
  466.             }
  467.            
  468.   textf=f.text3;
  469.   if (!textf)
  470.      textf=f.elements[0];
  471.        
  472.  
  473.  
  474.   textf.onfocus=function() {if (this.value=='введите текст') this.value='';}
  475.   textf.onblur=function() {if (this.value=='') this.value='введите текст';}
  476.  
  477.  //-------------------------------
  478.   var f=document.forms.controlpanel;
  479.   if (!f)
  480.      f=document.forms[1];
  481.  
  482.   f.addInput=addInput;
  483.  
  484.   f.addInput('BUTTON','bup','\u25b2',0,1);
  485.   f.addInput('BUTTON','bdown','\u25bc',2,1);
  486.   f.addInput('BUTTON','bleft','\u25c0',1,0);
  487.   f.addInput('BUTTON','bright','\u25b6',1,2);
  488.  
  489.   f.bup.onclick=move;
  490.   f.bdown.onclick=move;
  491.   f.bleft.onclick=move;
  492.   f.bright.onclick=move;
  493.  
  494. }
  495. ----------------------------------------------------------------------------------------------
  496. ----------------------------------------------------------------------------------------------
  497.  
  498.  
  499. function intro() {
  500.    var s='';
  501.    for (var i=0;i<20; i++) {
  502.       s+='<br />';
  503.    }
  504.    
  505.    els=document.getElementById("intext");
  506.    //els.innerHTML=s;
  507.  
  508.    el=document.createElement('DIV');
  509.    el.className='posterBlock';
  510.    el.id='poster88';
  511.    el.style.left='800px';
  512.    el.style.top='50px';
  513.    
  514.    el.style["padding-right"]='20px';
  515.    el.style["padding-top"]='20px';
  516.    
  517.    //var s=el.style["left"];
  518.    //s=s.slice(0,s.indexOf('px'));
  519.   // word = s.slice(s.lastIndexOf(' ', s.indexOf("хром"))+1,s.indexOf(' ',s.indexOf("хром")));
  520.    //alert(s);
  521.    
  522.    document.body.appendChild(el);  
  523.    
  524.    infos=['window','document','location','history','navigator',
  525.        'screen','frames','status','defaultStatus'];
  526.    
  527.    //---------------------------------------------------------
  528.    function getInfel(p) {
  529.       el=document.getElementById('infoel88');
  530.       if (el==undefined) {
  531.          
  532.          el=document.createElement('DIV');
  533.          el.id='infoel88';
  534.          //----------------------------------
  535.          el.tex=function(intext) {
  536.          
  537.             brEl=document.createElement('BR');
  538.             this.appendChild(brEl);
  539.             this.insertBefore(document.createTextNode(intext),brEl);
  540.          }
  541.          //------------------------------------
  542.          p.appendChild(el);
  543.          return(el);
  544.       }
  545.       else
  546.          return el;
  547.    }
  548.    //---------------------------------------------------------
  549.    ouinf= function (p,inf) {
  550.      
  551.       infel=getInfel(p);
  552.       infel.innerHTML='';
  553.      
  554.       infel.tex(inf);
  555.       for (var prop in eval(inf))
  556.          {
  557.          infel.tex(prop+' : '+eval(inf+'.'+prop));
  558.          }
  559.          
  560.      
  561.       return false;
  562.    }
  563.    //---------------------------------------------------------
  564.    for (var i=0;i<infos.length; i++) {
  565.       txel=document.createElement('A');
  566.       txel.href='#';
  567.       txel.info=infos[i];
  568.       txel.onclick= function () {
  569.          s=this.info;
  570.          return ouinf(this.parentNode, s)};
  571.      
  572.      
  573.       txel.appendChild(document.createTextNode(infos[i]));
  574.       el.appendChild(txel);
  575.    }
  576. }
  577. ----------------------------------------------------------------------------------------------
  578. ----------------------------------------------------------------------------------------------
  579.  
  580.  
  581.    //-------------------------------------------------
  582.    function wr(el,s) {
  583.       a=document.getElementById(el);
  584.       if (s=='cls')
  585.          a.innerHTML=''
  586.       else {
  587.          a.innerHTML+=s+'<br/>';
  588.       }
  589.    }
  590.    //-------------------------------------------------  
  591.    function showSysInfo() {
  592.       el="sysinfo";
  593.       wr(el,'cls');
  594.       //------------------------------------
  595.       wr(el,'----- Navigator Info ------');
  596.       wr(el,navigator.appCodeName);
  597.       wr(el,navigator.appName);
  598.       wr(el,navigator.appVersion);
  599.       //------------------------------------
  600.       wr(el,navigator.userAgent);
  601.       wr(el,navigator.onLine);
  602.       wr(el,navigator.cookieEnabled);
  603.       wr(el,navigator.platform);
  604.       wr(el,'JavaEnabled='+navigator.javaEnabled);
  605.       //------------------------------------
  606.       wr(el,'');
  607.       wr(el,'----- Location Info -----=');
  608.       wr(el,'protocol='+location.protocol);
  609.       wr(el,'host='+location.host);
  610.       wr(el,'hostname='+location.hostname);
  611.       wr(el,'port='+location.port);
  612.       wr(el,'pathname='+location.pathname);
  613.       wr(el,'search='+location.search);
  614.       wr(el,'hash='+location.hash);
  615.       wr(el,'href='+location.href);
  616.      
  617.       //---------------------------Location operations
  618.       wr(el, '<a href="#" onclick="location.assign(\'http://ya.ru\');return false;">'+
  619.             'location.assign(url)</a>');
  620.       wr(el,'<a href="#" onclick="location.replace(\'http://ya.ru\');return false;">'+
  621.             'location.replace(url)</a>');
  622.            
  623.       //--------------------------history operations
  624.       wr(el,'');
  625.       wr(el, '-------- History and Screen---------');
  626.       wr(el,'history.length='+history.length);
  627.       wr(el, '<a href="#" onclick="history.back();return false;">history.back()</a>');
  628.       wr(el,'screen.width x screen.height = '+screen.width+' x '+screen.height);
  629.       wr(el,'availWidth x availHeight = '+screen.availWidth+' x '+screen.availHeight);
  630.            
  631.            
  632.    }
  633.    //-------------------------------------------------
  634.    function showCreateWins() {
  635.       //-------------------------------Block position
  636.       var el=document.getElementById('createwins');
  637.       var z=document.getElementById('sysinfo');
  638.      
  639.       var xScroll=document.documentElement.scrollLeft || document.body.scrollLeft;
  640.       var yScroll=document.documentElement.scrollTop || document.body.scrollTop;
  641.      
  642.       var xWin=document.documentElement.clientLeft || document.body.clientLeft;
  643.       var yWin=document.documentElement.clientTop || document.body.clientTop;
  644.      
  645.       var z_rect=z.getBoundingClientRect();
  646.      
  647.       var  x_All = xScroll - xWin + z_rect.left + z.offsetWidth+1;
  648.  
  649.      
  650.       el.style.left=x_All+'px';
  651.      
  652.       wr('createwins','scrollLeft='+xScroll);
  653.       wr('createwins','scrollTop='+yScroll);
  654.       wr('createwins','clientLeft='+xWin);
  655.       wr('createwins','clientTop='+yWin);
  656.       wr('createwins','sysinfo.left='+z_rect.left+' : '+z.offsetLeft);
  657.       wr('createwins','sysinfo.offsetWidth='+z.offsetWidth);
  658.      
  659.       //------------------------Block content
  660.       var e = 'createwins';
  661.      
  662.    }
  663.    //-------------------------------------------------  
  664.    function init() {
  665.       showSysInfo();
  666.       showCreateWins();
  667.    }
  668.    
  669.    //-------------------------------------------------
  670.    function func_iframe() {
  671.      
  672.       wr('iframeinfo','number of frames='+frames.length);
  673.       x=frames["content"];
  674.       wr('iframeinfo','frame[\'content\']='+x);
  675.       wr('iframeinfo',x.body);
  676.       x.document.body.style.background="#cf0";
  677.       //alert(x.document.body.innerHTML);
  678.    }
  679.    
  680.    //------------------------------------------Проверка формы вызова окна  
  681.    function  checkForm() {
  682.       function sc (s, type) {
  683.          switch (type) {
  684.          //-------------------
  685.          case 1:
  686.             if (s=='')
  687.                return false
  688.            else
  689.               {
  690.               re=new RegExp(/^[1-9][0-9]{1,4}$/ig);
  691.               if (!re.test(s))
  692.                  return false
  693.               else
  694.                  return true;
  695.               }
  696.            break;
  697.          //-------------------
  698.          case 3:
  699.             if (s=='')
  700.                return false
  701.             else
  702.                return true;            
  703.          
  704.       }
  705.       }
  706.       //------------------------------
  707.       var f=document.forms["controlform"];
  708.       var isOk=true;
  709.      
  710.       for (var i=0;i<f.length;i++) {
  711.          var el=f.elements[i];
  712.          //------------------------
  713.          if (el.name)
  714.             //---------------------------------number elements
  715.             if (el.name.slice(0,1).toUpperCase()=='N') {
  716.                if (!sc(el.value,1)) {
  717.                   el.style.background="rgb(255,200,200)";
  718.                   isOk=false;
  719.                   }
  720.                 else
  721.                    el.style.background="white";
  722.             }
  723.             //----------------------------text elements
  724.             else if (el.name.slice(0,1).toUpperCase()=='T') {
  725.                if (!sc(el.value,3)) {
  726.                   el.style.background="rgb(255,250,200)";
  727.                   isOk=false;
  728.                   }
  729.                else
  730.                   el.style.background="white";
  731.                  
  732.             }
  733.            
  734.       }
  735.       //----------------------------------
  736.       if (isOk) {
  737.          var paramStr= 'width='+f.ninpwidth.value+','+
  738.          'height='+f.ninpheight.value+','+
  739.          'left='+f.ninpleft.value+','+
  740.          'top='+f.ninptop.value+','+
  741.          'location='+f.rinlocation.value+','+
  742.          'menubar='+f.rinmenubar.value+','+
  743.          'scrollbars='+f.rinscrollbars.value+','+
  744.          'toolbar='+f.rintoolbar.value+','+
  745.          'status='+f.rinstatus.value+','+
  746.          'resizable='+f.rinresizable.value;
  747.          
  748.          alert(paramStr);
  749.          popupWin= open (f.tinpurl.value, f.tinpname.value, paramStr);
  750.          
  751.          setTimeout('popupWin.close()',4000);
  752.       }
  753.      
  754.      
  755.       return false;
  756.    }
  757.  
  758. ----------------------------------------------------------------------------------------------
  759. ----------------------------------------------------------------------------------------------
  760.  
  761.  
  762.      var servers = Array('PHP1. Основы серверного','PHP2. Работа с MySQL', 'PHP3. ООП и XML');
  763.       var clients = Array('Javascript1. Основы','Javascript2. Чуть большее.');
  764.    
  765.       function showNames(v) {
  766.          var names=document.getElementById("names");
  767.          var arr=eval(v);
  768.          
  769.          while (names.length>0)
  770.              names.remove(0);
  771.              
  772.          for (var i=0; i<arr.length; i++) {
  773.             var o= new Option(arr[i],i,false,false);
  774.             try {
  775.                names.add(o,null);
  776.             } catch(e) {
  777.                names.add(o);
  778.             }
  779.          }
  780.          
  781.      
  782.       }
  783.  
  784.  
  785.   function addYear(e, flag) {
  786.      
  787.          var select=e.form.yearzz;
  788.          
  789.          var ff = (flag) ? select.length-1:0;
  790.          var posit = (flag) ? null: select.options[0];
  791.          var bf = (flag) ? 1: -1;
  792.          
  793.          var year= parseInt(select.options[ff].value)+bf;
  794.          
  795.          var o = new Option(year,year, false, true);
  796.          
  797.          try {
  798.             select.add(o,posit);}
  799.          catch (e) {
  800.             if (flag)
  801.                select.add(o);
  802.             else
  803.                select.add(o,0);
  804.          }
  805.          
  806.       }
  807.  
  808. ----------------------------------------------------------------------------------------------
  809. ----------------------------------------------------------------------------------------------
  810.    //-----------------------------------------------
  811.    var Helper= {
  812.         words:['treuber','zonner','annus','crane','et','us','alarm','between','then','you','found','round',
  813.         'like','any','other','flower','music','on','great','intro','step','trek','listening','of','hot','jar'],
  814.        
  815.         fillin: function(num) {
  816.            var st='';
  817.            for (var i=0;i<num; i++) {
  818.               st+=this.words[Math.floor(Math.random()*25)]+' ';
  819.            }
  820.            return st;
  821.         }
  822.  
  823.    }
  824.    //-----------------------------------------------
  825.    function rr(section,rowindex,cellindex,opa) {
  826.       opa-=.006;
  827.       //alert(rowindex);
  828.       for (var m=0; m<section.rows.length; m++) {    
  829.      
  830.          if (m==rowindex) {
  831.             section.rows[m].cells[cellindex].style.opacity=opa;
  832.             section.rows[m].cells[cellindex].style.filter="Alpha(opacity="+Math.floor(opa*100)+")";
  833.          
  834.             if (opa<=0.01) {
  835.                //alert('test');
  836.                section.rows[m].deleteCell[cellindex];
  837.             }
  838.          }
  839.                  
  840.       }
  841.      
  842.       if (opa>.01)
  843.          setTimeout(function f() { rr(section,rowindex,cellindex,opa)},1);
  844.      
  845.          
  846.      
  847.    }
  848.    //-----------------------------------------------
  849.    function addSection(tab, section, num) {
  850.       var row, td;
  851.       for (var i=0; i<num; i++) {
  852.          row=section.insertRow(i);
  853.          
  854.          for (var j=0; j<3; j++) {
  855.             td=row.insertCell(j);
  856.             td.innerHTML=j;
  857.             td.sect=section;
  858.        
  859.          }
  860.          
  861.       }
  862.      
  863.    }
  864.    //-----------------------------------------------
  865.    function filltab() {
  866.  
  867.       addSection(this,this.tBodies[0] && this.tBodies[this.tBodies.length-1] || this, 5);
  868.       addSection(this,this.createTHead(),2);
  869.       addSection(this,this.createTFoot(),1);     
  870.      
  871.    }
  872.    //-----------------------------------------------
  873.    window.onload=function() {
  874.      
  875.       tabs=document.getElementsByTagName('TABLE');
  876.       for (var i=0;i<tabs.length;i++) {
  877.          //tab.ft=filltab;
  878.          //tab.ft();
  879.          //alert(tabs[i].className);
  880.          if (tabs[i].nodeName=='TABLE')
  881.             {
  882.                filltab.apply(tabs[i],[]);
  883.                tabs[i].onselectstart=function() {return false;};
  884.                
  885.                for (var i8=0; i8<tabs[i].rows.length; i8++) {
  886.                   var row=tabs[i].rows[i8];
  887.                   for (var j8=0; j8<row.cells.length; j8++) {
  888.                      var cel=row.cells[j8];
  889.                      cel.innerHTML=Helper.fillin(1);
  890.                      cel.i=i8;
  891.                      cel.onclick= function () {
  892.            
  893.                         //for (var m=0; m<this.x.rows.length;m++){
  894.                         //this.x.rows[m].deleteCell(this.cellIndex);
  895.                          //};
  896.                         var d=this.cellIndex;
  897.                         var zi=this.i;
  898.                         var sect=this.sect;
  899.                         setTimeout(function f() {rr(sect, zi,d,1)},1);
  900.  
  901.                         }
  902.                      
  903.                      }
  904.                   }
  905.             }
  906.       }
  907.    }
  908. ----------------------------------------------------------------------------------------------
  909. ----------------------------------------------------------------------------------------------
  910.  
  911. //-----------------------------------------
  912. appForm = function(inDiv,formName) {
  913.  
  914.    //----------------------------------
  915.    function fillTable(x) {
  916.       //---------------------
  917.       function addSection(section,num) {
  918.      
  919.          var row,td;
  920.          
  921.          for (var i=0; i<num; i++) {
  922.             row=section.insertRow(i);
  923.            
  924.             for (var j=0;j<num; j++) {
  925.                td=row.insertCell(j);
  926.             }
  927.          }
  928.          
  929.       }
  930.       //---------------------
  931.       addSection( (x.tBodies[0] && x.tBodies[x.tBodies.length-1]) || x, 3);
  932.       //addSection(x.createTHead(),2);
  933.       //addSection(x.createTFoot(),1);
  934.    }
  935.    //----------------------------------
  936.  
  937.    var frm=document.createElement('FORM');
  938.    frm.name=formName;
  939.    frm.addInput=addInput;
  940.    
  941.    var layTab=document.createElement('TABLE');
  942.    layTab.className="formtable";
  943.    //layTab.setAttribute('border',"1");
  944.    
  945.    fillTable(layTab);
  946.    
  947.    frm.appendChild(layTab);
  948.    
  949.    
  950.    inDiv.appendChild(frm);
  951.    return frm;
  952.    
  953. }
  954. //----------------------------------------------------------
  955. addInput = function (type,name,value,nRow,nCol) {
  956.    var inp=document.createElement('INPUT');
  957.    inp.type=type;
  958.    inp.name=name;
  959.    inp.value=value;
  960.    inp.id=name;
  961.    
  962.      
  963.    inTabs=this.getElementsByTagName('TABLE');
  964.    inTab=inTabs[0];
  965.    
  966.    targetCell= inTab.rows[nRow].cells[nCol];  
  967.    targetCell.appendChild(inp);
  968.    
  969.    return inp;
  970. }
  971.  
  972. //----------------------------------------
  973. function appEl(elID) {
  974.     el=document.createElement('DIV');
  975.     el.id=elID;
  976.     document.body.appendChild(el);
  977.     return el;
  978. }
  979.  
  980. //---------------------------------runClock
  981. function runClock(inDiv) {
  982.    
  983.    //---------------------------------------show clock
  984.    function animate(x) {
  985.      
  986.       //-------------------------------
  987.       function getP(num) {
  988.           pIn=x.firstChild;
  989.           var i=-1;
  990.           do
  991.             {
  992.              if (pIn.nodeName=='P') {
  993.                 i++;
  994.                 if (i<num) pIn=pIn.nextSibling;
  995.                    }
  996.              else {
  997.                 pIn=pIn.nextSibling;}
  998.           }
  999.           while ((pIn!=null) && (i<num));
  1000.  
  1001.           return pIn;
  1002.      
  1003.       }
  1004.       //-------------------------------
  1005.      
  1006.       var d = new Date();
  1007.       var d3 = new Date(2012,11,10, 14,5);
  1008.      
  1009.       var y=d.getFullYear();
  1010.       var m=d.getMonth();
  1011.       var day=d.getDay();
  1012.       var hour=d.getHours();
  1013.       var min=d.getMinutes();
  1014.       var s=d.getSeconds();
  1015.      
  1016.       getP(0).innerHTML='status';    
  1017.       getP(1).innerHTML='today: '+d.toDateString();
  1018.       getP(2).innerHTML=Math.floor((d3-d)/1000/3600/24)+' days before';
  1019.       getP(3).innerHTML=d3.toDateString();
  1020.       getP(4).innerHTML='current time:';
  1021.       getP(5).innerHTML=hour+':'+min+':'+s;
  1022.  
  1023.      
  1024.      
  1025.    }
  1026.    //----------------------------------show login status
  1027.    function showLoginStatus(x) {
  1028.       var tmpS='';
  1029.       var s8,s5,s6;
  1030.      
  1031.       i9++;
  1032.       //if (document.cookie.length>0)
  1033.          tmpS=document.cookie;
  1034.          if (tmpS=='') {
  1035.             x.innerHTML=i9+' no cookies detected';
  1036.             return false;
  1037.          }
  1038.       //else
  1039.        // tmpS='non signed in';
  1040.        
  1041.        var arr=tmpS.split(';');
  1042.        tmpS='';
  1043.        for (var i=0; i<arr.length; i++) {
  1044.           s8=arr[i];
  1045.           s5=s8.substring(0,s8.indexOf('='));
  1046.           s6=s8.substring(s8.indexOf('=')+1,s8.length);
  1047.          
  1048.           tmpS+='<span style="color:red">'+s5+'</span>: '+decodeURIComponent(s6)+'<br>';
  1049.          
  1050.        }
  1051.        
  1052.        
  1053.        
  1054.          
  1055.       x.innerHTML=i9+' '+tmpS;
  1056.    }
  1057.    //--------------------------------------------------------------
  1058.    txDiv=document.createElement('DIV');
  1059.    txDiv.id="clocktx";
  1060.    inDiv.appendChild(txDiv);
  1061.    
  1062.    for (i=0; i<10;i++) {
  1063.       elP=document.createElement('P');
  1064.       txDiv.appendChild(elP);
  1065.    }
  1066.    
  1067.    setInterval(function () {animate(txDiv);},500);
  1068.    //-----------------------
  1069.    usrDiv=document.createElement('DIV');
  1070.    usrDiv.id="userinfo";
  1071.    document.body.appendChild(usrDiv);
  1072.    var i9=0;
  1073.    setInterval(function() {showLoginStatus(usrDiv);},3000);
  1074.    
  1075.    
  1076.    
  1077. }
  1078.  
  1079. //------------------------------------constructor
  1080.  
  1081.    function ButtonEl(type,name,value,nRow,nCol) {
  1082.    
  1083.       this.type=type;
  1084.       this.name=name;
  1085.       this.value=value;
  1086.       this.nRow=nRow;
  1087.       this.nCol=nCol;
  1088.  
  1089.    }
  1090. //----------------------------------------initialization
  1091. function init() {
  1092.  
  1093.    zinf=document.getElementById('test');
  1094.    
  1095.    basket=appEl('basket');
  1096.    basket.innerHTML+='<div id="doodler"></div>';
  1097.    
  1098.    controls88=appEl('controls');
  1099.    
  1100.    controls88.innerHTML='<div id="scol" style="float:left;"></div>'+
  1101.       '<div id="fcol" style="float:left;margin-right:5px;"></div>'+      
  1102.       '<div id="tcol"></div>';
  1103.      
  1104.    clock=appEl('clock');
  1105.    //fcol=controls88.childNodes["fcol"];
  1106.    
  1107.    //---------------------------------------------
  1108.    in_fcol=document.getElementById('fcol');
  1109.    
  1110.    ctrlForm = appForm(in_fcol,'ctrlForm');
  1111.    
  1112.    ctrlForm.id="controlform";
  1113.    
  1114.    //controls88.childNodes[1].innerHTML='test';
  1115.  
  1116.    inpButtons= [
  1117.       new ButtonEl('BUTTON','bup','\u25b2',0,1),
  1118.       new ButtonEl('BUTTON','bdown','\u25bc',2,1),
  1119.       new ButtonEl('BUTTON','bleft','\u25c0',1,0),
  1120.       new ButtonEl('BUTTON','bright','\u25b6',1,2)
  1121.    ]
  1122.    
  1123.    for (var i=0; i<inpButtons.length;i++) {
  1124.    
  1125.       var tmp=inpButtons[i];
  1126.  
  1127.       if (tmp) {
  1128.          inp=ctrlForm.addInput(tmp.type,tmp.name,tmp.value,tmp.nRow,tmp.nCol);
  1129.          inp.onmousedown=function() {doodler_buttons(1, this.name);};
  1130.          inp.onmouseup=function() {doodler_buttons(2, this.name);};
  1131.          }
  1132.       }
  1133.     //---------------------------------------------  
  1134.     var in_scol=document.getElementById('scol');
  1135.    
  1136.     loginForm=appForm(in_scol,'loginForm');
  1137.    
  1138.     //-----------------------login set cookie
  1139.    
  1140.     loginForm.onsubmit= function() {
  1141.    
  1142.        var usrEl=document.getElementById('username');
  1143.        
  1144.        //alert('test');
  1145.        document.cookie='foo='+encodeURIComponent(usrEl.value)+';';
  1146.        
  1147.        return false;
  1148.     }
  1149.     //-----------------------
  1150.    
  1151.     var stdStr='Введите имя пользователя'
  1152.     logiEls = [
  1153.        new ButtonEl('TEXT','username',stdStr,1,1),
  1154.        new ButtonEl('SUBMIT','subm','Отправить',2,1),
  1155.        new ButtonEl('RESET','reset','Сброс',2,1)      
  1156.     ]
  1157.    
  1158.     for (var i=0;i<logiEls.length;i++) {
  1159.        var tmp=logiEls[i];
  1160.        if (tmp) {
  1161.           inp=loginForm.addInput(tmp.type,tmp.name,tmp.value,tmp.nRow,tmp.nCol);
  1162.        }
  1163.     }
  1164.     var usrn=loginForm.elements.username;
  1165.     if (!usrn)
  1166.        usrn=document.getElementById("username");
  1167.        
  1168.     usrn.size="30";
  1169.     usrn.onclick=function () {
  1170.    
  1171.        usrn.style["color"]="black";
  1172.        if (usrn.value==stdStr)
  1173.           usrn.value='';
  1174.     }
  1175.    
  1176.     usrn.onblur=function() {
  1177.        if (usrn.value=='') {
  1178.           usrn.style["color"]="#aaa";
  1179.           usrn.value=stdStr;
  1180.           }
  1181.     }
  1182.    
  1183.     usrn.onkeyup=function() {
  1184.        //alert(usrn.value);
  1185.        if ((usrn.value=='')||(usrn.value==stdStr)) {
  1186.           usrn.style["color"]="#aaa";
  1187.           loginForm.subm.disabled=true     
  1188.        }
  1189.        else {
  1190.           usrn.style["color"]="black";
  1191.           loginForm.subm.disabled=false;
  1192.        }
  1193.     }
  1194.     usrn.onkeyup();
  1195.    
  1196.     //---------------------------------------------  
  1197.    
  1198.     runClock(clock);   
  1199.    
  1200.     doodler_g=document.getElementById('doodler');
  1201.    
  1202.     document.onkeydown=doodler_keys;
  1203.     document.onkeyup=doodler_keys;
  1204.    
  1205.     setInterval("frame()",10); 
  1206.  
  1207. }
  1208.  
  1209. //----------------------globals
  1210.     var doodler_g
  1211.     var direct_g=1;
  1212.     var doodlerX_g=200;
  1213.     var doodlerY_g=0;
  1214.     var doodlerVX_g=0;
  1215.     var doodlerVY_g=0;
  1216.     var pressbut_g="";
  1217.    
  1218. //------------------------------------------------main cycle
  1219. function frame() {
  1220.    var d=doodler_g;
  1221.    
  1222.    switch (pressbut_g) {
  1223.       case 'bup':doodlerVY_g+=.2; direct_g=1; break;
  1224.       case 'bdown':doodlerVY_g-=.2; direct_g=1; break;
  1225.       case 'bleft':doodlerVX_g-=.2; direct_g=0; break;
  1226.       case 'bright':doodlerVX_g+=.2; direct_g=2; break;
  1227.      
  1228.       }
  1229.    
  1230.    doodlerX_g+=doodlerVX_g;
  1231.    doodlerY_g+=doodlerVY_g;
  1232.    
  1233.    if ((doodlerX_g<0) || (doodlerX_g>d.parentNode.offsetWidth-d.offsetWidth)) {
  1234.       doodlerVX_g=-doodlerVX_g;
  1235.       direct_g= direct_g==2 ? 0 :2;
  1236.       doodlerX_g+=doodlerVX_g*4;
  1237.        
  1238.    }
  1239.    
  1240.    if ((doodlerY_g<0) || (doodlerY_g>d.parentNode.offsetHeight-d.offsetHeight)) {
  1241.       doodlerVY_g=-doodlerVY_g;
  1242.       //direct_g= direct_g==2 ? 0 :2;
  1243.       doodlerY_g+=doodlerVY_g*4;
  1244.      
  1245.      
  1246.    }
  1247.    
  1248.    doodlerVX_g*=0.99;
  1249.    doodlerVY_g*=0.99;
  1250.    
  1251.    d.style.backgroundPosition="-"+62*direct_g+"px -215px";
  1252.    d.style["bottom"]=Math.floor(doodlerY_g)+"px";
  1253.    d.style["left"]=Math.floor(doodlerX_g)+"px"
  1254.  
  1255. }  
  1256. //------------------------------------------------control
  1257. function doodler_buttons(x, inname) {
  1258.    //alert(inname);
  1259.    pressbut_g= (x==1) ? inname : "";
  1260.      
  1261. }
  1262. //-------------------------------------------key controls
  1263. function doodler_keys(e) {
  1264.    //alert(e.keyCode);
  1265.    if (e.type=="keydown") {
  1266.       switch (e.keyCode) {
  1267.          case 37:
  1268.          case 65: doodler_buttons(1,'bleft'); break;
  1269.          case 39:
  1270.          case 68: doodler_buttons(1,'bright');break;
  1271.          case 38:
  1272.          case 87: doodler_buttons(1,'bup');break;
  1273.          case 40: doodler_buttons(1,'bdown');
  1274.       }}
  1275.     else
  1276.        doodler_buttons(2,"");
  1277. }
  1278.  
  1279. ----------------------------------------------------------------------------------------------
  1280. ----------------------------------------------------------------------------------------------
  1281.  
  1282.    //---------------------------- get elements collection by class
  1283.    if (document.getElementsByClassName) {
  1284.       getElementsByClass = function (classList, node) {
  1285.      
  1286.          return (node || document).getElementsByClassName(classList);
  1287.       }
  1288.    } else {
  1289.       getElementsByClass = function (classList, node) {
  1290.          var node=node||document,
  1291.          list=node.getElementsByTagName('*'),
  1292.          length=list.length,
  1293.          classArray=classList.split(/\s+/),
  1294.          classes=classArray.length,
  1295.          
  1296.          result= [],i,j
  1297.          
  1298.          for (i=0;i<length;i++) {
  1299.             for (j=0;j<classes;j++) {
  1300.                if (list[i].className.search('\\b'+classArray[j]+'\\b')!=-1) {
  1301.                   result.push(list[i]);
  1302.                   break;
  1303.                }
  1304.             }
  1305.          }
  1306.          return result;
  1307.          
  1308.       }
  1309.    }
  1310.    
  1311.  
  1312.  
  1313.    //------------------------------ Helper object
  1314.    function Helper() {
  1315.       //----------------------
  1316.       this.addEvent=function (el, ev, handler) {
  1317.          try {
  1318.             el.addEventListener(ev,handler,false);
  1319.          }
  1320.          catch (z) {
  1321.             el.attachEvent('on'+ev,handler);
  1322.          }
  1323.            
  1324.       }
  1325.       //----------------------
  1326.       this.removeEvent=function(el,ev,handler) {
  1327.          try {
  1328.             el.removeEventListener(ev,handler,false);
  1329.          }
  1330.          catch(z) {
  1331.             el.detachEvent('on'+ev,handler);
  1332.          }
  1333.       }
  1334.       //----------------------
  1335.       this.cancelEvent=function(e) {
  1336.          try {
  1337.             e.preventDefault();
  1338.          }
  1339.          catch(z) {
  1340.             e.returnValue=false;
  1341.          }
  1342.       }
  1343.       //----------------------
  1344.       this.stopEvent=function(e) {
  1345.          try {
  1346.             e.stopPropagation();
  1347.          }
  1348.          catch(z) {
  1349.             e.cancelBubble=true;
  1350.          }
  1351.       }
  1352.      
  1353.      
  1354.    }
  1355.    
  1356.    //------------------------------------------
  1357.    function DDrop(inProto) {
  1358.       this.prototype=inProto;
  1359.       this.iefunc=inProto;
  1360.       //----------------------
  1361.       var inEl=document.getElementById('inheader');
  1362.       this.bords=[
  1363.          inEl.offsetLeft,
  1364.          inEl.offsetTop,
  1365.          inEl.offsetLeft+inEl.offsetWidth,
  1366.          inEl.offsetTop+inEl.offsetHeight];
  1367.  
  1368.       this.mouseDown=function(e) {
  1369.          e=e||event;
  1370.          var target=e.target||e.srcElement;
  1371.          //alert(target);
  1372.          if (target.className=='pcard') {
  1373.            
  1374.             //---------------------start absolute mouse position
  1375.             target.x0=e.clientX;
  1376.             target.y0=e.clientY;
  1377.                        
  1378.             //---------------start element position in block
  1379.             target.cornerX=target.offsetLeft;
  1380.             target.cornerY=target.offsetTop;
  1381.            
  1382.             $('#sysinfo').html(target.id+'<br>'+
  1383.             target.x0+' - '+target.y0+'<br>'+target.cornerX+' - '+target.cornerY);
  1384.            
  1385.             document.body.currel=target;
  1386.             var dd=target.ddrop;
  1387.            
  1388.             try {target.style['z-index']='1000';}
  1389.             catch(exc) {
  1390.             alert('zindex');
  1391.             };
  1392.             try {
  1393.                dd.prototype.addEvent(target,'mousemove',dd.mouseMove);
  1394.                dd.prototype.addEvent(target,'mouseup',dd.mouseUp);
  1395.                }
  1396.             catch(exc) {
  1397.                alert(this);
  1398.                //dd.iefunc.addEvent(this,'mousemove',dd.mouseMove);
  1399.                //dd.iefunc.addEvent(this,'mouseup',dd.mouseUp);
  1400.             }
  1401.            
  1402.             document.body.onselectstart= function() {return false};
  1403.             document.body.onmouseup=function() {document.body.onselectstart=null};
  1404.            
  1405.             return false;
  1406.          }
  1407.       }
  1408.       //----------------------
  1409.       this.mouseMove=function(e) {
  1410.      
  1411.          e=e||event;
  1412.          var target=e.target||e.srcElement;
  1413.      
  1414.          var b=target.ddrop.bords;
  1415.          
  1416.          if ((e.clientX<b[0]) || (e.clientY<b[1]) ||
  1417.              (e.clientX>b[2]) || (e.clientY>b[3])) {
  1418.              target.style.left=target.cornerX+'px';
  1419.              target.style.top=target.cornerY+'px';
  1420.              target.ddrop.mouseUp(e);
  1421.              return;
  1422.              }
  1423.      
  1424.      
  1425.          $('#sysinfo').html(target.id+'<br>'+
  1426.          e.clientX+' - '+e.clientY);
  1427.                  
  1428.          target.style.left=(target.cornerX+(e.clientX-target.x0))+'px';
  1429.          target.style.top=(target.cornerY+(e.clientY-target.y0))+'px';
  1430.       }
  1431.       //----------------------
  1432.       this.mouseUp=function(e) {
  1433.          var dd=this.ddrop;
  1434.          
  1435.          if (!dd) {
  1436.            
  1437.             dd=document.body.currel.ddrop;
  1438.             //alert(dd);
  1439.             }
  1440.            
  1441.          var curobj= document.body.currel;
  1442.            
  1443.          dd.prototype.removeEvent(curobj,'mousemove',dd.mouseMove);
  1444.          dd.prototype.removeEvent(curobj,'mouseup',dd.mouseUp);
  1445.          //document.body.onselectstart=null;
  1446.          curobj.style['z-index']='0';
  1447.          
  1448.          //----------------animate card moving to target
  1449.          newFlyAnimator.flyTo(curobj);
  1450.       }
  1451.      
  1452.       //----------------------
  1453.      
  1454.       var wins=getElementsByClass('pcard');
  1455.          
  1456.       for (var i=0;i<wins.length;i++) {
  1457.          var win=wins[i];
  1458.          //win.style.left=(i*20+10)+'px';
  1459.          this.prototype.addEvent(win,"mousedown",this.mouseDown);
  1460.          win.ddrop=this;         
  1461.       }
  1462.       //----------------------
  1463.    }
  1464.    
  1465.    //--------------------- Flying Animation object
  1466.    function flyAnimator() {
  1467.    
  1468.       //----------------------------animate card moving to target
  1469.    
  1470.       this.flyAnimate = function() {
  1471.          o.ii++;
  1472.      
  1473.          o.movEl.style.left = o.srcEl.x + (o.myTarget.x - o.srcEl.x) * o.ii / o.step +'px';
  1474.          o.movEl.style.top=o.srcEl.y + (o.myTarget.y-o.srcEl.y) * o.ii / o.step + 'px';
  1475.          
  1476.          o.movEl.style.width=o.srcEl.offsetWidth +
  1477.             (o.myTarget.offsetWidth - o.srcEl.offsetWidth) * o.ii / o.step +'px';
  1478.            
  1479.          o.movEl.style.height=o.srcEl.offsetHeight +
  1480.             (o.myTarget.offsetHeight - o.srcEl.offsetHeight) * o.ii / o.step +'px';
  1481.            
  1482.          o.movEl.style.opacity=1-o.ii/o.step;
  1483.          
  1484.          o.movEl.style.filter="Alpha(Opacity="+(100*(1-o.ii/o.step))+")";
  1485.          
  1486.          if (o.ii<o.step) {
  1487.             setTimeout(arguments.callee,o.time/o.step);
  1488.          }
  1489.          else {
  1490.             o.movEl.parentNode.removeChild(o.movEl);
  1491.          }
  1492.       }
  1493.    
  1494.       //---------------------------------------------
  1495.       this.flyTo= function (el) {
  1496.          this.step=20;
  1497.          this.time=500;
  1498.          this.ii=0;
  1499.      
  1500.          var w_scroll = document.documentElement.scrollLeft || document.body.scrollLeft;
  1501.          var h_scroll = document.documentElement.scrollTop || document.body.scrollTop;
  1502.      
  1503.          var w_client = document.documentElement.clientLeft || document.body.clientLeft;
  1504.          var h_client = document.documentElement.clientTop || document.body.clientTop;
  1505.      
  1506.          var elRect=el.getBoundingClientRect();
  1507.      
  1508.          el.x= elRect.left + w_scroll - w_client;
  1509.          el.y= elRect.top + h_scroll - h_client;
  1510.      
  1511.          this.srcEl=el;  
  1512.          this.myTarget=document.getElementById('lefttarget');
  1513.      
  1514.          var targetRect=this.myTarget.getBoundingClientRect();
  1515.      
  1516.          this.myTarget.x= targetRect.left + w_scroll - w_client;
  1517.          this.myTarget.y= targetRect.top + h_scroll - h_client;
  1518.      
  1519.          this.movEl = el.cloneNode(true);
  1520.      
  1521.          this.movEl.style.left=el.x+'px';
  1522.          this.movEl.style.top=el.y+'px';
  1523.      
  1524.          document.body.appendChild(this.movEl);
  1525.          
  1526.          
  1527.          this.flyAnimate();
  1528.      
  1529.    }
  1530.    }
  1531.    
  1532.    
  1533.    
  1534.    
  1535.    
  1536.  
  1537.  
  1538. words=['treuber','zonner','annus','crane','et','us','alarm','between','then','you','found','round',
  1539.        'like','any','other','flower','music','on','great','intro','step','trek','listening','of','hot','jar'];
  1540.  
  1541.        
  1542. blocks=['leftpart','rightpart','centerheader','leftcenterpart','rightcenterpart','centerfooter','footer'];
  1543.  
  1544.    //------------------------------------------
  1545.    
  1546.  
  1547.  
  1548.    //------------------------------------------
  1549.    function fillin(num) {
  1550.       var st='';
  1551.       for (var i=0; i<num; i++) {
  1552.          var f=words[Math.round(Math.random()*25)];
  1553.          if (st!='')
  1554.             st+=' ';
  1555.            
  1556.          st+=f;
  1557.       }
  1558.       return st;
  1559.    }
  1560.    
  1561.    //---------------------------------------
  1562.    mkmenu=function() {
  1563.       parel=document.getElementById('inmenublock');
  1564.      
  1565.       inf= fillin(10);
  1566.       inf8=fillin(10);
  1567.      
  1568.       var a=['Home','',0];
  1569.       var b=['Flash lessons',inf,1];
  1570.       var c=['links',inf8,1];
  1571.      
  1572.       var menuItems=[a,b,c];
  1573.      
  1574.       for (var i=0;i<menuItems.length;i++) {
  1575.          el=document.createElement('DIV');
  1576.          el.className='slide';
  1577.          if (menuItems[i][2]!=0)
  1578.             {
  1579.             el.innerHTML='<a href="#" class="btn-slide" id="slide'+i+'">'+menuItems[i][0]+'</a>';
  1580.            
  1581.             var pane=document.createElement('DIV');
  1582.             pane.className='panel';
  1583.             pane.id='panel'+i;
  1584.             parel.appendChild(el);
  1585.            
  1586.            
  1587.             rect3=el.getBoundingClientRect();
  1588.             pane.style.left=rect3.left+'px';
  1589.             pane.style.top=rect3.bottom+'px';
  1590.            
  1591.             var txNode=document.createTextNode(menuItems[i][1]);
  1592.             pane.appendChild(txNode);
  1593.             document.body.appendChild(pane);
  1594.            
  1595.            
  1596.            
  1597.             $("#slide"+i).data('num',i);
  1598.             //-----------------------------------------
  1599.             $("#slide"+i).click(function () {
  1600.                
  1601.                i=$(this).data('num');
  1602.              
  1603.                //$(this).toggleClass("active");
  1604.                var isact=$(this).hasClass("active");
  1605.                
  1606.                $(".btn-slide").removeClass("active");
  1607.                $(".panel").fadeOut("slow");
  1608.                
  1609.                
  1610.                //$("#panel"+i).slideToggle("slow");
  1611.                
  1612.                
  1613.                if (!isact) {
  1614.                   $(this).addClass("active");
  1615.                   $("#panel"+i).slideDown("slow");
  1616.                   }
  1617.                
  1618.                return false;
  1619.                });
  1620.               //-----------------------------------------
  1621.               $("#panel"+i).click(function() {
  1622.                  $(this).slideUp("slow");
  1623.                
  1624.                  $('#slide'+this.id.slice(5,6)).removeClass('active');
  1625.               })
  1626.                
  1627.             }
  1628.          else
  1629.             {
  1630.             el.innerHTML='<a href="#" class="btn-slide" id="slide'+i+'">'+menuItems[i][0]+'</a>';
  1631.             parel.appendChild(el);
  1632.             }
  1633.            
  1634.          
  1635.      
  1636.       }
  1637.    }
  1638.    
  1639.    //---------------------------------------
  1640.    function mktree(iter,block) {
  1641.       //alert(iter);
  1642.       iter++;
  1643.       if (iter>3) {return 0};
  1644.          
  1645.            
  1646.       var n_nodes=Math.round(Math.random()*25);
  1647.       if (iter==1)
  1648.          n_nodes=Math.min(Math.max(5,n_nodes),10);
  1649.        else
  1650.           if (n_nodes>8)
  1651.              n_nodes=0;
  1652.              
  1653.      
  1654.       //if ((n_nodes>9) && (iter>1))
  1655.         // n_nodes=0;
  1656.       var node8=document.createElement('UL');
  1657.       node8.className='treeContainer'; 
  1658.       block.appendChild(node8);
  1659.          
  1660.       for (var i=0; i<n_nodes;i++) {
  1661.  
  1662.          
  1663.          
  1664.          var li8=document.createElement('LI');
  1665.          li8.className='treeNode';
  1666.          li8.id='node'+iter*100+i;
  1667.          
  1668.          var tmpDiv=document.createElement('DIV');
  1669.          tmpDiv.className='treeExpand';
  1670.          li8.appendChild(tmpDiv);
  1671.          
  1672.          tmpDiv=document.createElement('DIV');
  1673.          tmpDiv.className='treeContent';
  1674.          li8.appendChild(tmpDiv);
  1675.          
  1676.          var subnodes=arguments.callee(iter,li8);
  1677.          tmpDiv.appendChild(document.createTextNode('Item-'+iter+'-'+i+'-'+subnodes));
  1678.          
  1679.          
  1680.          
  1681.          
  1682.          if (subnodes>0)
  1683.             $(li8).addClass('ExpandClosed')
  1684.          else
  1685.             $(li8).addClass('ExpandLeaf');
  1686.          //------
  1687.            
  1688.           if ((iter==1) && (i==0) && (subnodes==0)) {
  1689.              $(li8).addClass('IsUpper');
  1690.           }
  1691.        
  1692.           if (iter==1)
  1693.              $(li8).addClass('IsRoot');
  1694.              
  1695.           if (i==n_nodes-1)
  1696.              $(li8).addClass('IsLast');
  1697.              
  1698.              
  1699.            
  1700.          node8.appendChild(li8);
  1701.       }
  1702.       //alert(n_nodes);
  1703.       return n_nodes;
  1704.          
  1705.    }
  1706.    //-------------------------------------
  1707.    function hasClass(node,className) {
  1708.       return new RegExp("(\s|\S)*"+className+"(\s|\S)*").test(node.className);
  1709.    }
  1710.    //-------------------------------------
  1711.    function tree_toggle(event) {
  1712.       //alert('test');
  1713.       event= event || window.event;
  1714.       var clickedElem=event.target || event.srcElement;
  1715.       //alert(clickedElem.className);
  1716.      
  1717.       if (!hasClass(clickedElem,'Expand')) {
  1718.          return;
  1719.       }
  1720.       //alert('test');
  1721.       var node=clickedElem.parentNode;
  1722.       if (hasClass(node,'ExpandLeaf')) {
  1723.          return;
  1724.       }
  1725.       //alert('test');
  1726.       var newClass=hasClass(node,'ExpandOpen') ? 'ExpandClosed' : 'ExpandOpen';
  1727.       var re= /(^|\s)(ExpandOpen|ExpandClosed)(\s|$)/;
  1728.       node.className=node.className.replace(re,'$1'+newClass+'$3');
  1729.      
  1730.    }
  1731.    //---------------------------------------
  1732.    function mkacco(inel) {
  1733.       for (var i=0;i<4;i++) {
  1734.          var tmpDiv=document.createElement('DIV');
  1735.          tmpDiv.id=inel.id+'_'+'p'+i;
  1736.          
  1737.          var tmp=document.createElement('H3')
  1738.          tmp.appendChild(document.createTextNode('Element '+i));         
  1739.          tmpDiv.appendChild(tmp);
  1740.          
  1741.          tmp=document.createElement('P');
  1742.          tmp.appendChild(document.createTextNode(fillin(50)));
  1743.          tmpDiv.appendChild(tmp);
  1744.          
  1745.          inel.appendChild(tmpDiv);
  1746.       }
  1747.    }
  1748.    //---------------------------------------------
  1749.    function toggleTabs() {
  1750.       isact=$(this).hasClass('active');
  1751.      
  1752.       isfull=$(this).parent().parent().hasClass('fullopen');
  1753.      
  1754.       if (!isfull) {
  1755.          $(this).parent().parent().find('p:visible').slideUp('fast');
  1756.          $(this).parent().parent().find('h3').removeClass('active');
  1757.          
  1758.          if (!isact) {
  1759.             $(this).next('p').slideDown('fast');
  1760.             $(this).addClass('active');
  1761.          }               
  1762.       }
  1763.       else {
  1764.          if (!isact) {
  1765.             $(this).next('p').slideDown('fast');
  1766.             $(this).addClass('active');
  1767.          }
  1768.          else {
  1769.             $(this).next('p').slideUp('fast');
  1770.             $(this).removeClass('active');
  1771.          }
  1772.       }  
  1773.    }
  1774.    //---------------------------------------------
  1775.    function switchpic() {
  1776.       //alert(this.pic);
  1777.       var img = new Image(150,150);
  1778.       img.src=this.pic;
  1779.       img.id='tempimg88';
  1780.       $('#inpic').empty();
  1781.       $('#inpic').append(img);
  1782.    }
  1783.    //---------------------------------------------
  1784.    
  1785.    function addInput(name,value) {
  1786.       var inp=document.createElement('INPUT');
  1787.       inp.type='BUTTON';
  1788.       inp.name=name;
  1789.       inp.id=name;
  1790.       inp.className='switchbutton';
  1791.       inp.value=value;
  1792.       inp.pic='photo/img'+inp.name.slice(3,4)+'.jpg';
  1793.       inp.onclick=switchpic;
  1794.       this.appendChild(inp);
  1795.    }
  1796.    //---------------------------------------------
  1797.    function mkpicdiv(el) {
  1798.       var tmpDiv=document.createElement('DIV');
  1799.       tmpDiv.id='inpic';
  1800.       el.appendChild(tmpDiv);
  1801.      
  1802.       var frm=document.createElement('FORM');
  1803.       frm.name='picchangeform';
  1804.       frm.id='picchangeform88';
  1805.      
  1806.       for (var i=1;i<6;i++) {
  1807.          addInput.apply(frm,['inp'+i,i]);
  1808.       }
  1809.      
  1810.       frm.inp1.onclick();
  1811.      
  1812.       $('#'+el.id).append(frm);
  1813.    }
  1814.    
  1815.    //---------------------------------------------
  1816.    //---------------------------------------------
  1817.    $(document).ready(function() {
  1818.    
  1819.       //---------------fill dummy content
  1820.       for (var i=0; i<blocks.length;i++) {
  1821.      
  1822.          el=document.getElementById(blocks[i]);
  1823.          var n_words= (el.id.indexOf('left')!=-1) ? 100:100;
  1824.          
  1825.          if (el.id!='leftcenterpart')
  1826.             el.appendChild(document.createTextNode(fillin(n_words)));
  1827.          else
  1828.             el.insertBefore(document.createTextNode(fillin(n_words)),el.firstChild);     
  1829.       }
  1830.       //---------------------------mk menu
  1831.       mkmenu();
  1832.      
  1833.       //-------------------------mk tree
  1834.       var lp=document.getElementById('leftpart');
  1835.      
  1836.       var tmpDiv=document.createElement('DIV');
  1837.       tmpDiv.id='lefttree';
  1838.       lp.appendChild(tmpDiv);
  1839.       tmpDiv.onclick=function() {tree_toggle(arguments[0])};
  1840.      
  1841.       mktree(0,tmpDiv);
  1842.      
  1843.  
  1844.      
  1845.       //----------------------mk accordion
  1846.       mkacco(document.getElementById("acco1"));
  1847.       mkacco(document.getElementById("acco3"));
  1848.      
  1849.       $('#acco3').addClass('fullopen');
  1850.      
  1851.       $('.acco h3').click(toggleTabs);
  1852.      
  1853.       //---------------------picdiv
  1854.       mkpicdiv(document.getElementById('changephoto'));
  1855.      
  1856.       //-----------------------mk target
  1857.       lp=document.getElementById('leftcenterpart');
  1858.       tmpDiv=document.createElement('DIV');
  1859.       tmpDiv.id='lefttarget';
  1860.       //lp.insertBefore(tmpDiv,document.getElementById('changephoto'));  
  1861.       lp.appendChild(tmpDiv);
  1862.      
  1863.      
  1864.       //------------------------Drag-n-Drop
  1865.       var ddin=$('#inheader');
  1866.       var bgimages=['bubi','chervi','piki','trefi'];
  1867.       for (var i=0;i<4;i++) {
  1868.          tmpDiv=document.createElement('DIV');
  1869.          tmpDiv.className='pcard';
  1870.          tmpDiv.id='pcard'+i;
  1871.          
  1872.          ddin.append(tmpDiv);
  1873.          tmpDiv.style['left']=((i*(tmpDiv.offsetWidth+3))+150)+'px';
  1874.          tmpDiv.style['background']='white url(pics/'+bgimages[i]+'.gif) center center no-repeat';
  1875.          }
  1876.      
  1877.       //-----------------------create drag n drop object
  1878.       newHelper=new Helper;
  1879.       dd=new DDrop(newHelper);
  1880.       //------------------------create fly animation object
  1881.      
  1882.       newFlyAnimator = new flyAnimator;
  1883.       o=newFlyAnimator;
  1884.      
  1885.       //---------------------correct blocks
  1886.       checkWin=function() {
  1887.            var winWidth=document.documentElement.clientWidth || document.body.clientWidth;
  1888.            var winHeight=document.documentElement.clientHeight || document.body.clientHeight;
  1889.            
  1890.            $('#sysinfo').html('width x height<br>'+winWidth+' x '+winHeight);
  1891.            
  1892.            
  1893.            function switchBlock(block,limitWidth) {
  1894.               if (winWidth<limitWidth)
  1895.                  $(block).css('display','none');
  1896.               else
  1897.                  $(block).css('display','block');
  1898.            }
  1899.             //$('#rightcenterpart').animate({width:"0"},"slow");
  1900.            switchBlock('#rightcenterpart',1000);
  1901.            switchBlock('#leftcenterpart',850);
  1902.            switchBlock('#centerpart',750);
  1903.            
  1904.                  
  1905.          };
  1906.                  
  1907.       window.onresize=checkWin;
  1908.       checkWin();
  1909.      
  1910.      
  1911.      
  1912.       //$('#lefttree').click(tree_toggle(arguments[0]));
  1913.      
  1914.      
  1915.    })
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement