Skip to content
GitLab
Commit 0754cdb2 authored by Jasvitha Allamsetty's avatar Jasvitha Allamsetty
Browse files

Upload New File

parent da6b55bb
Pipeline #37781 canceled with stages
Show whitespace changes
Inline Side-by-side
front end/Login.html 0 → 100644
View file @ 0754cdb2
<!DOCTYPE html>
<html>
<head>
<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-awesome.min.css">
<style>
body {
font-family: Arial, Helvetica, sans-serif;
}
* {
box-sizing: border-box
}
/* Full-width input fields */
input[type=text], input[type=password] {
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
display: inline-block;
border: none;
background: #f1f1f1;
}
input[type=text]:focus, input[type=password]:focus {
background-color: #ddd;
outline: none;
}
hr {
border: 1px solid #f1f1f1;
margin-bottom: 25px;
}
/* Set a style for all buttons */
button {
background-color: #808080;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
opacity: 0.9;
}
button:hover {
opacity: 1;
}
/* Add padding to container elements */
.container {
padding: 16px;
}
/* Clear floats */
.clearfix::after {
content: "";
clear: both;
display: table;
}
/*usermainpage style*/
.arrow {
border: solid black;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 3px;
}
.down {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
/* Button used to open the contact form - fixed at the bottom of the page */
.open-button {
float: right;
text-align: center;
padding: 14px 14px;
text-decoration: none;
font-size: 17px;
}
/* The popup form - hidden by default */
.form-popup {
display: none;
position: fixed;
bottom: 0;
right: 15px;
border: 3px solid #f1f1f1;
z-index: 9;
}
/* Add styles to the form container */
.form-container {
max-width: 300px;
padding: 10px;
background-color: white;
}
/* Full-width input fields */
.form-container input[type=text], .form-container input[type=password] {
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
border: none;
background: #f1f1f1;
}
/* When the inputs get focus, do something */
.form-container input[type=text]:focus, .form-container input[type=password]:focus {
background-color: #ddd;
outline: none;
}
/* Set a style for the submit/login button */
.form-container .btn {
background-color: #4CAF50;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
width: 100%;
margin-bottom: 10px;
opacity: 0.8;
}
/* Add a red background color to the cancel button */
.form-container .cancel {
background-color: red;
}
/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
opacity: 1;
}
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
background-color: blue;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 4px;
}
#myBtn:hover {
background-color: #555;
}
.topnav {
overflow: hidden;
background-color: white;
/*border-style: outset;*/
}
.btn {
float: left;
text-align: center;
padding: 14px 14px;
text-decoration: none;
font-size: 17px;
}
.rightheaderelements {
float: right;
text-align: center;
padding: 14px 14px;
text-decoration: none;
font-size: 17px;
}
.active, .btn:hover {
background-color: white;
font-size: 20px;
color: blue;
text-decoration: underline;
}
/*.b
{
display: none;
}*/
.topnav-right {
float: right;
}
</style>
</head>
<body>
<div id="logindiv">
<form style="border:1px solid #ccc">
<div class="container">
<h1>Login</h1>
<p>Please fill in this form to login to your account.</p>
<hr>
<label for="eml"><b>Email</b></label>
<input id="eml" type="text" placeholder="Enter Email" name="eml" required>
<label for="pswl"><b>Password</b></label>
<input id="pswl" type="password" placeholder="Enter Password" name="pswl" required>
<div class="clearfix">
<button style="float:left;width:10%;padding: 20px 8px 20px 8px;background-color: #f44336;color: white" type="button" id="cbt">Cancel</button>
<script>
document.getElementById("cbt").onclick = function () {
location.href = "index.html";
};
</script>
<button style="float:right;width:10%;padding: 20px 8px 20px 8px ;background-color: #4CAF50;color: white;" type="button" onclick="loginU()" id="lgb">Login </button>
<script src="https://www.gstatic.com/firebasejs/8.1.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.1.2/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.1.2/firebase-database.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.1.2/firebase/init.js"></script>
<script>
var firebaseConfig = {
apiKey: "AIzaSyAH21OG-l3V-B4_jRJ7_ASlYNhZa9cpEsY",
authDomain: "thireachy.firebaseapp.com",
projectId: "thireachy",
storageBucket: "thireachy.appspot.com",
messagingSenderId: "301538556762",
appId: "1:301538556762:web:9480dab5d9e76a2d5c5163",
measurementId: "G-KVBD696N3C"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
firebase.analytics();
function loginU() {
var email = document.getElementById('eml').value;
var password = document.getElementById('pswl').value;
//Sign In User with Email and Password
firebase.auth().signInWithEmailAndPassword(email, password)
.then(function (firebaseUser) {
// Successful login
document.getElementById("logindiv").style.display = "none";
document.getElementById("usermaindiv").style.display = "block";
})
.catch(function (error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode === 'auth/wrong-password') {
alert('Wrong password.');
}
else {
alert(errorMessage);
}
});
}
</script>
</div>
</div>
</form>
</div>
<!--Main Userdiv-->
<div style="display:None" id="usermaindiv">
<button style="width:50px;padding: 10px 4px 10px 4px" onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
<script>
var mybutton = document.getElementById("myBtn");
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function () { scrollFunction() };
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
mybutton.style.display = "block";
} else {
mybutton.style.display = "none";
}
}
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
//chnaging highlighted option to home
var current = document.getElementsByClassName("active");
current[0].className = current[0].className.replace(" active", "");
document.getElementById("myhome").className = 'btn active';
}
</script>
<div id='navba' class="topnav">
<a id='myhome' class="btn active" href="#home">Home</a>
<a class='btn' href="#FAQ">FAQ'S</a>
<div class="topnav-right">
<button class="open-button" onclick="openForm()">Add new <i class="fa fa-plus-circle"></i></button>
<script>
function openForm() {
document.getElementById("myForm").style.display = "block";
}
function closeForm() {
document.getElementById("myForm").style.display = "none";
}
</script>
<div class="form-popup" id="myForm">
<form class="form-container">
<h1>Document Upload</h1>
<label for="docnamee"><b>Document name</b></label>
<input id="docnamee" type="text" placeholder="Enter Document Name" name="docnamee" required>
<center><input type="file" placeholder="Upload here" id="myfile" name="myfile" required></center><br><br>
<button type="button" id="subdoc" onclick="adddoctofb()" class="btn">Upload</button>
<script>
function adddoctofb() {
var docname = document.getElementById("docnamee").value;
// our doc is here,var docmain = document.getElementById("myfile").value;
var docs1, unn1, pnnn1, em1;
firebase.database().ref("UserInfo/" + firebase.auth().currentUser.uid).once('value').then(function (snapshot) {
docs1 = snapshot.val().Docsuploaded;
unn1 = snapshot.val().UserName;
pnnn1 = snapshot.val().Phonenumber;
em1 = snapshot.val().Email;
});
docs1.docname = "keyval";
docs1.noofdocs = docs1.noofdocs + 1;
//what happens when we submit a new doc; 1.add to firebase 2.add that to display
firebase.database().ref('UserInfo/' + firebase.auth().currentUser.uid).update({
UserName: unn1,
Phonenumber: pnnn1,
Email: em1,
Docsuploaded: docs1
}).then(function () {
alert("Doc: " + docname + " Uploaded successfully!!");
dyd();
closeForm();
}).catch(function (error) {
// An error happened.
var errorCode = error.code;
var errorMessage = error.message;
alert(errorMessage);
});
}
</script>
<button type="button" class="btn cancel" onclick="closeForm()">Close</button>
</form>
</div>
<button id="profileinf" onclick="displayprofileinfofromfb()" class='btn' style="font-size:20px"><i class="fa fa-user"></i></button>
<script>
function displayprofileinfofromfb() {
//for now it displays hi with username, later will create profilepage and include upadte,etc
firebase.database().ref("UserInfo/" + firebase.auth().currentUser.uid).once('value').then(function (snapshot) {
alert("Hi!! " + snapshot.val().UserName);
});
}
</script>
<button onclick="signingout()" class='btn' style="font-size:20px"><i class="fa fa-sign-out"></i></button>
<script>
function signingout() {
firebase.auth().signOut().then(function () {
// Sign-out successful.
document.getElementById("logindiv").style.display = "block";
document.getElementById("usermaindiv").style.display = "none";
document.getElementById('eml').value = '';
document.getElementById('pswl').value = '';
}).catch(function (error) {
var errorCode1 = error.code;
var errorMessage1 = error.message;
alert(errorMessage1);
});
}
</script>
</div>
</div>
<div id="home" style="padding-left:16px">
<button id="ydb" onclick="dyd()" class='btn' style="width:250px;font-size:16px"><h2>Your Documents </h2></button>
<br><br><br><br><br><br>
<ul id="docs"></ul>
<script>
function addItemtodisplay(inid, docname) {
if (inid === 'No.of docs') {
var li = document.createElement("TEXT");
}
else {
var li = document.createElement("BUTTON");
}
li.setAttribute("id", 'urdc' + inid);
li.innerHTML = docname;
document.getElementById("docs").appendChild(li);
}
function dyd() {
//we read doc names from fb and add it to diaplay whenever mydoc button is pressed
var x, doc;
// should clear list before entering
var list = document.getElementById("docs");
while (list.hasChildNodes()) {
list.removeChild(list.firstChild);
}
firebase.database().ref("UserInfo/" + firebase.auth().currentUser.uid).once('value').then(function (snapshot) {
var i = 1;
doc = snapshot.val().Docsuploaded;
addItemtodisplay('No.of docs', " No. of docs Uploaded: " + doc['noofdocs']);
for (x in doc) {
if (x !== "noofdocs") {
addItemtodisplay(i, x);
i = i + 1;
}
}
document.getElementById('docs').style.display = "block";
});
}
</script>
</div>
<br><br>
<div id="FAQ" style="padding-left:16px">
<h2> Frequently asked Questions </h2>
<p>Question1</p>
<p>Question2</p>
<p>Question3</p>
<p>Question4</p>
<p>Question5</p>
<p>Question6</p>
<p>Question7</p>
</div>
</div>
</body>
</html >
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment