Red Blood Buddies

Project Report
On
RED DROP BUDDIES
Submitted in fulfillment of the
requirement for the award of degree of
Master of Computer Applications

(Batch 2018 – 2019)
By
ERA
(1316725)
Under the Supervision of

Ms. Paluck Arora
(Assistant Professor)
M.M. Institute of Computer Technology &Business Management

Maharishi Markandeshwar (Deemed to be University), Mullana (Ambala)
(NAAC accredited Grade ‘A’ University)
May 2019
CANDIDATE’S DECLARATION
I hereby declare that the work which is being presented in this project report entitled “RED DROP
BUDDIES” in partial fulfillment of the requirement for the award of the degree of MASTER OF
COMPUTER APPLICATIONS, submitted at M.M. Institute of Computer Technology & Business
Management, Maharishi Markandeshwar (Deemed to be University), Mullana, Ambala is an
authentic work done by me during a period from January 2019 to May2019 under the Guidance of
Ms.Paluck Arora, MMICT&BM.
The work presented in this project report has not been submitted by me for the award of any other
degree of this or any other Institute/University.
ERA
1316725
This is to certify that the above statement made by the candidate is correct to best of my
knowledge and belief.
Date: Ms.Paluck Arora

Place: Assistant Professor
1. Company Profile
ThinkNEXT Technologies Private Limited (An ISO 9001:2008 Certified Company), is emerging as most
innovative company in Education Domain in India. The Management of ThinkNEXT Technologies Pvt.
Ltd. has wide experience more than nine years in education domain. Over the years, we have worked
very closely with Universities, Group of Colleges and other Institutions. We have wide experience
working with eminent Educationists, Managements, Directors, Principals, Head of Departments, other
Staff Members, Parents and students. Therefore we do not sell only software Modules but an
innovative system which has more importance than just ERP software modules. Today Smart Campus
solutions are a need of hour for every University/Group of Colleges or an Institution to make edge over
others and maintain a lead over their competitors. Our Research and Development team is committed
to make your institute(s) to maintain lead over their competitors
ThinkNEXT Technologies Pvt. Ltd. is a Software/Electronics Systems Development Company (MNC)

and approved from Ministry of Corporate Affairs which deals in Smart Campus ERP Solutions (For
automation of Universities/Colleges/Schools), University Conferences and Journals Management
www.ptuconferences.ac.in, www.ptujournals.ac.in, Android/iPhone Applications development (View
our numerous Mobile Apps on Google Play and Apple Apps Store under ThinkNEXT Technologies and
Zeta Apponomics Lab Account), Cloud Telephony Service, Bulk SMS, Voice SMS, Shortcode (Auto
SMS), Web designing, Web development, TechSmart Classes (Schools), GPS based Vehicle Tracking,
Biometrics Time Attendance Using Fingerprints and Face Detection Technologies, Digital Marketing,
Industrial Automation, Robotics, Access Control, Security Systems, SCADA Solutions and
Consultancy, CCTV Camera, Hardware and Network Services, Placement Services, Payment Gateway
Integration, Discount Card and Discount Deals, ID Card Printing and Manufacturing, Smart Card
Printing etc. We have expertise in latest technologies e.g. Smart Card (Contact Type and Contactless),
NFC, Biometrics (Fingerprint, Face Detection), Barcode, RFID, SMS, Voice SMS Android, iPhone, Web,
Windows and Mobile based technologies. ThinkNEXT is best Website Designing and Development
Company in Chandigarh. We have clients primarily from USA, Canada, Singapore, UK, Australia, New
Zealand and India.ThinkNEXT has thousands of clients all over the world under various product
categories.ThinkNEXT Technologies has developed for the first time in northern region a cloud
computing based ThinkNEXT Cloud Campus 4.0 to facilitate knowledge and placement centric
services. It is a unique concept for effective and collaborative learning. ThinkNEXT Cloud Campus is a
step towards not only 100% placements, but also better job offers even after placements.
Live Services provided by the company are :
 Web Designing
 Digital Marketing
 Java
 Mobile Application Development
 Networking
 PHP Development and .NET
 Android App Development and Python
Philosophy
Our company philosophy is to create the kind of website that most businesses want: easy to find,
stylish and appealing, quick loading, mobile responsive and easy to buy from.
Mission
We’ve designed our entire process and products around providing everything a small businesses needs
when they’re starting out – ensuring that working with us is always a quick, easy and hassle-free
experience. We give our clients full control of their website without a ridiculous price tag, and our
friendly team offers their expertise even after your website is live.
How we Work
With our in-house award winning designers, we recognize the fact that usability, functionality and
visualization are three of the most important factors when designing interfaces or web sites. Using this
strategy, we work with you to ensure that your messaging and marketing goals are realized with the
designs we create. We will work with you and bring your idea to life.
As a leading mobile application development company, ThinkNEXT has extensive experience in
creating high performance, feature-packed native mobile applications for all the major mobile
platforms including iOS, Android, BlackBerry OS and Windows Mobile. ThinkNEXT mobile app
developers can create the right app that will meet your business, industry and/or vertical needs.
2. Introduction
2.1 Project overview

