m2web.github.io/index.html at main · m2web/m2web.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<!DOCTYPE html>
<html lang="en" data-theme="hal">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Senior software developer in Covington, KY. Azure APIM, IBM API Connect, C# / JS / Python, and AI. 29+ years experience.">
    <title>Mark McFadden — Senior Software Developer | HAL 9000 Interface</title>
    <link rel="ICON" href="favicon.ico" type="image/ico" />
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700&family=Orbitron:wght@400;700&family=Space+Mono:wght@400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/2001.css">
</head>
<body>
    <header class="main-header">
        <h1 id="main-title"></h1>
        <nav class="main-nav">
            <a href="#status" data-tooltip="System Status Overview">DIAGNOSTICS</a>
            <a href="#about" data-tooltip="Crew Manifest Maintained by HAL 9000">CREW MANIFEST</a>
            <a href="#contact" data-tooltip="Active Transmission Channels">COMMS</a>
            <a href="documents/M2sAI3ResumeWord.pdf" target="_blank" rel="noopener" data-tooltip="Personnel File (PDF opens in new tab)">RESUME</a>
            <a href="https://m2.fyi" target="_blank" rel="noopener" data-tooltip="External Mission Logs (opens new tab)">LOGS</a>
        </nav>
    </header>

    <div class="hal-eye" id="hal-eye"></div>

    <!-- Sticky HAL eye that appears when scrolled past original -->
    <div class="hal-eye hal-eye-sticky" id="hal-eye-sticky"></div>

    <section id="status" class="monolith">
        <h2>SYSTEM DIAGNOSTICS [STATUS]</h2>
        <div class="diagnostics-grid">
        <div class="diagnostic-item">
            <span class="diagnostic-label">API Gateways (Azure APIM · IBM API Connect)</span>
            <span class="diagnostic-value status-blue">ACTIVE</span>
        </div>
        <div class="diagnostic-item">
            <span class="diagnostic-label">Generative AI (Azure OpenAI · Python · Hugging Face · Ollama)</span>
            <span class="diagnostic-value status-blue">ACTIVE</span>
        </div>
        <div class="diagnostic-item">
            <span class="diagnostic-label">RAG Pipelines (Embeddings · Retrieval · Evaluation)</span>
            <span class="diagnostic-value status-blue">ACTIVE</span>
        </div>
        <div class="diagnostic-item">
            <span class="diagnostic-label">Full-Stack (C# · Java)</span>
            <span class="diagnostic-value status-blue">STANDBY</span>
        </div>
        <div class="diagnostic-item">
            <span class="diagnostic-label">Network Administration</span>
            <span class="diagnostic-value status-archive">ARCHIVED</span>
        </div>
        <div class="diagnostic-item">
            <span class="diagnostic-label">Adjunct Faculty</span>
            <span class="diagnostic-value status-archive">ARCHIVED</span>
        </div>
        </div>
        <div class="interactive-diagnostics">
            <textarea id="diagnostic-command" placeholder="Start [INPUT] Here"></textarea>
            <button id="run-diagnostic">EXECUTE</button>
            <pre id="diagnostic-output"></pre>
        </div>
    </section>

    <section id="about" class="monolith">
        <h2>CREW MANIFEST [ABOUT]</h2>
        <p>Unit Designation: Mark McFadden</p>
        <p>Function: Senior Software Developer</p>
        <p>
        Operational History: 29+ years in Information Technologies. Experienced in enterprise API development and cloud-native systems,
        with recent work supporting Generative AI initiatives by assisting in the ingestion of enterprise data into
        Azure using Python. Deep expertise in Azure API Management, IBM API Connect, and full-stack application development
        with C#/.NET, Java, and Python. Actively building Azure DevOps pipelines with YAML, integrating Python-based
        Newman test runs for automated API quality validation. Experienced in deploying secure, cloud-native applications and mentoring teams in
        AI adoption. Formerly served as adjunct faculty at a university, teaching software development and IT governance.
        </p>
        <p>
    Primary Directive: To design, build, and optimize intelligent systems that <strong style="color: var(--accent-blue); font-size: 1.20em;">combine human insight with AI innovation</strong>,
        delivering secure, resilient, and practical solutions for business and individual use.
        </p>
    </section>

    <section id="contact" class="monolith">
        <h2>COMMS-LINK [CONTACT]</h2>
        <ul class="contact-list">
            <li><span class="comm-label">LOCATION:</span> <span class="comm-value">Covington, KY</span></li>
            <li><span class="comm-label">EMAIL:</span> <a href="mailto:m2web@yahoo.com">m2web@yahoo.com</a></li>
            <li><span class="comm-label">PHONE:</span> <span class="comm-value">859.750.1953</span></li>
            <li><span class="comm-label">RESUME:</span> <a href="documents/M2sAI3ResumeWord.pdf" target="_blank" rel="noopener">Download PDF</a></li>
        </ul>
    </section>

    <footer class="main-footer">
        <div class="social-links">
            <a href="https://github.com/m2web" target="_blank" aria-label="GitHub">[GitHub]</a>
            <a href="https://www.linkedin.com/in/m2web/" target="_blank" aria-label="LinkedIn">[LinkedIn]</a>
        </div>
        <p>&copy; 2025 MARK MCFADDEN :: ALL SYSTEMS FUNCTIONAL</p>
        <p style="font-size: 0.8rem; margin-top: 1rem;">HAL 9000 Interface</p>
    </footer>
    <script src="js/2001.js"></script>
    <script>
    // Sticky HAL eye functionality
    document.addEventListener('DOMContentLoaded', function() {
        const halEye = document.getElementById('hal-eye');
        const stickyEye = document.getElementById('hal-eye-sticky');

        function checkStickyVisibility() {
            const halEyeRect = halEye.getBoundingClientRect();

            // Show sticky eye when original eye is scrolled past
            if (halEyeRect.bottom < 0) {
                stickyEye.style.display = 'block';
            } else {
                stickyEye.style.display = 'none';
            }
        }

        // Listen for scroll events
        window.addEventListener('scroll', checkStickyVisibility);

        // Initial check
        checkStickyVisibility();
    });
    </script>
</body>
</html>