Javascript schnell&scheiße Testtool

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>JS Tester</title>

<link rel="shortcut icon" href="/favicon.ico">
<link rel="stylesheet" type="text/css" href="static.css">

<!--- _javascript --->
<script type="text/javascript" src="/lib/js/standard_funx.js"></script>
<script type="text/javascript" src="/lib/js/resize.js"></script>
<script type="text/javascript">
  var ie= navigator.appName.match(/Explorer/);
  
  function m(str,target,clear){
    if(!target) var target= '#msg';
    var d= new Date();
    var ds= (''
          + d.getHours() +':'
          + d.getMinutes() +':'
          + d.getSeconds() +'.'
          + d.getMilliseconds()
          + '').sub().bold();
    if(ie){
      str= String(str).replace(/\n/g,'<br>\n');
    }
    if(clear){
      _(target).innerHTML=  ds +'--------------------------------------------'+(ie?'<br>':'')+'\n'+ str;
    }
    else{
//       var ss= _(target).selectionStart;
      _(target).innerHTML= ds +'--------------------------------------------'+(ie?'<br>':'')+'\n'+ str +(ie?'<br>':'')+'\n'+ _(target).innerHTML;
//       _(target).selectionStart= ss;
    } 
  }
  trace=m;
  
  

  function showPos(me){
//     var l= Math.ceil( (me.layerY + this.scrollTop) / charHeight );
//     var c= Math.floor( (me.layerX + this.scrollLeft) / charWidth );
    var l= Math.ceil( (me.layerY + this.scrollTop +2) / charHeight );
    var c= Math.floor((me.layerX + this.scrollLeft+1) / charWidth );
    f.pos.value= 'L '+ l +' | C '+ c;
  }
  
  
  function js1Key(e){
    if(!e) e= window.event;
    if(e.keyCode==13 && !e.shiftKey){
      if( this.history[this.hi]!=this.value ){
        this.history.unshift( this.value );
        this.hi= 0;
      }
      bash(this.value);
      if(ie){ e.cancelBubble= true; e.returnValue= false; }
      else  { e.stopPropagation(); e.preventDefault(); }
      return false;
    }
    if(e.keyCode==38 && e.ctrlKey){
      this.value= this.history[ this.hi<this.history.length ? this.hi++ : (this.hi=-1)];
    }
    if(e.keyCode==38 && e.ctrlKey){
      this.value= this.history[ this.hi>=0 ? this.hi-- : (this.hi= this.history.length-1) ];
    }
/*
    if(e.keyCode==38 && this.hi<this.h.length-1){
      this.value= this.h[ ++this.hi ];
    };
    if(e.keyCode==40 && this.hi>0){
      this.value= this.h[ --this.hi ];
    };
    if(e.keyCode==13){
      if(!this.h) this.h=[];
      this.hi=0;
      if(this.h[0] != this.value) this.h.unshift(this.value);
      try{
        var opt,v= this.value;
        eval( v.substr(0,1)==':'
          ? 'trace(\">\"+ '+ (v.substr(1,1)==':'
            ? 'dump('+ v.substr(v.indexOf(' ')) +','+ ((opt=v.substring(2,v.indexOf(' '))) ? opt : 1) +')'
            : v.substr(1)) +')'
          : v
        );
      } catch(e){
        trace(dump(e,0,0));
      }
    };
*/
  }
  
  
  function js2Key(e,callr){
    if(!e) e= window.event;
    if(e.keyCode==13){
      if( e.ctrlKey ){
        if(e.type=='keyup') bash( this.value );
        if(ie){ 
          e.cancelBubble= true; e.returnValue= false;
        }
        else  {
          e.stopPropagation(); e.preventDefault();
        }
      }
      else if(e.type=='keyup'){
        var lastLine= this.value.substr(0,this.selectionStart).split('\n').slice(-2,-1).join();
        var indent= lastLine.match(/^(\s*)/)[1];
        if( lastLine.substr(-1).match(/[({[]/) ){
          indent+= '  ';
        }
        else if( lastLine.substr(-1).match(/[)}\]]/) ){
          indent= indent.substr(0,indent.length-2);
        }
        for(var i=0; i<indent.length; i++){
          doKey(indent.charCodeAt(i),this);
        }
      }
    }
    if(e && e.keyCode && e.keyCode==9){
      if(callr){
      }
      else{
        doKey(32,this);
        if(ie) doKey(32,this);
        if(ie){ e.cancelBubble= true; e.returnValue= false; }
        else  { e.stopPropagation(); e.preventDefault(); }
      }
//      return; 
    }
    if(_('#bpBtn').live) b.innerHTML= this.value;
  }
  
  
  function doKey(chr,me){
    if(ie){
      document.selection.createRange().text+= String.fromCharCode(chr); 
      return;
    }
    var e= document.createEvent('KeyboardEvent');
    e.initKeyEvent('keypress',true,true,null,false,false,false,false,0,chr);
    me.dispatchEvent(e);
  } 
  
  
  




  function bash(str){
    try{
      if(str.substr(0,2)=='>>'){
        m( dump( eval(str.substr(2)),1 ) );
      }
      else if (str.substr(0,1)=='>'){
        m( eval(str.substr(1)) );
      }
      else{
        eval( str );
      }
    }
    catch(e){
      if(ie){
        m('ERR: '+ dump(e,2) );
        throw(e);
        return;
      }
      m(   e.message +' in <a href="'+ e.fileName +'">'+ e.fileName +'</a>, L '+ e.lineNumber 
         +( e.fileName && e.fileName!=location.href 
            ? '\n<div class=errSrc><iframe '
             +'name=err'+ (++errCount) +'  class=errSrc '
             +'src="'+ e.fileName +'#'+ e.lineNumber +'" '
             +'onload="contentWindow.scrollTo(1,'+ ((e.lineNumber-2)*charHeight) +'); initResize(this.parentNode)">'
             +'</iframe></div>\n' 
            : ''
          )
       );
    }
  }

  
  function writeHistoryList(){
    var hl= _('#hl');
    hl.innerHTML='';
    var h= _('#js1').history;
    var hi= _('#js1').hi;
    for( var i=0; i<h.length; i++){
      hl.innerHTML+= '<li><a name="'+i+'" '+ (i==hi ? 'class=active ' : '') 
                    +'onClick="_(\'#js1\').value=this.text;" '
                    +'onDblClick="_(\'#js1\').hi='+i+'; _(\'#js1\').onkeypress( event.merge({keyCode:13}) )"'
                    +'>'+ h[i].replace(/</g,'&lt;') +'</a></li>\n';
    }
//    m(h);
    return false;
  }
  
  
  function addBodyPane(w,props){
    w= w ? w : 50;
    f.style.width= (100-w)+'%';
    ( b= document.body.appendChild( document.createElement('div') ) ).style.merge({
      position:'absolute',
      top:0,
      left:w+'%',
      right:0,
      bottom:0,
      overflow:'auto',
      border:'1px solid green'  
    });
    b.id= 'html';
    b.merge(props);
    b.ondblclick= function(){ js2.value= this.innerHTML }
    return b;
  }
  
  
  function bodyPaneButton(me){
    if(typeof b!='object') return addBodyPane();
    if(me.live){
      me.rmClass('live');
      return me.live= false;
    }
    me.addClass('live');
    return me.live= true;
  }
  
  

  window.onload= function(){
    f.js1.history= [];
    f.js1.hi= 0;
    f.js1.onkeypress= js1Key;
//    f.js1.onkeyup= bash;
//     _('#js1c').onmousemove= showPos;
//     _('#js2c').onmousemove= showPos;
//     _('#msgc').onmousemove= showPos;
    _('#hb').onmouseover= function(){ writeHistoryList() };
    f.js2.onkeyup= js2Key; 
    f.js2.onkeypress= js2Key;
    initResize(js2c); 
    initResize(jsc); 
    initResize(f); 
    js2c.doResize= function(e){
      if(!e) e= window.event;
      this.style.height= Math.round((this.v0 + e.screenY-this.m0.y) / this.parentNode.offsetHeight *100)+'%';
      _('#js1c').style.height= (100-Number(this.style.height))+'%';
      if(ie){ e.cancelBubble= true; e.returnValue= false; }
      else  { e.stopPropagation(); e.preventDefault(); }
    }
    jsc.doResize= function(e){
      if(!e) e= window.event;
      this.style.height= Math.round((this.v0 + e.screenY-this.m0.y) / this.parentNode.offsetHeight *100)+'%';
      _('#msgc').style.height= (100-Number(this.style.height))+'%';
      if(ie){ e.cancelBubble= true; e.returnValue= false; }
      else  { e.stopPropagation(); e.preventDefault(); }
    }
  }

  var charWidth= 8;
  var charHeight= 16;
  var x0= 11;
  var errCount=0;
  
  