The main aim of developing this system is to provide blood to the people who are in need
of blood. The number of persons who are in need of blood are increasing in large
number day by day. Using this system user can search blood group available in the
city and he can also get contact number of the donor who has the same blood group
he needs. In order to help people who are in need of blood, this Online Red Blood
Buddies system can be used effectively for getting the details of available blood groups
and user can also get contact number of the blood donors having the same blood
group and within the same city. So if the blood group is not available in the blood
bank user can request the donor to donate the blood to him and save someone life.
Using this system people can register himself or herself who want to donate blood. To
register in the system they have to enter their contact information like address mobile
number etc.
This blood bank management system is an online website so it is easily available to everyone.
When a person want to donate blood he have to register to the system. Donor registration is very
easy, to get register to the system he have to fill up registration form. After submitting the
registration form he can create username and password. Donor have to give information like
blood group, contact details etc. donor can also change his account information when he wants
using his username and password.
Using this blood bank system people can search blood group available which they are
needed. They check it online using our blood bank management website. If in case
blood group is not available in blood bank they can also get contact numbers of the
persons who has the same blood group he is need. And he can request the person to
donate the blood for saving someone life. Our system also allow user to search online
the person who have the same blood group he needs and if he find the If he find a
donor in his city then we give him all details of the donor, if he doesn’t find any donor
then he is given the contact numbers and addresses of the Life Saving Contact
Persons for big cities.
2.2 Project Scope
The purpose of the system is to simplify and automate the process of searching for blood
in case of emergency and maintain the records of blood donors,recipients,blood
donation programs,camps.Maintain database of donar and recipients. This project is
mainly towards persons who are willing to donate blood to the patients. Through this
system it will be easier to find a donor for exact blood type and easy to build the
connection.
2.3 General Description

1. Admin
2.Request
3.Donor
ADMIN:-
• Manage Registration for user
• Manage Blood bank information like (update, delete)
• Manage Donor Request for Donor
• Manage patient Request for needy people
• Manage Inquiry form for Appropriate Reply
• Manage feedback for Appropriate Reply
• Blood bank information view/update
• View Donor information
• Manage Patient Blood Request.
REQUEST:-
• View Donor information.
• Send Blood Request.
• Manage Blood Request.
DONOR:-
• Manage Donor information(profile)
• Add new Donation for Blood
3. System Analysis
3.1 Need of the System

The people in need of blood can search for the donors by giving their blood group and city
name. it saves time as he can search donors online without going anywhere.
Today, blood banks collect blood and separate it into its various components so they
can be used most effectively according to the needs of the patient. Red bloodcells
carry oxygen, platelets help the blood clot, and plasma has specific proteins that allow
proper regulation of coagulation and healing. The reason to donate is simple…it helps
save lives. In fact, every two seconds of every day, someone needs blood. Since blood
cannot be manufactured outside the body and has a limited shelf life, the supply must
constantly be replenished by generous blood donors.
3.2 Proposed system

The proposed Blood Bank management system helps the people who are in need of a blood by giving
them all details of blood group availability or regarding the donors with the same blood group.
The people in need of blood can search for the donors by giving their blood group and city name. it
saves time as he can search donors online without going anywhere. Using this system user can get
blood in time and can save his relative or friend life. Our website work 24x7 so user can get
information of blood donor any time. Blood donor can also get registered and save life of other person.
The main benefit of this system is the information of available blood group. When blood is need in the
operation then people have very less time to get the blood available so if he get the information like
who can give him blood in time in his city is life saving. And here our system work, whenever a person
need blood he get information of the person who has the same blood group he needs.
4. System Requirements
4.1 Hardware Requirements
Processor Intel i3 or higher
RAM 1 GB or Higher
Hard Drive 4 GB or more
4.2 Software Requirements
Platform Used Windows 10 or higher
Database DB Browser for SQlite

Component Sublime Editor
Languages Used Python,

HTML,
Bootstrap,
CSS,
JavaScript
Framework Used Django

5. Technology Used
5.1 Introduction to Python

Python is a high-level, interpreted, interactive and object-oriented scripting language.
Python is designed to be highly readable. It was created by Guido van Rossum, and
released in 1991.
Python's features include −
 Easy-to-learn − Python has few keywords, simple structure, and a clearly defined syntax. This
allows the student to pick up the language quickly.
 Easy-to-read − Python code is more clearly defined and visible to the eyes.
 Easy-to-maintain − Python's source code is fairly easy-to-maintain.
 A broad standard library − Python's bulk of the library is very portable and cross-platform
compatible on UNIX, Windows, and Macintosh.
 Interactive Mode − Python has support for an interactive mode which allows interactive testing
and debugging of snippets of code.
 Portable − Python can run on a wide variety of hardware platforms and has the same interface
on all platforms.
 Extendable − You can add low-level modules to the Python interpreter. These modules enable
programmers to add to or customize their tools to be more efficient.
 Databases − Python provides interfaces to all major commercial databases.
 GUI Programming − Python supports GUI applications that can be created and ported to many
system calls, libraries and windows systems, such as Windows MFC, Macintosh, and the X
Window system of Unix.
 Scalable − Python provides a better structure and support for large programs than shell
scripting.
Due to increase in the technology day by day, Python plays a very important and crucial
role in IT sector. Python is important and we need it because-
 Python works on different platforms (Windows, Mac, Linux, Raspberry Pi, etc).
 Python has a simple syntax similar to the English language.
 Python has syntax that allows developers to write programs with fewer lines than some other
programming languages.
 Python runs on an interpreter system, meaning that code can be executed as soon as it is
written. This means that prototyping can be very quick.
 Python can be treated in a procedural way, an object-orientated way or a functional way.
 Python is Interpreted − Python is processed at runtime by the interpreter. You do not need to
