Skip to content

Commit

Permalink
Merge pull request #394 from BIDMCDigitalPsychiatry/gyroscope-game
Browse files Browse the repository at this point in the history 
D-cog game changes
  • Loading branch information
@sarithapillai8
sarithapillai8 authored Sep 4, 2024
2 parents cef63d1 + 3fb65af commit 57e9ba0
Show file tree
Hide file tree
Showing 3 changed files with 59 additions and 16 deletions.
26 changes: 19 additions & 7 deletions D-cog/src/components/dcogs/Board.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,12 +96,15 @@ class Board extends React.Component<BoardProps, BoardState> {
resetState = () => {
let dogTempCount = this.state.successCompletion ? this.state.dogCount + 1 : (this.state.dogCount > 1 ? this.state.dogCount -1 : 1)
let boxCount = this.state.successCompletion ? this.state.boxCount + 2 : (this.state.dogCount > 1 ? this.state.boxCount - 2 : 4)
console.log(boxCount, (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(
navigator.userAgent
)) )
if (
(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(
navigator.userAgent
) && boxCount > 10) || !(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i).test(
) && boxCount >= 10) || !(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i).test(
navigator.userAgent
) && boxCount > 20
) && boxCount >= 20
) {
this.sendGameResult();
}
Expand Down Expand Up @@ -159,7 +162,8 @@ class Board extends React.Component<BoardProps, BoardState> {
};

