jun 20
This commit is contained in:
BIN
assets/images/4102326_cloud_sun_sunny_weather_icon.png
Normal file
BIN
assets/images/4102326_cloud_sun_sunny_weather_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
assets/images/blue-sky-with-clouds.jpg
Normal file
BIN
assets/images/blue-sky-with-clouds.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.6 MiB |
12
index.php
12
index.php
@@ -196,6 +196,7 @@
|
||||
</div>
|
||||
<img src="assets/images/logo.webp" class="logo-img mt-3 mt-lg-0 mt-md-0" alt="">
|
||||
|
||||
<!-- Login -->
|
||||
<div class="dropdown" id="dropdownid" style="position: absolute; width: fit-content;">
|
||||
<a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<i class="fa-solid fa-users"></i>
|
||||
@@ -209,6 +210,17 @@
|
||||
} ?>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Weather icon -->
|
||||
|
||||
<?php if (loggedin()) {
|
||||
echo '<div class="weather-div" style="position: absolute; color: white; font-size: 25px; left:10%; top:15px;">
|
||||
<a style="color:white" href="weather.php"><i class="fa-solid fa-cloud-sun"></i></a>
|
||||
|
||||
<div>';
|
||||
}?>
|
||||
|
||||
|
||||
|
||||
<!-- site navigation-->
|
||||
|
||||
<nav class="menu d-flex d-md-none justify-content-center align-items-center w-100 " style="background-color: white; height: 68px;">
|
||||
|
||||
@@ -6,7 +6,7 @@ if (!loggedin()) {
|
||||
if (
|
||||
isset($_POST['name']) && isset($_POST['surname']) && isset($_POST['email'])
|
||||
&& isset($_POST['password']) && isset($_POST['password_again']) && isset($_POST['birth_day'])
|
||||
&& isset($_POST['birth_month']) && isset($_POST['birth_year'])
|
||||
&& isset($_POST['birth_month']) && isset($_POST['birth_year']) && isset($_POST['city'])
|
||||
) {
|
||||
$name = $_POST['name'];
|
||||
$surname = $_POST['surname'];
|
||||
@@ -17,10 +17,11 @@ if (!loggedin()) {
|
||||
$birth_day = $_POST['birth_day'];
|
||||
$birth_month = $_POST['birth_month'];
|
||||
$birth_year = $_POST['birth_year'];
|
||||
$city = $_POST['city'];
|
||||
|
||||
if (
|
||||
!empty($name) && !empty($password) && !empty($password_again) &&
|
||||
!empty($email) && !empty($birth_day) && !empty($birth_month) && !empty($birth_year)
|
||||
!empty($email) && !empty($birth_day) && !empty($birth_month) && !empty($birth_year) && !empty($city)
|
||||
) {
|
||||
if (strlen($name) > 30) {
|
||||
echo 'Please ahear to maxlength of fields';
|
||||
@@ -46,11 +47,11 @@ if (!loggedin()) {
|
||||
echo 'The email ' . $email . 'already exists';
|
||||
} else {
|
||||
$query = "INSERT INTO `globaly_accounts` VALUES (NULL ,'" . mysqli_real_escape_string($con, $name) .
|
||||
"','" . mysqli_real_escape_string($con, $surname) ."','" . mysqli_real_escape_string($con, $email) . "','" . mysqli_real_escape_string($con, $password_hash) . "','" .
|
||||
"','" . mysqli_real_escape_string($con, $surname) ."','" . mysqli_real_escape_string($con, $email) . "','" . mysqli_real_escape_string($con, $password_hash) . "','" . mysqli_real_escape_string($con, $city) ."','" .
|
||||
mysqli_real_escape_string($con, $birth_day) . "','" . mysqli_real_escape_string($con, $birth_month) . "','" . mysqli_real_escape_string($con, $birth_year) . "')";
|
||||
if ($query_run = mysqli_query($con, $query)) {
|
||||
echo '<script>alert("You are registerd!")</script>';
|
||||
header('Location: ../index.html');
|
||||
header('Location: ../index.php');
|
||||
} else {
|
||||
echo 'We could not register you!';
|
||||
}
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
.fa-solid {
|
||||
position: absolute;
|
||||
right: 3%;
|
||||
top: 46%;
|
||||
top: 41%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -74,7 +74,7 @@
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.fa-solid {
|
||||
top: 46%;
|
||||
top: 41%;
|
||||
}
|
||||
#pswd_info {
|
||||
|
||||
@@ -86,7 +86,7 @@
|
||||
@media screen and (min-width: 992px) {
|
||||
|
||||
.fa-solid {
|
||||
top: 45%;
|
||||
top: 40%;
|
||||
|
||||
}
|
||||
|
||||
@@ -123,6 +123,7 @@
|
||||
<input class="input-text" type="password" id="password" placeholder="Password" name="password">
|
||||
<i id="togglePassword" class="fa-solid fa-eye"></i>
|
||||
<input class="input-text" type="password" placeholder="Confirm Password" name="password_again">
|
||||
<input class="input-text" type="text" placeholder="City" name="city">
|
||||
<h6>Date of birth:</h6>
|
||||
<div class="date-container">
|
||||
<span>
|
||||
|
||||
@@ -105,18 +105,12 @@ input::placeholder {
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
// .register{
|
||||
// .register-link{
|
||||
// color: #15c1c6;
|
||||
// cursor: pointer;
|
||||
// margin-right: 10px;
|
||||
|
||||
// }
|
||||
// .register-link:hover{
|
||||
// color:#333333;
|
||||
// transition: 0.3s;
|
||||
// }
|
||||
// }
|
||||
.weather-div{
|
||||
position: absolute;
|
||||
top: 2%;
|
||||
right: 10px ;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.dropdown {
|
||||
|
||||
@@ -110,6 +110,13 @@ input::placeholder {
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.weather-div {
|
||||
position: absolute;
|
||||
top: 2%;
|
||||
right: 10px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.dropdown {
|
||||
position: absolute;
|
||||
|
||||
File diff suppressed because one or more lines are too long
148
weather.php
Normal file
148
weather.php
Normal file
@@ -0,0 +1,148 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Current Weather</title>
|
||||
<script src="https://kit.fontawesome.com/4bb6479073.js" crossorigin="anonymous"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<style>
|
||||
body{
|
||||
background-image: url('assets/images/blue-sky-with-clouds.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
flex-direction: column;
|
||||
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
|
||||
}
|
||||
|
||||
.weather{
|
||||
margin-top: 150px;
|
||||
background: linear-gradient(135deg, #e5eeeb,#1ab5ed);
|
||||
border-radius: 20px;
|
||||
width: 90%;
|
||||
max-width: 470px;
|
||||
height: fit-content;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40px 35px;
|
||||
}
|
||||
.col{
|
||||
display: flex;
|
||||
font-size: 20px;
|
||||
margin: 10px 0;
|
||||
|
||||
}
|
||||
.wind{
|
||||
margin: 0;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.humidity{
|
||||
margin: 0;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 80px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.back{
|
||||
margin-top: 10px;
|
||||
padding: 20px 30px;
|
||||
border: none;
|
||||
border-radius: 20px;
|
||||
background-color: #1ab5ed;
|
||||
color:white;
|
||||
cursor:pointer;
|
||||
text-transform: uppercase;
|
||||
border-radius: 29px;
|
||||
font-weight: 900;
|
||||
font-style: normal;
|
||||
padding: 19px 38px;
|
||||
font-size: 1rem;
|
||||
letter-spacing: .04em;
|
||||
}
|
||||
.back:hover{
|
||||
background-color: white;
|
||||
color: black;
|
||||
transition: 0.3s;
|
||||
}
|
||||
</style>
|
||||
|
||||
<?php
|
||||
require 'php/connect.inc.php';
|
||||
require 'php/login.php';
|
||||
|
||||
|
||||
if (isset($_SESSION['user_id'])) {
|
||||
$user_id = $_SESSION['user_id'];
|
||||
|
||||
$query = "SELECT `city` FROM `globaly_accounts` WHERE `id` = " . mysqli_real_escape_string($con, $user_id);
|
||||
$query_run = mysqli_query($con, $query);
|
||||
$query_num_rows = mysqli_num_rows($query_run);
|
||||
|
||||
if ($query_num_rows == 0) {
|
||||
echo 'Error';
|
||||
} else if ($query_num_rows == 1) {
|
||||
$row = mysqli_fetch_assoc($query_run);
|
||||
$city = $row['city'];
|
||||
}
|
||||
} else {
|
||||
echo 'User not logged in';
|
||||
}
|
||||
|
||||
?>
|
||||
<body>
|
||||
<div class="weather">
|
||||
<img src="assets/images/4102326_cloud_sun_sunny_weather_icon.png" alt="">
|
||||
<h1 class="temp">22c</h1>
|
||||
<h2 class="city">Novi sad</h2>
|
||||
<div class="details">
|
||||
<div class="col">
|
||||
<i class="fa-solid fa-water"></i>
|
||||
<p class="humidity">50%</p>
|
||||
</div>
|
||||
<div class="col">
|
||||
<i class="fa-solid fa-wind"></i>
|
||||
<p class="wind">15km/h</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="btn-back">
|
||||
<a href="index.php"><input class="back" type="submit" value="Back"></a>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
const apiKey = "15ed697a5c8a6bbd5d1c39639416d150";
|
||||
const apiUrl = "https://api.openweathermap.org/data/2.5/weather?units=metric&q=";
|
||||
const city = "<?php echo $city; ?>";
|
||||
|
||||
|
||||
async function checkWeather(){
|
||||
const response = await fetch(apiUrl + city + `&appid=${apiKey}`);
|
||||
var data = await response.json();
|
||||
|
||||
document.querySelector(".city").innerHTML = data.name;
|
||||
document.querySelector(".temp").innerHTML = Math.round(data.main.temp) + "°C";
|
||||
document.querySelector(".humidity").innerHTML = data.main.humidity + " %";
|
||||
document.querySelector(".wind").innerHTML = data.wind.speed + " km/h";
|
||||
|
||||
}
|
||||
|
||||
checkWeather();
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user