Merge pull request 'Refactored some things in the frontend' (#175) from frontend/buttons into main
Reviewed-on: #175
This commit is contained in:
commit
d162a4005d
3 changed files with 80 additions and 37 deletions
|
@ -31,6 +31,12 @@
|
|||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.btn--full{
|
||||
padding: 12px 26px;
|
||||
margin: 0 auto;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.btn--large:hover,
|
||||
.btn--medium:hover {
|
||||
transition: all 0.3s ease-out;
|
||||
|
@ -38,3 +44,4 @@
|
|||
color: var(--secondary);
|
||||
transition: 250ms;
|
||||
}
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@ import { Link } from "react-router-dom";
|
|||
|
||||
const STYLES = ["btn--primary", "btn--outline"];
|
||||
|
||||
const SIZES = ["btn--medium", "btn--large"];
|
||||
const SIZES = ["btn--medium", "btn--large", "btn--full"];
|
||||
export const Button = ({
|
||||
children,
|
||||
type,
|
||||
|
|
|
@ -6,6 +6,7 @@ import SubmitField from "../SubmitField";
|
|||
import { Logger } from "@behametrics/logger-web";
|
||||
import BehaviorStudyInfo from "../BehaviorStudyInfo";
|
||||
import BehaviorNormal from "../BehaviorNormal";
|
||||
import { Button } from "../Button";
|
||||
|
||||
export default function Study() {
|
||||
let username = "";
|
||||
|
@ -18,6 +19,16 @@ export default function Study() {
|
|||
password = tmp_password;
|
||||
};
|
||||
|
||||
let isStepStart = true;
|
||||
const setIsStepStart = (tmp) => {
|
||||
isStepStart = tmp;
|
||||
};
|
||||
|
||||
let isStepNormal = false;
|
||||
const setIsStepNormal = (tmp) => {
|
||||
isStepNormal = tmp;
|
||||
};
|
||||
|
||||
let logger = new Logger({
|
||||
//inputs: ["cursor", "wheel", "keyboard", "touch"],
|
||||
inputs: ["keyboard"],
|
||||
|
@ -51,6 +62,13 @@ export default function Study() {
|
|||
return false;
|
||||
};
|
||||
|
||||
const handleIsStepStart = () => {
|
||||
setIsStepStart(false);
|
||||
console.log("isStepStar", isStepStart)
|
||||
setIsStepNormal(true);
|
||||
console.log("isStepStar", isStepNormal)
|
||||
};
|
||||
|
||||
const onSubmitClick = (e) => {
|
||||
e.preventDefault();
|
||||
let opts = {
|
||||
|
@ -75,47 +93,65 @@ export default function Study() {
|
|||
});
|
||||
};
|
||||
|
||||
/*
|
||||
useEffect(() => {
|
||||
if (isStepStart) {
|
||||
handleIsStepStart();
|
||||
console.log("useEffect; normal");
|
||||
} else if (isStepNormal) {
|
||||
console.log("useEffect; normal");
|
||||
}
|
||||
});
|
||||
*/
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="sitePage">
|
||||
<h1>Studie</h1>
|
||||
<button onClick={handleLoggerOn}>LOGGER StaRTEN</button>
|
||||
<BehaviorStudyInfo />{" "}
|
||||
<form id="behaviorNormal" action="#">
|
||||
<SubmitField
|
||||
LabelName="Starten mit der Studie"
|
||||
InputValue="next-situation"
|
||||
InputName="Weiter"
|
||||
onClick={handleLoggerOn}
|
||||
/>
|
||||
</form>{" "}
|
||||
<BehaviorNormal />
|
||||
<form id="behaviorNormal" action="#">
|
||||
<InputField
|
||||
LabelName="Benutzername"
|
||||
onChange={handleUsernameChange}
|
||||
InputType="text"
|
||||
InputName="Benutzername"
|
||||
InputPlaceHolder="Benutzername"
|
||||
onPaste={handleOnPasteEvent}
|
||||
/>
|
||||
<InputField
|
||||
LabelName="Passwort"
|
||||
onChange={handlePasswordChange}
|
||||
InputType="password"
|
||||
InputName="Passwort"
|
||||
InputPlaceHolder="Benutzername"
|
||||
onPaste={handleOnPasteEvent}
|
||||
/>
|
||||
<SubmitField
|
||||
LabelNa
|
||||
me="Weiter zur nächsten Situation"
|
||||
InputValue="next-situation"
|
||||
InputName="Weiter"
|
||||
onClick={onSubmitClick}
|
||||
/>
|
||||
</form>
|
||||
<button onClick={handleLoggerOff}>STOP THAT FUCKING LOGGER</button>
|
||||
{isStepStart ? (
|
||||
<>
|
||||
<BehaviorStudyInfo />
|
||||
<Button
|
||||
className="btns"
|
||||
buttonStyle="btn--primary"
|
||||
buttonSize="btn--full"
|
||||
onClick={handleIsStepStart}
|
||||
newTo="study"
|
||||
>
|
||||
Starten mit der Studie
|
||||
</Button>
|
||||
</>
|
||||
) : null}
|
||||
{isStepNormal ? (
|
||||
<>
|
||||
<BehaviorNormal />
|
||||
<form id="behaviorNormal">
|
||||
<InputField
|
||||
LabelName="Benutzername"
|
||||
onChange={handleUsernameChange}
|
||||
InputType="text"
|
||||
InputName="Benutzername"
|
||||
InputPlaceHolder="Benutzername"
|
||||
onPaste={handleOnPasteEvent}
|
||||
/>
|
||||
<InputField
|
||||
LabelName="Passwort"
|
||||
onChange={handlePasswordChange}
|
||||
InputType="password"
|
||||
InputName="Passwort"
|
||||
InputPlaceHolder="Benutzername"
|
||||
onPaste={handleOnPasteEvent}
|
||||
/>
|
||||
<SubmitField
|
||||
LabelName="Weiter zur nächsten Situation"
|
||||
InputValue="next-situation"
|
||||
InputName="Weiter"
|
||||
onClick={onSubmitClick}
|
||||
/>
|
||||
</form>
|
||||
</>
|
||||
) : null}
|
||||
</div>
|
||||
<Footer />
|
||||
</>
|
||||
|
|
Loading…
Reference in a new issue