Skip to content

Commit

Permalink
Merge pull request #1 from Atluzka/main
Browse files Browse the repository at this point in the history
Fixed the issue where cursor is not showing up, meaning u can't interact with the menu.
Made it so when the menu is open the person cant move around or move their camera.
You can close the menu by pressing "Sulge" or escape on your keyboard.
Changed the UI to be smaller.
  • Loading branch information
walls9919 authored Dec 18, 2023
2 parents cd1cd81 + 200fd80 commit 03fa693
Show file tree
Hide file tree
Showing 7 changed files with 136 additions and 152 deletions.
17 changes: 0 additions & 17 deletions client.js

This file was deleted.

36 changes: 36 additions & 0 deletions client/client.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
let visible = false

RegisterCommand('kasiraamat', (source, args) => {
print('Käsiraamat avatud.')
setDisplay(!visible)
}, false);

RegisterNuiCallback("lahku",() => {
setDisplay(false)
});

RegisterNuiCallback("error",(data) => {
print(data.error)
setDisplay(false)
});

function setDisplay(b) {
visible = b
SetNuiFocus(b, b)
SendNUIMessage({
type: "ui",
status: b
});
}

setImmediate(() => {
while (visible) {
Delay(0);
DisableControlAction(0, 1, visible) // LookLeftRight
DisableControlAction(0, 2, visible) // LookUpDown
DisableControlAction(0, 142, visible) // MeleeAttackAlternate
DisableControlAction(0, 18, visible) // Enter
DisableControlAction(0, 322, visible) // ESC
DisableControlAction(0, 106, visible) // VehicleMouseControlOverride
}
})
18 changes: 8 additions & 10 deletions fxmanifest.lua
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,17 @@ fx_version 'cerulean'
game 'gta5'

name 'PDL Help'
author 'wallsxd'
author 'wallsxd & atluzka'
description 'Displays commands and keybind information'
version '1.0.0'
version '1.0.1'

client_scripts {"client/*.js"}

ui_page 'html/index.html'

