From 45ff06af841a339bcb1e0bcb9aa2de738c517c9c Mon Sep 17 00:00:00 2001 From: anulax1225 Date: Fri, 8 Mar 2024 10:26:14 +0100 Subject: [PATCH] Fused all code --- css/global.css | 83 ++++++++++ css/ship.css | 42 +++++ html/templates/auth/login.html | 5 +- html/templates/auth/reg.html | 12 +- html/templates/contracts/contracts.html | 4 + html/templates/contracts/contracts_modal.html | 16 ++ html/templates/ship/ship.html | 16 ++ html/templates/ship/ship_modal.html | 9 ++ js/controllers/contracts.js | 133 +++++++++++++++ js/controllers/login.js | 48 +++--- js/controllers/menu_mod.js | 18 ++- js/controllers/reg.js | 70 ++++---- js/controllers/ships.js | 152 ++++++++++++++++++ 13 files changed, 529 insertions(+), 79 deletions(-) create mode 100644 css/global.css create mode 100644 css/ship.css create mode 100644 html/templates/contracts/contracts.html create mode 100644 html/templates/contracts/contracts_modal.html create mode 100644 html/templates/ship/ship.html create mode 100644 html/templates/ship/ship_modal.html create mode 100644 js/controllers/contracts.js create mode 100644 js/controllers/ships.js diff --git a/css/global.css b/css/global.css new file mode 100644 index 0000000..3e479ab --- /dev/null +++ b/css/global.css @@ -0,0 +1,83 @@ +/* Copyright © 2023 Entreprise SkamCraft */ + + + +body, +html { + height: 100%; +} + + + +.btn-infos { + margin: 2px; + /* color: black; */ + background-color: transparent; + border: 5px solid #0018e8; + border-radius: 10px; +} + +.btn-infos:hover { + border-color: #0018e8; + background-color: #0018e8; + ; +} + +.btn-accept { + margin: 2px; + /* color: black; */ + background-color: transparent; + border: 5px solid #0018e8; + border-radius: 10px; +} + +.btn-accept:hover { + border-color: rgb(33, 196, 0); + background-color: rgb(33, 196, 0); +} + +.card { + margin-bottom: 30px; +} + +.contract-screen { + display: flex; + justify-content: center; + background-image: url("/assets/contracts/contractscreen.png"); + background-repeat: no-repeat; + background-position: center; + height: 100vh; + +} + +.card-body { + display: grid; + grid-template-columns: 1fr 1fr; + margin-left: 200px; + margin-top: -160px; + width: 100%; +} + +.card-body button { + margin-top: 50px; + margin-right: 29px; + margin-left: -11px; + width: 240px; +} + +.contracts { + margin-left: 240px; + margin-top: 250px; + height: 100vh; + width: 100vh; +} + +/* Modal */ + +.status-onhold { + color: orange; +} + +.status-accepted { + color: greenyellow; +} \ No newline at end of file diff --git a/css/ship.css b/css/ship.css new file mode 100644 index 0000000..b842d69 --- /dev/null +++ b/css/ship.css @@ -0,0 +1,42 @@ +* { + box-sizing: border-box; +} +@font-face { + font-family: M42; + src: url("/assets/fonts/m42.TTF"); +} +.block-ships{ + display:flex; + justify-content: center; + align-items: center; + color: white; + font-size:large; +} +.ships{ + display: flex; + flex-direction: column; + flex-wrap: wrap; + text-align: center; +} +button{ + color: white; + font-family: 'M42'; + background-color: black; + font-size:x-small; + box-shadow: 3px 2px white; + border: 4px solid white; + border-radius: 10px; + padding: 10px; + padding-left: 15px; + padding-right: 15px; +} +button:hover{ + background-color:aqua ; + transition: 1s; +} +.ships>*{ + flex: 100px; +} +.my-modal{ + font-size:small; +} diff --git a/html/templates/auth/login.html b/html/templates/auth/login.html index 81974a4..04c3c7e 100644 --- a/html/templates/auth/login.html +++ b/html/templates/auth/login.html @@ -3,9 +3,10 @@

Login

+ Remember me ?
- - + +
\ No newline at end of file diff --git a/html/templates/auth/reg.html b/html/templates/auth/reg.html index 4d68dcd..6cdb9be 100644 --- a/html/templates/auth/reg.html +++ b/html/templates/auth/reg.html @@ -2,11 +2,15 @@

New Agent

- - + + + Remember me ?
- - + +
\ No newline at end of file diff --git a/html/templates/contracts/contracts.html b/html/templates/contracts/contracts.html new file mode 100644 index 0000000..de05fa8 --- /dev/null +++ b/html/templates/contracts/contracts.html @@ -0,0 +1,4 @@ + +
+
+
\ No newline at end of file diff --git a/html/templates/contracts/contracts_modal.html b/html/templates/contracts/contracts_modal.html new file mode 100644 index 0000000..e09dddd --- /dev/null +++ b/html/templates/contracts/contracts_modal.html @@ -0,0 +1,16 @@ + + +
+

Contract

+

+

+

+

+

+

+

+

+
+ +
+
\ No newline at end of file diff --git a/html/templates/ship/ship.html b/html/templates/ship/ship.html new file mode 100644 index 0000000..15fda81 --- /dev/null +++ b/html/templates/ship/ship.html @@ -0,0 +1,16 @@ + + + + + + Ship + + +
+
+ +
+
+ + + \ No newline at end of file diff --git a/html/templates/ship/ship_modal.html b/html/templates/ship/ship_modal.html new file mode 100644 index 0000000..a5a542c --- /dev/null +++ b/html/templates/ship/ship_modal.html @@ -0,0 +1,9 @@ + +
+
+ +
+
+ +
+
\ No newline at end of file diff --git a/js/controllers/contracts.js b/js/controllers/contracts.js new file mode 100644 index 0000000..941379e --- /dev/null +++ b/js/controllers/contracts.js @@ -0,0 +1,133 @@ +// Copyright © 2023 Entreprise SkamKraft +"use strict"; + +import { SpaceTraders } from "../skama_code/api/config.js"; + +import menu_mod from "./menu_mod.js"; +import { My } from "../skama_code/api/agent.js"; +import { Contract } from "../skama_code/api/contract.js"; +import { Modal } from "../skama_code/ui/modal.js"; + + +export default (temp_engine) => { + + + let modal = new Modal("contract-modal", temp_engine); + + temp_engine.after_render((temp_engine) => { + + modal.load("templates/contracts/contracts_modal.html"); + + Contract.list(10, 1, (contracts) => { + + //Evenements + temp_engine.add_event(".btn-accept", "click", (e) => { + contracts.forEach((contract) => { + if ($(e.target).attr("data-id") == contract.id) { + contract.accept(() => { + $(e.target).parent().children(".status-onhold").html("Status : accepté"); + $(e.target).parent().children(".status-onhold").attr("class", 'status-accepted'); + $(e.target).html("Contract accepted") + // $(e.target).remove(); + + }); + } + }); + }); + + temp_engine.add_event(".btn-infos", "click", (e) => { + contracts.forEach((contract) => { + + const id_contract = $(e.target).attr("data-id"); + + $(".contract-id").text("ID : " + contract.id); + $(".contract-faction").text("Faction : " + contract.faction); + $(".contract-type").text("Type : " + contract.type); + $(".contract-expiration").text("Expiration : " + contract.expiration); + $(".contract-payment-accepted").text("Payment : " + contract.paymentAccepted + " $"); + $(".contract-payment-fulfill").text("Payment fulfill : " + contract.paymentFulfill + " $"); + $(".contract-tradeSymbol").text("Trade Symbol : " + contract.tradeSymbol); + $(".contract-destinationSymbol").text("Destination : " + contract.destination); + + modal.show(); + + }); + + }); + + contracts.forEach(contract => { + let img + let status + let card + + + + if (contract.type = "PROCUREMENT") { + img = "/assets/contracts/procurement.png" + } + else if (contract.type = "TRANSPORT") { + img = "/assets/contracts/transportation.png" + } + else { + img = "/assets/contracts/shuttle.png" + } + + if (contract.accepted) { + status = "accepted" + card = + ` +
+ +
+
${contract.faction}
+

${contract.deadline}

+

${contract.deadline}

+

${contract.deadline}

+

${contract.deadline}

+

${contract.deadline}

+

Status : ${status}

+ +
+
+ ` + } + + else { + status = "on hold" + card = + ` +
+ +
+
${contract.faction}
+

${contract.deadline}

+

${contract.deadline}

+

${contract.deadline}

+

${contract.deadline}

+

Status : ${status}

+

Revenu : ${contract.paymentAccepted} $

+

+ + +
+
+ ` + } + + $('.contracts').append(card); + $('.contracts').append(card); + + + }); + + }) + + temp_engine.add_event(".btn-close", "click", () => { + modal.close(); + }); + + menu_mod(temp_engine); + }); + + temp_engine.render("templates/contracts/contracts.html") +} \ No newline at end of file diff --git a/js/controllers/login.js b/js/controllers/login.js index 3b4cc9e..a981ba0 100644 --- a/js/controllers/login.js +++ b/js/controllers/login.js @@ -1,51 +1,39 @@ -import { Modal } from "../skama_code/ui/modal.js"; import { Auth } from "../skama_code/auth/auth.js"; import { My } from "../skama_code/api/agent.js"; import home from "./home.js"; import menu_mod from "./menu_mod.js"; +import { AgentBuilder } from "../skama_code/api/agent.js"; export default function login(temp_engine) { - let auth = new Auth(true); - let modal = new Modal("login-modal", temp_engine); + const auth = new Auth(); - modal.add_class("ext-modal"); temp_engine.after_render((temp_engine) => { - modal.load("templates/auth/login_modal.html") menu_mod(temp_engine); - temp_engine.add_event("#ok", "click", () => { - home(temp_engine); - }); - - temp_engine.add_event("#forget_login", "click", () => { - My.agent = null; - auth.unload_token(); - modal.close(); - render_login(); - }); - temp_engine.add_event("#val", "click", () => { - let token = $("#in-token").val(); - auth.login(token); + temp_engine.add_event("#btn-login", "click", () => { + const is_checked = $("#box-remember").is(":checked"); + const token = $("#in-token").val(); + auth.store = is_checked; + auth.login(token) }); - temp_engine.add_event("#cancel", "click", () => { - $("#in-token").val(""); + temp_engine.add_event("#btn-cancel", "click", () => { + $("#input-token").val(""); + $("#box-remember").prop("checked", false); }); }); - temp_engine.render(`templates/auth/login.html`); - auth.done((agent) => { - modal.show(); My.agent = agent; - }).fail((errs) => { + home(temp_engine); + }) + + auth.fail((errors) => { $(".errors").html(""); - errs.forEach(err => { - $(".errors").append(` -

${err}

- `); + errors.forEach(error => { + $(".errors").append(`

${error}

`); }); - }); + }) - auth.relog(); + temp_engine.render(`templates/auth/login.html`); } \ No newline at end of file diff --git a/js/controllers/menu_mod.js b/js/controllers/menu_mod.js index 4310621..42a979a 100644 --- a/js/controllers/menu_mod.js +++ b/js/controllers/menu_mod.js @@ -17,12 +17,26 @@ function init_menu(temp_engine) { temp_engine.add_event(".nav-brand", "click", () => { home(temp_engine); }); + temp_engine.add_event("#logout-link", "click", () => { + My.agent = null; + localStorage.removeItem("token"); + home(temp_engine); + }); } function loged_links() { $(".nav-links").prepend(` + + + `); +} + +function unloged_links() { + $(".nav-links").prepend(` + + `); } @@ -38,8 +52,10 @@ function show_stats() { export default function menu_mod(temp_engine) { init_menu(temp_engine); - if(My.agent) { + if (My.agent) { show_stats(); loged_links(); + } else { + unloged_links(); } } \ No newline at end of file diff --git a/js/controllers/reg.js b/js/controllers/reg.js index ade8c69..b284dfa 100644 --- a/js/controllers/reg.js +++ b/js/controllers/reg.js @@ -1,61 +1,47 @@ -import { Modal } from "../skama_code/ui/modal.js"; import { Auth } from "../skama_code/auth/auth.js"; import { My } from "../skama_code/api/agent.js"; +import { Faction } from "../skama_code/api/faction.js" import home from "./home.js"; import menu_mod from "./menu_mod.js"; export default function reg(temp_engine) { - let active = false; - let auth = new Auth(true); - let modal = new Modal("reg-modal", temp_engine); + let auth = new Auth(); - modal.add_class("ext-modal"); temp_engine.after_render((temp_engine) => { menu_mod(temp_engine); - modal.load("templates/auth/reg_modal.html"); - temp_engine.add_event("#ok", "click", () => { - home(temp_engine); - }); - - temp_engine.add_event("#forget_reg", "click", () => { - My.agent = null; - auth.unload_token(); - modal.close(); - render_reg(); + + Faction.list_all((factions) => { + factions.forEach(faction => { + const option = ``; + $("#group-faction").append(option); + }); }); - - temp_engine.add_event("#val", "click", () => { - if (!active) { - active = true; - let name = $("#in-name").val(); - let faction = $("#in-faction").val(); - auth.register({ - name: name, - faction: faction - }); - } + + temp_engine.add_event("#btn-register", "click", () => { + const is_checked = $("#box-remember").is(":checked"); + const symbol = $("#input-name").val(); + const faction = $("#input-faction").val(); + auth.store = is_checked; + auth.register({name: symbol, faction: faction}); }); - - temp_engine.add_event("#cancel", "click", () => { - $("#in-name").val(""); - $("#in-faction").val(""); + + temp_engine.add_event("#btn-cancel", "click", () => { + $("#input-name").val(""); + $("#box-remember").prop("checked", false); }); }); - temp_engine.render(`templates/auth/reg.html`); - auth.done((agent) => { - $(".show-token").text(agent.token); - modal.show(); My.agent = agent; - active = false; - }).fail((errs) => { + home(temp_engine); + }); + + auth.fail((errors) => { $(".errors").html(""); - errs.forEach(err => { - $(".errors").append(` -

${err}

- `); + errors.forEach(error => { + $(".errors").append(`

${error}

`); }); - active = false; - }); + }) + + temp_engine.render(`templates/auth/reg.html`); } \ No newline at end of file diff --git a/js/controllers/ships.js b/js/controllers/ships.js new file mode 100644 index 0000000..0358ca8 --- /dev/null +++ b/js/controllers/ships.js @@ -0,0 +1,152 @@ +import menu_mod from "./menu_mod.js"; +import { Modal } from "../skama_code/ui/modal.js"; +import { Ship } from "../skama_code/api/ship.js"; +import system from "./system.js"; + +export default (temp_engine) => { + let modal = new Modal("ship-modal", temp_engine); + + temp_engine.after_render((temp_engine) => { + menu_mod(temp_engine); + modal.load("templates/ship/ship_modal.html"); + + Ship.list((ships) => { + ships.forEach(ship => { + $(".ships").append( + ` +
+
${ship.symbol}
+

fuel capacity: ${ship.fuel.capacity}

+ + + + + + +
+ ` + ) + }); + temp_engine.add_event(".reg", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

Name : ${ship.registration.name}

`); + $(".infos").append(`

Faction : ${ship.registration.factionSymbol}

`); + $(".infos").append(`

Role : ${ship.registration.role}

`); + } + }) + modal.show(); + }); + temp_engine.add_event(".nav", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

Current system : ${ship.nav.systemSymbol}

`); + $(".infos").append(`

Current waypoint : ${ship.nav.waypointSymbol}

`); + $(".infos").append(`

Current status : ${ship.nav.status}

`); + $(".infos").append(`

Flight mode : ${ship.nav.flightMode}

`); + } + }) + modal.show(); + }); + temp_engine.add_event(".crew", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

Current member : ${ship.crew.current}

`); + $(".infos").append(`

Capacity : ${ship.crew.capacity}

`); + $(".infos").append(`

required member : ${ship.crew.required}

`); + $(".infos").append(`

Moral : ${ship.crew.morale}

`); + } + }) + modal.show(); + }); + temp_engine.add_event(".frame", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

Name : ${ship.frame.name}

`); + $(".infos").append(`

Description : ${ship.frame.description}

`); + $(".infos").append(`

Fuel capacity : ${ship.frame.fuelCapacity}

`); + $(".infos").append(`

Condition : ${ship.frame.condition}

`); + $(".infos").append(`

Power : ${ship.frame.requirements.power}

`); + $(".infos").append(`

Crew : ${ship.frame.requirements.crew}

`); + + } + }) + modal.show(); + }); + temp_engine.add_event(".react", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

Name : ${ship.reactor.name}

`); + $(".infos").append(`

Description : ${ship.reactor.description}

`); + $(".infos").append(`

Condition : ${ship.reactor.condition}

`); + $(".infos").append(`

Power : ${ship.reactor.powerOutput}

`); + $(".infos").append(`

Crew : ${ship.reactor.requirements.crew}

`); + } + }) + modal.show(); + }); + temp_engine.add_event(".engine", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

Name : ${ship.engine.name}

`); + $(".infos").append(`

Description : ${ship.engine.description}

`); + $(".infos").append(`

Condition : ${ship.engine.condition}

`); + $(".infos").append(`

Speed : ${ship.engine.speed}

`); + $(".infos").append(`

Crew : ${ship.engine.requirements.crew}

`); + $(".infos").append(`

Power : ${ship.engine.requirements.power}

`); + } + }) + modal.show(); + }); + temp_engine.add_event(".fuel", "click", (e) => { + const id_ship = $(e.target).attr("data-symbol"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + $(".infos").html(""); + $(".infos").append(`

current fuel : ${ship.fuel.current}

`); + $(".infos").append(`

Description : ${ship.fuel.capacity}

`); + $(".infos").append(`

Condition : ${ship.fuel.consumed.amount}

`); + $(".infos").append(`

Speed : ${ship.fuel.consumed.timestamp}

`); + } + }) + modal.show(); + }); + $(".ships-list").on("click", (e) => { + const id_ship = $(e.target).attr("data-id"); + ships.forEach(ship =>{ + if(ship.symbol==id_ship) + { + console.log("ok") + } + }) + + }); + }); + + temp_engine.add_event(".btn-close", "click", () => { + modal.close(); + }); + }); + + temp_engine.render("templates/ship/ship.html"); + +};