Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Added Email Validation #239

Merged
merged 7 commits into from
Mar 18, 2020
Merged

Added Email Validation #239

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
b5bf378
impoving the instructions in #226
viditvarshney Mar 10, 2020
2aef937
solved mismatch navbars, added favicon, remove unecessary css
viditvarshney Mar 10, 2020
9ed3c7d
Merge branch 'develop' into develop
viditvarshney Mar 10, 2020
6235af0
Merge remote-tracking branch 'upstream/develop' into develop
viditvarshney Mar 14, 2020
57f93f2
some needed modifications
viditvarshney Mar 14, 2020
62959bc
feature: Signup option
viditvarshney Mar 15, 2020
fecc32c
added Email Validation, Remove unnecessory Code
viditvarshney Mar 15, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions apps/landing/landing.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,9 @@
<ul>
<li><a href="landing.html" class="link" style="color: white;">Home</a></li>
<li><a href="../table.html" class="link">Slides</a></li>
<li style="float: right;"><a href="/apps/signup/signup.html" class="link">Signup</a></li>
<li style="float: right;"><a target="_blank" href="https://docs.google.com/forms/d/e/1FAIpQLScL91LxrpAZjU88GBZP9gmcdgdf8__uNUwhws2lzU6Lr4qNwA/viewform" class="link">Feedback</a></li>

</ul>

</nav>
Expand Down
46 changes: 8 additions & 38 deletions apps/signup/signup.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,7 @@ body {
}



