Bachelor in Computer Engineering Minor Project " MULTI-LEARNING PLATFORM"

National College of Engineering
(Affiliated to Tribhuvan University)
Talchhikhel, Lalitpur
[Subject Code: CT654]
A MINOR PROJECT REPORT ON
“MULTI-LEARNING PLATFORM”
Submitted by:
Sushant Gautam
A MINOR PROJECT SUBMITTED IN PARTIAL FULFILLMENT OF THE
REQUIREMENT FOR THE DEGREE OF BACHELOR IN
COMPUTER ENGINEERING
Submitted to:
Department of Computer and Electronics Engineering
August, 2018

MULTI-LEARNING PLATFORM
Submitted by:
Sushant Gautam
Supervised by:
A MINOR PROJECT SUBMITTED IN PARTIAL FULFILLMENT OF THE
REQUIREMENT FOR THE DEGREE OF BACHELOR IN
COMPUTER ENGINEERING
Submitted to:
August, 2018

i
COPYRIGHT
The author has agreed that the library, National college of Engineering, may make this report
freely available for inspection. Moreover the author has agreed that permission for extensive
copying of this project report for scholarly purpose may be granted by the lecturers, who
supervised the project works recorded herein or, in their absence, by the Head of Department
wherein the project report was done. It is understood that the recognition will be given to the
author of the report and to the Department of Computer and Electronics, NCE in any use of
the material of this project report. Copying or publication or other use of this report for
financial gain without approval of the Department and author’s written permission is
prohibited. Request for permission to copy or to make any other use of the material in this
report in whole or in part should be addressed to:
Head
Nepal

ii
ACKNOWLEDGEMENT
…………….

iii
ABSTRACT
This project “Multi-Learning Platform” specially designed for learning platform to the
engineering students of TU. This project was build in JAVA programming language.This
project main motive is to make live online training by one teacher to many students at a time.
Besides this, it contains other feature such as adding disscussion in forum, upload or
download materials (notes, videos), play video etc. It contains live video streaming with
websocket in which continuously chunk of recorded video in host computer (teacher) is send
to server and server multicast to the students who are connected in that particular session. By
websocket of JAVA and Javascript we can configure for the video tranmission with low
latency.This algorithm is named as Continous Video Chunk Rendering Algorithm. We had
introduced the concept of multicast for the live training by teacher to the group of student.
This project is very unique and choosen to solve the real time problem facing by the TU BE
Students. It is useful to the BE students where they interact with teacher and able to learn
different things in a single platform. So, it is called as “Multi-Learning Platform.”
Keywords: TCP, WebSocket, Live Video Streaming, Multicast Transmission, UDP.

iv
TABLE OF CONTENT
ABBREVATION.................................................................................................... VIII
LIST OF FIGURES ...................................................................................................IX
LIST OF TABLES ...................................................................................................... X
1 INTRODUCTION........................................................................................1
1.1 Background Study...........................................................................................1
1.2 Problem Statement ..........................................................................................1
1.3 Aims and Objectives .......................................................................................2
1.4 Significance of Study ......................................................................................2
1.5 Related Theory................................................................................................3
1.5.1 Websocket............................................................................................................. 3
1.5.2 Ways of Live Streaming ....................................................................................... 3
1.5.3 Concept of Live Multicast Video Streaming ........................................................ 4
2 LITERATURE REVIEW ...........................................................................5
2.1 Architecture for Real Time Communication over the Web............................5
2.1.1 Introduction........................................................................................................... 5
2.1.2 Related Work ........................................................................................................ 6
2.1.3 Pros and Cons of Work......................................................................................... 6
2.2 WebSockets for Live Streaming .....................................................................7
2.2.1 Introduction........................................................................................................... 7
2.2.2 Related Work ........................................................................................................ 7
2.3 HTML5 Based Media Player for Real-Time Video Surveillance...................8
2.3.1 Introduction........................................................................................................... 8
2.3.2 Related Work ........................................................................................................ 9
2.4 Multicast Video Transmission ......................................................................10
2.4.1 Introduction......................................................................................................... 10

v
2.4.2 Related Work ...................................................................................................... 10
3 METHODOLOGY ....................................................................................11
4 SYSTEM ANALYSIS................................................................................12
4.1 Product Description.......................................................................................12
4.1.1 System Block Diagram ....................................................................................... 12
4.2 System Requirement Analysis ......................................................................14
4.2.1 Functional Requirement...................................................................................... 14
4.2.2 Non-Functional Requirement.............................................................................. 15
4.2.3 System Requirement ........................................................................................... 16
4.3 Development Model......................................................................................16
4.4 Platform and Tools Used...............................................................................17
4.4.1 Web –Platform.................................................................................................... 17
4.4.2 Tools Used .......................................................................................................... 17
4.5 Feasibility Analysis.......................................................................................17
4.5.1 Operational Analysis........................................................................................... 17
4.5.2 Economic Analysis ............................................................................................. 18
4.5.3 Techinical Analysis............................................................................................. 18
4.5.4 Risk Analysis ...................................................................................................... 18
4.6 System Related Diagram...............................................................................19
4.6.1 Usecase Diagram ................................................................................................ 19
4.6.2 Sequence Diagram .............................................................................................. 20
5 SYSTEM DESIGN.....................................................................................21
5.1 Diagram.........................................................................................................21
5.1.1 ER Diagram ........................................................................................................ 21
5.1.2 Class Diagram..................................................................................................... 22
6 IMPLEMENTATION ...............................................................................23
6.1 Classes and Function Characteristics............................................................23
6.1.1 Student ................................................................................................................ 23

