School/WasteInformationServer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improved ui, added panel to add new city and zone

Browse Source 
parts of displaying cities fromdb
This commit is contained in:
lukas-heiligenbrunner 2019-11-15 11:23:51 +01:00
parent cfddff4d8d
commit 36caaa214b
12 changed files with 186 additions and 207 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.idea/misc.xml generated
View File

@ -1,5 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectPlainTextFileTypeManager">
<file url="file://$PROJECT_DIR$/resources/wwwroot/settings.html" />
</component>
<component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" default="false" project-jdk-name="11" project-jdk-type="JavaSDK">
<output url="file://$PROJECT_DIR$/out" />
</component>

144
resources/wwwroot/dashboard.html
View File

@ -10,6 +10,8 @@
<link rel="stylesheet" href="lib/AdminLTE/plugins/fontawesome-free/css/all.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<!-- DataTables -->
<link rel="stylesheet" href="lib/AdminLTE/plugins/datatables-bs4/css/dataTables.bootstrap4.css">
<!-- Tempusdominus Bbootstrap 4 -->
<link rel="stylesheet" href="lib/AdminLTE/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
<!-- iCheck -->
@ -206,13 +208,55 @@
</div>
<!-- /.card -->
<div class="card">
<div class="card-header">
<h3 class="card-title">
<i class="fas fa-chart-pie mr-1"></i>
New City
</h3>
<button id="btn-savecity" type="button" class="btn btn-success"
style="float:right;">Save
</button>
</div><!-- /.card-header -->
<div class="card-body">
<div class="form-group" style="margin-top: 15px; width: 10cm;">
<label for="new_city_cityname">City/Village name</label>
<input type="email" class="form-control" id="new_city_cityname"
aria-describedby="emailHelp" placeholder="Enter city name here">
<small class="form-text text-muted">Please try to use no special
characters</small>
</div>
<div class="form-group" style="width: 10cm;">
<label for="new_city_zonename">Zone Name</label>
<input type="email" class="form-control" id="new_city_zonename"
aria-describedby="emailHelp" placeholder="Enter Zone name here">
<small class="form-text text-muted">Please try to use no special
characters</small>
</div>
<div class="input-group-prepend">
<button id="dropdown-wastetype" type="button"
class="btn btn-outline-dark dropdown-toggle"
data-toggle="dropdown">
Select waste type
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Plastic</a>
<a class="dropdown-item" href="#">Metal</a>
<a class="dropdown-item" href="#">Residual waste</a>
<a class="dropdown-item" href="#">Biowaste</a>
</div>
</div>
</div><!-- /.card-body -->
</div>
<!-- Custom tabs (Charts with tabs)-->
<div class="card">
<div class="card-header">
<h3 class="card-title">
<i class="fas fa-chart-pie mr-1"></i>
Create new Date
New Pick up date
</h3>
<button id="btn-savelist" type="button" class="btn btn-success"
style="float:right;">Save
@ -220,30 +264,17 @@
</div><!-- /.card-header -->
<div class="card-body">
<form>
<h4>General options:</h4>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch1">
<label class="custom-control-label" for="customSwitch1">Notify Led-Board</label>
</div>
<div class="form-group" style="margin-top: 15px; width: 30%;">
<label for="exampleInputEmail1">Table Name</label>
<input type="email" class="form-control" id="exampleInputEmail1"
aria-describedby="emailHelp" placeholder="Enter Table Name">
<small id="emailHelp" class="form-text text-muted">Please try to use no special
characters</small>
</div>
<div class="form-group" style="width: 30%;">
<label for="exampleInputEmail1">City/Village name</label>
<input type="email" class="form-control" id="exampleInputEmail1i"
aria-describedby="emailHelp" placeholder="Enter City name here">
<small id="emailHelpi" class="form-text text-muted">Please try to use no special
characters</small>
</div>
<h4>Add Data:</h4>
<div class="input-group mt-3 mb-3" style="width: 100%;">
<input id="input-wasteregion" type="text" class="form-control"
placeholder="Region">
<input id="input-wastezone" type="text" class="form-control" placeholder="Zone">
<div class="input-group-prepend">
<button id="dropdown-wastetype" type="button"
<button id="dropdown-wastetype-newdate" type="button"
class="btn btn-outline-dark dropdown-toggle"
data-toggle="dropdown">
Select waste type
@ -251,17 +282,12 @@
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Plastic</a>
<a class="dropdown-item" href="#">Metal</a>
<a class="dropdown-item" href="#">residual waste</a>
<a class="dropdown-item" href="#">biowaste</a>
<a class="dropdown-item" href="#">Residual waste</a>
<a class="dropdown-item" href="#">Biowaste</a>
</div>
</div>
<input id="input-wastetime" style="width: 50px;" class="form-control" id="date"
name="date" placeholder="MM/DD/YYY" type="text"/>
<input id="input-wasteregion" type="text" class="form-control"
placeholder="Region">
<input id="input-wastezone" type="text" class="form-control" placeholder="Zone">
<button type="button" class="btn-addtolist btn btn-success"
style="float:right;">Add to list
</button>
@ -286,10 +312,55 @@
</section>
<!-- /.Left col -->
<!-- right col (We are only adding the ID to make the widgets sortable)-->
<section class="col-lg-5 connectedSortable">
<div class="card">
<div class="card-header">
<h3 class="card-title">
<i class="fas fa-chart-pie mr-1"></i>
Pick up locations
</h3>
</div><!-- /.card-header -->
<!-- /.card-header -->
<div class="card-body">
<table id="example2" class="table table-bordered table-hover">
<thead>
<tr>
<th>City</th>
<th>Zone</th>
<th>Waste Type</th>
</tr>
</thead>
<tbody id="location-table-data">
<tr>
<td>Trident</td>
<td>Internet
Explorer 4.0
</td>
<td>Win 95+</td>
</tr>
<tr>
<td>Trident</td>
<td>Internet
Explorer 5.0
</td>
<td>Win 95+</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>City</th>
<th>Zone</th>
<th>Waste Type</th>
</tr>
</tfoot>
</table>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</section>
@ -358,5 +429,22 @@
src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<script type="text/javascript" src="js/dashboard.js"></script>
<!-- DataTables -->
<script src="lib/AdminLTE/plugins/datatables/jquery.dataTables.js"></script>
<script src="lib/AdminLTE/plugins/datatables-bs4/js/dataTables.bootstrap4.js"></script>
<script>
$(function () {
$("#example2").DataTable();
$('#example1').DataTable({
"paging": true,
"lengthChange": false,
"searching": false,
"ordering": true,
"info": true,
"autoWidth": false,
});
});
</script>
</body>
</html>

