src/components/Debug/Resources/compiled/js/debug.base.js - Code Metrics - lenevor/syscodes - Measure and Improve Code Quality continuously with Scrutinizer

src/components/Debug/Resources/compiled/js/debug.base.js A
last analyzed 2025-08-16 06:23 UTC

↳ Parent: Project

Complexity

Total Complexity	20
Complexity/F	2.5

Size

Lines of Code	129
Function Count	8

Duplication

Duplicated Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
eloc	66
dl	0
loc	129
rs	10
c	0
b	0
f	0
wmc	20
mnd	12
bc	12
fnc	8
bpm	1.5
cpm	2.5
noi	4

2 Functions

Rating	Name	Duplication	Size	Complexity
D	debug.base.js ➔ changeTo	0	8	13
A	debug.base.js ➔ selectFrameInfo	0	10	3

(function(d, w) {
    /** 
     * CODE FOR SELECTION OF FRAMES 
     */

    /* IE8 Incompatibility crap */
    let elements = ['section', 'header', 'nav', 'footer'];

    for (let i = 0; i < elements.length; i++) {
        d.createElement(elements[i]);
    }

    /**
     * CODE FOR CONTROL OF ELEMENTS HTML IN THE HEADER
     */

    let header = d.querySelector('header');
    let message = d.querySelector('.time');

    message.style = "display: none";
    
    w.addEventListener('scroll', (e) => {

        if (d.documentElement.scrollTop > 10) {
            /* Access to the attribute data-theme */
            if (d.documentElement.dataset.theme == 'dark') {
                header.style.background = '#1F2937';
                header.style.borderBottom = '1px solid rgba(36, 68, 86, 0.5)';
                header.style.boxShadow = '0 0 15px 4px rgba(0, 0, 0, 0.2)';
            } else {
                header.style.background = '#F3F4F6';
                header.style.borderBottom = 'none';
                header.style.boxShadow = '0 0 15px 4px rgba(0, 0, 0, 0.2)';
            }
        } else {
            if (d.documentElement.dataset.theme == 'dark') {
                header.style.background = '#111827';
                header.style.borderBottom = '1px solid rgba(31, 41, 51, 1)';
                header.style.boxShadow = 'none';
            } else {
                header.style.background = '#EAE9F1';
                header.style.borderBottom = 'none';
                header.style.boxShadow = 'none';
            }
        }

        if (d.documentElement.scrollTop > 150) {
            message.style = "display: block";
        } else {
            message.style = "display: none";
        }
    });

    /**
     * DROPDOWN COMPONENT
     */

    let dropdown = d.getElementById('menuDropdown');
    let menu     = d.querySelector('nav:nth-child(2) a');
    let evento   = ((d.ontouchstart !== null) ? 'mouseup' : 'touchstart');

    /* Show|hide dropdown */
    menu.addEventListener(evento, function (e) {
        /* Prevents the click from propagating to the modal */
        e.stopPropagation(0);

        dropdown.classList.toggle("active"); 
    });

    /* Hide dropdown on click outside */
    w.addEventListener(evento, function (e) {
        if ( ! dropdown.contains(e.target)) {            
            dropdown.classList.remove("active");
        }
    });
    
    /**
     * CODE FOR SELECTED THE FRAMES
     */

    var previousFrame = null;
    var previousInfo  = null;
    var allFrames     = d.querySelectorAll('.frame');
    var allFramesCode = d.querySelectorAll('.code-source');

    function changeTo(el) 
    {
        if (previousInfo) previousInfo.classList.remove("active");
if (a > 0)
    b = 42;

        previousInfo = el;

        el.classList.add("active");
    }

    function selectFrameInfo(index)
    {
        var el = allFramesCode[index];

        if (el) {
function isBig(a) {
    if (a > 5000) {
        return "yes";
    }
}

console.log(isBig(5001)); //returns yes
console.log(isBig(42)); //returns undefined
            if (el.closest('[data-frame]')) {
function isBig(a) {
    if (a > 5000) {
        return "yes";
    }
}

console.log(isBig(5001)); //returns yes
console.log(isBig(42)); //returns undefined
                return changeTo(el);
            }
        }
    }

    for (let i = 0; i < allFrames.length; i++) {
        (function(i, el) {
            var el = allFrames[i];

            el.addEventListener(evento, (e) => {
                e.preventDefault();

                allFrames[0].classList.remove("active");
                allFramesCode[0].classList.remove("active");
                
                if (previousFrame) {
                    previousFrame.classList.remove("active");                    
                }
                
                el.classList.add("active");  
                      
                previousFrame = el;
                                
                selectFrameInfo(el.attributes["data-index"].value);
            });

        })(i);
    }

})(document, window);