vi
6.1.2 Teacher................................................................................................................ 23
6.1.3 Discussion........................................................................................................... 23
6.1.4 Upload Materials................................................................................................. 24
6.1.5 Live Multicast ..................................................................................................... 24
6.1.6 Download Notes.................................................................................................. 24
6.2 Flowchart for Live Streaming .......................................................................25
6.3 Algorithm for Live Video Streaming ...........................................................26
7 TESTING....................................................................................................27
7.1 Unit Testing...................................................................................................27
7.1.1 Unit Testing of Live Video Streaming Section................................................... 27
7.1.2 Unit Testing of Chat Component........................................................................ 27
7.1.3 Unit Testing of Discussion Forum...................................................................... 28
7.1.4 Unit Testing of Upload Note Component........................................................... 28
7.1.5 Unit Testing of Download Materials .................................................................. 29
7.1.6 Unit Testing of Authentication System by Admin of every Upload Materials .. 29
7.2 Integration Testing ........................................................................................30
7.3 Performance Testing .....................................................................................30
7.4 System Testing ..............................................................................................31
8 RESULTS AND CONCLUSION .............................................................33
8.1 Outcomes.......................................................................................................33
8.1.1 Outcome for Chat................................................................................................ 33
8.1.2 Outcome for Live Video Streaming.................................................................... 33
8.1.3 Outcome for Upload ........................................................................................... 33
8.1.4 Outcome for Create Discussion .......................................................................... 33
8.2 Calculation ....................................................................................................33
8.3 Conclusion.....................................................................................................34
REFERENCES...........................................................................................................36
APPENDIX-A....................................................................................................37

viii
ABBREVATION
SQL Structured Query Language
HTML Hypertext Markup Language
TCP Transfer Control Protocol
IDE Integrated Development Environment
HTTP HyperText Transfer Protocol
IP Internet Protocol
UDP User Datagram Protocol
RTC Real Time Communication
DESC Description
RDBMS Relational Database Management System
CAPS Concurrent Access Per Second

ix
LIST OF FIGURES
Figure 1-1How Websocket Work............................................................................................. 3
Figure 1-2Concept of Multicast Streaming............................................................................... 4
Figure 2-1Architecture for Real Time Video Surviellance....................................................... 5
Figure 2-2Video Data Trasmission........................................................................................... 9
Figure 4-1System Block Diagram .......................................................................................... 12
Figure 4-2Use Case Diagram.................................................................................................. 19
Figure 4-3 Sequence Diagram for Live Video Streaming ...................................................... 20
Figure 5-1ER Diagram............................................................................................................ 21
Figure 5-2Class Diagram ........................................................................................................ 22
Figure 6-1 Flowchart for Live Video Streaming .................................................................... 25
Figure A-1Live Training Window And Live Chat Window .................................................. 37
Figure A-2Create Discussion Outcome .................................................................................. 38
Figure A-3UploadFileDemo................................................................................................... 38
Figure A -4Upload Materials Database Table Structure......................................................... 39
Figure A-5Discussion Table Structure.................................................................................... 39
Figure A -6Live training Module Sub Code........................................................................... 41

x
LIST OF TABLES
Table 7-1Unit Testing of Live Video Strreaming Section...................................................... 27
Table 7-2Unit Testing of Chat Component ............................................................................ 27
Table 7-3Unit Testing of Discussion Forum .......................................................................... 28
Table 7-4 Test Case Design for Unit Testing Of Upload Note Component........................... 29
Table 7-5Test Case for Integration Testing ............................................................................ 30
Table 7-6Test Case of Performance Testing........................................................................... 31
Table 7-7 Test Case Design for System Testing..................................................................... 32

1
1 INTRODUCTION
1.1 Background Study
Websocket can be important for the continuos data transfer [1]. It is different from HTTP
where connection is not closed once the connection is open [2]. Different real time
application such as internet game playing, live video streaming are found by websockets [1].
Mainly different servers use websockets for continuous data transfer to client such that client
should not refresh the page for data update. Large amount of data come in and go out in
websocket continously once the connection is opened [1]. Such that websocket can be useful
in live video streaming. Server can make broadcast, unicast and multicast according to the
application choice [3] with the help of WebSocket. The HTTP provides the half duplex
whereas the WebSocket provides the full duplex cummunication. The WebSockets
technology provides a bidirectional communication channel using a single TCP connection
[3].
Engineering is the wide and technical field. Only notes of teacher is not sufficient for their
guidance. So, the single platform where engineer can interact with teacher, exchange notes,
arise question and answer them found in this project.“Multi-Learning platform” should
provide the different features such that student can explore themselves in a single platform.
1.2 Problem Statement
The first existing application such as IOE Notes, Live video streaming by YouTube and
so on. Some only provides notes to download and some provides video streaming alone
which is not sufficient to solve the existing real time problem of engineer in this time
about their study. Also, there is not any better interaction of student to the teacher where
students can ask to teacher special of TU. So, it makes engineers lots of problem to
search their notes according to syllabus and explore their study in this present time.

