Apppublic
Draco228/notes

sourceHugging Facemitupdated 1y agoView on Hugging Face
0likes
index.html417 linesDownload Raw Back to root
1<!DOCTYPE html>2<html lang="en">3<head>4  <meta charset="UTF-8" />5  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>6  <title>BME NOTES</title>7  <script src="https://cdn.tailwindcss.com"></script>8  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">9  <style>10    body {11      font-family: 'Inter', sans-serif;12      display: flex;13      flex-direction: column;14      min-height: 100vh;15    }16    .dynamic-section { display: none; }17    .dynamic-section.active { display: block; }18    .dynamic-section {19      transition: opacity 0.3s ease-in-out;20      opacity: 0;21    }22    .dynamic-section.active {23      opacity: 1;24    }25    /* Custom scrollbar for webkit browsers (optional, for aesthetics) */26    ::-webkit-scrollbar {27      width: 8px;28    }29    ::-webkit-scrollbar-track {30      background: #f1f1f1;31      border-radius: 10px;32    }33    ::-webkit-scrollbar-thumb {34      background: #888;35      border-radius: 10px;36    }37    ::-webkit-scrollbar-thumb:hover {38      background: #555;39    }40  </style>41</head>42<body class="bg-slate-100">43  <header class="bg-sky-700 text-white py-5 shadow-lg sticky top-0 z-50">44    <h1 class="text-3xl md:text-4xl font-bold text-center">BME NOTES</h1>45  </header>46 47  <main class="container mx-auto mt-6 mb-6 p-4 md:p-6 flex-grow">48    <div id="mainMenu" class="dynamic-section bg-white p-6 md:p-8 rounded-xl shadow-xl">49      </div>50 51    <div id="semesterSection" class="dynamic-section bg-white p-6 md:p-8 rounded-xl shadow-xl">52      </div>53 54    <div id="subjectSection" class="dynamic-section bg-white p-6 md:p-8 rounded-xl shadow-xl">55      </div>56 57    <div id="topicSection" class="dynamic-section bg-white p-6 md:p-8 rounded-xl shadow-xl">58      </div>59  </main>60 61  <footer class="bg-sky-700 text-white py-4 text-center text-sm mt-auto">62    <p>&copy; Fall 2023 BME Students. All Rights Reserved.</p>63  </footer>64 65  <script>66    // --- Data Configuration ---67    // ==================================================================================================68    // SECTION 1: DEFINE YOUR SUBJECTS PER SEMESTER69    // ==================================================================================================70    const subjects = {71      1: ['Applied Physics', 'Basic Mathematics', 'Basic Electrical Engineering', 'Functional English', 'ICT', 'Islamic Studies'],72      2: ['Anatomy', 'Calculus', 'Circuit Analysis', 'Ideology Of Pakistan', 'OPP', 'Family Life'],73      3: ['Basic Electronics', 'Biochemistry', 'Physiology I', 'Linear Algebra', 'Expository Writing'],74      4: ['Sociology For Engineers', 'Civics and Community Engagement', 'Physiology II', 'CVT', 'Biomedical Electronics', 'Entrepreneurship'],75      5: ['Medical Instrumentation II', 'Digital Signal Processing', 'Biomedical Optics', 'Rehabilitation Engineering', 'Bioinformatics', 'Project Work Phase I']76      // To add Semester 6, uncomment and modify the line below:77      // 6: ['Advanced Biomechanics', 'Medical Robotics', 'Neural Engineering', 'Healthcare Analytics', 'Biomedical Ethics', 'Capstone Project'],78    };79 80    // ==================================================================================================81    // SECTION 2: DEFINE TOPICS FOR EACH SUBJECT82    // ==================================================================================================83    const topics = {};84 85    // --- Manual Topic Definitions for User-Provided Subjects ---86    topics['Civics and Community Engagement'] = [87      'Lecture 1', 'Lecture 2', 'Lecture 3', 'Lecture 4', 'Lecture 5', 'Lecture 6', 'Lecture 7', 'Lecture 8', 'Lecture 9 & 10', 'Mids Notes', 'Finals Notes'88    ];89    topics['Physiology II'] = [90      'Lecture 1', 'Lecture 2', 'Lecture 3', 'Lecture 4',91      'Cerebrum Cortical Areas Notes', 'Lymphatic system notes',92      'Pbl 1', 'Pbl 2', 'PBL 2 notes',93      'Mids Notes', 'Mids Scenario', 'Past Mids', 'Mids Key',94      'Final Notes'95    ];96    topics['CVT'] = [97        'Basics of Complex Variables',98        'Complex Variables',99        'Cauchy Integral Theorem',100        'Maclaurin Series',101        'Taylor Series'102    ];103    topics['Biomedical Electronics'] = [104      'Lecture 1', 'Lecture 2', 'Lecture 3', 'Lecture 4', 'Lecture 5',105      'Basic OP AMP Circuits', 'Biomedical Signals', 'Filters'106    ];107    topics['Entrepreneurship'] = [108      'Lecture 1', 'Lecture 2', 'Lecture 3', 'Lecture 4', 'Lecture 5', 'Lecture 6', 'Lecture 7', 'Lecture 8', 'Lecture 9', 'Quiz 1 Solution', 'PBL 2', 'Mids Notes', 'Mids Scenarios', 'Final Notes'109    ];110    // --- End of Manual Topic Definitions ---111 112    // Automatic placeholder topic generation for subjects NOT manually defined above113    Object.keys(subjects).forEach(semKey => {114      subjects[semKey].forEach(subject => {115        if (!topics[subject]) { // Only generate if not already manually defined116          const subjectTopics = [];117          for (let i = 1; i <= 8; i++) {118            subjectTopics.push(`Lecture ${i}`);119          }120          subjectTopics.push('Mids');121          subjectTopics.push('Final');122          topics[subject] = subjectTopics;123        }124      });125    });126 127    // ==================================================================================================128    // SECTION 3: DEFINE GOOGLE DRIVE LINKS FOR EACH TOPIC129    // ==================================================================================================130    const links = {131      // --- Civics and Community Engagement (Semester 4) ---132      'Civics and Community Engagement-Lecture 1': 'https://drive.google.com/file/d/1D4mOjuO492qgO8gRs5btlOT74Ss8bja2/view?usp=sharing',133      'Civics and Community Engagement-Lecture 2': 'https://drive.google.com/file/d/1kSlRMz9Qx6cBULzHgfpTXA7aaNeZbvDA/view?usp=sharing',134      'Civics and Community Engagement-Lecture 3': 'https://drive.google.com/file/d/1HeZ3ej8VFF4wWNWE22bDpmS6dADqQWeH/view?usp=sharing',135      'Civics and Community Engagement-Lecture 4': 'https://drive.google.com/file/d/1HrekCQRXuK_Eylq_fmHfHtSdHOrQbMRn/view?usp=sharing',136      'Civics and Community Engagement-Lecture 5': 'https://drive.google.com/file/d/1wQb8RzJzGgYI8qNkoyDeWJNLtLJiaWFI/view?usp=sharing',137      'Civics and Community Engagement-Lecture 6': 'https://drive.google.com/file/d/1dfZeytMrdLjAWw3i0_bVWRFaSKu8hPC5/view?usp=sharing',138      'Civics and Community Engagement-Lecture 7': 'https://drive.google.com/file/d/1JS8SOu0vBvQqMi2A-wYNlqorng1vcwEJ/view?usp=sharing',139      'Civics and Community Engagement-Lecture 8': 'https://drive.google.com/file/d/13s8a61REclNoG84CVH8hznO8uORWgbI8/view?usp=sharing',140      'Civics and Community Engagement-Lecture 9 & 10': 'https://drive.google.com/file/d/1evl24b76gouYw6VsUF6y9kGjZ4AaxFdI/view?usp=sharing',141      'Civics and Community Engagement-Mids Notes': 'https://drive.google.com/file/d/18p7LOke43Z5LNuPer53YqMZQyJn6qgFy/view?usp=sharing',142      'Civics and Community Engagement-Finals Notes': 'https://drive.google.com/file/d/1rTgyQ3vSWNBnBVWJR0JdxmxqZcztnD_6/view?usp=sharing',143 144      // --- Physiology II (Semester 4) ---145      'Physiology II-Lecture 1': 'https://docs.google.com/presentation/d/1N3E77KKbfqZp5lcNtVkGrBJur-5OgmvJ/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',146      'Physiology II-Lecture 2': 'https://drive.google.com/file/d/1jDZhhG4qgk07RG7jjQd_vE995O8BNJJp/view?usp=sharing',147      'Physiology II-Lecture 3': 'https://docs.google.com/presentation/d/1REGggBvl6wzxF6dCTWZZqWqOYyCD5hiL/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',148      'Physiology II-Lecture 4': 'https://docs.google.com/presentation/d/16QQ5aRKPmp2n1Q9CPh9fOuOaL5clMQ6L/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',149      'Physiology II-Cerebrum Cortical Areas Notes': 'https://drive.google.com/file/d/13oRljhgtDyW74Tx_QymDE7mV583hEOqi/view?usp=sharing',150      'Physiology II-Lymphatic system notes': 'https://docs.google.com/document/d/1-cJ8OxRwMFvC3eJ7p7DvdNJLNur-N9yp/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',151      'Physiology II-Pbl 1': 'https://docs.google.com/document/d/1wVFMW0u7p7UUBTfLC_qUFNt5z5P6-jwg/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',152      'Physiology II-Pbl 2': 'https://docs.google.com/document/d/15UUNRpW2CyKS7qCUM5CnSjCVt-UUfAG8/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',153      'Physiology II-PBL 2 notes': 'https://drive.google.com/file/d/1Wv3e5WPtEDVgGXUS8f5ffZdo6Q15Zp5a/view?usp=sharing',154      'Physiology II-Mids Notes': 'https://drive.google.com/file/d/1s4DGl-wXMydd5WNYYmdWlpx5yS-kUiuU/view?usp=sharing',155      'Physiology II-Mids Scenario': 'https://drive.google.com/file/d/1Xbl7HbwVNVbqrmqFZ6WkYPt_9_JGPfdI/view?usp=sharing',156      'Physiology II-Past Mids': 'https://drive.google.com/file/d/1DzReFYTUPsmsoP_YH2NkpkAMKhW3s7_e/view?usp=sharing',157      'Physiology II-Mids Key': 'https://docs.google.com/document/d/1zLmRh4eoBMqQq4UA1uK7MA_MV_vBBqdX/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',158      'Physiology II-Final Notes': 'https://drive.google.com/file/d/188aG-skIr0MPx6ckSHRhGpOmHizKZTjb/view?usp=sharing',159 160      // --- CVT (Semester 4) ---161      'CVT-Basics of Complex Variables': 'https://drive.google.com/file/d/1edToFkHGzZafKfYv0yWo65RJRUYdhWq3/view?usp=sharing',162      'CVT-Complex Variables': 'https://drive.google.com/file/d/1BixAL7rKYNGHsd-sgOkHu3vMDe63VK50/view?usp=sharing',163      'CVT-Cauchy Integral Theorem': 'https://drive.google.com/file/d/1zP4Mt5LEZtAUKJLbTLMJvm30aNr5Q5TR/view?usp=sharing',164      'CVT-Maclaurin Series': 'https://drive.google.com/file/d/171g4PmgqbmDNOqGmdKjkyaFADedtCIuy/view?usp=sharing',165      'CVT-Taylor Series': 'https://drive.google.com/file/d/163G4AcwVHOsp4bHLN0KRZz-HS6I4iqzV/view?usp=sharing',166 167      // --- Biomedical Electronics (Semester 4) ---168      'Biomedical Electronics-Lecture 1': 'https://docs.google.com/presentation/d/1Jrd7U0uV45huEUga5xPZyFv8G3xx-97B/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',169      'Biomedical Electronics-Lecture 2': 'https://docs.google.com/presentation/d/1kyNfx6lG4Fp73VJJ9ztLNAa_P3uNrLRO/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',170      'Biomedical Electronics-Lecture 3': 'https://docs.google.com/presentation/d/1Vqil5sw5Z6Weq3gnb_b_7mijVfUk8dBM/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',171      'Biomedical Electronics-Lecture 4': 'https://docs.google.com/presentation/d/1X9S7E1McM_scZKpaqU3nX2G0-utbx0Vp/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',172      'Biomedical Electronics-Lecture 5': 'https://docs.google.com/presentation/d/1lMOyBf7pFoHnEn-6QVzU_6AvbcyfMNe2/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',173      'Biomedical Electronics-Basic OP AMP Circuits': 'https://docs.google.com/presentation/d/1cAajZfFlEy0Zc__9yssD2UevY0hNdaXu/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',174      'Biomedical Electronics-Biomedical Signals': 'https://docs.google.com/presentation/d/1cAajZfFlEy0Zc__9yssD2UevY0hNdaXu/edit?usp=sharing&ouid=108256279657663147525&rtpof=true&sd=true',175      'Biomedical Electronics-Filters': 'https://drive.google.com/file/d/16DrTU9_UYFJbLoNQa9GyZGkA9Ku0ru62/view?usp=sharing',176 177      // --- Entrepreneurship (Semester 4) ---178      'Entrepreneurship-Lecture 1': 'https://drive.google.com/file/d/1I4pLjf3p4c5eg4H5kDTx-FSph3qPhziJ/view?usp=sharing',179      'Entrepreneurship-Lecture 2': 'https://drive.google.com/file/d/1gT2r0BLgyq14dmKqlhkqwt1XSIT5lRBM/view?usp=sharing',180      'Entrepreneurship-Lecture 3': 'https://drive.google.com/file/d/1X5Y_2UJqIfLqJVfOrwjRh5RHDQ7IN7if/view?usp=sharing',181      'Entrepreneurship-Lecture 4': 'https://drive.google.com/file/d/1NsaNsFYlR7bdb4c81e3SiM2Ep-uCb03K/view?usp=sharing',182      'Entrepreneurship-Lecture 5': 'https://drive.google.com/file/d/1wd4aMYt5Zc8KgKOLlUWqyqaNuFUjCWpy/view?usp=sharing',183      'Entrepreneurship-Lecture 6': 'https://drive.google.com/file/d/1P7dhPmVDFsIZy67REwuZrnRoHvxjEw1a/view?usp=sharing',184      'Entrepreneurship-Lecture 7': 'https://drive.google.com/file/d/1fOfsvXxc1s_pdWVH3mMHvqa6XGn7f0o0/view?usp=sharing',185      'Entrepreneurship-Lecture 8': 'https://drive.google.com/file/d/1z_V_UfvSPPrgBHg1I__QTATpdkPTe8iD/view?usp=sharing',186      'Entrepreneurship-Lecture 9': 'https://drive.google.com/file/d/13TAwy0eaP_dSU_IQGSNQiunZQOpFvTS_/view?usp=sharing',187      'Entrepreneurship-Quiz 1 Solution': 'https://drive.google.com/file/d/1r0d7jAl1J4h_MXejrXswiFP-F_PpX-xi/view?usp=sharing',188      'Entrepreneurship-PBL 2': 'https://drive.google.com/file/d/1xXxD3HKsSVwY7lq6RCNhA_o5X6Q-KJ6N/view?usp=sharing',189      'Entrepreneurship-Mids Notes': 'https://drive.google.com/file/d/1-llL12DVeGW3qaype2PNNXTSXtawKoRN/view?usp=sharing',190      'Entrepreneurship-Mids Scenarios': 'https://drive.google.com/file/d/1hIAVKXuGjCKY6jgzJT1YBOpY_EPRToSw/view?usp=sharing',191      'Entrepreneurship-Final Notes': 'https://drive.google.com/file/d/1TpZRZnHZTGgikJfTqy-FSZbL4n6xPnHf/view?usp=sharing',192 193      // --- Retaining original example placeholders for other subjects not updated (modify or remove as needed) ---194      'Applied Physics-Lecture 1': 'https://drive.google.com/your_link_for_S1_AppliedPhysics_Lec1',195      'Applied Physics-Mids': 'https://drive.google.com/your_link_for_S1_AppliedPhysics_Mids',196      'Basic Mathematics-Lecture 1': 'https://drive.google.com/your_link_for_S1_BasicMath_Lec1',197      'Biochemistry-Lecture 1': 'https://drive.google.com/your_link_for_S3_Biochem_Lec1',198    };199    // ==================================================================================================200    // END OF DATA CONFIGURATION201    // ==================================================================================================202 203 204    // --- DOM Elements ---205    const mainMenuDiv = document.getElementById('mainMenu');206    const semesterSectionDiv = document.getElementById('semesterSection');207    const subjectSectionDiv = document.getElementById('subjectSection');208    const topicSectionDiv = document.getElementById('topicSection');209 210    // --- State Variables ---211    let currentSemester;212    let currentSubject;213 214    // --- Helper Function for Button Creation ---215    function createButton(text, onClickHandler, type = 'primary', additionalClasses = '') {216      const button = document.createElement('button');217      let baseClasses = 'w-full sm:w-auto text-white font-semibold py-3 px-6 rounded-lg shadow-md hover:shadow-lg transition duration-200 ease-in-out transform hover:-translate-y-0.5 focus:outline-none focus:ring-2 focus:ring-opacity-50 m-2';218      219      if (type === 'primary') {220        baseClasses += ' bg-sky-600 hover:bg-sky-700 focus:ring-sky-500';221      } else if (type === 'secondary') {222        baseClasses += ' bg-slate-500 hover:bg-slate-600 focus:ring-slate-400';223      } else if (type === 'action') {224        baseClasses += ' bg-emerald-500 hover:bg-emerald-600 focus:ring-emerald-400';225      } else if (type === 'searchResult') {226        baseClasses = 'w-full text-left text-sky-700 font-medium py-3 px-4 rounded-lg bg-sky-50 hover:bg-sky-100 border border-sky-200 shadow-sm hover:shadow-md transition duration-150 ease-in-out m-1 focus:outline-none focus:ring-2 focus:ring-sky-500 focus:ring-opacity-75';227      }228      button.className = `${baseClasses} ${additionalClasses}`;229      button.textContent = text;230      if (onClickHandler) button.onclick = onClickHandler;231      return button;232    }233 234    // --- Navigation Functions ---235    function showSection(sectionId) {236      [mainMenuDiv, semesterSectionDiv, subjectSectionDiv, topicSectionDiv].forEach(div => {237        div.classList.toggle('active', div.id === sectionId);238      });239      window.scrollTo({ top: 0, behavior: 'smooth' });240    }241    242    function renderMainMenu() {243      mainMenuDiv.innerHTML = `244        <h2 class="text-2xl md:text-3xl font-bold text-sky-800 mb-6 text-center">Find Notes</h2>245        <div class="mb-8 px-2 md:px-0 max-w-2xl mx-auto">246          <div class="flex flex-col sm:flex-row items-center gap-2 p-2 bg-slate-50 rounded-lg border border-slate-300 shadow-sm">247            <input type="text" id="searchInput" placeholder="Search for topics (e.g., Anatomy Lecture 3)..." class="flex-grow w-full sm:w-auto p-3 border border-slate-300 rounded-md focus:ring-2 focus:ring-sky-500 focus:border-sky-500 outline-none transition-shadow">248            <button id="searchButton" class="w-full sm:w-auto bg-sky-600 hover:bg-sky-700 text-white font-semibold py-3 px-6 rounded-md shadow-sm hover:shadow-md transition duration-150 ease-in-out focus:outline-none focus:ring-2 focus:ring-sky-500 focus:ring-opacity-50">249              <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block mr-1 -mt-0.5" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd" /></svg>250              Search251            </button>252          </div>253          <div id="searchResults" class="mt-6 space-y-2"></div>254        </div>255        <hr class="my-8 border-slate-300">256        <h2 class="text-2xl md:text-3xl font-bold text-sky-800 mb-6 text-center">Or Browse by Semester</h2>257      `;258      259      const semesterButtonContainer = document.createElement('div');260      semesterButtonContainer.className = 'flex flex-wrap justify-center items-center';261      Object.keys(subjects).forEach(sem => {262        const button = createButton(`Semester ${sem}`, () => showSemesterView(sem));263        semesterButtonContainer.appendChild(button);264      });265      mainMenuDiv.appendChild(semesterButtonContainer);266 267      document.getElementById('searchButton').onclick = performSearch;268      document.getElementById('searchInput').addEventListener('keypress', function(event) {269        if (event.key === 'Enter') {270          performSearch();271        }272      });273      showSection('mainMenu');274    }275 276    function performSearch() {277      const searchTerm = document.getElementById('searchInput').value.toLowerCase().trim();278      const resultsContainer = document.getElementById('searchResults');279      resultsContainer.innerHTML = ''; 280 281      if (!searchTerm) {282        resultsContainer.innerHTML = `<p class="text-slate-600 text-center">Please enter a search term.</p>`;283        return;284      }285 286      let foundResults = false;287      const resultsFragment = document.createDocumentFragment();288      const addedResults = new Set(); // To avoid duplicate search results289 290      Object.keys(subjects).forEach(sem => {291        subjects[sem].forEach(subject => {292          if (topics[subject]) {293            topics[subject].forEach(topic => {294              const fullSearchableText = `${subject.toLowerCase()} ${topic.toLowerCase()}`;295              const resultId = `${subject}-${topic}-${sem}`; // Unique ID for the result296              if (fullSearchableText.includes(searchTerm) && !addedResults.has(resultId)) {297                foundResults = true;298                const resultText = `${topic} (Subject: ${subject}, Sem: ${sem})`;299                const resultButton = createButton(300                  resultText, 301                  () => showTopicLink(subject, topic, sem), 302                  'searchResult'303                );304                resultsFragment.appendChild(resultButton);305                addedResults.add(resultId);306              }307            });308          }309        });310      });311      312      if (foundResults) {313        resultsContainer.appendChild(resultsFragment);314      } else {315        resultsContainer.innerHTML = `<p class="text-red-600 font-semibold text-center">No topics found matching "${document.getElementById('searchInput').value}". Try searching subject name as well.</p>`;316      }317    }318 319    function showSemesterView(sem) {320      currentSemester = sem;321      semesterSectionDiv.innerHTML = `<h2 class="text-2xl md:text-3xl font-bold text-sky-800 mb-6 text-center">Semester ${sem} - Select Subject</h2>`;322      const buttonContainer = document.createElement('div');323      buttonContainer.className = 'flex flex-wrap justify-center items-center';324 325      subjects[sem].forEach(sub => {326        const button = createButton(sub, () => showSubjectView(sub, sem));327        buttonContainer.appendChild(button);328      });329      semesterSectionDiv.appendChild(buttonContainer);330      331      const backButtonDiv = document.createElement('div');332      backButtonDiv.className = 'mt-8 text-center';333      const backButton = createButton('Back to Home', () => renderMainMenu(), 'secondary');334      backButtonDiv.appendChild(backButton);335      semesterSectionDiv.appendChild(backButtonDiv);336      showSection('semesterSection');337    }338 339    function showSubjectView(subject, semester) {340      currentSubject = subject;341      currentSemester = semester; 342      subjectSectionDiv.innerHTML = `<h2 class="text-2xl md:text-3xl font-bold text-sky-800 mb-6 text-center">${subject} - Select Topic</h2>`;343      const buttonContainer = document.createElement('div');344      buttonContainer.className = 'flex flex-wrap justify-center items-center';345 346      if (topics[subject] && topics[subject].length > 0) {347        topics[subject].forEach(top => {348          const button = createButton(top, () => showTopicLink(subject, top, semester));349          buttonContainer.appendChild(button);350        });351      } else {352        buttonContainer.innerHTML = `<p class="text-slate-600 text-center">No topics available for this subject yet.</p>`;353      }354      subjectSectionDiv.appendChild(buttonContainer);355      356      const backButtonDiv = document.createElement('div');357      backButtonDiv.className = 'mt-8 text-center';358      const backButton = createButton('Back to Subjects', () => showSemesterView(semester), 'secondary');359      backButtonDiv.appendChild(backButton);360      subjectSectionDiv.appendChild(backButtonDiv);361      showSection('subjectSection');362    }363 364    function showTopicLink(subject, topic, semester) {365      topicSectionDiv.innerHTML = `366        <div class="text-center">367          <h2 class="text-2xl md:text-3xl font-bold text-sky-800 mb-2">${topic}</h2>368          <p class="text-slate-600 text-lg mb-1">Subject: ${subject}</p>369          <p class="text-slate-500 text-md mb-6">Semester: ${semester}</p>370          <p class="text-sm text-slate-700 bg-sky-50 p-3 rounded-md border border-sky-200 inline-block mb-6">371            Access the study materials for this topic, typically hosted on Google Drive.372          </p>373        </div>374      `;375      const buttonContainer = document.createElement('div');376      buttonContainer.className = 'flex flex-col items-center space-y-4';377 378      const key = `${subject}-${topic}`;379      const link = links[key] || "#"; 380 381      const openNotesButton = createButton('', () => {382        if (link && link !== "#" && !link.includes("your_link_for_")) {383          window.open(link, '_blank');384        } else {385          const topicDiv = document.getElementById('topicSection');386          let messageDiv = topicDiv.querySelector('.link-placeholder-message');387          if (!messageDiv) {388            messageDiv = document.createElement('p');389            messageDiv.className = 'link-placeholder-message text-orange-600 font-semibold text-center mt-4';390            buttonContainer.parentNode.insertBefore(messageDiv, buttonContainer);391          }392          messageDiv.textContent = 'The link for this topic has not been set up yet.';393        }394      }, 'action', 'w-full md:w-auto max-w-xs');395 396      openNotesButton.innerHTML = `397        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 inline-block mr-2" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">398          <path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z"></path>399          <path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z"></path>400        </svg>401        Open Notes402      `;403      buttonContainer.appendChild(openNotesButton);404      405      const backButton = createButton('Back to Topics', () => showSubjectView(subject, semester), 'secondary', 'w-full md:w-auto max-w-xs');406      buttonContainer.appendChild(backButton);407      408      topicSectionDiv.appendChild(buttonContainer);409      showSection('topicSection');410    }411 412    // --- Initial Load ---413    renderMainMenu();414 415  </script>416</body>417</html>