Ui tweaked

config.xml

@@ -14,6 +14,12 @@
   <allow-intent href="geo:*"/>
   <platform name="android">
     <allow-intent href="market:*"/>
+    <icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
+    <icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
+    <icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
+    <icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
+    <icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
+    <icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
   </platform>
   <platform name="ios">
     <allow-intent href="itms:*"/>
@@ -36,4 +42,5 @@
   <plugin name="cordova-plugin-statusbar" spec="2.2.1"/>
   <plugin name="cordova-plugin-device" spec="1.1.4"/>
   <plugin name="cordova-plugin-splashscreen" spec="~4.0.1"/>
+  <icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
 </widget>

src/pages/home/home.html

@@ -14,20 +14,20 @@ <h3 text-center>Obtained : {{totalNumber}}</h3>
   </ion-row>
   <ion-row>
     <ion-col>
-      <h3>Score : {{totalScore}}</h3>
+      <h3 text-center>Score : {{totalScore}}</h3>
     </ion-col>
     <ion-col>
-      <h3>Time : {{time}}</h3>
+      <h3 text-center>Time : {{time}}</h3>
     </ion-col>
     <ion-col>
-      <h3>Best : {{best}}</h3>
+      <h3 text-center>Best : {{best}}</h3>
     </ion-col>
   </ion-row>
   <ion-row>
     <ion-grid>
       <ion-row >
       <ion-col col-3 *ngFor="let i of secretNumbers">
-        <button ion-button color="dark" (click)="onNumberClick(i)">{{i}}</button>
+        <button class="center" ion-button (click)="onNumberClick(i)">{{i}}</button>
       </ion-col>
     </ion-row>  
     </ion-grid>

src/pages/home/home.scss

@@ -1,9 +1,24 @@
 .ios, .md {
     page-home {
+        ion-content {
+            background-color : #555;
+            color : #aaa;
+        }
         button {
-            width: 70px;
-            height: 70px;
+            width: 80px;
+            height: 80px;
+            padding : 0px;
+            margin : 0px;
+            font-size : 35px;
+            border-radius :50%;
+            opacity : 0.4;
+            background-color : black;
+            border : 4px solid lightblue;
+        }
+        .center {
+            margin-left : auto;
+            margin-right : auto;
+            display : block;
         }
-
     }
 }

src/pages/home/home.ts

@@ -13,18 +13,18 @@ export class HomePage {
   totalNumber : number= 0;
   totalScore : number = 0;
   best : number = 0;
-  time : number =0;
+  time : number = 0;
 
   constructor(public navCtrl: NavController) {
     this.generateNumbers();
     this.numberToGet = Math.floor(Math.random()*100) + 1;
-    setInterval(()=>{
-      return this.time += 1;
-    }, 1000);
+    // setInterval(()=>{
+    //   return this.time += 1;
+    // }, 1000);
   }
 
   generateNumbers() {
-    for(let i=0;i<30;i++){
+    for(let i=0;i<20;i++){
       this.secretNumbers.push(Math.floor(Math.random() * 50) + 1);
     }
     console.log(this.secretNumbers);
@@ -41,17 +41,19 @@ export class HomePage {
       alert("You Lose");
       this.resetScoreBoard();
       this.totalScore -= 1;
+      this.best = 0;
     }
   }
   resetScoreBoard() {
-      let temp = this.time;
-      this.best = Math.min(temp, this.best);  
+      let temp  = this.time;
+      this.best = Math.min(temp,(this.best === 0 ? 1000 : this.best)); 
+      console.log(this.best, temp); 
       this.numberToGet = Math.floor(Math.random()*100) + 1;
       // this.totalScore += 1;
       this.totalNumber = 0;
       this.secretNumbers = [];
       this.generateNumbers();
-      this.best = 0;
+      // this.best = 0;
       this.time = 0;
   }
-}
+}

www/build/main.css

@@ -24498,7 +24498,25 @@ ion-navbar.toolbar {
   }
 }
 
+.ios page-home ion-content, .md page-home ion-content {
+  background-color: #555;
+  color: #aaa;
+}
+
 .ios page-home button, .md page-home button {
-  width: 70px;
-  height: 70px;
+  width: 80px;
+  height: 80px;
+  padding: 0px;
+  margin: 0px;
+  font-size: 35px;
+  border-radius: 50%;
+  opacity: 0.4;
+  background-color: black;
+  border: 4px solid lightblue;
+}
+
+.ios page-home .center, .md page-home .center {
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
 }

www/build/main.js

