FORMAT OF INTERNSHIP/Minor/Major Project REPORT

The following format should be used for preparing internship report:

1. Spiral binding is required (In case of Minor Project and Internship) (At Least 2 Copies)/
For Major Project Hard Binding Black and written with golden (At least 2 Copies)
2. Cover page color: Colored
3. Self-declaration certificate from the candidate
4. Certificate of internship(for internship file only)
5. Acknowledgment.
6. Abstract.
7. Background of Company/Organization(in case of internship)
8. Program and Opportunities
9. Benefit of Company/Organization(in case of internship)
10. Introduction
11. Analysis
12. Software Requirements Specification
13. Technology Used and its description
14. Coding
15. Screenshots
16. Conclusion
17. Bibliography

For Minor and Major Project only References should be arranged chronologically in
alphabetical order. Typical style of writing the references is given below:
(a) For single author –
Surname, Initials, Title of the Article, Journal Name, Volume, Pages, Year.
(b) For two authors –
Surname, Initials and Surname, Initials, Title of the Article, Journal Name, Volume,
Pages, Year.
(c) For more than two authors–
Surname, Initials, Surname, Initials, …………….... and Surname, Initials, Title of the
Article, Journal Name, Volume, Pages, Year.

While citing the references in the text, the following format should be followed:
Surname (Year) or Surname et al. (Year)
The names of the Journals should be typed as per the style followed by any standard international
organization/abstracting Journal such as IEEE/ Chemical Abstracts/ Current Contents/ Physics
Abstracts, etc.
 INCIDENT MANAGEMENT WEB
APPLICATION
Internship Report

Submitted by

Jashandeep Kaur 210240101046

Harsh Shivam 210240101040

Under the Supervision

Mr. Lokesh Kumar
Assistant Professor
CSE Department

In Partial Fulfillment of the Requirements

for the Degree of
Bachelor of Technology

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

ROORKEE INSTITUTE OF TECHNOLOGY, ROORKEE
(Affiliated to VMSB Uttarakhand Technical University, Dehradun)
Month Year
 DECLARATION

I declare that the work embodied in this Minor report is my own original work carried out by me
under the supervision of Mr. Lokesh Kumar for the session 2023-24 at “Roorkee Institute of
Technology”. The matter embodied in this internship report has not been submitted elsewhere
for the award of any other degree. I declare that I have faithfully acknowledged, given credit to
and referred to the researchers wherever the work has been cited in the text and the body of the
thesis. I further certify that I have not willfully lifted up some other’s work, Para, text, data,
results, etc. reported in the journals, books, magazines, reports, dissertations, thesis, etc., or
available at web-sites and have included them in this internship report and cited as my own
work.

Date: Name(s) & Signature(s) of the Student

Place:
 ACKNOWLEDGEMENT
I am very happy to greatly acknowledge the numerous personalities involved in lending their
help to make our project “Incident Management Web Application” a successful one.

I take this opportunity to express our deep sense of gratitude to our honorable Director “Dr
Parag Jain” for providing an excellent academic climate in the college that made this endeavor
possible.

I give my wholehearted admiration and a deep sense of gratitude to “Dr. Prashant Verma”,
HOD, “DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING”, Roorkee
Institute of Technology, Roorkee for his inspiration, valuable guidance, encouragement,
suggestion, and overall help throughout.

I express my sincere thanks to supervisor “Mr. Lokesh Kumar”, “Assistant Professor”,

“DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING”, “ROORKEE
INSTITUTE OF TECHNOLOGY”, for his keen interest and invaluable help throughout the
project.

We would like to express our sincere gratitude to our internship/project coordinator “NAME”,
“DESIGNATION”, “DEPARTMENT NAME”, Roorkee Institute of Technology, Roorkee, for
his kind support and encouragement throughout this course of work.

Finally, we express our gratitude to all the Teaching and Non-Teaching staff of
“DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING”, Roorkee Institute of
Technology, Roorkee for their timely support and suggestions.

Date: Jashandeep Kaur 21024101046

Harsh Shivam 210240101040
 TABLE OF CONTENTS

Contents

ABSTRACT

1. INTRODUCTION
2. ANALYSIS
3. SOFTWARE REQUIREMENT SPECIFICATION
4. TECHNOLOGY USED AND ITS DESCRIPTION
5. CODING
6. SCREENSHOTS
7. CONCLUSION
8. BIBILOGRAPHY
 ABSTRACT
