Compare commits
No commits in common. "060f20d25c0d7ee3b137c4115f15132ca7c041d3" and "d162a4005df2504206d245bbe96a29f91cb3dfd4" have entirely different histories.
060f20d25c
...
d162a4005d
3 changed files with 79 additions and 184 deletions
|
|
@ -1,17 +0,0 @@
|
|||
import React from "react";
|
||||
import "../App.css";
|
||||
import GeneratedPassword from "./GeneratedPassword";
|
||||
|
||||
export default function BehaviorPhone() {
|
||||
return (
|
||||
<>
|
||||
<p>
|
||||
Im nächsten Schritt geht es darum, dass Sie während der Passworteingabe
|
||||
telefonieren. Nehmen Sie hierzu Ihr Smartphone oder Telefon und stellen
|
||||
Sie sich vor, dass Sie gerade am Telefonieren sind. Verwenden Sie bitte
|
||||
kein Headset oder Ähnliches.
|
||||
</p>
|
||||
<GeneratedPassword />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
import React from "react";
|
||||
import "../App.css";
|
||||
import GeneratedPassword from "./GeneratedPassword"
|
||||
|
||||
export default function BehaviorStanding() {
|
||||
return (
|
||||
<>
|
||||
<p>
|
||||
In dieser Situation geht es darum, dass Sie das Passwort im Stehen eingeben. Stehen Sie also vor den Computer und geben Sie den Benutzernamen und das Passwort wie gewohnt ein.
|
||||
</p>
|
||||
<GeneratedPassword />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useEffect, useRef, useState } from "react";
|
||||
import React, { useEffect } from "react";
|
||||
import "../../App.css";
|
||||
import Footer from "../../Footer";
|
||||
import InputField from "../InputField";
|
||||
|
|
@ -7,23 +7,8 @@ import { Logger } from "@behametrics/logger-web";
|
|||
import BehaviorStudyInfo from "../BehaviorStudyInfo";
|
||||
import BehaviorNormal from "../BehaviorNormal";
|
||||
import { Button } from "../Button";
|
||||
import BehaviorPhone from "../BehaviorPhone";
|
||||
import BehaviorStanding from "../BehaviorStanding";
|
||||
|
||||
export default function Study() {
|
||||
const _logger = useRef(0);
|
||||
|
||||
useEffect(() => {
|
||||
_logger.current = new Logger({
|
||||
//inputs: ["cursor", "wheel", "keyboard", "touch"],
|
||||
inputs: ["keyboard"],
|
||||
// apiUrl: "https://behavior.marcocamenzind.ch",
|
||||
apiUrl: "http://localhost:5000",
|
||||
logToConsole: true,
|
||||
});
|
||||
_logger.current.init();
|
||||
}, []);
|
||||
|
||||
let username = "";
|
||||
const setUsername = (tmp_username) => {
|
||||
username = tmp_username;
|
||||
|
|
@ -34,19 +19,33 @@ export default function Study() {
|
|||
password = tmp_password;
|
||||
};
|
||||
|
||||
const [isStepStart, setIsStepStart] = useState(true);
|
||||
const [isStepNormal, setIsStepNormal] = useState(false);
|
||||
const [isStepPhone, setIsStepPhone] = useState(false);
|
||||
const [isStepStanding, setIsStepStanding] = useState(false);
|
||||
const [isStepEnd, setIsStepEnd] = useState(false);
|
||||
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"],
|
||||
// apiUrl: "https://behavior.marcocamenzind.ch",
|
||||
apiUrl: "http://localhost:5000",
|
||||
logToConsole: true,
|
||||
});
|
||||
|
||||
logger.init();
|
||||
|
||||
const handleLoggerOff = () => {
|
||||
_logger.current.stop();
|
||||
logger.stop();
|
||||
console.log("Logger ausgeschaltet");
|
||||
};
|
||||
|
||||
const handleLoggerOn = () => {
|
||||
_logger.current.start();
|
||||
logger.start();
|
||||
console.log("start logging ");
|
||||
};
|
||||
|
||||
|
|
@ -63,27 +62,11 @@ export default function Study() {
|
|||
return false;
|
||||
};
|
||||
|
||||
const handleClickAtStepStart = () => {
|
||||
const handleIsStepStart = () => {
|
||||
setIsStepStart(false);
|
||||
console.log("isStepStar", isStepStart)
|
||||
setIsStepNormal(true);
|
||||
handleLoggerOn();
|
||||
// forceUpdate();
|
||||
};
|
||||
|
||||
const handleClickAtStepNormal = () => {
|
||||
setIsStepNormal(false);
|
||||
setIsStepPhone(true);
|
||||
};
|
||||
|
||||
const handleClickAtStepPhone = () => {
|
||||
setIsStepPhone(false);
|
||||
setIsStepStanding(true);
|
||||
};
|
||||
|
||||
const handleClickAtStepStanding = () => {
|
||||
setIsStepStanding(false);
|
||||
setIsStepEnd(true);
|
||||
handleLoggerOff();
|
||||
console.log("isStepStar", isStepNormal)
|
||||
};
|
||||
|
||||
const onSubmitClick = (e) => {
|
||||
|
|
@ -110,22 +93,37 @@ export default function Study() {
|
|||
});
|
||||
};
|
||||
|
||||
const study_start = (
|
||||
/*
|
||||
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>
|
||||
{isStepStart ? (
|
||||
<>
|
||||
<BehaviorStudyInfo />
|
||||
<Button
|
||||
className="btns"
|
||||
buttonStyle="btn--primary"
|
||||
buttonSize="btn--full"
|
||||
onClick={handleClickAtStepStart}
|
||||
onClick={handleIsStepStart}
|
||||
newTo="study"
|
||||
>
|
||||
Starten mit der Studie
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
|
||||
const study_normal = (
|
||||
) : null}
|
||||
{isStepNormal ? (
|
||||
<>
|
||||
<BehaviorNormal />
|
||||
<form id="behaviorNormal">
|
||||
|
|
@ -149,83 +147,11 @@ export default function Study() {
|
|||
LabelName="Weiter zur nächsten Situation"
|
||||
InputValue="next-situation"
|
||||
InputName="Weiter"
|
||||
onClick={handleClickAtStepNormal}
|
||||
onClick={onSubmitClick}
|
||||
/>
|
||||
</form>
|
||||
</>
|
||||
);
|
||||
|
||||
const study_phone = (
|
||||
<>
|
||||
<BehaviorPhone />
|
||||
<form id="behaviorPhone">
|
||||
<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={handleClickAtStepPhone}
|
||||
/>
|
||||
</form>
|
||||
</>
|
||||
);
|
||||
|
||||
const study_standing = (
|
||||
<>
|
||||
<BehaviorStanding />
|
||||
<form id="behaviorPhone">
|
||||
<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="Studie beenden"
|
||||
InputValue="stopStudy"
|
||||
InputName="quit"
|
||||
onClick={handleClickAtStepStanding}
|
||||
/>
|
||||
</form>
|
||||
</>
|
||||
);
|
||||
|
||||
const study_end = <p>Merci :-)</p>;
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="sitePage">
|
||||
<h1>Studie</h1>
|
||||
{isStepStart ? study_start : null}
|
||||
{isStepNormal ? study_normal : null}
|
||||
{isStepPhone ? study_phone : null}
|
||||
{isStepStanding ? study_standing : null}
|
||||
{isStepEnd ? study_end : null}
|
||||
) : null}
|
||||
</div>
|
||||
<Footer />
|
||||
</>
|
||||
|
|
|
|||
Loading…
Reference in a new issue