diff --git a/app/src/App.jsx b/app/src/App.jsx index 98188f8..14e035b 100644 --- a/app/src/App.jsx +++ b/app/src/App.jsx @@ -10,9 +10,9 @@ const App = () => {
- +
-
+
diff --git a/app/src/assets/bojo.png b/app/src/assets/bojo.png new file mode 100644 index 0000000..46766a6 Binary files /dev/null and b/app/src/assets/bojo.png differ diff --git a/app/src/assets/carrent.png b/app/src/assets/carrent.png deleted file mode 100644 index 8140354..0000000 Binary files a/app/src/assets/carrent.png and /dev/null differ diff --git a/app/src/assets/close.svg b/app/src/assets/close.svg deleted file mode 100644 index 81e97e0..0000000 --- a/app/src/assets/close.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/app/src/assets/company/meta.png b/app/src/assets/company/meta.png deleted file mode 100644 index d0ceea5..0000000 Binary files a/app/src/assets/company/meta.png and /dev/null differ diff --git a/app/src/assets/company/shopify.png b/app/src/assets/company/shopify.png deleted file mode 100644 index bba215c..0000000 Binary files a/app/src/assets/company/shopify.png and /dev/null differ diff --git a/app/src/assets/company/starbucks.png b/app/src/assets/company/starbucks.png deleted file mode 100644 index 76cf307..0000000 Binary files a/app/src/assets/company/starbucks.png and /dev/null differ diff --git a/app/src/assets/company/tesla.png b/app/src/assets/company/tesla.png deleted file mode 100644 index 8eca730..0000000 Binary files a/app/src/assets/company/tesla.png and /dev/null differ diff --git a/app/src/assets/creator.png b/app/src/assets/creator.png deleted file mode 100644 index fa17ad2..0000000 Binary files a/app/src/assets/creator.png and /dev/null differ diff --git a/app/src/assets/github.png b/app/src/assets/github.png deleted file mode 100644 index a735a32..0000000 Binary files a/app/src/assets/github.png and /dev/null differ diff --git a/app/src/assets/herobg.png b/app/src/assets/herobg.png deleted file mode 100644 index 9d0a41b..0000000 Binary files a/app/src/assets/herobg.png and /dev/null differ diff --git a/app/src/assets/index.js b/app/src/assets/index.js index 613116b..0630e9e 100644 --- a/app/src/assets/index.js +++ b/app/src/assets/index.js @@ -1,62 +1,8 @@ import logo from "./logo.svg"; import backend from "./backend.png"; -import creator from "./creator.png"; -import mobile from "./mobile.png"; -import web from "./web.png"; -import github from "./github.png"; -import menu from "./menu.svg"; -import close from "./close.svg"; -import css from "./tech/css.png"; -import docker from "./tech/docker.png"; -import figma from "./tech/figma.png"; -import git from "./tech/git.png"; -import html from "./tech/html.png"; -import javascript from "./tech/javascript.png"; -import mongodb from "./tech/mongodb.png"; -import nodejs from "./tech/nodejs.png"; -import reactjs from "./tech/reactjs.png"; -import redux from "./tech/redux.png"; -import tailwind from "./tech/tailwind.png"; -import typescript from "./tech/typescript.png"; -import threejs from "./tech/threejs.svg"; - -import meta from "./company/meta.png"; -import shopify from "./company/shopify.png"; -import starbucks from "./company/starbucks.png"; -import tesla from "./company/tesla.png"; - -import carrent from "./carrent.png"; -import jobit from "./jobit.png"; -import tripguide from "./tripguide.png"; export { logo, - backend, - creator, - mobile, - web, - github, - menu, - close, - css, - docker, - figma, - git, - html, - javascript, - mongodb, - nodejs, - reactjs, - redux, - tailwind, - typescript, - threejs, - meta, - shopify, - starbucks, - tesla, - carrent, - jobit, - tripguide, + backend }; diff --git a/app/src/assets/jobit.png b/app/src/assets/jobit.png deleted file mode 100644 index bb53f4b..0000000 Binary files a/app/src/assets/jobit.png and /dev/null differ diff --git a/app/src/assets/menu.svg b/app/src/assets/menu.svg deleted file mode 100644 index 318d5ef..0000000 --- a/app/src/assets/menu.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/app/src/assets/mobile.png b/app/src/assets/mobile.png deleted file mode 100644 index 27a2b37..0000000 Binary files a/app/src/assets/mobile.png and /dev/null differ diff --git a/app/src/assets/tech/css.png b/app/src/assets/tech/css.png deleted file mode 100644 index 677d59c..0000000 Binary files a/app/src/assets/tech/css.png and /dev/null differ diff --git a/app/src/assets/tech/docker.png b/app/src/assets/tech/docker.png deleted file mode 100644 index c349344..0000000 Binary files a/app/src/assets/tech/docker.png and /dev/null differ diff --git a/app/src/assets/tech/figma.png b/app/src/assets/tech/figma.png deleted file mode 100644 index c9f3a61..0000000 Binary files a/app/src/assets/tech/figma.png and /dev/null differ diff --git a/app/src/assets/tech/git.png b/app/src/assets/tech/git.png deleted file mode 100644 index 493c150..0000000 Binary files a/app/src/assets/tech/git.png and /dev/null differ diff --git a/app/src/assets/tech/html.png b/app/src/assets/tech/html.png deleted file mode 100644 index 9a67c31..0000000 Binary files a/app/src/assets/tech/html.png and /dev/null differ diff --git a/app/src/assets/tech/javascript.png b/app/src/assets/tech/javascript.png deleted file mode 100644 index e7448b5..0000000 Binary files a/app/src/assets/tech/javascript.png and /dev/null differ diff --git a/app/src/assets/tech/mongodb.png b/app/src/assets/tech/mongodb.png deleted file mode 100644 index c892f59..0000000 Binary files a/app/src/assets/tech/mongodb.png and /dev/null differ diff --git a/app/src/assets/tech/nodejs.png b/app/src/assets/tech/nodejs.png deleted file mode 100644 index b81a2ce..0000000 Binary files a/app/src/assets/tech/nodejs.png and /dev/null differ diff --git a/app/src/assets/tech/reactjs.png b/app/src/assets/tech/reactjs.png deleted file mode 100644 index a49beb5..0000000 Binary files a/app/src/assets/tech/reactjs.png and /dev/null differ diff --git a/app/src/assets/tech/redux.png b/app/src/assets/tech/redux.png deleted file mode 100644 index feecfee..0000000 Binary files a/app/src/assets/tech/redux.png and /dev/null differ diff --git a/app/src/assets/tech/tailwind.png b/app/src/assets/tech/tailwind.png deleted file mode 100644 index ed3981f..0000000 Binary files a/app/src/assets/tech/tailwind.png and /dev/null differ diff --git a/app/src/assets/tech/threejs.svg b/app/src/assets/tech/threejs.svg deleted file mode 100644 index b6a8dc8..0000000 --- a/app/src/assets/tech/threejs.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/app/src/assets/tech/typescript.png b/app/src/assets/tech/typescript.png deleted file mode 100644 index 695b00c..0000000 Binary files a/app/src/assets/tech/typescript.png and /dev/null differ diff --git a/app/src/assets/tripguide.png b/app/src/assets/tripguide.png deleted file mode 100644 index ba3469a..0000000 Binary files a/app/src/assets/tripguide.png and /dev/null differ diff --git a/app/src/assets/web.png b/app/src/assets/web.png deleted file mode 100644 index c29cbd0..0000000 Binary files a/app/src/assets/web.png and /dev/null differ diff --git a/app/src/components/Hero.jsx b/app/src/components/Hero.jsx index 55ad78d..894f7c9 100644 --- a/app/src/components/Hero.jsx +++ b/app/src/components/Hero.jsx @@ -2,8 +2,6 @@ import React, { useEffect, useState } from "react"; import { styles } from "../style"; import { ComputersCanvas } from "./canvas"; import { Link } from "react-router-dom"; -import { navLinks } from "../constants"; -import { logo, menu, close } from "../assets"; const Hero = () => { @@ -23,7 +21,7 @@ const Hero = () => { let active_bbt = "bbt1"; let number_of_defenders = 0; let number_of_strikers = 0; - + let idCounter = 0; var shooterX = 0; var shooterY = 0; var eX = " "; @@ -37,7 +35,6 @@ const Hero = () => { document.getElementById("bbt3").style.background = "#99FFCC"; document.getElementById("bbt4").style.background = "#99FFCC"; document.getElementById(a).style.background = "#00CC66"; - active_bbt = a } function changeLeg(a){ @@ -130,6 +127,46 @@ const Hero = () => { number_of_strikers = 0 } + + + //funkcja dodaje zawodnika do listy zawodnikow. zmienne x oraz y to wspolrzedne a position + // to pozycja zawodnika 0 - strzelec, 1 - bramkarz, 2 - broniacy, 3 napastnik + // ball - to odnosnik do punktu na boisku + + function addPlayer(x,y, possition, ball){ + + + //Zmiana stylu w zaleznosci czy zawodnik jest obronca/napastnikiem iyp. + var pName = "Strzelec" + var pColor = "white" + var bColor = "rgb(16, 46, 29)" + if(possition == 1){ + var pName = "Bramkarz" + var pColor = "white" + var bColor = "rgb(16, 46, 29)" + }else if(possition == 2){ + var pName = "Napastnik" + var pColor = "white" + var bColor = "rgb(16, 46, 29)" + }else if (possition ==3){ + var pName = "Obrońca" + var pColor = "white" + var bColor = "rgb(16, 46, 29)" + } + + var player = document.createElement('div'); + player.className = 'player'; + player.style.width = "inherit" + + var list = document.getElementById("list") + + var tekst = document.createElement('div') + tekst.style.fontSize = "10px"; + tekst.innerHTML = pName; + player.appendChild(tekst) + list.appendChild(player) + + } // Wysłanie zapytania do serwera const [data,setData] = useState([{}]) function sentQuestion() { @@ -159,7 +196,6 @@ const Hero = () => { shooterX = (x * 105)/600 shooterY = ((400 - y) * 69)/ 400 - // Przypadek kiedy zaznaczamy strzelca if(active_bbt == "bbt1"){ let existingBall = document.querySelector('.football'); @@ -169,6 +205,8 @@ const Hero = () => { ball.className = 'football'; ball.style.left = x + 'px'; ball.style.top = y + 'px'; + ball.id = "ball_" + new Date().getTime().toString() + addPlayer(shooterX,shooterY,0,ball) footballField.appendChild(ball); } else { alert('Możesz dodać tylko jedną piłkę!'); @@ -182,6 +220,7 @@ const Hero = () => { ball.className = 'goalkeeper'; ball.style.left = x + 'px'; ball.style.top = y + 'px'; + addPlayer(shooterX,shooterY,1,ball.id) footballField.appendChild(ball); } else { alert('Możesz dodać tylko jednego bramkarza!'); @@ -195,6 +234,7 @@ const Hero = () => { ball.style.left = x + 'px'; ball.style.top = y + 'px'; footballField.appendChild(ball); + addPlayer(shooterX,shooterY,3,ball.id) number_of_defenders = number_of_defenders + 1} else {alert("zbyt duza liczba obronców")} }else if(active_bbt == "bbt4"){ // Przypadek kiedy zaznaczamy napastnika @@ -204,6 +244,7 @@ const Hero = () => { ball.style.left = x + 'px'; ball.style.top = y + 'px'; footballField.appendChild(ball); + addPlayer(shooterX,shooterY,2,ball.id) number_of_strikers = number_of_strikers + 1 }else{alert("zbyt duza liczba obroncow")}} @@ -243,7 +284,7 @@ const Hero = () => { /*zwracany komponent zawierajacy boisko*/ return ( - +
{/* Listy zwijane */} @@ -264,13 +305,6 @@ const Hero = () => { )}
- {/* old version */} - {/*
- - - - -
*/}
@@ -280,6 +314,7 @@ const Hero = () => { Wolej Półwolej Lob + Szczupak Kopnięcie z góry Piętka @@ -326,32 +361,15 @@ const Hero = () => { />
- -
-
- - - - - - - - - - - + +
+
+ +
+
+
- - - - - - - - - - -
+
@@ -386,7 +404,7 @@ const Hero = () => {
- + ); }; diff --git a/app/src/components/Navbar.jsx b/app/src/components/Navbar.jsx index 591157b..b9098b0 100644 --- a/app/src/components/Navbar.jsx +++ b/app/src/components/Navbar.jsx @@ -2,8 +2,8 @@ import React, { useEffect, useState } from "react"; import { Link } from "react-router-dom"; import { styles } from "../style"; -import { navLinks } from "../constants"; -import { logo, menu, close } from "../assets"; + +import { logo} from "../assets"; const Navbar = () => { const [active, setActive] = useState(""); @@ -48,20 +48,6 @@ const Navbar = () => { - - ); diff --git a/app/src/constants/index.js b/app/src/constants/index.js index c2b3d15..875c2f2 100644 --- a/app/src/constants/index.js +++ b/app/src/constants/index.js @@ -1,257 +1,7 @@ import { - mobile, + backend, - creator, - web, - javascript, - typescript, - html, - css, - reactjs, - redux, - tailwind, - nodejs, - mongodb, - git, - figma, - docker, - meta, - starbucks, - tesla, - shopify, - carrent, - jobit, - tripguide, - threejs, + } from "../assets"; - export const navLinks = [ - ]; - - - - - - const services = [ - { - title: "Web Developer", - icon: web, - }, - { - title: "React Native Developer", - icon: mobile, - }, - { - title: "Backend Developer", - icon: backend, - }, - { - title: "Content Creator", - icon: creator, - }, - ]; - - const technologies = [ - { - name: "HTML 5", - icon: html, - }, - { - name: "CSS 3", - icon: css, - }, - { - name: "JavaScript", - icon: javascript, - }, - { - name: "TypeScript", - icon: typescript, - }, - { - name: "React JS", - icon: reactjs, - }, - { - name: "Redux Toolkit", - icon: redux, - }, - { - name: "Tailwind CSS", - icon: tailwind, - }, - { - name: "Node JS", - icon: nodejs, - }, - { - name: "MongoDB", - icon: mongodb, - }, - { - name: "Three JS", - icon: threejs, - }, - { - name: "git", - icon: git, - }, - { - name: "figma", - icon: figma, - }, - { - name: "docker", - icon: docker, - }, - ]; - - const experiences = [ - { - title: "React.js Developer", - company_name: "Starbucks", - icon: starbucks, - iconBg: "#383E56", - date: "March 2020 - April 2021", - points: [ - "Developing and maintaining web applications using React.js and other related technologies.", - "Collaborating with cross-functional teams including designers, product managers, and other developers to create high-quality products.", - "Implementing responsive design and ensuring cross-browser compatibility.", - "Participating in code reviews and providing constructive feedback to other developers.", - ], - }, - { - title: "React Native Developer", - company_name: "Tesla", - icon: tesla, - iconBg: "#E6DEDD", - date: "Jan 2021 - Feb 2022", - points: [ - "Developing and maintaining web applications using React.js and other related technologies.", - "Collaborating with cross-functional teams including designers, product managers, and other developers to create high-quality products.", - "Implementing responsive design and ensuring cross-browser compatibility.", - "Participating in code reviews and providing constructive feedback to other developers.", - ], - }, - { - title: "Web Developer", - company_name: "Shopify", - icon: shopify, - iconBg: "#383E56", - date: "Jan 2022 - Jan 2023", - points: [ - "Developing and maintaining web applications using React.js and other related technologies.", - "Collaborating with cross-functional teams including designers, product managers, and other developers to create high-quality products.", - "Implementing responsive design and ensuring cross-browser compatibility.", - "Participating in code reviews and providing constructive feedback to other developers.", - ], - }, - { - title: "Full stack Developer", - company_name: "Meta", - icon: meta, - iconBg: "#E6DEDD", - date: "Jan 2023 - Present", - points: [ - "Developing and maintaining web applications using React.js and other related technologies.", - "Collaborating with cross-functional teams including designers, product managers, and other developers to create high-quality products.", - "Implementing responsive design and ensuring cross-browser compatibility.", - "Participating in code reviews and providing constructive feedback to other developers.", - ], - }, - ]; - - const testimonials = [ - { - testimonial: - "I thought it was impossible to make a website as beautiful as our product, but Rick proved me wrong.", - name: "Sara Lee", - designation: "CFO", - company: "Acme Co", - image: "https://randomuser.me/api/portraits/women/4.jpg", - }, - { - testimonial: - "I've never met a web developer who truly cares about their clients' success like Rick does.", - name: "Chris Brown", - designation: "COO", - company: "DEF Corp", - image: "https://randomuser.me/api/portraits/men/5.jpg", - }, - { - testimonial: - "After Rick optimized our website, our traffic increased by 50%. We can't thank them enough!", - name: "Lisa Wang", - designation: "CTO", - company: "456 Enterprises", - image: "https://randomuser.me/api/portraits/women/6.jpg", - }, - ]; - - const projects = [ - { - name: "Car Rent", - description: - "Web-based platform that allows users to search, book, and manage car rentals from various providers, providing a convenient and efficient solution for transportation needs.", - tags: [ - { - name: "react", - color: "blue-text-gradient", - }, - { - name: "mongodb", - color: "green-text-gradient", - }, - { - name: "tailwind", - color: "pink-text-gradient", - }, - ], - image: carrent, - source_code_link: "https://github.com/", - }, - { - name: "Job IT", - description: - "Web application that enables users to search for job openings, view estimated salary ranges for positions, and locate available jobs based on their current location.", - tags: [ - { - name: "react", - color: "blue-text-gradient", - }, - { - name: "restapi", - color: "green-text-gradient", - }, - { - name: "scss", - color: "pink-text-gradient", - }, - ], - image: jobit, - source_code_link: "https://github.com/", - }, - { - name: "Trip Guide", - description: - "A comprehensive travel booking platform that allows users to book flights, hotels, and rental cars, and offers curated recommendations for popular destinations.", - tags: [ - { - name: "nextjs", - color: "blue-text-gradient", - }, - { - name: "supabase", - color: "green-text-gradient", - }, - { - name: "css", - color: "pink-text-gradient", - }, - ], - image: tripguide, - source_code_link: "https://github.com/", - }, - ]; - - export { services, technologies, experiences, testimonials, projects }; \ No newline at end of file + export { }; \ No newline at end of file diff --git a/app/src/flask-server/modele/__pycache__/modele.cpython-310.pyc b/app/src/flask-server/modele/__pycache__/modele.cpython-310.pyc index 94a085b..3402261 100644 Binary files a/app/src/flask-server/modele/__pycache__/modele.cpython-310.pyc and b/app/src/flask-server/modele/__pycache__/modele.cpython-310.pyc differ diff --git a/app/src/index.css b/app/src/index.css index be79f77..9fbe8a5 100644 --- a/app/src/index.css +++ b/app/src/index.css @@ -4,7 +4,6 @@ @tailwind components; @tailwind utilities; - .Ex{ display: block; /* Może być inline-block, jeśli preferujesz */ margin: 20px auto; /* Centralnie i z marginesem */ @@ -30,12 +29,26 @@ .container { display: flex; flex-direction: column; - align-items: center; + align-items: baseline; justify-content: space-between; + align-items: center; position: relative; font-size: 7px; - margin: 50 px; + margin: 5px; + width: 100%; } + + .field-pic{ + content:url(assets/bojo.png); + height: inherit; + width: inherit; + } + .field-pic img{ + max-width: 100%; + max-height: 100%; + } + + .container span { display: block; } @@ -44,21 +57,29 @@ display: flex; justify-content: space-between; align-items: center; - width: 100%; + + } + .player{ + width: inherit; + height: 8vh; + background-color: rgb(16, 46, 29); + --line: 0.3em solid white; + border: var(--line); + + } .field { --line: 0.3em solid white; border: var(--line); position: relative; overflow: hidden; - width: inherit; - height: inherit; + width: 50vw; + height: calc(50vw*68/105); z-index: 1; margin: 0; - background-color:green; - width: 120em; - height: 80em; + background-image: url("img_tree.gif"); + background-color: #cccccc; justify-content: space-between; } @@ -72,13 +93,19 @@ background-color: #f0f0f0; /* Example background color */ z-index: 1000; /* Ensure it stays on top of other content */ } - + .player-list{ + background-color: rgb(61, 38, 38); + width: 10vw; + height: calc(50vw*68/105); + + + } .top-bar { display: flex; justify-content: space-between; align-items: center; padding: 10px; - width: 100%; /* Dostosuj szerokość zgodnie z potrzebami */ + width: 60vw; /* Dostosuj szerokość zgodnie z potrzebami */ /* Możesz dodać dodatkowe style, jak tło, obramowanie itp. */ z-index: 2; } @@ -88,106 +115,9 @@ justify-content: space-between; /* Rozmieszcza przyciski równomiernie */ align-items: center; padding: 10px; - width: 100%; /* Dostosuj szerokość zgodnie z potrzebami */ + width: 50vw; /* Dostosuj szerokość zgodnie z potrzebami */ /* Możesz dodać dodatkowe style, jak tło, obramowanie itp. */ } - - .halfway-line { - width: 60em; - height: 80em; - border-right: var(--line); - } - - .centre-circle, - .penalty-arc { - width: 20em; - height: 20em; - border: var(--line); - border-radius: 50%; - position: absolute; - top: 30em; - } - - .centre-circle { - left: calc((120em - 20em - 0.3em) / 2); - } - - .centre-mark { - width: 2em; - height: 2em; - background-color: white; - border-radius: 50%; - position: absolute; - top: calc(80em / 2 - 1em); - left: calc(120em / 2 - 1em + 0.3em / 2); - } - - .penalty-mark { - width: 2em; - height: 2em; - background-color: white; - border-radius: 50%; - position: absolute; - top: calc(80em / 2 - 1em); - left: calc(12em - 2em / 2); - } - - .penalty-area { - width: 18em; - height: 44em; - border: var(--line); - position: absolute; - top: calc((80em - 44em) / 2); - left: -0.3em; - background-color: green; - } - - .penalty-arc { - left: calc(12em - 20em / 2); - z-index: -1; - } - - .goal-area { - width: 6em; - height: 20em; - border: var(--line); - position: absolute; - top: calc((80em - 20em) / 2); - left: -0.3em; - } - - .corner-arc { - border: 1px solid blue; - position: absolute; - } - - .corner-arc::after, - .corner-arc::before { - content: ''; - position: absolute; - width: 5em; - height: 5em; - border: 0.3em solid white; - border-radius: 50%; - } - - .corner-arc::before { - top: 0; - left: 0; - } - - .corner-arc::after { - bottom: 0; - right: 0; - } - - .right { - position: absolute; - top: 0px; - left: 50%; - transform: rotateY(180deg); - } - .football { width: 2em; height: 2em;