You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
`This time Alice waited patiently until it chose to speak again.
41
-
In a minute or two the Caterpillar took the hookah out of its mouth and yawned once or twice, and shook itself.
42
-
Then it got down off the mushroom, and crawled away in the grass, merely remarking as it went, “One side will make you grow taller, and the other side will make you grow shorter.”
43
-
“One side of what? The other side of what?” thought Alice to herself.
44
-
“Of the mushroom,” said the Caterpillar, just as if she had asked it aloud; and in another moment it was out of sight.
45
-
Alice remained looking thoughtfully at the mushroom for a minute, trying to make out which were the two sides of it; and as it was perfectly round, she found this a very difficult question.
46
-
However, at last she stretched her arms round it as far as they would go, and broke off a bit of the edge with each hand.
47
-
“And now which is which?” she said to herself, and nibbled a little of the right-hand bit to try the effect: the next moment she felt a violent blow underneath her chin: it had struck her foot!
48
-
She was a good deal frightened by this very sudden change, but she felt that there was no time to be lost, as she was shrinking rapidly; so she set to work at once to eat some of the other bit.
49
-
Her chin was pressed so closely against her foot, that there was hardly room to open her mouth; but she did it at last, and managed to swallow a morsel of the lefthand bit.`,
50
-
// textTask3.html
51
-
`As soon as she had made out the proper way of nursing it, (which was to twist it up into a sort of knot, and then keep tight hold of its right ear and left foot, so as to prevent its undoing itself,) she carried it out into the open air. “If I don’t take this child away with me,” thought Alice, “they’re sure to kill it in a day or two: wouldn’t it be murder to leave it behind?” She said the last words out loud, and the little thing grunted in reply (it had left off sneezing by this time). “Don’t grunt,” said Alice; “that’s not at all a proper way of expressing yourself.”
52
-
53
-
The baby grunted again, and Alice looked very anxiously into its face to see what was the matter with it. There could be no doubt that it had a very turn-up nose, much more like a snout than a real nose; also its eyes were getting extremely small for a baby: altogether Alice did not like the look of the thing at all. “But perhaps it was only sobbing,” she thought, and looked into its eyes again, to see if there were any tears.
54
-
55
-
No, there were no tears. “If you’re going to turn into a pig, my dear,” said Alice, seriously, “I’ll have nothing more to do with you. Mind now!” The poor little thing sobbed again (or grunted, it was impossible to say which), and they went on for some while in silence.
56
-
57
-
Alice was just beginning to think to herself, “Now, what am I to do with this creature when I get it home?” when it grunted again, so violently, that she looked down into its face in some alarm. This time there could be no mistake about it: it was neither more nor less than a pig, and she felt that it would be quite absurd for her to carry it further.
58
-
59
-
So she set the little creature down, and felt quite relieved to see it trot away quietly into the wood. “If it had grown up,” she said to herself, “it would have made a dreadfully ugly child: but it makes rather a handsome pig, I think.” And she began thinking over other children she knew, who might do very well as pigs, and was just saying to herself, “if one only knew the right way to change them—” when she was a little startled by seeing the Cheshire Cat sitting on a bough of a tree a few yards off.`
37
+
And the mome raths outgrabe.`
60
38
];
61
39
62
40
functionpickRandomText(){
@@ -65,9 +43,20 @@ function pickRandomText() {
65
43
66
44
constTextTask=()=>{
67
45
const[text]=useState(()=>pickRandomText());
46
+
const[showCross,setShowCross]=useState(true);
68
47
constformattedTextRef=useRef(null);
69
48
70
49
useEffect(()=>{
50
+
consttimer=setTimeout(()=>{
51
+
setShowCross(false);
52
+
},10000);// Hide tracking cross after 10 seconds
53
+
54
+
return()=>clearTimeout(timer);
55
+
},[]);
56
+
57
+
useEffect(()=>{
58
+
if(showCross)return;
59
+
71
60
letsentenceCount=1;
72
61
letwordCount=1;
73
62
letcharacter_id=0;
@@ -107,49 +96,87 @@ const TextTask = () => {
107
96
sentenceCount++;
108
97
}
109
98
});
110
-
},[text]);
99
+
},[text,showCross]);
111
100
112
101
return(
113
-
<divclassName="textTask"style={{
114
-
textAlign: 'center',
115
-
fontFamily: 'Arial, sans-serif',
116
-
height: '100%',
117
-
display: 'flex',
118
-
flexDirection: 'column',
119
-
justifyContent: 'center',
120
-
alignItems: 'center'
121
-
}}>
122
-
<h3style={{margin: '2em 25% 0'}}>
123
-
Please read the following text carefully:
124
-
</h3>
125
-
<div
126
-
ref={formattedTextRef}
127
-
className="formatted-text"
128
-
style={{
129
-
display: 'flex',
130
-
flexWrap: 'wrap',
131
-
justifyContent: 'flex-start',
132
-
textAlign: 'left',
133
-
margin: '40px auto',
134
-
maxWidth: '33%',
135
-
width: '100%',
136
-
lineHeight: 2
137
-
}}
138
-
/>
102
+
<div
103
+
className="textTask"
104
+
style={{
105
+
textAlign: 'center',
106
+
fontFamily: 'Arial, sans-serif',
107
+
height: '100vh',
108
+
width: '100vw',
109
+
display: 'flex',
110
+
flexDirection: 'column',
111
+
justifyContent: 'center',
112
+
alignItems: 'center',
113
+
position: 'relative',
114
+
backgroundColor: '#fff',
115
+
}}
116
+
>
117
+
{showCross ? (
118
+
console.log("Fixation cross is rendering...")||(
119
+
<divstyle={styles.crossContainer}>
120
+
<divstyle={styles.cross}>+</div>
121
+
</div>
122
+
)
123
+
) : (
124
+
<>
125
+
<h3style={{margin: '2em 25% 0'}}>
126
+
Please read the following text carefully:
127
+
</h3>
128
+
<div
129
+
ref={formattedTextRef}
130
+
className="formatted-text"
131
+
style={{
132
+
display: 'flex',
133
+
flexWrap: 'wrap',
134
+
justifyContent: 'flex-start',
135
+
textAlign: 'left',
136
+
margin: '40px auto',
137
+
maxWidth: '33%',
138
+
width: '100%',
139
+
lineHeight: 2,
140
+
}}
141
+
/>
142
+
</>
143
+
)}
144
+
139
145
<style>{`
140
146
.word-block {
141
147
display: inline-flex;
142
148
flex-wrap: nowrap;
143
149
}
144
150
.letter {
145
-
font-size: 1.35em;
151
+
font-size: 24px;
146
152
}
147
153
.space {
148
-
width: 0.25vw;
154
+
width: 4px;
149
155
}
150
156
`}</style>
151
157
</div>
152
158
);
153
159
};
154
160
155
-
exportdefaultTextTask;
161
+
conststyles={
162
+
crossContainer: {
163
+
position: 'absolute',
164
+
top: 0,
165
+
left: 0,
166
+
height: '100vh',
167
+
width: '100vw',
168
+
display: 'flex',
169
+
justifyContent: 'center',
170
+
alignItems: 'center',
171
+
zIndex: 9999,
172
+
backgroundColor: '#fff',
173
+
border: '3px dashed red',// Temporary debug border — remove later
0 commit comments