2
To overcome, those problems, our ideas will be implement in this project. To make the
single platform where engineer can exchange notes, ask question to the teacher and
interact with them can be a challenge to us to complete this project. By this completion
and implementation of this project we hope most of the problems facing related to their
study will be solve.
1.3 Aims and Objectives
The main aim of this project is to make complete, well-functioning, attractive and useful
Multi-Learning Platform.
The general Objectives:
1. Build Live Video Streaming Section with WebSockets.
2. Build Live Chat side by side of live online Training Session.
3. Implementation of Discussion Forum.
4. Build system to Upload Materials.
5. Build system to Download Materials.
6. Build Authentication system by Admin of every upload materials.
1.4 Significance of Study
1. It is helpful for the researcher of implementing WebSocket for live Video
transmission.
2. It can be helpful for everyone to understand basic way of live video streaming.
3. It can be the great platform for the engineering student to explore individually.
4. It can be single platform to learn multiple materials at once.
5. It can be great place where the students interact with teachers, also junior students can
be guided by the senior students.
6. It can be the rarely one implementing such system for developing technology of
Nepal.
7. This project helps us to increase our knowledge, courage, skills and achieving dream
into reality.

3
1.5 Related Theory
1.5.1 Websocket
1. At first client sends the request to Server to open the Socket Connection. This is
called Handshake HTTP request.
2. Once the connection is setup then there can be Bi-Directional Message transfer on
either side since the connection remains opened and not closed.
3. If the connection is closed on either side then, the connection is closed on both side.
1.5.2 Ways of Live Streaming
There are mainly three types of live streaming:
1. UniCast:
It is the one to one communication just as one to one chat sytem.
2. BroadCast:
It is the way of transferring data to all the clients of different group either they are
connected or not. This mechanism increase server latency to transmit data to all
clients. Generally it is found in TV or Broadband radio.
Figure 1-1How Websocket Work

4
3. Multi-Cast:
It is the way of transfer data in the specific group of users connected. It is efficient
than Broadcast since, broadcast transmit data to different mulitcast group but it
transfer data to those who are connected to the particular session or group.
1.5.3 Concept of Live Multicast Video Streaming
At first Host open the session for live video Streaming. After that host send chunk of video
continuously to the server, server makes copy if necessary and check number of clients
joined on that session. Server sends to the client only who are joined on that particular
session for the live video Streaming. As, we can use Websocket (asynchronous) or AJAX
(continous pooling) for the data transger from host to server to client. In case of AJAX
continous pooling it can be efficient and also increase the network traffic but by the use of
Websocket we can perform MultiCast Live Video Streaming. Although the different
company use different technique such as HLS (HTTP Live Streaming), HDS (HTTP
Dynamic Streaming) but for our research purpose it can be suitable depends on how best we
customize and implement it.
Server Server
Makes
Copy
Client1
Client2
Client n
Figure 1-2Concept of Multicast Streaming

5
2 LITERATURE REVIEW
2.1 Architecture for Real Time Communication over the Web
2.1.1 Introduction
Figure 2-1Architecture for Real Time Video Surviellance
The WebSockets technology provides a bidirectional communication channel using a single
TCP connection. It is designed to be implemented in browsers and web-servers and its API is
being standardized by the W3C. The connections are established over the regular TCP port
80, which ensures that the system can run behind firewalls. The life-cycle of a WebSocket
session is througout the connection. At first the client, a browser that supports the
WebSockets protocol, requests to establish a WebSocket connection. The positive response
from the server denotes the start of such a WebSocket connection. The connection remains

6
open for the whole session, until any endpoint requestsits release with the specified
procedure. As a WebSocketremains active; WebSocket frames can be transferred from server
to client and vice versa with no preceding request. In this implementation the WebSockets
server also hosts the service logic part of our web-applications, which is responsible for
maintaining a listing of the client peers with active WebSockets and session management.
This application involves one streamer (who streams his camera to an audience via the web),
one or more receivers (who receive at their browsers the media stream of the streamer) and
the service logic (which orchestrates the communication).
A client peer is connected via its HTML5- and WebSockets- compatible browser to the URL
of the application. The web-page requests the user to enter the “group name” of the multicast
event he wishes to follow or to select one group name from the list of the available broadcast
events. If the user enters a group name that has not been registered previously with the web
server, the server assumes it is a new streaming event and registers the user as “streamer”.
Then, the user is asked to specify if it is a multicast or a broadcast event. In the latter, the
streamer should also specify the starting time for the stream. When the streamer submits this
info to the server the JavaScript code for the streamers runs at his browser and a WebSocket
connection to the WebSockets server is established.
2.1.2 Related Work
1. Video implementations on web applications using HTML5.
2. Demonstrate implementation of CSS that transforms the displayed video on the fly.
3. Additionally in this paper, they analyze video streaming over HTTP and discuss the
ability of peer to peer streaming.
4. Web video chatting is implemented on this research.
2.1.3 Pros and Cons of Work
Pros:
1. Fast and customizable
2. Easy to multicast transmission.
Cons: None found [1]

