Ministry of Higher Education

Sulaimany Polytechnic University (SPU)

Technical College of Informatics

Online College Management System

A report submitted to the department of (Technical College of Informatics), SPU

University in partial fulfillment of the requirements for the degree of Bachelor’s
in (Information Technology).

By
Ako Omer Mahmood
Rabar Atta Abdulkareem

Supervised by:
Mr. Brwa Jalal

2018
Attestation
All sentences or passages quoted in this dissertation from other people's work have been
specifically acknowledged by clear cross-referencing to author, work and page(s). Any
illustrations which are not the work of the author of this dissertation have been used with the
explicit permission of the originator (where possible) and are specifically acknowledged. I
understand that failure to do these amounts to plagiarism and will be considered grounds for
failure in this dissertation and the degree examination as a whole.

Your Name:
Signature: __________
Dedication
This is dedicated to our lovely parents who they were with us until now passing through all
the hardness and normal times in our entire life of studying. And it is dedicated to our great
teachers that they were with us helping us learn new things new information and gaining some
much useful knowledge building our ideas to create great works with these ideas. It is also
dedicated to our great friends that they helped us in this process even with a single word
encouraging us to develop the project ,or even with smile that made us get here , especially
those who believed in us and relied on us. We want to thank all the classmates of ours and all
the teachers again.
Acknowledgements
First and foremost, I would like to thank God Almighty for giving me the strength,
knowledge, ability and opportunity to undertake this research study and to persevere
and complete it satisfactorily. Without his blessings, this achievement would not be
nowhere possible and be done perfectly.I would like to express my special thanks of
gratitude to my supervisor (Mr.Brwa) and also as the head of Information Technology
Department who gave us the golden opportunity to do this wonderful project on the topic
(Online CMS), which also helped us in doing a lot of Research and I came to know about so
many new things I am really thankful to her.
Abstract

It’s too hard to get lectures by flash memory every day ,or getting a social media notification
Every hour about lectures which conflicted with family, friend ,or work events all time ,and
the managerial section also need to warning there students in case of any changes in class
room or lectures , so an education society is needed to solve this problem that’s what make
any one think about Online College Management System (Online CMS). Online College
Management System (Online CMS) is a web based social media that makes a connection
between students ,teachers ,and manager staff ,that make them able to communicate in a form
of (Posting ,Commenting on posts , Messaging , Viewing class room, and Getting lectures by
(video ,audio ,and pdf) ) which each has been managed by(University-College-Department-
Stage) ,each user has it’s account and can manage it ,that’s make both sides (Teachers and
Students) to keep the wasted time [1] which is the point….
List of contents
List of contents...........................................................................................................................vi
List of Figures..........................................................................................................................viii
List of Table...............................................................................................................................ix
Methodology...............................................................................................................................1
Spiral Model................................................................................................................................2
Chapter One................................................................................................................................4
Introduction.................................................................................................................................4
Introduction.............................................................................................................................5
1.1 General Introduction.........................................................................................................5
1.2 History and Related Work................................................................................................5
1.2.1 PHP (Hypertext Preprocessor):..................................................................................5
1.2.2 MYSQL (Structured Query Language):....................................................................6
1.2.3 Introduction to HTML:..............................................................................................6
1.2.4 Introduction to CSS:..................................................................................................6
1.2.5 Introduction to JS (Java Script):................................................................................6
1.2.6 AJAX(Asynchronous JavaScript And XML):...........................................................7
1.2.7 Data Table:.................................................................................................................7
1.2.8 Bootstrap:...................................................................................................................7
1.3 Project Aims and Objectives.............................................................................................8
1.4 Project Layout:..................................................................................................................8
Chapter Two................................................................................................................................9
Theoretical Background..............................................................................................................9
2.1 Project Analysis..............................................................................................................10
2.1.1 project description....................................................................................................10
2.2 Project design:.................................................................................................................11
2.2.1 Introduction to UML (Unified Modeling Language):.............................................11
2.2.2 Two types of UML used:.........................................................................................12
2.2.3 Project diagrams.......................................................................................................12
Chapter Three............................................................................................................................23
Practical Work and Results.......................................................................................................23
3.0 Introduction.....................................................................................................................24
3.1 Project plan.....................................................................................................................24
3.1.1 Title of project:........................................................................................................24
3.1.2 Time Table:..............................................................................................................24
3.1.3 Project Staff:............................................................................................................24
3.2 Requirements..................................................................................................................25
3.2 .1 Hardware Requirements:........................................................................................25
 3.2 .2 Software Requirements:..........................................................................................25