In today's fast-paced world, efficient coordination and response are critical in managing various
emergencies and incidents such as accidents, fires, and other public safety concerns. Traditional
methods of communication and reporting often lead to delays and inefficiencies, hindering the
prompt response of concerned authorities. To address this challenge, we propose the
development of a comprehensive software solution aimed at streamlining the process of incident
reporting and management across multiple departments.

The software will serve as a centralized platform that integrates all major departments
responsible for handling incidents related to accidents, fires, and other emergency situations. It
will facilitate the seamless transmission of incident reports from citizens or relevant stakeholders
to the respective district or police stations, ensuring swift and coordinated responses.
Additionally, the software will leverage social media mining techniques to identify and capture
complaints regarding various road transportation issues, including traffic congestion, accidents,
potholes, garbage accumulation, and pollution.

Overall, the proposed software aims to revolutionize the way incidents are reported, managed,
and responded to, enhancing the efficiency and effectiveness of public safety operations while
ultimately improving the well-being and safety of communities.
 1. INTRODUCTION

In our rapidly evolving world, the need for swift and coordinated responses to emergencies has
become more crucial than ever. Whether it's accidents on the road, fires, or other unforeseen
incidents, effective communication and streamlined coordination among various departments are
paramount for saving lives and minimizing damage.
The current scenario often presents challenges in this regard, with incidents reported through
disparate channels leading to delays, miscommunication, and inefficiencies in response.
Additionally, the burgeoning use of social media platforms for reporting incidents adds another
layer of complexity, as identifying and prioritizing critical information becomes increasingly
challenging amidst the vast volume of data.
To address these challenges, we propose the development of a comprehensive software solution
that integrates all major departments involved in emergency management. This software will
serve as a centralized platform for receiving, prioritizing, and disseminating incident reports
efficiently, ensuring a swift and coordinated response to emergencies. We have created a web
application “My Helping Buddy” where users can report any incident and that data will be
provided to the respected departments along with their geolocation facility.

Key Features:
Unified Incident Reporting: The website will provide a single point of contact for reporting
various incidents, including accidents, fires, road hazards, and environmental issues.
Real-time Communication: The website will facilitate seamless communication and
collaboration among concerned departments, allowing them to exchange real-time updates, share
resources, and coordinate response efforts effectively.
Geospatial Mapping: A geospatial mapping feature will enable visual representation of incident
locations, allowing responders to quickly identify hotspots and allocate resources accordingly.

Benefits:
Enhanced Coordination: The integration of various departments and communication channels
will promote seamless collaboration and coordination, ensuring a cohesive and efficient response
to emergencies.
Increased Efficiency in Handling Incidents: The incident management software streamlines the
entire incident handling process, from reporting to resolution.
 2. ANALYSIS

Existing Incident Management Systems:

Several incident management systems exist, ranging from traditional paper-based reporting to
digital solutions. These systems often lack integration among various departments and face
challenges in real-time communication and coordination.

Gaps in Existing Solutions:

 Fragmented Communication: Traditional methods result in fragmented communication
channels, leading to delays and inefficiencies in incident response.
 Complexity in Reporting: Users may encounter barriers in reporting incidents due to
complex interfaces or lack of accessibility features.
 Lack of Geospatial Integration: Geospatial mapping is often overlooked in existing
solutions, resulting in challenges in visualizing incident locations and allocating
resources effectively.
 Scalability Issues: Some systems may struggle to scale and adapt to the evolving needs of
emergency management, especially in large-scale incidents or across multiple
jurisdictions.

Motivation/Inspiration to the Work Done:

The identified gaps and limitations in existing incident management systems serve as the primary
motivation for the development of "My Helping Buddy." Inspired by the pressing need for a
comprehensive, user-friendly, and integrated solution, we embarked on this project with the
vision of revolutionizing emergency management practices.

In conclusion, the analysis highlights the critical need for innovative incident management
solutions and underscores the motivation behind the development of "My Helping Buddy." By
addressing the identified gaps and limitations, this project seeks to contribute to the advancement
of emergency management practices and ultimately improve the safety and well-being of
communities.
 3. SOFTWARE REQUIREMENTS SPECIFICATIONS
3.1 System configurations