@@ -84605,7 +84605,6 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 
 var HomePage = (function () {
     function HomePage(navCtrl) {
-        var _this = this;
         this.navCtrl = navCtrl;
         this.secretNumbers = [];
         this.numberToGet = null;
@@ -84615,12 +84614,12 @@ var HomePage = (function () {
         this.time = 0;
         this.generateNumbers();
         this.numberToGet = Math.floor(Math.random() * 100) + 1;
-        setInterval(function () {
-            return _this.time += 1;
-        }, 1000);
+        // setInterval(()=>{
+        //   return this.time += 1;
+        // }, 1000);
     }
     HomePage.prototype.generateNumbers = function () {
-        for (var i = 0; i < 30; i++) {
+        for (var i = 0; i < 20; i++) {
             this.secretNumbers.push(Math.floor(Math.random() * 50) + 1);
         }
         console.log(this.secretNumbers);
@@ -84637,22 +84636,24 @@ var HomePage = (function () {
             alert("You Lose");
             this.resetScoreBoard();
             this.totalScore -= 1;
+            this.best = 0;
         }
     };
     HomePage.prototype.resetScoreBoard = function () {
         var temp = this.time;
-        this.best = Math.min(temp, this.best);
+        this.best = Math.min(temp, (this.best === 0 ? 1000 : this.best));
+        console.log(this.best, temp);
         this.numberToGet = Math.floor(Math.random() * 100) + 1;
         // this.totalScore += 1;
         this.totalNumber = 0;
         this.secretNumbers = [];
         this.generateNumbers();
-        this.best = 0;
+        // this.best = 0;
         this.time = 0;
     };
     HomePage = __decorate([
         __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__angular_core__["B" /* Component */])({
-            selector: 'page-home',template:/*ion-inline-start:"/home/hawkscode/th3g3ntl3m3n/Brain-Sum/src/pages/home/home.html"*/'<ion-content fullscreen>\n  <ion-row>\n    <ion-col>\n      <h1 text-center>Brain-Sum</h1>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-col>\n      <h3 text-center>Target : {{numberToGet}}</h3>\n    </ion-col>\n    <ion-col>\n      <h3 text-center>Obtained : {{totalNumber}}</h3>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-col>\n      <h3>Score : {{totalScore}}</h3>\n    </ion-col>\n    <ion-col>\n      <h3>Time : {{time}}</h3>\n    </ion-col>\n    <ion-col>\n      <h3>Best : {{best}}</h3>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-grid>\n      <ion-row >\n      <ion-col col-3 *ngFor="let i of secretNumbers">\n        <button ion-button color="dark" (click)="onNumberClick(i)">{{i}}</button>\n      </ion-col>\n    </ion-row>  \n    </ion-grid>\n  </ion-row>\n</ion-content>\n'/*ion-inline-end:"/home/hawkscode/th3g3ntl3m3n/Brain-Sum/src/pages/home/home.html"*/
+            selector: 'page-home',template:/*ion-inline-start:"/home/hawkscode/.th3g3ntl3m3n/Brain-Sum/src/pages/home/home.html"*/'<ion-content fullscreen>\n  <ion-row>\n    <ion-col>\n      <h1 text-center>Brain-Sum</h1>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-col>\n      <h3 text-center>Target : {{numberToGet}}</h3>\n    </ion-col>\n    <ion-col>\n      <h3 text-center>Obtained : {{totalNumber}}</h3>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-col>\n      <h3 text-center>Score : {{totalScore}}</h3>\n    </ion-col>\n    <ion-col>\n      <h3 text-center>Time : {{time}}</h3>\n    </ion-col>\n    <ion-col>\n      <h3 text-center>Best : {{best}}</h3>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-grid>\n      <ion-row >\n      <ion-col col-3 *ngFor="let i of secretNumbers">\n        <button class="center" ion-button (click)="onNumberClick(i)">{{i}}</button>\n      </ion-col>\n    </ion-row>  \n    </ion-grid>\n  </ion-row>\n</ion-content>\n'/*ion-inline-end:"/home/hawkscode/.th3g3ntl3m3n/Brain-Sum/src/pages/home/home.html"*/
         }), 
         __metadata('design:paramtypes', [__WEBPACK_IMPORTED_MODULE_1_ionic_angular__["d" /* NavController */]])
     ], HomePage);
@@ -139347,7 +139348,7 @@ var MyApp = (function () {
         });
     }
     MyApp = __decorate([
-        __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__angular_core__["B" /* Component */])({template:/*ion-inline-start:"/home/hawkscode/th3g3ntl3m3n/Brain-Sum/src/app/app.html"*/'<ion-nav [root]="rootPage"></ion-nav>\n'/*ion-inline-end:"/home/hawkscode/th3g3ntl3m3n/Brain-Sum/src/app/app.html"*/
+        __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_0__angular_core__["B" /* Component */])({template:/*ion-inline-start:"/home/hawkscode/.th3g3ntl3m3n/Brain-Sum/src/app/app.html"*/'<ion-nav [root]="rootPage"></ion-nav>\n'/*ion-inline-end:"/home/hawkscode/.th3g3ntl3m3n/Brain-Sum/src/app/app.html"*/
         }), 
         __metadata('design:paramtypes', [__WEBPACK_IMPORTED_MODULE_1_ionic_angular__["e" /* Platform */]])
     ], MyApp);