3.3 Test Results.................................................................................................................26
3.3.1 Software Testing......................................................................................................26
3.4 Practical Work............................................................................................................27
Chapter Four.............................................................................................................................42
4.1 Discussion :.....................................................................................................................43
4.2 Conclusion:.....................................................................................................................43
4.3 Future Work:...................................................................................................................44
List of Figures

Figure 1. 1 Spiral methodology used for Online CMS......................................................................................2Y

Figure 2. 1 Use Case Diagram : Admin...............................................................................................................13
Figure 2. 2 Use Case Diagram : Teacher.............................................................................................................14
Figure 2. 3 Use Case Diagram : Student.............................................................................................................15
Figure 2. 4 Activity Diagram : Admin.................................................................................................................16
Figure 2. 5 Activity Diagram : Teacher..............................................................................................................17
Figure 2. 6 Activity Diagram : Student...............................................................................................................18
Figure 2. 7 Class Diagram Online CMS..............................................................................................................19
Figure 2. 8 Sequence Diagram : Admin..............................................................................................................20
Figure 2. 9 Sequence Diagram : Teacher............................................................................................................21
Figure 2. 10 Sequence Diagram : Student.............................................................................................................2
Figure 3. 2 ER-Diagram of Online CMS.............................................................................................................26
Figure 3. 3 MySql Database.................................................................................................................................27
Figure 3. 4 Admin Login/Logout.........................................................................................................................28
Figure 3. 5 Admin Dashboard/View....................................................................................................................29
Figure 3. 6 Admin : Users.....................................................................................................................................30
Figure 3. 7 Admin : Add User..............................................................................................................................31
Figure 3. 8 Admin : Selecting Education............................................................................................................31
Figure 3. 9 Admin : Pages.....................................................................................................................................33
Figure 3. 10 Page Members..................................................................................................................................34
Figure 3. 11 Admin : Classroom Schedule..........................................................................................................35
Figure 3. 12 User : Home Page.............................................................................................................................36
Figure 3. 13 User : My Profile..............................................................................................................................37
Figure 3. 14 User : My Profile (About Page)......................................................................................................37
Figure 3. 15 User : My Profile (Photos & Vidnnneos).......................................................................................38
Figure 3. 16 User : Message..................................................................................................................................39
Figure 3. 17 User : My Classroom.......................................................................................................................40
Figure 3. 18 User : Classroom Schedule..............................................................................................................40
Figure 3. 19 User : Lectures.................................................................................................................................41
Figure 3. 20 User : Add Lectures.........................................................................................................................41
List of Table
Table 3.1 Time table .............................................................................................................................................27
Table 3.2 Project Staff..........................................................................................................................................27
Methodology
What Is a Methodology?
Development methodology is the formal ways or step by step process that is used to
determine the structure, and plan of development process of an information system [2].

Spiral methodology SDLC (Software Development Life Cycle):

The Spiral Model is a risk-driven approach  that provides a framework for guiding the
software process. In this software development methodology, developers start on a small scale
then explores the risks involved in the project, makes a plan to handle the risks, and finally
decides whether to take the next step of the project to do the next iteration of the spiral [3].

Why we use Spiral Model?

 Our project is large and complex.
 Any changes may require at any time.
 May our project changes from low risk to high risk.

Advantages :
 Avoidance of possible risk.
 Spiral is better for large and complex projects.
 More functionality can be added any time.
 Software is produced early in the software life cycle.
 It is more convenient for high-risk projects [5].
 Spiral Model

Figure 1. 1 Spiral methodology used for Online CMS [4]

Spiral Model Phases Activities performed during phase

Planning  It includes estimating the cost, schedule and

resources for the iteration.

Risk Analysis  Identification of potential risk is done while risk

mitigation strategy is planned and finalized

2
Engineering  It includes testing, coding and deploying software at
the customer site

Evaluation  Evaluation of software by the customer. Also, includes

identifying and monitoring risks such as schedule
slippage and cost overrun

3
Chapter One
Introduction

4
 Introduction

1.1 General Introduction

Today all of our college students should Communicate and exchange their data or resources in
order to help each other and making more familiar with themselves ,Online CMS is main
reason to provide they are needed which it’s a simply online web interface that provide
teachers and students a social connectivity between them. Mostly students not understood the
lectures totally, they able to review the lecture on a document file or a record file that
uploaded to the classroom of their department, this classroom serves a lot to the students.
Classroom contains all students and teachers that enrolls into a stage of a department. So by
using online CMS any revulsion change can be informed to all staffs and students either by
messaging or posting. Each user has an account and can update or change it’s info, and all of
them can make posts and message each other, Teacher and admin has another permission
which is updating class room and uploading audio, video ,pdf about lectures. Admin can
review all data in this system.

1.2 History and Related Work