The software requirement specification can produce at the culmination of the analysis task. The
function and performance allocated to software as part of system engineering are refined by
established a complete information description, a detailed functional description, a representation
of system behaviour, and indication of performance and design constrain, appropriate validate
criteria, and other information pertinent to requirements.

Software Requirements:
• Operating system : Windows 7 Ultimate.
• Coding Language : MVC 4 Razor
• Front-End : Visual Studio 2012 Professional.
• Data Base : SQL Server 2008.

Hardware Requirement:
• System : Pentium IV 2.4 GHz.
• Hard Disk : 1TB.
• Ram : 4GB.
 4. TECHNOLOGY USED AND ITS DESCRIPTION
Frontend:
 HTML (Hypertext Markup Language): The standard markup language for creating web
pages and web applications.
 CSS (Cascading Style Sheets): Used for styling the appearance of HTML elements on
web pages.
 JavaScript: A programming language commonly used for creating interactive effects
within web browsers.
Backend:
 Spring Framework (Spring Boot): A popular Java framework for building enterprise-level
applications. Spring Boot simplifies the setup and configuration of Spring-based
applications, enabling rapid development.
Database:
 MySQL: An open-source relational database management system (RDBMS) that uses
structured query language (SQL). It's commonly used for storing structured data in web
applications.
Programming Language:
 Java: A high-level, object-oriented programming language known for its platform
independence. Java is widely used for building web applications, mobile apps, and
enterprise software.
 5. CODING

Home Controller
package com.emergency;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.emergency.Service.UserRegisterService;
import com.emergency.entity.AccidentReport;
import com.emergency.entity.FireReport;
import com.emergency.entity.TrafficReport;
import com.emergency.entity.User;
import com.emergency.entity.UserRegister;
import com.emergency.repository.AccidentRepository;
import com.emergency.repository.FireRepository;
import com.emergency.repository.TrafficRepository;
import com.emergency.repository.UserRepository;

@Controller
public class HomeController {

@Autowired
private FireRepository fireRepo;

@Autowired
private TrafficRepository trafficRepo;

@Autowired
private AccidentRepository accidentRepo;

@Autowired
private UserRegisterService userService;

@GetMapping("/")
public String home() {
 return "index";
}

@GetMapping("/base")
public String base() {
return "base";
}

@GetMapping("/login")
public String login() {
return "login";
}

@GetMapping("/userRegister")
public String userRegister() {
return "register";
}

@PostMapping("/createUser")
public String UserRegistration(@ModelAttribute UserRegister user) {
userService.createUser(user);
return "register";
}

@PostMapping("/loginMain")
public String login(String username, String password) {
// Validate the username and password
if ("[email protected]".equals(username) && "12345".equals(password)) {
return "index"; // Redirect to dashboard if login is successful
}
if ("[email protected]".equals(username) && "admin".equals(password)) {
return "admin"; // Redirect to dashboard if login is successful
}

return null;
}

@PostMapping("/register")
@ResponseBody
public String register(@RequestParam("incidentType") String incidentType,
@RequestParam("description") String description,
@RequestParam(value = "contactInfo", required = false) String
contactInfo,
 @RequestParam(value = "location", required = false) String location) {
switch(incidentType) {
case "Fire":
FireReport fireReport = new FireReport();
fireReport.setDescription(description);
fireReport.setContactInfo(contactInfo);
fireReport.setLocation(location);
fireRepo.save(fireReport);
break;
case "Traffic":
TrafficReport trafficReport = new TrafficReport();
trafficReport.setDescription(description);
trafficReport.setContactInfo(contactInfo);
trafficReport.setLocation(location);
trafficRepo.save(trafficReport);
break;
case "Accidents":
AccidentReport accidentReport = new AccidentReport();
accidentReport.setDescription(description);
accidentReport.setContactInfo(contactInfo);
accidentReport.setLocation(location);
accidentRepo.save(accidentReport);
break;
default:
// Handle other incident types if necessary
break;
}
return "Report submitted successfully";
}

@GetMapping("/admin")
public String adminPage() {

return "admin";
}

@GetMapping("/location")
public String loc() {
return "location";
}

@GetMapping("/admin/{incidentType}")
public String showReports(@PathVariable String incidentType, Model model) {
switch (incidentType) {
 case "Fire":
Iterable<FireReport> fireReports = fireRepo.findAll();
model.addAttribute("reports", fireReports);
break;
case "Traffic":
Iterable<TrafficReport> trafficReports = trafficRepo.findAll();
model.addAttribute("reports", trafficReports);
break;
case "Accident":
Iterable<AccidentReport> accidentReports = accidentRepo.findAll();
model.addAttribute("reports", accidentReports);
break;
default:
// Handle invalid incident types or other cases if necessary
break;
}
return "reportTable"; // Return the name of the Thymeleaf template to display the
table
}
}