7
2.2 WebSockets for Live Streaming
2.2.1 Introduction
Enable Web applications to maintain bidirectional communications with server-side
processes, this specification introduces the WebSocket interface. WebSocket is a standard
web technology, which simplifies much of the complexity of bidirectional communication
and connection management between clients and a server. It maintains a constant connection
that can be used to read messages from and write messages to a server and the client at the
same time. WebSocket was introduced as part of the HTML 5 initiative defining a JavaScript
interface for browsers to use WebSocket to transfer and receive data.Here are some of the
benefits of WebSocket:
1. Full duplex client-server communication.
2. Integration with other Java EE technologies.
3. We can inject objects and Enterprise JavaBeans (EJB) by using components such as
Contexts and Dependency Injection (CDI).
4. Low-level communication (works on the underlying TCP/IP connection).
5. Low latency communication providing UDP transmission.[2]
2.2.2 Related Work
Here the the main live video streaming is done with continous image transfer as follows:
1 At first open the webcam of the user.
2 Capture the image from webcam and write it to canvas (Javascript canvas frame).
3 Read the canvas data as image (‘image/jpeg’) and convert it to Binary data.
4 Send the binary data to server as blob.
5 The steps from 1 to 4 is repeated continously in the gap of 100ms to make live video
streaming.
Pros:
1. It is easy to understand and implement.

8
2. No such complex logic is needed.
Cons:
1. Can’t transfer audio data.
2. Continously image rendering increase network traffic and arise DDOS attack
problem. [2]
2.3 HTML5 Based Media Player for Real-Time Video Surveillance
2.3.1 Introduction
By making use of the HTML5 features including WebSocket, Web Workers and Canvas, this
paper designs and implements a new media player which can play real-time video in the
HTML5 compatible browser without plug-ins. To send data from the server to the client side,
a traditional technique called “polling” is used. Every time the browser asks the web server
for the video data, the browser must establish a connection with the server. And then the
server responds by sending the data to the browser and closing the connection. So the
conventional method for transporting video data not only increases the burden of traffic on
the network, but also increases the delay time greatly. To solve the problem, the media player
uses the WebSocket protocol for bidirectional communication with a server. After the
connection is established, the HTTP protocol is upgraded to the WebSocket protocol. And
then the server can send data directly to the browser without needing to re-establish the
connection every time. Moreover, the ports adopted in the WebSocket are 80 and 443. So the
video data can pass through the firewall well. Figure 2-1 shows the transmission of the video
data from the server to the browser based on WebSocket protocol. [3]

9
Figure 2-2Video Data Trasmission
2.3.2 Related Work
1. The main of this thesis is to investigate the feasibility to provide a pluginless real-
time video experience with the usage of HTML5 and its new features with a main
focus on the Media Source Extensions API and the H.264 video format.
2. Three different approaches are presented with evaluations of how they perform in
terms of latency, bandwidth, compatibility, CPU and memory usage. Ultimately they
show that it is indeed possible for real-time streaming of H.264 using only native
browser API’s.
Pros:
1. Plugin less video Surveillance can be easy and simple to use for user.
2. H.264 video format is a standard format.
Cons:
1. The H 264 video format need special encoding and decoding units.
2. Encoding and decoding can use high memory consumption and time to accept it.[3]

10
2.4 Multicast Video Transmission
2.4.1 Introduction
Multicast is a more efficient way of broadcast. Unlike broadcast it will only send the
packages to the clients that are in the multicast group. It is like broadcast a one to many
relation.
For multicast it is necessary to have a type of spanning tree. The construction of this
spanning tree however depends if the network is sparse or dense. With dense mode the
network starts from a full broadcast, all the routers will send the packets to all other networks
and destinations. In Multicast the users who are only connected to that IP address or Session
communicates to each other for the data transmission. Multicasting is the networking
technique of delivering the same packet simultaneously to a group of clients. IP multicast
provides dynamic many-to-many connectivity between a set of senders (at least 1) and a
group of receivers. The format of IP multicast packets is identical to that of unicast packets
and is distinguished only by the use of a special class of destination address (class D IPv4
address) which denotes a specific multicast group. Since TCP supports only the unicast
mode, multicast applications must use the UDP transport protocol. Multicast can be the
unidirectional in the sense one reciever at as sender and at (least 1) are the recievers. In case
of bidirectional, two way communication exists to the group of connected clients in a
particular session. [4]
2.4.2 Related Work
1. Conference room managed on the based of multicast video streaming.
2. Live video chatting is introduced with webSocket, HTML5 video library and media
stream API.
3. User session is cocurrently joined to reduce latency. [4]

11
3 METHODOLOGY
We had seen the tutorial about Websocket in www.javatpoint.com/socket-programming and
read much detail about websocket communication and got inspire by the Live message
transfer between Server and Client.We also studied on www.websocket.org about much
details of websocket. We had first made live group chat where real time message transfer
simultaneously between clients and server.
Later on we had performed real time video transfer by the continous image transfer on
websocket with reference in [3] By this we explore idea about how to implement websocket
in Javascript as in client browser. We had seen that browser WebRTC API take video of
Webcam, we took image from that video and send to ther server continuosly to the server at a
gap of 10ms. Then, server multicast this image to group of other client who are joined in that
session. By this we can explore about the concept of live video Streaming. One of it’s main
drawback is it can’t transfer sound but for live video streaming we need both audio and
image.
After some days of continous research we refer MediaStreamRecorder [4] to record the host
(Teacher) video continously transfer to the server through Websocket. We continously record
video in host and send every 10s chunk of video to the server and server multicast it to all
clients joined on that session. This algorithm is shown in figure: 5.1 (Continous Video Chunk
Rendering Algorithm).
Finally project required outcomes for live video streaming comes by at least four phase of
study and constant dedication and curiosity to search the solution of problem.

