TAGUIG CITY UNIVERSITY

TCUniArch: A WEB-BASED THESIS MANAGEMENT SYSTEM FOR

CICT STUDENTS WITH INTEGRATED CHATBOT USING
NATURAL LANGUAGE PROCESSING

A Thesis Presented to the Course Specialists of the

College of Information and Communication

Technology of Taguig City University

In Partial fulfillment of the requirement for the Degree

of Bachelor of Science in Computer Science

By:

Cipriano, Rafael Jetro P.

Gio, Jerome T.

Malanay, Rizarine B.

Piangco, Izen S.

June 2025
 ii
TAGUIG CITY UNIVERSITY
APPROVAL SHEET

This thesis entitled TCUniArch: A Web-Based Thesis Management System for

CICT Students with Integrated Chatbot Using Natural Language Processing, prepared

and submitted by Cipriano, Rafael Jetro P., Gio, Jerome T., Malanay, Rizarine B., and

Piangco, Izen S., in partial fulfillment of the requirements for the degree of Bachelor of

Science in Computer Science, has been examined and is hereby recommended for oral

examination.

PROF. EDMAR G. TAN, MSIT PROF. JACKELYN T. TRINIDAD, MSIT

Technical Adviser Subject Adviser

PANEL OF EXAMINERS

Approved by the Committee on Final Examination with a grade of _____.

PROF. RODELIO O. DELA FUENTE, MSIT

Chairman

PROF. SOFIA V. ARQUERO PROF. MARY ANN M. TEJANO

Member Member

Accepted in partial fulfillment of the requirements for the degree of Bachelor of

Science in Computer Science.

___________________________ DR. REYNALDO G. ALVEZ

Date Dean, CICT
 iii
TAGUIG CITY UNIVERSITY
ACKNOWLEDGEMENT

To begin with, the researchers wanted to convey their immense gratefulness to

our Almighty God for enabling them to complete this thesis project.

The researchers would also like to thank Prof. Jackelyn Trinidad, MSIT for always

being present anytime we requested her assistance in our research tasks.

To Prof. Edmar G. Tan, our dedicated technical adviser, deserves special

acknowledgment for his words of encouragement. His insights and feedback have

played a crucial role in elevating the quality of our work.

To the members of our panelists Prof. Sofia V. Arquero, Prof. Mary Ann M. Tejano,

and to the chairman of the panelists Prof. Rodelio O. Dela Fuente, MSIT our panelists,

generously shared their time, expertise, and constructive feedback during the defense

of our thesis. Their valuable insights have significantly contributed to the refinement and

strengthening of our research.

To our ever supportive dean, Dr. Reynaldo G. Alvez. We would like to extend our

sincere gratitude for his leadership that provided us with remarkable opportunities and

abundant resources that deeply advanced our thesis.

The researchers would also like to extend their sincere gratitude to their

classmates for their support during some classes where they were invariably on sick list.
 iv
TAGUIG CITY UNIVERSITY

They were also willing to share their inputs and opinions in terms of knowledge of the

study’s progress.

Finally, the researchers wish to extend their appreciation to their family for the

moral and financial support they accorded to this thesis; especially for taking time on

drawing their goals and for their patience during the stressful final weeks of completing

the final output.

 v
TAGUIG CITY UNIVERSITY
DEDICATION

This work is dedicated wholly to our ever-supportive parents with special thanks

for their encouragement when we thought that all was over, and for their moral, spiritual,

emotional, and financial support.

To all classmates, families, guides and other friends who offered us

encouragement to finish this study.

Last of all, a befitting tribute was extended to Almighty God and we gratefully

thanked him for the guidance, strength mental power and protection he gave us to help

in developing this book as well as the abilities to give us a healthy life. So everything that

you need we give to you with the aforementioned. options.

 vi
TAGUIG CITY UNIVERSITY
ABSTRACT

This study focuses on the development of TCUniArch: A Web-based Thesis

Management System for CICT Students. The system intends to improve access to

academic research by digitizing and preserving thesis for future use. By providing an

efficient web-based platform for storing and retrieving academic data, it addresses the

growing demand for remote access to research resources.

The system includes a chatbot powered by Natural Language Processing, which

allows users to easily search for theses using keywords, titles, or authors. This feature

improves the discoverability of relevant research and simplifies the retrieval process,

making it more user-friendly and efficient.

The primary objective of this study is to create an ingenious and reliable web-based

system for managing academic materials while ensuring their preservation, accessibility,

and usability for future researchers. The system supports research innovation and

collaboration, preparing the academic community to meet the changing demands of the

digital era.

In conclusion, TCUniArch provides a modern and reliable solution for storing and

managing academic research, assuring its ongoing relevance and accessible to current

and future academics. It fills the gap between technological improvements and academic

needs, resulting in a more efficient, innovative, and collaborative learning environment.

 vii
TAGUIG CITY UNIVERSITY
TABLE OF CONTENTS
Title Page……………...…...…………………………………………...…………………………i
Acceptance and Approval Sheet……………...…...…………………...………………………ii
Acknowledgements……………...…...…………………………………………….……………iii
Dedication…...…...………………………………………………………………....…………….v
Abstract……………...…...………………………………………………………………….……vi
Table of Contents……………...…...…………………………………...………………………vii
List of Tables……………...…...…………………………………………………………………x
List of Figures……………...…...…………………………………………………..……………xi

CHAPTER I – INTRODUCTION

Project Context……………...…...……………………………………………………….1

Purpose and Description……………………..………………………………………….2

Objectives of the Study………………….…..………………...…………………………3

Conceptual Paradigm…………………..………………………………………………..4

Scope and Limitations…………………..…………………...…………………………. 6

Significance of The Study……………….…..…………………………...………………6

Definition of Terms (Technical and Operational).……..……………..………..………7

CHAPTER II – REVIEW OF RELATED LITERATURE

Review of Related Literature…………………….………………………………………9

Synthesis………………..……………………………………………………………….18

CHAPTER III – RESEARCH METHODOLOGY

Research Methodology………………………………………………………………...20

Research Method used………………………………………………………………...20

 viii
TAGUIG CITY UNIVERSITY
Population, Sample Size and Sampling Technique…………………………………21

Research Instruments………………………………………………………………….22

Description of Respondents……………………………………………………………24

Data Gathering Procedure……………………………………………………………..24

Statistical Treatment of Data……………………………………….…………………..25

Technical Requirements……….………….………………………………………...…27

Hardware Requirements……….……………………………..…….….……………...27

Software Requirements……….………………………….…………………………….28

Network Requirements…………………………………………….…………..……….32

API Specifications………………………………………………………………………32

Project Design………………………………………………………………………..…33

Diagrams………………………………………………………………………….……..36

System Architecture………………………………………………..…………………..36

Data Flow Diagram……………………………………………………..………………37

Proposed Flowchart…………………………………………….………………….......40

Unified Modeling Language……………………………….………………..………….43

Database Structure………………………………………..……………………………44

System Development…………………………………………..………………………45

Algorithm Discussion…………………………………………………………………...49

CHAPTER IV – RESULTS AND DISCUSSION

Presentation, Analysis and Interpretation of Data……………………….…………..52

A. Functional Suitability…………………………………………….…………….…….52

B. Performance Efficiency…………………………………….………………………..54
 ix
TAGUIG CITY UNIVERSITY
C. Compatibility………………………………………………….……………………...55

D. Maintainability……………………………………………………………….……….57

E. Reliability…………………………….……………………………………………….58

F. Usability…………………………………………….………………………………...60

G. Portability………………………………………………………….………………….62

H. Security……………………………………………………………………….………63

CHAPTER V – SUMMARY, CONCLUSIONS AND RECOMMENDATIONS

Summary of Findings……………………………………………………...…...………67

Conclusions………………………….………………………………………………….69

Recommendations……………………………………...………………………………70

BIBLIOGRAPHY………………………………...…………………………..…………………72

APPENDICES……………………………………………...….…………..……………………75

A. Letters………….……………………..……………………...……………………….75

B. Questionnaire……….…………………………….....…….…………………….…..76

C. User’s Manual/Screenshots of the System……………………..…………………80

D. Program code…….………………………………………….....…………..………..92

E. Certification of Grammarian…….…………….............….……………….………160

F. Plagiarism Report…….………………………………………...…….…………….161

G. Pre-Defense and Final Defense…………………………………………….…….162

Curriculum Vitae………………………………...….…………..………………..……164

Certificate of Enrollment…………………………………………………...………….168
 x
TAGUIG CITY UNIVERSITY
LIST OF TABLES

Table 1. Percentage Distribution of the Respondents……...………….…………….22

Table 2. Four-Point Rating Scale……………………………………..…..…………...23

Table 3. Functional Suitability………………………….........….….………………….52

Table 4. Performance Efficiency………………………………...…...…..……………54

Table 5. Compatibility…………………………………...….……..……….…………..55

Table 6. Maintainability……………………………………..….…………….…………57

Table 7. Reliability…………………………………...….…..……………….…………58

Table 8. Usability………………………………...….………..……………….………..60

Table 9. Portability……………………………...………....……………………………62

Table 10. Security………………………………….……………..………………....….63

Table 11. Results………………………………….……………………..……………..65

 xi
TAGUIG CITY UNIVERSITY
LIST OF FIGURES

Figure 1 Research Paradigm…………….………………………...….………………...4

Figure 2 Laptop and Mobile Phone……………………………………...….…………27

Figure 3 Bootstrap 4…………………………...…………….………………………….28

Figure 4 HTML…………………………………………………………………………..29

Figure 5 Visual Studio……………………………...….………………………………..29

Figure 6 JavaScript………………………………………………...….………………..30

Figure 7 Firebase……………………………………...….…………………………….30

Figure 8 XAMPP………………………...……………….……………………………..31

Figure 9 CSS……………………………………...….…………………………………31

Figure 10 Login……………………………………...….……………………………….33

Figure 11 Register Account……………………………………...….…………………33

Figure 12 Student Dashboard……………………………………...….………………34

Figure 13 Thesis Archives……………………………………...….…………………..34

Figure 14 Thesis Upload……………………………………...….…………………….35

Figure 15 Favorites……………………………………...….…………………………..35

Figure 16 Chatbot………………………………………….……………………………36

Figure 17 System Architecture……………………………………...….……………...36

Figure 18 Data Flow Diagram Context Level 0…………………………………….....37

Figure 19 Data Flow Diagram Context Level 1…………………………………….....38

Figure 20 User Flowchart……………………………………...….……………………40

Figure 21 Admin Flowchart…………………………………...….…………………….41

Figure 22 Chatbot Flowchart………………………………...……….………………..42

Figure 23 Unified Modelling Language……………………………………...….…….43

 xii
TAGUIG CITY UNIVERSITY
Figure 24 Database Structure……………………………………...….………………44

Figure 25 System Development……………………………………...….…………….45

Figure 26 Kanban Framework……………………………………...….………………48

 TAGUIG CITY UNIVERSITY
CHAPTER I

INTRODUCTION

PROJECT CONTEXT

A thesis is a major academic project that signifies the final chapter of a student's

graduate or undergraduate degrees. It is a comprehensive exploration of a specific topic

within a field of study. The thesis demonstrates how a student is able to conduct

independent research, analyze conclusions, and formulate strong arguments that are

supported up by facts. Finishing a thesis is a significant requirement for graduation in many

colleges and universities, especially for graduate and undergraduate courses.

The increased demand for remote access to full-text resources like thesis sky-

rocketed especially now that technology increased its availability, to save time, and for

convenience, e-library or digital library has become an essential part of knowledge for

students. Digitization, storage management, and easier extraction of information are some

of the benefits of having an online thesis management system not only for the students,

but also for the faculty and future researchers.

The educational environment continues to evolve in the age of digitization, which

calls for innovative approaches that speed up a wide range of processes, including thesis

archives and retrieval systems. Having a digital thesis management system can help

preserve the thesis and other research papers for long-term use and easy retrieval by

using databases as a storage system.

 2
TAGUIG CITY UNIVERSITY
Nowadays, museums, libraries, and other institutions of information archive their

resources to make them available for access in the future. With the increasing use of

information and the internet the availability of open-access archives is in demand for it will

be a great benefit for everyone who needs an easier way of retrieving information.

PURPOSE AND DESCRIPTION

The purpose of this paper is to develop a Web-based Thesis Management System

for College of Information and Communications Technology (CICT) Students with

Integrated Chatbot using Natural Language Processing. This study aims to enhance the

accessibility of valuable academic research that contributes to collaboration and

innovation of the future researchers. Ensuring the long-term preservation of research as

digital files are not subject to degradation or loss like physical copies, this will serve as a

safe haven for thesis and academic research.

Having an integrated chatbot can further improve the search functionality within the

system that enables the user to find a relevant thesis based on keywords, authors, or title,

that can enhance discoverability of data conveniently that is relevant to their study.

A Web-based thesis management system can provide a cost-effective and efficient

solution for preserving academic research, this ensures that valuable research remains

intact and accessible for future generations, maintaining the integrity and continuity of

academic research.
 3
TAGUIG CITY UNIVERSITY
OBJECTIVES OF THE STUDY

This study aims to enhance the development of thesis and academic researcher by

creating a web-based thesis management system with integrated chatbot.

SPECIFIC OBJECTIVES

1. Develop a user-friendly web-based platform for the integrated chatbot and thesis

management system to fully enhance the user experience and productivity of CICT

students.

2. Integrated Chatbot will serve as a personalized assistance for users to answer their

queries, provides a guidance, and addressing concerns related to thesis. Integrated

chatbot will overall increase user convenience.

3. Implementing a web-based thesis management system ensures that all students

have easy access to academic research, aiding in literature reviews and research

projects. It supports collaborative research efforts and provides effortless

navigation.

4. By using natural language processing as an algorithm, this will enhance search

accuracy and automates indexing of the thesis management system. It enables

content analysis that can improve the overall functionality and usability of the

system.

5. To test and evaluate the TCUniArch: A Web-based Thesis Management System

for CICT students with Integrated Chatbot using Natural Language Processing

using ISO/IEC 25010 in terms of:

 4
TAGUIG CITY UNIVERSITY
5.1. Functional Suitability

5.2. Performance Efficiency

5.3. Compatibility

5.4. Maintainability

5.5. Reliability

5.6. Usability

5.7. Portability

5.8. Security

CONCEPTUAL FRAMEWORK

Figure 1: Conceptual Paradigm

 5
TAGUIG CITY UNIVERSITY
The Input phase encompasses hardware and software requirements for the project.

Hardware requirements highlight the needed equipment for development of the system.

Users will access the system using desktops, laptops or phones.

Software requirements highlight Visual Studio Code as the development

environment, JavaScript, HTML, and CSS for dynamic web development and Bootstrap 4

for responsive design, and Firebase as the database system. XAMPP is used for local

server deployment.

The Process phase follows the agile methodology, with stages from requirements

collection to deployment. It begins in requirements collection to understand user needs.

Analysis phase is to fully understand the software to be built.

The design phase plans the system’s architecture and user interfaces.

Development follows, where the actual system is built, and thorough testing ensures

functionality. Deployment marks the transition to practical use, with ongoing review to

identify areas for improvement.

The Output phase is a fully functional TCUniArch: A Web-based Thesis

Management System for CICT Students with Integrated Chatbot using Natural

Language Processing. This system enhances the efficiency, accessibility, and user

experience of managing and accessing thesis and academic research. The

implementation of this system represents a significant step forward in elevating the quality

and success of thesis management and academic support, empowering users to efficiently

access, and contribute to academic research endeavors.

 6
TAGUIG CITY UNIVERSITY
SCOPE AND LIMITATION

This study is focused on a web-based thesis management system with integrated

chatbot using natural language processing. This study will serve as a pattern/guideline in

action plan for CICT Students at Taguig City University. The researchers would want to

develop a user-friendly web-based platform tailored specifically for CICT students at

Taguig City University. Implement features to facilitate the submission, storage, retrieval,

and management of thesis documents. Ensure the platform's accessibility and usability for

students, faculty, and administrators. Design the platform to streamline academic

workflows and enhance collaboration among students and faculty members. Lastly to,

integrate a responsive and intuitive chatbot interface utilizing NLP technology to provide

real-time assistance and guidance to users navigating the platform.

However, the system is limited to thesis management features for CICT students at

Taguig City University. It also excludes other academic subjects. Lastly, the chatbot

assistance is limited to thesis management and platform navigation.

SIGNIFICANCE OF THE STUDY

This study is focused on a web-based thesis management system for CICT

Students with integrated chatbot using natural language processing at Taguig City

University. The significance of our study is to ensure that the students and the lecturer are

in a position to deliver the best out of themselves.

With this, there would be good performance, when the students excel in their

studies; they will have an impact to the community and the nation large.
 7
TAGUIG CITY UNIVERSITY
This research holds significance for both educational institutions and policymakers,

as it facilitates the development of appropriate policies and the formulation of effective

solutions to address challenges arising from the suboptimal academic performance of

learners.

Librarians, for them to identify the potential to streamline thesis management

processes and improve the resource allocation within CICT departments, and this study

aims to identify the new thesis management system of Taguig City University.

Teachers, for them to be inspired on teaching more and to make their minds fresh

and relaxed by maximizing a user-friendly platform for guiding student research and

fostering collaboration within CICT departments.

Students, for them to know a dynamic platform for obtaining resources, receiving

help, and facilitating collaboration among CICT departments' research initiatives. So that

the students will enjoy going to school and can do their work to the next level and to

performing well in their work.

Future Researchers, for them to pioneer integration of technology to make the

thesis management more advanced and enhanced to support the CICT department.

School Library, as it will streamline access to academic resources and enhance

research efficiency for CICT students, ultimately fostering better engagement with the

library’s services.

DEFINITION OF TERMS

Algorithm - set of steps used to complete a specific task. They're the building blocks for
 8
TAGUIG CITY UNIVERSITY
programming, and they allow things like computers, smartphones, and websites to

function and make decisions.

Web-based - refer to a type of software that enables users to access and interact with a

remote server using a web browser interface. Unlike traditional software, web-based

applications do not require installation on a local device, and all updates and maintenance

can be performed centrally on the server-side.

E-Library - short for electronic library, is a digital collection of resources, typically

consisting of books, journals, articles, documents, multimedia materials, and other

educational or informational content.

Framework - in the context of software development, a framework is a foundational

structure that provides a set of tools, libraries, and guidelines for building applications.

Chatbot – it is a software program that can simulates human conversation through text

chats that the user can use to ask to ask a question or instruction that they need.

Natural Language Processing (NLP) – this is used to help the computer to completely

understand the human language. It is a branch of artificial intelligence that focuses on the

interaction between computer and human through natural processing.

 TAGUIG CITY UNIVERSITY
CHAPTER II

REVIEW OF RELATED LITERATURE

This chapter presents the related literature and studies pertaining to this

thesis/study. The literature review aims to provide significance of the study and further

prove its point.

Continuity of Academic Library Services during the Pandemic the University of

Toronto Libraries’ Response.

Walsh and Rana (2020) highlighted that many students of University of Toronto and

even the faculty and staff have been greatly affected by the suspension of in person

services leaving them only with remote library support in exchange of the loss to their

access to physical collections. Academic libraries have been a great tool and has created

creative solutions like virtual postcards, displays and open textbooks for free access to

students. They have pivoted that there should be an upgrade and develop the experience

of online learning of students, most especially during the pandemic.

In this study, Walsh and Rana (2020) stated that in order to continue the library

services during pandemic, leveraging and expanding the existing online services and

acquiring or creating a new research tool for students would be a great approach.

A web-based e-archives information system design in Universitas PGRI Yogyakarta

According to Oyama (2021), archiving system has a crucial role which it can

effectively manage the archiving systems of the institution and properly allows the

employees to process storage and to retrieve an important document. Addressing the

challenges at Universities PGRI Yogyakarta that is related to overloaded space and

 10
TAGUIG CITY UNIVERSITY
inefficiencies in document retrieval. The implementation of effective academic archiving

system can utilize the performance of the university.

Web-based e-archive system will optimize the convenience and security in

academic document storage and retrieval. Through a collaborative partnership with UPY's

Academic Administration Bureau their current academic archiving system will turn into a

hybrid archiving model, which combines physical and digital documents, to a

comprehensive digital framework. This transition promises to optimize the document

handling processes and optimize the overall operational efficacy of UPY's academic

administration.

ISAT U Miagao Campus Students Thesis Archiving and Profiling System

According to Montalban and Antiquera (2021), the time-consuming nature of

manual management of documents has become a concern of many organizations that can

result of inefficiencies, delays, and resource-intensive processes. The use of an electronic

archive information system to manage public documents generated by government

agencies can help to modernize record-keeping procedures, increase operational

efficiency, and improve public service delivery. The systems use digital technologies to

deliver comprehensive solutions to the organization's many concerns.

An online system with a database to store and compile students research thesis.

Archive information system not only facilitates easy retrieval of thesis abstracts but also

enhances the efficiency of research updates within the institution's Research and

Development Office.
 11
TAGUIG CITY UNIVERSITY
Theses and Dissertations Abstract E-Archiving System with SMS Support

Mondero et al. (2024) stated that thesis and dissertation system was developed to

make the storing of data much easier in organization within the university. By adding a

search functionality in the system, it can quickly find relevant information that the

researcher needed to their studies and can save time due to manual searching of the

document. The effectiveness of this system in the university has a huge impact to

advancement of technology in educational institution which can enhance the students

experience to this innovative progress of the institution.

Preserving Scholarly Endeavors: A System for Archiving Thesis and Dissertations

According to Alpasan (2022), the current manual methods approach employed by

the NIPSC Library to manage thesis and dissertation affects the outcome in several ways

such as leading to delays in accessing relevant literature for both student and library staff.

This inefficiency is an obstacle for research productivity and the timely completion of

academic projects. In order to save more time in finding related literature and to improve

the outcomes. The adoption of a digital archiving system with enhanced features will

enhance research productivity, and promote scholarly collaboration within the academic

community. Because of the efficient functionality and resource sharing, the system

enhances accessibility without compromising other library services. Effective management

of thesis and desertion can unlock new opportunities for academic excellence,

empowering students, researchers, and faculty members to thrive in an interconnected

academic community.
 12
TAGUIG CITY UNIVERSITY
Analysis of Archival Management Practices for Student Transfer: A Case Study in

Indonesia

According to Maesaroh (2021), the important role of archives in institution

especially within the educational institution, both in public and private serve as valuable

sources of information for research and institutional memory. The difficulties of loss data

in manual archiving management that contain critical information will harm the

organization in various ways like without an access to vital data, they may struggle to

perform their duties efficiently, that can lead to delays, errors, and productivity losses

which can contribute to the development of the institution.

By addressing these challenges, the university implement an archives management

system, including human resources development and the latest information to technology

application, to ensure the security of archives and mitigate the risk of errors that could

potentially damage the integrity and reputation of the institution which can lead to huge

loss. By adopting to advanced technology in human activities such as storing data, this

can optimize the accuracy and efficiency of employees work experiences.

Expanding digital academic library and archive services at the University of Calgary

in response to the COVID-19 pandemic

Murphy et al. (2020) conducted a study that highlights the importance of having a

digital academic library and archive services at the University of Calgary in response to

the COVID-19 pandemic. They asserted while pandemic changed the learning

environment for the students, accessing the offered resources and services by the library
 13
TAGUIG CITY UNIVERSITY
was not as simple as before.

When it comes to this case University of Calgary has jumped in to scale up the

online digital community including library items and as a result, they have been successful

in putting students together who addressed and worked on similar projects as well as

studies implemented showing an increase in student engagement in open-source digital

library. Digitalization transformed into increasing learning effectiveness and retention and

it also gives the base for the students to work strategically as a team and also to

collaborate more.

While of course the University faces complications, the study showed that the main

objective of the university should be to move further ahead with learning by keeping the

quality high. In this case, students of all shapes and sizes - freshman, graduates, and

faculty alike.

COVID-19 and digital library services – a case study of a university library

Mehta and Wang (2020) detailed how physical libraries adapted its existing

services into a digital format in order to support online teaching and learning during the

COVID-19 pandemic. Digital services were provided to meet end-user needs and they

have also highlighted what other approaches and initiatives are necessary for digital library

services. E-libraries were not only useful for students in the universities but also to medical

researchers and practitioners as it has been pivotal during the pandemic, it has only

proven the importance of providing digital library services during the public health crisis.

Mehta and Wang conducted this study to make other university libraries aware of the

current trend of the other libraries and what they have implemented with regards to digital
 14
TAGUIG CITY UNIVERSITY
services not only to its students, but also to its faculty.

AI-based chatbots in customer service and their effects on user compliance

Aleedy et al. (2019) conducted a research project aimed to improve customer

service by creating an interactive artificial intelligence agent, specifically a chatbot.

Customer support has evolved into an essential communication tool for businesses,

providing services before and after sales via a variety of channels including websites and

social media platforms such as Twitter. Customers' interactions with virtual agents have

become faster and more efficient thanks to technological advancements, particularly in

NLP and deep learning techniques such as Long Short-Term Memory, Gated Recurrent

Units, and Convolutional Neural Networks.

The primary objective of this research is to use advanced techniques to

automatically produce talks ("chat") between computers and humans. This entails

translating consumer questions to appropriate and automatic responses via sequence-to-

sequence learning. The work covers data preparation, model building, response creation,

and assessment measures such Bilingual assessment Understudy and cosine similarity.

A Smart Chatbot Architecture based NLP and Machine Learning for Health Care

Assistance

According to Ayanouz et al. (2020), the chatbots and their role in natural language

communication with people. The paper addressed the historical barriers to designing

effective chatbots, which were previously limited by simple statistical methods or

predefined templates and rules. However, around 2015, there was a significant shift

towards using end-to-end neural networks, specifically the encoder-decoder recurrent

 15
TAGUIG CITY UNIVERSITY
model, which originated in neural machine translation.

This architecture demonstrates a promising result in improving chatbot

conversational capabilities. Additionally, the paper examines several relevant studies and

key AI principles necessary for building intelligent conversational agents using deep

learning models. Finally, it presents a functional architecture for creating an intelligent

chatbot specifically designed for healthcare assistance.

Natural Language Processing

According to Chowdhary (2020), the enormous volume of text available in the digital

world, consider the problems and improvements in natural language processing (NLP).

While this book includes a plethora of information, humans are finding it more difficult to

sort through it properly within a limited time frame. Automated NLP tries to overcome this

issue by extracting information and wisdom from language in the same way that people

do, but on a smaller scale.

This article discusses numerous aspects of NLP, including its challenges,

advancements, applications, and components. It delves into machine-readable English

grammar as well as specific areas such as probabilistic parsing, ambiguity resolution,

information extraction, discourse analysis, natural language question-answering,

commonsense interfaces, commonsense thinking and reasoning, causal diversity, and

various NLP tools. In addition, it discusses crucial themes and includes a set of pertinent

exercises. This thorough review introduces readers to the breadth and complexity of

natural language processing, as well as its applications, problems, and approaches. It

explores how NLP enables machines to understand, interpret, and synthesize human
 16
TAGUIG CITY UNIVERSITY
language.

Educational AI Chatbots for Content and Language Integrated Learning

According to Mageira (2022), the integration of advanced artificial intelligence

technology, specifically conversational AI, in learning environments is a fascinating subject

to explore. However, this poses a significant challenge for educators and policymakers in

education, as highlighted in Mageira's 2022 paper. The potential of AI chatbots as

innovative ICT tools in education are the focus of the paper, which presents field

experiments conducted with an AI chatbot named AsasaraBot and its role in Content and

Language Integrated Learning (CLIL).

Mageira discusses an experiment using AsasaraBot to educate high school pupils about

cultural knowledge in a foreign language, such as English or French, with a particular focus

on the Minoan Civilization and the iconic figurine of the Minoan Snake Goddess. The

effectiveness of the educational program utilizing the chatbot was examined in both public

and private language schools throughout Greece.

The trials' results suggest that AI chatbot technology can effectively enhance

interactive ICT-based learning, especially when learning foreign languages and cultural

information simultaneously. It's worth noting that the AsasaraBot chatbot was created as

part of a postgraduate project that utilized open-source and free technologies.

Chatbots and messaging platforms in the classroom: An analysis from the teacher’s

perspective

According Merelo et al. (2024), the transformative impact of conversational agents

on our daily lives, highlighting their omnipresence and potential to assist anytime,
 17
TAGUIG CITY UNIVERSITY
anywhere, from mobile phones to smart homes.

In education, these agents have the potential to revolutionize traditional teaching

methods by serving as complementary tools for teachers, delivering pedagogical content,

assessing students, and providing real-time feedback using multimedia content and

speech.

This perspective shift is essential for all teachers, students, and educational

institutions utilizing messaging platforms and chatbots. A clear understanding of teachers’

perspectives is crucial for enhancing the design and implementation of these platforms.

Moreover, analyzing teachers’ viewpoints based on factors like gender, experience, and

disciplinary specialization offers valuable insights for developing effective messaging

platforms and chatbots.

In summary, this exploration is a pivotal stride toward comprehending teachers’

perceptions and experiences concerning messaging platforms and associated services.

The insights gleaned from this examination can guide educational institutions in more

effectively implementing these platforms, thereby improving learning outcomes for

students.

Medical and health informatics services during and after the COVID-19 pandemic

should be virtual, tailored, responsive and interactive: a case study in Belgium

Pauwels et al. (2020) proposed that having a virtual research library space is a big

help in transitioning to online education during COVID-19 Pandemic. Because during this

catastrophe, as the government ordered the mandatory closure of non-essential

 18
TAGUIG CITY UNIVERSITY
workspace to help fight the spread of the virus, libraries were also affected by this action.

Researchers were instead provided with links, data, and other search strategies

remotely, and this has proven the effectiveness of digital libraries as they now prefer

directing into the digital center rather than going into a physical library, as it has proven to

be easier to access and has lessen their time searching for related literature and studies

for their research. On the other hand, physical libraries have evolved into a more social

environment that the students prefer to go to when they want to study and work on their

tasks.

Academic Research Archive System Of ABC Company Capstone Project Document

According to Gayatao et al. (2022), the research project stored manually in the

library makes researcher's waste their time in finding the related thesis or book that they

want. And as the technology advances, one thing that researchers have to deal with is

manually compiling books and studies related to their project and misplacement made it

hard for them to find the suitable and related studies to their research.

In the study of Gayatao et al. (2022) suggested that having an Academic Archive

system is ideal and needed in terms of effectiveness in storing, compiling and is efficient

in finding related research studies of the students.

It also aims to reduce the amount of physical space used to store hardcopy of

documents while also making it easy in terms of providing an easy access to information

that the students need in their study.

SYNTHESIS

The related literature and studies mentioned above provide the information needed
 19
TAGUIG CITY UNIVERSITY
to investigate the researchers on how web-based thesis management system will become

helpful with the continuous growth of the use of technology especially in education.

Today, many advanced technologies are seen as basic requirements for operating

a modern educational establishment, with a prominent role being played by computerized

archival and library systems. These studies underline that the need for smart and clear

management of the documents and resources arises especially in the situation the space

constraints or the challenge of remote studying during the pandemic.

Major topics address the computerization of the records keeping to ensure the

effectiveness, security of documents and boost the speed of processes. Collaborations

between academic institutions and technology partners are made visible as a crucial factor

in hybrid archiving addressing simultaneously hard copies and digital documents.

Additionally, novel methods like coming up with e-archives systems that can be

accessible on the web, establish communication channels for students using chatting bots

that are equipped with the latest techniques in natural language processing are both

crucial to meet the needs that are emerging in academic institutions. This technology

enables not just document management but also allows better customer support services

and scholarly collaboration within the academic institutions.

The synthesis reaffirms the transformative influence of technology on the

educational habitats through highlighting various tools that help in facilitating the

adaptation process in changing educational environment and which in turn enhance

learning outcomes for the students and faculty members alike.

 TAGUIG CITY UNIVERSITY
CHAPTER III

METHODOLOGY

RESEARCH METHODOLOGY

This chapter elaborates the process of data collection and its analysis. It shows the

research design and describes in detail the tools and techniques of data collection, the

research instruments, and analysis of the research. Also, this chapter discusses the

technology to be implemented, and the rationale behind all of the technical developments

for the proposed system.

RESEARCH METHOD USED

To conduct this study, the researchers utilized quantitative method. To be more

precise, the researchers used survey and evaluation methods. A system was assessed

and built in line with ISO/IEC 25010 using frequency and percentage distributions, a four-

point Likert scale, and a weighted mean. The students and faculty of the College of

Information and Communications Technology were also asked for their recommendations.

The researcher completed the system using agile model by following a methodical

process. The System Development Life Cycle (SDLC) model was used as a guide through

the system analysis and design process as the researcher uses the project development

technique to assist in system development.

The agile model was used as the SDLC procedure. This strategy was used because

it allows for active engagement, makes it easier to identify skills that are deficient, offers

quick feedback, and is flexible.

 21
TAGUIG CITY UNIVERSITY
PARTICIPANTS, POPULATION AND SAMPLE

The respondents to this study were students from the College of Information

Communication at Taguig City University. The researchers have a total of 455 college

students from the aforementioned college department.

This study's sample technique was convenience sampling. To evaluate the system,

the researchers employed this technique with third-year college students from the College

of Information and Communication Technology department at Taguig City University.

POPULATION FRAME AND SAMPLING SCHEME

The population is comprised 3rd year students from the College of Information in

Communication Technology (CICT), CICT faculty members from Taguig City University,

Information Technology (IT) practitioners, and librarian.

The stratified random sampling technique was used as a sampling technique to

choose the participants from 3rd year CICT students, CICT faculty members, Information

Technology practitioners, and librarian. It means that only those who have direct

participation in the presentation and demonstration of the system were considered to be

the respondents of the survey.

To determine the sample size, the researchers used the Slovin’s formula.

n = (Z^2 * p * q) / E^2

Where:

n = sample size Z = Z-score (confidence level)

p = population portion q=1–p

E = Margin of error
 22
TAGUIG CITY UNIVERSITY
Table 1

Percentage Distribution of the Respondents

RESPONDENTS FREQUENCY(F) SAMPLE PERCENTAGE (%)

CICT 3rd Year Students 455 129 89%

CICT Faculty Members from

27 5 3%
Taguig City University

Librarian 6 6 4%

IT Practitioners 5 5 3%

Total 493 145 100%

Table 1 shows the researchers target respondents in this study are 3rd year

students of the College of Information in Communication Technology that consists of 213

and 86%, CICT Faculty Members 25 with a 10%, Librarian 6 with 2% and IT Practitioners

5 with 5 with 2% with a total of 100%.

RESEARCH INSTRUMENT

The survey questionnaire was the research tool utilized in the study, and the results

were analyzed and subjected to analysis. The questionnaire created was organized in a

straightforward and clear way. A research questionnaire also describes the characteristics

provided by ISO/IEC 25010 standards for Functional Suitability, Performance Efficiency,

Usability, Reliability, Portability, Security, and Maintainability.

 23
TAGUIG CITY UNIVERSITY
The survey questionnaire was divided into three parts. The first part is the

Demographic Profile of the respondents consisting of Name, Section, and Gender. The

second part is multiple choices. The third part is the system's accuracy. The respondents'

level of approval of the developed procedure in terms of its functionality, usability,

efficiency, and effectiveness was covered in the last part of the survey questionnaire. The

data gathering instrument was structured as a scale ranging from 1 – 4. Where in (4) Highly

Acceptable, (4) Moderately Acceptable, (2) Fairly Acceptable (1) Poorly Acceptable.

Table 2

Four-Point Rating Scale

Weight Mean Value Verbal Interpretation

4 4.00 – 3.01 Highly Acceptable

3 3.00 – 2.01 Moderately Acceptable

2 2.00 – 1.01 Fairly Acceptable

1 1.00 – 0.99 Poorly Acceptable

1. Cochran’s Formula – used to compute the sample size of population. It is used to

ensure reliable and accurate results.

Formula:

Sample Size:

n = (Z^2 * p * q) / E^2
 24
TAGUIG CITY UNIVERSITY
Where:

n = sample size Z = Z-score (confidence level)

p = population portion q=1–p

E = Margin of error

Where:

n = Sample Size

N = Total number of Population

DESCRIPTION OF RESPONDENTS

The researchers' target respondents in this study are students at Taguig City

University's College of Information and Communications Technology (CICT), the faculty

members, IT Practitioners, and the school Librarian. These students are a broad group

with varying levels of knowledge in computer science, information technology, and related

subjects.

DATA GATHERING PROCEDURE

The Data Gathering procedure for the Web-based Thesis Management System

involves collecting the information from the 3rd year students of the CICT Department

using an online and face-to-face survey. They chose their answers based on the

respondent’s level of preference. To ensure that the respondents can provide accurate

and relevant answers, the researchers distributed the questionnaires and presented the

system to the respondents personally.

 25
TAGUIG CITY UNIVERSITY
Every chosen participant was given a questionnaire, and after answering it, the

results were tallied, grouped, and statistically processed. The researchers collected and

evaluated the data gathered. The procedure for collecting data for the study titled "A Web-

Based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing."

These are the processes of getting the population and sample size, and also how

we gathered the data.

First each respondent of College of Information Communication Technology 3rd

year students, CICT Faculty Members, Information Technology Practitioner, and Librarian

and gave them instructions about the questionnaire regarding to the system.

Second the respondents were provided with the opportunity to evaluate the system.

the researcher assessed the respondents’ comments regarding the system's suitability in

terms of functional suitability, portability, reliability, and maintainability.

Third the following evaluation, the respondents were provided with a questionnaire

to initiate the system's evaluation process.

Finally, the feedback was gathered from the respondents regarding their

experience with the system, providing valuable insights for further enhancement of the

system.

Statistical Treatment of Data

The researchers evaluated the result of the collected information using various

statistical tools such as weighted mean and percentage. These statistical tools helped to

determine the respondents’ views on the proposed system.

 26
TAGUIG CITY UNIVERSITY
These statistical tools used were listed below:

1. Percentage Formula

As a qualitative statistic, percentage is used to determine the status of people with

regard to their characteristics and was used to determine the percentage of how many

respondents agreed with an answer in the questionnaire.

Formula:

Where:

P = Percentage

A = Amount

B = Total unit

2. Weighted Mean Equation

It was used to determine the general average of the assessment of the participants

in different criteria set by the International Standardization Organization (ISO). It is a

statistical method which calculated the average by Multiplying the weights with its

respective mean and taking its sum. It is a type of average in which weights are assigned

to individual values in order to determine the relative importance of each observation.

Formula:
 27
TAGUIG CITY UNIVERSITY
Weighted Mean = ∑f x

Where:

∑ = Summation Symbol

f = frequency

x = unit weight

n = total number of respondents

TECHNICAL REQUIREMENTS

HARDWARE REQUIREMENTS

Figure 2. Laptop and Mobile Phone

For hardware requirements, we used laptops as our main tool for developing the

system code. The laptop is the best choice for developing because of versatility and the

power for handling the process of the program.

The minimum specification requirements for the laptop are at least for CPU:
 28
TAGUIG CITY UNIVERSITY
Intel (R) Core(TM) i3-7100U CPU @ 2.40GHz RAM: 8.00 GB GPU: Any Intel HD Graphics

620 Driver and Storage: 200GB (Applications for developing the system estimated storage

size). The android was used for the testing of responsiveness in phone view designing;

the android gave us the ability to look at the actual output of the system if viewed/used in

an android phone. The minimum specification requirements for android phones are any

Android 8 and above.

SOFTWARE REQUIREMENTS

Figure 3. Bootstrap 4

Bootstrap is an outstandingly versatile front-end framework employed in the

development of mobile-first, responsive and flexible websites and applications. At the time

when my last update was done, the bunch of components which are ready to be used

such as the buttons, forms, navigation bars, and so on, also the grid system with complex

CSS styles which are customizable are part of Bootstrap 4.

One of Bootstrap's primary advantages is its huge library of pre-designed

components and utilities, which help to ease the development process and ensure the

consistency across different devices.

 29
TAGUIG CITY UNIVERSITY

Figure 4. HTML

HTML, often abbreviated as Hypertext Markup Language, is used as the standard

markup language in creating web pages and web applications. It does this because it is

the foundation of content on the internet thus, it classifies meaning of documents features

and the structure of elements that are present. HTML serves as our system's primary

programming language. It aids us in developing our ideal system for this research because

it is simple to understand. Web browsers interpret HTML documents and render them as

visual web pages for users to view and interact with.

Figure 5. Visual Studio Code

Visual Studio Code (VS Code), which is created by Microsoft, is a free source-code

editor with an added feature set. It can be changed according to our need, it is very fast

and at the same time it supports multiple programming languages, which makes

development simpler. It embodies a powerful code editor that gives support for functions
 30
TAGUIG CITY UNIVERSITY
like syntax highlight, autosuggest, and code snippet, which consequently helps developers

to write and edit code efficiently.

Figure 6. JavaScript

JavaScript is a plaintext, interpreted programming language that is widely used in

web development, especially for the client side. It provides developers with the ability to

output interactivity and event handling behaviors on a webpage which leads to

manipulating webpage content in response to user actions. It is quick and light weight so

it was even made to do complicated tasks such as form validation, animation, DOM

manipulation and asynchronous requests (AJAX). The difference between these two

JavaScripts frameworks lies in their main functionality: The primary purpose of the JSJS

is to create client-side web development whereas Node.js can be used either on the client

or the server side.

Figure 7. Firebase
 31
TAGUIG CITY UNIVERSITY
Firebase is a Google product that helps developers build, manage, and grow their apps

easily. It makes it possible for developers to create apps more quickly and securely,

without having to write any code on the Firebase side. This makes it easier for developers

to use all of the features that Firebase has to offer. This is the main reason why we chose

Firebase for our database.

Figure 8. XAMPP

XAMPP is an open-source software package that provides a local web server

environment for testing and development. It helps you test web applications locally before

deployment, ensuring they function correctly on a live server.

Figure 9. CSS

CSS, or Cascading Style Sheets, is a style sheet language that gives you color and

other visual attributes as well as the ability to control the appearance and layout of HTML

documents. CSS forms a base technology of web development that assists developers in
 32
TAGUIG CITY UNIVERSITY
controlling and manipulating the look (tone) of web pages that include the elements like

text, colors, fonts, spacing, and positioning, amongst others.

It gives attributes like media queries and flexible layout architecture (page - lay

outing), as well as flexbox and grid (), equally help to establish responsive web designs

that make the pictures portable to fit within the different screen sizes of desktops, tablets

and smartphones, providing a consistent user experience to these different devices.

NETWORK REQUIREMENTS

The network must efficiently accommodate PC and laptop users, ensuring secure

connections, better backup systems, and responsive performance. Moreover, the web

interface should seamlessly operate across standard browsers such as Chrome, Firefox,

or Safari to facilitate user interaction.

To achieve this, strong authentication protocols and encryption mechanisms should

be implemented to protect user data and prevent unauthorized access. Additionally,

regular system updates and automated backups are essential to ensure data integrity and

minimize downtime. Optimizing server performance and load balancing will further

enhance responsiveness, providing users with a smooth and reliable experience across

different devices and network conditions.

API SPECIFICATION

Visual Studio Code, which is advised as the main IDE for developers who intend to

expand the program, is used to develop the system.

 33
TAGUIG CITY UNIVERSITY
Through its features, the development workflow is much improved, resulting in

improved debugging and code management.

PROJECT DESIGN

Figure 10. Login Figure 11. Register Account

 34
TAGUIG CITY UNIVERSITY

Figure 12. Student Dashboard

Figure 13. Thesis Archives

 35
TAGUIG CITY UNIVERSITY

Figure 14. Thesis Upload

Figure 15. Favorites

 36
TAGUIG CITY UNIVERSITY

Figure 16. Chatbot

DIAGRAMS

System Architecture Framework

Figure 17. System Architecture

A system structure, behavior, and other aspect are all defined by its conceptual
 37
TAGUIG CITY UNIVERSITY
model or system architecture. The system architecture for integrating a chatbot. A chatbot

interface facilitates user interaction, an analytics engine processes data, an integration

layer links these elements, a database stores data, and an TCUniArch database generates

a valuable information in the system.

DATA FLOW DIAGRAM

Context Level/Diagram 0

Figure 18. Data Flow Diagram Context Level 0

The Context Level or Diagram 0 of Thesis Management System with Integrated

Chatbot provides a high-level overview. It depicts the main system at the center with the

user and admin incorporating an effective Thesis Management functionality, chatbot

features, and data analytics. External entities like students, librarian, admin, thesis and

other systems are illustrated, emphasizing data flows.

 38
TAGUIG CITY UNIVERSITY
This diagram serves to outline the system's scope within the context of TCUniArch:

A Web Based Thesis Management with Integrated Chatbot using Natural Language.

DFD LEVEL 1
 39
TAGUIG CITY UNIVERSITY
Figure 19. Data Flow Diagram Context Level 1

The Level 1 Data Flow Diagram (DFD) for the Thesis Management System with

Integrated Chatbot features for CICT Students it provides a detailed understanding of the

system's internal workings. It breaks down main processes and data flows, such as User

Authentication and Thesis Details interconnects them with data stores and external

entities.

Arrows represent the flow of data between these elements, illustrating how

information moves through the system. This diagram helps identify specific functionalities

and their interactions, providing a more granular understanding of the system's internal

workings.

By mapping out these interactions, the DFD helps to optimize system efficiency,

ensure smooth data handling, and improve chatbot responses to user queries. It also

assists developers in identifying potential areas for improvement, ensuring that the system

is user-friendly, responsive, and meets the goals of CICT students.

 40
TAGUIG CITY UNIVERSITY
Proposed Flow Chart

Figure 20. User

 41
TAGUIG CITY UNIVERSITY

Figure 21. Admin

 42
TAGUIG CITY UNIVERSITY

Figure 22. Chatbot

 43
TAGUIG CITY UNIVERSITY
Unified Modelling Language (Prototype)

Figure 23. Unified Modeling Language

User and Librarian are the main user in the diagram for the Thesis Management

System. The two primary users are interacting with the chatbot and viewing all of the

available thesis and research in the CICT department. Through these, each user engages

with the system, illustrating its fundamental features and user-system interactions. The

diagram provides a clear overview of how a user interact with the Thesis Archiving System,

which includes Integrated Chatbot features within Taguig City University. It visually

representing the system's high-level functionalities and user roles.

 44
TAGUIG CITY UNIVERSITY
Database Structure

Figure 24. Database Structure

Figure 24 shows the structure of the system’s database. Each table has a primary

key (PK) that serves as a unique identifier, non-nullable, and unchangeable. It uniquely

distinguishes each record, links tables through foreign keys (FK). FK’s links tables and

connects related data. As shown in the figure, each table of the system contains one (1)

primary key, for User, Student ID and User Authentication table the PK is the ‘studentID’,
 45
TAGUIG CITY UNIVERSITY
for Thesis table ‘email email’ serves as the primary key, for email table; ‘email’, Name;

‘name’, Title’ ‘title’, Author; ‘author’, Year; ‘year’, and Abstract; ‘abstract’.

SYSTEM DEVELOPMENT

Figure 25. System Development

Figure 25 presents the system development of the system; the researchers used

the Agile Methodology. The researchers chose the Agile Model as a methodology because

the model demonstrates how the growth of the system is divided into a series of linear

phases. These phases include:

REQUIREMENTS

The researchers decided to implement the minimum requirements to create the

system which includes; the version of the software needed in creating the system since

the researchers have limited resources.

 46
TAGUIG CITY UNIVERSITY
They choose the best yet friendly software that the user also uses if they also have

limited resources.

DESIGN

For this phase, the researchers used HTML and CSS for the front end of the

application. They came up with simple color palette so that every user can be more

interested in using the application. It took several days of brainstorming to decide on which

perfect color match that suits the application system. The researchers have also decided

what the final output will look like after development is concluded, leaving out any

potentially dangerous design decisions along the way. The team will have a clear

understanding of the features and internal structure by the time this phase is complete.

DEVELOPMENT

In this phase, developing the “TCUniArch: A Web-based Thesis Management

System for CICT Students with Integrated Chatbot using Natural Language Processing" is

under development. The researchers are still working to make the system fully functional

and performed several testings to the system every now and then to see any progress or

error of the application system and be able to fix it right away.

TESTING

Testing the development system goes underway this stage so as to bypass the

bugs, flaws and extraneous features together with the much-accurate and core
 47
TAGUIG CITY UNIVERSITY
functionalities; some of which can be improved or added. It contains also specific changes

as requested by user and conflict resolution.

During this phase, several testing methods are used to ensure system reliability

and performance, including unit testing, integration testing, and user acceptance testing.

Any detected faults are rectified as soon as possible to improve functioning and user

experience.

The major part of the preorganization is the evaluation and the implementation of

the components where eventually, the designed components are introduced one at a time.

At the eleventh hour we may redo some info system details and such changes CAN

possibly lead to with the info system being fine-tuned towards doing partly or all hereof

better.

DEPLOYMENT

In this phase, the researchers ensured that the system is in perfect condition and

ready to be deployed for the users to be able to use it. The system was tested by the users

to see if it functions correctly.

REVIEW

In this phase, the researchers reviewed the user’s feedback about the system’s

functions and determined whether additional changes and repairs are needed.
 48
TAGUIG CITY UNIVERSITY
User feedback is critical for identifying potential changes and ensuring that the

system meets users' expectations. Any necessary changes are made to improve usability,

correct problems, and maximize efficiency.

Figure 26. Kanban Framework

TO-DO LIST

In developing the study, the researchers used the Kanban framework to put into

practice the idea of continuous improvement and the application of the Agile Methodology,

where tasks are 'drawn' into a constant flow of work from a product backlog. In the first

phase of developing the project, researchers visualize the workflow. We list all the work

must do.

WORK-IN-PROGRESS

In the second phase, after the researchers list all the work, they ensure to limit the

amount of work in progress so that they will not be overwhelmed with the tasks that are
 49
TAGUIG CITY UNIVERSITY
needed to do. When something is finished from work in progress, the next highest priority

item from the backlog is pulled into play.

READY FOR DEPLOY

The third phase is the making sure that the system is ready to deploy. We make

sure that the works in progress are all finished and that there are no bugs and errors in

the system. At this point, final testing is carried out to ensure system stability, security, and

performance. Any remaining issues are addressed, and the necessary optimizations are

implemented.

APPROVING

The fourth phase is the validating phase it is where the testing part of the project

happens. We ensure that the work in progress must test before it is put in the complete

stage. In this phase, we ensure that it meets the criteria or specifications of the work

needed.

COMPLETE

The last phase is when all the backlogs are finished. We keep fetching tasks in

backlogs and working on them until all the backlogs are finished or done. It is where the

system is ready to deploy.

ALGORITHM DISCUSSION
 50
TAGUIG CITY UNIVERSITY
STRENGTHS AND WEAKNESSES

It can understand and process large amount of text that enables the applications to

summarize and to answer the questions of the user. Personalized recommendations and

responses in applications like virtual assistants that can improve user experience. This

can analyze the user preferences to suggest relevant thesis and related research.

High computational and energy costs for training. Data depends on a large, diverse

datasets, which may not be available for all languages or domains. The models inherit and

amplify biases present in the training data, that results to unfair or biased outcomes.

USES

The user can communicate with the chatbot to look for theses and request

recommendations for particular articles. In order to maximize functionality and enhance

the user experience overall, it can track and evaluate how users interact with the system.

Enabling the chatbot to comprehend and handle intricate search requests, taking the

context into account to provide more precise responses.

It enhances the search results by automatically suggesting relevant terms and

honing user requests. Help users find relevant fields or new research subjects depending

on their inquiries.

FEATURES

The Natural Language Processing (NLP) algorithm provide a better, more human
 51
TAGUIG CITY UNIVERSITY
experience for user unlike a robotic and impersonal experience. It has an ability of a

computer program to understand human language as it's spoken and written referred to

as natural language.

The rule-based or machine learning approaches to understand the structure and

meaning of a text. It plays a role in chatbots assistants that increases productivity and

simplifies different processes.

FUNCTION

The Natural Language Processing algorithm serves various purposes such as

producing a concise summarization of texts while keeping the most important information,

which can be useful for search engine optimization.

NLP can suggest possible completion for partially written text, these can use to

generate more natural response based on user input. Implementing NLP in chatbot can

fully understand natural language inputs from users, including the words and context that

can improve the overall accuracy of understanding the use intents.

Chatbots can engage more natural and can have a fluid conversation like human

interaction to users. By the use of NLP in chatbot they can adapt to changes in user

behavior to ensure that they remain effective and relevant.

 TAGUIG CITY UNIVERSITY
CHAPTER IV

PRESENTATION, ANALYSIS AND INTERPRETATION OF DATA

This chapter highlights the presentation, analysis, and interpretation of the research

data that were gathered in order to provide systematic, valid, and reliable answers to the

problems identified for this study.

1.1. Functional Suitability

Table 3 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Library Staff/Librarian, CICT Faculty Members, and IT Practitioners on the

functional suitability of the system.

Table 3

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language
Processing in terms of Functional Suitability
1 Functional 3rd Year Librarian CICT IT Average
Suitability CICT Faculty Practitioner Summary
Students Members

WM VI WM VI WM VI WM VI WM VI

1.1 Functional 3.75 HA 3.20 HA 3.40 HA 3.60 HA 3.49 HA

Completeness.

1.2 Functional 3.52 HA 3.40 HA 3.80 HA 3.40 HA 3.53 HA

Correctness.

1.3 Functional 3.56 HA 3.20 HA 3.00 HA 3.80 HA 3.39 HA

Appropriateness.

Overall Weighted Mean 3.61 HA 3.27 HA 3.40 HA 3.60 HA 3.47 HA

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

 53
TAGUIG CITY UNIVERSITY
Table 3 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Functional Suitability. The overall weighted

mean of the evaluation of the developed system is “3.47”, interpreted as “Highly

Acceptable”.

The result shows that the CICT Students got the highest evaluation who gathered

an evaluation rating of “3.61” (Highly Acceptable), followed by IT Practitioners with an

evaluation rating of “3.60 (Highly Acceptable). Next are the CICT Faculty Members who

gathered an evaluation rating of “3.40 (Highly Acceptable), while Librarian got an

evaluation rating of “3.27” (Highly Acceptable).

These findings show that, out of all the groups polled, CICT students had the most

positive opinion of the subject under evaluation. The small discrepancy between CICT

students' and IT practitioners' scores points to a relatively stable degree of acceptance

among those actively involved in the technology industry.

It can also be noted that the indicator “Functional Correctness” obtained the highest

evaluation of “3.53”, interpreted as “Highly Acceptable”, followed by “Functional

Completeness” with an evaluation of “3.49” (Highly Acceptable), while the “Functional

Appropriateness” got the lowest evaluation of “3.39” (Highly Acceptable).

2.1. Performance Efficiency

Table 4 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the performance

efficiency of the system.

 54
TAGUIG CITY UNIVERSITY
Table 4

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Performance Efficiency
3rd Year CICT
Performance IT Average
2 CICT Librarian Faculty
Efficiency Practitioner Summary
Students Members

WM VI WM VI WM VI WM VI WM VI

2.1 Time 3.53 HA 3.40 HA 3.60 HA 3.60 HA 3.53 HA

Behavior

2.2 Resource 3.47 HA 3.00 HA 3.40 HA 3.20 HA 3.27 HA

Utilization

1.3 Capacity 3.57 HA 3.20 HA 4.00 HA 3.80 HA 3.64 HA

Overall Weighted 3.52 HA 3.20 HA 3.67 HA 3.53 HA 3.48 HA

Mean

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 4 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Performance Efficiency. The overall weighted

mean of the evaluation of the developed system is “3.48”, interpreted as “Highly

Acceptable”.

The result shows that the CICT Faculty Members got the highest evaluation with

an evaluation rating of “3.67” (Highly Acceptable), followed by IT Practitioners who

gathered an evaluation rating of “3.53” (Highly Acceptable), then the CICT Students with

an evaluation rating of “3.52” (Highly Acceptable), while Librarian got an evaluation rating

of “3.20” or “Highly Acceptable”.

 55
TAGUIG CITY UNIVERSITY
It can also be noted that the indicator “Capacity” obtained the highest evaluation of

“3.64” (Highly Acceptable), followed by “Time Behavior” with evaluation of “3.53” (Highly

Acceptable), while the “Resource Utilization” got the lowest evaluation of “3.27” (Highly

Acceptable).

3.1. Compatibility

Table 5 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the compatibility

of the system.

Table 5

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Compatibility
3 3rd Year CICT
Compatibility IT Average
CICT Librarian Faculty
Practitioner Summary
Students Members

WM VI WM VI WM VI WM VI WM VI

3.1 Co-existence 3.67 HA 3.20 HA 3.80 HA 3.80 HA 3.62 HA

3.2 Resource 3.35 HA 3.20 HA 3.80 HA 3.40 HA 3.44 HA

Utilization

Overall Weighted 3.51 HA 3.20 HA 3.80 HA 3.60 HA 3.53 HA

Mean

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 5 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Compatibility. The overall weighted mean of the
 56
TAGUIG CITY UNIVERSITY
evaluation of the developed system is “3.53”, interpreted as “Highly Acceptable”.

The result shows that the CICT Faculty Members got the highest evaluation who

gathered an evaluation rating of “3.80” (Highly Acceptable), followed by IT Practitioners

with an evaluation rating of “3.60” (Highly Acceptable), then the CICT Students who

gathered an evaluation rating of “3.51” (Highly Acceptable), while Librarian got the

evaluation rating of “3.20” (Highly Acceptable).

Given their proficiency in assessing systems, technologies, or procedures pertinent

to their sector, their broad academic and professional background may have played a role

in their high grade. With a rating of 3.60, the IT practitioners, who come in second, also

showed a high degree of acceptance, probably as a result of their real-world experience

and industrial expertise. The CICT Students, on the other hand, showed a similarly

favorable assessment, with a rating of 3.51 that reflected their first-hand experience and

usability viewpoint. Last but not least, the Librarian's evaluation of 3.20 is the lowest of the

four groups, but still falling within the "Highly Acceptable" range.

This could be because of variations in usage patterns, expectations, or professional

involvement with the issue under evaluation. It can also be noted that the indicator “Co-

existence” obtained the highest evaluation of “3.62” (Highly Acceptable), followed by

“Resource Utilization” with evaluation of “3.44” (Highly Acceptable).

4.1. Maintainability

Table 6 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the

 57
TAGUIG CITY UNIVERSITY
maintainability of the system.

Table 6

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Maintainability

4 3rd Year CICT

Maintainability IT Average
CICT Librarian Faculty
Practitioner Summary
Students Members

WM VI WM WM VI VI WM VI WM VI

4.1 Modularity 3.63 HA 3.20 HA 3.20 HA 3.40 HA 3.33 HA

4.2 Reusability 3.49 HA 3.20 HA 3.20 HA 3.40 HA 3.32 HA

4.3 Analyzability 3.43 HA 3.20 HA 3.80 HA 3.80 HA 3.46 HA

4.4 Modifiability 3.54 HA 3.40 HA 3.80 HA 3.60 HA 3.56 HA

Overall Weighted Mean 3.52 HA 3.25 HA 3.50 HA 3.55 HA 3.42 HA

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 6 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Maintainability. The overall weighted mean of

the evaluation of the developed system is “3.42”, interpreted as “Highly Acceptable”.

The result shows that the IT Practitioners got the highest evaluation who gathered

an evaluation rating of “3.55” (Highly Acceptable), followed by CICT Students who

gathered an evaluation rating of “3.52” (Highly Acceptable), then the CICT Faculty

Members who gathered an evaluation rating of “3.50” (Highly Acceptable), while the

Librarian got the evaluation rating of “3.25” (Highly Acceptable).

 58
TAGUIG CITY UNIVERSITY
It can also be noted that the indicator “Modifiability” obtained the highest evaluation

of “3.56(Highly Acceptable), followed by “Analyzability” with an evaluation of “3.46” (Highly

Acceptable), then “Modularity” with evaluation of “3.33” (Highly Acceptable), while the

“Reusability” got the lowest evaluation of “3.32” (Highly Acceptable).

5.1. Reliability

Table 7 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the performance

efficiency of the system.

Table 7

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Reliability
5 3rd Year CICT IT Average
Reliability CICT Librarian Faculty Practitioner Summary
Students Members

WM VI WM VI WM VI WM VI WM VI

5.1 Maturity 3.71 HA 3.40 HA 3.80 HA 3.60 HA 3.63 HA

5.2 Availability 3.40 HA 3.40 HA 4.00 HA 3.80 HA 3.65 HA

5.3 Fault Tolerance 3.52 HA 3.20 HA 3.80 HA 3.60 HA 3.53 HA

5.4 Recoverability 3.53 HA 3.20 HA 3.20 HA 3.40 HA 3.33 HA

Overall Weighted Mean 3.54 HA 3.30 HA 3.70 HA 3.60 HA 3.53 HA

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 7 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using
 59
TAGUIG CITY UNIVERSITY
Natural Language Processing in terms of Reliability. The overall weighted mean of the

evaluation of the developed system is “3.53”, interpreted as “Highly Acceptable”.

The result shows that the CICT Faculty Members got the highest evaluation who

gathered an evaluation rating of “3.70” (Highly Acceptable), followed by IT Practitioners

who gathered an evaluation rating of “3.60” (Highly Acceptable), then the CICT Students

who gathered an evaluation rating of “3.54” (Highly Acceptable), while Librarian got the

evaluation rating of “3.30” (Highly Acceptable).

Since they are qualified to analyze the system or concept from both theoretical and

practical viewpoints, their vast knowledge and experience in the sector may have helped

to provide this favorable evaluation. IT practitioners received a positive evaluation rating

of 3.60, which was probably impacted by their firsthand experience with real-world

applications and industry standards.

The CICT students, on the other hand, gave the subject a very satisfactory grade

of 3.54, indicating that they valued it, maybe as a result of its applicability and connection

to their academic requirements. Even though the Librarian's rating was the lowest at 3.30,

it is still within the "Highly Acceptable" category, indicating a generally good perception

about one that is somewhat lower because of differing exposure and engagement levels

with the subject under evaluation.

It can also be noted that the indicator “Availability” obtained the highest evaluation

of “3.65” (Highly Acceptable), followed by “Maturity” with “3.63” (Highly Acceptable), “Fault

Tolerance” with evaluation of “3.53” (Highly Acceptable), while the “Recoverability” got

the lowest evaluation of “3.30” or “Highly Acceptable”.

 60
TAGUIG CITY UNIVERSITY
6.1. Usability

Table 8 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the usability of

the system.

Table 8

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Usability
3rd Year CICT
Usability IT Average
6 CICT Librarian Faculty
Practitioner Summary
Students Members

WM VI WM VI WM VI WM VI WM VI

6.1 Appropriateness 3.79 HA 3.40 HA 3.80 HA 3.60 HA 3.65 HA

Recognizability

6.2 Learnability 3.50 HA 3.40 HA 4.00 HA 3.60 HA 3.63 HA

6.3 Operability 3.56 HA 3.40 HA 4.00 HA 3.60 HA 3.64 HA

6.4 User-Error 3.52 HA 3.40 HA 3.20 HA 3.80 HA 3.48 HA

Protection

6.5 User-Interface 3.57 HA 3.40 HA 3.20 HA 3.00 HA 3.29 HA

Aesthetics

Overall Weighted Mean 3.59 HA 3.40 HA 3.64 HA 3.52 HA 3.54 HA

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 8 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Usability. The overall weighted mean of the

evaluation of the developed system is “3.54”, interpreted as “Highly Acceptable”.

 61
TAGUIG CITY UNIVERSITY
The result shows that the CICT Faculty Members got the highest evaluation who

gathered an evaluation rating of “3.64” (Highly Acceptable), followed by CICT Students

who gathered an evaluation rating of “3.59” (Highly Acceptable), then the IT Practitioners

who gathered an evaluation rating of “3.52” (Highly Acceptable), while Librarian got the

evaluation rating of “3.40” (Highly Acceptable).

Since they have a thorough comprehension of the evaluation criteria, their

knowledge and wealth of experience in the field probably contributed to their favorable

rating. Closely behind, the CICT students received an evaluation rating of 3.59, indicating

that they had a positive opinion of the subject, maybe as a result of their familiarity with it

and direct involvement with it. With a rating of 3.52, the IT Practitioners also demonstrated

a very respectable degree of agreement.

Though still falling within the "Highly Acceptable" range, the Librarian's grade of

3.40 was the lowest, indicating a generally positive perception despite possible

discrepancies in professional usage and expectations. All things considered, these results

demonstrate a high degree of agreement among all responder groups, confirming the

topic's legitimacy, efficacy, and usefulness.

It can also be noted that the indicator “Appropriateness Recognizability” obtained

the highest evaluation of “3.65” (Highly Acceptable), followed by “Operability” with “3.64”

(Highly Acceptable), then “Learnability” with evaluation of “3.63” (Highly Acceptable),

“User-Error Protection” with evaluation of “3.48” (Highly Acceptable), while the “User-

Interface Aesthetics” got the lowest evaluation of “3.29” (Highly Acceptable).

 62
TAGUIG CITY UNIVERSITY
7.1. Portability

Table 9 shows the evaluation by four (4) groups of respondents namely 3rd Year

CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the portability

of the system.

Table 9

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Portability
CICT
Portability 3rd Year CICT IT Average
7 Librarian Faculty
Students Practitioner Summary
Members

WM VI WM VI WM VI WM VI WM VI

7.1 Adaptability 3.67 HA 3.60 HA 3.80 HA 3.00 HA 3.52 HA

7.2 Installability 3.55 HA 3.60 HA 3.80 HA 3.80 HA 3.69 HA

7.3 Replicability 3.64 HA 3.40 HA 3.20 HA 3.40 HA 3.41 HA

Overall Weighted 3.62 HA 3.53 HA 3.60 HA 3.40 HA 3.54 HA

Mean

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 9 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Portability. The overall weighted mean of the

evaluation of the developed system is “3.54”, interpreted as “Highly Acceptable”.

The result shows that the CICT Students got the highest evaluation who gathered

an evaluation rating of “3.62” (Highly Acceptable), followed by CICT Faculty Members

who gathered an evaluation rating of “3.60” (Highly Acceptable), then the Librarian who
 63
TAGUIG CITY UNIVERSITY
gathered an evaluation rating of “3.53” (Highly Acceptable), while the IT Practitioners got

the evaluation rating of “3.40” (Highly Acceptable).

It can also be noted that the indicator “Installability” obtained the highest evaluation

of “3.69” (Highly Acceptable), followed by “Adaptability” with “3.52” (Highly Acceptable),

while the “Replicability” got the lowest evaluation of “3.41” (Highly Acceptable).

8.1. Security

Table 10 shows the evaluation by four (4) groups of respondents namely 3rd Year
CICT Students, Librarian, CICT Faculty Members, and IT Practitioners on the security of
the system.

Table 10

Evaluation of Respondents on the TCUniArch: A Web-based Thesis Management

System For CICT Students with Integrated Chatbot Using Natural Language Processing
in terms of Security
8 3rd Year CICT
Security IT Average
CICT Librarian Faculty
Practitioner Summary
Students Members

WM VI WM VI WM VI WM VI WM VI

8.1 Confidentiality 3.69 HA 3.40 HA 4.00 HA 3.40 HA 3.62 HA

8.2 Integrity 3.70 HA 3.40 HA 3.80 HA 3.40 HA 3.57 HA

8.3 Non- 3.46 HA 3.40 HA 3.20 HA 3.40 HA 3.37 HA

Repudiation

8.4 Accountability 3.59 HA 3.40 HA 3.80 HA 3.40 HA 3.55 HA

8.5 Authenticity 3.57 HA 3.40 HA 3.20 HA 3.80 HA 3.49 HA

Overall Weighted Mean 3.60 HA 3.40 HA 3.60 HA 3.48 HA 3.52 HA

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

 64
TAGUIG CITY UNIVERSITY
Table 10 shows the evaluation of the respondents in development of TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing in terms of Security. The overall weighted mean of the

evaluation of the developed system is “3.52”, interpreted as “Highly Acceptable”.

The result shows that the CICT Students and CICT Faculty Members ties for the

highest evaluation who gathered an evaluation rating of “3.60” (Highly Acceptable),

followed the IT Practitioners who gathered an evaluation rating of “3.48” (Highly

Acceptable), while Librarian got the evaluation rating of “3.40” (Highly Acceptable).

It can also be noted that the indicator “Confidentiality” obtained the highest

evaluation of “3.62” (Highly Acceptable), followed by “Integrity” “3.57” (Highly Acceptable),

then “Accountability” with evaluation of “3.55” (Highly Acceptable), “Authenticity” with

evaluation of “3.49” (Highly Acceptable), while the “Non-Repudiation” got the lowest

evaluation of “3.37” (Highly Acceptable).

According to the findings, "Confidentiality" received the highest rating of 3.62,

highlighting its importance in protecting sensitive data and ensuring restricted access.

"Integrity" followed with a rating of 3.57, emphasizing its role in maintaining data accuracy

and reliability. "Accountability" scored 3.55, reflecting the respondents' recognition of clear

responsibility and traceability in decisions. "Authenticity" was rated 3.49, stressing the

need for identity verification and data legitimacy. Lastly, “Non-Repudiation” received the

lowest rating of 3.37 but remained within the “Highly Acceptable” range, indicating its

importance, though slightly less prioritized than the other indicators. This suggests that

while respondents acknowledge its role in ensuring accountability.

 65
TAGUIG CITY UNIVERSITY
RESULTS

Table 11 shows the overall evaluation result of the system based on ISO 25010

Table 11

Evaluation Results on the TCUniArch: A Web-based Thesis Management System For

CICT Students with Integrated Chatbot Using Natural Language Processing by rank.

Rank Variables Verbal

Weighted Mean
Interpretation

1 Compatibility 3.63 HA

2 Portability 3.54 HA

3 Usability 3.54 HA

4 Maintainability 3.53 HA

5 Reliability 3.53 HA

6 Security 3.52 HA

7 Performance 3.48 HA
Efficiency

8 Functional Suitability 3.47 HA

Overall Weighted Mean 3.53 HA

Legend: HA – Highly Acceptable; WM – Weighted Mean, VI – Verbal Interpretation.

Table 11 shows the overall result of evaluation of the proposed TCUniArch: A Web-

based Thesis Management System for CICT Students with Integrated Chatbot Using

Natural Language Processing: Functional Suitability, Performance Efficiency,

Compatibility, Maintainability, Reliability, Usability, Portability, and Security that garnered

an average of 3.53, interpreted as “Highly Acceptable”.

 66
TAGUIG CITY UNIVERSITY
It also shows that the variable “Compatibility” obtained the highest evaluation of

“3.63” (Highly Acceptable), followed by “Portability” and “Usability” with “3.54” (Highly

Acceptable), then “Maintainability” and “Reliability” with evaluation of “3.53” (Highly

Acceptable), “Security” with evaluation of “3.52” (Highly Acceptable), “Performance

Efficiency” with “3.48” (Highly Acceptable), while the “Non-Repudiation” got the lowest

evaluation of “3.37” (Highly Acceptable).

 TAGUIG CITY UNIVERSITY
CHAPTER V

SUMMARY, CONCLUSIONS AND RECOMMENDATION

SUMMARY OF FINDINGS

The primary purpose of this study was to provide a platform for CICT Students to

search for related studies for their thesis. In "TCUniArch: A Web-based Thesis

Management System for CICT Students with Integrated Chatbot Using Natural Language

Processing", the respondents assisted the researchers in proving the hypothesis. This

project was designed to address lack of resources for thesis’ RRL among CICT students

of Taguig City University. This study’s notion might be valuable in the future.

The researchers were able to develop a user-friendly web-based platform for the

integrated chatbot and thesis management system to fully enhance the user experience

and productivity of CICT students. An Integrated Chatbot has served as a personalized

assistance for users to answer their queries, provides a guidance, and addressing

concerns related to thesis. Integrated chatbot will overall increase user convenience.

They have developed a web-based thesis management system ensures that all

students have easy access to academic research, aiding in literature reviews and research

projects. It supports collaborative research efforts and provides effortless navigation.

Lastly, the researchers have used the natural language processing as an algorithm, this

will enhance search accuracy and automates indexing of the thesis management system.

It enables content analysis that can improve the overall functionality and usability of the

system.
 68
TAGUIG CITY UNIVERSITY
Evaluation of the respondents on the proposed TCUniArch: A Web-based Thesis

Management System for CICT Students with Integrated Chatbot Using Natural

Language Processing based on ISO 25010.

The following variables were considered in evaluating the proposed TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot Using

Natural Language Processing: Functional Suitability, Performance Efficiency,

Compatibility, Maintainability, Reliability, Usability, Portability, and Security.

In functional suitability, the respondents evaluated the proposed TCUniArch: A

Web-based Thesis Management System for CICT Students with Integrated Chatbot Using

Natural Language Processing as Highly Acceptable. The respondents' aggregate

weighted mean of 3.47 helped to corroborate the conclusion.

In terms of performance efficiency, the respondents evaluated the proposed

TCUniArch: A Web-based Thesis Management System for CICT Students with Integrated

Chatbot Using Natural Language Processing as Highly Acceptable. The respondents'

aggregate weighted mean of 3.48 helped to corroborate the conclusion.

The respondents rated the proposed TCUniArch: A Web-based Thesis

Management System for CICT Students with Integrated Chatbot Using Natural Language

Processing as Highly Acceptable in terms of Compatibility. Their composite weighted

mean of 3.63 backed up this claim.

The Maintainability of the TCUniArch: A Web-based Thesis Management System

for CICT Students with Integrated Chatbot using Natural Language Processing, was

assessed as Highly Acceptable with overall weighted mean of 3.53.

 69
TAGUIG CITY UNIVERSITY
Evaluation of the respondents on the proposed TCUniArch: A Web-based Thesis

Management System for CICT Students with Integrated Chatbot Using Natural Language

Processing in terms of Reliability was assessed as Highly Acceptable. Serving to confirm

the finding was the respondents’ overall weighted mean of 3.53.

The Usability of the TCUniArch: A Web-based Thesis Management System for

CICT Students with Integrated Chatbot using Natural Language Processing, was

assessed as Highly Acceptable with overall weighted mean of 3.54.

Survey revealed that the evaluation of the respondents on the proposed

TCUniArch: A Web-based Thesis Management System for CICT Students with Integrated

Chatbot Using Natural Language Processing in terms of Portability was Highly Acceptable.

Lending credence to this finding was the respondents’ overall weighted mean of 3.54.

The respondents found that the TCUniArch: A Web-based Thesis Management

System for CICT Students with Integrated Chatbot using Natural Language Processing, to

be moderately acceptable in terms of Security. This was reflected on their composite

weighted mean of 3.52.

CONCLUSIONS

Because of the preceding significant findings, the following conclusions were derived.

1. The overall usability of the TCUniArch: A Web-based Thesis Management System

for CICT Students with Integrated Chatbot using Natural Language Processing is

already being accepted by many not just students, librarian, and CICT Faculty also
 70
TAGUIG CITY UNIVERSITY
the IT Personnel as well.

2. The overall evaluation of the students to the proposed TCUniArch: A Web-based

Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing is Highly Acceptable.

3. The overall evaluation of IT Practitioners to the proposed TCUniArch: A Web-based

Thesis Management System for CICT Students with Integrated Chatbot using

Natural Language Processing is Highly Acceptable.

4. The respondents suggested enhancements for the proposed TCUniArch: A Web-

based Thesis Management System for CICT Students with Integrated Chatbot

using Natural Language Processing.

5. The respondents stated that the system is more efficient and user-friendly, with an

intuitive design and an integrated chatbot that provide timely support and simplifies

thesis-related activities.

RECOMMENDATION

For those who were able to use the system that we created, implement continuous

monitoring practices for the security of the database. Regular monitoring will to help

identify and address potential vulnerabilities, unauthorized access, or data breaches. To

improve the database, implement a process to regularly clean accounts belonging to

graduate students who have been inactive for over three years. This will free up storage,

maintain system efficiency, and ensure that resources are focused on active users.

The developers of the TCUniArch: A Web-based Thesis Management System for

 71
TAGUIG CITY UNIVERSITY
CICT Students with Integrated Chatbot using Natural Language Processing have provided

insightful suggestions for future academics who may undertake the task of overhauling the

existing system. These suggestions aim to enhance and improve the system’s

functionality, user experience, and overall efficiency.

Here are the key recommendations:

1. Improve the chatbot's natural language processing to handle more complex

queries and provide much detailed assistance.

2. Consider expanding TCUniArch to include students from other courses at

Taguig City University. This will enable the system to service a larger user base

and facilitate thesis management across other fields.

3. Include analytics tools and a dashboard for monitoring system usage, user

activity, and thesis progress. This will assist discover areas for improvement and

provide better support using real-time data.

4. Refine system functionalities to address any inconsistencies or potential error,

resulting in flawless performance that fully meets user expectations.

5. Implement additional safeguards to reduce errors and improve the user

experience, including intuitive guidance for inexperienced users.

 72
TAGUIG CITY UNIVERSITY
BIBLIOGRAPHY

Walsh, B., & Rana, H. (2020) Continuity of Academic Library Services during the

Pandemic The University of Toronto Libraries’ Response.

https://www.utpjournals.press/doi/abs/10.3138/jsp.51.4.04

Oyama, S. et.al. (2021) A web based e-archives information system design in Universitas

PGRI Yogyakarta.

https://iopscience.iop.org/article/10.1088/1742-6596/1823/1/012037/pdf

Aleedy, et.al. (2019) AI-based chatbots in customer service and their effects on user

compliance.

https://doras.dcu.ie/27514/1/Paper_10

Montalban, L., & Antiquera, C. (2023) ISAT U Miagao Campus Students Thesis

Archiving and Profiling System.

https://www.researchpublish.com/upload/book/ISAT%20U%20Miagao%20Campu

s%20Students-03052023-1.pdf

Mondero, N. et.al. (2024) Preserving Scholarly Endeavors: A System for Archiving Thesis

and Dissertations.

https://gaspublishers.com/wp-content/uploads/2024/04/Preserving-Scholarly
 73
TAGUIG CITY UNIVERSITY
Endeavors-A-System-for-Archiving-Thesis-and-Dissertations.pdf

Alpasan, B. (2022) Theses and Dissertations Abstract E-Archiving System with SMS

Support.

https://ijmra.in/v5i1/Doc/3.pdf

Maesaroh, I., Kholis, N., & Umaya, M., (2021) Analysis of Archival Management Practices

for Student Transfer: A Case Study in Indonesia

https://www.internationaljournalssrg.org/IJHSS/2021/Volume8-Issue1/IJHSS-

V8I1P101.pdf

Murphy, J. et.al. (2020) Expanding digital academic library and archive services at the

University of Calgary in response to the COVID-19 pandemic

https://journals.sagepub.com/doi/full/10.1177/03400352211023067

Ayanouz, S. et.al. (2020) A Smart Chatbot Architecture based NLP and Machine Learning

for Health Care Assistance

https://dl.acm.org/doi/abs/10.1145/3386723.3387897

Chowdhary, K.R. (2020) Natural Language Processing

https://link.springer.com/chapter/10.1007/978-81-322-3972-7_19
 74
TAGUIG CITY UNIVERSITY
Mageira, K. et.al. (2022) Educational AI Chatbots for Content and Language Integrated

Learning

https://www.mdpi.com/2076-3417/12/7/3239

Mehta, D., & Wang, X. (2020) COVID-19 and digital library services – a case study of a

university library

https://www.emerald.com/insight/content/doi/10.1108/DLP-05-2020-0030/full/html

Pauwels, N. et.al (2020) Medical and health informatics services during and after the

COVID-19 pandemic should be virtual, tailored, responsive and interactive: a case

study in Belgium

https://onlinelibrary.wiley.com/doi/10.1111/hir.12330?fbclid=IwAR2_Y74XRqG1D

EKqDMzcv6RThYn8l6mGpwt9s5Ql5IkLxs-CZTl7D_aYIfM

Gayatao, R. et.al (2022) Academic Research Archive System Of ABC Company Capstone

Project Document

https://capstoneguide.com/academic-research-archive-system-of-abc-company-

capstone-project-document/#google_vignette

Merelo, J. et.al (2024) Chatbots and messaging platforms in the classroom: An analysis

from the teacher’s perspective

https://link.springer.com/article/10.1007/s10639-023-11703-x
 75
TAGUIG CITY UNIVERSITY
APPENDICES

Appendix A – Letters
 76
TAGUIG CITY UNIVERSITY
Appendix B – Questionnaire

Software Evaluation Instrument of ISO 25010

TCUniArch: A WEB-BASED THESIS MANAGEMENT SYSTEM FOR

CICT STUDENTS WITH INTEGRATED CHATBOT USING
NATURAL LANGUAGE PROCESSING

Name (Optional): ___________________________ Date: ________________

Numerical Rating and Equivalent

[4] - Highly Acceptable [2] - Fairly Acceptable

[3] – Moderately Acceptable [1] - Poorly Acceptable

Instruction: Rate the following categories by putting a check (✔) for the favored selection before the
characteristics reflected in the system. Select only one per item.

Rating Scale
1. FUNCTIONAL SUITABILITY
4 3 2 1
1.1 Functional Completion. Degree to which the set
of functions covers all the specified tasks and user
objectives.
1.2 Functional Correctness. Degree to which the
system provides the correct result with the needed
degree of precision.
1.3 Functional Appropriateness. Degree to which
the functions Facilitate the accomplishment of
specified task and objectives.

TOTAL:
Rating Scale
2. PERFORMANCE EFFICIENCY
4 3 2 1
2.1 Time Behavior. Degree to which the response and
processing times and throughput rates of the system,
when performing its functions, meet requirements.
2.2 Resource Utilization. Degree to which the
amounts and types of resources used by the system,
when performing its functions, meet requirements.
 77
TAGUIG CITY UNIVERSITY
2.3 Capacity. Degree to which the maximum limits of
the system parameter meet requirements.

TOTAL:

Rating Scale
3. COMPATIBILITY
4 3 2 1
3.1 Co-existence. The system can perform its
required functions eQiciently while sharing a
common environment and resources with the
product without detrimental impact on any product.
3.2 Interoperability. The system can exchange
information and the user information that has been
exchanged.
TOTAL:
Rating Scale
4. MAINTAINABILITY
4 3 2 1
4.1 Modularity. Degree to which the system is
composed of discrete components such that a
change to one component has minimal impact on
other components.
4.2 Reusability. Degree to which an asset can be
used in more than one system, or in building other
assets.
4.3 Analyzability. Degree of eQectiveness and
eQiciency with which it is possible to assess the
impact on the system of an intended change to one
or more of its parts, or to diagnose a system for
deficiencies or causes of failures, or to identify parts
to be modified.
4.4 Modifiability. Degree to which the system can be
eQectively and eQiciently modified without
introducing defects or degrading existing system
quality.
TOTAL:
Rating Scale
5. RELIABILITY
4 3 2 1
 78
TAGUIG CITY UNIVERSITY
5.1 Maturity. Degree to which the system meets
needs for reliability under normal operation.
5.2 Availability. Degree to which the system is
operational and accessible when required for use.
5.3 Fault Tolerance. Degree to which the system
operates as intended despite the presence of
hardware or software faults.
5.4 Recoverability. Degree to which, in the event of
an interruption or a failure, the system can recover
the data directly aQected and re-establish the
desired state of the system.
TOTAL:

Rating Scale
6. USABILITY
4 3 2 1
6.1 Appropriateness Recognizability. Degree to
which users can recognize whether the system is
appropriate for their needs.
6.2 Learnability. Degree to which the system can be
used by specified users to achieve specified goals of
learning to use the system with eQectiveness,
eQiciency, freedom from risk and satisfaction in a
specified context of use.
6.3 Operability. Degree to which the system has
attributes that make it easy to operate and control.
6.4 User-Error Protection. Degree to which the
system users against making errors.
6.5 User Interface Aesthetics. Degree to which a
user interface enables pleasing and satisfying
interaction for the user.
TOTAL:
Rating Scale
7. PORTABILITY
4 3 2 1
7.1 Adaptability. Degree to which the system can
eQectively and eQiciently be adapted for diQerent or
evolving hardware, software or other operational or
usage environments.
 79
TAGUIG CITY UNIVERSITY
7.2 Installability. Degree of eQectiveness and
eQiciency with which the system can be successfully
installed and/or uninstalled in a specified
environment.
7.3 Replicability. Degree to which the system can
replace another specified software product for the
same purpose in the same environment

TOTAL:

Rating Scale
8. SECURITY
4 3 2 1
8.1 Confidentiality. Degree to which the system
ensures that data are accessible only to those
authorized to have access.
8.2 Integrity. Degree to which the system prevents
unauthorized access to, or modification of, computer
programs or data.
8.3 non-repudiation. Degree to which actions or
events can be proven to have taken place, so that the
events or actions cannot be repudiated later.
8.4 Accountability. Degree to which the actions of an
entity can be traced uniquely to the entity.
8.5 Authenticity. Degree to which the identity of a
subject or resource can be proved to be the one
claimed.
TOTAL:

Comments/Suggestions:

______________________________________________________________________________________

______________________________________________________________________________________

______________________________________________________________________________________

_____________________________

Signature
 80
TAGUIG CITY UNIVERSITY
Appendix C – User’s Manual/Screenshots of the System

TCUniArch – User Manual / Screenshots of the system

SIGN UP

To sign in to the system, first open the system in your browser it in your web browser

and once you already there, enter your unique Student ID Number in the first field,

followed by the password you created during account registration in the second field.
 81
TAGUIG CITY UNIVERSITY
After entering your credentials, click the "Sign In" button. If the details are correct,

you will be directed to the system’s main dashboard.

If you’ve forgotten your password, click the "I forgot my password" link to reset it.

Make sure to enter your working email address to send the password reset link. This

notification will appear if the password reset link is already sent to your email.

This notification will appear to your email to reset the password of your account.

To reset your password, click the link indicated by the arrow to initiate the

password reset process.

 82
TAGUIG CITY UNIVERSITY
Enter your new password in the text field and click "Save" to update your account

with the new password.

After that, you will be redirected to the sign-in page to log in to your account and

access the system.

CREATE ACCOUNT OPTIONS

If you don’t have an account in the system, you cannot access it. Simply click the

"Create an Account" button to get started. After clicking, you will be redirected to choose

a verification method. There are two options available for creating an account: Email and

Phone.
 83
TAGUIG CITY UNIVERSITY
If you choose to register using your email, you will be redirected to the registration

form panel. Here, you will need to provide the required information, including your full

name, email address, student ID, and preferred password, as shown in the image below.

CREATE ACCOUNT VIA EMAIL

After completing all the required fields in the registration form, simply click the

Register button. The system will then send a verification link to your email address. Click

on the link to verify your account, and your account will be successfully activated in the

system.
 84
TAGUIG CITY UNIVERSITY
CREATE ACCOUNT VIA PHONE NUMBER

If you choose to register using your phone number, you will also be redirected to

the registration form panel. Here, you will need to provide the required information,

including your full name, phone number, student ID, and preferred password, as shown in

the image.

Next, click the Register button. After that, the system will send a One-Time

Password (OTP) to your phone via SMS. Enter the OTP in the dialog box on the system

to verify your account.

 85
TAGUIG CITY UNIVERSITY

After entering the OTP in the dialog box, click the OK button to complete the

registration and activate your account.

Once you have completed the account registration, you can sign in to the system

by providing the required information, such as your Student ID Number and Password.

After signing in, you will be redirected to the system's dashboard.

DASHBOARD

The dashboard will display the Student's Name, with the Student ID Number

registered in the system listed below it. On the right side of the system, the Menu Tab will

appear, showcasing the three main functions of the system:

 86
TAGUIG CITY UNIVERSITY
Archives, Favorites, and Chatbot.

Below the student's name and student ID number, the dashboard will display your

most viewed document for quick access to the document you use most frequently in the

system.

At the upper right of the system, there is a gear icon. This icon serves as a button

to toggle the display of the Logout button and Change Password options.

ARCHIVES

The Archives tab has two options: Thesis Archives and Upload. The Thesis

Archives will display all the available thesis documents uploaded to the system. Each

thesis document will have two buttons: View Document and Add to Favorites. Clicking

View Document will display all the details of the thesis document, while clicking Add to
 87
TAGUIG CITY UNIVERSITY
Favorites will add the thesis document to your Favorites list. The second tab, Upload,

allows you to upload a thesis document to the system.

If you click View Document, it will display the following details, as shown in the

picture below:

• Title

• Names of the Authors

• Year the document was created

• Number of views the document has received

• The abstract of the document

If you click the View Document button, it will display the full document uploaded to

the system. Please note that the document is not available for download; it is view-only to

ensure the safety of all documents stored in the system and to prevent plagiarism.
 88
TAGUIG CITY UNIVERSITY
UPLOADED THESIS DOCUMENT
 89
TAGUIG CITY UNIVERSITY
THESIS UPLOAD

Uploading a thesis document requires four pieces of information:

1. Title of the document

2. Year the document was created

3. Names of the authors

4. Abstract of the document

Once you’ve filled out these details, simply click the Upload File button to complete

the upload process and add the document to the system.

FAVORITES
 90
TAGUIG CITY UNIVERSITY
The Favorites tab will display all the thesis documents you have marked as

favorites. Each document will have two buttons: View Document and Remove from

Favorites. Clicking View Document will show all the details of the document, while clicking

Remove from Favorites will remove the thesis document from your Favorites list.

CHATBOT

The Chatbot tab is designed to answer all of the user’s inquiries. To use it, simply

input your question in the text box provided. After entering your inquiry, click the Send

button to submit it to the chatbot. The chatbot will automatically respond to your inquiry

within a short period of time.

With the help of its database and preset algorithms, the chatbot is designed to

comprehend a broad variety of queries and offer pertinent responses. By providing a

smooth and practical method of information access, it also aims to improve user

experience by eliminating the need for manual searches. The chatbot guarantees a prompt

and dependable answer to satisfy your demands, whether you require technical
 91
TAGUIG CITY UNIVERSITY
assistance, general information, or direction on certain subjects.

LOGOUT

To Logout of your account, simply click the gear icon at the upper right of the

system. This will toggle the display of the Logout button and Change Password option.
 92
TAGUIG CITY UNIVERSITY
Appendix D – Program Code

LOGIN

<!DOCTYPE html> 3.2.0/dist/css/adminlte.min.css">

<html lang="en"> </head>

<head> <body class="hold-transition login-