AccidentReport
package com.emergency;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.emergency.Service.UserRegisterService;
import com.emergency.entity.AccidentReport;
import com.emergency.entity.FireReport;
import com.emergency.entity.TrafficReport;
import com.emergency.entity.User;
import com.emergency.entity.UserRegister;
import com.emergency.repository.AccidentRepository;
import com.emergency.repository.FireRepository;
import com.emergency.repository.TrafficRepository;
import com.emergency.repository.UserRepository;

@Controller
public class HomeController {

@Autowired
private FireRepository fireRepo;

@Autowired
private TrafficRepository trafficRepo;

@Autowired
private AccidentRepository accidentRepo;

@Autowired
private UserRegisterService userService;

@GetMapping("/")
public String home() {
return "index";
}

@GetMapping("/base")
public String base() {
return "base";
}

@GetMapping("/login")
public String login() {
return "login";
}

@GetMapping("/userRegister")
public String userRegister() {
return "register";
}

@PostMapping("/createUser")
public String UserRegistration(@ModelAttribute UserRegister user) {
userService.createUser(user);
return "register";
}
 @PostMapping("/loginMain")
public String login(String username, String password) {
// Validate the username and password
if ("[email protected]".equals(username) && "12345".equals(password)) {
return "index"; // Redirect to dashboard if login is successful
}
if ("[email protected]".equals(username) && "admin".equals(password)) {
return "admin"; // Redirect to dashboard if login is successful
}

return null;
}

@PostMapping("/register")
@ResponseBody
public String register(@RequestParam("incidentType") String incidentType,
@RequestParam("description") String description,
@RequestParam(value = "contactInfo", required = false) String
contactInfo,
@RequestParam(value = "location", required = false) String location) {
switch(incidentType) {
case "Fire":
FireReport fireReport = new FireReport();
fireReport.setDescription(description);
fireReport.setContactInfo(contactInfo);
fireReport.setLocation(location);
fireRepo.save(fireReport);
break;
case "Traffic":
TrafficReport trafficReport = new TrafficReport();
trafficReport.setDescription(description);
trafficReport.setContactInfo(contactInfo);
trafficReport.setLocation(location);
trafficRepo.save(trafficReport);
break;
case "Accidents":
AccidentReport accidentReport = new AccidentReport();
accidentReport.setDescription(description);
accidentReport.setContactInfo(contactInfo);
accidentReport.setLocation(location);
accidentRepo.save(accidentReport);
break;
default:
// Handle other incident types if necessary
 break;
}
return "Report submitted successfully";
}

@GetMapping("/admin")
public String adminPage() {

return "admin";
}

@GetMapping("/location")
public String loc() {
return "location";
}

@GetMapping("/admin/{incidentType}")
public String showReports(@PathVariable String incidentType, Model model) {
switch (incidentType) {
case "Fire":
Iterable<FireReport> fireReports = fireRepo.findAll();
model.addAttribute("reports", fireReports);
break;
case "Traffic":
Iterable<TrafficReport> trafficReports = trafficRepo.findAll();
model.addAttribute("reports", trafficReports);
break;
case "Accident":
Iterable<AccidentReport> accidentReports = accidentRepo.findAll();
model.addAttribute("reports", accidentReports);
break;
default:
// Handle invalid incident types or other cases if necessary
break;
}
return "reportTable"; // Return the name of the Thymeleaf template to display the
table
}
}

FireReport
package com.emergency.entity;

import jakarta.persistence.Entity;
import jakarta.persistence.GeneratedValue;
import jakarta.persistence.GenerationType;
import jakarta.persistence.Id;

