From fbb0226b2e845652ba17813bac41bf3b7a32f2b6 Mon Sep 17 00:00:00 2001
From: Heshan Basnayaka <34080199+3UR3K4@users.noreply.github.com>
Date: Fri, 27 Aug 2021 22:41:40 +0530
Subject: [PATCH] Add files via upload

---
 client/main.lua |  73 ++++++++++++++
 config.lua      |   8 ++
 fxmanifest.lua  |  23 +++++
 html/app.js     | 159 +++++++++++++++++++++++++++++
 html/index.html |  48 +++++++++
 html/style.css  | 261 ++++++++++++++++++++++++++++++++++++++++++++++++
 6 files changed, 572 insertions(+)
 create mode 100644 client/main.lua
 create mode 100644 config.lua
 create mode 100644 fxmanifest.lua
 create mode 100644 html/app.js
 create mode 100644 html/index.html
 create mode 100644 html/style.css

diff --git a/client/main.lua b/client/main.lua
new file mode 100644
index 0000000..c7ba00f
--- /dev/null
+++ b/client/main.lua
@@ -0,0 +1,73 @@
+local inWebView = false
+local WebView = {}
+
+WebView.Open = function()
+    SendNUIMessage({
+        action = "open"
+    })
+    SetNuiFocus(true, true)
+    inWebView = true
+end
+
+WebView.Close = function()
+    SendNUIMessage({
+        action = "close"
+    })
+    SetNuiFocus(false, false)
+    inWebView = false
+end
+
+WebView.DrawText3Ds = function(coords, text)
+	SetTextScale(0.35, 0.35)
+    SetTextFont(4)
+    SetTextProportional(1)
+    SetTextColour(255, 255, 255, 215)
+    SetTextEntry("STRING")
+    SetTextCentre(true)
+    AddTextComponentString(text)
+    SetDrawOrigin(coords.x, coords.y, coords.z, 0)
+    DrawText(0.0, 0.0)
+    local factor = (string.len(text)) / 370
+    DrawRect(0.0, 0.0+0.0125, 0.017+ factor, 0.03, 0, 0, 0, 75)
+    ClearDrawOrigin()
+end
+
+RegisterNUICallback('close', function()
+    SetNuiFocus(false, false)
+    inWebView = false
+end)
+
+local inRange = false
+
+
+
+local creatingCompany = false
+local currentName = nil
+Citizen.CreateThread(function()
+    while true do
+
+        local ped = PlayerPedId()
+        local pos = GetEntityCoords(ped)
+        inRange = false
+
+        local dist = #(pos - Config.Webcoords.coords)
+
+        if dist < 20 then
+            inRange = true
+            DrawMarker(2, Config.Webcoords.coords.x, Config.Webcoords.coords.y, Config.Webcoords.coords.z, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.3, 0.2, 0.2, 155, 152, 234, 155, false, false, false, true, false, false, false)
+            if #(pos - vector3(Config.Webcoords.coords.x, Config.Webcoords.coords.y, Config.Webcoords.coords.z)) < 1.5 then
+                WebView.DrawText3Ds(Config.Webcoords.coords, '~g~E~w~ - Web view')
+                if IsControlJustPressed(0, 38) then
+                    WebView.Open()
+                end
+            end
+        end
+
+        if not inRange then
+            Citizen.Wait(1000)
+        end
+
+        Citizen.Wait(2)
+    end
+end)
+
diff --git a/config.lua b/config.lua
new file mode 100644
index 0000000..b876fe2
--- /dev/null
+++ b/config.lua
@@ -0,0 +1,8 @@
+Config = Config or {}
+
+Config.CompanyPrice = 25000
+
+Config.Webcoords = {
+    coords = vector3(274.8, -330.37, 44.92)
+}
+
diff --git a/fxmanifest.lua b/fxmanifest.lua
new file mode 100644
index 0000000..18bf19f
--- /dev/null
+++ b/fxmanifest.lua
@@ -0,0 +1,23 @@
+fx_version 'cerulean'
+game 'gta5'
+
+description 'Script By 3UR3K4'
+version '1.0.0'
+
+ui_page 'html/index.html'
+
+shared_scripts { 
+
+	'config.lua'
+}
+
+server_script 'server/main.lua'
+client_script 'client/main.lua'
+
+files {
+    'html/*.js',
+    'html/*.html',
+    'html/*.css',
+    
+
+}
\ No newline at end of file
diff --git a/html/app.js b/html/app.js
new file mode 100644
index 0000000..626e21e
--- /dev/null
+++ b/html/app.js
@@ -0,0 +1,159 @@
+var WebView = {}
+var mouseOver = false;
+var selectedIdentity = null;
+var selectedIdentityType = null;
+var selectedJob = null;
+var selectedJobId = null;
+
+WebView.Open = function(data) {
+    $(".container").fadeIn(150);
+}
+
+WebView.Close = function() {
+    $(".container").fadeOut(150, function(){
+        WebView.ResetPages();
+    });
+    $.post('https://Web-View/close');
+
+    $(selectedJob).removeClass("job-selected");
+    $(selectedIdentity).removeClass("job-selected");
+}
+
+WebView.ResetPages = function() {
+    $(".webview-option-blocks").show();
+    $(".webview-identity-page").hide();
+    $(".webview-job-page").hide();
+}
+
+$(document).ready(function(){
+    window.addEventListener('message', function(event) {
+        switch(event.data.action) {
+            case "open":
+                WebView.Open(event.data);
+                break;
+            case "close":
+                WebView.Close();
+                break;
+        }
+    })
+});
+
+$(document).on('keydown', function() {
+    switch(event.keyCode) {
+        case 27: // ESC
+            WebView.Close();
+            break;
+    }
+});
+
+$('.webview-option-block').click(function(e){
+    e.preventDefault();
+
+    var blockPage = $(this).data('page');
+
+    $(".webview-option-blocks").fadeOut(100, function(){
+        $(".webview-"+blockPage+"-page").fadeIn(100);
+    });
+
+    if (blockPage == "identity") {
+        $(".identity-page-blocks").html("");
+        $(".identity-page-blocks").html('<div class="identity-page-block" data-type="id_card"><p>Birth Certificate</p></div>');
+
+        $.post('https://Web-View/requestLicenses', JSON.stringify({}), function(licenses){
+            $.each(licenses, function(i, license){
+                var elem = '<div class="identity-page-block" data-type="'+license.idType+'"><p>'+license.label+'</p></div>';
+                $(".identity-page-blocks").append(elem);
+            });
+        });
+    }
+});
+
+$(document).on("click", ".identity-page-block", function(e){
+    e.preventDefault();
+
+    var idType = $(this).data('type');
+
+    selectedIdentityType = idType;
+
+    if (selectedIdentity == null) {
+        $(this).addClass("identity-selected");
+        $(".hover-description").fadeIn(10);
+        selectedIdentity = this;
+        if (idType == "id_card") {
+            $(".request-identity-button").fadeIn(100);
+            $(".request-identity-button").html("<p>Click Here to Buy a Birth Certificate for $50</p>")
+        } else if (idType == "driver_license") {
+            $(".request-identity-button").fadeIn(100);
+            $(".request-identity-button").html("<p>Click Here to Buy a Driver License for $50</p>")
+        } else if (idType == "weaponlicense") {
+            $(".request-identity-button").fadeIn(100);
+            $(".request-identity-button").html("<p>Click Here to Buy a Firearms License for $50</p>")
+        }
+    } else if (selectedIdentity == this) {
+        $(this).removeClass("identity-selected");
+        selectedIdentity = null;
+        $(".request-identity-button").fadeOut(100);
+    } else {
+        $(selectedIdentity).removeClass("identity-selected");
+        $(this).addClass("identity-selected");
+        selectedIdentity = this;
+        if (idType == "id_card") {
+            $(".request-identity-button").html("<p>You paid $50 for a Birth Certificate</p>")
+        } else if (idType == "driver_license") {
+            $(".request-identity-button").html("<p>You paid $50 for a Driver License</p>")
+        } else if (idType == "weaponlicense") {
+            $(".request-identity-button").html("<p>You paid $50 for a Firearms License</p>")
+        }
+    }
+});
+
+$(".request-identity-button").click(function(e){
+    e.preventDefault();
+
+    $.post('https://Web-View/requestId', JSON.stringify({
+        idType: selectedIdentityType
+    }))
+
+    WebView.ResetPages();
+});
+
+$(document).on("click", ".job-page-block", function(e){
+    e.preventDefault();
+
+    var job = $(this).data('job');
+
+    selectedJobId = job;
+
+    if (selectedJob == null) {
+        $(this).addClass("job-selected");
+        selectedJob = this;
+        $(".apply-job-button").fadeIn(100);
+    } else if (selectedJob == this) {
+        $(this).removeClass("job-selected");
+        selectedJob = null;
+        $(".apply-job-button").fadeOut(100);
+    } else {
+        $(selectedJob).removeClass("job-selected");
+        $(this).addClass("job-selected");
+        selectedJob = this;
+    }
+});
+
+$(document).on('click', '.apply-job-button', function(e){
+    e.preventDefault();
+
+    $.post('https://Web-View/applyJob', JSON.stringify({
+        job: selectedJobId
+    }))
+
+    WebView.ResetPages();
+});
+
+$(document).on('click', '.back-to-main', function(e){
+    e.preventDefault();
+
+    $(selectedJob).removeClass("job-selected");
+    $(selectedIdentity).removeClass("job-selected");
+
+    WebView.ResetPages();
+});
diff --git a/html/index.html b/html/index.html
new file mode 100644
index 0000000..a654931
--- /dev/null
+++ b/html/index.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css">
+    <link rel="stylesheet" href="./style.css">
+    
+</head>
+
+    <body>
+        <div class="container">
+            <div class="webview-main-container">
+
+<!-- 
+
+                  
+    If you using custom php based webapplicaion ? like MDT system You mus copy this code block and paste to your index.php file and login.php file.
+
+    <?php
+    $secure = true; 
+    $httponly = true;
+    $samesite = 'none';
+    $lifetime=600;
+    $maxlifetime=0;
+
+    if(PHP_VERSION_ID < 70300) {
+        session_set_cookie_params($maxlifetime, '/; samesite='.$samesite, $_SERVER['HTTP_HOST'], $secure, $httponly);
+    } else {
+        session_set_cookie_params([
+            'lifetime' => $maxlifetime,
+            'path' => '/',
+            'domain' => $_SERVER['HTTP_HOST'],
+            'secure' => $secure,
+            'httponly' => $httponly,
+            'samesite' => $samesite
+        ]);
+    }
+
+    ?>
+-->
+               
+                <iframe src="http://eample.com/" style="border:0px #ffffff none;" name="myiFrame" scrolling="no" frameborder="1" marginheight="0px" marginwidth="0px" height="600px" width="1077px" allowfullscreen></iframe>    
+    </body>
+    <script src="./app.js"></script>
+</html>
\ No newline at end of file
diff --git a/html/style.css b/html/style.css
new file mode 100644
index 0000000..c826613
--- /dev/null
+++ b/html/style.css
@@ -0,0 +1,261 @@
+@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
+
+body {
+    overflow: hidden;
+}
+
+.container {
+    display: none;
+    height: 100vh;
+}
+
+.webview-main-container{
+    position: relative;
+    background-position: center center;
+    background-image: url('./img/img-1.jpg');
+    backface-visibility: hidden;
+    animation: slideBg 10s ease-in-out infinite 0s;
+    animation-timing-function: ease-in-out;
+    width: 100vh;
+    height: 70vh;
+    margin: 0 auto;
+    top: 15vh;
+    background-size: cover;
+    background-repeat: no-repeat;
+    box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.226);
+}
+
+.header-logo {
+    position: relative; left: 475px;
+    width: 11.5vh;
+    
+}
+
+
+
+.webview-header {
+    position: relative; 
+    width: 100%;
+    height: 13vh;
+    background: rgb(1, 58, 143);
+
+}
+
+.webview-option-blocks {
+    position: relative;
+    height: 40vh;
+    width: 80vh;
+    margin: 0 auto;
+    top: 5vh;
+    background: rgba(37, 37, 37, 0.418)
+}
+
+.webview-identity-page {
+    display: none;
+    position: relative;
+    height: 40vh;
+    width: 80vh;
+    margin: 0 auto;
+    top: 5vh;
+    background: rgba(37, 37, 37, 0.418)
+}
+
+.webview-job-page {
+    display: none;
+    position: relative;
+    height: 40vh;
+    width: 80vh;
+    margin: 0 auto;
+    top: 5vh;
+    background: rgba(37, 37, 37, 0.418)
+}
+
+.webview-option-block {
+    position: relative;
+    width: 18vh;
+    height: 18vh;
+    float: left;
+    margin-right: 2vh;
+    margin-bottom: 2vh;
+    left: 1vh;
+    top: 1vh;
+    text-align: center;
+    border-bottom: 6px solid rgba(255, 255, 255, 0);
+    transition: all 0.1s linear;
+}
+
+.webview-option-block:hover {
+    border-bottom: 6px solid rgb(255, 255, 255);
+    opacity: 0.9;
+}
+
+.webview-option-block > i {
+    font-size: 5vh;
+    line-height: 10vh;
+    color: white;
+}
+
+.webview-option-block > p {
+    color: white;
+    font-weight: bold;
+    font-family: sans-serif;
+    letter-spacing: 0.1vh;
+    font-size: 1.6vh;
+}
+
+.identity-page-blocks {
+    position: relative;
+    height: 100%;
+    width: 25%;
+    padding: 1vh;
+}
+
+.identity-page-block {
+    width: 100%;
+    height: 15%;
+    background: rgb(212, 53, 53);
+    transition: all 0.1s ease-in-out;
+    border-bottom: 2px solid rgba(255, 255, 255, 0);
+}
+
+.identity-page-block:hover {
+    background: rgb(255, 58, 58);
+}
+
+.identity-page-block > p {
+    position: relative;
+    text-align: center;
+    line-height: 6vh;
+    font-family: sans-serif;
+    text-transform: uppercase;
+    font-weight: bold;
+    letter-spacing: 0.1vh;
+    color: white;
+    font-size: 1.3vh;
+}
+
+.hover-description {
+    position: absolute;
+    top: 0;
+    right: 0;
+    padding: 1vh;
+    margin: 4vh;
+    background: rgba(34, 34, 34, 0.75);
+    border-radius: 1vh;
+}
+
+.hover-description > p {
+    color: white;
+    font-family: 'Montserrat';
+    font-size: 1.3vh;
+}
+
+.identity-selected {
+    border-bottom: 2px solid #fff;
+}
+
+.request-identity-button {
+    display: none;
+    position: absolute;
+    bottom: 0;
+    right: 0;
+    margin: 5vh;
+    width: 20vh;
+    height: 5vh;
+    background: rgb(235, 50, 50);
+}
+
+.request-identity-button > p {
+    color: white;
+    text-align: center;
+    font-family: sans-serif;
+    text-transform: uppercase;
+    font-size: 1.1vh;
+    font-weight: bold;
+    line-height: 3vh;
+    letter-spacing: 0.05vh;
+}
+
+.job-page-blocks {
+    position: relative;
+    height: 100%;
+    width: 25%;
+    padding: 1vh;
+}
+
+.job-page-block {
+    width: 100%;
+    height: 15%;
+    background: rgb(212, 53, 53);
+    transition: all 0.1s ease-in-out;
+    border-bottom: 2px solid rgba(255, 255, 255, 0);
+}
+
+.job-page-block:hover {
+    background: rgb(255, 58, 58);
+}
+
+.job-page-block > p {
+    position: relative;
+    text-align: center;
+    line-height: 6vh;
+    font-family: sans-serif;
+    text-transform: uppercase;
+    font-weight: bold;
+    letter-spacing: 0.1vh;
+    color: white;
+    font-size: 1.3vh;
+}
+
+.apply-job-button {
+    display: none;
+    position: absolute;
+    bottom: 0;
+    right: 0;
+    margin: 5vh;
+    width: 20vh;
+    height: 5vh;
+    background: rgb(235, 50, 50);
+    transition: all 0.1s linear;
+}
+
+.apply-job-button:hover {
+    background: rgb(255, 82, 82);
+}
+
+.apply-job-button > p {
+    color: white;
+    text-align: center;
+    font-family: sans-serif;
+    text-transform: uppercase;
+    font-size: 1.1vh;
+    font-weight: bold;
+    line-height: 3vh;
+    letter-spacing: 0.05vh;
+}
+
+.job-selected {
+    border-bottom: 2px solid #fff;
+}
+
+.back-to-main {
+    position: absolute;
+    top: 0;
+    right: 0;
+    margin: 1vh;
+    width: 20vh;
+    height: 5vh;
+    background: rgb(235, 50, 50);
+    transition: all 0.1s linear;
+}
+
+.back-to-main > p {
+    color: white;
+    text-align: center;
+    font-family: sans-serif;
+    text-transform: uppercase;
+    font-size: 1.1vh;
+    font-weight: bold;
+    line-height: 3vh;
+    letter-spacing: 0.05vh;
+}
\ No newline at end of file