MyHyvesBookPlus/WebDB
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

Merge branch 'master' into lars-chat

Browse Source
This commit is contained in:
Lars van Hijfte
2017-01-13 12:05:17 +01:00
parent 8c1bacf894 b0e3d43e13
commit fe11b79380
12 changed files with 379 additions and 246 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
website/admin.php
View File

@@ -1,21 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php <head>
include("views/head.php"); <?php include("views/head.php"); ?>
?> <style>
<body> @import url("styles/adminpanel.css");
<?php </style>
/* </head>
* This view adds the main layout over the screen. <body>
* Header and menu. <?php
*/ /*
include("views/main.php"); * This view adds the main layout over the screen.
* Header and menu.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/adminpanel.php"); include("views/adminpanel.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

35
website/chat.php
View File

@@ -1,21 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php <head>
include("views/head.php"); <?php include("views/head.php"); ?>
?> <style>
<body> @import url("styles/chat.css");
<?php </style>
/* </head>
* This view adds the main layout over the screen. <body>
* Header, menu, footer. <?php
*/ /*
include("views/main.php"); * This view adds the main layout over the screen.
* Header, menu, footer.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/chat-view.php"); include("views/chat-view.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

35
website/group.php
View File

@@ -1,21 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php <head>
include("views/head.php"); <?php include("views/head.php"); ?>
?> <style>
<body> @import url("styles/profile.css");
<?php </style>
/* </head>
* This view adds the main layout over the screen. <body>
* Header, menu, footer. <?php
*/ /*
include("views/main.php"); * This view adds the main layout over the screen.
* Header, menu, footer.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/group.php"); include("views/group.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

133
website/login.php
View File

@@ -1,34 +1,51 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<link rel="stylesheet" type="text/css" href="styles/index.css"> <link rel="stylesheet"
type="text/css"
href="styles/index.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="js/dobPicker.min.js"></script> <script src="js/dobPicker.min.js"></script>
<meta charset="utf-8"> <meta charset="utf-8">
<title>MyHyvesbook+</title> <title>MyHyvesbook+</title>
</head> </head>
<body> <body>
<div> <div>
<img style="width:50%;margin-left:25%" src="img/top-logo.png" alt="MyHyvesbook+"> <img style="width:50%;margin-left:25%"
src="img/top-logo.png"
alt="MyHyvesbook+">
</div> </div>
<form action="../profile.php" method="post"> <form action="../profile.php"
method="post">
<h1>Welkom bij MyHyvesbook+</h1> <h1>Welkom bij MyHyvesbook+</h1>
<div class="login_containerlogin"> <div class="login_containerlogin">
<label><b>Gebruikersnaam</b></label> <label><b>Gebruikersnaam</b></label>
<input type="text" placeholder="Voer uw gebruikersnaam in" name="uname" <input type="text"
pattern=".{6,}" title="Moet 6 of meer karakters bevatten" required> placeholder="Voer uw gebruikersnaam in"
name="uname"
pattern=".{6,}"
title="Moet 6 of meer karakters bevatten"
required>
</div> </div>
<div class="login_containerlogin"> <div class="login_containerlogin">
<label><b>Wachtwoord</b></label> <label><b>Wachtwoord</b></label>
<input type="password" placeholder="Voer uw wachtwoord in" name="psw" <input type="password"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" placeholder="Voer uw wachtwoord in"
title="Moet minimaal 1 cijfer, hoofdletter en kleine letter bevatten en minstens 8 karakters lang zijn" required> name="psw"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
title="Moet minimaal 1 cijfer, hoofdletter en kleine letter bevatten en minstens 8 karakters lang zijn"
required>
</div> </div>
<div class="login_containerlogin"> <div class="login_containerlogin">
<input type="submit" value="Login" name="Submit" id="frm1_submit" /> <input type="submit"
value="Login"
name="Submit"
id="frm1_submit" />
</div> </div>
</form> </form>
@@ -39,33 +56,52 @@
<div class="login_containerregister"> <div class="login_containerregister">
<div id="id01" class="modal"> <div id="id01" class="modal">
<span onclick="document.getElementById('id01').style.display='none'" <span onclick="document.getElementById('id01').style.display='none'"
class="close" title="Close Modal">&times;</span> class="close"
title="Close Modal">
&times;</span>
<!-- Register Content --> <!-- Register Content -->
<form class="modal-content animate" action="../profile.php" onsubmit="return passwordfunction()" method="post"> <form class="modal-content animate"
action="../profile.php"
onsubmit="return passwordfunction()"
method="post">
<h2>Registreer uw account</h2> <h2>Registreer uw account</h2>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Naam</b></label> <label><b>Naam</b></label>
<input type="text" placeholder="Voer uw naam in" name="name" <input type="text"
pattern="[A-Za-z]{1,}" title="Mag alleen letters bevatten" required> placeholder="Voer uw naam in"
name="name"
pattern="[A-Za-z]{1,}"
title="Mag alleen letters bevatten"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Achternaam</b></label> <label><b>Achternaam</b></label>
<input type="text" placeholder="Voer uw achternaam in" name="surname" <input type="text"
pattern="[A-Za-z]{1,}" title="Mag alleen letters bevatten" required> placeholder="Voer uw achternaam in"
name="surname"
pattern="[A-Za-z]{1,}"
title="Mag alleen letters bevatten"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Geboortedatum</b></label> <label><b>Geboortedatum</b></label>
<!-- These are the select elements we will target --> <!-- These are the select elements we will target -->
<select id="dobday" title="Voer een dag in" ></select> <select id="dobday"
<select id="dobmonth" title="Voer een maand in" required></select> title="Voer een dag in"
<select id="dobyear" title="Voer een jaar in" required></select> required></select>
<select id="dobmonth"
title="Voer een maand in"
required></select>
<select id="dobyear"
title="Voer een jaar in"
required></select>
<!-- And here's the library being called! --> <!-- And here's the library being called! -->
<script> <script>
$(document).ready(function() { $(document).ready(function() {
$.dobPicker({ $.dobPicker({
daySelector: '#dobday', daySelector: '#dobday',
monthSelector: '#dobmonth', monthSelector: '#dobmonth',
@@ -82,51 +118,74 @@
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Gebruikersnaam</b></label> <label><b>Gebruikersnaam</b></label>
<input type="text" placeholder="Voer uw gebruikersnaam in" name="username" <input type="text"
pattern=".{6,}" title="Moet minstens 6 karakters bevatten" required> placeholder="Voer uw gebruikersnaam in"
name="username"
pattern=".{6,}"
title="Moet minstens 6 karakters bevatten"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Wachtwoord</b></label> <label><b>Wachtwoord</b></label>
<input type="password" placeholder="Voer uw wachtwoord in" name="password" <input type="password"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" id="password" placeholder="Voer uw wachtwoord in"
title="Moet minimaal 1 cijfer, hoofdletter en kleine letter bevatten en minstens 8 karakters bevatten" required> name="password"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
id="password"
title="Moet minimaal 1 cijfer, hoofdletter en kleine letter bevatten en minstens 8 karakters bevatten"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Herhaal wachtwoord</b></label> <label><b>Herhaal wachtwoord</b></label>
<input type="password" placeholder="Herhaal wachtwoord" name="confirmpassword" <input type="password"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" id="confirmpassword" placeholder="Herhaal wachtwoord"
title="Herhaal wachtwoord" required> name="confirmpassword"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
id="confirmpassword"
title="Herhaal wachtwoord"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Straatnaam</b></label> <label><b>Straatnaam</b></label>
<input type="text" placeholder="Voer uw straatnaam in" name="name" <input type="text"
pattern="[A-Za-z]{1,}" title="Mag alleen letters bevatten" required> placeholder="Voer uw straatnaam in"
name="name"
pattern="[A-Za-z]{1,}"
title="Mag alleen letters bevatten"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Straatnummer</b></label> <label><b>Straatnummer</b></label>
<input type="text" placeholder="Voer uw straatnummer in" name="name" <input type="text"
pattern="[1-9][0-9]{0,}" title="Mag alleen nummers bevatten" required> placeholder="Voer uw straatnummer in"
name="name"
pattern="[1-9][0-9]{0,}"
title="Mag alleen nummers bevatten"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<label><b>Email</b></label> <label><b>Email</b></label>
<input type="email" placeholder="Voer uw email in" id="email" <input type="email"
title="Voer een geldige email in" required> placeholder="Voer uw email in"
id="email"
title="Voer een geldige email in"
required>
</div> </div>
<div class="login_containerregister"> <div class="login_containerregister">
<input type="submit" value="Registreer uw account" name="Submit" id="frm1_submit" /> <input type="submit"
value="Registreer uw account"
name="Submit"
id="frm1_submit" />
</div> </div>
</form> </form>
</div> </div>
</div> </div>
<script>
$("#default-settings").birthdayPicker();
</script>
</body> </body>
</html> </html>

35
website/profile.php
View File

@@ -1,21 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php <head>
include("views/head.php"); <?php include("views/head.php"); ?>
?> <style>
<body> @import url("styles/profile.css");
<?php </style>
/* </head>
* This view adds the main layout over the screen. <body>
* Header, menu, footer. <?php
*/ /*
include("views/main.php"); * This view adds the main layout over the screen.
* Header, menu, footer.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/profile.php"); include("views/profile.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

35
website/search.php
View File

@@ -1,21 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php <head>
include("views/head.php"); <?php include("views/head.php"); ?>
?> <style>
<body> @import url("styles/search.css");
<?php </style>
/* </head>
* This view adds the main layout over the screen. <body>
* Header and menu. <?php
*/ /*
include("views/main.php"); * This view adds the main layout over the screen.
* Header and menu.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/search-view.php"); include("views/search-view.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

33
website/settings.php
View File

@@ -1,19 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php include("views/head.php"); ?> <head>
<body> <?php include("views/head.php"); ?>
<?php <style>
/* @import url("styles/settings.css");
* This view adds the main layout over the screen. </style>
* Header and menu. </head>
*/ <body>
include("views/main.php"); <?php
/*
* This view adds the main layout over the screen.
* Header and menu.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/settings-view.php"); include("views/settings-view.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

2
website/styles/header.css
View File

@@ -8,7 +8,7 @@ header {
width: 100%; width: 100%;
color: white; color: white;
background-color: #845663; background-color: rgba(132,86,99, 0.98);
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
} }

56
website/styles/index.css
View File

@@ -1,6 +1,11 @@
/* Body */ /* Body */
body { body {
background-color: #B78996; height: 100%;
background-color: #B78996;
color: #333;
font-family: Arial, sans-serif;
} }
/* inlogform */ /* inlogform */
@@ -17,15 +22,16 @@ form {
h1 { h1 {
padding: 16px; padding: 16px;
text-align: center; text-align: center;
font-size: 2.2em;
} }
/* registreer titel*/ /* registreer titel*/
h2 { h2 {
padding: 16px; padding: 16px;
text-align: left; text-align: left;
font-size: 2.0em;
} }
/* text */
label { label {
display: block; display: block;
} }
@@ -40,6 +46,8 @@ select {
padding: 12px 20px; padding: 12px 20px;
margin: 8px 0; margin: 8px 0;
width: 15%; width: 15%;
font-family: Arial;
font-size: 16px;
} }
input[type=text], input[type=password], input[type=email] { input[type=text], input[type=password], input[type=email] {
@@ -51,6 +59,8 @@ input[type=text], input[type=password], input[type=email] {
padding: 12px 20px; padding: 12px 20px;
margin: 8px 0; margin: 8px 0;
width: 50%; width: 50%;
font-family: Arial;
font-size: 16px;
} }
input[type=submit]{ input[type=submit]{
@@ -63,6 +73,8 @@ input[type=submit]{
margin: 8px 0; margin: 8px 0;
padding: 14px 20px; padding: 14px 20px;
width: 50%; width: 50%;
font-family: Arial;
font-size: 16px;
} }
/* stijl voor alle buttons */ /* stijl voor alle buttons */
@@ -76,6 +88,8 @@ button {
margin: 8px 0; margin: 8px 0;
padding: 14px 20px; padding: 14px 20px;
width: 25%; width: 25%;
font-family: Arial;
font-size: 16px;
} }
/* padding voor registreer container */ /* padding voor registreer container */
@@ -149,3 +163,41 @@ button {
from {transform: scale(0)} from {transform: scale(0)}
to {transform: scale(1)} to {transform: scale(1)}
} }
::selection {
background: #845663;
color: white;
}
::-moz-selection {
background: #845663;
color: white;
}
a, a:link, a:visited, a:hover, a:active {
color: inherit;
text-decoration: none;
}
a[data-title]:hover:after, img[data-title]:hover:after, span[data-title]:hover:after,
div[data-title]:hover:after{
content: attr(data-title);
padding: 4px 4px;
color: #FFFFFF;
position: absolute;
left: 0;
top: 100%;
z-index: 20;
white-space: nowrap;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0px 0px 4px #222;
-webkit-box-shadow: 0px 0px 4px #222;
box-shadow: 0px 0px 4px #222;
background-color: #333;
font-size: 15px;
line-height: normal;
font-family: Arial, sans-serif;
}