@Entity
public class FireReport {

@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String description;
private String contactInfo;
private String location;

public FireReport() {
super();
// TODO Auto-generated constructor stub
}

public FireReport(Long id, String description, String contactInfo, String location) {

super();
this.id = id;
this.description = description;
this.contactInfo = contactInfo;
this.location = location;
}

public String getLocation() {

return location;
}

public void setLocation(String location) {

this.location = location;
}

public Long getId() {

return id;
}

public void setId(Long id) {

this.id = id;
}
 public String getDescription() {
return description;
}

public void setDescription(String description) {

this.description = description;
}

public String getContactInfo() {

return contactInfo;
}

public void setContactInfo(String contactInfo) {

this.contactInfo = contactInfo;
}

TrafficReport
package com.emergency.entity;

import jakarta.persistence.Entity;
import jakarta.persistence.GeneratedValue;
import jakarta.persistence.GenerationType;
import jakarta.persistence.Id;

@Entity
public class TrafficReport {

@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String description;
private String contactInfo;
private String location;

public TrafficReport() {
super();
// TODO Auto-generated constructor stub
}

public TrafficReport(Long id, String description, String contactInfo, String location) {

super();
this.id = id;
 this.description = description;
this.contactInfo = contactInfo;
this.location = location;
}

public String getLocation() {

return location;
}

public void setLocation(String location) {

this.location = location;
}

public Long getId() {

return id;
}
public void setId(Long id) {
this.id = id;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public String getContactInfo() {
return contactInfo;
}
public void setContactInfo(String contactInfo) {
this.contactInfo = contactInfo;
}
}

User
package com.emergency.entity;

import jakarta.persistence.Entity;
import jakarta.persistence.GeneratedValue;
import jakarta.persistence.GenerationType;
import jakarta.persistence.Id;

@Entity
public class User {
 @Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String incidentType;
private String description;
private String contactInfo;
public User(Long id, String incidentType, String description, String contactInfo) {
super();
this.id = id;
this.incidentType = incidentType;
this.description = description;
this.contactInfo = contactInfo;
}
public User() {
super();
// TODO Auto-generated constructor stub
}
public Long getId() {
return id;
}
public void setId(Long id) {
this.id = id;
}
public String getIncidentType() {
return incidentType;
}
public void setIncidentType(String incidentType) {
this.incidentType = incidentType;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public String getContactInfo() {
return contactInfo;
}
public void setContactInfo(String contactInfo) {
this.contactInfo = contactInfo;
}
}

UserRegister
package com.emergency.entity;

import jakarta.persistence.Entity;
import jakarta.persistence.GeneratedValue;
import jakarta.persistence.GenerationType;
import jakarta.persistence.Id;

@Entity
public class UserRegister {

@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private int id;

private String name;

private String email;

private String password;

public UserRegister() {
super();
// TODO Auto-generated constructor stub
}

public UserRegister(int id, String name, String email, String password) {

super();
this.id = id;
this.name = name;
this.email = email;
this.password = password;
}

public int getId() {

return id;
}

public void setId(int id) {

this.id = id;
}

public String getName() {

return name;
}
 public void setName(String name) {
this.name = name;
}

public String getEmail() {

return email;
}

public void setEmail(String email) {

this.email = email;
}

public String getPassword() {

return password;
}

public void setPassword(String password) {

this.password = password;
}
}

AccidentRepository

package com.emergency.repository;

import org.springframework.data.jpa.repository.JpaRepository;

import com.emergency.entity.AccidentReport;

public interface AccidentRepository extends JpaRepository<AccidentReport, Long>{

}

FireRepository

package com.emergency.repository;

import org.springframework.data.jpa.repository.JpaRepository;

import com.emergency.entity.FireReport;

public interface FireRepository extends JpaRepository<FireReport, Long>{

}
UserRegisterService

package com.emergency.Service;

import com.emergency.entity.UserRegister;

public interface UserRegisterService {

public UserRegister createUser(UserRegister user);

UserRegisterServiceImpl

package com.emergency.Service;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.emergency.entity.UserRegister;
import com.emergency.repository.UserRegisterRepository;

@Service
public class UserRegisterServiceImpl implements UserRegisterService {

@Autowired
private UserRegisterRepository userRegRepo;

@Override
public UserRegister createUser(UserRegister user) {
return userRegRepo.save(user);
}

Application Properties

server.port=8084
spring.jpa.hibernate.ddl-auto=update
spring.datasource.url=jdbc:mysql://${MYSQL_HOST:localhost}:3306/emergency
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
Admin.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Admin Page</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
}

h1 {
text-align: center;
margin-top: 20px;
color: black;

}
.admin{
background-color: #595757;
width: 40%;
text-align: center;
justify-content: center;
border-radius: 10px;
}

button {
padding: 10px 20px;
margin: 10px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}

#reportTable {
margin-top: 20px;
}
 table {
width: 80%;
margin: 20px auto;
border-collapse: collapse;
}

th, td {
padding: 10px;
text-align: left;
}

thead {
background-color: #007bff;
color: #fff;
}

tbody tr:nth-child(even) {
background-color: #f2f2f2;
}

tbody tr:hover {
background-color: #e0e0e0;
}
.sub{
text-align: center;
}
</style>

</head>
<body>
<h1>Admin Dashboard</h1>
<div>
<button onclick="showReports('Fire')">Fire Reports</button>
<button onclick="showReports('Traffic')">Traffic Reports</button>
<button onclick="showReports('Accident')">Accident Reports</button>
</div>

<br><button style="background-image: linear-gradient(to right, #ff416c, #ff4b2b); color:

white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;"
onclick="redirectToLoginPage()">LogOut</button>

<div id="reportTable" style="margin-top: 20px;">

<!-- Table for displaying reports will be populated dynamically -->
 </div>

<script>
function showReports(incidentType) {
fetch('/admin/' + incidentType)
.then(response => response.text())
.then(data => {
document.getElementById('reportTable').innerHTML = data;
})
.catch(error => {
console.error('Error:', error);
});
}

function redirectToLoginPage() {
window.location.href = '/login';
}
</script>
</body>
</html>

Base.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="ISO-8859-1">
<title>My HELPING BUDDY</title>
<style>
*{
margin:0%;
padding: 0%;
box-sizing: border-box;
background: url('https://images.unsplash.com/photo-1573068111653-f18bef611c8a?
q=80&w=1974&auto=format&fit=crop&ixlib=rb-
4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D') no-
repeat center center fixed;
background-size: cover;
backdrop-filter: blur(100px);
background-color: #f0f0f0;
}
h1{
margin: 30px 0 20px 0px;
font-size: 100px;
font-weight: 900;
 text-transform: uppercase;
text-shadow: 2px 1px 6px black;
color: #dcaf1b;
}
p{
font-size: 35px;
color: rgb(237, 237, 28);
flex-wrap: wrap;
font-weight: 600;
letter-spacing: 1px;
text-shadow: 6px 6px 12px black;
}

#container{
width: 100%;
height: 85vh;
display: flex;
flex-direction: column;
color: white;
justify-content: center;
align-items: center;
text-align: center;
}
button{
background: none;
font-size: 18px;
padding: 5px;
cursor: pointer;
margin: 12px 0;
border: 2px solid #FFC300;
color: rgb(20, 212, 237);

}
</style>
</head>
<body>
<h1>MY HELPING BUDDY</h1>
<p>Hii, I'm your helping buddy. In case you have witness any fire incident, traffic issue,
accident, or any other
issue related to your locality. You can check in here.
<br>
<button style="background-image: linear-gradient(to right, #ff416c, #ff4b2b); color: white;
padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;"
onclick="redirectToLoginPage()">Login</button>
<button style="background-color: #4CAF50; color: white; padding: 10px 20px; border: none;
border-radius: 5px; cursor: pointer; box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px
rgba(0, 0, 0, 0.08); transition: all 0.15s ease;"
onclick="redirectToRegisterPage()">Register</button>

<script>
function redirectToLoginPage() {
window.location.href = '/login';
}

function redirectToRegisterPage() {
window.location.href = '/userRegister';
}
</script>

</body>
</html>

Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Report Issues Website</title>
<style>

body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #ef360cab;
color: #121010d8;
text-align: center;
padding: 10px 0;
}
.incident{
text-align: center;
}
.container {
max-width: 800px;
 margin: 20px auto;
text-align: center;
}
.category-button {
display: inline-block;
margin: 10px;
padding: 15px 30px;
background-color: #007bff;
color: #fff;
text-decoration: none;
border-radius: 5px;
}
body {
font-family: Arial, sans-serif;
}

h1 {
text-align: center;
margin-top: 50px;
}

form {
width: 800px;
margin: 0 auto;
padding: 30px;
border: 1px solid #ddd;
border-radius: 5px;
background-color: #f9f9f9;
}

label {
display: block;
margin-top: 20px;
}

select, textarea, input[type="text"] {

width: 100%;
padding: 10px;
margin-top: 5px;
border: 1px solid #ddd;
border-radius: 5px;
box-sizing: border-box;
}
 input[type="submit"] {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin-top: 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
input[type="submit"]:hover {
opacity: 0.8;
}
#incident-report{
background-color: #9675d7;
}
.cb {
display:flexbox;
margin: 10px;
padding: 15px 30px;
background-color: #007bff;
color: #fff;
text-decoration: none;
border-radius: 5px;
}
#submitbtn{
text-align: center;
}

</style>

</head>
<body>
<header>
<h1>Report Issues Website</h1>
</header>
<h2 class="incident">Report an incident</h2>
<div>
<form id="incident-form">
<div>
<input type="hidden" id="incidentType" name="incidentType"> <!-- Add a hidden input
field -->
<input type="button" class="cb" value="Fire" onclick="setIncident('Fire')">
<input type="button" class="cb" value="Traffic" onclick="setIncident('Traffic')">
<input type="button" class="cb" value="Accidents" onclick="setIncident('Accidents')">
 <!-- Add buttons for other incident types -->
<label for="description">Description:</label>
<textarea id="description" name="description" rows="4" cols="50"></textarea>
<label for="contact-info">Contact Information (Optional):</label>
<input type="text" id="contact-info" name="contact-info">
<label for="location">Location:</label>
<!-- Add location input -->
<input type="text" id="location" name="location"><br>
<button type="button" onclick="getLocation()">Get Location</button>
<br> <!-- Button to get location -->
<input type="submit" id="submitbtn" value="Submit">
</div>
</form>
<br><button style="background-image: linear-gradient(to right, #ff416c, #ff4b2b); color:
white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer;"
onclick="redirectToLoginPage()">LogOut</button>
</div>

<script>
function setIncident(incidentType) {
document.getElementById('incidentType').value = incidentType; // Set the incident type
value
document.getElementById('description').value = "Incident type: " + incidentType;
}

document.getElementById('incident-form').addEventListener('submit', function(event) {
event.preventDefault(); // Prevent default form submission

var formData = new FormData(); // Create a new FormData object

// Get values from form inputs

var incidentType = document.getElementById('incidentType').value; // Retrieve incident
type from hidden field
var description = document.getElementById('description').value;
var contactInfo = document.getElementById('contact-info').value;
var location = document.getElementById('location').value;

// Append form data

formData.append('incidentType', incidentType);
formData.append('description', description);
formData.append('contactInfo', contactInfo);
formData.append('location', location);

fetch('/register', {
 method: 'POST',
body: formData
})
.then(response => {
if (response.ok) {
alert('Report submitted successfully!');
document.getElementById('incident-form').reset(); // Clear form fields
} else {
alert('Error submitting report. Please try again later.');
}
})
.catch(error => {
console.error('Error:', error);
alert('Error submitting report. Please try again later.');
});
});

// Function to get user's current location and populate the location field
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
document.getElementById("location").value = "Geolocation is not supported by this
browser.";
}
}