compile your program before executing it. This is similar to PERL and PHP.
 Python is Interactive − You can actually sit at a Python prompt and interact with the
interpreter directly to write your programs.
 Python is Object-Oriented − Python supports Object-Oriented style or technique of
programming that encapsulates code within objects.
 Python is a Beginner's Language − Python is a great language for the beginner-level
programmers and supports the development of a wide range of applications from simple text
processing to WWW browsers to games.
5.2 Introduction to Bootstrap
Bootstrap is a free front-end framework for faster and easier web development.It includes HTML
and CSS based design templates for typography, forms, buttons, tables, navigation, modals,
image carousels and many other, as well as optional JavaScript plugins.Bootstrap also gives you
the ability to easily create responsive designs.
Bootstrap was developed by Mark Otto and Jacob Thornton at Twitter, and released as an open
source product in August 2011 on GitHub.
 Easy to use: Anybody with just basic knowledge of HTML and CSS can start using Bootstrap
 Responsive features: Bootstrap's responsive CSS adjusts to phones, tablets, and desktops
 Mobile-first approach: In Bootstrap 3, mobile-first styles are part of the core framework
 Browser compatibility: Bootstrap is compatible with all modern browsers (Chrome, Firefox,
Internet Explorer, Edge, Safari, and Opera)
5.3 Introduction to CSS

Cascading Style Sheets, fondly referred to as CSS, is a simple design language intended to simplify
the process of making web pages presentable.
CSS handles the look and feel part of a web page. Using CSS, you can control the color of the text, the
style of fonts, the spacing between paragraphs, how columns are sized and laid out, what background
images or colors are used, layout designs,variations in display for different devices and screen sizes as
well as a variety of other effects. CSS is created and maintained through a group of people within the
W3C called the CSS Working Group.
CSS is easy to learn and understand but it provides powerful control over the presentation of an
HTML document. Most commonly, CSS is combined with the markup languages HTML or XHTML.
CSS is used to define styles for your web pages, including the design, layout and variations in display
for different devices and screen sizes.
 CSS saves time − You can write CSS once and then reuse same sheet in multiple HTML pages.
You can define a style for each HTML element and apply it to as many Web pages as you want.
 Pages load faster − If you are using CSS, you do not need to write HTML tag attributes every
time. Just write one CSS rule of a tag and apply it to all the occurrences of that tag. So less code
means faster download times.
 Easy maintenance − To make a global change, simply change the style, and all elements in all
the web pages will be updated automatically.
 Superior styles to HTML − CSS has a much wider array of attributes than HTML, so you can
give a far better look to your HTML page in comparison to HTML attributes.
 Multiple Device Compatibility − Style sheets allow content to be optimized for more than one
type of device. By using the same HTML document, different versions of a website can be
presented for handheld devices such as PDAs and cell phones or for printing.
 Global web standards − Now HTML attributes are being deprecated and it is being recommended
to use CSS. So its a good idea to start using CSS in all the HTML pages to make them
compatible to future browsers.
5.4 Introduction to Java Script
JavaScript is a dynamic computer programming language. It is lightweight and most commonly
used as a part of web pages, whose implementations allow client-side script to interact with
the user and make dynamic pages. It is an interpreted programming language with object-
oriented capabilities.
 JavaScript is a lightweight, interpreted programming language.

 Designed for creating network-centric applications.
 Complementary to and integrated with Java.
 Complementary to and integrated with HTML.
 Open and cross-platform
The JavaScript code is executed when the user submits the form, and only if all the entries are
valid, they would be submitted to the Web Server.
 Less server interaction − You can validate user input before sending the page off to the server.
This saves server traffic, which means less load on your server.
 Immediate feedback to the visitors − They don't have to wait for a page reload to see if they
have forgotten to enter something.
 Increased interactivity − You can create interfaces that react when the user hovers over them
with a mouse or activates them via the keyboard.
 Richer interfaces − You can use JavaScript to include such items as drag-and-drop components
and sliders to give a Rich Interface to your site visitors.
5.5 Introduction to HTML

HTML stands for Hypertext Markup Language, and it is the most widely used language to write Web
Pages.Hypertext refers to the way in which Web pages (HTML documents) are linked together. Thus,
the link available on a webpage is called Hypertext.As its name suggests, HTML is a Markup
Language which means you use HTML to simply "mark-up" a text document with tags that tell a Web
browser how to structure it to display.
Originally, HTML was developed with the intent of defining the structure of documents like headings,
paragraphs, lists, and so forth to facilitate the sharing of scientific information between
researchers.Now, HTML is being widely used to format web pages with the help of different tags
available in HTML language.
6. E-R Diagrams
An E-R diagram can express the overall logical structure of a database graphically. The relative
simplicity and pictorial clarity of this diagramming technique may well account in the large part for
the wide spread use of the E-R model. Such a diagram consists of the following major components:
 Rectangles : Which represent entity sets.
 Ellipse : Which represents attributes.
 Diamond : Which represent relationship sets.
 Lines : Which link attributes to entity sets to relationships sets.
System Flow Chart
Start
Is
Registered No
Registration
user
Yes
Login
Is
No Valid
User
Yes
No No No
Admi Blood Donor
n bank
Yes Yes Yes View profile
Manage View request View profile
bloodDetails Add new blood
bank Patient Request
Make new Blood
for blood
Manage donor Donation
Manage request
Manage
Manage donor
city/location Manage
patient
blood
request
A B D
C
A B C D
Logout
End
User User
id password
Admin
1 1
1
manage manage
Send
View M D_
name
Request M
Donor
M M
D_id
has
has
Use case Diagram
Admin
: Blood Bank Management System
Registration
Login
Manage Blood bank
Manage Donor
Manage request
Manage City/Location
View Request
Manage Camps
Donor:
Red Blood Buddies
Registration
Login
View Profile
Make new Blood Donation

