Please enable JavaScript.
Coggle requires JavaScript to display documents.
Data Exchange Application, System Requirements - Coggle Diagram
Data Exchange Application
User Interface
Event Cards/List
Show event info
Book Now option
Responsive layout
Desktop and mobile
Scrollable list
Search Bar
Text input
Confirm Button
Navigation
Tabs
Search Filters
Coded Environment
CSS Styling
Grid or Flexbox layout
Event cards
JavaScript Functions
storeInLocalStorage(data)
searchEvents(query)
fetchEvents()
displayEvents(filteredData)
HTML elements
div container (events)
buttons (search + filter)
input field (search)
Error Handling
User feedback on load failure or no results
Try/catch blocks
Data Environment
Data Structure (JSON)
location
date
event_name
description
Local Storage
Stores full event dataset
Enables offline searching
API Call
page load or refresh
fetch() method in JS
Search Process
Filters matching keywords
JS reads localStorage
Brisbane City Council API
Contains event details
REST API, returns JSON
Output Display
Dynamically updates DOM to show matching results
System Requirements
Non-functional Requirements
Fast response time
Accessible and user-friendly interface
Works on multiple devices
Functional
Display of detailed event info
Link to booking site
Searchable event listings
Performance Criteria
API load success rate
Search efficiency (filtered from localStorage)
Testing
Debug console errors and fix
Manual testing with test cases