From 72809cd1c1178cdaffdb2a36b3c75e5fe5efb852 Mon Sep 17 00:00:00 2001
From: Marchand Arnaud
Date: Thu, 11 Jan 2024 09:15:45 +0100
Subject: [PATCH] Circle correction
---
css/style.css | 4 +--
css/styleindex.css | 5 +--
index.html | 17 ----------
js/SpaceTraders.js | 75 --------------------------------------------
js/TEST_F.JS | 74 +++++++++++++++++++++++++------------------
js/test.js | 16 ++++++++++
templates/index.html | 5 ++-
templates/text.html | 31 ++++++++++++++++++
token.txt | 1 -
9 files changed, 96 insertions(+), 132 deletions(-)
delete mode 100644 index.html
delete mode 100644 js/SpaceTraders.js
create mode 100644 js/test.js
create mode 100644 templates/text.html
delete mode 100644 token.txt
diff --git a/css/style.css b/css/style.css
index 59ccbbf..15ab056 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,5 +1,5 @@
-/* Copyright © 2023 Entreprise SpaceTarders */
canvas {
- border: 2px solid rgb(7, 18, 41);
+ background-color: rgb(0, 0, 43);
+ border: 2px solid black;
border-radius: 5px;
}
\ No newline at end of file
diff --git a/css/styleindex.css b/css/styleindex.css
index 519d332..9fc2f73 100644
--- a/css/styleindex.css
+++ b/css/styleindex.css
@@ -1,7 +1,6 @@
/* Copyright © 2023 Entreprise SpaceTarders */
html{
background-color: rgb(7, 18, 41);
- cursor: crosshair;
}
main{
display: flex;
@@ -16,7 +15,6 @@ main{
display: flex;
justify-content: left;
}
-
#menu {
display: flex;
justify-content: center;
@@ -28,9 +26,8 @@ main{
color: white;
font-size: 11px;
background-color: rgb(20, 20, 32);
- cursor: pointer;
}
-#canvas {
+canvas {
border: 2px solid rgb(7, 18, 41);
border-radius: 5px;
}
diff --git a/index.html b/index.html
deleted file mode 100644
index 001d736..0000000
--- a/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
-
-
-
-
- Test
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/js/SpaceTraders.js b/js/SpaceTraders.js
deleted file mode 100644
index fe77fef..0000000
--- a/js/SpaceTraders.js
+++ /dev/null
@@ -1,75 +0,0 @@
-//© 2023 spacetardes
-function listSystem(page, limit){
- const settings = {
- async: true,
- crossDomain: true,
- url: 'https://api.spacetraders.io/v2/systems',
- method: 'GET',
- headers: {
- Accept: 'application/json'
- },
- data : {
- page: page,
- limit: limit
- }
- };
-
-
- $.ajax(settings).done(function (response) {
- console.log(response);
- });
-
- const waypoint = {
- async: true,
- crossDomain: true,
- url: 'https://api.spacetraders.io/v2/systems/X1-QA84/waypoints',
- method: 'GET',
- headers: {
- Accept: 'application/json'
- }
- };
-
- $.ajax(waypoint).done(function (response) {
- console.log(response);
- response.data.forEach(element => {
- GetMarketForWaypoint(element.symbol);
- });
- });
-
-
-}
-function GetMarketForWaypoint(waypoint) {
- const market = {
- async: true,
- crossDomain: true,
- url: `https://api.spacetraders.io/v2/systems/X1-QA84/waypoints/${waypoint}`,
- method: 'GET',
- headers: {
- Accept: 'application/json'
- }
- }
-
- $.ajax(market).done(function (response) {
- console.log(response);
- });
-}
-
-$(document).ready(function(){
- let systems = listSystem("6", "20")
-})
-
-let ScreenWidht = window.innerWidht;
-let ScreenHeight = window.innerHeight;
-let canvas = document.getElementById("monCanevas");
-let contexte = canvas.getContext("2d");
-var monCanevas = document.getElementById('monCanevas'); // Obtenez une référence vers votre canevas
-monCanevas.width = 800;
-monCanevas.height = 500;
-
-// Parcourir les rectangles du canevas
-contexte.beginPath();
-contexte.rect(100, 100, 100, 100);
-contexte.fillStyle = "black";
-contexte.fill();
-
-//type?MARKET//
\ No newline at end of file
diff --git a/js/TEST_F.JS b/js/TEST_F.JS
index c88dfc2..0856937 100644
--- a/js/TEST_F.JS
+++ b/js/TEST_F.JS
@@ -1,4 +1,4 @@
-let token = "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZGVudGlmaWVyIjoiUEVVU0RPU0FDSEEiLCJ2ZXJzaW9uIjoidjIuMS40IiwicmVzZXRfZGF0ZSI6IjIwMjMtMTItMDIiLCJpYXQiOjE3MDI1Mzk4NjUsInN1YiI6ImFnZW50LXRva2VuIn0.QL4rSruHd8pjNczeZQ3S7gof7TRnwZKqQBvkojUXgmzRrWiDZVw65kt1UBns0zHAhZF-m-bvxfUBik01uIzc-_jSO63ZndquPFmv_UY3HBkVK7UKoSaxAp_NveJsE1TOpTotUChlMd1Sv7RuyeR9fso2eN3-mBEoE5ukWmGVDfnOYefuWORhisqIkh4ti3QpaV-obycZ4XGV2ukqkiNdHqR3MQJR99e2nCEZEsarNKTgm6mgn-qCCNv4xQUGwhNbD5_p-jPqQ088vuFCeZi8j6kf7-fmT5sysBxEA5nvNPDIEL1XMuzs7N66WpiP1uc7I1Ph164m2epV9vmEvzthCw";
+let token = "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZGVudGlmaWVyIjoiU0hBRE9XIiwidmVyc2lvbiI6InYyLjEuNCIsInJlc2V0X2RhdGUiOiIyMDIzLTEyLTMwIiwiaWF0IjoxNzA0OTYwMjc3LCJzdWIiOiJhZ2VudC10b2tlbiJ9.AOqLimBeSt8TAhvG0uPf_Jyjo6GJGCm8sOKXp5H4vfUpdeR-fk3UTZYzee8Y5dUKEXC7f7IlgDDtMRWIXOEOQXUem2-lQuPiSXPY1M0wWwpUoUV0uVOARvTTIQy_Zo9ZcnwOHCHErEDTeyLtPByW7zb5O7Q9WVuGB0YfG0f4DXHDqVCIszS-qH77t_5oMk8VNl7ZEuI1hP3D0Wh47VpxdBv3aCaNNoF-mPs7f4sfU-YmpIPvRXEKABnv0gOGngaRk73ozGCRMfrcBHKnw4TndxB-tBK0SfwJrKSCpNMvGM8PleDl__GLDaNHNGUSu9GD3lNqxKumbq3dDt4K-vNGBQ";
//décalage
let offset = {
x: 2,
@@ -7,16 +7,14 @@ let offset = {
let max = 40;
let min = 35;
let w = 1260;
-let h = 830;
-
+let h = 870;
const canvas = new fabric.Canvas("canvas",{
width: w,
height: h,
backgroundColor:"rgb(7, 18, 41)",
- renderOnAddRemove: false,
- defaultCursor :'crosshair',
- hoverCursor :'pointer'
+ renderOnAddRemove: false
});
+
canvas.renderAll();
let planets = [];
@@ -66,31 +64,56 @@ function offsetOrbits(waypoints){
}
});
}
+let ring = [];
+
function drawSystem(wayPoints) {
if(wayPoints) {
wayPoints.forEach(wayPoint => {
drawWaypoint(wayPoint);
- //TestPlanetClicked(wayPoint);
});
}
+ drawRing();
}
-function drawWaypoint(wayPoint) {
- let shadow = new fabric.Shadow({
- color: "white",
- blur: 5,
- offsetX: 0,
- offsetY: 0,
- });
+function drawRing()
+{
+ for(let i = 0; i < 4; i++){
+ let random = Math.random() * (250 - 100) + 100;
+ // create a circle
+ let circle = new fabric.Circle({
+ radius: random, fill: 'transparent', left: (canvas.width/2)-random, top: (canvas.height/2)-random
+ });
+ circle.set({ strokeWidth: 3, stroke: 'rgba(10,53,66,2)' });
+
+ canvas.add(circle);
+ }
+ for(let i = 0; i < 4; i++){
+ let random = Math.random() * (400 - 250) + 250;
+ // create a circle
+ let circle = new fabric.Circle({
+ radius: random, fill: 'transparent', left: (canvas.width/2)-random, top: (canvas.height/2)-random
+ });
+ circle.set({ strokeWidth: 3, stroke: 'rgba(10,53,66,2)' });
+
+ canvas.add(circle);
+ }
+ for(let i = 0; i < 4; i++){
+ let random = Math.random() * (550 - 400) + 400;
+ // create a circle
+ let circle = new fabric.Circle({
+ radius: random, fill: 'transparent', left: (canvas.width/2)-random, top: (canvas.height/2)-random
+ });
+ circle.set({ strokeWidth: 3, stroke: 'rgba(10,53,66,2)' });
+
+ canvas.add(circle);
+ }
+}
+
+function drawWaypoint(wayPoint) {
fabric.Image.fromURL('http://127.0.0.1:5500/img/planets/planetproto.png', function(planet) {
- //FABRICJS
- planet.set({selectable: false});
- planet.set({shadow: shadow});
- //AJOUT DES PROPRIÉTÉS DES WAYPOINT SUR LES PLANETES
planet.set({left: wayPoint.x/offset.x + w/2});
planet.set({top: wayPoint.y/offset.y+ h/2});
- planet.set({name: wayPoint.symbol});
- planet.set({type: wayPoint.type});
+ planet.set({selectable: false});
canvas.add(planet);
});
planets.push(wayPoint);
@@ -106,13 +129,4 @@ setTimeout(function animate() {
movePlanets();
canvas.renderAll();
setTimeout(animate, 1000);
-}, 10);
-
-canvas.on('mouse:up', function (e) {
- if(e.target.shadow.color == "red"){
- e.target.shadow.color = "white"
- }
- else{
- e.target.shadow.color = "red"
- }
-})
\ No newline at end of file
+}, 10);
\ No newline at end of file
diff --git a/js/test.js b/js/test.js
new file mode 100644
index 0000000..be14f46
--- /dev/null
+++ b/js/test.js
@@ -0,0 +1,16 @@
+let token = "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZGVudGlmaWVyIjoiUFJSUk9VVCIsInZlcnNpb24iOiJ2Mi4xLjQiLCJyZXNldF9kYXRlIjoiMjAyMy0xMi0wMiIsImlhdCI6MTcwMjAzODIwOCwic3ViIjoiYWdlbnQtdG9rZW4ifQ.iCm_0x9shooAE7028tBHw-p8NAXf8_EWBZl-wnqIpMIIRCe8A6rzEkaKnX-1OORBh31YQTekSOLdP5_FnA0AEP2KP00YzGEZWQBxSTndkpivtcS6X-arc4F6yJGvcLfT1m3ZD47LGylTELR3I-sXomX2Va8_13oN6kdDJyXpVWFe5OIC01bP_cwHpjztUTO-8ASPJ_8cLZH6GTSAzy5ozF1teTEdfq93s2i9oTPhynQKogdzaXAUIkAXv7hYv5XUbevorRaCfTl52CU7WK5__3org5ardHuITmbl0QyHYIWtkbpcZLcawfEGG0EK66iqwefdXIkTeWC3T1b_ERShMw";
+
+// create a wrapper around native canvas element (with id="c")
+var canvas = new fabric.Canvas('test');
+
+// create a rectangle object
+var rect = new fabric.Rect({
+ left: 100,
+ top: 100,
+ fill: 'red',
+ width: 100,
+ height: 100
+});
+
+// "add" rectangle onto canvas
+canvas.add(rect);
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 651b9f2..af5a160 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -6,7 +6,6 @@
-
@@ -24,8 +23,8 @@
diff --git a/templates/text.html b/templates/text.html
new file mode 100644
index 0000000..e73b821
--- /dev/null
+++ b/templates/text.html
@@ -0,0 +1,31 @@
+
+
+
+