.txtb input[type=text] {
.txtb input {
font-size: 15px;
color: #fff;
border: none;
Expand All @@ -50,48 +49,18 @@ body {
height: 40px;
}

.txtb span::before {
content: attr(data-placeholder);
position: absolute;
top: 50%;
left: 5px;
color: #fff;
transform: translateY(-50%);
z-index: -1;
transition: .5s;
}

.txtb span::after {
content: '';
position: absolute;
width: 0%;
height: 2px;
background: linear-gradient(120deg, #3498db, #8e44ad);
transition: .5s;
}

.txtb input.focus + span::before {
top: -5px;
color: #3498db;
}

.txtb input.focus + span::after {
width: 100%;
}

.radb {
position: relative;
margin-bottom: 30px;
}

.radb input[type=radio] {
input[type=radio] {
margin: 15px 10px 0 50px;
transition: .5s;
}
.radb input[type=radio]:checked+label {
input[type=radio]:checked+label {
color: #8e44ad;
font-weight: bold;
}
.bottom-text {
font-size: 12px;
padding-top: 7px;
}



Expand All @@ -107,6 +76,7 @@ body {
outline: none;
cursor: pointer;
transition: .5s;
margin-top: 10px;
}


Expand Down
175 changes: 93 additions & 82 deletions apps/signup/signup.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,105 +1,116 @@
<!DOCTYPE html>
<html>

<head>
<meta name="keywords" content="camicroscope, quip" />
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'>
<title>CaMicroscope - User Signup</title>
<head>
<meta name="keywords" content="camicroscope, quip" />
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'>
<title>CaMicroscope - User Signup</title>

<link rel='stylesheet' type='text/css' media='all' href='../../css/normalize.css'/>
<link rel='stylesheet' type='text/css' media='all' href='signup.css'/>
</head>
<script>
var userSignupUrl = "../../data/Auth/post"
function addUser(){
var email = document.getElementById("name").value
var collections = document.getElementById("collections").value
var attr = document.querySelector('input[name="attr"]:checked').value
var attr_doc = []
if (attr == "admin"){
attr_doc = ["write", "admin"]
}
if (attr == "editor"){
attr_doc = ["write"]
}
var doc = {name: email, attrs: attr_doc, accessCollection:collections}
fetch(userSignupUrl, {
method: 'POST',
mode: 'cors', // no-cors, cors, *same-origin
cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
credentials: 'same-origin', // include, *same-origin, omit
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(doc)
}).then(x=>{
if (x.status>=400){
throw "failed to sign up user"
<link rel='stylesheet' type='text/css' media='all' href='../../css/normalize.css'/>
<link rel='stylesheet' type='text/css' media='all' href='signup.css'/>
</head>
<script>
var userSignupUrl = "../../data/Auth/post"
function addUser(){
var email = document.getElementById("name").value
var collections = document.getElementById("collections").value
var attr = document.querySelector('input[name="attr"]:checked').value
var attr_doc = []
if (attr == "admin"){
attr_doc = ["write", "admin"]
}
x.json()
}).then(x=>{
window.alert("success")
console.log(x)
}).catch(e=>{
window.alert("error!")
console.error(e)
})
}
</script>
if (attr == "editor"){
attr_doc = ["write"]
}
var doc = {name: email, attrs: attr_doc, accessCollection:collections}
fetch(userSignupUrl, {
method: 'POST',
mode: 'cors', // no-cors, cors, *same-origin
cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
credentials: 'same-origin', // include, *same-origin, omit
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(doc)
}).then(x=>{
if (x.status>=400){
throw "failed to sign up user"
}
x.json()
}).then(x=>{
window.alert("success")
console.log(x)
}).catch(e=>{
window.alert("error!")
console.error(e)
})
}
</script>

<body>
<body>

<div id="signupForm" class="login-panel">
<H1>User Signup</H1>
<div id="signupForm" class="login-panel">
<H1>User Signup</H1>

<div class="txtb">
<input id="name" type="text" >
<span data-placeholder="Email">
</div>
<div class="txtb">
<input id="collections" type="text" >
<span data-placeholder="['list','of','collections']">
</div>
<div class="txtb">
<input type="text" onblur="validateEmail(this);" placeholder="Email" >
</div>
<div class="txtb">
<input id="collections" type="text" placeholder="['list','of','collections']">
</div>

<div class="radb">
<!-- User Type selection -->
<input type="radio" id="attrchoice1"
name="attr" value="viewer" checked>
name="attr" value="viewer" checked>
<label for="attrchoice1">Viewer</label><br>

<input type="radio" id="attrchoice2"
name="attr" value="editor">
name="attr" value="editor">
<label for="attrchoice2">Editor</label><br>

<input type="radio" id="attrchoice3"
name="attr" value="admin">
name="attr" value="admin">
<label for="attrchoice3">Admin (and Editor)</label>
</div>
<!-- submit btn -->
<input id="sub" class="sub-btn" onclick="addUser()" type="submit">
<!-- submit btn -->
<input id="sub" class="sub-btn" onclick="addUser()" type="submit">

<!-- <div class="bottom-text">
Don't have account?
</div> -->
<div class="bottom-text">
Already have an account?
</div>

<div class="login-tips">If you reach this page, it's likely that you tried to log into this instance but lack access.
Email the administrator if you want to be added. If you are an admin, you should be able to use this form.</div>
</div>
<script type="text/javascript">
const input_name = document.querySelector('#name');
input_name.addEventListener('focus',()=>{
input_name.classList.add('focus');
});
const input_collection= document.querySelector('#collections');
input_collection.addEventListener('focus',()=>{
input_collection.classList.add('focus');
});
input_name.addEventListener('blur',()=>{
if(input_name.value=="") input_name.classList.remove('focus');
});
</script>
</body>
Email the administrator if you want to be added. If you are an admin, you should be able to use this form.
</div>
</div>
<script type="text/javascript">
const input_name = document.querySelector('#name');
input_name.addEventListener('focus',()=>{
input_name.classList.add('focus');
});
const input_collection= document.querySelector('#collections');
input_collection.addEventListener('focus',()=>{
input_collection.classList.add('focus');
});
input_name.addEventListener('blur',()=>{
if(input_name.value=="") input_name.classList.remove('focus');
});

function validateEmail(emailField){
var reg = /\S+@\S+\.\S+/;

if (reg.test(emailField.value) == false)
{
alert('Invalid Email Address');
return false;
}

return true;

}
</script>
</body>
</html>
6 changes: 6 additions & 0 deletions apps/table.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,10 @@
margin-top: 0.2rem;
font-family: "Open Sans", Helvetica, sans-serif;
line-height: 1.8;
}
#entries {
cursor: pointer;
}
.page-item {
cursor: pointer;
}
6 changes: 3 additions & 3 deletions apps/table.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ <h3 class="text-center h3 mb-0">Available Slides</h3>
<option value="40">40 slides/page</option>
<option value="50">50 slides/page</option>
<option value="100">100 slides/page</option>
</select>
</select>
<input id="search-table" type="text" class="form-control" placeholder="Search&hellip;">
</div>
<button type="button" class="btn btn-success float-right mb-2"
Expand Down Expand Up @@ -290,9 +290,9 @@ <h3>Steps for uploading.</h3>
return;
}

const thead = HeadMapping.map(d => "<th>" + d.title + `<img id='sort1${d.title}' class='float-right sort-btn' width='16px' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAAAtklEQVRIie3XsQrCMBSF4T+CoJsddHAo9HH6AD634NbNqTgo6FI6WQdTtJLQpG0CxXsglIRyv0ugCYWZRsUGd8ARKIA0FroFTkCjxxnIYqNRcBsaFO9Dg+Cu6KS4LzoJrnh/Mr5oOwpgaSu+GNqVY6wHTN/Jo4DNz1oJrAzv7oH6a/4Ani7duabCvLVrnyKht1pggQUWWOA/g0vD2o3ulRgkOXDhcx1egYNvkTG/IIl+3nUD88gLIHVaGvUECUcAAAAASUVORK5CYII='/>
const thead = HeadMapping.map(d => "<th>" + d.title + `<img id='sort1${d.title}' class='float-right sort-btn' width='10px' src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAAAtklEQVRIie3XsQrCMBSF4T+CoJsddHAo9HH6AD634NbNqTgo6FI6WQdTtJLQpG0CxXsglIRyv0ugCYWZRsUGd8ARKIA0FroFTkCjxxnIYqNRcBsaFO9Dg+Cu6KS4LzoJrnh/Mr5oOwpgaSu+GNqVY6wHTN/Jo4DNz1oJrAzv7oH6a/4Ani7duabCvLVrnyKht1pggQUWWOA/g0vD2o3ulRgkOXDhcx1egYNvkTG/IIl+3nUD88gLIHVaGvUECUcAAAAASUVORK5CYII='/>

<img id='sort2${d.title}' class='float-right sort-btn' width='16px' src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAAAs0lEQVRIie3VsQrCMBSF4T/qoFsddBR8Hncf24KTUAquDg4ugoPWwRbSEk2aJhHlHsiQhPCdZAl8KeMBZ+fADLgF6mLNBjgBVT3OwDYFXGqojqvY8NUAV7ye3Tmj8L0EFlhggQX+F3hi2VdAZlgzJQOm2vwCPDx7kWP+Al1G0SnSyqenVsDdt3Ed7xsvgD39b3sE1kMa++BB0L54UNQVj4La8KjoOzwJ2mQJ7IADsEqF/nae93FcRiryrh8AAAAASUVORK5CYII="/>
<img id='sort2${d.title}' class='float-right sort-btn' width='10px' src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAAAs0lEQVRIie3VsQrCMBSF4T/qoFsddBR8Hncf24KTUAquDg4ugoPWwRbSEk2aJhHlHsiQhPCdZAl8KeMBZ+fADLgF6mLNBjgBVT3OwDYFXGqojqvY8NUAV7ye3Tmj8L0EFlhggQX+F3hi2VdAZlgzJQOm2vwCPDx7kWP+Al1G0SnSyqenVsDdt3Ed7xsvgD39b3sE1kMa++BB0L54UNQVj4La8KjoOzwJ2mQJ7IADsEqF/nae93FcRiryrh8AAAAASUVORK5CYII="/>
</th>`);

thead.push("<th></th>");
Expand Down