This repository contains frontend codes of the web application.

This UI created using ReactJS and it use some API requests to communicate with backend.

First version of this project is created using HTML, CSS & JS which is available here

Backend Code is created using Java. It use genetic algorithm to create a time table and uses a Browser Compoent to show the UI.

Bowser Component code is avaliable here Backend codes is available here

How to set up the project (without any released version of this app)?

Step 1: First Fork this repositories:
Time-Table-Creator-ReactJS (UI)
TTSBrowserComponent (Browser Component)
TimeTableScheduler-Backend (Bankend Java Code)

Step 2: Then use Intellij IDEA or any other framework to build a jar file of the TTSBrowserComponent.

Step 3: Then copy the jar file of TTSBrowserComponent to Forked TimeTableScheduler-Backend's main directory.

Step 4: Now open forked Time-Table-Creator-ReactJS and build the product using command like npm run build

Step 5: Then Copy the build product to TimeTableScheduler-Backend's web directory. (If web directory is not present in TimeTableScheduler-Backend then create one)

Step 6: Now you just need to run the TimeTableScheduler-Backend's main.java file using Intellij IDEA or any code editor or framework.

How to use this UI?

First you have to add all the subjects on Subjects tab. To add a subject you need to enter all the required values:

1. Subject Name - the unique subject code or name
2. Semester - the class or semester in which the subject is taken
3. Classroom - the room no where the class will be taken (you can add multiple classroom pressing enter key after typing each classroom) (don't forget to press enter after typing the classroom)
4. Lecture Count - number of classes of that subject is need to take in a week (default value 4)
5. Subject Type - if the subject is practical or theory (default value theory)
6. Should be Taken by Teacher or Not - if subject is taken by teacher then make it yes either make it no (default value yes)

After adding all the subject next you have to add Teachers on Teachers tab. To add a teacher you need to enter all the required values:

1. Teacher Name - teacher name which is have to be a unique
2. Subjects - type all the subject names pressing enter key after typing each subject (subject must need to be present in subjects tab)
3. Available Time - when teacher is available to take classes (if you leave it blank means you did't select any time then it will be consider as teacher is available all the time)

After adding all the subjects and teachers you can generate the time table from Time Tables tab. To generate the time table click on Auto fill using AI button. Also you can manually fill the time table.

These are the Constraints that are used in our AI system to generate the time table:

Hard (Mandatory) Constraints include :

1. One practical subject class per week
2. All teachers alloted within availability
3. Subjects alloted their required no. of lectures in all sections
4. Practical subjects not allocated same room at same time
5. Two teachers not teaching a semester-section same subject (theory only)
6. Two teachers/subject not at a semester-section at same time (theory only)
7. Teachers only teaching one semster-section at a time
8. Practical subjects assigned consecutive periods
9. Practical teachers must be available during all practical subjects
10. All teachers assigned atleast one subject in a section class
11. All teachers get assigned subjects known to them
12. Theory teachers also teaching practical
13. Teachers count for practical class equals lecture count

Soft (Preffered) Constraints include :

1. Practical Lab in end of second half

How to use fill manually feature

1. You have to click on Fill Manually button then
2. Click on periods after that a popup will appear and
3. From there you can select the subject and teacher for that period (you can select multiple teachers but only one subject can be selected),
you can also use this feature after using the Auto fill using AI method.

After generating the time table you can use the features of Dashboard Tab from here you can see

1. The time tables for a particular teacher
2. You can see how many classes a perticular teacher is busy taking classes per day in class unit (for theory the value is 1 and for practical the value is 3).
3. You can see Total number of
   i. Subjects
   ii. Teachers
   iii. Practical Subjects
   iv. Theory Subjects
   v. Subjects (Taken By Teachers)
   vi. Subjects (Not Taken By Teachers)
   

If you want to customize time table more like defining when will be breaks for each semesters, number of periods per day, number of section per semester etc. then you can do that from Time Table Structure Tab.

Also we have included files or states by using this feature you can create multiple files of teachers, subjects & time tables you can create a new file also delete a file from Files Tab. You can open or change the files from the top left side of the page and also you can see the currently open or used file. To change a state or file you only have to select that file from the drop down.

Report a Bug

If you encounter any bug please try to contact us from the contact us tab.
In contact us tab you can find our emails and other platforms links from there you can contact us
(Please try to explain the bug in details and try to provide screenshorts)
Also there might be some cases that UI don't show data at all because of token mismatch (for data security purpose) then you can just wait 4-5 seconds then reload the page using right click,
If this did't solve the problem then try to switch between tabs or restart the application.

Some pictures to understand some react components and classname (for developers)

Classnames represented using . before the name. (Ex.: .classname)
React Component name is represented using normal manner. (Ex.: ComponentName)

React + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

• @vitejs/plugin-react uses Babel for Fast Refresh
• @vitejs/plugin-react-swc uses SWC for Fast Refresh