page">
<meta charset="utf-8">
<div class="login-box">
<meta name="viewport"
content="width=device-width, initial- <div class="page-icon">
scale=1">
<center>
<title>Login | TCU Thesis Management
System</title> <img src="icon.png"
style="width:50%;max-width:400px">
<link rel="icon" type="image/x-icon"
href="favicon.png"> </center>

<!-- Google Font: Source Sans Pro --> </div>

<link rel="stylesheet" <div class="login-logo">

href="https://fonts.googleapis.com/css <b>Taguig City University</b>

?family=Source+Sans+Pro:300,400,400i Thesis Management System
,700&display=fallback"> </div>
<!-- Font Awesome --> <!-- /.login-logo -->
<link rel="stylesheet" href="AdminLTE- <div class="card">
3.2.0/plugins/fontawesome-
free/css/all.min.css"> <div class="card-body login-card-
body">
<!-- icheck bootstrap -->
<p class="login-box-msg">Please
<link rel="stylesheet" href="AdminLTE- sign in</p>
3.2.0/plugins/icheck-bootstrap/icheck-
bootstrap.min.css"> <form id="form" method="post">

<!-- Theme style --> <div class="input-group mb-3"

<link rel="stylesheet" href="AdminLTE-

 91
TAGUIG CITY UNIVERSITY
<input type="text" class="form-control" </div>
placeholder="Student ID Number"
id="studentnum"> <br>

<div class="input-group- <div class="row">

append"> <div class="col-4">
<div class="input-group-text"> </div>
<span class="fas fa- <div class="col-4">
hashtag"></span>
<button type="submit"
</div> class="btn btn-primary btn-block">Sign
</div> In</button>

</div> </div>

<div class="input-group mb-3"> <!-- /.col -->

<input type="password" </div>

class="form-control" </form>
placeholder="Password" id="pw">
</div>
<div class="input-group-
append"> <center>

<div class="input-group-text"> <div class="social-auth-links text-

center mt-2 mb-3 col-7">
<span class="fas fa-
lock"></span> <p id="test">or</p>

</div> <a href="newacc.html" class="btn

btn-block btn-primary">
</div>
<i class="fas fa-plus mr-2"></i>
</div> Create an account
<div class="form-check"> </a>
<input type="checkbox" </div>
class="form-check-input" id="showpw">
<!-- /.login-card-body -->
<label class="form-check-label"
for="showpw">Show Password</label> </div>
 92
TAGUIG CITY UNIVERSITY
<br> /firebase-app.js";

<center><a href="forgot-pass.html" import { getFirestore, collection, query,

class="text-left">I forgot my where, getDocs, doc, getDoc, setDoc }
password</a></center> from
"https://www.gstatic.com/firebasejs/9.0.0
</div> /firebase-firestore.js";
<!-- /.login-box --> import { getAuth,
<!-- firebase ulet--> createUserWithEmailAndPassword,
signInWithEmailAndPassword,
<script> sendEmailVerification } from
"https://www.gstatic.com/firebasejs/9.0.0
const passwordInput =
/firebase-auth.js";
document.getElementById('pw');
// TODO: Add SDKs for Firebase
const showPasswordCheckbox =
products that you want to use
document.getElementById('showpw');
//
showPasswordCheckbox.addEventLis
https://firebase.google.com/docs/web/set
tener('change', () => {
up#available-libraries
if
// Your web app's Firebase
(showPasswordCheckbox.checked) {
configuration
passwordInput.type = 'text';
// For Firebase JS SDK v7.20.0 and
} else { later, measurementId is optional

passwordInput.type = 'password'; const firebaseConfig = {

} apiKey:
"AIzaSyCo7nh58UwLmF5w6XPc4erpJg
}); HE2fD1-pE",
</script> authDomain:
"thesissandbox.firebaseapp.com",
<script type="module">
projectId: "thesissandbox",
// Import the functions you need from
the SDKs you need storageBucket:
"thesissandbox.appspot.com",
import { initializeApp } from
"https://www.gstatic.com/firebasejs/9.0.0 messagingSenderId:
 93
TAGUIG CITY UNIVERSITY
"219383246422", if (!querySnapshot.empty) {

appId: const userDoc =

"1:219383246422:web:137c8b5cf599e6 querySnapshot.docs[0];
734dd5f7",
const email =
measurementId: "G-DPPCXVN3HD" userDoc.data().email;

}; console.log("Email associated with

Student ID:", email);
// Initialize Firebase

const app =
initializeApp(firebaseConfig); const credentials = await
signInWithEmailAndPassword(auth,
const db = getFirestore(); email, pass.value);
const auth = getAuth(app); const ref = doc(db, "UserAuthList",
let name = credentials.user.uid);
document.getElementById('fname'); const docSnap = await
let pass = getDoc(ref);
document.getElementById('pw'); if (docSnap.exists()) {
let studentID = sessionStorage.setItem("user-
document.getElementById('studentnum') info", JSON.stringify({
;
name: docSnap.data().name,
let MainForm =
document.getElementById('form'); sn: docSnap.data().studentID,

let SignInUser = async (evt) => { isDark: docSnap.data().isDark,

evt.preventDefault(); year: docSnap.data().year,

try { }));

console.log("Student ID entered:", sessionStorage.setItem("user-

studentID.value); creds", JSON.stringify(credentials.user));

const querySnapshot = await window.location.href =

getDocs(query(collection(db, "dashboard.html";
"UserAuthList"), where("studentID", "==",
studentID.value))); }
 94
TAGUIG CITY UNIVERSITY
} else { <meta charset="utf-8">

alert("Student ID not found!"); <meta name="viewport"

content="width=device-width, initial-
console.log("Student ID not found scale=1">
in the database.");
<title>Create an account | TCU Thesis
} Management System</title>
} catch (error) { <link rel="icon" type="image/x-icon"
alert("Wrong Student ID or href="favicon.png">
Password!"); <!-- Google Font: Source Sans Pro -->
console.log("Error code:", <link rel="stylesheet"
error.code || 'Not available');
href="https://fonts.googleapis.com/css
console.log("Error message:", ?family=Source+Sans+Pro:300,400,400i
error.message || 'Not available'); ,700&display=fallback">
pass.value = ""; <!-- Font Awesome -->
studentID.value = ""; <link rel="stylesheet" href="AdminLTE-
} 3.2.0/plugins/fontawesome-
free/css/all.min.css">
}
<!-- icheck bootstrap -->
MainForm.addEventListener('submit',
SignInUser); <link rel="stylesheet" href="AdminLTE-
3.2.0/plugins/icheck-bootstrap/icheck-
</script> bootstrap.min.css">

</body> <!-- Theme style -->

</html> <link rel="stylesheet" href="AdminLTE-

3.2.0/dist/css/adminlte.min.css">
REGISTER </head>

<!DOCTYPE html> <body class="hold-transition register-

page">
<html lang="en">
<div class="register-box">
<head>
 95
TAGUIG CITY UNIVERSITY
<div class="page-icon"> </div>

<center> <div class="input-group mb-3">

<img src="icon.png" <input type="email" class="form-

style="width:50%;max-width:400px"> control" placeholder="Email" id="email">

</center> <div class="input-group-

append">
</div>
<div class="input-group-text">
<div class="login-logo">
<span class="fas fa-
<b>Taguig City University</b> envelope"></span>
Thesis Management System
</div>
</div>
</div>
<div class="card">
</div>
<div class="card-body register-card-
body"> <div class="input-group mb-3">

<p class="login-box-msg">Please <input type="text" class="form-

fill up the form</p> control" placeholder="Student ID
Number" id="studentnum">
<form id="reg" name="register">
<div class="input-group-
<div class="input-group mb-3"> append">
<input type="text" class="form- <div class="input-group-text">
control" placeholder="Full name"
id="fname"> <span class="fas fa-
hashtag"></span>
<div class="input-group-
append"> </div>

<div class="input-group-text"> </div>

<span class="fas fa- </div>

user"></span>
<div class="input-group mb-3">
</div>
<input type="password"
</div> class="form-control"
 96
TAGUIG CITY UNIVERSITY
placeholder="Password" id="pw"> </div>

<div class="input-group- <br>

append">
<!-- /.col -->
<div class="input-group-text">

<span class="fas fa-

lock"></span> <center>

</div> <div class="col-4">

</div> <button type="submit"

value="register" class="btn btn-primary
</div> btn-block">Register</button>

<div class="input-group mb-3"> </div>

<input type="password" </center>

class="form-control"
placeholder="Confirm Password" <!-- /.col -->
id="pw"> </div>
<div class="input-group- </form>
append">
</div>
<div class="input-group-text">
<!-- /.form-box -->
<span class="fas fa-
lock"></span> <br>

</div> <a href="index.html" class="text-left">I

already have an account</a>
</div>
</div><!-- /.card -->
</div>
</div>
<div class="form-check">
<!-- /.register-box -->
<input type="checkbox"
class="form-check-input" id="showpw"> <script>

<label class="form-check-label" const passwordInput =

for="showpw">Show Password</label> document.getElementById('pw');
 97
TAGUIG CITY UNIVERSITY
const showPasswordCheckbox = import { getAuth,
document.getElementById('showpw'); createUserWithEmailAndPassword,
sendEmailVerification } from
showPasswordCheckbox.addEventLis "https://www.gstatic.com/firebasejs/10.1
tener('change', () => { 2.1/firebase-auth.js";
if // TODO: Add SDKs for Firebase
(showPasswordCheckbox.checked) { products that you want to use
passwordInput.type = 'text'; //
} else { https://firebase.google.com/docs/web/set
up#available-libraries
passwordInput.type = 'password';
// Your web app's Firebase configuration
}
// For Firebase JS SDK v7.20.0 and
}); later, measurementId is optional

</script> const firebaseConfig = {

<!-- firebase aahhahahaha --> apiKey:

"AIzaSyCo7nh58UwLmF5w6XPc4erpJg
<script src="register.js" type="module">
HE2fD1-pE",
</script>
authDomain:
</body> "thesissandbox.firebaseapp.com",

</html> projectId: "thesissandbox",

storageBucket:
"thesissandbox.appspot.com",
REGISTER.JS
messagingSenderId: "219383246422",
// Import the functions you need from the
SDKs you need appId:
"1:219383246422:web:137c8b5cf599e6
import { initializeApp } from 734dd5f7",
"https://www.gstatic.com/firebasejs/10.1
2.1/firebase-app.js"; measurementId: "G-DPPCXVN3HD"

import { getFirestore, doc, setDoc } from };

"https://www.gstatic.com/firebasejs/10.1
const app =
2.1/firebase-firestore.js";
 98
TAGUIG CITY UNIVERSITY
initializeApp(firebaseConfig); email: em.value,

const auth = getAuth(app); studentID: sn.value,

const db = getFirestore(); isDark: "0",

let name = year: year

document.getElementById('fname');
});
let pass =
document.getElementById('password'); alert("Account created! Please verify
your email before logging in. Check your
let em = inbox or spam folder.");
document.getElementById('email');
window.location.href = "index.html";
let sn =
document.getElementById('studentnum') })
; .catch((error) => {
let MainForm = alert(error.message);
document.getElementById('reg');
console.error(error.code);
let currentTime = new Date();
console.error(error.message);
var year = currentTime.getFullYear();
});
let RegisterUser = evt => {
}
evt.preventDefault();
MainForm.addEventListener('submit',
createUserWithEmailAndPassword(aut RegisterUser);
h, em.value, pass.value)

