Darbicus.js

This is my library that can handle events and get values from the event callbacks as if they were available everywhere. rather than just in the callback. It uses Higher Order Functions to handle all the displaying and grabbing of the values from the events

by Darby Rathbone

HTML

<div>X: <span id="x"></span>
Y: <span id='y'></span>

</div>Click Count: <span id="count2"></span>

<div>Log</div>
<div id='log'></div>
<canvas></canvas>

CSS

canvas{
    position:absolute;
    top:2px;
    bottom:2px;
    left:2px;
    right:2px;
    width:100%;
    height:100%;
    outline:double black 2px;    
}

JavaScript

/*counter is a simple counter. it will add 1 to the count value every time count() is called. the display('querySelector string', 'attribute to assign the value') function returns a function that displays the count value on the element using a querySelector string and then assigns the count to the attribute name.
 */

var counter = function () {
    var Counter = Object.create(null);
    Counter.Count = 0;
    Counter.count = function () {
        Counter.Count++;
    };
    Counter.display = function (e, n) {
        e = document.querySelector(e);
        return (function () {
            e[n] = Counter.Count;
            return true;
        });
    };
    return Counter;
};

/*eventGrabber can grab values from the event object. you specify these when initializing the object by passing the event object's name for these values as strings arguments ex:eventGrabber('pageX', 'pageY').
the names of theses values are stored in the first item in array
*/
var eventGrabber = function () {
    var e = [].slice.call(arguments),
        EventGrabber = Object.create(null);
    EventGrabber.values = [];
    e.forEach(function (E) {
        EventGrabber.values.push(E);
        EventGrabber[E] = 0;
    });
    EventGrabber.grab = function () {
        return (function (eve) {
            console.log(eve);
            EventGrabber.values.forEach(function (v) {
                EventGrabber[v] = eve[v];
            });
        });
    };
    EventGrabber.displayer = function (v, e, a) {
        e = document.querySelector(e);
        return function () {
            e[a] = EventGrabber[v];
            return true;
        };

    };
    return EventGrabber;
};



var log = document.querySelector('#log');
/*constructors*/
var egrab = eventGrabber('pageX', 'pageY');
var testvar = counter();



/*the simple event listeners*/
window.addEventListener('mousemove', egrab.grab());
window.addEventListener('click', testvar.count);
window.addEventListener('click', function () {
    var div =...