User:Zocky/Tools.js

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

// cross-browser helper functions
// $ = getElementById
// $E - event functions - hook, unhook, cancel, target, keycode
// $D - DOM functions
// $P - popups

document.write('<link rel="stylesheet" type="text/css" href="'  
             + 'http://en.wikipedia.org/w/index.php?title=User:Zocky/Tools.css'
             + '&action=raw&ctype=text/css&dontcountme=s">');
 
  var $ = function( id )    { return document.getElementById(id) };

  var $E={};
  $E.hook = function( element , event , handler ) { 
    if( element.addEventListener ) element.addEventListener( event,handler,false ) 
    else element.attachEvent( 'on' + event , handler );
  };
  $E.unhook = function( element, event, handler ) {
    if (element.removeEventListener) element.removeEventListener(event,handler,false) 
    else element.detachEvent( 'on' + event , handler );
  };
  $E.cancel = function( event ) {
    if( event.preventDefault ) {  
      event.preventDefault();
//    event.stopPropagation();
    } else {
      event.returnValue = false;
      event.cancelBubble = true;
    }
  };
  $E.target  = function( event ) { return event.target || event.srcElement };
  $E.keycode = function( event ) { return event.preventDefault ? event.which : event.keyCode };
  $E.left    = function( event ) { return (((event.which) && (event.which == 1)) || ((event.button) && (event.button == 1)));};
  $E.mouseX  = function( event ) { return event.pageX || (event.clientX +(document.documentElement.scrollLeft || document.body.scrollLeft));};
  $E.mouseY  = function( event ) { return event.pageY || (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop));};

  var $D={};
  $D.a = function (element, attribute, value)
  {
    return value==null 
    ? element.getAttribute && element.getAttribute(attribute) 
    : element.setAttribute && element.setAttribute(attribute,value);
  }
  $D.parentByTag = function( element , tagname ) { 
    while( element.parentNode && element.parentNode.tagName != tagname) element=element.parentNode;
    return element.parentNode;
  }
  $D.parentByClass = function( element , classname ) { 
    while( element.parentNode && element.parentNode.className != classname) element=element.parentNode;
    return element.parentNode;
  }

  $D.descendantByID = function (node, id) {
    if (node.id == id) return node;
    var i, c;
    for (i = 0; i < node.childNodes.length; i++) {
      c = $D.descendantByID(node.childNodes[i], id);
      if (c != null) return c;
    }
   return null;
  }

  $D.xNode = function( path, node ) {
    return document.evaluate(path,(node||document.documentNode), null, XPathResult.ANY_TYPE, null).iterateNext(); 
  };
  $D.xForeach = function( path, fn, node) {
    var nodes=document.evaluate(path,(node||document.documentNode), null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    for ( var i=0 ; i < nodes.snapshotLength; i++ )
    {
      fn(nodes.snapshotItem(i));
    }
  };
  var $P={};
  $P.top = 100;
  $P.mouseX = 0;	
  $P.mouseY = 0;
  $P.startX = 0;	
  $P.startY = 0;
  $P.active = null;

  $P.create = function( title , x , y , width )
  {
    id = "$P_" + $P.top++;
    var w = width ? width + 'px' : 'auto';
    var p;
    if (window.addEventListener) p = 'fixed'
    else {
      p = 'absolute'; y+= document.documentElement.scrollTop; x+= document.documentElement.scrollLeft;
    }

    code
    = '<div class="zPopup" id="'+id+'" style="top:'+y+'px;left:'+x+'px;z-index:'+$P.top+';width:'+w+ ';position:' + p +'">'  
    +   '<div class="zPopup_titlebar" id="'+id+'_titlebar">'
    +     '<span class="zPopup_titlebar_right"><a href="javascript:$P.close(\''+id+'\');">[×]</a></span>'
    +     '<span class="zPopup_title" id="'+id+'_title">'+title+'</span>'
    +   '</div>'
    +   '<div class="zPopup_content" id="'+id+'_content"></div>'
    + '</div>';
    c=document.createElement('div'); c.innerHTML=code;
    $('globalWrapper').appendChild(c.firstChild);
    $E.hook($(id),'mousedown',$P.pick, false);
    $E.hook($(id),'click',$P.click, false);
    return (id);
  };
  $P.close = function( id ) { $('globalWrapper').removeChild($(id)); };
  $P.click = function( e )  { $P.active && $P.cancel(e) };
  $P.pick =  function( e )  {
    $P.active = $D.parentByClass($E.target(e),'zPopup');
    $P.top++; $P.active.style.zIndex = $P.top;
    $P.mouseX = $E.mouseX(e); $P.mouseY = $E.mouseY(e);
    $P.startX = parseInt($P.active.style.left); $P.startY = parseInt($P.active.style.top); 
    $E.hook( document , "mousemove" , $P.drag, false);
    $E.hook( document , "mouseup" , $P.drop, false);
    $E.cancel(e);
  };
  $P.drag = function( e ) {
    $P.active.style.left = ($E.mouseX(e) - $P.mouseX + $P.startX) + "px"; 
    $P.active.style.top  = ($E.mouseY(e) - $P.mouseY + $P.startY) + "px"; 
    $E.cancel(e);
  };
  $P.drop = function( e ) {
    $E.unhook( document , "mousemove" , $P.drag , false );
    $E.unhook( document , "mouseup" , $P.drop , false );
    $P.active=null;
    $E.cancel(e);
  }
  var $X={};
  $X.get = function( url , cb1 , cb2 ) {
    var x = window.XMLHttpRequest ? new XMLHttpRequest()
          : window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP")
          : false;

    if (x) {
      x.onreadystatechange=function() {
        x.readyState==4 && $X.loaded( x, cb1 , cb2 ) 
      };
      x.open("GET",url,true);
      x.setRequestHeader('Accept','text/*');
      x.send(null); 
    }
  };

  $X.loaded = function( x , cb1 , cb2 ) {
    x.status==200
    && ( cb1 && cb1( $X.bodyHTML(x.responseText) ) )
    || ( cb2 && cb2( x.statusText ) || alert( x.statusText ) );
  };

  $X.bodyHTML = function(t) {
    return t.replace(/(^[\s\S]*<body[\s\S]*?>|<\/body\s*>[\s\S]*$)/gi,''
    ).replace(/<script[\s\S]*?>[\s\S]*?<\/script\s*>/gi,''
    ).replace(/<form[\s\S]*?>[\s\S]*?<\/form\s*>/gi,''
    ).replace(/<input[\s\S]*?>/gi,''
    ).replace(/<textarea[\s\S]*?>[\s\S]*?<\/textarea\s*>/gi,''
    ).replace(/<select[\s\S]*?>[\s\S]*?<\/select\s*>/gi,''
    ); };

  $X.load = function( el , url , xpath) {
    el.innerHTML='<blink>...</blink>';
    cb1 = function (t) {
      if (xpath==null) el.innerHTML=t
      else    {
         try
         {
           c=document.createElement('div');
           c.innerHTML=t;
           el.innerHTML='';
           $D.xForeach( '.'+xpath , function(n){el.appendChild(n)} , c )
         }
         catch (err) {
           el.innerHTML=err.name+": "+err.message;
         }
      };
      return true;
    }
    cb2 = function (s) { el.innerHTML=s };
    $X.get(url,cb1,cb2);  
  };