// Each box click is handled here
handleClick = (e: any, i: number, type: number) => {
handleClick = (e: any, i: number) => {
console.log(i, this.state.randomPoints)
let success = this.state.randomPoints.indexOf(i) > -1 ? true : false;
const item = e.target
item.className = success
Expand Down Expand Up @@ -347,7 +351,11 @@ class Board extends React.Component<BoardProps, BoardState> {
// Render the game board
render() {
let boxes;
if (this.state.boxCount > 10) {
if ((/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(
navigator.userAgent
) && this.state.boxCount >= 10) || !(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i).test(
navigator.userAgent
) && this.state.boxCount >= 20) {
boxes = i18n.t("GAME_OVER") +" !!!" ;
} else if(this.state.boxCount >= 4){
const numbers = [
Expand All @@ -361,13 +369,19 @@ class Board extends React.Component<BoardProps, BoardState> {
"eightth",
"nineth",
"tenth",
'eleventh',
'twelth',
'thirteenth',
'fourteenth',
'fifteenth',
'sixteenth'
];
boxes = [];
let classn = "";
let dogBoxFlag = false;
let j = 0;

for (let i = 1; i <= this.state.boxCount; i++) {
for (let i = 1; i <= 16; i++) {
dogBoxFlag = false;
// Image to be loaded behind the box
if (this.state.randomPoints.includes(i)) {
Expand All @@ -391,15 +405,13 @@ class Board extends React.Component<BoardProps, BoardState> {
? true
: false;

const itemType = dogBoxFlag === true ? 1 : 2;
boxes.push(
<div>
<Box
index={i}
onClick={this.handleClick}
boxClass={classn}
img={img}
itemType={itemType}
enableTap={enableStatus}
animateStatus={this.state.animate}
boxSQClass={boxClass}
Expand Down
5 changes: 2 additions & 3 deletions D-cog/src/components/dcogs/Box.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,14 @@ interface BoxProps {
enableTap: boolean;
img: string;
index: number;
itemType: number;
onClick(e: any, index: number, type: number): void;
onClick(e: any, index: number): void;
}

export class Box extends React.Component<BoxProps> {
// To handle box click which inturn call parent function
onClick = (e: any): void => {
if (this.props.enableTap) {
this.props.onClick(e, this.props.index, this.props.itemType);
this.props.onClick(e, this.props.index);
}
};

Expand Down
44 changes: 38 additions & 6 deletions D-cog/src/components/dcogs/box.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,8 @@ nav a{color: rgba(53,159,254,1); padding: 10px; display: inline-block;}
min-height: 20px;
}
.box{
height: 50px;
height: 50px;
width: 50px;
z-index: 0;
position: absolute;
border: 2px solid #fff;
Expand Down Expand Up @@ -130,13 +131,38 @@ svg.svg-inline--fa.fa-arrow-left.fa-w-14 {
top: 85%;
}
.nineth{
margin-left: 73%;
top: 34%;
margin-left: 74%;
top: 48%;
}
.tenth{
margin-left: 77%;
top: 3%;
}
.eleventh{
margin-left: 83%;
top: 23%;
}
.twelth{
margin-left: 41%;
top: 13%;
}
.thirteenth{
margin-left: 17%;
top: 40%;
}
.fourteenth{
margin-left: 86%;
top: 59%;
}
.fifteenth{
margin-left: 6%;
top: 58%;
}
.sixteenth{
margin-left: 62%;
top: 43%;
}

.mt-30{
margin-top: 30px;
}
Expand Down Expand Up @@ -187,13 +213,19 @@ svg.svg-inline--fa.fa-arrow-left.fa-w-14 {
background-image: url("data:image/svg+xml,%0A%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 397.37 394.67'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='148.72 377.69 29.01 257.99 46.33 240.68 148.24 342.58 352.71 126.47 370.5 143.31 148.72 377.69'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position-y: -7px;
border: 2px solid #fff;
margin-top: -3%;
margin-left: -2px;

}
.red-box-square{
background-color:#d40c0c !important;
background-image: url("data:image/svg+xml,%0A%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 397.37 394.67'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='376.13 44.75 358.17 26.8 204.39 180.58 50.6 26.8 32.65 44.75 186.43 198.54 32.65 352.32 50.6 370.28 204.39 216.49 358.17 370.28 376.13 352.32 222.34 198.54 376.13 44.75'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
border: 2px solid #fff;
margin-top: -3%;
margin-left: -2px;
}
.dog {
background-image: url("data:image/svg+xml,%0A%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 397.37 394.67'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23a14529;%7D.cls-2%7Bfill:%23ffa152;%7D.cls-3%7Bfill:%23455a64;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M377.85,68.63c-4,36.4-19,60.14-65.68,51.43l15.82-57S346.19,67.83,377.85,68.63Z'/%3E%3Cpath class='cls-2' d='M371.85,94.82c3.06-7.56,4.94-16.42,6-26.19-7.51-.19-14.24-.61-20.17-1.12A74.09,74.09,0,0,0,371.85,94.82Z'/%3E%3Cpath class='cls-1' d='M289.22,247.47V345.6s21.36-3.17,25.32,23.74h-64.1V268.05S275.76,260.13,289.22,247.47Z'/%3E%3Cpath class='cls-1' d='M184,257.76c-16.62,25.32-35.61,50.64-61.73,59.35V344s26.12,2.37,27.7,24.53H117.49s-19-3.17-20.57-23.74V247.47Z'/%3E%3Cpath class='cls-2' d='M290,370.13S287.64,348,263.1,345.6V272.79s41.95-4.74,45.11-53V147a37,37,0,0,1,11.87-18.2c9.5-7.92,27.7-45.11,4.75-78.35S244.11,28.26,236.2,66.25c0,0-13.45,68.06-32.45,72s-68.05,7.91-103.66,1.58S50.23,111.36,57.35,81.29,96.13,52,93,40.93s-34-10.29-45.89,24.53c0,0-31.66,51.43,29.27,101.29,0,0-9.49,11.87-7.12,40.36s-15,62.52-26.11,73.59-1.58,57.77-1.58,57.77,2.37,32.45,25.32,33.24,29.28-1.58,29.28-1.58.79-21.37-27.7-25.33V318.69s40.36-18.2,54.61-38,34-30.86,53.81-21.36,35.61,15.83,35.61,15.83L233,353.51s.79,17.41,19.79,18.2Z'/%3E%3Cpath class='cls-1' d='M283.68,70.21C294,86,320.08,150.13,303.46,167.54s-59.35,3.17-56.18-37.19S265.48,49.63,283.68,70.21Z'/%3E%3Cpath class='cls-1' d='M210.08,135.89c7.13,25.32,17.41,72.81-9.49,78.34s-122.15-11.74-95.76-50.64c15-22.16,27.7-21.37,27.7-21.37S194.26,145.39,210.08,135.89Z'/%3E%3Cpath class='cls-3' d='M313,73c0,6.33-4.79,11.47-10.68,11.47S291.59,79.31,291.59,73s4.79-11.48,10.69-11.48S313,66.64,313,73Z'/%3E%3C/svg%3E");
Expand All @@ -208,12 +240,12 @@ svg.svg-inline--fa.fa-arrow-left.fa-w-14 {
top: 0;
}
.dog-cover{
width: 50px;
height: 50.5px;
width: 48px;
height: 48px;
background-color: #fff;
position: absolute;
top: -2px;
z-index: 2;
left: 0;
}
@-webkit-keyframes App-logo-spin {
0% {
Expand Down

0 comments on commit 57e9ba0

Please sign in to comment.