.then(async (credentials) => {

PHONE REGISTRATION
await
sendEmailVerification(auth.currentUser); <!DOCTYPE html>

var ref = doc(db, "UserAuthList", <html lang="en">

credentials.user.uid);
<head>
await setDoc(ref, {
<meta charset="utf-8">
name: name.value,
<meta name="viewport"
 99
TAGUIG CITY UNIVERSITY
content="width=device-width, initial- <center>
scale=1">
<img src="icon.png"
<title>Create an account | TCU Thesis style="width:50%;max-width:400px">
Management System</title>
</center>
<link rel="icon" type="image/x-icon"
href="favicon.png"> </div>

<!-- Google Font: Source Sans Pro --> <div class="login-logo">

<link rel="stylesheet" <b>Taguig City University</b>

Thesis Management System
href="https://fonts.googleapis.com/c
ss?family=Source+Sans+Pro:300,400,4 </div>
00i,700&display=fallback"> <div class="card">
<!-- Font Awesome --> <div class="card-body register-
<link rel="stylesheet" card-body">
href="AdminLTE- <p class="login-box-
3.2.0/plugins/fontawesome- msg">Please fill up the form</p>
free/css/all.min.css">
<form id="reg"
<!-- icheck bootstrap --> name="register">
<link rel="stylesheet" <div class="input-group mb-
href="AdminLTE-3.2.0/plugins/icheck- 3">
bootstrap/icheck-bootstrap.min.css">
<input type="text"
<!-- Theme style --> class="form-control" placeholder="Full
<link rel="stylesheet" name" id="fname">
href="AdminLTE- <div class="input-group-
3.2.0/dist/css/adminlte.min.css"> append">
</head> <div class="input-
<body class="hold-transition register- group-text">
page"> <span class="fas fa-
<div class="register-box"> user"></span>

<div class="page-icon"> </div>

 100
TAGUIG CITY UNIVERSITY
</div> </div>

</div> </div>

<div class="input-group mb- </div>

3">
<div class="input-group mb-
<input type="text" 3">
class="form-control"
placeholder="Phone Number (Start with <input type="password"
9xxx)" id="phone"> class="form-control"
placeholder="Password" id="pw">
<div class="input-group-
append"> <div class="input-group-
append">
<div class="input-
group-text"> <div class="input-
group-text">
<span class="fas fa-
phone"></span> <span class="fas fa-
lock"></span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="input-group mb-
3"> <div id="recaptcha-
container"></div> <!-- Invisible
<input type="text" reCAPTCHA -->
class="form-control"
placeholder="Student ID Number" <center>
id="studentnum"> <div class="col-4">
<div class="input-group- <button type="submit"
append"> value="register" class="btn btn-primary
<div class="input- btn-block">Register</button>
group-text"> </div>
<span class="fas fa- </center>
hashtag"></span>
</form>
 101
TAGUIG CITY UNIVERSITY
</div> authDomain:
"thesissandbox.firebaseapp.com",
</div><!-- /.card -->
projectId: "thesissandbox",
<br>
storageBucket:
<a href="index.html" class="text- "thesissandbox.appspot.com",
left">I already have an account</a>
messagingSenderId:
</div> "219383246422",
<!-- /.register-box --> appId:
<script src="phonereg.js" "1:219383246422:web:137c8b5cf599e6
type="module"></script> 734dd5f7",

measurementId: "G-DPPCXVN3HD"

</body> };

</html> const app =

initializeApp(firebaseConfig);

const db = getFirestore();
PHONE REGISTRATION.JS
const auth = getAuth(app);
import { initializeApp } from
"https://www.gstatic.com/firebasejs/10.1 const registerForm =
2.1/firebase-app.js"; document.getElementById('reg');

import { getFirestore, doc, setDoc } from const phoneInput =

"https://www.gstatic.com/firebasejs/10.1 document.getElementById('phone');
2.1/firebase-firestore.js"; const nameInput =
import { getAuth, RecaptchaVerifier, document.getElementById('fname');
signInWithPhoneNumber } from const studentIdInput =
"https://www.gstatic.com/firebasejs/10.1 document.getElementById('studentnum')
2.1/firebase-auth.js"; ;
const firebaseConfig = { const passwordInput =
apiKey: document.getElementById('pw');
"AIzaSyCo7nh58UwLmF5w6XPc4erpJg const recaptchaVerifier = new
HE2fD1-pE", RecaptchaVerifier(auth, 'recaptcha-
 102
TAGUIG CITY UNIVERSITY
container', { !phoneInput.value.startsWith('9')) {

size: 'invisible', alert("Please enter a valid 10-digit

phone number starting with 9xxx.");
callback: function (response) {
return;
console.log('reCAPTCHA solved');
}
}
try {
}, auth);
const confirmationResult = await
registerForm.addEventListener('submit', signInWithPhoneNumber(auth,
async (e) => { phoneNumber, recaptchaVerifier);
e.preventDefault(); const otp = prompt('Enter the OTP
sent to your phone');

const recaptchaVerifier = new const result = await

RecaptchaVerifier(auth, 'recaptcha- confirmationResult.confirm(otp);
container', { await setDoc(doc(db,
size: 'invisible', "UserAuthList", result.user.uid), {

callback: (response) => { name: nameInput.value,

console.log('reCAPTCHA phone: phoneNumber,

solved'); studentID: studentIdInput.value,
} year: new Date().getFullYear()
}); });
recaptchaVerifier.render().then((widge alert('Registration successful!');
tId) => {
window.location.href = "index.html";
console.log(`reCAPTCHA widget
ID: ${widgetId}`); } catch (error) {

}); alert(`Error: ${error.message}`);

const phoneNumber = console.error(error);

`+63${phoneInput.value.trim()}`;
}
if (phoneInput.value.length !== 10 ||
 103
TAGUIG CITY UNIVERSITY
}); 3.2.0/plugins/fontawesome-
free/css/all.min.css">
phoneInput.addEventListener('input',
function (e) { <!-- icheck bootstrap -->

let value = e.target.value; <link rel="stylesheet"

href="AdminLTE-3.2.0/plugins/icheck-
if (value.startsWith('0')) { bootstrap/icheck-bootstrap.min.css">
e.target.value = value.substring(1); <!-- Theme style -->
} <link rel="stylesheet"
}); href="AdminLTE-
3.2.0/dist/css/adminlte.min.css">

</head>
NEW ACCOUNT
<body class="hold-transition login-
<!DOCTYPE html> page">
<html lang="en"> <div class="login-box">

<head> <div class="login-logo">

<meta charset="utf-8"> Choose a verification method

below
<meta name="viewport"
content="width=device-width, initial- </div>
scale=1">
<!-- /.login-logo -->
<title>Forgotten Password | Academic
Commission Booking System</title> <div class="card">

<!-- Google Font: Source Sans Pro --> <div class="row justify-content-
center">
<link rel="stylesheet"
<div class="col-md-5">
href="https://fonts.googleapis.com/c
ss?family=Source+Sans+Pro:300,400,4 <div class="small-box bg-
00i,700&display=fallback"> info">

<!-- Font Awesome --> <div class="inner">

<link rel="stylesheet" <h5>Email</h5>

href="AdminLTE-
 104
TAGUIG CITY UNIVERSITY
</div> <div class="social-auth-links
text-center mt-2 mb-3 col-7">
<div class="icon">
<p>or</p>
<i class="ion ion-mail"></i>
<a href="index.html"
</div> class="btn btn-block btn-primary">
<a href="register.html" Return to Login
class="small-box-footer">Click Here <i
class="fas fa-arrow-circle-right"></i></a> </a>

</div> </div>

</div> </center>

<div class="col-md-5"> </div>

<div class="small-box bg- </div>

info">
</body>
<div class="inner">
</html>
<h5>Phone</h5>

</div>
FORGOT PASSWORD
<div class="icon">
<!DOCTYPE html>
<i class="ion ion-android-
mail"></i> <html lang="en">

</div> <head>

<a href="phonereg.html" <meta charset="utf-8">

class="small-box-footer">Click Here <i <meta name="viewport"
class="fas fa-arrow-circle-right"></i></a> content="width=device-width, initial-
</div> scale=1">

</div> <title>Forgotten Password | Academic

Commission Booking System</title>
</div>
<!-- Google Font: Source Sans Pro -->
<center>
 105
TAGUIG CITY UNIVERSITY
<link rel="stylesheet" <form id="form" method="post">

href="https://fonts.googleapis.com/css <div class="input-group mb-3">

?family=Source+Sans+Pro:300,400,400i
,700&display=fallback"> <input type="username"
class="form-control" placeholder="Email"
<!-- Font Awesome --> id="email" autocomplete="email">

<link rel="stylesheet" href="AdminLTE- <div class="input-group-

3.2.0/plugins/fontawesome- append">
free/css/all.min.css">
<div class="input-group-text">
<!-- icheck bootstrap -->
<span class="fas fa-
<link rel="stylesheet" href="AdminLTE- at"></span>
3.2.0/plugins/icheck-bootstrap/icheck-
bootstrap.min.css"> </div>

<!-- Theme style --> </div>

<link rel="stylesheet" href="AdminLTE-

3.2.0/dist/css/adminlte.min.css"> </div>
</head> <div class="row">
<body class="hold-transition login- <div class="col-4">
page">
</div>
<div class="login-box">
<div class="col-4">
<div class="login-logo">
<button type="submit"
Forgot Password? class="btn btn-primary btn-
</div> block">Send</button>

<!-- /.login-logo --> </div>

<div class="card"> <!-- /.col -->

<div class="card-body login-card- </div>

body"> </form>
<p class="login-box-msg">Please </div>
enter your email</p>
 106
TAGUIG CITY UNIVERSITY
<center> // Your web app's Firebase
configuration
<div class="social-auth-links text-
center mt-2 mb-3 col-7"> // For Firebase JS SDK v7.20.0 and
later, measurementId is optional
<p>or</p>
const firebaseConfig = {
<a href="index.html" class="btn
btn-block btn-primary"> apiKey:
"AIzaSyCo7nh58UwLmF5w6XPc4erpJg
Return to Login HE2fD1-pE",
</a> authDomain:
</div> "thesissandbox.firebaseapp.com",

<!-- /.login-card-body --> projectId: "thesissandbox",

</div> storageBucket:
"thesissandbox.appspot.com",
</div>
messagingSenderId:
<!-- /.login-box --> "219383246422",
<script type="module"> appId:
"1:219383246422:web:137c8b5cf599e6
// Import the functions you need from
734dd5f7",
the SDKs you need
measurementId: "G-DPPCXVN3HD"
import { initializeApp } from
"https://www.gstatic.com/firebasejs/10.1 };
2.1/firebase-app.js";
// Initialize Firebase
import { getAuth,
sendPasswordResetEmail } from const app =
"https://www.gstatic.com/firebasejs/10.1 initializeApp(firebaseConfig);
2.1/firebase-auth.js"; const auth = getAuth(app);
// TODO: Add SDKs for Firebase let em =
products that you want to use document.getElementById('email');
// let MainForm =
https://firebase.google.com/docs/web/set document.getElementById('form');
up#available-libraries
 107
TAGUIG CITY UNIVERSITY
MainForm.addEventListener('submit', DASHBOARD
function (event) {
<!DOCTYPE html>
event.preventDefault();
<html lang="en">
ForgotPassword();
<head>
});
<meta charset="utf-8">
let ForgotPassword = () => {
<meta name="viewport"
sendPasswordResetEmail(auth, content="width=device-width, initial-
em.value) scale=1">

.then(() => { <title>TCU Thesis Management

System</title>
alert("The password reset link has
been sent to your Email!"); <link rel="icon" type="image/x-icon"
href="favicon.png">
window.location.href =
"index.html"; <!-- Google Font: Source Sans Pro -->

}) <link rel="stylesheet"

.catch((error) => { href="https://fonts.googleapis.com/css

?family=Source+Sans+Pro:300,400,400i
console.log(error.code); ,700&display=fallback">
console.log(error.message); <!-- Font Awesome Icons -->
alert("An error occurred. Please <link rel="stylesheet" href="AdminLTE-
try again."); 3.2.0/plugins/fontawesome-
}); free/css/all.min.css">

}; <!-- overlayScrollbars -->

</script> <link rel="stylesheet" href="AdminLTE-

3.2.0/plugins/overlayScrollbars/css/Overl
</body> ayScrollbars.min.css">

</html> <!-- Theme style -->

<link rel="stylesheet" href="AdminLTE-

3.2.0/dist/css/adminlte.min.css">
 108
TAGUIG CITY UNIVERSITY
</head> <div class="dropdown-
divider"></div>
<body class="sidebar-mini control-
sidebar-slide-close dark-mode "> <a href="#" class="dropdown-
item">
<div class="wrapper">
<div class="dropdown-item">
<!-- Navbar -->
<div class="custom-control
<nav class="main-header navbar custom-switch">
navbar-expand navbar-dark">
<input type="checkbox"
<!-- Left navbar links --> class="custom-control-input"
<ul class="navbar-nav"> id="customSwitch1">

<li class="nav-item"> <label class="custom-control-

label" for="customSwitch1">Dark
<a class="nav-link" data- Mode</label>
widget="pushmenu" href="#"
role="button"><i class="fas fa- </div>
bars"></i></a> </div>
</li> </a>
</ul> <div class="dropdown-
<!-- Right navbar links --> divider"></div>

<ul class="navbar-nav ml-auto"> <a class="dropdown-item"

type="button" data-toggle="modal" data-
<li class="nav-item dropdown"> target="#modal-profile">

<a class="nav-link" data- Change password

toggle="dropdown" href="#" aria-
expanded="false"> </a>

<i class="fas fa-cog"></i> <div class="modal fade"

id="modal-profile" aria-hidden="true"
</a> style="display: none;">
<div class="dropdown-menu <div class="modal-dialog">
dropdown-menu-lg dropdown-menu-
right" style="left: inherit; right: 0px;"> <div class="modal-content">
 109
TAGUIG CITY UNIVERSITY
<div class="modal-header"> <div class="dropdown-
divider"></div>
<h4 class="modal-
title">Default Modal</h4> <a class="dropdown-item"
type="submit" role="button"
<button type="button" id="signout">Logout</a>
class="close" data-dismiss="modal" aria-
label="Close"> <div class="dropdown-
divider"></div>
<span aria-
hidden="true">×</span> </div>

</button> </li>

</div> <li class="nav-item">

<div class="modal-body"> </li>

<p>One fine body…</p> </ul>

</div> </nav>

<div class="modal-footer <!-- /.navbar -->

justify-content-between">
<!-- Main Sidebar Container -->
<button type="button"
class="btn btn-default" data- <aside class="main-sidebar sidebar-
dismiss="modal">Close</button> dark-primary elevation-4">

<button type="button" <!-- Brand Logo -->

class="btn btn-primary">Save <a href="#" class="brand-link">
changes</button>
<span class="brand-text font-
</div> weight-light"><b>TCU
</div> UniArch</b></span>

<!-- /.modal-content --> </a>

</div> <div class="sidebar">

<!-- /.modal-dialog --> <!-- Sidebar Menu -->

</div> <nav class="mt-2">

 110
TAGUIG CITY UNIVERSITY
<ul class="nav nav-pills nav-sidebar flex- Archives
column" data-widget="treeview"
role="menu" data-accordion="false"> </p>

<!-- Add icons to the links using </a>

the .nav-icon class </li>

with font-awesome or any other <li class="nav-item">

icon font library --> <a href="favorites.html"
<li class="nav-header">Home class="nav-link">
</li> <i class="nav-icon fas fa-
<li class="nav-item"> heart"></i>

<a href="#" class="nav-link <p>

active"> Favorites
<i class="nav-icon fas fa- </p>
house-user"></i>
</a>
<p>
</li>
Dashboard
<li class="nav-item">
</p>
<a href="chatbot.html"
</a> class="nav-link">
</li> <i class="nav-icon fas fa-
<li class="nav-header">Thesis comments"></i>
</li> <p>
<li class="nav-item"> Chatbot
<a href="archives.html" </p>
class="nav-link">
</a>
<i class="nav-icon fa fa-
book"></i> </li>

<p> </ul>
 111
TAGUIG CITY UNIVERSITY
</nav> </div><!-- /.row -->

<!-- /.sidebar-menu --> <div class="card card-primary">

</div> <div class="card-header">

<!-- /.sidebar --> <h1 class="card-title"

id="name">(name placeholder)</h1>
</aside>
</div>
<!-- Content Wrapper. Contains page
content --> <!-- /.card-header -->

<div class="content-wrapper"> <!-- form start -->

<!-- Content Header (Page header) -- <form>

>
<div class="card-body">
<div class="content-header">
<h4 id="sn">(student number
<div class="container-fluid"> placeholder)</h4>

<div class="row mb-2"> </div>

<div class="col-sm-6"> <!-- /.card-body -->

</div> </form>

<!-- /.col --> </div>

<div class="col-sm-6"> <div class="card card-primary">

<ol class="breadcrumb float- <div class="card-header">

sm-right">
<h3 class="card-title">3 Most
<li class="breadcrumb- Viewed Documents</h3>
item"><a
href="dashboard.html">Home</a></li> </div>

<li class="breadcrumb-item <div class="card-body" id="most-

active">Main</li> viewed-documents">

</ol> <p>Please wait...</p>

</div><!-- /.col --> </div>

 112
TAGUIG CITY UNIVERSITY
</div> <script src="AdminLTE-
3.2.0/dist/js/adminlte.min.js"></script>
</div>
<script src="AdminLTE-
</form> 3.2.0/plugins/overlayScrollbars/js/jquery.
</div><!-- /.container-fluid --> overlayScrollbars.min.js"></script>

</div> <script type="module">

<!-- /.content-header --> import { initializeApp } from

"https://www.gstatic.com/firebasejs/10.1
<script src="conn.js"></script> 2.1/firebase-app.js";

<!-- Control Sidebar --> import { getFirestore, collection,

getDocs } from
<aside class="control-sidebar control-
"https://www.gstatic.com/firebasejs/10.1
sidebar-dark">
2.1/firebase-firestore.js";
<!-- Control sidebar content goes
const firebaseConfig = {
here -->
apiKey:
</aside>
"AIzaSyCo7nh58UwLmF5w6XPc4erpJg
<!-- /.control-sidebar --> HE2fD1-pE",

<!-- jQuery --> authDomain:

"thesissandbox.firebaseapp.com",
<script src="AdminLTE-
3.2.0/plugins/jquery/jquery.min.js"></scri projectId: "thesissandbox",
pt>
storageBucket:
<!-- Bootstrap 4 --> "thesissandbox.appspot.com",

<script src="AdminLTE- messagingSenderId:

3.2.0/plugins/bootstrap/js/bootstrap.bund "219383246422",
le.min.js"></script>
appId:
<!-- bs-custom-file-input --> "1:219383246422:web:137c8b5cf599e6
734dd5f7",
<script src="AdminLTE-
3.2.0/plugins/bs-custom-file-input/bs- measurementId: "G-
custom-file-input.min.js"></script> DPPCXVN3HD"

<!-- AdminLTE App --> };

 113
TAGUIG CITY UNIVERSITY
const app = sortedDocs.forEach(docSnap => {
initializeApp(firebaseConfig);
const data = docSnap.data();
const db = getFirestore(app);
const title = data.title;
async function
loadMostViewedDocuments() { console.log("Document Title:",
title);
try {
const link =
const viewsSnapshot = await document.createElement("a");
getDocs(collection(db, "Archive"));
link.href = "#";
console.log("Fetched
Documents:", viewsSnapshot.docs); link.textContent = title;

if (viewsSnapshot.empty) { link.classList.add("btn", "btn-

link");
console.log("No documents
found in 'Archives'."); link.style.display = "block";

return; link.addEventListener('click', ()
=> {
}
sessionStorage.setItem('docum
const sortedDocs = entData', JSON.stringify(data));
viewsSnapshot.docs
window.location.href =
.sort((a, b) => b.data().viewCount 'document.html';
- a.data().viewCount)
});
.
container.appendChild(link);
slice(0, 3);
});
console.log("Sorted Documents:",
sortedDocs); } catch (error) {

const container = console.error("Error fetching most

document.getElementById("most- viewed documents:", error);
viewed-documents"); }
container.innerHTML = ""; }
 114
TAGUIG CITY UNIVERSITY
document.addEventListener('DOMConte free/css/all.min.css">
ntLoaded',
<!-- overlayScrollbars -->
loadMostViewedDocuments);
<link rel="stylesheet" href="AdminLTE-
</script> 3.2.0/plugins/overlayScrollbars/css/Overl
ayScrollbars.min.css">
</body>
<!-- Theme style -->
</html>
<link rel="stylesheet" href="AdminLTE-
3.2.0/dist/css/adminlte.min.css">
DOCUMENTS <link rel="stylesheet"
<!DOCTYPE html> href="https://cdnjs.cloudflare.com/ajax/lib
s/toastr.js/latest/toastr.min.css" />
<html lang="en">
</head>
<head>
<body class="sidebar-mini control-
<meta charset="utf-8"> sidebar-slide-close dark-mode">

<meta name="viewport" <div class="wrapper">

content="width=device-width, initial-
scale=1"> <!-- Navbar -->

<title>TCU Thesis Management <nav class="main-header navbar

System</title> navbar-expand navbar-dark">

<link rel="icon" type="image/x-icon" <!-- Left navbar links -->

href="favicon.png"> <ul class="navbar-nav">
<!-- Google Font: Source Sans Pro --> <li class="nav-item">
<link rel="stylesheet" <a class="nav-link" data-
href="https://fonts.googleapis.com/css widget="pushmenu" href="#"
?family=Source+Sans+Pro:300,400,400i role="button"><i class="fas fa-
,700&display=fallback"> bars"></i></a>

<!-- Font Awesome Icons --> </li>

<link rel="stylesheet" href="AdminLTE- </ul>

3.2.0/plugins/fontawesome-
 115
TAGUIG CITY UNIVERSITY
<!-- Right navbar links --> divider"></div>

<ul class="navbar-nav ml-auto"> <a class="dropdown-item"

type="submit" role="button"
<li class="nav-item dropdown"> id="signout">Logout</a>
<a class="nav-link" data- <div class="dropdown-
toggle="dropdown" href="#" aria- divider"></div>
expanded="false">
</div>
<i class="fas fa-cog"></i>
</li>
</a>
<li class="nav-item">
<div class="dropdown-menu
dropdown-menu-lg dropdown-menu- </li>
right" style="left: inherit; right: 0px;">
</ul>
<div class="dropdown-
divider"></div> </nav>

<a href="#" class="dropdown- <!-- /.navbar -->

item"> <!-- Main Sidebar Container -->
<div class="dropdown-item"> <aside class="main-sidebar sidebar-
<div class="custom-control dark-primary elevation-4">
custom-switch"> <a href="#" class="brand-link">
<input type="checkbox" <span class="brand-text font-
class="custom-control-input" weight-light"><b>TCU
id="customSwitch1"> UniArch</b></span>
<label class="custom-control- </a>
label" for="customSwitch1">Dark
Mode</label> <div class="sidebar">

</div> <!-- Sidebar Menu -->

</div> <nav class="mt-2">

</a> <ul class="nav nav-pills nav-

sidebar flex-column" data-
<div class="dropdown- widget="treeview" role="menu" data-
 116
TAGUIG CITY UNIVERSITY
accordion="false"> <a href="favorites.html"
class="nav-link">
<li class="nav-header">Home
</li> <i class="nav-icon fas fa-
heart"></i>
<li class="nav-item">
<p>
<a href="dashboard.html"
class="nav-link"> Favorites

<i class="nav-icon fas fa- </p>

house-user"></i>
</a>
<p>
</li>
Dashboard
<li class="nav-item">
</p>
<a href="chatbot.html"
</a> class="nav-link">

</li> <i class="nav-icon fas fa-

comments"></i>
<li class="nav-header">Thesis
</li> <p>

<li class="nav-item"> Chatbot

<a href="archives.html" </p>

class="nav-link active">
</a>
<i class="nav-icon fa fa-
book"></i> </li>

<p> </ul>

Archives </nav>

</p> <!-- /.sidebar-menu -->

</a> </div>

</li> <!-- /.sidebar -->

<li class="nav-item"> </aside>

 117
TAGUIG CITY UNIVERSITY
<!-- Content Wrapper. Contains page <!-- /.card-header -->
content -->
<!-- form start -->
<div class="content-wrapper">
<form>
<!-- Content Header (Page header) --
> <div class="card-body">

<div class="content-header"> <h2 align="center"

id="title">(title placeholder)</h2>
<div class="container-fluid">
</div>
<div class="row mb-2">
<!-- /.card-body -->
<div class="col-sm-6">
</form>
<button type="button"
class="btn btn-primary" </div>
id="return">Return</button> </div>
</div> <!-- Right column -->
</div><!-- /.col --> <div class="col-md-6">
</div><!-- /.row --> <div class="card card-
<section class="body"> primary">

<section class="body"> <div class="card-header">

<div class="row"> <h3 class="card-

title">Author/s</h3>
<!-- Left column -->
</div>
<div class="col-md-6">
<!-- /.card-header -->
<div class="card card-
primary"> <!-- form start -->

<div class="card-header"> <form>

<h3 class="card- <div class="card-body">

title">Title</h3> <h2 align="center"
</div> id="authors">(author placeholder)</h2>
 118
TAGUIG CITY UNIVERSITY
</div> </form>

<!-- /.card-body --> </div>

</form>

</div> </div>

</div> <div class="col-md-6">

</div> <div class="card card-

primary">
</section>
<div class="card-header">
<section class="body">
<h3 class="card-
<div class="row"> title">Views</h3>
<!-- Left column --> </div>
<div class="col-md-6"> <!-- /.card-header -->
<div class="card card- <!-- form start -->
primary">
<form>
<div class="card-header">
<div class="card-body">
<h3 class="card-
title">Year</h3> <h2 align="center"
id="views">(viewcount)</h2>
</div>
</div>
<!-- /.card-header -->
<!-- /.card-body -->
<!-- form start -->
</form>
<form>
</div>
<div class="card-body">
</div>
<h2 align="center"
id="year">(year placeholder)</h2> <!-- Right column -->

</div> <div class="col-md-6">

<!-- /.card-body --> <div class="card card-

 119
TAGUIG CITY UNIVERSITY
primary"> <script>

<div class="card-header"> document.getElementById('return').ad

dEventListener('click', function () {
<h3 class="card-
title">Abstract</h3> window.location.href =
'archives.html';

});
</div>
window.onload = function () {
<!-- /.card-header -->
const documentData =
<div class="card-body"> JSON.parse(sessionStorage.getItem('do
<p id="abstract" style="font- cumentData'));
size: 15px; text-align: justify;">(abstract if (documentData) {
placeholder)</p>
document.getElementById('title').tex
</div> tContent = documentData.title;
<!-- /.card-body --> document.getElementById('authors'
</div> ).textContent = documentData.author;

</div> document.getElementById('year').te
xtContent = documentData.year;
</div>
document.getElementById('abstract
<center><button type="button" ').textContent = documentData.abstract;
class="btn btn-primary"
id="viewDocBtn">View document.getElementById('views').t
Document</button></center> extContent = documentData.views;

</section> console.log('Document Data:',

documentData);
</section>
} else {
</div>
console.error('No document data
</div> found in sessionStorage.');
</div> }

<script src="conn.js"></script> }
 120
TAGUIG CITY UNIVERSITY
document.getElementById('viewDocBt iframeContainer.style.position =
n').addEventListener('click', function () { 'relative';

const documentData = iframeContainer.style.width = '80%';

JSON.parse(sessionStorage.getItem('do
cumentData')); iframeContainer.style.height =
'90%';
if (documentData &&
documentData.url) { iframeContainer.style.overflow =
'hidden';
const pdfUrl =
`${documentData.url}#toolbar=0&view=F const iframe =
document.createElement('iframe');
it`;
iframe.src = pdfUrl;
const modalOverlay =
document.createElement('div'); iframe.style.width = '100%';

modalOverlay.style.position = iframe.style.height = '100%';

'fixed'; iframe.style.border = 'none';
modalOverlay.style.top = '0'; iframe.style.zIndex = '1';
modalOverlay.style.left = '0'; const transparentOverlay =
modalOverlay.style.width = '100%'; document.createElement('div');

modalOverlay.style.height = '100%'; transparentOverlay.style.position =

'absolute';
modalOverlay.style.backgroundCol
or = 'rgba(0, 0, 0, 0.8)'; transparentOverlay.style.top = '0';

modalOverlay.style.zIndex = '9999'; transparentOverlay.style.left = '0';

modalOverlay.style.display = 'flex'; transparentOverlay.style.width =

'100%';
modalOverlay.style.alignItems =
'center'; transparentOverlay.style.height =
'100%';
modalOverlay.style.justifyContent =
'center'; transparentOverlay.style.backgroun
dColor = 'transparent';
const iframeContainer =
document.createElement('div'); transparentOverlay.style.zIndex =
'2';
 121
TAGUIG CITY UNIVERSITY
transparentOverlay.style.pointerEve closeButton.style.color = 'white';
nts = 'auto';
closeButton.style.border = 'none';
transparentOverlay.style.userSelect
= 'none'; closeButton.style.cursor = 'pointer';

transparentOverlay.addEventListen closeButton.style.zIndex = '3';

er('contextmenu', function (e) { closeButton.addEventListener('click'
e.preventDefault(); , function () {

}); document.body.removeChild(mod

transparentOverlay.addEventListen alOverlay);
er('mousedown', function (e) { });
e.preventDefault(); iframeContainer.appendChild(ifram
}); e);

transparentOverlay.addEventListen iframeContainer.appendChild(trans
er('selectstart', function (e) { parentOverlay);

e.preventDefault(); modalOverlay.appendChild(iframeC
ontainer);
});
modalOverlay.appendChild(closeBu
const closeButton = tton);
document.createElement('button');
document.body.appendChild(modal
closeButton.textContent = 'Close'; Overlay);

closeButton.style.position = } else {
'absolute';
alert("No document URL found!");
closeButton.style.top = '10px';
}
closeButton.style.right = '10px';
});
closeButton.style.padding = '10px
20px'; </script>

closeButton.style.backgroundColor <script type="module">

= 'red'; import { initializeApp } from
 122
TAGUIG CITY UNIVERSITY
"https://www.gstatic.com/firebasejs/10.1 ').textContent = documentData.abstract;
2.1/firebase-app.js";
document.getElementById('views').t
import { getFirestore, doc, getDoc, extContent = documentData.views;
updateDoc, increment } from
"https://www.gstatic.com/firebasejs/10.1 const docId = documentData.docId;
2.1/firebase-firestore.js"; const docRef = doc(db, "Archive",
const firebaseConfig = { docId);

apiKey: try {
"AIzaSyCo7nh58UwLmF5w6XPc4erpJg const docSnap = await
HE2fD1-pE", getDoc(docRef);
authDomain:
"thesissandbox.firebaseapp.com",
if (docSnap.exists()) {
projectId: "thesissandbox"
const currentViews =
}; docSnap.data().views || 0;
const app = await updateDoc(docRef, {
initializeApp(firebaseConfig);
views: increment(1)
const db = getFirestore(app);
});
window.onload = async function () {
} else {
const documentData =
JSON.parse(sessionStorage.getItem('do console.error("Document not
cumentData')); found.");

if (documentData) { }

document.getElementById('title').tex } catch (error) {

tContent = documentData.title;
console.error("Error fetching or
document.getElementById('authors' updating view count:", error);
).textContent = documentData.author;
}
document.getElementById('year').te
} else {
xtContent = documentData.year;

document.getElementById('abstract
 123
TAGUIG CITY UNIVERSITY
console.error('No document data found <script src="AdminLTE-
in sessionStorage.'); 3.2.0/dist/js/adminlte.min.js"></script>

} </body>

}; </html>

</script>

<!-- Control Sidebar --> ARCHIVES

<aside class="control-sidebar control- <!DOCTYPE html>

sidebar-dark">
<html lang="en">
<!-- Control sidebar content goes here
--> <head>

</aside> <meta charset="utf-8">

<!-- /.control-sidebar --> <meta name="viewport"

content="width=device-width, initial-
<!-- jQuery --> scale=1">

<script src="AdminLTE- <title>TCU Thesis Management

3.2.0/plugins/jquery/jquery.min.js"></scri System</title>
pt>
<link rel="icon" type="image/x-icon"
<!-- Bootstrap 4 --> href="favicon.png">

<script src="AdminLTE- <link rel="stylesheet"

3.2.0/plugins/bootstrap/js/bootstrap.bund
le.min.js"></script> href="https://fonts.googleapis.com/css
?family=Source+Sans+Pro:300,400,400i
<script ,700&display=fallback">
src="https://cdnjs.cloudflare.com/ajax/lib
s/toastr.js/latest/toastr.min.js"></script> <link rel="stylesheet" href="AdminLTE-
3.2.0/plugins/fontawesome-
<!-- bs-custom-file-input --> free/css/all.min.css">

<script src="AdminLTE- <link rel="stylesheet" href="AdminLTE-

3.2.0/plugins/bs-custom-file-input/bs- 3.2.0/plugins/overlayScrollbars/css/Overl
custom-file-input.min.js"></script> ayScrollbars.min.css">

<!-- AdminLTE App -->

 124
TAGUIG CITY UNIVERSITY
<link rel="stylesheet" href="AdminLTE- <a href="#" class="dropdown-
3.2.0/dist/css/adminlte.min.css"> item">

</head> <div class="custom-control

custom-switch">
<body class="sidebar-mini control-
sidebar-slide-close dark-mode"> <input type="checkbox"
class="custom-control-input"
<div class="wrapper"> id="customSwitch1">
<nav class="main-header navbar <label class="custom-control-
navbar-expand navbar-dark"> label" for="customSwitch1">Dark
<ul class="navbar-nav"> Mode</label>

<li class="nav-item"> </div>

<a class="nav-link" data- </a>

widget="pushmenu" href="#" <div class="dropdown-
role="button"><i class="fas fa- divider"></div>
bars"></i></a>
<a class="dropdown-item"
</li> type="submit" role="button"
</ul> id="signout">Logout</a>

<ul class="navbar-nav ml-auto"> <div class="dropdown-

divider"></div>
<li class="nav-item dropdown">
</div>
<a class="nav-link" data-
toggle="dropdown" href="#" aria- </li>
expanded="false"> </ul>
<i class="fas fa-cog"></i> </nav>
</a> <aside class="main-sidebar sidebar-
<div class="dropdown-menu dark-primary elevation-4">
dropdown-menu-lg dropdown-menu- <a href="#" class="brand-link">
right" style="left: inherit; right: 0px;">
<span class="brand-text font-
<div class="dropdown- weight-light"><b>TCU
divider"></div> UniArch</b></span>
 125
TAGUIG CITY UNIVERSITY
</a> <li class="nav-item">

<div class="sidebar"> <a href="favorites.html"

class="nav-link">
<nav class="mt-2">
<i class="nav-icon fas fa-
<ul class="nav nav-pills nav- heart"></i>
sidebar flex-column" data-
widget="treeview" role="menu" data- <p>Favorites</p>
accordion="false">
</a>
<li class="nav-header">Home
</li> </li>

<li class="nav-item"> <li class="nav-item">

<a href="dashboard.html" <a href="chatbot.html"

class="nav-link"> class="nav-link">

<i class="nav-icon fas fa- <i class="nav-icon fas fa-

house-user"></i> comments"></i>
<p>Dashboard</p> <p>Chatbot</p>
</a> </a>
</li> </li>
<li class="nav-header">Thesis </ul>
</li>
</nav>
<li class="nav-item">
</div>
<a href="#" class="nav-link
active"> </aside>

<i class="nav-icon fa fa- <div class="content-wrapper">

book"></i>
<div class="content-header">
<p>Archives</p>
<div class="container-fluid">
</a>
<div class="row mb-2">
</li>
<div class="col-sm-6"></div>
 126
TAGUIG CITY UNIVERSITY
<div class="col-sm-6"> <a class="nav-link active"
id="ta" data-toggle="pill" href="#custom-
<ol class="breadcrumb float- tabs-one-home" role="tab"
sm-right">
aria-controls="custom-
<li class="breadcrumb- tabs-one-home" aria-
item"><a selected="true">Thesis Archives</a>
href="dashboard.html">Home</a></li>
</li>
<li class="breadcrumb-item
active">Archives</li> <li class="nav-item">

</ol> <a class="nav-link"

id="custom-tabs-one-profile-tab" data-
</div> toggle="pill"
</div> href="#custom-tabs-one-
<div class="row"> profile" role="tab" aria-controls="custom-
tabs-one-profile"
<div class="col-12">
aria-
<h4>Archives </h4> selected="false">Upload</a>

</div> </li>

</div> </ul>
<div class="row" style="height: </div>

100vh;">

<div class="mx-auto w-100 h- <div class="card-body">

100">
<div class="tab-content"
<div class="card card-primary id="custom-tabs-one-tabContent">
card-tabs w-100 h-100">
<div class="tab-pane fade
<div class="card-header p-0 show active" id="custom-tabs-one-
pt-1"> home" role="tabpanel"
<ul class="nav nav-tabs" aria-labelledby="custom-
id="custom-tabs-one-tab" role="tablist"> tabs-one-home-tab">
<li class="nav-item">
 127
TAGUIG CITY UNIVERSITY
<div class="card-body"> colspan="1" aria-
sort="ascending">Title</th>
<div class="input-group">
<th
<input type="text" class="sorting" tabindex="0" aria-
id="searchBox" class="form-control" controls="userList" rowspan="1"
placeholder="Search colspan="1">
by thesis title, keyword, year, or author"> Year</th>
<button id="searchBtn" <th
class="btn btn- class="sorting" tabindex="0" aria-
primary">Search</button> controls="userList" rowspan="1"
</div> colspan="1">

<div Author</th>
id="searchResults"></div> <th
<div class="sorting" tabindex="0" aria-
id="userList_wrapper" controls="userList" rowspan="1"
class="dataTables_wrapper dt- colspan="1">
bootstrap4 dark-mode"> View
<div class="row"> Document</th>
<div class="col-sm- <th
12"> class="sorting" tabindex="0" aria-
controls="userList" rowspan="1"
<table colspan="1">
id="archiveList" class="table table-
bordered table-hover dataTable dtr- Add to
inline" Favorites</th>

aria- </tr>
describedby="archiveList_info"> <tr></tr>
<thead> </thead>
<tr> <tbody>
<th class="sorting <!-- ayoko na mag
sorting_asc" tabindex="0" aria- code sir hahahahaha -->
controls="userList" rowspan="1"
 128
TAGUIG CITY UNIVERSITY
</tbody> labelledby="uploadModalLabel" aria-
hidden="true">
</table>
<div class="modal-dialog"
</div> role="document">
</div> <div class="modal-
</div> content">

</div> <div class="modal-

header">
</div>
<h5 class="modal-
<div class="tab-pane fade" title" id="uploadModalLabel">Select the
id="custom-tabs-one-profile" thesis</h5>
role="tabpanel"
<button type="button"
aria-labelledby="custom- class="close" data-dismiss="modal" aria-
tabs-one-profile-tab"> label="Close">

<div class="mainDiv" <span aria-

align="center"> hidden="true">&times;</span>

<button type="button" </button>

class="btn btn-primary" data-
toggle="modal" data- </div>
target="#uploadModal"> <div class="modal-
Select File body">

</button> <div class="form-

group">
<center><label
id="selectedFileLabel">Please select a <label
file</label></center> for="fileInput">Please upload in
.pdf</label>
</div>
<input type="file"
<div class="modal fade" class="form-control-file" id="fileInput"
id="uploadModal" tabindex="-1" accept=".pdf">
role="dialog"
</div>
aria-
 129
TAGUIG CITY UNIVERSITY
</div> <div class="col-md-6">

<div class="modal- <div class="form-

footer"> group">

<button type="button" <label

class="btn btn-secondary" data- for="forYear">Year</label>
dismiss="modal">Close</button>
<input type="text"
<button type="button" class="form-control" id="year"
class="btn btn-primary" placeholder="Enter year">
id="selectFileBtn"
</div>
data-
dismiss="modal">Select</button> </div>

</div> <div class="col-md-6">

</div> <div class="form-

group">
</div>
<label
</div> for="forAuthor">Author/s</label>

<section class="body"> <input type="text"

class="form-control" id="author"
<form id="saveform"> placeholder="Enter author/s">
<div class="row"> </div>
<div class="col-md-6"> </div>
<div class="form- <div class="col-md-6">
group">
<div class="form-
<label group">
for="forTitle">Title</label>
<label
<input type="text" for="forAbstract">Abstract</label>
class="form-control" id="title"
placeholder="Enter title"> <textarea type="text"
class="form-control" id="abstract"
</div> rows="3"
</div> placeholder="Enter
 130
TAGUIG CITY UNIVERSITY
abstract"></textarea> </div>

</div> <script src="AdminLTE-

3.2.0/plugins/jquery/jquery.min.js"></scri
</div> pt>
</div> <script src="AdminLTE-
<div class="form- 3.2.0/plugins/bootstrap/js/bootstrap.bund
group"> le.min.js"></script>

<label <script src="AdminLTE-

for="uploader">Upload Progress</label> 3.2.0/plugins/overlayScrollbars/js/jquery.
overlayScrollbars.min.js"></script>
<progress
id="uploader" value="0" max="100" <script src="AdminLTE-
style="width: 100%;"></progress> 3.2.0/dist/js/adminlte.js"></script>

</div> <!-- DataTables CSS -->

<button type="submit" <link rel="stylesheet"

class="btn btn-primary" id="ulb">Upload href="https://cdn.datatables.net/2.1.8/css
File</button> /dataTables.dataTables.min.css">

</form> <!-- DataTables JS -->

</section> <script
src="https://cdn.datatables.net/2.1.8/js/d
</div> ataTables.min.js"></script>
</div> <script src="conn.js"></script>
</div> <script src="table.js"
type="module"></script>
</div>
<script>
</div>
document.getElementById('searchBox
</div>
').addEventListener('input', function () {
</div>
const query =
</div> this.value.toLowerCase();

</div> const rows =

 131
TAGUIG CITY UNIVERSITY
document.querySelectorAll('#archiveList TABLE
tbody tr');
import { initializeApp } from
rows.forEach(row => { "https://www.gstatic.com/firebasejs/10.1
2.1/firebase-app.js";
const title =
row.querySelector('td:nth- import { getFirestore, collection, addDoc,
child(1)')?.textContent.toLowerCase(); getDocs, doc, getDoc, setDoc } from
"https://www.gstatic.com/firebasejs/10.1
const year = 2.1/firebase-firestore.js";
row.querySelector('td:nth-
child(2)')?.textContent.toLowerCase(); import { getStorage, ref as sRef,
uploadBytesResumable,
const author = getDownloadURL } from
row.querySelector('td:nth- "https://www.gstatic.com/firebasejs/10.1
child(3)')?.textContent.toLowerCase(); 2.1/firebase-storage.js";

const firebaseConfig = {
if (title.includes(query) || apiKey:
year.includes(query) || "AIzaSyCo7nh58UwLmF5w6XPc4erpJg
author.includes(query)) { HE2fD1-pE",
row.style.display = ''; authDomain:
} else { "thesissandbox.firebaseapp.com",

row.style.display = 'none'; projectId: "thesissandbox",

} storageBucket:
"thesissandbox.appspot.com",
});
messagingSenderId:
"219383246422",

}); appId:
"1:219383246422:web:137c8b5cf599e6
</script>
734dd5f7",
<aside class="control-sidebar control-
measurementId: "G-DPPCXVN3HD"
sidebar-dark"></aside>
};
</body>
const app =
</html>
 132
TAGUIG CITY UNIVERSITY
initializeApp(firebaseConfig); er-creds")).uid;

const db = getFirestore(app); const favoriteDocRef = doc(db,

"Favorites", userId);
const storage = getStorage(app);
const userFavoritesDoc = await
let selectedFile = null; getDoc(favoriteDocRef);
document.getElementById('selectFileBtn' const userFavorites =
).addEventListener('click', () => { userFavoritesDoc.exists() ?
selectedFile = userFavoritesDoc.data().favorites : [];
document.getElementById('fileInput').file const currentYear = new
s[0]; Date().getFullYear();
if (selectedFile) { querySnapshot.docs.forEach((docS
document.getElementById('selecte nap) => {
dFileLabel').textContent = `Selected file: const data = docSnap.data();
${selectedFile.name}`;
const { title, year, abstract,
} author, views, url } = data;
}); const docId = docSnap.id;
async function populateTable() { if (currentYear - year >= 4) {
try { return;
const querySnapshot = await }
getDocs(collection(db, "Archive"));
const newRow =
const tableBody = document.createElement('tr');
document.getElementById("archiveList").
getElementsByTagName('tbody')[0]; newRow.innerHTML = `

tableBody.innerHTML = ''; <td>${title}</td>

const fragment = <td>${year}</td>

document.createDocumentFragment();
<td>${author}</td>
const userId =
JSON.parse(sessionStorage.getItem("us <td><button class="btn btn-
primary view-btn">View
 133
TAGUIG CITY UNIVERSITY
Document</button></td> favoriteButton.addEventListener('
click', () => {
<td><button class="btn
favorite-btn"></button></td> toggleFavorite(userId, docId,
favoriteButton);
`;
});
const viewButton =
newRow.querySelector('.view-btn'); fragment.appendChild(newRow);

const favoriteButton = });

newRow.querySelector('.favorite-btn');
tableBody.appendChild(fragment);
viewButton.addEventListener('cli
ck', () => { } catch (error) {

sessionStorage.setItem('docu console.error("Error populating

mentData', JSON.stringify({ title, year, table:", error);
abstract, author, url, views, docId })); }
window.location.href = }
'document.html';
document.addEventListener('DOMConte
}); ntLoaded', function () {
if (userFavorites.includes(docId)) const bfav =
{ document.getElementById('addtofav');
favoriteButton.textContent = if (bfav) {
"Remove from Favorites";
bfav.addEventListener('click', async
favoriteButton.classList.add('bt function () {
n-danger');
const userId = "yourUserId";
} else {
const docId = "yourDocId";
favoriteButton.textContent =
await toggleFavorite(userId,
"Add to Favorites"; docId, bfav);
favoriteButton.classList.add('bt
n-warning');
});
}
 134
TAGUIG CITY UNIVERSITY
} if (!selectedFile) {

}); alert("Please select a file to

upload.");
function clearForm() {
return;
document.getElementById('title').value
= ''; }

document.getElementById('year').valu const storageRef = sRef(storage, 'pdf/'

e = ''; + selectedFile.name);

document.getElementById('author').va const uploadTask =

lue = ''; uploadBytesResumable(storageRef,
selectedFile);
document.getElementById('abstract').
value = ''; const uploadButton =
document.getElementById('ulb');
document.getElementById('fileInput').v
alue = ''; uploadButton.disabled = true;

document.getElementById('selectedFil uploadTask.on('state_changed',
eLabel').textContent = 'Please select a
file'; (snapshot) => {

} const percentage =
(snapshot.bytesTransferred /
function saveData() { snapshot.totalBytes) * 100;

const title = document.getElementById('uploa

document.getElementById('title').value; der').value = percentage;

const year = },
document.getElementById('year').value;
(error) => {
const author =
document.getElementById('author').valu console.error('Upload failed:',
e; error);

const abstract = uploadButton.disabled = false;

document.getElementById('abstract').val },
ue;
() => {
 135
TAGUIG CITY UNIVERSITY
getDownloadURL(uploadTask.sn uploadButton.disabled =
apshot.ref).then((downloadURL) => { false;

const archive = { document.getElementByI

d('uploader').value = 0;
title: title,
});
year: year,
});
author: author,
}
abstract: abstract,
);
timeuploaded:
now.toLocaleString(), }

url: downloadURL async function toggleFavorite(userId,

docId, button) {
};
const favoriteRef = collection(db,
addDoc(collection(db, "Favorites");
"Archive"), archive)
const docRef = doc(favoriteRef,
.then((docRef) => { userId);
console.log("Document const userFavoritesDoc = await
saved with ID:", docRef.id); getDoc(docRef);
alert("File and data saved let userFavorites =
successfully!"); userFavoritesDoc.exists() ?
populateTable(); userFavoritesDoc.data().favorites : [];

clearForm(); if (userFavorites.includes(docId)) {

}) userFavorites =
userFavorites.filter(favorite => favorite
.catch((error) => { !== docId);
console.error("Error button.textContent = "Add to
saving document:", error); Favorites";
}) button.classList.remove('btn-
danger');
.finally(() => {
 136
TAGUIG CITY UNIVERSITY
button.classList.add('btn-warning'); }

} else { populateTable();

userFavorites.push(docId); });

button.textContent = "Remove from window.onload = populateTable;

Favorites";

button.classList.remove('btn-
warning'); FAVORITES

button.classList.add('btn-danger'); <!DOCTYPE html>

} <html lang="en">

await setDoc(docRef, { favorites: <head>

userFavorites }); <meta charset="utf-8">
} <meta name="viewport"
document.getElementById('saveform').a content="width=device-width, initial-
ddEventListener('submit', (event) => { scale=1">

event.preventDefault(); <title>TCU Thesis Management

System</title>
saveData();
<link rel="icon" type="image/x-icon"
}); href="favicon.png">

const now = new Date(); <!-- Google Font: Source Sans Pro -->

console.log(`Current Date and Time: <link rel="stylesheet"

${now.toLocaleString()}`);
href="https://fonts.googleapis.com/c
document.getElementById("ta").addEven ss?family=Source+Sans+Pro:300,400,4
tListener("click", () => { 00i,700&display=fallback">

const tableBody = <!-- Font Awesome Icons -->

document.getElementById("archiveList").
getElementsByTagName('tbody')[0]; <link rel="stylesheet"
href="AdminLTE-
while (tableBody.rows.length > 0) { 3.2.0/plugins/fontawesome-
free/css/all.min.css">
tableBody.deleteRow(0);
 137
TAGUIG CITY UNIVERSITY
<!-- overlayScrollbars --> <ul class="navbar-nav ml-auto">

<link rel="stylesheet" <li class="nav-item

href="AdminLTE- dropdown">
3.2.0/plugins/overlayScrollbars/css/Overl
ayScrollbars.min.css"> <a class="nav-link" data-
toggle="dropdown" href="#" aria-
<!-- Theme style --> expanded="false">

<link rel="stylesheet" <i class="fas fa-cog"></i>

href="AdminLTE-
3.2.0/dist/css/adminlte.min.css"> </a>

<script src="fav.js" <div class="dropdown-menu

type="module"></script> dropdown-menu-lg dropdown-menu-
right" style="left: inherit; right: 0px;">
</head>
<div class="dropdown-
<body class="sidebar-mini control- divider"></div>
sidebar-slide-close dark-mode">
<a href="#"
<div class="wrapper"> class="dropdown-item">

<!-- Navbar --> <div class="dropdown-

item">
<nav class="main-header navbar
navbar-expand navbar-dark"> <div class="custom-
control custom-switch">
<!-- Left navbar links -->
<input
<ul class="navbar-nav"> type="checkbox" class="custom-control-
<li class="nav-item"> input" id="customSwitch1">

<a class="nav-link" data- <label

widget="pushmenu" href="#" class="custom-control-label"
role="button"><i class="fas fa- for="customSwitch1">Dark
bars"></i></a> Mode</label>

</li> </div>

</ul> </div>

<!-- Right navbar links --> </a>

 138
TAGUIG CITY UNIVERSITY
<div class="dropdown- <ul class="nav nav-pills
divider"></div> nav-sidebar flex-column" data-

<a class="dropdown- widget="treeview" role="menu"

item" type="submit" role="button"
id="signout">Logout</a> data-accordion="false">

<div class="dropdown- <li class="nav-

divider"></div> header">Home </li>

</div> <li class="nav-item">

</li> <a
href="dashboard.html" class="nav-link">
<li class="nav-item">
<i class="nav-icon
</li> fas fa-house-user"></i>

</ul> <p>

</nav> Dashboard

<!-- /.navbar --> </p>

</a>

<!-- Main Sidebar Container --> </li>

<aside class="main-sidebar <li class="nav-

sidebar-dark-primary elevation-4"> header">Thesis </li>

<!-- Brand Logo --> <li class="nav-item">

<a href="#" class="brand-link"> <a href="archives.html"

class="nav-link">
<span class="brand-text font-
weight-light"><b>TCU <i class="nav-icon fa
UniArch</b></span> fa-book"></i>

</a> <p>

<div class="sidebar"> Archives

<!-- Sidebar Menu --> </p>

<nav class="mt-2"> </a>

 139
TAGUIG CITY UNIVERSITY
</li> </aside>

<li class="nav-item"> <!-- Content Wrapper. Contains

<a href="#" page content -->

class="nav-link active">
<div class="content-wrapper">
<i class="nav-icon
fas fa-heart"></i> <!-- Content Header (Page
header) -->
<p>
<div class="content-header">
Favorites
<div class="container-fluid">
</p>
<div class="row mb-2">
</a>
<div class="col-sm-6">
</li>
</div>
<li class="nav-item">
<!-- /.col -->
<a href="chatbot.html"
class="nav-link"> <div class="col-sm-6">

<i class="nav-icon <ol class="breadcrumb

fas fa-comments"></i> float-sm-right">

<p> <li
class="breadcrumb-item"><a
Chatbot href="dashboard.html">Home</a></li>

</p> <li
class="breadcrumb-item
</a> active">Favorites</li>
</li> </ol>
</ul> </div><!-- /.col -->
</nav> </div><!-- /.row -->
<!-- /.sidebar-menu --> <div class="card card-
</div> primary" style="height: 100vh;">

<!-- /.sidebar --> <div class="card-

 140
TAGUIG CITY UNIVERSITY
header"> colspan="1"

<h1 class="card- ari

title">Favorites</h1> a-sort="ascending">Title</th>

</div> <th
class="sorting" tabindex="0" aria-
<!-- /.card-header --> controls="userList"
<!-- form start --> ro
<form> wspan="1" colspan="1">Year</th>

<div class="card- <th

body"> class="sorting" tabindex="0" aria-
controls="userList"
<div
id="userList_wrapper" ro
class="dataTables_wrapper dt- wspan="1" colspan="1">Author</th>
bootstrap4 dark-mode"> <th
<div class="row"> class="sorting" tabindex="0" aria-
controls="userList
<div class="col-
sm-12"> ro
wspan="1" colspan="1">
<table
id="favoritesList" Vie
w
class="tabl
e table-bordered table-hover dataTable Do
dtr-inline" cument</th>

aria- <th
describedby="favoritesList_info"> class="sorting" tabindex="0" aria-
controls="userList"
<thead>
ro
<tr> wspan="1" colspan="1">Actions</th>
<th </tr>
class="sorting sorting_asc" tabindex="0"
</thead>
ari
a-controls="userList" rowspan="1" <tbody>
 141
TAGUIG CITY UNIVERSITY
<!— <script src="AdminLTE-
3.2.0/plugins/jquery/jquery.min.js"></scri
contents--> pt>
</tbody> <!-- Bootstrap 4 -->
</table> <script src="AdminLTE-
</div> 3.2.0/plugins/bootstrap/js/bootstrap.bund
le.min.js"></script>
</div>
<!-- bs-custom-file-input -->
</div>
<script src="AdminLTE-
</div> 3.2.0/plugins/bs-custom-file-input/bs-
custom-file-input.min.js"></script>
</form>
<!-- AdminLTE App -->
</div>
<script src="AdminLTE-
</div>
3.2.0/dist/js/adminlte.min.js"></script>
</form>
</body>
</div><!-- /.container-fluid -->
</html>
</div>

<!-- /.content-header -->

PAGE NOT FOUND
<script src="conn.js"></script>
<!DOCTYPE html>
<!-- Control Sidebar -->
<html>
<aside class="control-sidebar
<head>
control-sidebar-dark">
<meta charset="utf-8">
<!-- Control sidebar content goes
here --> <meta name="viewport"
content="width=device-width, initial-
</aside>
scale=1">
<!-- /.control-sidebar -->
<title>Page Not Found</title>
<!-- jQuery -->
<style media="screen">
 142
TAGUIG CITY UNIVERSITY
body { background: #ECEFF1; color: body { border-top: 16px solid
rgba(0,0,0,0.87); font-family: Roboto, #ffa100; }
Helvetica, Arial, sans-serif; margin: 0;
padding: 0; } }

#message { background: white; max- </style>

width: 360px; margin: 100px auto 16px; </head>
padding: 32px 24px 16px; border-radius:
3px; } <body>

#message h3 { color: #888; font- <div id="message">

weight: normal; font-size: 16px; margin:
<h2>404</h2>
16px 0 12px; }
<h1>Page Not Found</h1>
#message h2 { color: #ffa100; font-
weight: bold; font-size: 16px; margin: 0 0 <p>The specified file was not found
8px; } on this website. Please check the URL
for mistakes and try again.</p>
#message h1 { font-size: 22px; font-
weight: 300; color: rgba(0,0,0,0.6); <h3>Why am I seeing this?</h3>
margin: 0 0 16px;}
<p>This page was generated by the
#message p { line-height: 140%; Firebase Command-Line Interface. To
margin: 16px 0 24px; font-size: 14px; } modify it, edit the
<code>404.html</code> file in your
#message a { display: block; text-
project's configured
align: center; background: #039be5; text-
<code>public</code> directory.</p>
transform: uppercase; text-decoration:
none; color: white; padding: 16px; </div>
border-radius: 4px; }
</body>
#message, #message a { box-
shadow: 0 1px 3px rgba(0,0,0,0.12), 0 </html>
1px 2px rgba(0,0,0,0.24); }

#load { color: rgba(0,0,0,0.4); text-

CHATBOT
align: center; font-size: 13px; }
<!DOCTYPE html>
@media (max-width: 600px) {
<html lang="en">
body, #message { margin-top: 0;
background: white; box-shadow: none; } <head>
 143
TAGUIG CITY UNIVERSITY
<meta charset="utf-8"> <li class="nav-item">

<meta name="viewport" <a class="nav-link" data-

content="width=device-width, initial- widget="pushmenu" href="#"
scale=1"> role="button"><i class="fas fa-
bars"></i></a>
<title>TCU Thesis Management
System</title> </li>

<link rel="icon" type="image/x-icon" </ul>

href="favicon.png">
</nav>
<link rel="stylesheet"
<aside class="main-sidebar
href="https://fonts.googleapis.com/c sidebar-dark-primary elevation-4">
ss?family=Source+Sans+Pro:300,400,4
00i,700&display=fallback"> <a href="#" class="brand-
link"><span class="brand-text font-
<link rel="stylesheet" weight-light"><b>TCU
href="AdminLTE- UniArch</b></span></a>
3.2.0/plugins/fontawesome-
free/css/all.min.css"> <div class="sidebar">

<link rel="stylesheet" <nav class="mt-2">

href="AdminLTE- <ul class="nav nav-pills
3.2.0/plugins/overlayScrollbars/css/Overl nav-sidebar flex-column" data-
ayScrollbars.min.css"> widget="treeview" role="menu">
<link rel="stylesheet" <li class="nav-
href="AdminLTE- header">Home</li>
3.2.0/dist/css/adminlte.min.css">
<li class="nav-item"><a
</head> href="dashboard.html" class="nav-
<body class="sidebar-mini control- link"><i
sidebar-slide-close dark-mode"> class="nav-icon
<div class="wrapper"> fas fa-house-user"></i>

<nav class="main-header navbar <p>Dashboard</p>

navbar-expand navbar-dark"> </a></li>
<ul class="navbar-nav"> <li class="nav-
 144
TAGUIG CITY UNIVERSITY
header">Thesis</li> <form id="chatbot">

<li class="nav-item"><a <div class="card card-

href="archives.html" class="nav-link"><i primary">

class="nav-icon fa <div class="card card-

fa-book"></i> primary direct-chat direct-chat-primary">

<p>Archives</p> <div class="card-

header">
</a></li>
<h3 class="card-
<li class="nav-item"><a title">Chatbot</h3>
href="favorites.html" class="nav-link"><i
</div>
class="nav-icon
fas fa-heart"></i> <div class="card-
body">
<p>Favorites</p>
<div class="direct-
</a></li> chat-messages"
<li class="nav-item"><a id="chatMessages"></div>
href="#" class="nav-link active"><i </div>
class="nav-icon <div class="card-
fas fa-comments"></i> footer">
<p>Chatbot</p> <div class="input-
</a></li> group">

</ul> <input
type="text" id="userMessage"
</nav> placeholder="Type here!"
</div> class="form-
control">
</aside>
<span
<div class="content-wrapper">
class="input-group-append">
<div class="content-header">
<button
<div class="container-fluid">
 145
TAGUIG CITY UNIVERSITY
type="button" id="sendMessage" CHATBOT.JS
class="btn btn-primary">Send</button>
import { initializeApp } from
</span> "https://www.gstatic.com/firebasejs/9.15.
0/firebase-app.js";
</div>
import { getFirestore, collection, addDoc,
</div> query, orderBy, onSnapshot, limit } from
</div> "https://www.gstatic.com/firebasejs/9.15.
0/firebase-firestore.js";
</div>
const firebaseConfig = {
</form>
apiKey:
</div> "AIzaSyCo7nh58UwLmF5w6XPc4erpJg
HE2fD1-pE",
</div>
authDomain:
</div>
"thesissandbox.firebaseapp.com",
<script src="AdminLTE-
projectId: "thesissandbox",
3.2.0/plugins/jquery/jquery.min.js"></scri
pt> storageBucket:
"thesissandbox.appspot.com",
<script src="AdminLTE-
3.2.0/plugins/bootstrap/js/bootstrap.bund messagingSenderId:
le.min.js"></script> "219383246422",
<script src="AdminLTE- appId:
3.2.0/dist/js/adminlte.min.js"></script> "1:219383246422:web:137c8b5cf599e6
734dd5f7",
<script src="conn.js"></script>
measurementId: "G-DPPCXVN3HD"
<script src="chatbot.js"
type="module"></script> };

</div> const app =

initializeApp(firebaseConfig);
</body>
const db = getFirestore(app);
</html>
const chatMessages =
document.getElementById("chatMessag
es");
 146
TAGUIG CITY UNIVERSITY
const sendMessageButton = document.createElement("div");
document.getElementById("sendMessag
e"); messageElement.classList.add("dir
ect-chat-msg", "right");
const userMessageInput =
document.getElementById("userMessag messageElement.innerHTML =
e"); `<strong>User:</strong>
${data.prompt}<br><strong>Bot:</strong
async function sendMessage() { > ${data.response || "Please wait..."}`;

const userMessage = chatMessages.appendChild(messa

userMessageInput.value.trim(); geElement);

if (userMessage) { });

await addDoc(collection(db, });

'generate'), {
sendMessageButton.addEventListener("
prompt: userMessage, click", sendMessage);

createTime: new Date(),

status: 'PENDING' CONNECTION.JS

}); let UserCreds =

JSON.parse(sessionStorage.getItem("us
userMessageInput.value = ''; er-creds"));
} let UserInfo =
} JSON.parse(sessionStorage.getItem("us
er-info"));
const q = query(collection(db,
'generate'), orderBy('createTime', 'desc'), let so =
limit(1)); document.getElementById('signout');

onSnapshot(q, (snapshot) => { let wc =

document.getElementById('welcome');
chatMessages.innerHTML = '';
let signout = () => {
snapshot.forEach(doc => {
sessionStorage.removeItem("user-
const data = doc.data(); creds");
const messageElement =
 147
TAGUIG CITY UNIVERSITY
sessionStorage.removeItem("user-info"); ark-mode');

window.location.href = 'index.html'; }

} }

let check = () => { }

if (UserCreds && }
!UserCreds.emailVerified) {
const currentYear = new
alert("Please verify your email before Date().getFullYear();
logging in.");
if (UserInfo.year < currentYear - 3) {
sessionStorage.removeItem("user-
creds"); alert("Account expired, please inform
the librarian/admin for account
sessionStorage.removeItem("user-
info"); concerns.");

window.location.href = 'index.html'; sessionStorage.removeItem("user-

creds");
} else {
sessionStorage.removeItem("user-
console.log('User Info:', UserInfo); info");

console.log('User Creds:', UserCreds); window.location.href = 'index.html';

document.getElementById('name').tex }
tContent = UserInfo.name;
if (!UserCreds || !UserInfo) {
document.getElementById('sn').textCo
ntent = UserInfo.sn; window.location.href = "index.html";

if (UserInfo.isDark !== undefined) { window.addEventListener('load', check);

if (UserInfo.isDark === 1) { so.addEventListener('click', signout);

document.body.classList.add('dark-
mode'); PACKAGE-LOCK.JSON
} else if (UserInfo.isDark === 0) { {
document.body.classList.remove('d
 148
TAGUIG CITY UNIVERSITY
"name": "public", },

"version": "1.0.0", "engines": {

"lockfileVersion": 3, "node": ">=18"

"requires": true, }

"packages": { },

"": { "node_modules/@huggingface/tasks":
{
"name": "public",
"version": "0.12.30",
"version": "1.0.0",
"resolved":
"license": "ISC", "https://registry.npmjs.org/@huggingface
"dependencies": { /tasks/-/tasks-0.12.30.tgz",

"@huggingface/inference": "^2.8.1" "integrity": "sha512-

A1ITdxbEzx9L8wKR8pF7swyrTLxWNDF
} IGDLUWInxvks2ruQ8PLRBZe8r0EcjC3
CDdtlj9jV1V4cgV35K/iy3GQ==",
},
"license": "MIT"
"node_modules/@huggingface/inferen
ce": { }
"version": "2.8.1", }

"resolved": }
"https://registry.npmjs.org/@huggingface
/inference/-/inference-2.8.1.tgz",

"integrity": "sha512- PACKAGE.JSON

EfsNtY9OR6JCNaUa5bZu2mrs48iqeTz0 {
Gutwf+fU0Kypx33xFQB4DKMhp8u4Ee6
qVbLbNWvTHuWwlppLQl4p4Q==", "name": "public",

"license": "MIT", "version": "1.0.0",

"dependencies": { "main": "chatbot.js",

"@huggingface/tasks": "^0.12.9" "type": "module",

 149
TAGUIG CITY UNIVERSITY
"scripts": { // Firebase Configuration

"test": "echo \"Error: no test specified\" const firebaseConfig = {

&& exit 1"
apiKey:
}, "AIzaSyCo7nh58UwLmF5w6XPc4erpJg
HE2fD1-pE",
"keywords": [],
authDomain:
"author": "", "thesissandbox.firebaseapp.com",
"license": "ISC", projectId: "thesissandbox",
"description": "", storageBucket:
"dependencies": { "thesissandbox.appspot.com",

"@huggingface/inference": "^2.8.1" messagingSenderId: "219383246422",

} appId:
"1:219383246422:web:137c8b5cf599e6
} 734dd5f7",

measurementId: "G-DPPCXVN3HD"

OPEN AI.JS };

import { initializeApp } from // Initialize Firebase and Firestore

"https://www.gstatic.com/firebasejs/9.15.
0/firebase-app.js"; const app =
initializeApp(firebaseConfig);
import {
const db = getFirestore(app);
getFirestore,
const OPENAI_API_KEY = "sk-proj-
collection, 437kU4WfBZBFXkynGY8Za47dSrGbby
oZnAQGP0kVbwUaIinD3Ckr_lKedAxnW
getDocs,
kjxp30Lo8Byk1T3BlbkFJyJlkciVCmAjJG
query, 2MKgTzyabix7_f7_Vaqo6_plYLul2ruzcg
A8aTiOCXlAnnPWqmMH75y1hPBsA";
where
/**
} from
"https://www.gstatic.com/firebasejs/9.15. * Send a query to OpenAI to extract
0/firebase-firestore.js"; search intent and keywords.
 150
TAGUIG CITY UNIVERSITY
* @param {string} query - User's search archives." },
query.
{ role: "user", content: `Search
* @returns {string} Extracted keywords query: ${query}` }
or structured search info.
]
*/
})
async function
queryOpenAIForSearch(query) { });

const retryDelay = 5000; // Increase to if (response.ok) {

5 seconds const data = await response.json();
const maxRetries = 5; // Increase return
retries for better chances data.choices[0]?.message?.content ||
for (let attempt = 0; attempt < "No relevant response found.";
maxRetries; attempt++) { } else if (response.status === 429) {
try { console.warn("Rate limit hit,
const response = await retrying...");
fetch("https://api.openai.com/v1/chat/co await new Promise(resolve =>
mpletions", { setTimeout(resolve, retryDelay)); // Wait
method: "POST", before retrying

headers: { } else {

"Content-Type": "application/json", const errorData = await

response.json();
"Authorization": `Bearer
${OPENAI_API_KEY}` return `Error:
${errorData.error.message}`;
},
}
body: JSON.stringify({
} catch (error) {
model: "gpt-3.5-turbo",
console.error("Error querying
messages: [
OpenAI:", error);
{ role: "system", content: "You
are a search assistant for academic return "Error querying OpenAI.";
 151
TAGUIG CITY UNIVERSITY
} author.toLowerCase().includes(key
words.toLowerCase()) ||
return "Too many requests. Please try
again later."; abstract.toLowerCase().includes(ke
ywords.toLowerCase()) ||
}
year.toString().includes(keywords)
/**
){
* Search Firestore using extracted
keywords in multiple fields. matchedDocs.push({ title, author,

* @param {string} keywords - Keywords abstract, year });

or search parameters from OpenAI.
}
* @returns {Array} List of matched
documents. });

*/ if (matchedDocs.length > 0) {

async function return matchedDocs

searchFirestore(keywords) { .map(
try { (doc) =>
const querySnapshot = await `**Title:** ${doc.title}\n**Author:**
getDocs(collection(db, "archives")); ${doc.author}\n**Year:**
let matchedDocs = []; ${doc.year}\n**Abstract:**
${doc.abstract}`
querySnapshot.forEach((docSnap) =>
{ )

const data = docSnap.data(); .join("\n\n");

const { title, author, abstract, year } = } else {

data; return "No matching documents
// Check if keywords match title, found.";
author, abstract, or year }
if ( } catch (error) {
title.toLowerCase().includes(keywor console.error("Error searching
ds.toLowerCase()) || Firestore:", error);
 152
TAGUIG CITY UNIVERSITY
return "Error searching Firestore."; function addMessage(sender, message,
alignment) {
}
const messageDiv =
} document.createElement("div");
/** messageDiv.classList.add("direct-chat-
* Handle user input and perform a msg", alignment);
search in Firestore. messageDiv.innerHTML = `
* @param {string} userInput - The user's <div class="direct-chat-infos clearfix">
query.
<span class="direct-chat-name float-
*/ ${alignment}">${sender}</span>
async function <span class="direct-chat-timestamp
handleUserInput(userInput) { float-${alignment === "right" ? "left" :
"right"}">${new
const extractedKeywords = await Date().toLocaleTimeString()}</span>
queryOpenAIForSearch(userInput);
</div>
const searchResults = await
searchFirestore(extractedKeywords); <div class="direct-chat-
text">${message}</div>
addMessage("Chatbot", searchResults,
"left"); `;

} const chatMessages =
document.getElementById("chatMessag
/** es");

* Add a chat message to the UI. chatMessages.appendChild(messageD

iv);
* @param {string} sender - The sender
of the message. chatMessages.scrollTop =
chatMessages.scrollHeight;
* @param {string} message - The
message content. }
* @param {string} alignment - Message // Event listeners for sending message
alignment (left or right).
document.addEventListener("DOMConte
*/ ntLoaded", function () {
 153
TAGUIG CITY UNIVERSITY
const sendMessageButton = await
document.getElementById("sendMessag handleUserInput(userMessage);
e");
userMessageInput.value = "";
const userMessageInput =
document.getElementById("userMessag }
e"); }
sendMessageButton.addEventListener( });
"click", async () => {
});
const userMessage =
userMessageInput.value.trim();

if (userMessage) { UPDATE LIST

addMessage("Me", userMessage, import { initializeApp } from

"right"); "https://www.gstatic.com/firebasejs/10.1
2.1/firebase-app.js";
await
handleUserInput(userMessage); import { getFirestore, collection, query,
where, getDocs } from
userMessageInput.value = ""; "https://www.gstatic.com/firebasejs/10.1
} 2.1/firebase-firestore.js";

}); const firebaseConfig = {

userMessageInput.addEventListener("k apiKey:
eydown", async (event) => { "AIzaSyCo7nh58UwLmF5w6XPc4erpJg
HE2fD1-pE",
if (event.key === "Enter") {
authDomain:
event.preventDefault(); "thesissandbox.firebaseapp.com",

const userMessage = projectId: "thesissandbox",

userMessageInput.value.trim();
storageBucket:
"thesissandbox.appspot.com",

if (userMessage) { messagingSenderId:
"219383246422",
addMessage("Me", userMessage,
"right"); appId:
 154
TAGUIG CITY UNIVERSITY
"1:219383246422:web:137c8b5cf599e6 const messageDiv =
734dd5f7", document.createElement("div");

measurementId: "G-DPPCXVN3HD" if (alignment === "right") {

}; messageDiv.classList.add("direct-
chat-msg", "right");
const app =
initializeApp(firebaseConfig); } else {

const db = getFirestore(app); messageDiv.classList.add("direct-

chat-msg");
async function
searchFirestore(queryText) { }

// Firestore query searching for messageDiv.innerHTML = `

"content" containing the queryText
<div class="direct-chat-infos
const searchQuery = query( clearfix">

collection(db, "theses"), <span class="direct-chat-name

float-${alignment === "right" ? "right" :
where("content", "array-contains", "left"}">${sender}</span>
queryText)
<span class="direct-chat-
); timestamp float-${alignment === "right" ?
const querySnapshot = await "left" : "right"}">${new
getDocs(searchQuery); Date().toLocaleTimeString()}</span>

let results = []; </div>

querySnapshot.forEach((doc) => { <div class="direct-chat-

text">${message}</div>
results.push(doc.data());
`;
});
chatMessages.appendChild(message
return results; Div);
} chatMessages.scrollTop =
chatMessages.scrollHeight;
function addMessage(sender, message,
alignment) { }
 155
TAGUIG CITY UNIVERSITY
async function e");
handleUserInput(userInput) {
if (sendMessageButton &&
const firestoreResults = await userMessageInput) {
searchFirestore(userInput);
sendMessageButton.addEventListe
let responseText = "I found the ner("click", async () => {
following relevant documents:<br><br>";
await processMessage();
if (firestoreResults.length > 0) {
});
firestoreResults.forEach((doc,
index) => { userMessageInput.addEventListene
r("keydown", async (event) => {
responseText += `${index + 1}.
<strong>${doc.title}</strong> - if (event.key === "Enter") {
${doc.description}<br>`; event.preventDefault(); //
}); Prevent page refresh
} else { await processMessage();
responseText += "No results found }
for your query.";
});

} else {
}
console.error("One or more
return responseText; elements are missing.");
} }
// Add event listener for sending async function processMessage() {
messages via button or Enter key
const userMessage =
document.addEventListener("DOMConte userMessageInput.value.trim();
ntLoaded", function () {
if (userMessage) {
const sendMessageButton =
document.getElementById("sendMessag addMessage("Me",
e"); userMessage, "right");

const userMessageInput = const botResponse = await

document.getElementById("userMessag
 156
TAGUIG CITY UNIVERSITY
handleUserInput(userMessage); // Get apiKey:
Firestore search results "AIzaSyCo7nh58UwLmF5w6XPc4erpJg
HE2fD1-pE",
addMessage("Chatbot",
botResponse, "left"); authDomain:
"thesissandbox.firebaseapp.com",
userMessageInput.value = ""; //
Clear input projectId: "thesissandbox",

} storageBucket:
"thesissandbox.appspot.com",
}
messagingSenderId:
}); "219383246422",

appId:
UPLOAD.JS "1:219383246422:web:137c8b5cf599e6
734dd5f7",
// Import the necessary Firebase
functions measurementId: "G-DPPCXVN3HD"

import { initializeApp } from };

"https://www.gstatic.com/firebasejs/10.1 const app =
2.2/firebase-app.js";
initializeApp(firebaseConfig);
import { getStorage, ref as sRef,
const storage = getStorage(app);
uploadBytesResumable,
getDownloadURL } from const firestore = getFirestore();
"https://www.gstatic.com/firebasejs/10.1
2.2/firebase-storage.js"; const auth = getAuth(app);

import { getFirestore, doc, setDoc } from const uploader =

"https://www.gstatic.com/firebasejs/10.1 document.getElementById('uploader');
2.1/firebase-firestore.js"; const fileInput =
import { getAuth, signOut } from document.getElementById('fileInput');
"https://www.gstatic.com/firebasejs/10.1 const titleInput =
2.2/firebase-auth.js"; document.getElementById('forTitle');
const firebaseConfig = { const yearInput =
document.getElementById('forYear');
 157
TAGUIG CITY UNIVERSITY
const authorInput = const author =
document.getElementById('forAuthor'); authorInput.value.trim();

const abstractInput = const abstract =

document.getElementById('forAbstract'); abstractInput.value.trim();

const selectedFileLabel = if (!title || !year || !author || !abstract) {

document.getElementById('selectedFileL
abel'); alert('Please fill out all the fields.');

let selectedFile = null; return;

document.getElementById('selectFileBtn' }
).addEventListener('click', () => { const storageRef = sRef(storage, 'pdf/'
selectedFile = fileInput.files[0]; + selectedFile.name);

if (selectedFile) { const uploadTask =

uploadBytesResumable(storageRef,
selectedFileLabel.textContent = selectedFile);
`Selected file: ${selectedFile.name}`;
uploadTask.on('state_changed',
$('#uploadModal').modal('hide');
(snapshot) => {
} else {
const percentage =
alert('Please select a file.'); (snapshot.bytesTransferred /
snapshot.totalBytes) * 100;
}
uploader.value = percentage;
});

document.getElementById('uploadButton
').addEventListener('click', () => { },

if (!selectedFile) { (error) => {

alert('Please select a file first.'); console.error('Upload failed:',

error);
return;
},
}
() => {
const title = titleInput.value.trim();
getDownloadURL(uploadTask.sn
const year = yearInput.value.trim();
 158
TAGUIG CITY UNIVERSITY
apshot.ref).then((downloadURL) => {

const fileMetadata = {

title: title,

year: year,

author: author,

abstract: abstract,

name: selectedFile.name,

url: downloadURL,

uploadedBy: 'Unknown',

timestamp: new Date()

};

const docRef = doc(firestore,

'files', selectedFile.name);

setDoc(docRef,
fileMetadata).then(() => {

alert('File and metadata

uploaded successfully!');

}).catch((error) => {

console.error('Error saving
file metadata to Firestore:', error);

});

});

);

});
 160
TAGUIG CITY UNIVERSITY
Appendix E – Certification of Grammarian
 161
TAGUIG CITY UNIVERSITY
Appendix F – Plagiarism Report

OVERALL RESULT

The overall plagiarism report shows that 3% of this thesis paper matches some

sources on the web.

 162
TAGUIG CITY UNIVERSITY
Appendix G – Pre-Defense and Final Defense
 163
TAGUIG CITY UNIVERSITY
 164
TAGUIG CITY UNIVERSITY
CURRICULUM VITAE
 165
TAGUIG CITY UNIVERSITY
 166
TAGUIG CITY UNIVERSITY
 167
TAGUIG CITY UNIVERSITY
 168
TAGUIG CITY UNIVERSITY
CERTIFICATE OF ENROLLMENT
 169
TAGUIG CITY UNIVERSITY