├── _config.yml ├── user.png ├── user2.png ├── js ├── usr_login.js ├── admin_login.js ├── add_book.js ├── user_main.js ├── user_login.js └── admin_portal.js ├── Readme.md ├── css ├── main_page.css ├── user_main.css ├── admin_portal.css ├── usr_login.css ├── admin_login.css ├── add_book.css └── buy_book.css ├── admin_login.html ├── 404.html ├── usr_login.html ├── user_portal.html ├── buy_book.html ├── index.html ├── admin_portal.html └── add_book.html /_config.yml: -------------------------------------------------------------------------------- 1 | theme: jekyll-theme-cayman -------------------------------------------------------------------------------- /user.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rajpra808/Library-Management-System/HEAD/user.png -------------------------------------------------------------------------------- /user2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rajpra808/Library-Management-System/HEAD/user2.png -------------------------------------------------------------------------------- /js/usr_login.js: -------------------------------------------------------------------------------- 1 | 2 | $(document).ready(function () { 3 | $('.message a').click(function(){ 4 | $('form').animate({height: "toggle", opacity: "toggle"}, "slow"); 5 | }); 6 | //your code here 7 | }); 8 | -------------------------------------------------------------------------------- /Readme.md: -------------------------------------------------------------------------------- 1 | # Library Management System 2 | 3 | 4 | 5 | # Programming Language and Tools 6 | 7 | - HTML 8 | - CSS 9 | - JavaScript 10 | - Firebase 11 | - Firestore 12 | --- 13 | # How to check 14 | 1. clone the Repo or download Zip file 15 | 2. open index.html 16 | 3. for admin use 17 | - Username : admin@gmail.com 18 | - Password : admin@123 19 | 20 | 4. for user account register a new user 21 | --- 22 | 23 | # direct link 24 | 25 | https://rajpra786.github.io/Library-Management-System/index.html 26 | 27 | --- 28 | # Contributors 29 | - ##### Rajendra Prajapat 30 | - ##### Dheeraj Chaudhary 31 | - ##### Priya Tiru 32 | - ##### Rajdeep Das 33 | - ##### Shashank N S 34 | 35 | ##### Supervised By- Prof. Channappa B AKKI 36 | ###### Academic Year: 2018-2019 37 | -------------------------------------------------------------------------------- /css/main_page.css: -------------------------------------------------------------------------------- 1 | body{ 2 | text-align: center; 3 | 4 | } 5 | 6 | .main_user_block{ 7 | max-width: 500px; 8 | background: white; 9 | padding: 10px; 10 | border-style: groove; 11 | color: #cfcfd1; 12 | width: 20%; 13 | height: 30%; 14 | text-align: center; 15 | display: inline-block; 16 | margin:auto; 17 | border-radius: 5px; 18 | } 19 | #portal{ 20 | font-size:300%; 21 | font-family: "Trebuchet MS", Helvetica, sans-serif; 22 | } 23 | #user{ 24 | position: fixed; 25 | top: 50%; 26 | left: 50%; 27 | 28 | } 29 | #admin{ 30 | position: fixed; 31 | top: 50%; 32 | left: 25%; 33 | } 34 | 35 | .login_button{ 36 | background-color: #c3c6cc; /* white */ 37 | border: none; 38 | border-radius: 5px; 39 | color: white; 40 | text-align: center; 41 | text-decoration: none; 42 | display: inline-block; 43 | font-size: 16px; 44 | margin: 4px 2px; 45 | cursor: pointer; 46 | padding: 15px; 47 | } 48 | -------------------------------------------------------------------------------- /admin_login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Admin Login 7 | 8 | 10 | 11 | 12 | 13 | 14 |

Online Library Portal

15 |
16 | 17 |
18 |
19 |
20 |

Admin Authentication

21 |
22 |
23 | 24 | 29 |
30 |
31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /css/user_main.css: -------------------------------------------------------------------------------- 1 | body 2 | { 3 | background: #D0CFCE; 4 | } 5 | 6 | .image_user{ 7 | float: right; 8 | padding-right: 5%; 9 | } 10 | 11 | .heading{ 12 | position: relative; 13 | display: inline-block; 14 | text-align: center; 15 | } 16 | .main_header{ 17 | text-align: center; 18 | } 19 | 20 | .right { 21 | background: white; 22 | padding: 10px; 23 | border-style: dotted; 24 | color: black; 25 | display: block; 26 | margin-left: 100px; 27 | width: auto; 28 | height: 50%; 29 | } 30 | #Result{ 31 | overflow-x: hidden; 32 | overflow-x: auto; 33 | text-align:justify; 34 | } 35 | 36 | .left { 37 | background: white; 38 | padding: 10px; 39 | border-style: dotted; 40 | color: black; 41 | width: 60%; 42 | height: 50%; 43 | float: left; 44 | display: inline-block; 45 | margin:auto; 46 | } 47 | 48 | #portal{ 49 | font-size:300%; 50 | font-family: "Trebuchet MS", Helvetica, sans-serif; 51 | } 52 | 53 | #log_button { 54 | width: 85px; 55 | background-color: #4CAF50; 56 | } 57 | 58 | .BUTTON{ 59 | font-size: 15px; 60 | color: black; 61 | padding: 15px; 62 | -webkit-transition-duration: 0.4s; /* Safari */ 63 | transition-duration: 0.4s; 64 | text-decoration: none; 65 | overflow: hidden; 66 | cursor: pointer; 67 | } 68 | 69 | 70 | @import url('https://fonts.googleapis.com/css?family=Bangers'); 71 | *,*::before,*::after{ 72 | margin:0; 73 | box-sizing:border-box; 74 | } 75 | 76 | #header-file{ 77 | margin: 50px; 78 | } 79 | 80 | body{ 81 | margin: 10px; 82 | font-family: 'Bangers', cursive; 83 | } -------------------------------------------------------------------------------- /404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Page Not Found 7 | 8 | 23 | 24 | 25 |
26 |

404

27 |

Page Not Found

28 |

The specified file was not found on this website. Please check the URL for mistakes and try again.

29 |

Why am I seeing this?

30 |

This page was generated by the Firebase Command-Line Interface. To modify it, edit the 404.html file in your project's configured public directory.

31 |
32 | 33 | 34 | -------------------------------------------------------------------------------- /js/admin_login.js: -------------------------------------------------------------------------------- 1 | //admin@123 2 | 3 | $(document).ready(function(){ 4 | var firebaseConfig = { 5 | apiKey: "AIzaSyBin1evT-H6jfR49WIhtVPsGMLzbEklIQY", 6 | authDomain: "library-management-syste-f2a85.firebaseapp.com", 7 | databaseURL: "https://library-management-syste-f2a85.firebaseio.com", 8 | projectId: "library-management-syste-f2a85", 9 | storageBucket: "library-management-syste-f2a85.appspot.com", 10 | messagingSenderId: "914416876417", 11 | appId: "1:914416876417:web:bf9e7762c1c283ba" 12 | }; 13 | // Initialize Firebase 14 | firebase.initializeApp(firebaseConfig); 15 | var db = firebase.firestore(); 16 | 17 | $("#login-form").submit(function(e) { 18 | e.preventDefault(); 19 | }); 20 | 21 | $('#submit_data').click(function() { 22 | login(); 23 | }); 24 | 25 | $('#back_button').click(function() 26 | { 27 | logout(); 28 | }); 29 | 30 | firebase.auth().onAuthStateChanged(user => { 31 | if(user) { 32 | window.location = 'admin_portal.html'; //After successful login, user will be redirected to home.html 33 | } 34 | }); 35 | 36 | }); 37 | 38 | function login(){ 39 | var email = document.getElementById("username").value; 40 | var password = document.getElementById("password").value; 41 | 42 | if(email === "admin@gmail.com") 43 | { 44 | firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) { 45 | // Handle Errors here. 46 | var errorCode = error.code; 47 | var errorMessage = error.message; 48 | window.alert(errorMessage); 49 | }); 50 | } 51 | 52 | } 53 | function logout() 54 | { 55 | firebase.auth().signOut().then(function() { 56 | // Sign-out successful. 57 | }).catch(function(error) { 58 | // An error happened. 59 | }); 60 | } 61 | -------------------------------------------------------------------------------- /js/add_book.js: -------------------------------------------------------------------------------- 1 | $(document).ready(function() { 2 | var firebaseConfig = { 3 | apiKey: "AIzaSyBin1evT-H6jfR49WIhtVPsGMLzbEklIQY", 4 | authDomain: "library-management-syste-f2a85.firebaseapp.com", 5 | databaseURL: "https://library-management-syste-f2a85.firebaseio.com", 6 | projectId: "library-management-syste-f2a85", 7 | storageBucket: "library-management-syste-f2a85.appspot.com", 8 | messagingSenderId: "914416876417", 9 | appId: "1:914416876417:web:bf9e7762c1c283ba" 10 | }; 11 | // Initialize Firebase 12 | firebase.initializeApp(firebaseConfig); 13 | 14 | var db = firebase.firestore(); 15 | 16 | $("#book-form").submit(function(e) { 17 | e.preventDefault(); 18 | }); 19 | 20 | $('#submit').click(function() { 21 | add_this(); 22 | }); 23 | 24 | firebase.auth().onAuthStateChanged(user => { 25 | if(!user) { 26 | window.location = 'index.html'; 27 | } 28 | }); 29 | 30 | }); 31 | 32 | function add_this() 33 | { 34 | var BookCode = document.getElementById("book_code").value; 35 | var BookName = document.getElementById("book_name").value; 36 | var Author1 = document.getElementById("author1").value; 37 | var Author2 = document.getElementById("author2").value; 38 | var Subject = document.getElementById("Subject").value; 39 | var tags = document.getElementById("tags").value; 40 | var db = firebase.firestore(); 41 | 42 | db.collection("books").doc(BookCode).set({ 43 | bookcode: BookCode, 44 | bookname : BookName, 45 | author1: Author1, 46 | author2: Author2, 47 | subject : Subject, 48 | tags : tags 49 | }) 50 | .then(function() { 51 | console.log("Document successfully written!"); 52 | window.alert("Successfully Book Added"); 53 | window.location = 'admin_portal.html'; 54 | }) 55 | .catch(function(error) { 56 | console.error("Error writing document: ", error); 57 | }); 58 | } 59 | -------------------------------------------------------------------------------- /css/admin_portal.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: #D0CFCE; 3 | } 4 | .image_user{ 5 | float: right; 6 | padding-right: 5%; 7 | } 8 | 9 | .heading{ 10 | position: relative; 11 | display: inline-block; 12 | text-align: center; 13 | } 14 | .main_header{ 15 | text-align: center; 16 | } 17 | 18 | .main_user_block{ 19 | max-width: 1000px; 20 | background: white; 21 | padding: 10px; 22 | border-style: dotted; 23 | color: #cfcfd1; 24 | width: 50%; 25 | height: 50%; 26 | text-align: center; 27 | display: inline-block; 28 | margin:auto; 29 | border-radius: 5px; 30 | } 31 | #portal{ 32 | font-size:300%; 33 | font-family: "Trebuchet MS", Helvetica, sans-serif; 34 | } 35 | #Result{ 36 | position: fixed; 37 | top: 40%; 38 | left: 25%; 39 | color:black; 40 | overflow-x: hidden; 41 | overflow-x: auto; 42 | text-align:justify; 43 | } 44 | .Search{ 45 | position: fixed; 46 | width: 20%; 47 | display: block; 48 | margin: 0 auto; 49 | } 50 | 51 | #Students_search{ 52 | top:32%; 53 | left:25%; 54 | } 55 | #Books_search{ 56 | top:32%; 57 | left:55%; 58 | } 59 | 60 | input#search-bar{ 61 | margin: 0 auto; 62 | width: 80%; 63 | height: 25px; 64 | padding: 0 20px; 65 | font-size: 1rem; 66 | border: 1px solid #D0CFCE; 67 | outline: none; 68 | } 69 | 70 | .search-icon{ 71 | position: relative; 72 | float: right; 73 | width: 50px; 74 | height: 50px; 75 | top: -37px; 76 | 77 | } 78 | 79 | 80 | #log_button { 81 | width: 85px; 82 | background-color: #4CAF50; 83 | } 84 | 85 | .BUTTON{ 86 | font-size: 15px; 87 | color: black; 88 | padding: 15px; 89 | -webkit-transition-duration: 0.4s; /* Safari */ 90 | transition-duration: 0.4s; 91 | text-decoration: none; 92 | overflow: hidden; 93 | cursor: pointer; 94 | } 95 | 96 | #add_book_button{ 97 | border: ridge; 98 | margin-left: 7%; 99 | margin-top: 8%; 100 | width: 12%; 101 | } 102 | #buy_book{ 103 | width: 12%; 104 | border: ridge; 105 | margin-left: 7%; 106 | margin-top: 5%; 107 | } 108 | 109 | 110 | ul{ 111 | padding-left: 10px; 112 | padding-right: 10px; 113 | } 114 | -------------------------------------------------------------------------------- /css/usr_login.css: -------------------------------------------------------------------------------- 1 | @import url(https://fonts.googleapis.com/css?family=Roboto:300); 2 | 3 | #portal{ 4 | text-align: center; 5 | font-size:300%; 6 | font-family: "Trebuchet MS", Helvetica, sans-serif; 7 | } 8 | 9 | .login-page { 10 | width: 360px; 11 | padding: 8% 0 0; 12 | margin-left: 35%; 13 | margin-top: -10%; 14 | } 15 | .form { 16 | position: relative; 17 | z-index: 1; 18 | max-width: 360px; 19 | background: #FFFFFF; 20 | margin: 0 auto 100px; 21 | padding: 45px; 22 | text-align: center; 23 | box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24); 24 | } 25 | .form input { 26 | font-family: "Roboto", sans-serif; 27 | outline: 0; 28 | background: #f2f2f2; 29 | width: 100%; 30 | border: 0; 31 | margin: 0 0 15px; 32 | padding: 15px; 33 | box-sizing: border-box; 34 | font-size: 14px; 35 | } 36 | button { 37 | background-color: #86d1e0; /* white */ 38 | border: solid; 39 | border-radius: 5px; 40 | color: white; 41 | text-align: center; 42 | text-decoration: none; 43 | display: inline-block; 44 | font-size: 16px; 45 | margin: 4px 2px; 46 | cursor: pointer; 47 | padding: 15px; 48 | } 49 | 50 | #back_button:hover{ 51 | background: green; 52 | } 53 | .form button:hover,.form button:active,.form button:focus { 54 | background: green; 55 | width: 100%; 56 | } 57 | .form .message { 58 | margin: 15px 0 0; 59 | color: #b3b3b3; 60 | font-size: 12px; 61 | } 62 | .form .message a { 63 | color: #4CAF50; 64 | text-decoration: none; 65 | } 66 | .form .register-form { 67 | display: none; 68 | } 69 | .container { 70 | position: relative; 71 | z-index: 1; 72 | max-width: 300px; 73 | margin: 0 auto; 74 | } 75 | .container:before, .container:after { 76 | content: ""; 77 | display: block; 78 | clear: both; 79 | } 80 | .container .info { 81 | margin: 50px auto; 82 | text-align: center; 83 | } 84 | .container .info h1 { 85 | margin: 0 0 15px; 86 | padding: 0; 87 | font-size: 36px; 88 | font-weight: 300; 89 | color: #1a1a1a; 90 | } 91 | .container .info span { 92 | color: #4d4d4d; 93 | font-size: 12px; 94 | } 95 | .container .info span a { 96 | color: #000000; 97 | text-decoration: none; 98 | } 99 | .container .info span .fa { 100 | color: #EF3B3A; 101 | } 102 | body { 103 | font-family: "Roboto", sans-serif; 104 | } 105 | -------------------------------------------------------------------------------- /css/admin_login.css: -------------------------------------------------------------------------------- 1 | @import url(https://fonts.googleapis.com/css?family=Roboto:300); 2 | 3 | #portal{ 4 | text-align: center; 5 | font-size:300%; 6 | font-family: "Trebuchet MS", Helvetica, sans-serif; 7 | } 8 | 9 | .login-page { 10 | width: 360px; 11 | padding: 8% 0 0; 12 | margin-left: 35%; 13 | margin-top: -10%; 14 | } 15 | .form { 16 | position: relative; 17 | z-index: 1; 18 | background: #FFFFFF; 19 | max-width: 360px; 20 | margin: 0 auto 100px; 21 | padding: 45px; 22 | text-align: center; 23 | box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24); 24 | } 25 | .form input { 26 | font-family: "Roboto", sans-serif; 27 | outline: 0; 28 | background: #f2f2f2; 29 | width: 100%; 30 | border: 0; 31 | margin: 0 0 15px; 32 | padding: 15px; 33 | box-sizing: border-box; 34 | font-size: 14px; 35 | } 36 | button { 37 | background-color: #86d1e0; /* white */ 38 | border: solid; 39 | border-radius: 5px; 40 | color: white; 41 | text-align: center; 42 | text-decoration: none; 43 | display: inline-block; 44 | font-size: 16px; 45 | margin: 4px 2px; 46 | cursor: pointer; 47 | padding: 15px; 48 | } 49 | 50 | #back_button:hover{ 51 | background: green; 52 | } 53 | .form button:hover,.form button:active,.form button:focus { 54 | background: green; 55 | width: 100%; 56 | } 57 | .form .message { 58 | margin: 15px 0 0; 59 | color: #b3b3b3; 60 | font-size: 12px; 61 | } 62 | .form .message a { 63 | color: #4CAF50; 64 | text-decoration: none; 65 | } 66 | .form .register-form { 67 | display: none; 68 | } 69 | .container { 70 | position: relative; 71 | z-index: 1; 72 | max-width: 300px; 73 | margin: 0 auto; 74 | } 75 | .container:before, .container:after { 76 | content: ""; 77 | display: block; 78 | clear: both; 79 | } 80 | .container .info { 81 | margin: 50px auto; 82 | text-align: center; 83 | } 84 | .container .info h1 { 85 | margin: 0 0 15px; 86 | padding: 0; 87 | font-size: 36px; 88 | font-weight: 300; 89 | color: #1a1a1a; 90 | } 91 | .container .info span { 92 | color: #4d4d4d; 93 | font-size: 12px; 94 | } 95 | .container .info span a { 96 | color: #000000; 97 | text-decoration: none; 98 | } 99 | .container .info span .fa { 100 | color: #EF3B3A; 101 | } 102 | body { 103 | font-family: "Roboto", sans-serif; 104 | } 105 | -------------------------------------------------------------------------------- /usr_login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Online Library Portal 11 | 12 | 13 | 14 |

Online Library Portal

15 |
16 | 17 | 18 | 19 |
20 |
21 |
22 |

User Authentication

23 |
24 |
25 |
26 | 27 | 28 | 29 | 30 | 31 | 32 |

Already registered? Sign In

33 |
34 | 35 | 41 | 42 |
43 |
44 | 45 | 46 | 47 | 48 | 49 | 50 | 52 | 53 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /user_portal.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | User Main page 4 | 5 | 6 | 8 | 9 | 10 |
11 |
12 | 13 |
14 | 15 |
16 |
17 | 18 | 22 |

My Profile

23 |
24 | 25 |
26 |

Online Library (User) Portal

27 |
28 |
29 | 30 |
31 |
32 | 33 |
34 | 35 |
36 |

Books

37 | 39 |
40 | 41 |
42 |

User Profile

43 |
44 |
45 |
46 | 47 |
48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | -------------------------------------------------------------------------------- /js/user_main.js: -------------------------------------------------------------------------------- 1 | $(document).ready(function() { 2 | 3 | var firebaseConfig = { 4 | apiKey: "AIzaSyBin1evT-H6jfR49WIhtVPsGMLzbEklIQY", 5 | authDomain: "library-management-syste-f2a85.firebaseapp.com", 6 | databaseURL: "https://library-management-syste-f2a85.firebaseio.com", 7 | projectId: "library-management-syste-f2a85", 8 | storageBucket: "library-management-syste-f2a85.appspot.com", 9 | messagingSenderId: "914416876417", 10 | appId: "1:914416876417:web:bf9e7762c1c283ba" 11 | }; 12 | // Initialize Firebase 13 | firebase.initializeApp(firebaseConfig); 14 | 15 | var db = firebase.firestore(); 16 | 17 | 18 | db.collection("books").get().then(function(querySnapshot) { 19 | querySnapshot.forEach(function(doc) { 20 | $('#books').append( 21 | "

"+doc.data().bookcode+"-" +doc.data().bookname+"

"+ 22 | "

"+doc.data().author1 + " , " +doc.data().author2 +"

"+ 23 | "

"+doc.data().subject+"

"+ 24 | "

" + doc.data().tags + "

"+ 25 | "

"); 26 | }); 27 | }); 28 | 29 | 30 | firebase.auth().onAuthStateChanged(user => { 31 | if(user) { 32 | db.collection("users").where("Email","==",user.email) 33 | .get() 34 | .then(function(querySnapshot) { 35 | querySnapshot.forEach(function(doc) { 36 | // doc.data() is never undefined for query doc snapshots 37 | console.log(doc.id, " => ", doc.data()); 38 | var book = []; 39 | book = doc.data().books; 40 | books_set = ""; 46 | 47 | $('#about_me').append( 48 | "

"+"Name :" +doc.data().name+"

"+ 49 | "

"+"Roll Number : "+doc.data().Roll_Number+"

"+ 50 | "

"+"Date of Birth : " + doc.data().DOB +"

"+ 51 | "

"+"E-mail Id: " + doc.data().Email +"


"+ 52 | "

Books

" + 53 | books_set+ 54 | "
"); 55 | }); 56 | }) 57 | .catch(function(error) { 58 | console.log("Error getting documents: ", error); 59 | }); 60 | 61 | 62 | } 63 | }); 64 | firebase.auth().onAuthStateChanged(user => { 65 | if(!user) { 66 | window.location = 'index.html'; 67 | } 68 | }); 69 | $('#log_button').click(function() 70 | { 71 | logout(); 72 | }); 73 | 74 | }); 75 | 76 | function logout() 77 | { 78 | firebase.auth().signOut().then(function() { 79 | console.log("logout done"); 80 | window.location = 'admin_login.html'; 81 | }).catch(function(error) { 82 | console.log("error"); 83 | }); 84 | } 85 | -------------------------------------------------------------------------------- /css/add_book.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: #D0CFCE; 3 | } 4 | .image_user{ 5 | float: right; 6 | padding-right: 5%; 7 | } 8 | 9 | .heading{ 10 | position: relative; 11 | display: inline-block; 12 | text-align: center; 13 | } 14 | .main_header{ 15 | text-align: center; 16 | } 17 | 18 | .main_user_block{ 19 | max-width: 1000px; 20 | background: white; 21 | padding: 10px; 22 | border-style: dotted; 23 | color: #cfcfd1; 24 | width: 50%; 25 | height: 50%; 26 | text-align: center; 27 | display: inline-block; 28 | margin:auto; 29 | border-radius: 5px; 30 | } 31 | #portal{ 32 | font-size:300%; 33 | font-family: "Trebuchet MS", Helvetica, sans-serif; 34 | } 35 | #Result{ 36 | position: fixed; 37 | top: 40%; 38 | left: 25%; 39 | } 40 | 41 | #log_button { 42 | width: 85px; 43 | background-color: #4CAF50; 44 | } 45 | 46 | .BUTTON{ 47 | font-size: 15px; 48 | color: black; 49 | padding: 15px; 50 | -webkit-transition-duration: 0.4s; /* Safari */ 51 | transition-duration: 0.4s; 52 | text-decoration: none; 53 | overflow: hidden; 54 | cursor: pointer; 55 | } 56 | 57 | 58 | 59 | #book-form { 60 | display: grid; 61 | padding: 1em; 62 | background: #f9f9f9; 63 | border: none; 64 | margin: 2rem auto 0 auto; 65 | max-width: 600px; 66 | padding: 1em; 67 | box-shadow: -1px 1px 35px 7px rgba(94,94,94,0.4); 68 | } 69 | h1 { 70 | text-align: center; 71 | } 72 | p { 73 | grid-column: 2; 74 | } 75 | form input { 76 | background: #fff; 77 | border: 1px solid #9c9c9c; 78 | } 79 | form button { 80 | background: lightgrey; 81 | padding: 0.7em; 82 | width: 100%; 83 | border: 0; 84 | } 85 | form button:hover { 86 | background: black; 87 | cursor: pointer; 88 | color: white; 89 | } 90 | 91 | 92 | label { 93 | padding: 0.5em 0.5em 0.5em 0; 94 | } 95 | 96 | input { 97 | padding: 0.7em; 98 | margin-bottom: 0.5rem; 99 | } 100 | input:focus { 101 | outline: 3px solid black; 102 | } 103 | fieldset{ 104 | grid-column: 2 / 2; 105 | } 106 | textarea { 107 | grid-column: 2 / 2; 108 | height: 100px; 109 | } 110 | 111 | @media (min-width: 400px) { 112 | form { 113 | grid-template-columns: 200px 1fr; 114 | grid-gap: 16px; 115 | } 116 | 117 | label { 118 | text-align: right; 119 | grid-column: 1 / 2; 120 | } 121 | 122 | select { 123 | background: #ffff; 124 | border: 1px solid #9c9c9c; 125 | grid-column: 2/2; 126 | } 127 | 128 | input, 129 | button { 130 | grid-column: 2 / 3; 131 | } 132 | .upload-btn-wrapper { 133 | position: relative; 134 | overflow: hidden; 135 | display: inline-block; 136 | } 137 | 138 | .btn { 139 | border: 2px solid gray; 140 | color: gray; 141 | background-color: white; 142 | padding: 8px 20px; 143 | border-radius: 8px; 144 | font-size: 20px; 145 | font-weight: bold; 146 | } 147 | 148 | .upload-btn-wrapper input[type=file] { 149 | font-size: 100px; 150 | position: absolute; 151 | left: 0; 152 | top: 0; 153 | opacity: 0; 154 | } 155 | 156 | } 157 | 158 | 159 | 160 | -------------------------------------------------------------------------------- /buy_book.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Library Management System 9 | 10 | 11 | 12 |
13 | 14 |
15 |
16 |
17 | 18 | 22 |

My Profile

23 |
24 | 25 |
26 |

Online Library (Admin) Portal

27 |
28 | 29 |
30 | 31 |
32 | 33 | 34 |
35 |
36 |
37 |
38 |
39 | Profile Image 40 | 46 |
47 |

Contact Me

48 |
49 |
50 |
51 |
52 | 53 |
54 |
55 |
56 |
57 |
58 | Profile Image 59 | 65 |
66 |

Contact Me

67 |
68 |
69 |
70 |
71 | 72 | 73 | 74 | -------------------------------------------------------------------------------- /js/user_login.js: -------------------------------------------------------------------------------- 1 | 2 | $(document).ready(function() { 3 | 4 | // web app's Firebase configuration 5 | var firebaseConfig = { 6 | apiKey: "AIzaSyBin1evT-H6jfR49WIhtVPsGMLzbEklIQY", 7 | authDomain: "library-management-syste-f2a85.firebaseapp.com", 8 | databaseURL: "https://library-management-syste-f2a85.firebaseio.com", 9 | projectId: "library-management-syste-f2a85", 10 | storageBucket: "library-management-syste-f2a85.appspot.com", 11 | messagingSenderId: "914416876417", 12 | appId: "1:914416876417:web:bf9e7762c1c283ba" 13 | }; 14 | // Initialize Firebase 15 | firebase.initializeApp(firebaseConfig); 16 | 17 | var db = firebase.firestore(); 18 | 19 | //prevent default refresh of form 20 | $("#login-form").submit(function(e) { 21 | e.preventDefault(); 22 | }); 23 | 24 | $("#register-form").submit(function(e) { 25 | e.preventDefault(); 26 | }); 27 | 28 | 29 | //if user is logged in then go to user_portal 30 | firebase.auth().onAuthStateChanged(user => { 31 | if(user) { 32 | window.location = 'user_portal.html'; 33 | } 34 | }); 35 | 36 | $('#log_me_in').click(function() { 37 | login(); 38 | }); 39 | 40 | $('#register_new').click(function() { 41 | register_me(); 42 | }); 43 | 44 | $('#log_button').click(function() 45 | { 46 | logout(); 47 | }); 48 | 49 | 50 | }); 51 | 52 | function logout() 53 | { 54 | firebase.auth().signOut().then(function() { 55 | console.log("logout done"); 56 | window.location = 'usr_login.html'; 57 | }).catch(function(error) { 58 | console.log("error"); 59 | }); 60 | } 61 | 62 | function register_me(){ 63 | //get input data 64 | var db = firebase.firestore(); 65 | 66 | var name = document.getElementById("usr_name").value; 67 | var Password = document.getElementById("usr_pass").value; 68 | var Email = document.getElementById("usr_email").value; 69 | var Roll_number = document.getElementById("usr_roll").value; 70 | var date_of_birth = document.getElementById("usr_dob").value; 71 | var books = []; 72 | 73 | //firebase register 74 | firebase.auth().createUserWithEmailAndPassword(Email, Password).catch(function(error) { 75 | var errorCode = error.code; 76 | var errorMessage = error.message; 77 | window.alert("error ", errorMessage); 78 | }); 79 | 80 | db.collection("users").doc(Roll_number).set({ 81 | name: name, 82 | Email: Email, 83 | Roll_Number: Roll_number, 84 | DOB: date_of_birth, 85 | books: books 86 | }) 87 | .then(function() { 88 | console.log("Document successfully written!"); 89 | }) 90 | .catch(function(error) { 91 | console.error("Error writing document: ", error); 92 | }); 93 | 94 | } 95 | 96 | function login(){ 97 | var email = document.getElementById("username").value; 98 | var password = document.getElementById("password").value; 99 | 100 | if(email === "admin@gmail.com") 101 | { 102 | firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) { 103 | // Handle Errors here. 104 | var errorCode = error.code; 105 | var errorMessage = error.message; 106 | window.alert(errorMessage); 107 | }); 108 | } 109 | } 110 | 111 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Library Management System 8 | 9 | 10 |

Online Library Portal

11 |
12 | 13 |
14 | 15 | 19 |
20 | 21 | 22 | 23 |
24 | 25 | 26 |
27 | 28 | 32 |
33 | 34 | 35 | 36 |
37 | 38 | 39 | 40 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /admin_portal.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | Library Management System 11 | 12 | 13 | 14 |
15 | 16 |
17 | 18 |
19 |
20 | 21 | 25 |

My Profile

26 |
27 | 28 |
29 |

Online Library (Admin) Portal

30 |
31 | 32 |
33 | 34 |
35 | 36 | 37 | 38 | 39 | 40 | 45 | 46 | 51 | 52 | 53 |
54 | 55 |
56 | 58 | 60 |
61 |
62 | 63 |
64 | 65 |
66 | 67 |
68 |
69 | 70 | 71 | 72 | 73 | 74 | 75 | -------------------------------------------------------------------------------- /add_book.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | Library Management System 11 | 12 | 13 | 14 |
15 | 16 |
17 | 18 |
19 |
20 | 21 | 25 |

My Profile

26 |
27 |
28 |

Library System

29 |
30 |
31 | 32 |
33 | 34 |

Add Book

35 | 36 |
37 |

Fill the details of book

38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 |
61 | 62 | 63 |
64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | -------------------------------------------------------------------------------- /css/buy_book.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: #D0CFCE; 3 | } 4 | .image_user{ 5 | float: right; 6 | padding-right: 5%; 7 | } 8 | 9 | .heading{ 10 | position: relative; 11 | display: inline-block; 12 | text-align: center; 13 | } 14 | .main_header{ 15 | text-align: center; 16 | } 17 | 18 | #portal{ 19 | font-size:300%; 20 | font-family: "Trebuchet MS", Helvetica, sans-serif; 21 | } 22 | 23 | 24 | #log_button { 25 | width: 85px; 26 | background-color: #4CAF50; 27 | } 28 | 29 | .BUTTON{ 30 | font-size: 15px; 31 | color: black; 32 | padding: 15px; 33 | -webkit-transition-duration: 0.4s; /* Safari */ 34 | transition-duration: 0.4s; 35 | text-decoration: none; 36 | overflow: hidden; 37 | cursor: pointer; 38 | } 39 | 40 | 41 | 42 | 43 | /* USER - Management */ 44 | *, *:before, *:after { 45 | margin: 0; 46 | padding: 0; 47 | box-sizing: border-box; 48 | } 49 | .contact-area { 50 | width: 100%; 51 | position: relative; 52 | } 53 | #retailer1{ 54 | float : left; 55 | } 56 | #retailer2{ 57 | text-align: center; 58 | } 59 | 60 | .contact { 61 | max-width: 420px; 62 | padding: 40px 20px; 63 | overflow: hidden; 64 | margin: 0 auto; 65 | } 66 | .contact main { 67 | float: left; 68 | width: 100%; 69 | position: relative; 70 | } 71 | .contact main section { 72 | border-radius: 5px; 73 | float: left; 74 | width: 100%; 75 | background-color:green; 76 | } 77 | .contact main section .content { 78 | float: left; 79 | width: 100%; 80 | padding: 20px 30px 50px 30px; 81 | position: relative; 82 | text-align: center; 83 | } 84 | .contact main section .content img { 85 | display: inline-block; 86 | width: 140px; 87 | border-radius: 50%; 88 | } 89 | .contact main section .content aside { 90 | float: left; 91 | width: 100%; 92 | color: #ffffff; 93 | margin-top: 10px; 94 | } 95 | .contact main section .content aside h1 { 96 | font-weight: 100; 97 | font-size: 22px; 98 | margin-bottom: 10px; 99 | } 100 | .contact main section .content aside p { 101 | font-size: 14px; 102 | letter-spacing: .5px; 103 | line-height: 160%; 104 | } 105 | .contact main .title { 106 | float: left; 107 | width: 100%; 108 | background-color: green; 109 | max-height: 0px; 110 | border-bottom-left-radius: 5px; 111 | border-bottom-right-radius: 5px; 112 | overflow: hidden; 113 | -webkit-transition: all 0.55s; 114 | -moz-transition: all 0.55s; 115 | -o-transition: all 0.55s; 116 | transition: all 0.55s; 117 | } 118 | .contact main .title.active { 119 | max-height: 100px; 120 | -webkit-transition: all 1.3s; 121 | -moz-transition: all 1.3s; 122 | -o-transition: all 1.3s; 123 | transition: all 1.3s; 124 | } 125 | .contact main .title.active p { 126 | -webkit-transform: scale(1); 127 | -moz-transform: scale(1); 128 | -ms-transform: scale(1); 129 | -o-transform: scale(1); 130 | transform: scale(1); 131 | transition-delay: .2s; 132 | } 133 | .contact main .title p { 134 | padding: 15px 30px; 135 | color: #ffffff; 136 | font-size: 16px; 137 | display: inline-block; 138 | font-weight: 500; 139 | text-transform: uppercase; 140 | letter-spacing: .5px; 141 | -webkit-transition: all 0.3s; 142 | -moz-transition: all 0.3s; 143 | -o-transition: all 0.3s; 144 | transition: all 0.3s; 145 | -webkit-transform: scale(0); 146 | -moz-transform: scale(0); 147 | -ms-transform: scale(0); 148 | -o-transform: scale(0); 149 | transform: scale(0); 150 | } 151 | 152 | 153 | @media (min-width: 414px) { 154 | .contact main section .content { 155 | text-align: left; 156 | } 157 | .contact main section .content img { 158 | float: left; 159 | width: 30%; 160 | margin-right: 10%; 161 | } 162 | .contact main section .content aside { 163 | width: 60%; 164 | } 165 | } 166 | 167 | 168 | 169 | -------------------------------------------------------------------------------- /js/admin_portal.js: -------------------------------------------------------------------------------- 1 | $(document).ready(function() { 2 | 3 | var firebaseConfig = { 4 | apiKey: "AIzaSyBin1evT-H6jfR49WIhtVPsGMLzbEklIQY", 5 | authDomain: "library-management-syste-f2a85.firebaseapp.com", 6 | databaseURL: "https://library-management-syste-f2a85.firebaseio.com", 7 | projectId: "library-management-syste-f2a85", 8 | storageBucket: "library-management-syste-f2a85.appspot.com", 9 | messagingSenderId: "914416876417", 10 | appId: "1:914416876417:web:bf9e7762c1c283ba" 11 | }; 12 | // Initialize Firebase 13 | firebase.initializeApp(firebaseConfig); 14 | 15 | var db = firebase.firestore(); 16 | 17 | //var docRef = db.collection("books"); 18 | 19 | // db.collection("books").where("subject", "==", "Computer Science") 20 | // .get() 21 | // .then(function(querySnapshot) { 22 | // querySnapshot.forEach(function(doc) { 23 | // // doc.data() is never undefined for query doc snapshots 24 | // console.log(doc.id, " => ", doc.data()); 25 | // }); 26 | // }) 27 | // .catch(function(error) { 28 | // console.log("Error getting documents: ", error); 29 | // }); 30 | 31 | db.collection("books").get().then(function(querySnapshot) { 32 | querySnapshot.forEach(function(doc) { 33 | $('#books').append( 34 | "

"+doc.data().bookcode+"-" +doc.data().bookname+"

"+ 35 | "

"+doc.data().author1 + " , " +doc.data().author2 +"

"+ 36 | "

"+doc.data().subject+"

"+ 37 | "

" + doc.data().tags + "

"+ 38 | "

"); 39 | }); 40 | }); 41 | 42 | db.collection("users").get().then(function(querySnapshot) { 43 | querySnapshot.forEach(function(doc) { 44 | var book = []; 45 | book = doc.data().books; 46 | books_set = ""; 52 | $('#users').append( 53 | "

"+ doc.data().name+"

"+ 54 | "

"+"Roll Number : "+doc.data().Roll_Number+"

"+ 55 | "

"+"Date of Birth : " + doc.data().DOB +"

"+ 56 | "

"+"E-mail Id: " + doc.data().Email +"

"+ 57 | books_set+ 58 | "

"); 59 | }); 60 | }); 61 | 62 | $("#Students_search").submit(function(e) { 63 | e.preventDefault(); 64 | }); 65 | 66 | $("#Books_search").submit(function(e) { 67 | e.preventDefault(); 68 | }); 69 | 70 | d1 = document.getElementById("books"); 71 | d2 = document.getElementById("users"); 72 | d2.style.display = "none"; 73 | d1.style.display = "none"; 74 | 75 | 76 | $('#show_books').click(function() 77 | { 78 | show_books(); 79 | }); 80 | $('#show_students').click(function() 81 | { 82 | show_students(); 83 | }); 84 | 85 | $('#log_button').click(function() 86 | { 87 | logout(); 88 | }); 89 | firebase.auth().onAuthStateChanged(user => { 90 | if(!user) { 91 | window.location = 'index.html'; 92 | } 93 | }); 94 | 95 | }); 96 | 97 | function show_books() 98 | { 99 | d1 = document.getElementById("books"); 100 | d2 = document.getElementById("users"); 101 | d2.style.display = "none"; 102 | d1.style.display = "block"; 103 | } 104 | 105 | function show_students() 106 | { 107 | d1 = document.getElementById("books"); 108 | d2 = document.getElementById("users"); 109 | d1.style.display = "none"; 110 | d2.style.display = "block"; 111 | } 112 | 113 | 114 | function logout() 115 | { 116 | firebase.auth().signOut().then(function() { 117 | console.log("logout done"); 118 | window.location = 'admin_login.html'; 119 | }).catch(function(error) { 120 | console.log("error"); 121 | }); 122 | } 123 | --------------------------------------------------------------------------------