function showPosition(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
document.getElementById("location").value = "Latitude: " + latitude + ", Longitude: " +
longitude;
}

function redirectToLoginPage() {
window.location.href = '/login';
}
</script>

</body>
</html>

Location.html
<!DOCTYPE html>
<html>
<body>
<h1>Emergency!!! Send message</h1>

<button onclick="getLocation()">Emergency</button>

<p id="demo"></p>

<script>
function openGoogleMaps(latitude, longitude) {
var url = "https://www.google.com/maps?q=" + latitude + "," + longitude;
window.open(url, "_blank");
}
</script>

</body>
</html>

Login.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f2f2f2;
}
.container {
max-width: 400px;
margin: 100px auto;
background-color: #fff;
border-radius: 8px;
padding: 40px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h2 {
text-align: center;
margin-bottom: 20px;
 color: #333;
}
input[type="text"],
input[type="password"] {
width: 100%;
padding: 12px;
margin-bottom: 20px;
border: 1px solid #ccc;
border-radius: 5px;
box-sizing: border-box;
outline: none;
}
input[type="submit"] {
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
padding: 12px 20px;
cursor: pointer;
width: 100%;
}
input[type="submit"]:hover {
background-color: #0056b3;
}
.signup-link {
text-align: center;
margin-top: 20px;
}
.signup-link a {
color: #007bff;
text-decoration: none;
}
.signup-link a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class="container">
<h2>Login</h2>
<form action="/loginMain" method="post">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
 <label for="password">Password:</label>
<input type="password" id="password" name="password" required>

<input type="submit" value="Login">

</form>

</div>

</body>
</html>

Register.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registration Form</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f2f2f2;
}
.container {
max-width: 400px;
margin: 50px auto;
background-color: #fff;
border-radius: 8px;
padding: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h2 {
text-align: center;
margin-bottom: 20px;
}
input[type="text"],
input[type="email"],
input[type="password"] {
width: 100%;
padding: 10px;
margin-bottom: 20px;
 border: 1px solid #ccc;
border-radius: 5px;
box-sizing: border-box;
}
input[type="submit"] {
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
padding: 12px 20px;
cursor: pointer;
width: 100%;
}
input[type="submit"]:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<div class="container">
<h2>Registration Form</h2>
<form action="createUser" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>

<label for="email">Email:</label>
<input type="email" id="email" name="email" required>

<label for="password">Password:</label>
<input type="password" id="password" name="password" required>

<input type="submit" value="Register">

</form>
</div>
</body>
</html>

Report.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Report Table</title>
<style>
 body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
}

