Javascript Snippets

snippets.js

/*****************************************************************************
 *                                  GENERAL                                  *
 * ***************************************************************************/

// Append an empty div to current element
$0.appendChild(document.createElement('div'))

// "Duplicate down" current element
(function() {

    function dupeDown(el) {
        var c = el.cloneNode(true),
            next = el.nextSibling;

        c.id && c.removeAttribute('id');

        el.parentNode.insertBefore(c, next);    // same as appendChild if next is null
    }

    dupeDown($0);
})();

// Monitor events on current element
monitorEvents($0);
/**
 * Possible values:
 *     mouse:  “mousedown”, “mouseup”, “click”, “dblclick”, “mousemove”, “mouseover”, “mouseout”, “mousewheel”
 *     key: “keydown”, “keyup”, “keypress”, “textInput”
 *     touch:  “touchstart”, “touchmove”, “touchend”, “touchcancel”
 *     control:  “resize”, “scroll”, “zoom”, “focus”, “blur”, “select”, “change”, “submit”, “reset”
 *     no arguments: all of the above + “load”, “unload”, “abort”, “error”, “select”, “change”, “submit”, “reset”, “focus”, “blur”, “resize”, “scroll”, “search”, “devicemotion”, “deviceorientation”
 */
monitorEvents($0, 'mouse');




/*****************************************************************************
 *                                    ExtJS                                  *
 * ***************************************************************************/

// Get component over selected DOM node
Ext.getCmp($0.id);

// Capture all component events by selected DOM node in Inspector
Ext.util.Observable.capture(Ext.getCmp($0.id), function(evname) {console.log(evname, arguments);})

// Append a new node to current element
Ext.fly(Ext.DomHelper.createDom({cls: 'mycls'})).appendTo($0)

// Use cmp.$className to quickly determine what component you are looking at...