12
4 SYSTEM ANALYSIS
4.1 Product Description
4.1.1 System Block Diagram
Description of block diagram shown in figure 4:1 is described below:
4.1.1.1 Authentication System
This system is the main entry point for the users to access notes, materials, add discussion,
and attend live training. It also has the login section, Register section.
4.1.1.2 Login Section
It introduce to enter User email, password to validate them whether they are register or not. If
User is not Register then, redirect control to the register page.
Discussion
Management
System
Upload
System
Authentication
System
Admin
Download
System
Display
Section
Live video
Streaming System MySQL
Databae
Figure 4-1System Block Diagram

13
4.1.1.3 Register Section
It takes user name, email, pass word, type as student or teacher and register them as the new
user.
4.1.1.4 Upload System
It recieves the notes, vedios from the student or teacher after login.Then, it transfer it to the
admin before displaying in Website. The materials upload in this system goes in
Autherntication section to the admin.
4.1.1.5 Discussion Management System
It allows user to add discussion in the forum after login. It also allows student to invite
teacher to add answer to that discussion. Any other students or teacher can able to reply
answer after login.
4.1.1.6 Download System
It allows to the user to download notes or materials which are accessible after login. Anyone
teacher or student can able to download those materials.
4.1.1.7 Live vedio Streaming Section
Here the teacher create the Session and live streaming open such that students join in that
session and live streamin starts. WebSockets control and implementation goes in this section.
Session management takes place where the live online tranining and side by side chatting
system is also included.
4.1.1.8 Video playing Section
It fetches the video from the database and play in the HTML 5 player but design of own
player is made for video playing. There is customize self JavaScript video player for the
playing of the video when the user click on the video shown in the page.

14
4.2 System Requirement Analysis
4.2.1 Functional Requirement
4.2.1.1 User Class 1 – The User
4.2.1.1.1 Functional Requirement 1.1
ID: FR1
Actor: Student, Teacher
TITLE: User Login
DESC: As, User Access the User through the internet. User should provide username,
password in the given field after signup. The session is saved for that user and allow to do
other process.
DEP: NONE
ID: FR2
TITLE: Download/Upload Notes
DESC: After the user login, they will be access to download/ Upload notes. To upload notes,
user should provide necessary details and file to upload. To download, user search the notes
and able to download as per request.
DEP: FR1
ID: FR3
Actor: Teacher
TITLE: Initiate Live Training

15
DESC: Teacher create the live room where he fills up the necessary details and student join
the room for live training.
DEP: FR1
ID: FR4
TITLE: Create/ Answer Disccussion
DESC: Student place their query on the discussion board where teacher or some other student
who know the answer can answer the discussion but teacher are not allowed to create
discussion.
DEP: FR1
ID: FR4
Actor: Teacher, Student
TITLE: Up/Down Vote to the Upload content or Discussion questions and answers
DESC: User can Up/Down vote to the Upload materials to express how they like about it.
They can also Up/Down vote to the Discussion.
DEP: FR1
4.2.2 Non-Functional Requirement
4.2.2.1 Performance Requirement
 There should not more latency 5s in the video transmission during live Streaming.
 The time for the requirement FR3 initiating should not above 10ms.
 CAPS of the nsystem must be at least 500.
 Processing delay on the upload notes should be at most 3s.
 Flickering effect should be reduced as much as possible during Live Stream.

16
 The memory consumption by the system must be as minimum as possible.
4.2.2.2 Security Requirement
 All the credential of the user should be secure properly in system.
 System should verify the email of the user through sending login Id to the user email.
 In every function system should valid the user login session_id.
 System must not shut down catastrophically such that all the records must be
recoverable
4.2.3 System Requirement
4.2.3.1 Software Requirement
Server side:
1. Tomcat or Glassfish server supports running JAVA web Service.
2. MYSQL Server and Database Management
Client Side:
1. Any browser, most prefer chrome, mozilla.
2. Any Operating System
3. High speed internet connection for live video streaming.
4.2.3.2 Hardware Requirement
1. Webcam (only for host the live stream).
2. Microphone.
3. Fast processor supports full WebSocket running with continuous image stream in
browser.
4.3 Development Model
Our Project follow the SDLC Iteratic model where each step is done one by one to buiild this
project. In this project whole requirement is divided into various builds. During each
Iteration, the development module goes through requirements design, implementation and
tesring phases. Each Iteration give us one increment in this project.

17
We choose this model to design system independently and flexible in change requirement.
Another reason to follow this model is to individual component preparation and speed up
development of this project.
4.4 Platform and Tools Used
This section explains about the platform in which this project is based and different tools,
Programming language used in this application “Multi-Learning Platform”.
4.4.1 Web –Platform
Web-Platform can be the most famous platform in which the user around the world can
access the system functionality with the help of internet. This project based of Web-Platform
such that student and user can use this system through internet.
4.4.2 Tools Used
1. JAVA
2. Spring Framework
3. MYSQL
4. Javascript
5. Jquery
6. Angular JS
7. MediaStream Recorder
8. Websocket
4.5 Feasibility Analysis
4.5.1 Operational Analysis
Lots of Web Hosting services are available supporting online vedio streaming service. So for
the operation it can be easily operate in this present scenerio.

