pull/13/head
parent
582a623576
commit
2e4f2eb10c
@ -0,0 +1,16 @@
|
||||
<?php
|
||||
|
||||
$finder = (new PhpCsFixer\Finder())->in(__DIR__);
|
||||
|
||||
return (new PhpCsFixer\Config())
|
||||
->setRules([
|
||||
'@PER-CS' => true,
|
||||
'@PHP82Migration' => true,
|
||||
'array_syntax' => ['syntax' => 'short'],
|
||||
'braces_position' => [
|
||||
'classes_opening_brace' => 'same_line',
|
||||
'functions_opening_brace' => 'same_line'
|
||||
]
|
||||
])
|
||||
->setIndent(" ")
|
||||
->setFinder($finder);
|
@ -0,0 +1,7 @@
|
||||
{
|
||||
"bracketSameLine": true,
|
||||
"trailingComma": "all",
|
||||
"printWidth": 80,
|
||||
"tabWidth": 4,
|
||||
"semi": false
|
||||
}
|
@ -1,12 +0,0 @@
|
||||
@startuml
|
||||
|
||||
class Connexion
|
||||
|
||||
class Modele
|
||||
|
||||
class Account
|
||||
|
||||
class AccountGateway
|
||||
|
||||
|
||||
@enduml
|
@ -0,0 +1,9 @@
|
||||
#!/usr/bin/env bash
|
||||
|
||||
## verify php and typescript types
|
||||
|
||||
echo "formatting php typechecking"
|
||||
vendor/bin/php-cs-fixer fix
|
||||
|
||||
echo "formatting typescript typechecking"
|
||||
npm run format
|
@ -1,4 +1,4 @@
|
||||
/**
|
||||
* This constant defines the API endpoint.
|
||||
*/
|
||||
export const API = import.meta.env.VITE_API_ENDPOINT;
|
||||
export const API = import.meta.env.VITE_API_ENDPOINT
|
||||
|
@ -1,58 +1,72 @@
|
||||
import {ReactElement, useRef} from "react";
|
||||
import Draggable from "react-draggable";
|
||||
import { ReactElement, useRef } from "react"
|
||||
import Draggable from "react-draggable"
|
||||
|
||||
export interface RackProps<E extends {key: string | number}> {
|
||||
id: string,
|
||||
objects: E[],
|
||||
onChange: (objects: E[]) => void,
|
||||
canDetach: (ref: HTMLDivElement) => boolean,
|
||||
onElementDetached: (ref: HTMLDivElement, el: E) => void,
|
||||
render: (e: E) => ReactElement,
|
||||
export interface RackProps<E extends { key: string | number }> {
|
||||
id: string
|
||||
objects: E[]
|
||||
onChange: (objects: E[]) => void
|
||||
canDetach: (ref: HTMLDivElement) => boolean
|
||||
onElementDetached: (ref: HTMLDivElement, el: E) => void
|
||||
render: (e: E) => ReactElement
|
||||
}
|
||||
|
||||
interface RackItemProps<E extends {key: string | number}> {
|
||||
item: E,
|
||||
onTryDetach: (ref: HTMLDivElement, el: E) => void,
|
||||
render: (e: E) => ReactElement,
|
||||
interface RackItemProps<E extends { key: string | number }> {
|
||||
item: E
|
||||
onTryDetach: (ref: HTMLDivElement, el: E) => void
|
||||
render: (e: E) => ReactElement
|
||||
}
|
||||
|
||||
/**
|
||||
* A container of draggable objects
|
||||
* */
|
||||
export function Rack<E extends {key: string | number}>({id, objects, onChange, canDetach, onElementDetached, render}: RackProps<E>) {
|
||||
export function Rack<E extends { key: string | number }>({
|
||||
id,
|
||||
objects,
|
||||
onChange,
|
||||
canDetach,
|
||||
onElementDetached,
|
||||
render,
|
||||
}: RackProps<E>) {
|
||||
return (
|
||||
<div id={id} style={{
|
||||
display: "flex"
|
||||
}}>
|
||||
{objects.map(element => (
|
||||
<RackItem key={element.key}
|
||||
item={element}
|
||||
render={render}
|
||||
onTryDetach={(ref, element) => {
|
||||
if (!canDetach(ref))
|
||||
return
|
||||
<div
|
||||
id={id}
|
||||
style={{
|
||||
display: "flex",
|
||||
}}>
|
||||
{objects.map((element) => (
|
||||
<RackItem
|
||||
key={element.key}
|
||||
item={element}
|
||||
render={render}
|
||||
onTryDetach={(ref, element) => {
|
||||
if (!canDetach(ref)) return
|
||||
|
||||
const index = objects.findIndex(o => o.key === element.key)
|
||||
onChange(objects.toSpliced(index, 1))
|
||||
const index = objects.findIndex(
|
||||
(o) => o.key === element.key,
|
||||
)
|
||||
onChange(objects.toSpliced(index, 1))
|
||||
|
||||
onElementDetached(ref, element)
|
||||
}}/>
|
||||
onElementDetached(ref, element)
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function RackItem<E extends {key: string | number}>({item, onTryDetach, render}: RackItemProps<E>) {
|
||||
const divRef = useRef<HTMLDivElement>(null);
|
||||
function RackItem<E extends { key: string | number }>({
|
||||
item,
|
||||
onTryDetach,
|
||||
render,
|
||||
}: RackItemProps<E>) {
|
||||
const divRef = useRef<HTMLDivElement>(null)
|
||||
|
||||
return (
|
||||
<Draggable
|
||||
position={{x: 0, y: 0}}
|
||||
position={{ x: 0, y: 0 }}
|
||||
nodeRef={divRef}
|
||||
onStop={() => onTryDetach(divRef.current!, item)}>
|
||||
<div ref={divRef}>
|
||||
{render(item)}
|
||||
</div>
|
||||
<div ref={divRef}>{render(item)}</div>
|
||||
</Draggable>
|
||||
)
|
||||
}
|
@ -1,28 +1,32 @@
|
||||
import React, {CSSProperties, useRef, useState} from "react";
|
||||
import "../style/title_input.css";
|
||||
import React, { CSSProperties, useRef, useState } from "react"
|
||||
import "../style/title_input.css"
|
||||
|
||||
export interface TitleInputOptions {
|
||||
style: CSSProperties,
|
||||
default_value: string,
|
||||
style: CSSProperties
|
||||
default_value: string
|
||||
on_validated: (a: string) => void
|
||||
}
|
||||
|
||||
export default function TitleInput({style, default_value, on_validated}: TitleInputOptions) {
|
||||
const [value, setValue] = useState(default_value);
|
||||
const ref = useRef<HTMLInputElement>(null);
|
||||
export default function TitleInput({
|
||||
style,
|
||||
default_value,
|
||||
on_validated,
|
||||
}: TitleInputOptions) {
|
||||
const [value, setValue] = useState(default_value)
|
||||
const ref = useRef<HTMLInputElement>(null)
|
||||
|
||||
return (
|
||||
<input className="title_input"
|
||||
ref={ref}
|
||||
style={style}
|
||||
type="text"
|
||||
value={value}
|
||||
onChange={event => setValue(event.target.value)}
|
||||
onBlur={_ => on_validated(value)}
|
||||
onKeyDown={event => {
|
||||
if (event.key == 'Enter')
|
||||
ref.current?.blur();
|
||||
}}
|
||||
<input
|
||||
className="title_input"
|
||||
ref={ref}
|
||||
style={style}
|
||||
type="text"
|
||||
value={value}
|
||||
onChange={(event) => setValue(event.target.value)}
|
||||
onBlur={(_) => on_validated(value)}
|
||||
onKeyDown={(event) => {
|
||||
if (event.key == "Enter") ref.current?.blur()
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
@ -1,55 +1,49 @@
|
||||
import {useRef} from "react";
|
||||
import "../../style/player.css";
|
||||
import RemoveIcon from "../../assets/icon/remove.svg?react";
|
||||
import Draggable from "react-draggable";
|
||||
import {PlayerPiece} from "./PlayerPiece";
|
||||
import {Player} from "../../data/Player";
|
||||
import { useRef } from "react"
|
||||
import "../../style/player.css"
|
||||
import RemoveIcon from "../../assets/icon/remove.svg?react"
|
||||
import Draggable from "react-draggable"
|
||||
import { PlayerPiece } from "./PlayerPiece"
|
||||
import { Player } from "../../data/Player"
|
||||
|
||||
export interface PlayerProps {
|
||||
player: Player,
|
||||
player: Player
|
||||
onRemove: () => void
|
||||
}
|
||||
|
||||
/**
|
||||
* A player that is placed on the court, which can be selected, and moved in the associated bounds
|
||||
* */
|
||||
export default function CourtPlayer({player, onRemove}: PlayerProps) {
|
||||
export default function CourtPlayer({ player, onRemove }: PlayerProps) {
|
||||
const ref = useRef<HTMLDivElement>(null)
|
||||
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
|
||||
const x = player.rightRatio;
|
||||
const y = player.bottomRatio;
|
||||
const x = player.rightRatio
|
||||
const y = player.bottomRatio
|
||||
|
||||
return (
|
||||
<Draggable
|
||||
handle={".player-piece"}
|
||||
nodeRef={ref}
|
||||
bounds="parent"
|
||||
>
|
||||
<div ref={ref}
|
||||
className={"player"}
|
||||
style={{
|
||||
position: "absolute",
|
||||
left: `${x * 100}%`,
|
||||
top: `${y * 100}%`,
|
||||
}}>
|
||||
|
||||
<div tabIndex={0}
|
||||
className="player-content"
|
||||
onKeyUp={e => {
|
||||
if (e.key == "Delete")
|
||||
onRemove()
|
||||
}}>
|
||||
<Draggable handle={".player-piece"} nodeRef={ref} bounds="parent">
|
||||
<div
|
||||
ref={ref}
|
||||
className={"player"}
|
||||
style={{
|
||||
position: "absolute",
|
||||
left: `${x * 100}%`,
|
||||
top: `${y * 100}%`,
|
||||
}}>
|
||||
<div
|
||||
tabIndex={0}
|
||||
className="player-content"
|
||||
onKeyUp={(e) => {
|
||||
if (e.key == "Delete") onRemove()
|
||||
}}>
|
||||
<div className="player-selection-tab">
|
||||
<RemoveIcon
|
||||
className="player-selection-tab-remove"
|
||||
onClick={onRemove}/>
|
||||
onClick={onRemove}
|
||||
/>
|
||||
</div>
|
||||
<PlayerPiece team={player.team} text={player.role}/>
|
||||
<PlayerPiece team={player.team} text={player.role} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</Draggable>
|
||||
|
||||
)
|
||||
}
|
@ -1,4 +1,4 @@
|
||||
export enum Team {
|
||||
Allies = "allies",
|
||||
Opponents = "opponents"
|
||||
Opponents = "opponents",
|
||||
}
|
@ -1,19 +1,13 @@
|
||||
|
||||
interface DisplayResultsProps {
|
||||
results: readonly { name: string, description: string}[]
|
||||
results: readonly { name: string; description: string }[]
|
||||
}
|
||||
|
||||
export default function DisplayResults({results}: DisplayResultsProps) {
|
||||
const list = results
|
||||
.map(({name, description}) =>
|
||||
export default function DisplayResults({ results }: DisplayResultsProps) {
|
||||
const list = results.map(({ name, description }) => (
|
||||
<div>
|
||||
<p>username: {name}</p>
|
||||
<p>description: {description}</p>
|
||||
</div>
|
||||
)
|
||||
return (
|
||||
<div>
|
||||
{list}
|
||||
</div>
|
||||
)
|
||||
))
|
||||
return <div>{list}</div>
|
||||
}
|
||||
|
@ -0,0 +1,15 @@
|
||||
parameters:
|
||||
phpVersion: 70400
|
||||
level: 6
|
||||
paths:
|
||||
- src
|
||||
- public
|
||||
- sql
|
||||
ignoreErrors:
|
||||
-
|
||||
message: '#.*#'
|
||||
path: sql/database.php
|
||||
-
|
||||
message: '#.*#'
|
||||
path: src/react-display-file.php
|
||||
|
Loading…
Reference in new issue