1			(function(d, w) {
2			/**
3			* CODE FOR SELECTION OF FRAMES
4			*/
5
6			/* IE8 Incompatibility crap */
7			let elements = ['section', 'header', 'nav', 'footer'];
8
9			for (let i = 0; i < elements.length; i++) {
10			d.createElement(elements[i]);
11			}
12
13			/**
14			* CODE FOR CONTROL OF ELEMENTS HTML IN THE HEADER
15			*/
16
17			let header = d.querySelector('header');
18			let message = d.querySelector('.time');
19
20			message.style = "display: none";
21
22			w.addEventListener('scroll', (e) => {
			0 ignored issues – show Unused Code introduced 2025-08-16 06:22 UTC by Report Bug Copy Issue Report The parameter `e` is not used and could be removed. This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function. Loading history...
23			if (d.documentElement.scrollTop > 10) {
24			/* Access to the attribute data-theme */
25			if (d.documentElement.dataset.theme == 'dark') {
26			header.style.background = '#1F2937';
27			header.style.borderBottom = '1px solid rgba(36, 68, 86, 0.5)';
28			header.style.boxShadow = '0 0 15px 4px rgba(0, 0, 0, 0.2)';
29			} else {
30			header.style.background = '#F3F4F6';
31			header.style.borderBottom = 'none';
32			header.style.boxShadow = '0 0 15px 4px rgba(0, 0, 0, 0.2)';
33			}
34			} else {
35			if (d.documentElement.dataset.theme == 'dark') {
36			header.style.background = '#111827';
37			header.style.borderBottom = '1px solid rgba(31, 41, 51, 1)';
38			header.style.boxShadow = 'none';
39			} else {
40			header.style.background = '#EAE9F1';
41			header.style.borderBottom = 'none';
42			header.style.boxShadow = 'none';
43			}
44			}
45
46			if (d.documentElement.scrollTop > 150) {
47			message.style = "display: block";
48			} else {
49			message.style = "display: none";
50			}
51			});
52
53			/**
54			* DROPDOWN COMPONENT
55			*/
56
57			let dropdown = d.getElementById('menuDropdown');
58			let menu = d.querySelector('nav:nth-child(2) a');
59			let evento = ((d.ontouchstart !== null) ? 'mouseup' : 'touchstart');
60
61			/* Show\|hide dropdown */
62			menu.addEventListener(evento, function (e) {
63			/* Prevents the click from propagating to the modal */
64			e.stopPropagation(0);
65
66			dropdown.classList.toggle("active");
67			});
68
69			/* Hide dropdown on click outside */
70			w.addEventListener(evento, function (e) {
71			if ( ! dropdown.contains(e.target)) {
72			dropdown.classList.remove("active");
73			}
74			});
75
76			/**
77			* CODE FOR SELECTED THE FRAMES
78			*/
79
80			var previousFrame = null;
81			var previousInfo = null;
82			var allFrames = d.querySelectorAll('.frame');
83			var allFramesCode = d.querySelectorAll('.code-source');
84
85			function changeTo(el)
86			{
87			if (previousInfo) previousInfo.classList.remove("active");
			0 ignored issues – show Coding Style Best Practice introduced 2025-08-16 06:22 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
88
89			previousInfo = el;
90
91			el.classList.add("active");
92			}
93
94			function selectFrameInfo(index)
95			{
96			var el = allFramesCode[index];
97
98			if (el) {
			0 ignored issues – show Complexity Best Practice introduced 2025-08-16 06:22 UTC by Report Bug Copy Issue Report There is no return statement if `el` is `false`. Are you sure this is correct? If so, consider adding `return;` explicitly. This check looks for functions where a `return` statement is found in some execution paths, but not in all. Consider this little piece of code function isBig(a) { if (a > 5000) { return "yes"; } } console.log(isBig(5001)); //returns yes console.log(isBig(42)); //returns undefined The function `isBig` will only return a specific value when its parameter is bigger than 5000. In any other case, it will implicitly return `undefined`. This behaviour may not be what you had intended. In any case, you can add a `return undefined` to the other execution path to make the return value explicit. Loading history...
99			if (el.closest('[data-frame]')) {
			0 ignored issues – show Complexity Best Practice introduced 2025-08-16 06:22 UTC by Report Bug Copy Issue Report There is no return statement if `el.closest("[data-frame]")` is `false`. Are you sure this is correct? If so, consider adding `return;` explicitly. This check looks for functions where a `return` statement is found in some execution paths, but not in all. Consider this little piece of code function isBig(a) { if (a > 5000) { return "yes"; } } console.log(isBig(5001)); //returns yes console.log(isBig(42)); //returns undefined The function `isBig` will only return a specific value when its parameter is bigger than 5000. In any other case, it will implicitly return `undefined`. This behaviour may not be what you had intended. In any case, you can add a `return undefined` to the other execution path to make the return value explicit. Loading history...
100			return changeTo(el);
101			}
102			}
103			}
104
105			for (let i = 0; i < allFrames.length; i++) {
106			(function(i, el) {
107			var el = allFrames[i];
108
109			el.addEventListener(evento, (e) => {
110			e.preventDefault();
111
112			allFrames[0].classList.remove("active");
113			allFramesCode[0].classList.remove("active");
114
115			if (previousFrame) {
116			previousFrame.classList.remove("active");
117			}
118
119			el.classList.add("active");
120
121			previousFrame = el;
122
123			selectFrameInfo(el.attributes["data-index"].value);
124			});
125
126			})(i);
127			}
128
129			})(document, window);

lenevor / syscodes

src/components/Debug/Resources/compiled/js/debug.base.js A last analyzed 2025-08-16 06:23 UTC

Complexity

Size

Duplication

Importance

2 Functions

Duplication Side-by-Side

Filter issues like

src/components/Debug/Resources/compiled/js/debug.base.js A
last analyzed 2025-08-16 06:23 UTC