18
4.5.2 Economic Analysis
This will be developed by our group using open source tools. So, it is economic feasible in
development. Then, in implementation the medium server supports high speed of internet
data transmission can handle for providing services.
4.5.3 Techinical Analysis
The engineer having knowledge of web services, Advance JAVA, MYSQL can handle it. It
is web based application such that client even not need any plugin for live video
transmission. Thus, that in this present context it is technical feasible.
4.5.4 Risk Analysis
This project is free of risk as therre is no any online transaction and system had not deal with
the major security issues. Along it, this is flexible in some circumstancces there can be high
latency on video data transmission.

19
4.6 System Related Diagram
4.6.1 Usecase Diagram
Figure 4-2Use Case Diagram

20
4.6.2 Sequence Diagram
This is the Sequence Diagram for the Live Streaming by Teacher to Student through System.
Figure 4-3 Sequence Diagram for Live Video Streaming

21
5 SYSTEM DESIGN
5.1 Diagram
5.1.1 ER Diagram
Figure 5-1ER Diagram
Figure 5-1 shows the ER diagram where main eight entity and their relationship between
them is shown above. Teacher initiate LiveStreamBroadcast where student join in it. Student
is only responsible to create discussion where student or teacher both are responsible to
answer the discussion. LiveStreamBroadcast has chat. Student and teacher both upload/
download materials (notes).

22
5.1.2 Class Diagram
Figure 5-2Class Diagram

23
6 IMPLEMENTATION
6.1 Classes and Function Characteristics
6.1.1 Student
Student is responsible for creating instance of Upload, Download, Discussion etc. and the list
of functtion associated to this class are :
Function Name Description
Login Takes email, password of student and send to server.
Signup Take necessary credential and register student
CreateDiscussion Creates the new discussion with issue details.
UploadNotes Take necessary note and upload to server
6.1.2 Teacher
Teaccher is responsible for creating instance of Upload,Download, AnswerDiscussion etc.
and the list of function associated to this class are:
Login Takes email, password of student and send to server.
Signup Take necessary credential and register student
AnswerDiscussion Answer the discussion already created.
UploadNotes Take necessary note and upload to server
6.1.3 Discussion
This Class can create instance of AnswerDiscussion and related function available on it are
listed below:
CreateDiscussion Receive necessary detail and create the new Discussion
UpVote Increment one vote to the specific discusisonId

24
DownVote Decrement one vote to the specific discusisonId
6.1.4 Upload Materials
This Class can create instance of Admin and related function available on it are listed below:
VerifyNote Open note By admin and verify it with upload_Id
RejectNote Remove note By admin with upload_id
6.1.5 Live Multicast
This Class can create the instance of Chat related function available on it are listed below:
CreateRoom Takes room_Id and necessary details from teacher and start the
Live Streaming
JoinStudent Accept studentId and join them to the room Created.
LiveMulticast Send the chunk of video to the server continously unitll host
close the connection
6.1.6 Download Notes
This Class is reponsible for download notes by the user and take feedback from user about
upload contain and the available function are listed below:
DownloadMaterials Download the given uploadId
Upvote Increment vote of UploadId by one
Downvote Decrement vote of UploadId by one.

25
6.2 Flowchart for Live Streaming
Record Video Copy chunk of
Video Data
Start
LiveStream
Send TO Server
Is
Stop
F T
Retrieve locally
stored data and
send to server
Server save video
with Details
Stop
Figure 6-1 Flowchart for Live Video Streaming

26
6.3 Algorithm for Live Video Streaming (Continous Video Chunk Rendering
Algorithm)
1. Initially Host Start LiveStreaming.
2. Record Video of the Webcam of Host in browser.
3. Temporalily chunk copy of m s of recorded video and send to server.
4. If connection IsOpen go to step 2.
5. Else Retrieve locally stored data and upload upload to server.
6. Server track Information and save to the database.
7. Stop Live chat service and disconnect all client joined in that session

27
7 TESTING
7.1 Unit Testing
7.1.1 Unit Testing of Live Video Streaming Section
Test Scenario: Unit Testing of Live Video Streaming section of the system.
Test
Case Id
Test
Scenario
Test Steps Test Data Expected
Results
Actual
Results
Pass/Fail
TCU01
Unit
Testing
of Live
Video
Streamin
g Section
1.Enter_roomname
2.Enter Title
3.Enter
Description
4.Enter RelatedTo
Roomnae:
Java101
Title: Java
Training
Description:
Training in
Java.
RelatedTo:
BCT, BEX
Successful
Initiate
Websocket
connection_with
roomname
’Java101’ and
video receive in
server
As
Expected
Pass
Table 7-1Unit Testing of Live Video Strreaming Section
7.1.2 Unit Testing of Chat Component
Test Scenario: Unit Testing of Chat Component Of the system.
Test
Case Id
Test
Scenario
Test Steps Test
Data
Expected Results Actual
Results
Pass/
Fail
TCU02
Unit
Testing of
Chat
Component
1.Enter Message
2.Send Message
3.Receive
Message
Message
: “hello
Server”
Receive Message enter
in Server and send
back to page as
“Server: hello Server”
As
Expected Pass
Table 7-2Unit Testing of Chat Component

