Matric Accounting Study Guide: Inventory Valuation & VAT<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n <style>\n body {\n font-family: 'Inter', sans-serif;\n background-color: #f1f5f9; \/* slate-100 *\/\n touch-action: pan-y;\n }\n .guide-container {\n min-height: 480px;\n }\n .content-card {\n opacity: 0;\n transform: translateX(20px);\n transition: opacity 0.4s ease-out, transform 0.4s ease-out;\n will-change: opacity, transform;\n }\n .content-card.active {\n opacity: 1;\n transform: translateX(0);\n }\n .progress-bar-inner {\n transition: width 0.3s ease-in-out;\n }\n .topic-button, .quiz-action-button {\n transition: all 0.2s ease-in-out;\n }\n .topic-button:hover, .quiz-action-button:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 20px rgba(16, 185, 129, 0.2);\n }\n ::selection {\n background: #059669; \/* emerald-600 *\/\n color: #ffffff;\n }\n <\/style>\n<\/head>\n<body class=\"bg-slate-100 text-slate-800 flex items-center justify-center min-h-screen p-4\">\n\n <div class=\"w-full max-w-4xl mx-auto\">\n <header class=\"text-center mb-6\">\n <h1 class=\"text-3xl md:text-4xl font-bold text-emerald-600\">Matric Accounting Study Guide<\/h1>\n <p class=\"text-slate-500 mt-2\">Your interactive guide to mastering the final exams.<\/p>\n <\/header>\n\n <main id=\"app-container\" class=\"bg-white rounded-xl shadow-lg shadow-emerald-500\/10 p-6 md:p-8 relative\">\n <div class=\"absolute top-4 right-6 text-xs text-slate-400 font-semibold\">created by Wise Excellence<\/div>\n \n \n <div id=\"main-menu\">\n <h2 class=\"text-2xl font-semibold mb-6 text-center text-emerald-700\">Select a Topic to Begin<\/h2>\n <div id=\"topic-grid\" class=\"grid grid-cols-1 md:grid-cols-2 gap-5\">\n \n <\/div>\n <\/div>\n\n \n <div id=\"study-guide\" class=\"hidden\">\n <button id=\"back-to-menu\" class=\"mb-4 text-sm font-medium text-emerald-600 hover:text-emerald-500\">← Back to Topics<\/button>\n \n <div id=\"guide-content-wrapper\" class=\"guide-container relative flex items-center justify-center\">\n \n <\/div>\n\n \n <div class=\"mt-6\">\n <div class=\"flex justify-between items-center mb-2\">\n <span id=\"progress-text\" class=\"text-sm text-slate-500\"><\/span>\n <span id=\"topic-title\" class=\"text-sm font-semibold text-slate-600\"><\/span>\n <\/div>\n <div class=\"w-full bg-slate-200 rounded-full h-2.5\">\n <div id=\"progress-bar\" class=\"bg-emerald-500 h-2.5 rounded-full progress-bar-inner\"><\/div>\n <\/div>\n <div id=\"navigation-buttons\" class=\"flex justify-between items-center mt-4\">\n \n <\/div>\n <\/div>\n <\/div>\n <\/main>\n <footer class=\"text-center mt-6\">\n <p class=\"text-xs text-slate-400\">Based on the South African CAPS curriculum guidelines.<\/p>\n <\/footer>\n <\/div>\n \n \n <div id=\"quiz-modal\" class=\"fixed inset-0 bg-black bg-opacity-60 hidden items-center justify-center p-4 backdrop-blur-sm\">\n <div id=\"quiz-content\" class=\"bg-white border border-emerald-500\/20 rounded-lg shadow-2xl p-6 w-full max-w-2xl max-h-[90vh] overflow-y-auto\">\n \n <\/div>\n <\/div>\n\n\n <script>\n document.addEventListener('DOMContentLoaded', () => {\n const studyData = [\n {\n topic: \"Inventory Valuation & VAT\",\n content: [\n { title: \"Valuing Your Stock\", text: \"Inventory Valuation is crucial because it directly affects your Cost of Sales and Gross Profit. You need to master three key methods: FIFO, Weighted-Average, and Specific Identification.\" },\n { title: \"FIFO Method\", text: \"FIFO stands for 'First-In, First-Out'. It assumes the first goods you buy are the first ones you sell. This means your closing stock is valued at the cost of your most recent purchases. This method is common for perishable goods.\" },\n { title: \"Weighted-Average Method\", text: \"This method calculates an average cost per unit for all goods available (opening stock + all purchases). This average cost is then used to value both the items you sold (Cost of Sales) and the items you have left (Closing Stock). It smooths out price fluctuations.\" },\n { title: \"Specific Identification Method\", text: \"This method is used for unique, high-value items like cars or jewellery. Each item is tracked with its specific cost, so the exact cost of the closing stock is known. It's precise but not practical for businesses with large volumes of similar items.\" },\n { title: \"Understanding VAT\", text: \"Value Added Tax (VAT) is a tax on goods and services. You need to calculate Output VAT (on your sales, which you owe to SARS) and Input VAT (on your purchases, which you can claim back from SARS). The difference is what you either pay to or receive from SARS.\" },\n { title: \"Calculating VAT\", text: \"The key is to distinguish between VAT-exclusive and VAT-inclusive prices. For an inclusive price, you calculate the VAT amount by multiplying by (VAT rate \/ (100 + VAT rate)), for example, 15\/115. For an exclusive price, you simply multiply by the VAT rate (e.g., 15%).\" }\n ],\n quiz: [\n { question: \"Which inventory valuation method values closing stock at the most recent purchase prices?\", options: [\"Weighted-Average\", \"Specific Identification\", \"FIFO\", \"Periodic Method\"], answer: \"FIFO\" },\n { question: \"A car dealership would most likely use which inventory valuation method?\", options: [\"FIFO\", \"Weighted-Average\", \"Specific Identification\", \"LIFO\"], answer: \"Specific Identification\" },\n { title: \"VAT on Sales\", text: \"The VAT a business collects on behalf of the government from the sale of goods and services is known as...\", options: [\"Input VAT\", \"Output VAT\", \"Exempt VAT\", \"Zero-Rated VAT\"], answer: \"Output VAT\" },\n { question: \"If an item costs R200 (VAT exclusive) and VAT is 15%, what is the Input VAT?\", options: [\"R20\", \"R23\", \"R30\", \"R15\"], answer: \"R30\" },\n { question: \"If an item's price is R115 (VAT inclusive) and VAT is 15%, what is the VAT amount?\", options: [\"R15\", \"R11.50\", \"R17.25\", \"R100\"], answer: \"R15\" }\n ]\n }\n ];\n\n const mainMenu = document.getElementById('main-menu');\n const studyGuide = document.getElementById('study-guide');\n const topicGrid = document.getElementById('topic-grid');\n const guideContainer = document.getElementById('guide-content-wrapper');\n const progressBar = document.getElementById('progress-bar');\n const progressText = document.getElementById('progress-text');\n const topicTitleEl = document.getElementById('topic-title');\n const backToMenuBtn = document.getElementById('back-to-menu');\n const quizModal = document.getElementById('quiz-modal');\n const quizContent = document.getElementById('quiz-content');\n const navigationButtons = document.getElementById('navigation-buttons');\n\n let currentTopicIndex = 0;\n let currentSectionIndex = 0;\n\n function initializeMenu() {\n topicGrid.innerHTML = '';\n studyData.forEach((topicData, index) => {\n const button = document.createElement('button');\n button.className = `topic-button bg-white p-6 rounded-lg shadow-md text-left border border-emerald-500\/20 hover:bg-slate-50 ${studyData.length === 1 ? 'md:col-span-2' : ''}`;\n button.innerHTML = `\n <h3 class=\"text-xl font-semibold text-emerald-600\">${topicData.topic}<\/h3>\n <p class=\"text-slate-500 mt-1 text-sm\">${topicData.content.length} sections<\/p>\n `;\n button.onclick = () => startTopic(index);\n topicGrid.appendChild(button);\n });\n }\n\n function startTopic(topicIndex) {\n currentTopicIndex = topicIndex;\n currentSectionIndex = 0;\n mainMenu.classList.add('hidden');\n studyGuide.classList.remove('hidden');\n renderSection();\n }\n\n function backToMenu() {\n mainMenu.classList.remove('hidden');\n studyGuide.classList.add('hidden');\n }\n\n function renderSection() {\n const section = studyData[currentTopicIndex].content[currentSectionIndex];\n guideContainer.innerHTML = `\n <div class=\"content-card text-center p-4 w-full\">\n <h2 class=\"text-2xl font-bold mb-4 text-emerald-600\">${section.title}<\/h2>\n <div class=\"text-slate-700 leading-relaxed min-h-[250px] text-left\">${section.text}<\/div>\n <\/div>\n `;\n \n setTimeout(() => {\n guideContainer.querySelector('.content-card')?.classList.add('active');\n }, 50);\n\n updateNavigation();\n }\n \n function handleQuiz() {\n quizModal.style.display = 'flex';\n const quizData = studyData[currentTopicIndex].quiz;\n if (quizData && quizData.length > 0) {\n renderQuiz(quizData);\n } else {\n quizContent.innerHTML = `<p class=\"text-yellow-500 text-center\">No quiz available for this topic.<\/p> <button onclick=\"document.getElementById('quiz-modal').style.display='none'\" class=\"mt-4 bg-slate-200 py-2 px-4 rounded\">Close<\/button>`;\n }\n }\n\n function renderQuiz(quizData) {\n let quizHTML = `<h2 class=\"text-2xl font-bold mb-6 text-center text-emerald-600\">Quiz on ${studyData[currentTopicIndex].topic}<\/h2>`;\n quizData.forEach((q, index) => {\n quizHTML += `<div class=\"mb-6\" data-answer=\"${q.answer.replace(\/\"\/g, '"')}\">\n <p class=\"font-semibold mb-3 text-slate-800\">${index + 1}. ${q.question}<\/p>\n <div class=\"space-y-2 text-slate-700\">`;\n q.options.forEach(opt => {\n quizHTML += `<label class=\"flex items-center p-3 rounded-lg border border-slate-200 cursor-pointer hover:bg-slate-100 has-[:checked]:bg-emerald-100 has-[:checked]:border-emerald-400\">\n <input type=\"radio\" name=\"q${index}\" value=\"${opt.replace(\/\"\/g, '"')}\" class=\"mr-3 w-4 h-4 text-emerald-600 bg-slate-100 border-slate-300 focus:ring-emerald-500 focus:ring-2\">\n <span>${opt}<\/span>\n <\/label>`;\n });\n quizHTML += `<\/div><p class=\"result-text mt-2 text-sm font-medium hidden\"><\/p><\/div>`;\n });\n quizHTML += `<div class=\"flex justify-between items-center mt-6\">\n <button id=\"close-quiz-btn\" class=\"bg-slate-500 hover:bg-slate-600 text-white font-bold py-2 px-4 rounded-lg\">Close<\/button>\n <button id=\"submit-quiz-btn\" class=\"bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-2 px-4 rounded-lg\">Check Answers<\/button>\n <\/div>`;\n quizContent.innerHTML = quizHTML;\n document.getElementById('submit-quiz-btn').addEventListener('click', () => {\n quizData.forEach((q, index) => {\n const container = quizContent.querySelectorAll('div[data-answer]')[index];\n const selected = container.querySelector(`input[name=\"q${index}\"]:checked`);\n const resultText = container.querySelector('.result-text');\n resultText.classList.remove('hidden');\n if (selected) {\n if (selected.value === q.answer) {\n resultText.textContent = 'Correct!';\n resultText.className = 'result-text mt-2 text-sm font-medium text-green-600';\n } else {\n resultText.textContent = `Incorrect. The correct answer is: ${q.answer}`;\n resultText.className = 'result-text mt-2 text-sm font-medium text-red-600';\n }\n } else {\n resultText.textContent = 'No answer selected.';\n resultText.className = 'result-text mt-2 text-sm font-medium text-yellow-600';\n }\n });\n document.getElementById('submit-quiz-btn').disabled = true;\n });\n document.getElementById('close-quiz-btn').addEventListener('click', () => quizModal.style.display = 'none');\n }\n\n function updateNavigation() {\n navigationButtons.innerHTML = '';\n const topic = studyData[currentTopicIndex];\n const totalSections = topic.content.length;\n const progressPercentage = ((currentSectionIndex + 1) \/ totalSections) * 100;\n progressBar.style.width = `${progressPercentage}%`;\n progressText.textContent = `Section ${currentSectionIndex + 1} of ${totalSections}`;\n topicTitleEl.textContent = topic.topic;\n\n const prevButton = document.createElement('button');\n prevButton.id = 'prev-btn';\n prevButton.className = 'bg-slate-200 hover:bg-slate-300 text-slate-700 font-bold py-2 px-6 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed';\n prevButton.textContent = 'Previous';\n prevButton.onclick = navigatePrev;\n prevButton.disabled = currentSectionIndex === 0;\n \n const nextButton = document.createElement('button');\n nextButton.id = 'next-btn';\n \n if (currentSectionIndex === totalSections - 1) {\n nextButton.className = 'quiz-action-button bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-6 rounded-lg transition-colors';\n nextButton.textContent = 'Finish Topic';\n nextButton.onclick = backToMenu;\n const quizButton = document.createElement('button');\n quizButton.id = 'quiz-btn';\n quizButton.className = 'quiz-action-button bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-2 px-6 rounded-lg';\n quizButton.textContent = '\u270d\ufe0f Take Quiz';\n quizButton.onclick = handleQuiz;\n navigationButtons.appendChild(prevButton);\n navigationButtons.appendChild(quizButton);\n navigationButtons.appendChild(nextButton);\n } else {\n nextButton.className = 'bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-2 px-6 rounded-lg transition-colors';\n nextButton.textContent = 'Next';\n nextButton.onclick = navigateNext;\n navigationButtons.appendChild(prevButton);\n navigationButtons.appendChild(nextButton);\n }\n }\n \n function navigateNext() {\n if (currentSectionIndex < studyData[currentTopicIndex].content.length - 1) {\n currentSectionIndex++;\n renderSection();\n }\n }\n\n function navigatePrev() {\n if (currentSectionIndex > 0) {\n currentSectionIndex--;\n renderSection();\n }\n }\n\n let touchstartX = 0;\n guideContainer.addEventListener('touchstart', e => { touchstartX = e.changedTouches[0].screenX; }, { passive: true });\n guideContainer.addEventListener('touchend', e => {\n let touchendX = e.changedTouches[0].screenX;\n if (touchendX < touchstartX - 50) { \/\/ Swipe Left\n const nextBtn = document.getElementById('next-btn') || document.querySelector('.quiz-action-button[onclick=\"backToMenu()\"]');\n if(nextBtn) nextBtn.click();\n }\n if (touchendX > touchstartX + 50) { \/\/ Swipe Right\n document.getElementById('prev-btn')?.click();\n }\n }, { passive: true });\n \n backToMenuBtn.addEventListener('click', backToMenu);\n document.addEventListener('keydown', (e) => {\n if(studyGuide.classList.contains('hidden') || quizModal.style.display === 'flex') return;\n if (e.key === 'ArrowRight') {\n const nextBtn = document.getElementById('next-btn') || document.querySelector('.quiz-action-button[onclick=\"backToMenu()\"]');\n if(nextBtn) nextBtn.click();\n }\n if (e.key === 'ArrowLeft') document.getElementById('prev-btn')?.click();\n });\n\n \/\/ If there's only one topic, start it automatically\n if (studyData.length === 1) {\n startTopic(0);\n } else {\n initializeMenu();\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n<span style=\"text-decoration-style: initial;\">See Other Topic<\/span>s\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"categories":[18,23],"tags":[24],"class_list":["post-739","page","type-page","status-publish","hentry","category-grade-12","category-high-school","tag-exam-tool-kit"],"_links":{"self":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages\/739","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/comments?post=739"}],"version-history":[{"count":5,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages\/739\/revisions"}],"predecessor-version":[{"id":1079,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages\/739\/revisions\/1079"}],"wp:attachment":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/media?parent=739"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/categories?post=739"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/tags?post=739"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":739,"date":"2025-09-12T01:51:28","date_gmt":"2025-09-12T01:51:28","guid":{"rendered":"https:\/\/wiseexcellence.co.za\/high-school\/?page_id=739"},"modified":"2026-02-01T15:42:24","modified_gmt":"2026-02-01T15:42:24","slug":"inventory","status":"publish","type":"page","link":"https:\/\/wiseexcellence.co.za\/high-school\/inventory\/","title":{"rendered":"Inventory Valuation"},"content":{"rendered":"\n\n\n\n\n\n \n \n Matric Accounting Study Guide: Inventory Valuation & VAT<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n <style>\n body {\n font-family: 'Inter', sans-serif;\n background-color: #f1f5f9; \/* slate-100 *\/\n touch-action: pan-y;\n }\n .guide-container {\n min-height: 480px;\n }\n .content-card {\n opacity: 0;\n transform: translateX(20px);\n transition: opacity 0.4s ease-out, transform 0.4s ease-out;\n will-change: opacity, transform;\n }\n .content-card.active {\n opacity: 1;\n transform: translateX(0);\n }\n .progress-bar-inner {\n transition: width 0.3s ease-in-out;\n }\n .topic-button, .quiz-action-button {\n transition: all 0.2s ease-in-out;\n }\n .topic-button:hover, .quiz-action-button:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 20px rgba(16, 185, 129, 0.2);\n }\n ::selection {\n background: #059669; \/* emerald-600 *\/\n color: #ffffff;\n }\n <\/style>\n<\/head>\n<body class=\"bg-slate-100 text-slate-800 flex items-center justify-center min-h-screen p-4\">\n\n <div class=\"w-full max-w-4xl mx-auto\">\n <header class=\"text-center mb-6\">\n <h1 class=\"text-3xl md:text-4xl font-bold text-emerald-600\">Matric Accounting Study Guide<\/h1>\n <p class=\"text-slate-500 mt-2\">Your interactive guide to mastering the final exams.<\/p>\n <\/header>\n\n <main id=\"app-container\" class=\"bg-white rounded-xl shadow-lg shadow-emerald-500\/10 p-6 md:p-8 relative\">\n <div class=\"absolute top-4 right-6 text-xs text-slate-400 font-semibold\">created by Wise Excellence<\/div>\n \n \n <div id=\"main-menu\">\n <h2 class=\"text-2xl font-semibold mb-6 text-center text-emerald-700\">Select a Topic to Begin<\/h2>\n <div id=\"topic-grid\" class=\"grid grid-cols-1 md:grid-cols-2 gap-5\">\n \n <\/div>\n <\/div>\n\n \n <div id=\"study-guide\" class=\"hidden\">\n <button id=\"back-to-menu\" class=\"mb-4 text-sm font-medium text-emerald-600 hover:text-emerald-500\">← Back to Topics<\/button>\n \n <div id=\"guide-content-wrapper\" class=\"guide-container relative flex items-center justify-center\">\n \n <\/div>\n\n \n <div class=\"mt-6\">\n <div class=\"flex justify-between items-center mb-2\">\n <span id=\"progress-text\" class=\"text-sm text-slate-500\"><\/span>\n <span id=\"topic-title\" class=\"text-sm font-semibold text-slate-600\"><\/span>\n <\/div>\n <div class=\"w-full bg-slate-200 rounded-full h-2.5\">\n <div id=\"progress-bar\" class=\"bg-emerald-500 h-2.5 rounded-full progress-bar-inner\"><\/div>\n <\/div>\n <div id=\"navigation-buttons\" class=\"flex justify-between items-center mt-4\">\n \n <\/div>\n <\/div>\n <\/div>\n <\/main>\n <footer class=\"text-center mt-6\">\n <p class=\"text-xs text-slate-400\">Based on the South African CAPS curriculum guidelines.<\/p>\n <\/footer>\n <\/div>\n \n \n <div id=\"quiz-modal\" class=\"fixed inset-0 bg-black bg-opacity-60 hidden items-center justify-center p-4 backdrop-blur-sm\">\n <div id=\"quiz-content\" class=\"bg-white border border-emerald-500\/20 rounded-lg shadow-2xl p-6 w-full max-w-2xl max-h-[90vh] overflow-y-auto\">\n \n <\/div>\n <\/div>\n\n\n <script>\n document.addEventListener('DOMContentLoaded', () => {\n const studyData = [\n {\n topic: \"Inventory Valuation & VAT\",\n content: [\n { title: \"Valuing Your Stock\", text: \"Inventory Valuation is crucial because it directly affects your Cost of Sales and Gross Profit. You need to master three key methods: FIFO, Weighted-Average, and Specific Identification.\" },\n { title: \"FIFO Method\", text: \"FIFO stands for 'First-In, First-Out'. It assumes the first goods you buy are the first ones you sell. This means your closing stock is valued at the cost of your most recent purchases. This method is common for perishable goods.\" },\n { title: \"Weighted-Average Method\", text: \"This method calculates an average cost per unit for all goods available (opening stock + all purchases). This average cost is then used to value both the items you sold (Cost of Sales) and the items you have left (Closing Stock). It smooths out price fluctuations.\" },\n { title: \"Specific Identification Method\", text: \"This method is used for unique, high-value items like cars or jewellery. Each item is tracked with its specific cost, so the exact cost of the closing stock is known. It's precise but not practical for businesses with large volumes of similar items.\" },\n { title: \"Understanding VAT\", text: \"Value Added Tax (VAT) is a tax on goods and services. You need to calculate Output VAT (on your sales, which you owe to SARS) and Input VAT (on your purchases, which you can claim back from SARS). The difference is what you either pay to or receive from SARS.\" },\n { title: \"Calculating VAT\", text: \"The key is to distinguish between VAT-exclusive and VAT-inclusive prices. For an inclusive price, you calculate the VAT amount by multiplying by (VAT rate \/ (100 + VAT rate)), for example, 15\/115. For an exclusive price, you simply multiply by the VAT rate (e.g., 15%).\" }\n ],\n quiz: [\n { question: \"Which inventory valuation method values closing stock at the most recent purchase prices?\", options: [\"Weighted-Average\", \"Specific Identification\", \"FIFO\", \"Periodic Method\"], answer: \"FIFO\" },\n { question: \"A car dealership would most likely use which inventory valuation method?\", options: [\"FIFO\", \"Weighted-Average\", \"Specific Identification\", \"LIFO\"], answer: \"Specific Identification\" },\n { title: \"VAT on Sales\", text: \"The VAT a business collects on behalf of the government from the sale of goods and services is known as...\", options: [\"Input VAT\", \"Output VAT\", \"Exempt VAT\", \"Zero-Rated VAT\"], answer: \"Output VAT\" },\n { question: \"If an item costs R200 (VAT exclusive) and VAT is 15%, what is the Input VAT?\", options: [\"R20\", \"R23\", \"R30\", \"R15\"], answer: \"R30\" },\n { question: \"If an item's price is R115 (VAT inclusive) and VAT is 15%, what is the VAT amount?\", options: [\"R15\", \"R11.50\", \"R17.25\", \"R100\"], answer: \"R15\" }\n ]\n }\n ];\n\n const mainMenu = document.getElementById('main-menu');\n const studyGuide = document.getElementById('study-guide');\n const topicGrid = document.getElementById('topic-grid');\n const guideContainer = document.getElementById('guide-content-wrapper');\n const progressBar = document.getElementById('progress-bar');\n const progressText = document.getElementById('progress-text');\n const topicTitleEl = document.getElementById('topic-title');\n const backToMenuBtn = document.getElementById('back-to-menu');\n const quizModal = document.getElementById('quiz-modal');\n const quizContent = document.getElementById('quiz-content');\n const navigationButtons = document.getElementById('navigation-buttons');\n\n let currentTopicIndex = 0;\n let currentSectionIndex = 0;\n\n function initializeMenu() {\n topicGrid.innerHTML = '';\n studyData.forEach((topicData, index) => {\n const button = document.createElement('button');\n button.className = `topic-button bg-white p-6 rounded-lg shadow-md text-left border border-emerald-500\/20 hover:bg-slate-50 ${studyData.length === 1 ? 'md:col-span-2' : ''}`;\n button.innerHTML = `\n <h3 class=\"text-xl font-semibold text-emerald-600\">${topicData.topic}<\/h3>\n <p class=\"text-slate-500 mt-1 text-sm\">${topicData.content.length} sections<\/p>\n `;\n button.onclick = () => startTopic(index);\n topicGrid.appendChild(button);\n });\n }\n\n function startTopic(topicIndex) {\n currentTopicIndex = topicIndex;\n currentSectionIndex = 0;\n mainMenu.classList.add('hidden');\n studyGuide.classList.remove('hidden');\n renderSection();\n }\n\n function backToMenu() {\n mainMenu.classList.remove('hidden');\n studyGuide.classList.add('hidden');\n }\n\n function renderSection() {\n const section = studyData[currentTopicIndex].content[currentSectionIndex];\n guideContainer.innerHTML = `\n <div class=\"content-card text-center p-4 w-full\">\n <h2 class=\"text-2xl font-bold mb-4 text-emerald-600\">${section.title}<\/h2>\n <div class=\"text-slate-700 leading-relaxed min-h-[250px] text-left\">${section.text}<\/div>\n <\/div>\n `;\n \n setTimeout(() => {\n guideContainer.querySelector('.content-card')?.classList.add('active');\n }, 50);\n\n updateNavigation();\n }\n \n function handleQuiz() {\n quizModal.style.display = 'flex';\n const quizData = studyData[currentTopicIndex].quiz;\n if (quizData && quizData.length > 0) {\n renderQuiz(quizData);\n } else {\n quizContent.innerHTML = `<p class=\"text-yellow-500 text-center\">No quiz available for this topic.<\/p> <button onclick=\"document.getElementById('quiz-modal').style.display='none'\" class=\"mt-4 bg-slate-200 py-2 px-4 rounded\">Close<\/button>`;\n }\n }\n\n function renderQuiz(quizData) {\n let quizHTML = `<h2 class=\"text-2xl font-bold mb-6 text-center text-emerald-600\">Quiz on ${studyData[currentTopicIndex].topic}<\/h2>`;\n quizData.forEach((q, index) => {\n quizHTML += `<div class=\"mb-6\" data-answer=\"${q.answer.replace(\/\"\/g, '"')}\">\n <p class=\"font-semibold mb-3 text-slate-800\">${index + 1}. ${q.question}<\/p>\n <div class=\"space-y-2 text-slate-700\">`;\n q.options.forEach(opt => {\n quizHTML += `<label class=\"flex items-center p-3 rounded-lg border border-slate-200 cursor-pointer hover:bg-slate-100 has-[:checked]:bg-emerald-100 has-[:checked]:border-emerald-400\">\n <input type=\"radio\" name=\"q${index}\" value=\"${opt.replace(\/\"\/g, '"')}\" class=\"mr-3 w-4 h-4 text-emerald-600 bg-slate-100 border-slate-300 focus:ring-emerald-500 focus:ring-2\">\n <span>${opt}<\/span>\n <\/label>`;\n });\n quizHTML += `<\/div><p class=\"result-text mt-2 text-sm font-medium hidden\"><\/p><\/div>`;\n });\n quizHTML += `<div class=\"flex justify-between items-center mt-6\">\n <button id=\"close-quiz-btn\" class=\"bg-slate-500 hover:bg-slate-600 text-white font-bold py-2 px-4 rounded-lg\">Close<\/button>\n <button id=\"submit-quiz-btn\" class=\"bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-2 px-4 rounded-lg\">Check Answers<\/button>\n <\/div>`;\n quizContent.innerHTML = quizHTML;\n document.getElementById('submit-quiz-btn').addEventListener('click', () => {\n quizData.forEach((q, index) => {\n const container = quizContent.querySelectorAll('div[data-answer]')[index];\n const selected = container.querySelector(`input[name=\"q${index}\"]:checked`);\n const resultText = container.querySelector('.result-text');\n resultText.classList.remove('hidden');\n if (selected) {\n if (selected.value === q.answer) {\n resultText.textContent = 'Correct!';\n resultText.className = 'result-text mt-2 text-sm font-medium text-green-600';\n } else {\n resultText.textContent = `Incorrect. The correct answer is: ${q.answer}`;\n resultText.className = 'result-text mt-2 text-sm font-medium text-red-600';\n }\n } else {\n resultText.textContent = 'No answer selected.';\n resultText.className = 'result-text mt-2 text-sm font-medium text-yellow-600';\n }\n });\n document.getElementById('submit-quiz-btn').disabled = true;\n });\n document.getElementById('close-quiz-btn').addEventListener('click', () => quizModal.style.display = 'none');\n }\n\n function updateNavigation() {\n navigationButtons.innerHTML = '';\n const topic = studyData[currentTopicIndex];\n const totalSections = topic.content.length;\n const progressPercentage = ((currentSectionIndex + 1) \/ totalSections) * 100;\n progressBar.style.width = `${progressPercentage}%`;\n progressText.textContent = `Section ${currentSectionIndex + 1} of ${totalSections}`;\n topicTitleEl.textContent = topic.topic;\n\n const prevButton = document.createElement('button');\n prevButton.id = 'prev-btn';\n prevButton.className = 'bg-slate-200 hover:bg-slate-300 text-slate-700 font-bold py-2 px-6 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed';\n prevButton.textContent = 'Previous';\n prevButton.onclick = navigatePrev;\n prevButton.disabled = currentSectionIndex === 0;\n \n const nextButton = document.createElement('button');\n nextButton.id = 'next-btn';\n \n if (currentSectionIndex === totalSections - 1) {\n nextButton.className = 'quiz-action-button bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-6 rounded-lg transition-colors';\n nextButton.textContent = 'Finish Topic';\n nextButton.onclick = backToMenu;\n const quizButton = document.createElement('button');\n quizButton.id = 'quiz-btn';\n quizButton.className = 'quiz-action-button bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-2 px-6 rounded-lg';\n quizButton.textContent = '\u270d\ufe0f Take Quiz';\n quizButton.onclick = handleQuiz;\n navigationButtons.appendChild(prevButton);\n navigationButtons.appendChild(quizButton);\n navigationButtons.appendChild(nextButton);\n } else {\n nextButton.className = 'bg-emerald-600 hover:bg-emerald-700 text-white font-bold py-2 px-6 rounded-lg transition-colors';\n nextButton.textContent = 'Next';\n nextButton.onclick = navigateNext;\n navigationButtons.appendChild(prevButton);\n navigationButtons.appendChild(nextButton);\n }\n }\n \n function navigateNext() {\n if (currentSectionIndex < studyData[currentTopicIndex].content.length - 1) {\n currentSectionIndex++;\n renderSection();\n }\n }\n\n function navigatePrev() {\n if (currentSectionIndex > 0) {\n currentSectionIndex--;\n renderSection();\n }\n }\n\n let touchstartX = 0;\n guideContainer.addEventListener('touchstart', e => { touchstartX = e.changedTouches[0].screenX; }, { passive: true });\n guideContainer.addEventListener('touchend', e => {\n let touchendX = e.changedTouches[0].screenX;\n if (touchendX < touchstartX - 50) { \/\/ Swipe Left\n const nextBtn = document.getElementById('next-btn') || document.querySelector('.quiz-action-button[onclick=\"backToMenu()\"]');\n if(nextBtn) nextBtn.click();\n }\n if (touchendX > touchstartX + 50) { \/\/ Swipe Right\n document.getElementById('prev-btn')?.click();\n }\n }, { passive: true });\n \n backToMenuBtn.addEventListener('click', backToMenu);\n document.addEventListener('keydown', (e) => {\n if(studyGuide.classList.contains('hidden') || quizModal.style.display === 'flex') return;\n if (e.key === 'ArrowRight') {\n const nextBtn = document.getElementById('next-btn') || document.querySelector('.quiz-action-button[onclick=\"backToMenu()\"]');\n if(nextBtn) nextBtn.click();\n }\n if (e.key === 'ArrowLeft') document.getElementById('prev-btn')?.click();\n });\n\n \/\/ If there's only one topic, start it automatically\n if (studyData.length === 1) {\n startTopic(0);\n } else {\n initializeMenu();\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n<span style=\"text-decoration-style: initial;\">See Other Topic<\/span>s\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"categories":[18,23],"tags":[24],"class_list":["post-739","page","type-page","status-publish","hentry","category-grade-12","category-high-school","tag-exam-tool-kit"],"_links":{"self":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages\/739","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/comments?post=739"}],"version-history":[{"count":5,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages\/739\/revisions"}],"predecessor-version":[{"id":1079,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/pages\/739\/revisions\/1079"}],"wp:attachment":[{"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/media?parent=739"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/categories?post=739"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wiseexcellence.co.za\/high-school\/wp-json\/wp\/v2\/tags?post=739"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}