Deepak fiji

app/components/__tests__/TapWrong-test.js

@@ -18,7 +18,9 @@ it('renders correctly', () => {
         width: window.width,
         height: window.height
       }}
-
+      onScore={()=>{}}
+      setProgress={()=>{}}
+       onEnd={()=>{}}     
 
       />
 

app/components/games/TapWrongGridComponent.js

@@ -14,42 +14,42 @@ export default class TapWrongGridComponent extends Component {
 
     _initBoard = (props) => {
 
-        let arr4 = [];
+        let arr2 = [];
         let num = 0;
         let statuses = [];
        let numOFWrongElem=0;
-       let arr3 = this.props.data.word.map(function (element, i) {
+       let arr1 = this.props.data.word.map(function (element, i) {
 
             return element;
         });
 
        var randNum = 0;
         var temp = 0;
         var temp1 = 0;
-  let lenOfArr3=arr3.length;
+  let lenOfArr1=arr1.length;
         // Randomizing array
 
         for (let w = 0; w <  this.props.data.others.length; w++) {
-            randNum = Math.floor(Math.random() * (arr3.length+ this.props.data.others.length-1)) + 0;
+            randNum = Math.floor(Math.random() * (arr1.length)) + 0;
             console.log("random num", randNum);
-            temp = arr3[randNum];
-            arr3[randNum] =  this.props.data.others[w];
-            for (let q = randNum; q < (lenOfArr3 +( this.props.data.others.length-1)); q++) {
-                temp1 = arr3[q + 1];
-                arr3[q + 1] = temp;
+            temp = arr1[randNum];
+            arr1[randNum] =  this.props.data.others[w];
+            for (let q = randNum; q < (lenOfArr1 +( this.props.data.others.length-1)); q++) {
+                temp1 = arr1[q + 1];
+                arr1[q + 1] = temp;
                 temp = temp1;
-                console.log("arr3[q],arr2[w]", arr3[q], this.props.data.others[w]);
+                console.log("arr1[q],arr2[w]", arr1[q], this.props.data.others[w]);
 
             }
         }
 
-        for (let l = 0; l < arr3.length; l++) {
+        for (let l = 0; l < arr1.length; l++) {
             statuses[l] = 'neutral';
         }
         return ({
-            arr3,
+            arr1,
             statuses,
-            arr4,
+            arr2,
             num,
             numOFWrongElem
         })
@@ -63,12 +63,12 @@ export default class TapWrongGridComponent extends Component {
 
 
     onButtonPress = (id, view) => {
-
+      //  this.refs.view1.wobble(1000);
      let j = 0;
      let proArray = [];
 
-        for (let i = 0; i < this.state.arr3.length; i++) {
-        proArray[i] = this.state.arr3[i];
+        for (let i = 0; i < this.state.arr1.length; i++) {
+        proArray[i] = this.state.arr1[i];
         }
 
         proArray=proArray.filter((val,index) => index!=id)
@@ -87,11 +87,14 @@ export default class TapWrongGridComponent extends Component {
             this.state.num++;
             this.state.numOFWrongElem++;
 
-       this.setState( {...this.state,arr3:this.state.arr3.filter((val,index)=> index!=id)})
+       this.setState( {...this.state,arr1:this.state.arr1.filter((val,index)=> index!=id)})
             this.props.onScore(2);
             this.props.setProgress(this.state.num /  this.props.data.others.length);
             if (this.state.numOFWrongElem ==  this.props.data.others.length) {
-               setTimeout( () => { this.props.onEnd();},100)
+
+               this.setState({statuses: this.state.statuses.map(()=>'selected')})
+               this.refs.view1.zoomIn(1000);
+               setTimeout( () => { this.props.onEnd();},1500)
             }
 
         } else {
@@ -102,27 +105,32 @@ export default class TapWrongGridComponent extends Component {
     render() {
 
         return (
+            <Animatable.View 
+            ref='view1' >
             <TileGrid
                 delegateTouch={this.props.delegateTouch}
                 reverse={this.props.reverse}
                 numRows={SIZE}
-                numCols={this.state.arr3.length}
+                numCols={this.state.arr1.length}
                 statuses={this.state.statuses}
-                data={this.state.arr3}
-                tileColor='#24B2EA'
-                edgeColor='deepskyblue'
-                pressedTileColor='goldenrod'
-                pressedEdgeColor='darkgoldenrod'
-                textColor='#FFFFFF'
+                data={this.state.arr1}
                 onStatusChange={this._onStatusChange}
                 statusStyles = {{
                     neutral: {
                       View: {
-                        backgroundColor: '#24B2EA'
+                        backgroundColor: '#ed2d85'
                       },
                       Text: {
-                        color: '#FFFFFF'
+                        color: 'black'
                       }
+                    },
+                    selected: {
+                        View: {
+                            backgroundColor:'#ffffff'
+                          },
+                          Text: {
+                            color: 'black'
+                          }
                     }
                   }}
                 style={{
@@ -131,6 +139,8 @@ export default class TapWrongGridComponent extends Component {
                 }}
                 onPress={this.onButtonPress}
             />
+
+            </Animatable.View>
         );
 
     }