28
7.1.3 Unit Testing of Discussion Forum
Test Scenario: Unit Testing of Discussion forum of the system.
Test
Case Id
Test
Scenario
Results
Actual
Results
Pass/F
ail
TCU03
Unit
Testing of
Create
Discussion
1.Enter Title
2.Enter
Question
3.Set Tags
4.Post
Title:How JVM
works?
Question: How to
know_how JVM
works and how
to-run
application.
Tag:BCT, BEX
Sucessfully
create
Discussion.
As
Expected
Pass
TCU04
Answer
Discussion
1.Choose
Discussion
opened to
answer.
Answer: Java
virtual machine
run the main()
function and run
the application.
Sucessfully
Anwer
Discussion
As
Expected
Pass
Table 7-3Unit Testing of Discussion Forum
7.1.4 Unit Testing of Upload Note Component
Test Scenario: Unit Testing of Upload Note Component Of the system.
Test
Case
Id
Test
Scenario
Results
Actual
Results
Pass/Fail
TCU05
Upload
Note Unit
Testing
1.Enter Title
2.Enter Desc
3.Choose
Title:Demo_Upload
Desc: “This is the
demo upload Note“
Successful
Message
In
As
Expected
Pass

29
File
4.Upload
File
File: Pdf Note WebPage
Table 7-4 Test Case Design for Unit Testing Of Upload Note Component
7.1.5 Unit Testing of Download Materials
Test Scenario: Unit Testing of Download Materials Component Of the system.
Test
Case
Id
Test
Scenario
Results
Actual
Results
Pass/Fail
TCU06 Unit testing
of_Download
Materials
Component
1.Choose
2.Download
3.Observe
Download Data.
“SRS
Manual”
to
download.
Sucessfully
Download
in the
Browser.
As
Expected
Pass
7.1.6 Unit Testing of Authentication System by Admin of every Upload Materials
Test Scenario: Unit Testing of Authentication System Component by the Admin.
Test
Case
Id
Test Scenario Test Steps Test Data Expected
Results
Actual
Results
Pass/Fail
TCU07 Unit Testing
of
Authentication
System
Component by
the Admin
1.Upload
Material
2.See in Admin
Table for
verification.
Upload
“abc.pdf”
file
In admin
Table see as
pending
material
and admin
verify it.
As
Expected
Pass

30
7.2 Integration Testing
Test Scenerio: Test for the Login Component and Chat Component after Integration.
Test
Case
Id
Test
Scenario
Results
Actual
Results
Pass/Fail
TCI01 Check
Login
1. Open Login
Page
2.Enter
UserName
3.Enter
password
UserName:sus12
Passaword: 1234
User
should
login to
the
system
As
Expected
Pass
TCI02 Check Chat
Component
1. Login
2.Open
Chatroom
3.Observe
Performance
Username: sus12
Password: 1234
Message=”hello”
Send TO: Server
Receive
message
“hello”
To server
As
Expected
Pass
Table 7-5Test Case for Integration Testing
7.3 Performance Testing
Test Scenerio: Performance of overall system including Live Streaming Section and Video
Download.

31
Test
Case
Id
Test
Scenario
Results
Actual
Results
Pass/Fail
TCP01
Performance
of Live
Streaming
Section
1.Login
2.Create Live
Training
3.Observe
Output in Client
Pages
Username:sus101
Password: 1234
RoomName:
2dsl32lsfj
Accurate
video with
zero
latency
receive
As
Expected
Pass
TCP02
Download
Video
1.Click
Download Video
2.Download
Video
VideoUrL:
http://localhost/m
ultilearning?id=
1234adf
Fast video
Download
As
Expected
Pass
Table 7-6Test Case of Performance Testing
7.4 System Testing
Test Scenario: SystemTesting of whole system and their components coordinnation to each
other.
Test
Case
Id
Test
Scenario
Results
Actual
Results
Pass/F
ail
TCA01
Upload Note
Testing
1.Enter Title
2.Enter Desc
3.Choose File
4.Upload File
Title:Demo_Upload
Desc: “This is the
demo upload Note“
File: Pdf Note
Successful
Message In
WebPage
As
Expected
Pass
TCA02
Performance
of Live
Streaming
Section
1.Login
2.Create Live
Training
3. Observe
Output in Client
Username:sus101
Password: 1234
RoomName:
2dsl32lsfj
Accurate video
with zero
latency receive
As
Expected
Pass

32
Pages
TCA03
Download
Video
1.Click
Download Video
2.Download
Video
VideoUrL:
http://demo/id=
1234adf
Fast video
Download
As
Expected
Pass
TCA04
Check
Login
1.Open
LoginPage
2.Enter
UserName
3.Enter password
UserName:sus12
Passaword: 1234
User should
login to the
system
As
Expected
Pass
TCA05 Check Chat
Component
1. Login
2.Open Chatroom
3.ObservePerfor
mance
Username: sus12
Password: 1234
Message=”hello”
Send TO: Server
Receive
message “hello”
To server
As
Expected
Pass
TCA06
Create
Discussion
1.Enter title
2.Enter Question
3.Enter
RelatedTO
4.Post
Title:“What is Java?”
Question:”How to
Learn Java”
RelatedTO:
BCT,BEX
Sucessfully
Create
Discussion And
Seen.
As
Expected
Pass
Table 7-7 Test Case Design for System Testing