h2 {
text-align: center;
margin-top: 20px;
text-decoration: underline;
}

table {
width: 80%;
margin: 20px auto;
border-collapse: collapse;
}

th,
td {
padding: 10px;
text-align: left;
}

thead {
background-color: #5136d9;
color: #fff;
}

tbody tr:nth-child(even) {
background-color: #f2f2f2;
}
tbody tr:hover {
background-color: #e0e0e0;
}
</style>
</head>
<body>
<h2>Reports</h2>
<table border="1">
<thead>
<tr>
<th>ID</th>
 <th>Description</th>
<th>Contact Info</th>
<th>Location</th>
</tr>
</thead>
<tbody>
<tr th:each="report : ${reports}">
<td th:text="${report.id}"></td>
<td th:text="${report.description}"></td>
<td th:text="${report.contactInfo}"></td>
<td th:text="${report.location}"></td>
</tr>
</tbody>
</table>
</body>
</html>
6. SCREENSHOTS
 7. CONCLUSION

In conclusion, the development of the incident management web application, titled "My Helping
Buddy," marks a significant step towards enhancing emergency response and management
capabilities in our modern society.

By leveraging HTML, CSS, and JavaScript for the frontend interface, and Spring Framework
(Spring Boot) for the backend logic, we have created a user-friendly platform that streamlines
the reporting process and facilitates real-time communication among stakeholders. The
integration of MySQL as the database management system ensures secure storage and retrieval
of incident data, while Java serves as the backbone programming language, enabling robust and
scalable application development.