USER
Red Blood Buddies
Registration
Login
View Profile
Request for blood

Activity Diagram
7. System Designing
7.1 Front-End Designing
Home.py(Diag-1)
Home.py(Diag-2)
Login.py(Diag-3)
Signup.py(Diag-4)
Welcome-
Change Password(Diag-5)
Update Profile
Blood Donate
View Donation
View Request
Send Request for Blood
View Request
Doanr registration
Database-1
Database-2
Database-3
Database-4
8. Testing
Name :- User login module

No Test condition Expected Result Actual output Status
(pass,
fail)
Test 1 Click on submit System does not System pass
button without allow user to displays
user name and login. message and
password. resume to the
same page.
Test 2 Click on Message As expected. pass
submit "please fill up
button with the username
invalid user or password”
name and or
password.
Test 3 Click on System allow System allow pass
submit button user to login. user to access
with correct application
user name based on rights
add given to him.
password.
Name :-User Registration
(pass,
fail)
Click on submit System does not System pass
Test 1 button without allow user to displays
user name and login. message and
password. resume to the
same page.
Test 2 Click on submit Message System pass
button without “please fill up displays
correct password the correct message and
& re- password. password & re resume to the
password” same page.
Test 3 Select on user System allow System allow pass
type with user to login. user to access
correct user application
registration based on right
given to him.
Name :- Blood request
(pass,
fail)
Test 1 Click on System does not System pass
update button allow admin to displays
without add save data message to the
new without add same page.
information of blood bank
request for name
blood bank
name
Name :- Donor request
(pass,
fail)
Test 1 Click on System does not System pass
update button allow admin to displays
without add save data message to the
new without add same page.
information of blood bank
donor request name
for blood
bank name.
9. Coding
9.1 Home.html
{% load staticfiles %}
<html>
<head>
<title>Blood donation project</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="blood.css" type="text/css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-
awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-/4.7.0/css/font-

awesome.min.css" type="text/css">
<link rel="stylesheet" href="{% static 'css/blood.css' %}">
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<img src="{% static 'images/blood.png'%} " style="height:200; width:200; margin-top:-25px;">
<div class="navbar-header">
<a class="navbar-brand" href="#">
</a>
</div>
<ul class="nav navbar-nav nav-left" >
<li><a href="">Home</a></li>
<li><a href="/donar2/">Donar</a></li>
<li class='dropdown'><a class='dropdown-toggle' data-toggle='dropdown' href="#">Request<span

class='caret'></span></a>
<ul class='dropdown-menu'>
<li><a href="/donate/">View Request</a></li>
<li><a href="/sendrequest2/">Send Request</a></li>
</ul>
<li><a href="#">Camp</a></li>
<li><a href="#">Contact us</a></li>
</ul>
</div>
</div>
</nav>
<div class="row">
<div class="col-lg-12">
<div id="myCarousel" class="carousel slide" data-ride="carousel">

<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>


<div class="carousel-inner">
<div class="item active">
<img src="{% static 'images/vese.jpg' %}" style="width:100%;">
</div>
<div class="item">
<img src="{% static 'images/checkup.jpg' %}" style="width:100%;">
</div>
<div class="item">
<img src="{% static 'images/donor1.jpg' %}" style="width:100%;">
</div>
<div class="item">
<img src="{% static 'images/juice.jpg' %}" style="width:100%;">
</div>
</div>