files {
'html/index.html',
'server.lua',
'client.js'
ui_page {
'html/index.html'
}

dependencies {
'mysql-async'
files {
'html/*.*',
'html/images/*.*'
}
Binary file added html/images/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
169 changes: 47 additions & 122 deletions html/index.html
Original file line number Diff line number Diff line change
@@ -1,128 +1,53 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.0.2/dist/tailwind.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" rel="stylesheet">
<title>Playa De Las Käsiraamat</title>
<style>
body {
cursor: pointer !important;
}
</style>
</head>

<style>
/* CSS Styles */
.bg-gray-900 {
/* Your background styles */
height: 100vh; /* Setting the background height to the viewport height */
display: flex;
flex-direction: column;
justify-content: flex-start; /* Aligning content at the top */
position: relative; /* Setting position to relative for absolute positioning of elements */
}

/* Adjust the header height */
.custom-header {
height: 125px; /* Set your desired height for the header */
}

/* Position the image */
.header-image {
position: absolute;
top: 0;
left: 50%; /* Centering the image horizontally */
transform: translateX(-50%);
z-index: 1; /* Ensuring image is above other elements */
}
</style>

<body class="bg-gray-900 text-white">
<div class="flex flex-col">
<!-- Image on top -->
<div class="header-image">
<img src="https://i.imgur.com/FIL8Ht5.png" alt="Logo" class="h-32 w-32 rounded-full mt-0">
</div>

<!-- Header -->
<header class="flex justify-between items-center p-4 custom-header">
<button id="exit-button" class="bg-transparent border border-white rounded-md px-3 py-1">Sulge</button>
</header>
</div>
</body>




<!-- Main Content -->
<div class="flex flex-grow">
<!-- Sidebar -->
<div class="bg-gray-800 w-16 flex flex-col items-center">
</div>

<!-- Content -->
<div class="flex-grow bg-gray-700 p-4">
<div class="grid grid-cols-2 gap-4">
<div class="bg-gray-600 p-4 rounded-md text-center">
<h2 class="text-xl">NUPUD</h2>
<p>Siin on kõik tavalised keybindid erinevatele tegevustele mis teil vaja läheb</p>
</div>
<div class="bg-gray-600 p-4 rounded-md text-center">
<h2 class="text-xl">COMMANDID</h2>
<p>Siin on kõik tavalised commandid erinevatele tegevustele mis teil vaja läheb</p>
</div>
<div class="bg-gray-600 p-4 rounded-md text-center">
<h2 class="text-xl">F1</h2>
<p>Avab Telefoni</p>
</div>
<div class="bg-gray-600 p-4 rounded-md text-center">
<h2 class="text-xl">/ABI</h2>
<p>Avab selle sama menüü</p>
</div>
<div class="bg-gray-600 p-4 rounded-md text-center">
<h2 class="text-xl">F2</h2>
<p>Avab seljakoti</p>
</div>
<div class="bg-gray-600 p-4 rounded-md text-center">
<h2 class="text-xl">/report</h2>
<p>Loob kaebuse A-Tiimile</p>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./styles.css" type="text/css">
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.0.2/dist/tailwind.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" rel="stylesheet">
<title>Käsiraamat</title>
</head>
<body>
<div id="container" class="flex items-center justify-center h-screen">
<div class="max-w-2xl mx-auto w-full h-600 bg-gray-900">
<img src="./images/logo.png" alt='logo' class="h-32 w-32 rounded-full mt-3 mx-auto ">
<div class="flex-grow bg-gray-900 p-4 overflow-y-scroll h-96">
<div class="flex flex-col gap-6">
<div class="bg-gray-800 p-4 rounded-md text-center text-white">
<h2 class="text-xl mb-4">NUPUD</h2>
<p>Siin on kõik tavalised keybindid erinevatele tegevustele, mis teil vaja läheb</p>
</div>
<div class="bg-gray-800 p-4 rounded-md text-center text-white">
<h2 class="text-xl">F1</h2>
<p>Avab Telefoni</p>
</div>
<div class="bg-gray-800 p-4 rounded-md text-center text-white">
<h2 class="text-xl">F2</h2>
<p>Avab seljakoti</p>
</div>
<!-- Add more boxes related to "NUPUD" as needed -->

<div class="bg-gray-800 p-4 rounded-md text-center text-white">
<h2 class="text-xl mb-4">COMMANDID</h2>
<p>Siin on kõik tavalised keybindid erinevatele tegevustele, mis teil vaja läheb</p>
</div>
<div class="bg-gray-800 p-4 rounded-md text-center text-white">
<h2 class="text-xl">/ABI</h2>
<p>Avab selle sama menüü</p>
</div>
<div class="bg-gray-800 p-4 rounded-md text-center text-white">
<h2 class="text-xl">/report</h2>
<p>Loob kaebuse A-Tiimile</p>
</div>
<!-- Add more boxes related to "COMMANDID" as needed -->
</div>
</div>
<button id="close" class="bg-red-700 text-white p-2 rounded-md flex flex-col m-3 mx-auto focus:outline-none">Sulge</button>
</div>
</div>

<!-- Footer -->
<footer class="flex justify-center items-center bg-gray-800 p-4">
<span>Playa De Las Käsiraamat</span>
</footer>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/js/all.min.js"></script>

<script>
// Add event listener to exit button
document.getElementById("exit-button").addEventListener("click", function() {
// Perform desired action when the button is clicked
console.log("Exit button clicked!");
});

// Add event listener to keybinds link
document.getElementById("keybinds-link").addEventListener("click", function() {
// Perform desired action when the link is clicked
console.log("Keybinds link clicked!");
});

// Add event listener to commands link
document.getElementById("commands-link").addEventListener("click", function() {
// Perform desired action when the link is clicked
console.log("Commands link clicked!");
});
</script>
</body>

</html>
<script src="./script.js" type="text/javascript"></script>
</body>
</html>
45 changes: 45 additions & 0 deletions html/script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
$(function () {
function display(bool) {
if (bool) {
$("#container").show();
} else {
$("#container").hide();
}
}

display(false)

window.addEventListener('message', function(event) {
var item = event.data;
if (item.type === "ui") {
if (item.status == true) {
display(true)
} else {
display(false)
}
}
})

document.onkeyup = function (data) {
if (data.key == "Escape") {
fetch(`https://${GetParentResourceName()}/lahku`, {
method: 'POST',
headers: {
'Content-Type': 'application/json; charset=UTF-8',
},
body: JSON.stringify({})
}).then(resp => resp.json()).then(resp => console.log(resp));
return
}
};
$("#close").click(function () {
fetch(`https://${GetParentResourceName()}/lahku`, {
method: 'POST',
headers: {
'Content-Type': 'application/json; charset=UTF-8',
},
body: JSON.stringify({})
}).then(resp => resp.json()).then(resp => console.log(resp));
return
})
})
3 changes: 0 additions & 3 deletions server.lua

This file was deleted.

0 comments on commit 03fa693

Please sign in to comment.