The proposed system's key features, including unified incident reporting, real-time
communication, and geospatial mapping capabilities, are designed to enhance coordination,
optimize resource allocation, and ultimately, improve public safety outcomes. By providing a
centralized platform for incident reporting and management, "My Helping Buddy" empowers
citizens to contribute actively to emergency response efforts while enabling authorities to make
data-driven decisions and respond promptly to critical situations.

In essence, "My Helping Buddy" represents not only a technological solution but also a
testament to our collective dedication to serving the greater good and safeguarding the well-
being of our communities. As we embark on this transformative journey, let us remain steadfast
in our commitment to building a safer, more connected, and resilient future for all.
 8. BIBLIOGRAPHY

1. ECMA International. "JavaScript (ECMAScript) Language Specification," 2021.

[Online]. Available: https://www.ecma-international.org/ecma-262/.
2. MySQL. "MySQL Documentation," 2022. [Online]. Available:
https://dev.mysql.com/doc/.
3. W3Schools. "HTML Geolocation." [Online]. Available:
https://www.w3schools.com/html/html5_geolocation.asp.
4. Spring Team. "Building REST services with Spring." Spring Boot Documentation.
Accessed on Apr. 21, 2024. [Online]. Available: https://spring.io/guides/gs/spring-boot.
5. W3Schools. "Java Introduction." Available:
https://www.w3schools.com/java/java_intro.asp. Accessed on Apr. 21, 2024.