20 javascript hacks.js

// type

function typeOf(elem) {
  return {}.toString.call(elem).slice(8, -1).toLowerCase();
}

typeOf(123) //number
typeOf("123") //string
typeOf(function fn() {}) //function
typeOf({k: 123}) //object
typeOf([1,2,3]) //array
typeOf(new Date) //date
typeOf((function () { return arguments;})()) //arguments

// type end
// metrics
function getMetrics() {
  var fullDocumentHeight = Math.max( document.body.scrollHeight, document.body.offsetHeight, document.documentElement.clientHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight );
  return {
    documentScroll: function () { // this function is getboundingclientrect for document.
                    var scrollHeight = Math.max(
                    document.body.scrollHeight, document.documentElement.scrollHeight,
                    document.body.offsetHeight, document.documentElement.offsetHeight,
                    document.body.clientHeight, document.documentElement.clientHeight
                    );

                    return {
                      top: pageYOffset, // how many pixels scrolled.
                      bottom: pageYOffset + document.documentElement.clientHeight,
                      height: scrollHeight // documents full width
                    };
    },
    getCoords: function (elem) { // gets elements coordinates relative to the document. 
                    var box = elem.getBoundingClientRect();
                    var body = document.body;
                    var docEl = document.documentElement;
                    var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
                    var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
                    var clientTop = docEl.clientTop || body.clientTop || 0;
                    var clientLeft = docEl.clientLeft || body.clientLeft || 0;
                    var top = box.top + scrollTop - clientTop;
                    var left = box.left + scrollLeft - clientLeft;

                    return {
                      top: top, // top coordinates
                      left: left // left coordinates
                    }
        }
   
  };
}

var metrics = getMetrics();
var elemCoords = metrics.getCoords(document.querySelector(".header"));
var documentScroll = metrics.documentScroll();
console.log(documentScroll);

// metrics end

// getEventListener polifyll

(function () { // get list of events on element.
Element.prototype._addEventListener = Element.prototype.addEventListener;
Element.prototype._removeEventListener = Element.prototype.removeEventListener;
Element.prototype.removeEventListener = function (type, fn, capture) {
    for (var i = 0; i < this.eventListenerList[type].length; i++) {
        if (this.eventListenerList[type][i].listener === fn) {
            this.eventListenerList[type].splice(i, 1);
            break;
        }
    }
    if (!this.eventListenerList[type].length) {
        delete this.eventListenerList[type];
    }
    this._removeEventListener(type, fn, capture || false);
};
Element.prototype.addEventListener = function(type, fn, capture) {
this._addEventListener(type,fn, capture || false);
var self = this;
if (!this.eventListenerList) {
    this.eventListenerList = {};
}
if (!this.eventListenerList[type]) {
    this.eventListenerList[type] = [];
    this.eventListenerList[type].push({
        listener: fn,
        capture: capture || false,
        remove: function () {
            self.removeEventListener(type, this.listener, capture || false);
        }
    });
} else {
    this.eventListenerList[type].push({
        listener: fn,
        capture: capture || false,
        remove: function () {
            self.removeEventListener(type, this.listener, capture || false);
        }
    });
}
};
})();