1.2.1 PHP (Hypertext Preprocessor):
PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source
[6] [10]
general-purpose , it was in use at more than 200,000,000 domains in the world , With
PHP, it’s a simple matter to embed dynamic activity in web pages. When you give pages
the .php extension, they have instant access to the scripting language. The point is that with
PHP, web developers have a scripting language that, although not as fast as compiling your
code in C or a similar language, is incredibly speedy and also integrates seamlessly with
HTML. Using PHP, you have unlimited control over your web server. Whether you need to
modify HTML on the fly, process a credit card, add user details to a database, or fetch
information from a third-party website, you can do it all from within the same PHP files in
which the HTML itself resides [14].

5
1.2.2 MYSQL (Structured Query Language):
MySQL, the most popular Open Source SQL database management system, is developed,
distributed, and supported by Oracle Corporation. MySQL is written in C and C++ and is
compatible with all major operating systems.It provides fast and secure database engine ,that
makes facebook company use it. MySQL was open source released in 1995. It was originally
produced under the GNU General Public License, in which source code is made freely
available [14].

1.2.3 Introduction to HTML:

• HTML is the standard markup language for creating Web pages.
• HTML stands for Hyper Text Markup Language.
• HTML describes the structure of Web pages using markup.
• HTML elements are the building blocks of HTML pages.
• HTML elements are represented by tags.
• HTML tags label pieces of content such as "heading", "paragraph", "table", and so
on.
• Browsers do not display the HTML tags, but use them to render the content of the
page [13].

1.2.4 Introduction to CSS:

• CSS stands for Cascading Style Sheets.
• CSS describes how HTML elements are to be displayed on screen, paper, or in other
media.
• CSS saves a lot of work. It can control the layout of multiple web pages all at once.
• External stylesheets are stored in CSS files [13].

1.2.5 Introduction to JS (Java Script):

JavaScript is a cross-platform, object-oriented scripting language used to make webpages
interactive [13], It was originally developed to offer dynamic control over the various elements
within an HTML document, and that is still its main use. But more and more it is the power
behind dynamic web pages that change in front of your eyes rather than when a new page is

6
returned by the server. It provides a means for dynamic user interaction such as checking
email address validity in input forms [14].

1.2.6 AJAX(Asynchronous JavaScript And XML):
AJAX is a combination between XML and JavaScript, simply it is not a programming
[13]
language , In simple terms, means using a set of methods built into JavaScript to transfer
data between the browser and a server in the background. Using Ajax not only substantially
reduces the amount of data that must be sent back and forth, it also makes web pages
seamlessly dynamic—allowing them to behave more like self-contained applications. The
results are a much improved user interface and better responsiveness. It is used to read data
from a web server after a web page has loaded, update a web page without reloading the page
and send data to a web server in the background [14].

1.2.7 Data Table:

DataTables has a many options which can be used to configure to display the data in the table,
and how it processes that data. DataTables has two different modes of processing data
(ordering, searching, etc. of data) Client-side processing and Server-side processing . The
main data source used for a DataTable must always be an array , there are three basic sources
for the data that DataTables will display in the table DOM, JavaScript and AJAX [8].

1.2.8 Bootstrap:
Bootstrap is a free front-end framework for eficient web development. Bootstrap includes
HTML and CSS based design templates for designing a responsive web site that is compatible
with all kind of different screens [9]. Why use bootstrap [15]:
 Mobile first approach: Bootstrap 3 framework consists of Mobile first styles
throughout the entire library instead of them in separate files.
 Browser Support: It is supported by all popular browsers.
 Easy to get started: With just the knowledge of HTML and CSS anyone can get started
with Bootstrap. Also the Bootstrap official site has a good documentation.
 Responsive design: Bootstrap's responsive CSS adjusts to Desktops, Tablets and
Mobiles.
7
1.3 Project Aims and Objectives
The main aim of developing Online College Management System (Online CMS) is to provide
an easy and efficient way for college members to communicate like a social media but with
more requirements and features which are dedicated to the students, and make accessing for
college resource available anywhere and anytime. This system is developed to help students
find information and getting lectures as soon as they are released from the teacher. Our
another aim of this system is to produce more tutorials and topics and uploading them on to
the website, so any student could get this tutorial which they are looking for.

1.4 Project Layout:

Chapter1: summary, resource used and the goal.
Chapter2: diagrams and theoretical background.
Chapter3: planning, requirements and practical works.
Chapter4: evaluation and what features will be added in future.

8
Chapter Two
Theoretical Background

9
2.1 Project Analysis
2.1.1 project description
Online CMS contains three users which are:
 Admin
 Teacher
 Student