<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="hovereffect1">
<img class="img-responsive" src="{% static 'images/loginpic3.jpeg' %}">
<div class="overlay1">
<h2>WELCOME TO DONOR FAMILY</h2>
<a class="info" href="/login/">LOGIN NOW</a>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
<div class="hovereffect">
<img class="img-responsive" src="{% static 'images/grid1.jpeg' %}" alt="">
<div class="overlay">
<h2>RED DROP BUDDIES</h2>
<a class="info" href="#">CAMP</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<img class="img-responsive" src="{% static 'images/grid6.jpg' %}" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="greybox col-md-4">
</div>
<div class="col-md-8 footer"><img src="{% static 'images/BLOOD.png' %}" class="img-responsive"
height="400" width="400">
<div class="col-md-8 col-md-4">
<a href="#" class="fa fa-facebook"></a>
<a href="#" class="fa fa-twitter"></a>
<a href="#" class="fa fa-linkedin"></a>
<a href="#" class="fa fa-youtube"></a>
<a href="#" class="fa fa-instagram"></a>
<h3>+917404527688 <span class="glyphicon glyphicon-earphone"></span></h3>
<h3>funkbeat5@gmail.com <span class="glyphicon glyphicon-envelope"></span></h3>
</div>
</div>
</div>
</body>
</html>
CSS
.navbar{
width:100%;
height:90px;
top:0;
z-index:1;
position:absolute;
opacity:0.7;
background-color: white;
}
.navbar-header a{
color:pink;
font-family:arial black;
font-size:50px;
}
.nav.navbar-nav li a{
font-family: arial black;
color: black;
font-size: 20px;
margin-top: 15px;
}
.navbar-nav {
font-family:Arial;
font-size:50px;
}
.nav.navbar-nav {
float:right;
padding-left: 10px;
margin-left: 90px;
margin-right: 0px;
}
}
.carousel-slide{
top:0;
z-index:1;
position:absolute;
height:100px;
}
.carousel-inner
{
height: 800px;
}
.item img {
height: 100%;
.hovereffect1 {
width:1500px;
height:300px;
float:left;
overflow:hidden;
position:relative;
text-align:center;
cursor:default;
margin-top:20px;
}
.hovereffect1 .overlay1 {
width:1500px;
height:400px;
position:absolute;
overflow:hidden;
top:0;
left:0;
opacity:0;
background-color:rgba(0,0,0,0.5);
-webkit-transition:all .4s ease-in-out;
transition:all .4s ease-in-out
}
.hovereffect1 img {
display:block;
position:relative;
-webkit-transition:all .4s linear;
transition:all .4s linear;
opacity: 0.7;
}
.hovereffect1 h2 {
text-transform:uppercase;
color:#fff;
text-align:center;
position:relative;
font-size:30px;
background:rgba(0,0,0,0.6);
-webkit-transform:translatey(-100px);
-ms-transform:translatey(-100px);
transform:translatey(-100px);
transition:all .2s ease-in-out;
padding:10px;
}
.hovereffect1 a.info {
text-decoration:none;
display:inline-block;
text-transform:uppercase;
color:#fff;
border:1px solid #fff;
background-color:transparent;
opacity:0;
filter:alpha(opacity=0);
transition:all .2s ease-in-out;
margin:50px 0 0;
padding:7px 14px;
}
.hovereffect1 a.info:hover {
box-shadow:0 0 5px #fff;
}
.hovereffect1:hover img {
-ms-transform:scale(1.2);
-webkit-transform:scale(1.2);
transform:scale(1.2);
}
.hovereffect1:hover .overlay1 {
opacity:1;
}
.hovereffect1:hover h2,.hovereffect1:hover a.info {

opacity:1;
-ms-transform:translatey(0);
-webkit-transform:translatey(0);
transform:translatey(0);
}
.hovereffect1:hover a.info {
-webkit-transition-delay:.2s;
transition-delay:.2s;
}
.btn
{
margin-left:600px;
margin-top: 120px;
}
.hovereffect {
width: 400px;
height: 208px;
float: left;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
.hovereffect .overlay {
width: 400px;
height: 208px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.6);
opacity: 0;
filter: alpha(opacity=0);
-webkit-transform: translate(460px, -100px) rotate(180deg);
-ms-transform: translate(460px, -100px) rotate(180deg);
transform: translate(460px, -100px) rotate(180deg);
-webkit-transition: all 0.2s 0.4s ease-in-out;
transition: all 0.2s 0.4s ease-in-out;
}
.hovereffect img {
display: block;
position: relative;
-webkit-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
}
.hovereffect h2 {
text-transform: uppercase;
color: #fff;
text-align: center;
position: relative;
font-size: 17px;
padding: 10px;
background: rgba(0, 0, 0, 0.6);
}
.hovereffect a.info {
display: inline-block;
text-decoration: none;
padding: 7px 14px;
color: #fff;
border: 1px solid #fff;
margin: 50px 0 0 0;
background-color: transparent;
-webkit-transform: translateY(-200px);
-ms-transform: translateY(-200px);
transform: translateY(-200px);
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.hovereffect a.info:hover {
box-shadow: 0 0 5px #fff;
}
.hovereffect:hover .overlay {
opacity: 1;
-webkit-transition-delay: 0s;
transition-delay: 0s;
-webkit-transform: translate(0px, 0px);
-ms-transform: translate(0px, 0px);
transform: translate(0px, 0px);
}
.hovereffect:hover h2 {
-webkit-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition-delay: 0.5s;
transition-delay: 0.5s;
}
.hovereffect:hover a.info {
}
.hovereffect11 {
width: 400px;
height: 208px;
float: left;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
width: 400px;
height: 208px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
opacity: 0;
}
.hovereffect11 img {
display: block;
position: relative;
}
.hovereffect11 h2 {
color: #fff;
text-align: center;
position: relative;
font-size: 17px;
padding: 10px;
}
padding: 7px 14px;
color: #fff;
margin: 50px 0 0 0;
}
}
opacity: 1;
}
.hovereffect11:hover h2 {
}
}
.hovereffect12 {
width: 400px;
height: 208px;
float: left;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
width: 400px;
height: 208px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
opacity: 0;
}
.hovereffect12 img {
display: block;
position: relative;
}
.hovereffect12 h2 {
color: #fff;
text-align: center;
position: relative;
font-size: 17px;
padding: 10px;
}
padding: 7px 14px;
color: #fff;
margin: 50px 0 0 0;
}
}
opacity: 1;
}
.hovereffect12:hover h2 {
}
}
.hovereffect13 {
width: 400px;
height: 208px;
float: left;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
LOGIN.HTML
<html>
<head>
<title>Bootstrap Example</title>

<link rel="stylesheet" href="{% static 'css/login.css' %}">
<style>
.bg{
background: url("{% static 'images/loginpic4.jpeg' %}") no-repeat;
width:100%;
height: 100%;
}
</style>
</head>
<body>
<div class="container-fluid bg">
<div class="row">
<div class="col-md-4 col-xs-4 col-xx-12"></div>
<div class="col-md-4 col-xs-4 col-xx-12">
<form action = "/login_data/" method = "post" id="log" >{% csrf_token %}
<h1>LOGIN FORM</h1>
<img class="img img-circle img-responsive" src="{% static 'images/logo2.gif'
%}">
<div class="form-group">
<label>Email</label>
<input type="email" name = "mail" class="form-control"
placeholder="Email">
</div>
<label>Password</label>
<input type="password" name = "pass" class="form-control"
placeholder="Password">
</div>
<div class="checkbox">
<label><input type="checkbox">Remember me</label>
</div>
<button type="submit" class="btn btn-primary btn-
block">Login</button><br>
<p style="margin: 0px 0px 0px 187px;">Not a Member?<a
href="/signup/">Signup</a></p>
</form>
</div>
</div>
</div>
</body>
</html>
css
#log{
border: 2px solid white;
padding: 60px 40px;
margin-top: 80px;
}
.img{
width:150px;
margin: auto;
}
h1
{
color:black;
text-align: center;
font-weight: bolder;
margin-top: -20px;
}
label{
font-size: 20px;
}
SIGNUP.HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap-responsive.css">
<link href="{% static 'css/signup.css' %}" rel="stylesheet">
<style>
body{
background: url("{% static 'images/laptop.jpg' %}") no-repeat;
width:100%;
height: 100%;
}
</style>
<title>SIGNUP PAGE</title>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-2"></div>
<div class="row" style="margin-left: 12px; box-shadow: -1px 1px 50px 10px;">
<form id="myform" action="/signup_data/" method="post">{% csrf_token %}
<h1 style="font-family: new time roman;font-weight:
20px;color:black;">SIGNUP</h1>
<label class="label control-label"
style="weight:80px;"><b>UserName</b></label>
<input type="text" class="form-control" name="user"
placeholder="Username">
<label class="label control-label"><b>Email</b></label>
<input type="text" class="form-control" name="email" placeholder="Email">
<label class="label control-label"><b>Password</b></label>
<input type="text" class="form-control" name="pass"
placeholder="Password">
<label class="label control-label"><b>Contact</b></label>
<input type="text" class="form-control" name="contact"
placeholder="Contact">
<button type="submit" class="btn btn-info btn-sm ">SIGNUP</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
CSS
body{
background:url("images/laptop.jpg") no-repeat;
background-attachment: fixed;
background-size: cover;
}
.col-md-6{
font-size: 30px;
font-family:new time roman;
}
.col-md-6:hover{
color:red;
}
.label{
font-family:Edwardian Script ITC;
font-size: 30px;
color: black;
font-weight: 60px;
}
.form-control{
background :transparent;
border-radius: 0px;
border:0px;
border-bottom:2px solid #ffb6c1;
margin-bottom:30px;
height: 10px;
color:black;
padding:20px;
margin-right: 300px;
}
.btn-info{
background: transparent;
border:2px solid #ffb6c1;
width: 30px
font-size:40px;
}
.col-md-8{
margin-top: 55px;
border:3px solid white;
opacity: 0.8;
margin-left:300px;
background:transparent;
margin-bottom: 50px;
height: 70px;
padding-left: 20px;
}
img{
width: 450px;
height: 477px;
}
Welcome
<html>
<head>
<title>Blood donation project</title>
<link rel="stylesheet" href="{% static 'css/loginnext.css' %}" type="text/css">

