How to read and understand encapsulated code

Question

I am using a framework php x JS and need to change some things that are and JS but it seems encapsulated... (see below an example) by chance someone knows how I can do this magic??

window.Gantt={_seed:0},Gantt.plugin=function(t){this._ganttPlugin.push(t),t(window.gantt)},Gantt._ganttPlugin=[],Gantt.getGanttInstance=function(){var t={version:"4.1.0"};t={version:"4.1.0"},t.event=function(t,e,i){t.addEventListener?t.addEventListener(e,i,!1):t.attachEvent&&t.attachEvent("on"+e,i)},t.eventRemove=function(t,e,i){t.removeEventListener?t.removeEventListener(e,i,!1):t.detachEvent&&t.detachEvent("on"+e,i)},t._eventable=function(t){t._silent_mode=!1,t._silentStart=function(){this._silent_mode=!0;
},t._silentEnd=function(){this._silent_mode=!1},t.attachEvent=function(t,e,i){return t="ev_"+t.toLowerCase(),this[t]||(this[t]=new this._eventCatcher(i||this)),t+":"+this[t].addEvent(e)},t.callEvent=function(t,e){return this._silent_mode?!0:(t="ev_"+t.toLowerCase(),this[t]?this[t].apply(this,e):!0)},t.checkEvent=function(t){return!!this["ev_"+t.toLowerCase()]},t._eventCatcher=function(t){var e=[],i=function(){for(var i=!0,n=0;n<e.length;n++)if(e[n]){var a=e[n].apply(t,arguments);i=i&&a}return i};return i.addEvent=function(t){
return"function"==typeof t?e.push(t)-1:!1},i.removeEvent=function(t){e[t]=null},i},t.detachEvent=function(t){if(t){var e=t.split(":");this[e[0]].removeEvent(e[1])}},t.detachAllEvents=function(){for(var t in this)0===t.indexOf("ev_")&&delete this[t]},t=null},t.copy=function(e){var i,n,a;if(e&&"object"==typeof e){for(a={},n=[Array,Date,Number,String,Boolean],i=0;i<n.length;i++)e instanceof n[i]&&(a=i?new n[i](e):new n[i]);for(i in e)Object.prototype.hasOwnProperty.apply(e,[i])&&(a[i]=t.copy(e[i]))}
return a||e},t.mixin=function(t,e,i){for(var n in e)(!t[n]||i)&&(t[n]=e[n]);return t},t.defined=function(t){return"undefined"!=typeof t},t.uid=function(){return this._seed||(this._seed=(new Date).valueOf()),this._seed++,this._seed},t.bind=function(t,e){return t.bind?t.bind(e):function(){return t.apply(e,arguments)}},function(){function e(t){var e=!1,i=!1;if(window.getComputedStyle){var n=window.getComputedStyle(t,null);e=n.display,i=n.visibility}else t.currentStyle&&(e=t.currentStyle.display,i=t.currentStyle.visibility);
return"none"!=e&&"hidden"!=i}function i(t){return!isNaN(t.getAttribute("tabindex"))&&1*t.getAttribute("tabindex")>=0}function n(t){var e={a:!0,area:!0};return e[t.nodeName.loLowerCase()]?!!t.getAttribute("href"):!0}function a(t){var e={input:!0,select:!0,textarea:!0,button:!0,object:!0};return e[t.nodeName.toLowerCase()]?!t.hasAttribute("disabled"):!0}t._getFocusableNodes=function(t){for(var s=t.querySelectorAll(["a[href]","area[href]","input","select","textarea","button","iframe","object","embed","[tabindex]","[contenteditable]"].join(", ")),r=Array.prototype.slice.call(s,0),o=0;o<r.length;o++){
var _=r[o],l=(i(_)||a(_)||n(_))&&e(_);l||(r.splice(o,1),o--)}return r}}(),t._get_position=function(t){var e=0,i=0;if(t.getBoundingClientRect){var n=t.getBoundingClientRect(),a=document.body,s=document.documentElement,r=window.pageYOffset||s.scrollTop||a.scrollTop,o=window.pageXOffset||s.scrollLeft||a.scrollLeft,_=s.clientTop||a.clientTop||0,l=s.clientLeft||a.clientLeft||0;return e=n.top+r-_,i=n.left+o-l,{y:Math.round(e),x:Math.round(i),width:t.offsetWidth,height:t.offsetHeight}}for(;t;)e+=parseInt(t.offsetTop,10),

Answer 1

Your code is minified, you can use the JS Beautifier to make it legible:

window.Gantt = {
        _seed: 0
    }, Gantt.plugin = function(t) {
        this._ganttPlugin.push(t), t(window.gantt)
    }, Gantt._ganttPlugin = [], Gantt.getGanttInstance = function() {
        var t = {
            version: "4.1.0"
        };
        t = {
                version: "4.1.0"
            }, t.event = function(t, e, i) {
                t.addEventListener ? t.addEventListener(e, i, !1) : t.attachEvent && t.attachEvent("on" + e, i)
            }, t.eventRemove = function(t, e, i) {
                t.removeEventListener ? t.removeEventListener(e, i, !1) : t.detachEvent && t.detachEvent("on" + e, i)
            }, t._eventable = function(t) {
                t._silent_mode = !1, t._silentStart = function() {
                    this._silent_mode = !0;
                }, t._silentEnd = function() {
                    this._silent_mode = !1
                }, t.attachEvent = function(t, e, i) {
                    return t = "ev_" + t.toLowerCase(), this[t] || (this[t] = new this._eventCatcher(i || this)), t + ":" + this[t].addEvent(e)
                }, t.callEvent = function(t, e) {
                    return this._silent_mode ? !0 : (t = "ev_" + t.toLowerCase(), this[t] ? this[t].apply(this, e) : !0)
                }, t.checkEvent = function(t) {
                    return !!this["ev_" + t.toLowerCase()]
                }, t._eventCatcher = function(t) {
                    var e = [],
                        i = function() {
                            for (var i = !0, n = 0; n < e.length; n++)
                                if (e[n]) {
                                    var a = e[n].apply(t, arguments);
                                    i = i && a
                                }
                            return i
                        };
                    return i.addEvent = function(t) {
                        return "function" == typeof t ? e.push(t) - 1 : !1
                    }, i.removeEvent = function(t) {
                        e[t] = null
                    }, i
                }, t.detachEvent = function(t) {
                    if (t) {
                        var e = t.split(":");
                        this[e[0]].removeEvent(e[1])
                    }
                }, t.detachAllEvents = function() {
                    for (var t in this) 0 === t.indexOf("ev_") && delete this[t]
                }, t = null
            }, t.copy = function(e) {
                var i, n, a;
                if (e && "object" == typeof e) {
                    for (a = {}, n = [Array, Date, Number, String, Boolean], i = 0; i < n.length; i++) e instanceof n[i] && (a = i ? new n[i](e) : new n[i]);
                    for (i in e) Object.prototype.hasOwnProperty.apply(e, [i]) && (a[i] = t.copy(e[i]))
                }
                return a || e
            }, t.mixin = function(t, e, i) {
                for (var n in e)(!t[n] || i) && (t[n] = e[n]);
                return t
            }, t.defined = function(t) {
                return "undefined" != typeof t
            }, t.uid = function() {
                return this._seed || (this._seed = (new Date).valueOf()), this._seed++, this._seed
            }, t.bind = function(t, e) {
                return t.bind ? t.bind(e) : function() {
                    return t.apply(e, arguments)
                }
            },
            function() {
                function e(t) {
                    var e = !1,
                        i = !1;
                    if (window.getComputedStyle) {
                        var n = window.getComputedStyle(t, null);
                        e = n.display, i = n.visibility
                    } else t.currentStyle && (e = t.currentStyle.display, i = t.currentStyle.visibility);
                    return "none" != e && "hidden" != i
                }

                function i(t) {
                    return !isNaN(t.getAttribute("tabindex")) && 1 * t.getAttribute("tabindex") >= 0
                }

                function n(t) {
                    var e = {
                        a: !0,
                        area: !0
                    };
                    return e[t.nodeName.loLowerCase()] ? !!t.getAttribute("href") : !0
                }

                function a(t) {
                    var e = {
                        input: !0,
                        select: !0,
                        textarea: !0,
                        button: !0,
                        object: !0
                    };
                    return e[t.nodeName.toLowerCase()] ? !t.hasAttribute("disabled") : !0
                }
                t._getFocusableNodes = function(t) {
                    for (var s = t.querySelectorAll(["a[href]", "area[href]", "input", "select", "textarea", "button", "iframe", "object", "embed", "[tabindex]", "[contenteditable]"].join(", ")), r = Array.prototype.slice.call(s, 0), o = 0; o < r.length; o++) {
                        var _ = r[o],
                            l = (i(_) || a(_) || n(_)) && e(_);
                        l || (r.splice(o, 1), o--)
                    }
                    return r
                }
            }(), t._get_position = function(t) {
                var e = 0,
                    i = 0;
                if (t.getBoundingClientRect) {
                    var n = t.getBoundingClientRect(),
                        a = document.body,
                        s = document.documentElement,
                        r = window.pageYOffset || s.scrollTop || a.scrollTop,
                        o = window.pageXOffset || s.scrollLeft || a.scrollLeft,
                        _ = s.clientTop || a.clientTop || 0,
                        l = s.clientLeft || a.clientLeft || 0;
                    return e = n.top + r - _, i = n.left + o - l, {
                        y: Math.round(e),
                        x: Math.round(i),
                        width: t.offsetWidth,
                        height: t.offsetHeight
                    }
                }
                for (; t;) e += parseInt(t.offsetTop, 10),