</script>

<!--- _css --->
<style>
  * {
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -khtml-box-sizing:border-box;
    -webkit-box-sizing:border-box;
  }
  
  html, body {height:100%;}
  
  body {
    margin:0px; padding:0px;
  }
  
  #h {
    position:absolute;
    right:75px;
    top:0px;
    height:600%;
  }
  
  #h ul {
    display:none;
  }
  
  #h:hover ul {
    display:block;
    position:relative;
    z-index:15;
    max-height:100%;
    overflow:auto;
    margin:0;
    padding:0 20px 0 5px;
    background:#EEEEEE;
    border:1px solid #000;
    list-style:none;
  }
  #h a {
    display:block;
    white-space:nowrap;
    font-family:monospace;
  }
  #h a:hover {
    background:#CEC;
  }
  #h a.active {
    background:#FBB;
  }

  #bpBtn.live {
    background-color:#F90;
  }

  #msg div.errSrc {
    position:relative;
    border:1px solid #990000;
    height:5em;
    width:95%;
    margin-left:1%;
  }
  iframe.errSrc {
    width:100%;
    height:100%;
    background:#FFF;
    border:0;
  }
  
</style>
  

</head>

<body>
<form id=f name=f style="position:relative; left:0; top:0; width:100%; height:100%; margin:0; padding:0; border:0; overflow:hidden;">
<div id=jsc style="position:absolute; left:0; width:100%; top:0; height:55%; padding:0; margin:0; border:01px solid red;">
  <div id=js2c style="position:absolute; left:0; width:100%; top:0;    height:85%; margin:0; padding:0; border:0;"><textarea id=js2 name=js2 style="width:100%; height:100%;" wrap=off></textarea></div>
  <div id=js1c style="position:absolute; left:0; width:100%; bottom:0; height:15%; margin:0; padding:0 110px 0 0;">
    <textarea id=js1 name=js1 style="width:100%; height:100%; margin:0;" wrap=off>&gt; </textarea>
    <div style="position:absolute; right:80px; top:0px; vertical-align:baseline;"><input type=checkbox name=qex checked style="vertical-align:middle;">&para;&raquo;</div>
    <div id=h style=""><button id=hb onClick="writeHistoryList(); return false;" style="position:absolute; top:0px; right:-15px; height:18px; padding:0px; font:bold 8pt/5pt Tahoma;">H</button><ul id=hl><li><i>leer</i></li></ul></div>
    <input type=text name=pos style="position:absolute; border-width:1px; right:60px; bottom:0px; width:50px; font:bold 8pt/5pt Arial;">
    <input type=button value="«&uarr;" onclick="eval(f.js2.value)" style="position:absolute; right:25px; top:0px; height:18px; padding:0px; font:bold 8pt/5pt Tahoma;">
    <input type=button value="&uarr;»" onclick="(typeof b=='object'?b:addBodyPane()).innerHTML=js2.value" style="position:absolute; right:0px; top:0px; height:18px; padding:0px; font:bold 8pt/5pt Tahoma;">
    <input type=button value="b›" id=bpBtn onclick="bodyPaneButton(this)" style="position:absolute; right:0px; top:18px; height:18px; padding:0px; font:bold 8pt/5pt Tahoma;">
    <input type=button value="x&darr;" onclick="_('#msg').innerHTML=''" style="position:absolute; right:25px; bottom:0px; height:18px; padding:0; font:bold 8pt/5pt Tahoma; valign:top;">
  </div>
</div>
<div id=msgc style="position:absolute; left:0; right:0; bottom:0; height:45%; margin:0; padding:0;"><pre id=msg name=msg style="height:100%; overflow:auto; margin:0; border:1px solid #000; background:#EEE">doc.cookie= <?= htmlspecialchars(print_r($_COOKIE,1)) ?></pre></div> 
</form>  

</body>
</html>

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.