The core functionalities that are to be included in the system are the follows:-
Admin:
• Can insert, update and delete students.
• Can insert, update and delete class-room and it’s schedule.
• Can insert, update and delete pages.
• View all data and system reports[ CITATION Aba10 \l 1033 ].
Student:
• Can make posts.
• Can communicate by messaging.
• Can give comments to other’s post.
• Can view class-room and it’s content (lectures.pdf, video and audio).
Teacher:
• Can make posts.
• Can communicate by messaging.
• Can give comments to other’s post.
• Can upload lectures or update it’s content (lectures.pdf, video and audio).

10
2.2 Project design:

Software design is a process of translating requirements in order to make developing a

software easier. The design is essential to make a good, fully represented, less risky
project with high level of base knowledges, and make an hieratical architecture for
project, it works directly with data, requirements, business needs, produce a unique
product.

2.2.1 Introduction to UML (Unified Modeling Language):

Modeling is a way for operating on software engineering and knowledge
representation. At the same time, the objectives of these two domains are not the same and
both are required when dealing with modeling intensive structured and complex systems. To
show the complexity of the systems, so we try to model and explain them. Thus, the
proposition of this paper is to present the use of UML (for Unified Modeling Language) as a
mixture of both approaches. We first describe separately the top advances made in the
software engineering as well as in the knowledge representation community. it results in very
different as we expected before, although related concepts. This difference is due to the focus
taken by these communities. The first community is centered on building software systems,
and the second one on describing points of view on the reality. UML has two types
Behavioral modelling (describes the interaction in the system) and Structural modelling
(display the static features in the system). From the analysis of the differences and
similarities, we show how UML is used for modeling this system [12].

11
2.2.2 Two types of UML used:

2.2.2.1 Structural Modelling:

Structural modeling captures the static features of a system. They consist of the followings
[5]
:
 Class diagrams
 Object diagrams
 Deployment diagrams
 Package diagrams
 Component diagram

2.2.2.2 Behavioral modelling:

Behavioral model describes the interaction in the system. It represents the interaction among
the structural diagrams. Behavioral modeling shows the dynamic nature of the system. They
consist of the following [5]:
 Activity diagrams
 Interaction diagrams
 Use case diagrams

2.2.3 Project diagrams

In this system several UML diagrams are used, including both types of UML, which are:
 Use Case Diagram
 Activity Diagram
 Sequence Diagram
 Class Diagram
 ER Diagram

12
2.2.3.1 USE case diagram

Use case diagram made up from use cases (Activities) and actors and shows the Interaction
between them. A use case is one function of the system that is to be performed by any of
specific user. An actor is a user of the system, it can be a normal user or another system [16].

Use Case Diagram : Admin

Figure 2. 1 Use Case Diagram : Admin

Admin could login to the admin interface directly from the host or remotely, and performing
important operations on the system including (add/remove/update users ,same thing to pages
and classrooms). Admin being able to change subjects of the schedule (Time Table) inside the
classroom but only to the place and time of them, we will focus on it at later pages.
13
 Use Case Diagram : Teacher

Figure 2. 2 Use Case Diagram : Teacher

Teacher is a kind of users, within more than selected permissions given to the other users such
as (Students). Teacher could login to the system, classroom is being managed by teacher, so
long as the teacher have manager permission on the classroom. Terms (read/write) is used to
give permission to any users, read is mean to have only viewing and getting info of that
section, but write is mean to have full permission, so read/write are means user could do
operations with both above. The classroom not managed by every teacher, rather the teacher
should be given the permission on that section. Also lectures of each subject will be uploaded
or edited by the specified teacher of that subject. Teacher is being able to post or comment in
the classroom and pages.
14
 Use Case Diagram : Student

Figure 2. 3 Use Case Diagram : Student

Student is another kind of users, but with a limited given permissions, as like teachers they
will login to the system, just after logged into the system, Student will be redirected to the
classroom which he/she was a member of it. This classroom only could be view by the
students, such as viewing posts, but also can like and comment to the posts. The schedule of
student’s department is installed inside the classroom, thus help students see their schedule,
also lectures resides on each of the subjects, but only will be downloaded by the students.

15
2.2.3.2 Activity Diagram
Activity diagram used to describe dynamic view of the system. It is a flow chart to show the
process from start to end. Each activity is a function of the system. The link steps can be
sequential, branched or concurrent [16].

Activity Diagram: Admin

Figure 2. 4 Activity Diagram : Admin

16
 Activity Diagram: Teacher

Figure 2. 5 Activity Diagram : Teacher

17
 Activity Diagram: Student

Figure 2. 6 Activity Diagram : Student

18
2.2.3.3 Class Diagram
Class diagram is a static representation of the system. Class diagram is used for simplify and
explain the system to be easily transformed into executable code of the software. It mostly
used for mapping object oriented [16].