33
8 RESULTS AND CONCLUSION
8.1 Outcomes
There will be simple implementation of the frontend with the versatile and highly secure
backhend system build in SpringMVC architecture. The system had implementation of online
video transmission with as much as low latency.
8.1.1 Outcome for Chat
The system opens the live chat window when teacher initiate live training or student join live
training. The message text is shown with the name of user whom it belongs. User simply give
text from keyboard. Snapshot shown in fig: A-1(APPENDIX).
8.1.2 Outcome for Live Video Streaming
Teache initiate live training to the students by filling live training form. He fill the title,
description, roomname and most important related to which students.
After onward live training starts where teacher train the students through webcam. Snapshot
is shown in fig A-1.
8.1.3 Outcome for Upload
The system opens the page for upload note. The student/ Teacher upload notes and details to
the system. The system keep all details and notes on the database with it’s path stored in
database.Snapshot is shown in fig A-3.
8.1.4 Outcome for Create Discussion
Student create the discussion with the title, description and tags related to it and post it. Then,
the system receive discussion and save in the database for future access. Snapshot is shown
in fig A:2.
8.2 Calculation
The system show behaivour and overall performance as satisfied as required.
Suppose a server Request handling capacity = x requests per second.

34
Internet speed of Host = y Mbps.
A chunk of ‘m’s video take ‘b’ ms to send by server to 1 client.
To send n client it takes n*b ms = 0.001nb s. [Standard 1s (length of video) = 1ms (time by
taken by sever to send)]
If m s chunk of video receive by server then, server can be busy up to next < m s to transmit
chunk of video to n clients, this approach reduce latency of video transmission. ----- (i)
Let say at an instant of time ‘t1’ 1000 clients are joined and chunk is of 10s.
So, it takes = 0.001* (1000 * 10) = 10s.
If length of chunk of video is > 10s, it will be pretty better. [From (i)].
Finally, in short we found that all this parameter depends on server request handling capacity
and data transfer rate of server.
8.3 Conclusion
To be concluded, our project had implemented all the requirements properly. All modules of
the system is working properly such that the performance of the sytem is found good. The
implementation had each test case design for every components in each iteration and all the
test results are verified and assure that they all are working properly.
Cons of [3] as only image transfer for video streaming and and high network traffic problem
is solved as:
1. We had introduce continous chunk of video transfer where the image and audio are
both combined as recorded video.
2. The gap of chunk of video is m s such that we can reduce network traffic and latency
between the server and user end.

35
By the help of Unit Testing Results we achieve our all Objectives as:
Objective 1 as Build Live Video Streaming Section with Websockets is achieved and verified
by the Unit Testing TCU01.
Objective 2 as Build Live Chat side by side of live Video Streaming Section is achieved and
verified by the Unit Testing TCU02.
Objective 3 as Implementation of Discussion Forum is achieved and verified by the Unit
Testing TCU03 & TCU04.
Objective 4 as Build system to Upload Materials is achieved and verified by the Unit Testing
TCU04.
Objective 5 as Build system to Download Materials is achieved and verified by the Unit
Testing TCU05.
Objective 6 as Build Authentication system by Admin of every upload materials is achieved
and verified by the Unit Testing TCU06.
Finally we had made the complete system as “Multi-Learning Platform” and verified by
Integration Testing (Table 7-5) and System Testing (Table 7-7) one by one. By this we can
able to implement our continous chunk of video rendering algorithm successfully. We test
our project on different platform based of localhost server and output is good as we expect.
Thus by this statement we are able to say that our project is successful.

36
REFERENCES
[1]Debios, Patrick. Zender. 23 03 2018. Document. 06 08 2018.
<http://www.zender.tv/news/2018/3/23/ultra-low-latency-streaming-the-current-
state>.
[2]Louckx, Ward. Streaming media over multicast. Bachelor Thesis. Matti : Mikkelin
University, 3013. Document.
[3]Ruhil, Pradeep. 9 12 2013. <http://javawebsocketsvideo.blogspot.com/>.(as visited on
8 /8 / 2018)
[4]Panagiotakis, S., K. Kapetanakis and A. G. Malamos. "Architecture for Real Time
Communications over the Web ." International Journal of Web Engineering (2013):
3.
[5]"Stackoverflow." 05 2015. https://stackoverflow.com/questions/17767523/how-to-use-
mediastream-recording. Text. 2018.
[6]Zhu, Guolei, et al. "HTML5 Based Media Player for Real-Time Video." International
Congress (2012): 5-6. Document.
[7] Media Capture and Streams, http:// www. w3. org/ TR/ mediacapture -streams/ (as visited
on 6/22/2013).
[8]Debios, Patrick. Zender. 23 03 2018. Document. 06 08 2018.
<http://www.zender.tv/news/2018/3/23/ultra-low-latency-streaming-the-current-
state>.

37
APPENDIX-A
Figure A-1Live Training Window And Live Chat Window

38
Figure A-2Create Discussion Outcome
Figure A-3UploadFileDemo

39
Figure A -4Upload Materials Database Table Structure
Figure A-5Discussion Table Structure

41
Figure A -6Live training Module Sub Code

Bachelor in Computer Engineering Minor Project " MULTI-LEARNING PLATFORM"

Recommended

Recommended

More Related Content

Similar to Bachelor in Computer Engineering Minor Project " MULTI-LEARNING PLATFORM"

Similar to Bachelor in Computer Engineering Minor Project " MULTI-LEARNING PLATFORM" (20)

Recently uploaded

Recently uploaded (20)

Bachelor in Computer Engineering Minor Project " MULTI-LEARNING PLATFORM"