31
resources/wwwroot/js/dashboard.js
View File

@ -10,7 +10,18 @@ $(document).ready(function () {
}
}, 'json');
$.post('/senddata/wastedata', 'action=getAllCities', function (data) {
for (var i = 0; i < data.size; i++) {
$('#location-table-data').append("<tr>" +
"<td>" + data[i].city + "</td>" +
"<td>" + data[i].zone + "</td>" +
"<td>" + data[i].wastetype + "</td>" +
"</tr>");
}
}, 'json');
//btn listeners
$('#logoutbtn').click(function () {
$.post('/senddata/checkloginstate', 'action=logout', function (data) {
console.log(data);
@ -21,6 +32,26 @@ $(document).ready(function () {
$('#dropdown-wastetype').html($(this).html());
});
$('#btn-savecity').click(function () {
var cityname = $("#new_city_cityname").val();
var zonename = $("#new_city_zonename").val();
var wastetype = $("#dropdown-wastetype").html();
console.log("storing: "+cityname + "--" + wastetype + "in db");
$.post('/senddata/wastedata', 'action=newCity&wastetype=' + wastetype +"&cityname="+cityname+"&wastezone="+zonename, function (data) {
console.log(data);
}, 'json');
//clear form data
var cityname = $("#new_city_cityname").val("");
var zonename = $("#new_city_zonename").val("");
var wastetype = $("#dropdown-wastetype").html("select waste type");
});
$('.btn-addtolist').click(function () {
console.log("added new row to table");
$('#addtable-body').append("<tr>" +

30
resources/wwwroot/js/index.js
View File

@ -1,18 +1,18 @@
$(document).ready(function() {
$('#loginbtn').click(function(e) {
e.preventDefault();
console.log("clicked login button");
var username = $("#userfield")[0].value;
var password = $("#passfield")[0].value;
$(document).ready(function () {
$('#loginbtn').click(function (e) {
e.preventDefault();
console.log("clicked login button");
var username = $("#userfield")[0].value;
var password = $("#passfield")[0].value;
$.post('/senddata/loginget','username='+username+'&password='+password,function(data){
$.post('/senddata/loginget', 'username=' + username + '&password=' + password, function (data) {
console.log(data);
if (data.accept == true) {
console.log("successfully logged in!");
document.cookie = "username="+username;
window.location = 'settings.html';
}
},'json');
});
console.log(data);
if (data.accept == true) {
console.log("successfully logged in!");
document.cookie = "username=" + username;
window.location = 'dashboard.html';
}
}, 'json');
});
});

146
resources/wwwroot/settings.html
View File

@ -1,146 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="lib/bootstrap.min.css">
<!--Fontawesome CDN-->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"
integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<!-- jQuery library -->
<script src="lib/jquery.min.js"></script>
<!-- Popper JS -->
<script src="lib/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="lib/bootstrap.min.js"></script>
<!-- Bootstrap Date-Picker Plugin -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
<link rel="stylesheet" type="text/css" href="css/dashboard.css">
<link rel="stylesheet" type="text/css" href="css/general.css">
<script type="text/javascript" src="js/dashboard.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark bg-dark">
<div class="navbar-collapse collapse w-100 order-1 order-md-0 dual-collapse2">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="settings.html">Settings</a>
</li>
<li class="nav-item">
<a class="nav-link" href="profile.html">Profile</a>
</li>
</ul>
</div>
<div class="mx-auto order-0">
<a class="navbar-brand mx-auto" href="#">Profile</a>
</div>
<div class="navbar-collapse collapse w-100 order-3 dual-collapse2">
<ul class="navbar-nav ml-auto">
<div class="input-group-prepend">
<span class="input-group-text"><i id="userlabel" class="fas fa-user"> lheilige</i></span>
</div>
<button type="button" id="logoutbtn" class="btn btn-primary">Logout</button>
</ul>
</div>
</nav>
<button type="button" id="addnewtable-btn" class="btn btn-primary" name="button">click me to add new table</button>
<div class="create-table hideit">
<div class="create-table-window-toolpane">
<div class="fas fa-times-circle fa-2x exit-icon"></div>
<div class="create-table-title">Add new Table</div>
</div>
<div class="create-table-window-content">
<div class="create-table-window-settings">
<form>
<h4>General options:</h4>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch1">
<label class="custom-control-label" for="customSwitch1">Notify Led-Board</label>
</div>
<div class="form-group" style="margin-top: 15px; width: 30%;">
<label for="exampleInputEmail1">Table Name</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter Table Name">
<small id="emailHelp" class="form-text text-muted">Please try to use no special characters</small>
</div>
<div class="form-group" style="width: 30%;">
<label for="exampleInputEmail1">City/Village name</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter City name here">
<small id="emailHelp" class="form-text text-muted">Please try to use no special characters</small>
</div>
<h4>Add Data:</h4>
<div class="input-group mt-3 mb-3" style="width: 50%;">
<div class="input-group-prepend">
<button id="dropdown-wastetype" type="button" class="btn btn-outline-light dropdown-toggle" data-toggle="dropdown">
Select waste type
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Plastic</a>
<a class="dropdown-item" href="#">Metal</a>
<a class="dropdown-item" href="#">residual waste</a>
<a class="dropdown-item" href="#">biowaste</a>
</div>
</div>
<input id="input-wastetime" style="width: 50px;" class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/>
<script>
$(document).ready(function(){
var date_input=$('input[name="date"]'); //our date input has the name "date"
var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
var options={
format: 'mm/dd/yyyy',
container: container,
todayHighlight: true,
autoclose: true,
};
date_input.datepicker(options);
})
</script>
<input id="input-wasteregion" type="text" class="form-control" placeholder="Region">
<input id="input-wastezone" type="text" class="form-control" placeholder="Zone">
<button type="button" class="btn-addtolist btn btn-success" style="float:right;">Add to list</button>
</div>
<h4>Your Data:</h4>
<table class="table table-dark table-hover" style="width: 50%;">
<thead>
<tr>
<th>Waste type</th>
<th>Date</th>
<th>Region</th>
<th>Zone</th>
</tr>
</thead>
<tbody id="addtable-body">
</tbody>
</table>
</form>
</div>
</div>
<div class="create-table-window-bottom">
<button id="btn-savelist" type="button" class="btn btn-success" style="float:right;">Save</button>
</div>
</div>
</body>
</html>

2
src/com/wasteinformationserver/main.java
View File

@ -21,7 +21,7 @@ public class main {
}));
Thread mythread = new Thread(() -> new Webserver().startserver());
//mythread.start();
mythread.start();
Log.message("thread started");

7
src/com/wasteinformationserver/website/MainPage.java
View File

@ -4,12 +4,9 @@ import com.sun.net.httpserver.Headers;
import com.sun.net.httpserver.HttpExchange;
import com.sun.net.httpserver.HttpHandler;
import com.wasteinformationserver.basicutils.Log;
import com.wasteinformationserver.website.datarequests.LoginState;
import com.wasteinformationserver.website.datarequests.login.LoginState;
import java.awt.*;
import java.io.*;
import java.net.URI;
import java.net.URL;
public class MainPage implements HttpHandler {
@Override
@ -29,7 +26,7 @@ public class MainPage implements HttpHandler {
Log.warning("user not logged in --> redirecting to login page");
sendPage("/index.html",t);
}
}else {
}else { //only detect login state on html pages
sendPage(path, t);
}
}

5
src/com/wasteinformationserver/website/Webserver.java
View File

@ -2,9 +2,9 @@ package com.wasteinformationserver.website;
import com.sun.net.httpserver.HttpServer;
import com.wasteinformationserver.basicutils.Log;
import com.wasteinformationserver.website.datarequests.CheckLoginState;
import com.wasteinformationserver.website.datarequests.login.CheckLoginState;
import com.wasteinformationserver.website.datarequests.DataRequest;
import com.wasteinformationserver.website.datarequests.LoginRequest;
import com.wasteinformationserver.website.datarequests.login.LoginRequest;
import com.wasteinformationserver.website.datarequests.RegisterRequest;
import java.io.IOException;
@ -22,6 +22,7 @@ public class Webserver {
}
server.createContext("/", new MainPage());
server.createContext("/senddata/loginget", new LoginRequest());
server.createContext("/senddata/registerpost",new RegisterRequest());
server.createContext("/senddata/checkloginstate",new CheckLoginState());

17
src/com/wasteinformationserver/website/datarequests/DataRequest.java
View File

@ -11,29 +11,32 @@ import java.util.HashMap;
public class DataRequest extends PostRequest {
@Override
public String request(HashMap<String, String> params) {
switch (params.get("action")){
case "senddata":
switch (params.get("action")) {
case "newCity":
Log.debug(params.toString());
// check if wastezone and wasteregion already exists
JDCB jdcb = new JDCB("users", "kOpaIJUjkgb9ur6S", "wasteinformation");
ResultSet set = jdcb.executeQuery("select * from cities where name='"+params.get("wasteregion")+"' AND wastetype='"+params.get("wastetype")+"' AND zone='"+params.get("wastezone")+"'");
ResultSet set = jdcb.executeQuery("select * from cities where name='" + params.get("cityname") + "' AND wastetype='" + params.get("wastetype") + "' AND zone='" + params.get("wastezone") + "'");
try {
if (set.getFetchSize() == 0){
if (set.getFetchSize() == 0) {
//doesnt exist
System.out.println("doesnt exist");
jdcb.executeUpdate("INSERT INTO `cities`(`userid`, `name`, `wastetype`, `zone`) VALUES (0,'"+params.get("wasteregion")+"','"+params.get("wastetype")+"','"+params.get("wastezone")+"'");
}else {
jdcb.executeUpdate("INSERT INTO `cities`(`userid`, `name`, `wastetype`, `zone`) VALUES ('0','" + params.get("cityname") + "','" + params.get("wastetype") + "','" + params.get("wastezone") + "');");
} else {
//already exists
System.out.println("already exists");
}
} catch (SQLException e) {
e.printStackTrace();
}
break;
case "getAllCities":
// TODO: 11.10.19 store data in database
// TODO: 15.11.19 database call to get all data and store it as json.
break;
}
return "";

2
src/com/wasteinformationserver/website/datarequests/CheckLoginState.java → src/com/wasteinformationserver/website/datarequests/login/CheckLoginState.java
View File

@ -1,4 +1,4 @@
package com.wasteinformationserver.website.datarequests;
package com.wasteinformationserver.website.datarequests.login;
import com.wasteinformationserver.basicutils.Log;
import com.wasteinformationserver.website.basicrequest.PostRequest;

4
src/com/wasteinformationserver/website/datarequests/LoginRequest.java → src/com/wasteinformationserver/website/datarequests/login/LoginRequest.java
View File

@ -1,4 +1,4 @@
package com.wasteinformationserver.website.datarequests;
package com.wasteinformationserver.website.datarequests.login;
import com.wasteinformationserver.basicutils.Log;
import com.wasteinformationserver.db.JDCB;
@ -13,6 +13,8 @@ public class LoginRequest extends PostRequest {
@Override
public String request(HashMap<String, String> params) {
Log.message("new login request");
String password = params.get("password");
String username = params.get("username");

2
src/com/wasteinformationserver/website/datarequests/LoginState.java → src/com/wasteinformationserver/website/datarequests/login/LoginState.java
View File

@ -1,4 +1,4 @@
package com.wasteinformationserver.website.datarequests;
package com.wasteinformationserver.website.datarequests.login;
public class LoginState {
private LoginState() {}