156
website/styles/main.css
View File

@@ -1,64 +1,10 @@
/*----------------------------------------------------------------------------- /*-----------------------------------------------------------------------------
Default Stylesheet Default Stylesheet
last update: 10-01-2017 last update: 13-01-2017
Website: myhyvesbookplus.tk Website: myhyvesbookplus.tk
-----------------------------------------------------------------------------*/ -----------------------------------------------------------------------------*/
.profile-picture {
border-radius: 50%;
height: 42px;
width: 42px;
object-fit: cover;
vertical-align: middle;
}
.group-picture {
border-radius: 5px;
height: 42px;
width: 42px;
object-fit: cover;
vertical-align: middle;
}
html {
height: 100%;
}
body {
height: 100%;
background-color: #B78996;
color: #333;
font-family: Arial, sans-serif;
}
.content {
padding: 20px;
margin-top: 80px;
margin-left: 256px;
min-height: 100%;
}
.platform {
padding: 20px;
margin-bottom: 10px;
border-radius: 10px;
background-color: #FFFFFF;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
::selection {
background: #845663;
color: white;
}
::-moz-selection {
background: #845663;
color: white;
}
/* Remove padding and margin */ /* Remove padding and margin */
* { * {
margin: 0; margin: 0;
@@ -66,19 +12,15 @@ body {
border: 0; border: 0;
} }
/* Move element down (clear), below floating elements */ html {
.clear { height: 100%;
clear: both;
} }
/* Float element to the left side of its containing block */ body {
.right { height: 100%;
float: right; background-color: #B78996;
} color: #333;
font-family: Arial, sans-serif;
/* Float element to the left side of its containing block */
.left {
float: left;
} }
/* Font sizes */ /* Font sizes */
@@ -110,23 +52,81 @@ p {
font-size: 1.2em; font-size: 1.2em;
} }
/* Selection colors */
::selection {
background: #845663;
color: white;
}
::-moz-selection {
background: #845663;
color: white;
}
/* All content underneath the menu */
.content {
padding: 20px;
margin-top: 80px;
margin-left: 256px;
min-height: 100%;
}
/* White boxes (squares) */
.platform {
padding: 20px;
margin-bottom: 10px;
border-radius: 10px;
background-color: #FFFFFF;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.profile-picture, .group-picture {
height: 42px;
width: 42px;
object-fit: cover;
vertical-align: middle;
}
.profile-picture {
border-radius: 50%;
}
.group-picture {
border-radius: 5px;
}
/* Move element down (clear), below floating elements */
.clear {
clear: both;
}
/* Float element to the left side of its containing block */
.right {
float: right;
}
/* Float element to the left side of its containing block */
.left {
float: left;
}
/* All links */
a, a:link, a:visited, a:hover, a:active { a, a:link, a:visited, a:hover, a:active {
color: inherit; color: inherit;
text-decoration: none; text-decoration: none;
} }
/* All buttons, inputfields/selectfields. */
button, input, select { button, input, select {
width: auto; width: auto;
height: 32px; height: 32px;
cursor: pointer; cursor: pointer;
border: none; border: none;
font-family: Arial, sans-serif;
font-size: 16px; font-size: 16px;
border-radius: 7px; border-radius: 7px;
} }
/* All textinput and sections */
textarea, input, select { textarea, input, select {
padding: 0 5px; padding: 0 5px;
background: white; background: white;
@@ -134,11 +134,12 @@ textarea, input, select {
border: 1px solid #845663; border: 1px solid #845663;
border-radius: 7px; border-radius: 7px;
font-size: 16px; font-size: 16px;
} }
button, input[type="submit"], input[type="reset"] { /* All buttons */
button,
input[type="submit"],
input[type="reset"] {
background-color: #845663; background-color: #845663;
color: white; color: white;
padding: 0 10px; padding: 0 10px;
@@ -157,12 +158,17 @@ td {
} }
/* Custom title box, appears instantaneously */ /* Custom title box, appears instantaneously */
a[data-title]:hover, img[data-title]:hover, span[data-title]:hover, div[data-title]:hover { a[data-title]:hover,
img[data-title]:hover,
span[data-title]:hover,
div[data-title]:hover {
position: relative; position: relative;
} }
a[data-title]:hover:after, img[data-title]:hover:after, span[data-title]:hover:after, a[data-title]:hover:after,
div[data-title]:hover:after{ img[data-title]:hover:after,
span[data-title]:hover:after,
div[data-title]:hover:after {
content: attr(data-title); content: attr(data-title);
padding: 4px 4px; padding: 4px 4px;
color: #FFFFFF; color: #FFFFFF;

35
website/template.php
View File

@@ -1,21 +1,24 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<?php <head>
include("views/head.php"); <?php include("views/head.php"); ?>
?> <style>
<body> /*Insert own stylesheet here ;)*/
<?php </style>
/* </head>
* This view adds the main layout over the screen. <body>
* Header and menu. <?php
*/ /*
include("views/main.php"); * This view adds the main layout over the screen.
* Header and menu.
*/
include("views/main.php");
/* Add your view files here. */ /* Add your view files here. */
include("views/homepage.php"); include("views/homepage.php");
/* This adds the footer. */ /* This adds the footer. */
include("views/footer.php"); include("views/footer.php");
?> ?>
</body> </body>
</html> </html>

35
website/views/head.php
View File

@@ -1,21 +1,14 @@
<head> <meta charset="utf-8">
<meta charset="utf-8"> <title>MyHyvesbook+</title>
<title>MyHyvesbook+</title> <!-- Add your javascript files here. -->
<!-- Add your javascript files here. --> <script src="js/jquery.js"></script>
<script src="js/jquery.js"></script> <script src="js/header.js"></script>
<script src="js/header.js"></script> <script src="js/menu.js"></script>
<script src="js/menu.js"></script> <style>
<style> /* Add your css files here. */
/* Add your css files here. */ @import url("styles/main.css");
@import url("styles/main.css"); @import url("styles/font-awesome.css");
@import url("styles/profile.css"); @import url("styles/header.css");
@import url("styles/font-awesome.css"); @import url("styles/menu.css");
@import url("styles/header.css"); @import url("styles/footer.css");
@import url("styles/menu.css"); </style>
@import url("styles/footer.css");
@import url("styles/search.css");
@import url("styles/adminpanel.css");
@import url("styles/chat.css");
@import url("styles/settings.css");
</style>
</head>