Class Diagram Online CMS

Figure 2. 7 Class Diagram Online CMS

19
2.2.3.4 Sequence Diagram
Sequence diagram is used to represent how users interacting for any expected situation, and
sequence diagram is setting actions based on time ascending, the operation starts from top of
the diagram to the bottom of it, and has a message and replay to the user.

Sequence Diagram: Admin

Figure 2. 8 Sequence Diagram : Admin

20
Sequence Diagram: Teacher

Figure 2. 9 Sequence Diagram : Teacher

21
Sequence Diagram: Student

Figure 2. 10 Sequence Diagram : Student

22
 Chapter Three
Practical Work and Results

23
3.0 Introduction
In this chapter discuss all the work that were done to complete this project, It made up of a
Website Interface, Which the Admin Interface consist of 13 page (Login ,Dashboard, Users ,
Add User ,Edit User, Pages, Add Page ,Edit Page ,Classrooms, Add Classroom, Edit
Classroom, Schedule Management, Lectures Management) ,Web Interface For User consist of
(Login, Home, My Profile(Timeline), My Profile(About) , My Profile(Friends), My
Profile(Photos & Videos), My Classroom, Classroom Schedule, Classroom Lectures,
Notifications, Messenger) The implementation phase is the last part of building any project.

3.1 Project plan

3.1.1 Title of project:
Online College Management System.

3.1.2 Time Table:

Table 3.1 Time table

Task Name Duration

Design 7 week
Implementation 5 week
Maintenance 6 week
Test 1 weeks
Questionnaire 1 week

3.1.3 Project Staff:

Table 3.2 Project Staff

Series Staff
1 Ako Omer
2 Rabar Ata

24
3.2 Requirements
To run this project on various platforms we need some hardware and software to support this
project.

3.2 .1 Hardware Requirements:

 Processor: Core i3 or higher
 RAM: 3 GB
 Storage: 60 GB for Admin Interface, 7 GB for User Interface

3.2 .2 Software Requirements:

 Technologies: Html, Css, Bootstrap 4, JavaScript, JQuery,Ajax,DataTables
 Database: MySql
 Language: PHP
 IDE: Visual Studio Code, Xampp 3.2.2

25
3.3 Test Results

3.3.1 Software Testing

Software testing is a critical element of software quality assurance and represents the
ultimate reuse of specification. Design and code testing represents interesting anomaly
for the software during earlier definition and development phase, it was attempted to
build software from an abstract concept to tangible implementation. The testing phase
involves, testing of the development of the system .using various techniques such as
White Box Testing, Control Structure Testing [16].

26
 Figure 3. 1 ER-Diagram of Online CMS

3.4 Practical Work

In the beginning, How the project is used, then all other part of the project will be discussed in
details with how are used:
Preparing Database:
First the database have to be created, which it’s necessary for the project, Includes following
tables:

Figure 3. 2 MySql Database

The System should be connected to the database in order to make it accessible automatically,
whenever there are new records such as (users, classrooms, pages) or editing any of them it
makes it easy and possible to manage them. It’s not matter if there are a lot or few tables in
the database, rather it’s matter to make it efficient and fast as it will be. Most of tables are
connected by the foreign key (relationships), for example (users) table has a field named
education_id, this education_id is a foreign key connected with id of education table,
whenever each user added to the system, his/her education_id will be set to the id of education
table, and if the education of user changes then programmatically it will match the same
education inside the education table, then set’s to that id which it was matched with, although
if the modified education not exist inside the education table then it will create new one inside
of it.

27
28
Admin:

1. Admin: Login/Logout
This page checks for the Admin information with full validation.

Figure 3. 3 Admin Login/Logout

Admin will be login to the admin interface by entering the correct username (or email) and
password, and as it is mentioned above the two inputs are connected to a database table and it
is auto checked for recognizing the user inputs. Looking for the right user and pass on the
users table. Admin will be able to recover his/her password if taking the admin information is
checked with the credential, then entering new password with encrypting it.

Here is code used for login operation

$sql = "SELECT ad_id,ad_firstname,ad_lastname,ad_email,ad_password from admins
where ad_email='$user' and ad_password='$pass' ";
$run = mysqli_query($conn ,$sql);
if($row = mysqli_fetch_assoc($run))
{
setcookie("admin_id",$row['ad_id'],time()+1*3600);
setcookie("admin_name",$user,time()+1*3600);
setcookie("admin_name_full",$row['ad_firstname']." ".
$row['ad_lastname'],time()+1*3600);
setcookie("admin_pass",$pass,time()+1*3600);
header("Location:index.php");
}

29
2. Admin: Dashboard/View
Administrator could estimate how many users are using this website and how many of them
are active now.

Figure 3. 4 Admin Dashboard/View

The admin is first redirected to this page, including total users and most user actives. All
admin interface will be displayed to the admin to make it easy management and navigation,
and for making it fast operations on the system all web pages are programmed with JQuery
that make pages not reloaded when any of them opening.

Code for performing JQuery on it

if(s=="Dashboard") {
$('.content_here').load("contents/dashboard.php");
}
else
if(s=="Total Management") {
$('.content_here').load("contents/management/total_management.php");
}
else
if(s=="Users") {
$('.content_here').load("contents/management/users/manage_users.php");

30
 3. Admin: Users
List of all users included in this section.

Figure 3. 5 Admin : Users

Searching for any user and sorting them by one of their attributes are performed by admin,
making users active or disactive status, also deleting user. Admin can make changes to the
users and add new ones without reloading the page as fast as it will be. A clear interface
displayed to the admin to clarify which user is active or not, and which are student or
teacher. Searching for any user could be done without reloading the section page, and for
prevent overloading on the section page, each 10 users are grouped in one section page.

A part code of this section

function yes_delete_click() {
$.ajax({
url:
"http://localhost/Admin/first_meeting/Admin/contents/management/users/user_id/
user_detect.php",
data:"userID_delete="+id_user,
success: function(data) { }
});
$(".delete_user").each(function() {
            if($(this).val().search(new RegExp(id_user,"i")) < 0) { }
            else
            {
$(this).parent().parent().remove();
}}); }
31
4. Admin: Add User
In this section users will be added by admin.

Figure 3. 6 Admin : Add User

Users will be added by the admin, and each user inserted as new record inside the (users)
table in the database.

Selecting Education:
Education is a table inside the database, which it will holds all colleges, each education has a
university with associated college and department and stage. For example (IT 4) education,
this defines the education of IT stage 4 from Informatic College in the Sulaimany Polotechnic
University, as mentioned below:

Figure 3. 7 Admin : Selecting Education

32
Education table is being used with this section, this table will define a user’s education, when
a new user is added to the database then it creates a new education that it has been selected in
the web page, but when a new user has same education in the education table, then user’s
(education_id) will set to that same education id in order to prevent data redundancy and
making it automatically organizing without admin interference.

Code for both user details and education

$insertEduSql = "INSERT INTO education
(edu_city,edu_university,edu_college,edu_department,edu_stage,edu_role_in_coll
ege) VALUES
('$cityEdu','$uniEdu','$collegeEdu','$depEdu','$stageEdu','$roleEdu')";
$run_insertEduSql = mysqli_query($conn ,$insertEduSql);
if($run_insertEduSql) {
}

$eduLastId = "SELECT edu_id FROM `education` order by edu_id desc limit 1";
$run_eduLastId = mysqli_query($conn ,$eduLastId);
$rowLID = mysqli_fetch_assoc($run_eduLastId);
$eduNew = $rowLID['edu_id'];
$updateSql = "INSERT INTO users
(u_firstname,u_lastname,u_gender,u_age,u_birthdate,u_location,u_phone_num,u_ed
u_id,u_permission_code,u_email,u_password,u_role,u_profile_pic,u_cover_pic)
VALUES('$firstName','$lastName','$gender','$age','$dateBirth','$location','$ph
one','$eduNew','$permission','$email','$password','$roleEdu','$profilePic','$c
overPic') ";
}

$run_UpdateSql = mysqli_query($conn ,$updateSql);

33
5. Admin: Pages
In this section admin can create pages.

Figure 3. 8 Admin : Pages

Pages will be created within selecting the admin of page. The admin of page is a user which
he/she had to be registered in the system, thus admin of page will be retrieved to be selected
when creating a new page. Retrieving the admin is robust, because first of all the education of
admin have to be selected, then system will retrieve all users member of this selected
education, so you can then select any of them to be admin of the page.

Code for selecting admin

$("#role_in_collegeSelect").on("change",function() {
city_sel=$("#citySelect").val();
univ_sel=$("#universitySelect").val();
college_sel=$("#collegeSelect").val();
dep_sel=$("#departmentSelect").val();
role_sel=$("#role_in_collegeSelect").val();
$.ajax({
url:
"http://localhost/Admin/first_meeting/Admin/contents/management/pages/page_id/
page_add.php",
type: "post",
data:"city_sel="+city_sel+"&univ_sel="+univ_sel+"&college_sel="+college_
sel+"&dep_sel="+dep_sel+"&role_sel="+role_sel,
success: function(data) {
$("#admin_nameSelect option").remove();
$("#admin_nameSelect").append(data);
} }); });

34
Page Members:
Inside the page includes all page members.

Figure 3. 9 Page Members

Administrator could easily modify user’s permission (Read or Read/Write) and removing
them from the page. Each member have a field (page_id) inside users table, this filed is a
foreign key connected with id of pages table.

Code for this section

$get_page_users = "SELECT * from users where u_page_id='$pageID'";

$run_get_page_users = mysqli_query($conn ,$get_page_users);
while($row_users = mysqli_fetch_assoc($run_get_page_users)) {
$userPic = $row_users['u_profile_pic'];
$userName = $row_users['u_firstname']." ".$row_users['u_lastname'];
$userPermission = "Read";
if($row_users['u_page_permission'] == 1) {
$userPermission = "Read/Write";
}
$userJoined = $row_users['u_page_date_joined'];
}

35
6. Admin: Classroom Schedule
Schedule of classroom will be created by admin in this section.

Figure 3. 10 Admin : Classroom Schedule

First the administrator should prepare the schedule for the classroom in this section just after
the classroom is created. A classroom is just like a department with it’s stage that holds all
students of this department with specified stage. Only administrator has permission to modify
time of the lectures, and place any subject to which day of week.

The following code will describes a part of the schedule including organize time and day of
subjects

$check_same_time = "SELECT * from subjects WHERE sub_day_on='$day_in' and

sub_time_on='$time_in' and sub_schedule_id='$schedule_id' ";
$run_check_same_time = mysqli_query($conn ,$check_same_time);
if($rowSame = mysqli_fetch_assoc($run_check_same_time)) {
$sub_id = $rowSame['sub_id'];
$alter_subject = "UPDATE subjects SET
sub_name='$lec',sub_lecturer_name='$lecr',sub_assisstant_lecturer_name='$asiss
' WHERE sub_id='$sub_id' ";
$run_alter_subject = mysqli_query($conn ,$alter_subject);
}

36
User: (Teacher & Student)

This section will describes user interface including both student and teacher.

1. User: Home Pgae

When user logged in to the website, he/she will be redirected to this home page.

Figure 3. 11 User : Home Page

User (Teacher or Student) can view all the posts and make posts. Posting could be in their
profile account or in the pages. Users can modify their post and tag friends to their post, also
like or comment on the posts. Navigation bar holds (Notifications, Messages, Search Engine,
Home Page, Classroom, My Account, Language). A panel including list of active friends will
be appearing at the right of web page, so user could see who is active now and by one click at
any of them will be redirected to the message’s section.

37
2. User: My Profile
Each user has an account.

Figure 3. 12 User : My Profile

In this section users will be able to modify their personal information also posting in their
profile, But education information could not be modified by user. User can add & remove
friends.

3. User: My Profile (About Page)

Users’ account will be modified in this section.

Figure 3. 13 User : My Profile (About Page)

All personal information of user is being appeared there, and users could change any of them.
38
4. User: My Profile (Photos & Videos)
Includes all photos and videos uploaded by current user.

Figure 3. 14 User : My Profile (Photos & Videos)

When user opens this section, all of the recent photos and videos will be appear inside the
web page, for clarify the date of uploaded photos/videos there have a date header above list of
the posts uploaded at this date. User will be able to open each post (photo/video) and delete or
edit any of them. Photos and videos are grouped in separate sections, by clicking on videos
menu button, then all video will be retrieved inside the web page.

39
5. User: Chat Messages
Users will send and receive messages to each other.

Figure 3. 15 User :Chat Message

Each user has a Chat Message interface dedicated for chatting with friends. List of all friends
will appear at the left of chat message page, and user could chat with each friend at the
remaining section of page. Any friend could be blocked by the current user. For making it
fast reachable of messages and fast arrival of opposite friend the chat message page all
programmed with Ajax, as soon as the opposite friends sent a message it will instantly
appear inside the content, this will prevent of boring user waiting.

40
6. User: My Classroom
Classroom of each user appears here.

Figure 3. 16 User : My Classroom

Classroom is just like a department with a specified stage. Users will post to their classroom
and can view & like & comment on the posts. Only Teacher have admin permission on the
classroom, which it will be managed by this admin. This classroom is registered to only one
department with it’s stage, for example./IT 4th Stage.

Classroom Schedule:
Schedule contains all lectures of the week.

Figure 3. 17 User : Classroom Schedule

Teacher could delete or edit posts inside the classroom and organizing it
41
Lectures:
Section of lectures of the subjects.

Figure 3. 18 User : Lectures

When Teacher click on (on me) at the schedule section, this modal appears which contains all
lectures uploaded either by PDF or Record.

Each teacher which is associated to his/her subject could upload lectures on it’s subject
mentioned below:

Figure 3. 19 User : Add Lectures

Teacher can view & upload lectures, but students could only view & download the lectures.
Or easily getting these lectures, a search section is created at the top of the modal, which you
can sort lectures by their date uploaded or entering name of the lectures or subjects. And
teacher could delete or edit only the lectures which uploaded by him/her.
42
Chapter Four
Discussion and Future Work

43
4.1 Discussion :
Usually students, teachers and college staff are using direct attach or communicate by email,
Facebook, etc. to get last news about exams, lectures and scheduling or making questions
between teachers and students, and this way is wasting time, sometimes money (for direct
attach). In this system we bring in Online College Management System (Online CMS), a web-
based application that gently makes that communication easier for both students and teachers,
which is the point of this project to provide that communication through a formal, qualified
and liability manner. Both students and teachers can make posts, making comment on posts
and communicate by messaging. And the most important part of this project is Class-room,
that provides fast and confident source for lectures scheduling and lectures by (pdf, video,
recorded audio), which managed by admin and teachers can adding resource to it, it is a way
to replay the lectures for those who weren’t in the class at time. It is the deferent point
between this project and others.

4.2 Conclusion:
Online College Management System (Online CMS) is a project which is a web-based
application that gently makes that communication easier between the both students and
teachers, and developed to make a traditional system of communication in colleges disappear
forever by an efficient and manageable system, and avoid importuning teacher by student
while using direct attach for getting lectures or repeating lectures.

44
4.3 Future Work:
To perform our project on many universities or institutes, we should make the project
working efficiently and compatible with them, so we have to add more features to this project
and improving the performance of the system, we have some future works on this project:

1. One login page for both User and Admin.

2. We recommend to create a messaging mobile application as a part of this project, that
it will makes it easier to communicate and message between the members of college.
3. Adding assignment section to the classroom of project.
4. Securing user password and details.
5. Adding notification feature to the system.
6. Auto reloading newly chat messages.

References:

1. Britton, B.K. and Tesser, A., 1991. Effects of time-management practices on college
grades. Journal of educational psychology, 83(3), p.405.
2. Agathangelou P., Katakis I., Kokkoras F., Ntonas K., 2014. Mining Domain-Specific
Dictionaries of Opinion Words, In 15th International Conference on Web Information
System Engineering (WISE 2014),Thessaloniki, Greece, 12-14 October, 2014.
3. Boehm, B.W., 1988. A spiral model of software development and
enhancement. Computer, (5), pp.61-72.
4. Guru99. (2016, 7 2). What is Spiral Model? When to Use? Advantages &
Disadvantages. Retrieved from www.guru99.com/: https://www.guru99.com/what-is-
spiral-model-when-to-use-advantages-disadvantages.html
5. tatvasoft. (2015, 4 15). Top 12 Software Development Methodologies & its
Advantages / Disadvantages. Retrieved from www.tatvasoft.com:
https://www.tatvasoft.com/blog/top-12-software-development-methodologies-and-its-
advantages-disadvantages/
6. Brooks, D.R., 2009. An Introduction to PHP for Scientists and Engineers: Beyond
JavaScript. Springer Science & Business Media.
45
7. Corporation, O. (2019, 1 1). MySQL 8.0 Reference Manual. Retrieved from
dev.mysql.com: https://dev.mysql.com/doc/refman/8.0/en/what-is-mysql.html
8. Ltd, S. (2007, 6 2). Data. Retrieved from datatables.net:
https://datatables.net/manual/data/
9. Efron, B. and Tibshirani, R.J., 1994. An introduction to the bootstrap. CRC press.
10. Ltd, N. (2013, 1 31). PHP just grows & grows. Retrieved from news.netcraft.com:
https://news.netcraft.com/archives/2013/01/31/php-just-grows-grows.html
11. Welling, L. and Thomson, L., 2003. PHP and MySQL Web development. Sams
Publishing.
12. Bommel, P. and Müller, J.P., 2007. An introduction to UML for modelling in the
human and social sciences.
13. MIT, E. ,. (2015 , 1 1). SEMANTIC WEB. Retrieved from www.w3.org:
https://www.w3.org/standards/semanticweb/
14. Nixon, R., 2014. Learning PHP, MySQL & JavaScript: With jQuery, CSS & HTML5.
" O'Reilly Media, Inc.".
15. J. M. Barrie 2014. Bootstrap Tutorial (PDF Version) Tutuorials Point. " O'Reilly
Media, Inc.".
16. tutorialspoint. (2019, 1 1). UML - Activity Diagrams. Retrieved from
www.tutorialspoint.com:
https://www.tutorialspoint.com/uml/uml_activity_diagram.htm

46