</head>
<body>
<nav class="navbar navbar-default">
<img src="{% static 'images/blood.png' %}" style="height:200; width:200; margin-top:-25px;">
<div class="navbar-header">
<a class="navbar-brand" href="#">
</a>
</div>
<ul class="nav navbar-nav navbar-right" >
<li><a href="/password/">Change Password</a></li>
<li><a href="/update/">Update Profile</a></li>
<li><a href="#">Blood Donate</a></li>

<li><a href="/viewdonation/">View Donation</a></li>
<li><a href="#">View Request</a></li>

<li><a href="#">Logout</a></li>
</ul>
</div>
</div>
</nav>
<div class="row">
<div class="welcome-section">
<img src="{% static 'images/wall2.jpg' %}" class="img-responsive">
<div class="text"><h1><b> WELCOME TO DONOR </b></h1></div>
</div>
</div>
</body>
</html>
CSS
.navbar{
width:100%;
height:100px;
top:0;
z-index:1;
position:absolute;
opacity:0.7;
background-color: white;
}
.nav.navbar-nav li a{
color: black;
font-size: 15px;
margin-top: 15px;
}
.welcome-section {
height: 1080px;
background-color: silver;
}
.text h1
{
color:white;
font-size: 50px;
font-weight: 600px;
text-align: center;
position: absolute;
left:450px;
bottom: 50px;
margin-top: 0px;
}
.hovereffect {
width: 400px;
height: 208px;
float: left;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
.hovereffect .overlay {
width: 400px;
height: 208px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
opacity: 0;
}
.hovereffect img {
display: block;
position: relative;
}
.hovereffect h2 {
color: #fff;
text-align: center;
position: relative;
font-size: 17px;
padding: 10px;
}
.hovereffect a.info {
padding: 7px 14px;
color: #fff;
margin: 50px 0 0 0;
}
.hovereffect a.info:hover {
}
.hovereffect:hover .overlay {
opacity: 1;
}
.hovereffect:hover h2 {
}
Change password
<html>
<head>

<link rel="stylesheet" href="{% static 'css/password.css' %}" type="text/css">
<style>
.bg{
width:100%;
height: 100%;
}
</style>
</head>
<body>
<div class="row">
<form id="pass" action="/passdata/" method="post">{% csrf_token %}
<h2>CHANGE PASSWORD</h2>
<input type="email" class="form-control" id = "username" name="mail"
</div>
<label>Password</label>
<input type="password" class="form-control" name="pass" id
="password" placeholder="Password">
</div>
<label>Confirm Password</label>
<input type="password" class="form-control" name="confirm" placeholder=" Confirm
Password">
</div>
<button type="submit" id ="submit" class="btn btn-success btn-
block">Submit</button><br>
</form>
</div>
</div>
</div>
</body>
</html>
CSS
#pass{
border: 2px solid white;
padding: 60px 40px;
margin-top: 80px;
}
.img{
width:150px;
margin: auto;
opacity: 0.6;
}
h2
{
color:black;
text-align: center;
font-weight: bolder;
margin-top: -30px;
}
label{
font-size: 20px;
Update profile
<html>
<head>

<link rel="stylesheet" href="{% static 'css/update.css' %}" type="text/css">
<style>
.bg{
width:100%;
height: 100%;
}
</style>
</head>
<body>
<div class="row">
<form id="update" action="/updprof/" method="post" >{% csrf_token %}
<h2>UPDATE PROFILE</h2>
<label>Name</label>
<input type="Name" class="form-control" name="nam" id = "username"
placeholder="name">
</div>
<input type="email" class="form-control" name="mail" id ="email"
</div>
<label>Contact no.</label>
<input type="contact" class="form-control" name="contact" placeholder=" Contact">
<label>Address</label>
<input type="address" class="form-control" name="addres" id ="address"
placeholder="Address">
</div>
</div>
<button type="submit" id ="submit" class="btn btn-success btn-
block">Submit</button><br>
</form>
</div>
</div>
</div>
</body>
</html>
Blood donate
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="css/bootstrap-responsive.css">
<link href="project.css" rel="stylesheet" />
</head>
<style>
body {
}
body img{
opacity: 0.3;
}
.h1{
font-size: 40px;
color:grey;
margin-top: 20px;
}
.label{
font-size: 20px;
color:red;
margin-top:15px;
font-weight: normal;
margin-left: 20px;
}
.col-md-6{
background: rgba(0,0,0,0);
height: 680px;
box-shadow: -1px 1px 20px 10px black inset;
color: white;
margin-top: -700px;
}
.form-control{
border-radius: 0px;
border-bottom:2px solid red;
font-size:21px;
color:black;
position: relative;
top: -55px;
margin-left: 130px;
}
.btn-info{
margin-top: 20px;
width: 180px;
font-size: 19px;
border-radius: 1000px;
}
.btn{
background-color: black;
}
</style>
<body>
<img src="laptop3.jpg" style="height: 780px; width: 100%; background-size:cover;opacity:1;">
<div class="row"></div>
<h1 class="text-center" style="font-family:Edwardian Script ITC; color: red; font-weight:
70px; font-size: 85px;">Blood Donate</h1>
<label class="label col-md-3 control-label">CAMP NAME</label>
<input type="name" class="form-control" name="Name" placeholder="Camp
name"></label>
<label class="label col-md-3 control-label">DATE</label>

<input type="Date" class="form-control" name="Date"
placeholder="Date"></label>
<label class="label col-md-3 control-label">NO. OF UNITS</label>

<input type="No of unit" class="form-control" name="No of unit"
placeholder="No of unit"></label>
<button class="btn btn-danger">Save</button>
</div>
</div>
</body>
</html>
Donar
<!DOCTYPE html>
<html>
<head>
<title>donar page</title>
<style>
body{
background-image:url("{% static 'images/drop.jpg' %}");
background-attachment: fixed;
background-size: cover;
font-size: new time roman;
}
.h1{
font-size: 40px;
color:grey;
margin-top: 20px;
}
.label{
font-size: 20px;
color:red;
margin-top:15px;
font-weight: normal;
}
.col-md-6{
background: rgba(0,0,0,0);
height: 680px;
box-shadow: -1px 1px 20px 10px black inset;
color: white;
margin-top: 80px;
}
.form-control{
border-radius: 0px;
border-bottom:2px solid white;
font-size:21px;
color:white;
margin-top: 20px;
}
.btn-info{
margin-top: 20px;
width: 180px;
font-size: 19px;
border-radius: 1000px;
}
.btn{
background-color: black;
}
</style>
</head>
<body>
<div class="row">
</div>
<div class="form">
<form id="myform" action="/donarr/" method="POST">{% csrf_token %}
<h1 class="text-center " style="font-family:Edwardian Script ITC; color: red; font-

weight: 40px; font-size: 85px;">Donar Registration</h1>
<label class="label col-md-3 control-label">Name</label>
<input type="name" class="form-control" name="name" placeholder="Name">
</div>
<label class="label col-md-3 control-label">Age</label>

<input type="age" class="form-control" name="age" placeholder="Age">
</div>
<label class="label col-md-3 control-label">Gender</label>

<input type="gender" class="form-control" name="gender"
placeholder="Gender">
</div>
<label class="label col-md-3 control-label">Weight</label>

<input type="weight" class="form-control" name="weight"
placeholder="Weight" >
</div>
<label class="label col-md-3 control-label">Blood Group</label>

<input type="blood" class="form-control" name="blood"
placeholder="Blood Group" >
</div>
<label class="label col-md-3 control-label">State</label>

<input type="State" class="form-control" name="state"
placeholder="State">
</div>
<label class="label col-md-3 control-label">Address</label>
<input type="address" class="form-control" name="address"
placeholder="Address">
</div>
<button type="button" class="btn btn-lg" style="margin-top:
60px; color:red; margin-bottom: 40px; margin-left:65px">SUBMIT</button>
</form>
</div>
</div>
</body>
</html>
10. Testing
Testing is the major quality measure employed during the software engineering development. Its basic
function is to detect error in the software. Testing is necessary for the proper functioning of the
system. Testing has to be done at four levels.
Unit Testing
Unit testing focuses verification effort on the smallest unit of the software, design the
module. Here, using the detail design as a guide ,important control paths are tested to uncover errors
within the boundary of the module. Unit testing is always white-box oriented, and the step can be
conducted in parallel for multiple modules.
Integration Testing
Integration testing is a systematic technique for constructing the program structure while
at the same time conducting tests to uncover errors, associated with interfacing .The objective is to
take the unit tested modules and build program structure that has been directed by the design.
 Validation Testing
Validation testing demonstrates the traces the requirements of the software .This can be
achieved through a series of black box tests.
 System Testing
System testing is actually a series of different tests whose primary purpose is to fully
exercise the computer-based system. Although each test has a different purpose, all works should
verify that all system elements have been properly integrated and perform allocated functions. The
various tests include recovery testing, stress testing , perform testing.
11. Maintainence and Implementation
 Corrective maintenance
This acts to correct errors that are uncovered after the software is in use.
 Adaptive Maintenance
This is applied when changes is the external environment precipitate modifications to
software.
 Preventive maintenance
This improves future maintainability and reliability and provides basis for future
enhancements.
12. Future Scope
In Future,we can also linked this through internet,so that the other hospitals ,and other organizations
can also use this data.We can intended to draw graph and print monthly statistical analysis details
and to take backup database in another computer.We can add more modules in our website. And also
some user verification steps for the security purpose and user can get notifications into their
registered mobile number. Another future enhancement is that we can make are website for all over
the world.
13. CONCLUSION
Blood is a precious gift given by a blood donar.There are many people working behind the
scenes to get you the right blood at right time. The main aim of developing this system
is to provide blood to the people who are in need of blood. The number of persons who
are in need of blood are increasing in large number day by day. Using this system
user can search blood group available in the city and he can also get contact number
of the donor who has the same blood group he needs. In order to help people who are
in need of blood, this Online Red Blood Buddies system can be used effectively for
getting the details of available blood groups and user can also get contact number of
the blood donors having the same blood group and within the same city. So if the
blood group is not available in the blood bank user can request the donor to donate
the blood to him and save someone life. Using this system people can register himself
or herself who want to donate blood. To register in the system they have to enter their
contact information like address mobile number etc.
14. Bibliography
https://www.tutorialspoint.com/python/
https://www.w3schools.com/python/
https://realpython.com/tutorials/django/
https://tutorial.djangogirls.org/en/
Python:-The Complete reference book

-by(Martin c.Brown)
• www.codeproject.com

Red Blood Buddies

Загружено:

Сведения о документе

Исходное описание:

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Red Blood Buddies

Загружено:

Авторское право:

Доступные форматы

Project Report

Master of Computer Applications

Under the Supervision of

M.M. Institute of Computer Technology &Business Management

Date: Ms.Paluck Arora

ThinkNEXT Technologies Pvt. Ltd. is a Software/Electronics Systems Development Company (MNC)

2.1 Project overview

2.3 General Description

3.1 Need of the System

3.2 Proposed system

4.2 Software Requirements

Platform Used Windows 10 or higher

Database DB Browser for SQlite

Languages Used Python,

Framework Used Django

5.1 Introduction to Python

5.3 Introduction to CSS

 JavaScript is a lightweight, interpreted programming language.

5.5 Introduction to HTML

Manage Blood bank

Red Blood Buddies

Make new Blood Donation

Red Blood Buddies

Request for blood

7.1 Front-End Designing

Name :- User login module

<title>Blood donation project</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="blood.css" type="text/css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-/4.7.0/css/font-

<nav class="navbar navbar-default">

<a class="navbar-brand" href="#">

<li class='dropdown'><a class='dropdown-toggle' data-toggle='dropdown' href="#">Request<span

<li><a href="#">Contact us</a></li>

<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">

.hovereffect1:hover h2,.hovereffect1:hover a.info {

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-/4.7.0/css/font-

<title>Blood donation project</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="{% static 'css/loginnext.css' %}" type="text/css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-/4.7.0/css/font-

<a class="navbar-brand" href="#">

<ul class="nav navbar-nav navbar-right" >

<li><a href="/password/">Change Password</a></li>

<li><a href="/update/">Update Profile</a></li>

<li><a href="#">Blood Donate</a></li>

<li><a href="#">View Request</a></li>

<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome-

<meta name="viewport" content="width=device-width, initial-scale=1">

<label class="label col-md-3 control-label">DATE</label>

<label class="label col-md-3 control-label">NO. OF UNITS</label>

<button class="btn btn-danger">Save</button>

<h1 class="text-center " style="font-family:Edwardian Script ITC; color: red; font-

<label class="label col-md-3 control-label">Age</label>

<label class="label col-md-3 control-label">Gender</label>

<label class="label col-md-3 control-label">Weight</label>

<label class="label col-md-3 control-label">Blood Group</label>

<label class="label col-md-3 control-label">State</label>

11. Maintainence and Implementation

Python:-The Complete reference book